113 lines
3.6 KiB
JavaScript
113 lines
3.6 KiB
JavaScript
'use client'
|
|
|
|
import { useState } from 'react'
|
|
import { useMessage } from '@/hooks/useMessage'
|
|
import { setSession, login } from '@/lib/authActions'
|
|
import { sessionStore } from '@/store/commonAtom'
|
|
import { useRecoilState } from 'recoil'
|
|
import { useAxios } from '@/hooks/useAxios'
|
|
import { globalLocaleStore } from '@/store/localeAtom'
|
|
import { useRouter } from 'next/navigation'
|
|
|
|
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
|
|
|
|
export default function AutoLoginPage({ autoLoginParam }) {
|
|
const router = useRouter()
|
|
|
|
const [isLoading, setIsLoading] = useState(autoLoginParam === 'Y' ? false : true)
|
|
const [globalLocaleState, setGlbalLocaleState] = useRecoilState(globalLocaleStore)
|
|
|
|
const { promisePost } = useAxios(globalLocaleState)
|
|
const { getMessage } = useMessage()
|
|
|
|
const [userId, setUserId] = useState('')
|
|
const [sessionState, setSessionState] = useRecoilState(sessionStore)
|
|
|
|
const [idFocus, setIdFocus] = useState(false)
|
|
|
|
const loginProcess = async () => {
|
|
setIsLoading(true)
|
|
await promisePost({ url: '/api/login/v1.0/user', data: { loginId: userId } }).then((response) => {
|
|
setIsLoading(false)
|
|
if (response.data) {
|
|
const res = response.data
|
|
const result = { ...res, storeLvl: res.groupId === '60000' ? '1' : '2', pwdInitYn: 'Y' }
|
|
setSession(result)
|
|
setSessionState(result)
|
|
login()
|
|
} else {
|
|
alert(getMessage('login.fail'))
|
|
router.push('/login?autoLoginParam1=Y')
|
|
}
|
|
})
|
|
}
|
|
|
|
return (
|
|
<>
|
|
{isLoading && <GlobalSpinner />}
|
|
{autoLoginParam !== 'Y' ? (
|
|
<>
|
|
<div className="login-input-frame">
|
|
<div className="login-frame-tit ">
|
|
<span>{getMessage('site.name')}</span>
|
|
{getMessage('site.sub_name')}
|
|
</div>
|
|
<div className="login-input-wrap">
|
|
<div className="login-area id" style={{ fontWeight: 'bolder' }}>
|
|
{getMessage('login.auto.page.text')}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</>
|
|
) : (
|
|
<>
|
|
<div className="login-input-frame">
|
|
<form
|
|
onSubmit={(e) => {
|
|
e.preventDefault()
|
|
loginProcess()
|
|
}}
|
|
className="space-y-6"
|
|
>
|
|
<div className="login-frame-tit">
|
|
<span>{getMessage('site.name')}</span>
|
|
{getMessage('site.sub_name')}
|
|
</div>
|
|
<div className="login-input-wrap">
|
|
<div className={`login-area id ${idFocus ? 'focus' : ''}`}>
|
|
<input
|
|
type="text"
|
|
className="login-input"
|
|
id="userId"
|
|
name="id"
|
|
required
|
|
value={userId}
|
|
placeholder={getMessage('login.id.placeholder')}
|
|
onChange={(e) => {
|
|
setUserId(e.target.value)
|
|
}}
|
|
onFocus={() => setIdFocus(true)}
|
|
onBlur={() => setIdFocus(false)}
|
|
/>
|
|
<button
|
|
type="button"
|
|
className="id-delete"
|
|
onClick={(e) => {
|
|
setUserId('')
|
|
}}
|
|
></button>
|
|
</div>
|
|
<div className="login-btn-box">
|
|
<button type="submit" className="login-btn">
|
|
{getMessage('login')}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</>
|
|
)}
|
|
</>
|
|
)
|
|
}
|