diff options
Diffstat (limited to 'src/lib/auth/components/SwitchAccount.jsx')
| -rw-r--r-- | src/lib/auth/components/SwitchAccount.jsx | 114 |
1 files changed, 68 insertions, 46 deletions
diff --git a/src/lib/auth/components/SwitchAccount.jsx b/src/lib/auth/components/SwitchAccount.jsx index fa1d3924..d76d1f0e 100644 --- a/src/lib/auth/components/SwitchAccount.jsx +++ b/src/lib/auth/components/SwitchAccount.jsx @@ -14,7 +14,8 @@ import { registerUser } from '~/services/auth'; import { useMutation } from 'react-query'; import { isValid } from 'zod'; import useDevice from '@/core/hooks/useDevice'; -const SwitchAccount = () => { +import BottomPopup from '@/core/components/elements/Popup/BottomPopup'; +const SwitchAccount = ({ company_type }) => { const { isDesktop, isMobile } = useDevice(); const auth = useAuth(); const [isOpen, setIsOpen] = useState(true); @@ -25,6 +26,7 @@ const SwitchAccount = () => { const [selectedValueBisnis, setSelectedValueBisnis] = useState('false'); const [selectedValue, setSelectedValue] = useState('PKP'); const [buttonSubmitClick, setButtonSubmitClick] = useState(false); + const [changeConfirmation, setChangeConfirmation] = useState(false); const { register, setValue, handleSubmit } = useForm({ defaultValues: { email: '', @@ -74,7 +76,6 @@ const SwitchAccount = () => { const dataProfile = await addressApi({ id: auth.parentId ? auth.parentId : auth.parent_id, }); - console.log('dataProfile', dataProfile); if (dataProfile?.companyType === 'nonpkp') { setSelectedValue('PKP'); } @@ -120,6 +121,7 @@ const SwitchAccount = () => { } }; const onSubmitHandler = async (values) => { + setChangeConfirmation(false); // let data = { ...form, id: `${auth.partnerId}` }; const data = form; if (!isFormValid) { @@ -151,11 +153,32 @@ const SwitchAccount = () => { return ( <> - <button - type='button' - onClick={toggle} - className='p-4 flex items-center text-left w-full' + <BottomPopup + active={changeConfirmation} + close={() => setChangeConfirmation(false)} + title='Ubah profil Bisnis' > + <div className='leading-7 text-gray_r-12/80'> + Apakah anda yakin mengubah data bisnis? + </div> + <div className='flex mt-6 gap-x-4 md:justify-end'> + <button + className='btn-solid-red flex-1 md:flex-none' + type='button' + onClick={onSubmitHandler} + > + Ya, Ubah + </button> + <button + className='btn-light flex-1 md:flex-none' + type='button' + onClick={() => setChangeConfirmation(false)} + > + Batal + </button> + </div> + </BottomPopup> + <div type='button' className='p-4 flex items-center text-left w-full'> <div className={`flex ${ isDesktop ? 'flex-row' : 'flex-col gap-y-2' @@ -166,32 +189,25 @@ const SwitchAccount = () => { *Perubahan akun tidak dapat diubah kembali </div> </div> - <div className='ml-auto p-2 bg-gray_r-3 rounded'> - {!isOpen && <ChevronDownIcon className='w-6' />} - {isOpen && <ChevronUpIcon className='w-6' />} - </div> - </button> + </div> - {isOpen && ( - <div className='p-4'> - <div> - <p className='text-black font-bold mb-2'> - Bisnis Terdaftar di Indoteknik? - </p> - <RadioGroup - onChange={handleChangeBisnis} - value={selectedValueBisnis} - > - <Stack direction='row'> - <Radio colorScheme='red' value='true'> - Sudah Terdaftar - </Radio> - <Radio colorScheme='red' value='false' className='ml-2'> - Belum Terdaftar - </Radio> - </Stack> - </RadioGroup> - </div> + <div className='p-4 '> + <div> + <p className='text-black font-bold mb-2'> + Bisnis Terdaftar di Indoteknik? + </p> + <RadioGroup onChange={handleChangeBisnis} value={selectedValueBisnis}> + <Stack direction='row'> + <Radio colorScheme='red' value='true'> + Sudah Terdaftar + </Radio> + <Radio colorScheme='red' value='false' className='ml-2'> + Belum Terdaftar + </Radio> + </Stack> + </RadioGroup> + </div> + {!isTerdaftar && ( <div className='mt-4'> <p className='text-black font-bold mb-2'>Tipe Bisnis</p> <RadioGroup onChange={handleChange} value={selectedValue}> @@ -199,37 +215,43 @@ const SwitchAccount = () => { <Radio colorScheme='red' value='PKP'> PKP </Radio> - <Radio colorScheme='red' value='Non-PKP' className='ml-4'> - Non-PKP - </Radio> + {!(company_type === 'nonpkp') && ( + <Radio colorScheme='red' value='Non-PKP' className='ml-4'> + Non-PKP + </Radio> + )} </Stack> </RadioGroup> </div> - <FormBisnis - type={isDesktop ? 'profil' : 'bisnis'} - required={isTerdaftar} - isPKP={isPKP} - chekValid={notValid} - buttonSubmitClick={buttonSubmitClick} - /> - <div className='flex justify-end mb-4 mr-4'> + )} + <FormBisnis + type={isDesktop ? 'profil' : 'bisnis'} + required={isTerdaftar} + isPKP={isPKP} + chekValid={notValid} + buttonSubmitClick={buttonSubmitClick} + /> + <div className='flex flex-row justify-end mt-4 '> + <div> <button type='submit' - onClick={onSubmitHandler} - className='btn-yellow w-full sm:w-fit sm:ml-auto mt-6' + onClick={() => setChangeConfirmation(true)} + className='btn-yellow w-full sm:w-fit sm:ml-auto mt-6 mr-2' > {mutation.isLoading ? 'Loading...' : 'Simpan Perubahan'} </button> + </div> + <div> <button type='submit' onClick={onSubmitHandlerCancel} - className='btn-red w-full sm:w-fit sm:ml-auto mt-6' + className='btn-solid-red w-full sm:w-fit sm:ml-auto mt-6' > {mutation.isLoading ? 'Loading...' : 'Batal'} </button> </div> </div> - )} + </div> </> ); }; |
