From 689ee880bde0fae548e55316789e8bae852fe7d7 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 11 Sep 2024 11:40:32 +0700 Subject: update mobile view --- .../modules/register/components/FormBisnis.tsx | 79 ++++++++++++++-------- 1 file changed, 52 insertions(+), 27 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index 2080ae75..bc3e1405 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -292,7 +292,14 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { /> -
+
-
+
-
-
+
+
= ({ type, required, isPKP, chekValid }) => { )}
-
+
= ({ type, required, isPKP, chekValid }) => {
-
+
- ( - - )} - /> +
+ ( + + )} + /> +
{selectedCategory && ( Kategori : {selectedCategory} @@ -404,7 +415,9 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { name='alamat_bisnis' placeholder='Masukan alamat bisnis anda' value={!required ? form.alamat_bisnis : ''} - className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`} + className={`form-input mt-3 max-h-11 ${ + required ? 'cursor-no-drop' : '' + }`} disabled={required} contentEditable={required} readOnly={required} @@ -431,7 +444,9 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { name='nama_wajib_pajak' placeholder='Masukan nama lengkap anda' value={!required ? form.nama_wajib_pajak : ''} - className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`} + className={`form-input mt-3 max-h-11 ${ + required ? 'cursor-no-drop' : '' + }`} disabled={required} contentEditable={required} readOnly={required} @@ -483,7 +498,9 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { : form.alamat_wajib_pajak : '' } - className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`} + className={`form-input max-h-11 mt-3 ${ + required ? 'cursor-no-drop' : '' + }`} disabled={isChekBox || required} contentEditable={required} readOnly={required} @@ -510,7 +527,9 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { type='tel' id='npwp' name='npwp' - className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`} + className={`form-input max-h-11 mt-3 ${ + required ? 'cursor-no-drop' : '' + }`} disabled={required} contentEditable={required} readOnly={required} @@ -567,7 +586,9 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { type='tel' id='sppkp' name='sppkp' - className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`} + className={`form-input max-h-11 mt-3 ${ + required ? 'cursor-no-drop' : '' + }`} disabled={required} contentEditable={required} readOnly={required} @@ -594,7 +615,9 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { type='file' id='npwp_document' name='npwp_document' - className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`} + className={`form-input ${ + type === 'bisnis' ? '' : 'border-none' + } mt-3 ${required ? 'cursor-no-drop' : ''}`} disabled={required} contentEditable={required} readOnly={required} @@ -619,7 +642,9 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { type='file' id='sppkp_document' name='sppkp_document' - className={`form-input mt-3 ${required ? 'cursor-no-drop' : ''}`} + className={`form-input ${ + type === 'bisnis' ? '' : 'border-none' + } mt-3 ${required ? 'cursor-no-drop' : ''}`} disabled={required} contentEditable={required} readOnly={required} -- cgit v1.2.3 From 62ad06bf66519e0491355edd4171cff71992500d Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 11 Sep 2024 11:54:44 +0700 Subject: update mobile view --- src-migrate/modules/register/components/FormBisnis.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index bc3e1405..6631cb3b 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -296,7 +296,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { className={` ${ type === 'bisnis' ? 'mt-6 grid grid-cols-1 gap-y-4' - : 'mt-6 grid grid-rows-5 grid-flow-col gap-x-4 gap-y-2' + : 'mt-6 grid grid-cols-2 gap-x-4 gap-y-2' }`} onSubmit={handleSubmit} > @@ -380,7 +380,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { -
+
Date: Thu, 12 Sep 2024 15:12:42 +0700 Subject: update new register --- .../modules/register/components/FormBisnis.tsx | 66 +++++++++++++++++++++- 1 file changed, 63 insertions(+), 3 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index 6631cb3b..dd9cd72f 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -1,4 +1,4 @@ -import { ChangeEvent, useEffect, useMemo, useState } from 'react'; +import { ChangeEvent, useEffect, useMemo, useRef, useState } from 'react'; import { useMutation } from 'react-query'; import { useRegisterStore } from '../stores/useRegisterStore'; import { RegisterProps } from '~/types/auth'; @@ -56,6 +56,16 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { const router = useRouter(); const toast = useToast(); + const emailRef = useRef(null); + const businessNameRef = useRef(null); + const comppanyTypeRef = useRef(null); + const industryRef = useRef(null); + const addressRef = useRef(null); + const namaWajibPajakRef = useRef(null); + const alamatWajibPajakRef = useRef(null); + const npwpRef = useRef(null); + const sppkpRef = useRef(null); + useEffect(() => { const loadCompanyTypes = async () => { const dataCompanyTypes = await odooApi( @@ -227,6 +237,49 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { mutationFn: (data: RegisterProps) => registerUser(data), }); + useEffect(() => { + const loadIndustries = async () => { + const response = await mutation.mutateAsync(form); + if (!response?.register) { + // Logic to focus on first invalid input + if (errors.email_partner && emailRef.current) { + emailRef.current.focus(); + return; + } + if (errors.company_type_id && businessNameRef.current) { + businessNameRef.current.focus(); + return; + } + + if (errors.business_name && businessNameRef.current) { + businessNameRef.current.focus(); + return; + } + + if (errors.industry_id && industryRef.current) { + industryRef.current.scrollIntoView(); + return; + } + + if (errors.alamat_bisnis && addressRef.current) { + addressRef.current.focus(); + return; + } + + if (errors.npwp && npwpRef.current) { + npwpRef.current.focus(); + return; + } + + if (errors.sppkp && sppkpRef.current) { + sppkpRef.current.focus(); + return; + } + } + }; + loadIndustries(); + }, [chekValid, form, errors]); + const handleSubmit = async (e: ChangeEvent) => { e.preventDefault(); @@ -322,6 +375,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { readOnly={required} onChange={handleInputChange} autoComplete='username' + ref={emailRef} aria-invalid={ chekValid && !required && isPKP && !!errors.email_partner } @@ -337,7 +391,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { Nama Bisnis
-
+
= ({ type, required, isPKP, chekValid }) => { placeholder='Nama Perusahaan' autoCapitalize='true' value={form.business_name} + ref={businessNameRef} aria-invalid={chekValid && !!errors.business_name} onChange={handleInputChange} /> @@ -380,7 +435,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { -
+
= ({ type, required, isPKP, chekValid }) => { disabled={required} contentEditable={required} readOnly={required} + ref={addressRef} onChange={handleInputChange} aria-invalid={chekValid && !required && !!errors.alamat_bisnis} /> @@ -451,6 +507,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { contentEditable={required} readOnly={required} onChange={handleInputChange} + ref={namaWajibPajakRef} aria-invalid={ chekValid && isPKP && !required && !!errors.nama_wajib_pajak } @@ -505,6 +562,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { contentEditable={required} readOnly={required} onChange={handleInputChange} + ref={alamatWajibPajakRef} aria-invalid={ chekValid && isPKP && !required && !!errors.alamat_wajib_pajak } @@ -533,6 +591,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { disabled={required} contentEditable={required} readOnly={required} + ref={npwpRef} placeholder='000.000.000.0-000.000' value={!required ? formattedNpwp : ''} maxLength={21} // Set maximum length to 16 characters @@ -592,6 +651,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { disabled={required} contentEditable={required} readOnly={required} + ref={sppkpRef} placeholder='X-XXXPKP/WJPXXX/XX.XXXX/XXXX' onChange={handleInputChange} value={!required ? form.sppkp : ''} -- cgit v1.2.3 From aaf907c834343970e1d30b3ef49c13ed5f9d34ed Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Tue, 17 Sep 2024 09:01:04 +0700 Subject: add focus error when button submit click --- src-migrate/modules/register/components/Form.tsx | 43 +++++++++++++++++++++- .../modules/register/components/FormBisnis.tsx | 11 +++++- .../register/components/RegistrasiBisnis.tsx | 8 +++- .../register/components/RegistrasiIndividu.tsx | 7 +++- src-migrate/modules/register/index.tsx | 13 ++++++- 5 files changed, 74 insertions(+), 8 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/Form.tsx b/src-migrate/modules/register/components/Form.tsx index 118d9d69..b04e763c 100644 --- a/src-migrate/modules/register/components/Form.tsx +++ b/src-migrate/modules/register/components/Form.tsx @@ -1,4 +1,4 @@ -import { ChangeEvent, useMemo } from 'react'; +import { ChangeEvent, useMemo, useEffect, useRef, useState } from 'react'; import { useMutation } from 'react-query'; import { useRegisterStore } from '../stores/useRegisterStore'; import { RegisterProps } from '~/types/auth'; @@ -14,13 +14,15 @@ interface FormProps { required: boolean; isBisnisRegist: boolean; chekValid: boolean; + buttonSubmitClick: boolean; } const Form: React.FC = ({ type, required, isBisnisRegist = false, - chekValid = false, + chekValid, + buttonSubmitClick, }) => { const { form, isCheckedTNC, isValidCaptcha, errors, updateForm, validate } = useRegisterStore(); @@ -30,6 +32,11 @@ const Form: React.FC = ({ const router = useRouter(); const toast = useToast(); + const emailRef = useRef(null); + const nameRef = useRef(null); + const passwordRef = useRef(null); + const teleponRef = useRef(null); + const handleInputChange = (event: ChangeEvent) => { const { name, value } = event.target; updateForm(name, value); @@ -40,6 +47,34 @@ const Form: React.FC = ({ mutationFn: (data: RegisterProps) => registerUser(data), }); + useEffect(() => { + const loadIndustries = async () => { + const response = await mutation.mutateAsync(form); + if (!response?.register) { + // Logic to focus on first invalid input + if (errors.email_partner && emailRef.current) { + emailRef.current.focus(); + return; + } + if (errors.name && nameRef.current) { + nameRef.current.focus(); + return; + } + + if (errors.password && passwordRef.current) { + passwordRef.current.focus(); + return; + } + + if (errors.phone && teleponRef.current) { + teleponRef.current.scrollIntoView(); + return; + } + } + }; + loadIndustries(); + }, [buttonSubmitClick]); + const handleSubmit = async (e: ChangeEvent) => { e.preventDefault(); @@ -101,6 +136,7 @@ const Form: React.FC = ({ className='form-input mt-3' placeholder='Masukan nama lengkap anda' value={form.name} + ref={nameRef} onChange={handleInputChange} aria-invalid={chekValid && !!errors.name} /> @@ -122,6 +158,7 @@ const Form: React.FC = ({ className='form-input mt-3' placeholder='Masukan alamat email anda' value={form.email} + ref={emailRef} onChange={handleInputChange} autoComplete='username' aria-invalid={chekValid && !!errors.email} @@ -143,6 +180,7 @@ const Form: React.FC = ({ className='form-input mt-3' placeholder='••••••••••••' value={form.password} + ref={passwordRef} onChange={handleInputChange} autoComplete='current-password' aria-invalid={chekValid && !!errors.password} @@ -163,6 +201,7 @@ const Form: React.FC = ({ id='phone' name='phone' className='form-input mt-3' + ref={passwordRef} placeholder='08xxxxxxxx' value={form.phone} onChange={handleInputChange} diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index dd9cd72f..2ac998c9 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -26,6 +26,7 @@ interface FormProps { required: boolean; isPKP: boolean; chekValid: boolean; + buttonSubmitClick: boolean; } interface industry_id { @@ -39,7 +40,13 @@ interface companyType { label: string; } -const form: React.FC = ({ type, required, isPKP, chekValid }) => { +const form: React.FC = ({ + type, + required, + isPKP, + chekValid, + buttonSubmitClick, +}) => { const { form, errors, updateForm, validate } = useRegisterStore(); const { control, watch, setValue } = useForm(); const [selectedCategory, setSelectedCategory] = useState(''); @@ -278,7 +285,7 @@ const form: React.FC = ({ type, required, isPKP, chekValid }) => { } }; loadIndustries(); - }, [chekValid, form, errors]); + }, [buttonSubmitClick]); const handleSubmit = async (e: ChangeEvent) => { e.preventDefault(); diff --git a/src-migrate/modules/register/components/RegistrasiBisnis.tsx b/src-migrate/modules/register/components/RegistrasiBisnis.tsx index 36476ab9..ce4d3972 100644 --- a/src-migrate/modules/register/components/RegistrasiBisnis.tsx +++ b/src-migrate/modules/register/components/RegistrasiBisnis.tsx @@ -16,8 +16,12 @@ import { UseToastOptions, useToast } from '@chakra-ui/react'; import Link from 'next/link'; interface FormProps { chekValid: boolean; + buttonSubmitClick: boolean; } -const RegistrasiBisnis: React.FC = ({ chekValid }) => { +const RegistrasiBisnis: React.FC = ({ + chekValid, + buttonSubmitClick, +}) => { const [isPKP, setIsPKP] = useState(true); const [isTerdaftar, setIsTerdaftar] = useState(false); const [isDropIndividu, setIsDropIndividu] = useState(true); @@ -113,6 +117,7 @@ const RegistrasiBisnis: React.FC = ({ chekValid }) => { required={true} isBisnisRegist={true} chekValid={chekValid} + buttonSubmitClick={buttonSubmitClick} />
)} @@ -177,6 +182,7 @@ const RegistrasiBisnis: React.FC = ({ chekValid }) => { required={isTerdaftar} isPKP={isPKP} chekValid={chekValid} + buttonSubmitClick={buttonSubmitClick} />
)} diff --git a/src-migrate/modules/register/components/RegistrasiIndividu.tsx b/src-migrate/modules/register/components/RegistrasiIndividu.tsx index 3997e767..84049065 100644 --- a/src-migrate/modules/register/components/RegistrasiIndividu.tsx +++ b/src-migrate/modules/register/components/RegistrasiIndividu.tsx @@ -3,8 +3,12 @@ import { useRegisterStore } from '../stores/useRegisterStore'; import { useEffect } from 'react'; interface FormProps { chekValid: boolean; + buttonSubmitClick: boolean; } -const RegistrasiIndividu: React.FC = ({ chekValid }) => { +const RegistrasiIndividu: React.FC = ({ + chekValid, + buttonSubmitClick, +}) => { const { form, errors, updateForm, validate } = useRegisterStore(); useEffect(() => { @@ -21,6 +25,7 @@ const RegistrasiIndividu: React.FC = ({ chekValid }) => { required={false} isBisnisRegist={false} chekValid={chekValid} + buttonSubmitClick={buttonSubmitClick} /> ); diff --git a/src-migrate/modules/register/index.tsx b/src-migrate/modules/register/index.tsx index d91af9e3..08d7f893 100644 --- a/src-migrate/modules/register/index.tsx +++ b/src-migrate/modules/register/index.tsx @@ -22,6 +22,7 @@ const LOGO_HEIGHT = LOGO_WIDTH / 3; const Register = () => { const [isIndividuClicked, setIsIndividuClicked] = useState(true); const [notValid, setNotValid] = useState(false); + const [buttonSubmitClick, setButtonSubmitClick] = useState(false); const [isBisnisClicked, setIsBisnisClicked] = useState(false); const { form, isCheckedTNC, isValidCaptcha, resetForm, errors, updateForm } = useRegisterStore(); @@ -49,8 +50,10 @@ const Register = () => { const handleSubmit = async () => { if (!isFormValid) { setNotValid(true); + setButtonSubmitClick(!buttonSubmitClick); return; } else { + setButtonSubmitClick(!buttonSubmitClick); setNotValid(false); } const response = await mutation.mutateAsync(form); @@ -142,12 +145,18 @@ const Register = () => {
{isIndividuClicked && (
- +
)} {isBisnisClicked && (
- +
)}
-- cgit v1.2.3 From 810c5da6e26fdfc4f29df75dca13c0fdb787f34a Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 18 Sep 2024 09:29:41 +0700 Subject: update auto scrool to when error --- src-migrate/modules/register/components/Form.tsx | 32 +++++----- .../modules/register/components/FormBisnis.tsx | 69 ++++++++++++++-------- 2 files changed, 64 insertions(+), 37 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/Form.tsx b/src-migrate/modules/register/components/Form.tsx index b04e763c..55d542f2 100644 --- a/src-migrate/modules/register/components/Form.tsx +++ b/src-migrate/modules/register/components/Form.tsx @@ -26,7 +26,7 @@ const Form: React.FC = ({ }) => { const { form, isCheckedTNC, isValidCaptcha, errors, updateForm, validate } = useRegisterStore(); - + console.log('buttonSubmitClick', buttonSubmitClick); const isFormValid = useMemo(() => Object.keys(errors).length === 0, [errors]); const router = useRouter(); @@ -35,7 +35,7 @@ const Form: React.FC = ({ const emailRef = useRef(null); const nameRef = useRef(null); const passwordRef = useRef(null); - const teleponRef = useRef(null); + const phoneRef = useRef(null); const handleInputChange = (event: ChangeEvent) => { const { name, value } = event.target; @@ -51,29 +51,33 @@ const Form: React.FC = ({ const loadIndustries = async () => { const response = await mutation.mutateAsync(form); if (!response?.register) { - // Logic to focus on first invalid input + const options: ScrollIntoViewOptions = { + behavior: 'smooth', + block: 'center', + }; + if (errors.email_partner && emailRef.current) { - emailRef.current.focus(); + emailRef.current.scrollIntoView(options); return; } if (errors.name && nameRef.current) { - nameRef.current.focus(); + nameRef.current.scrollIntoView(options); return; } if (errors.password && passwordRef.current) { - passwordRef.current.focus(); + passwordRef.current.scrollIntoView(options); return; } - if (errors.phone && teleponRef.current) { - teleponRef.current.scrollIntoView(); + if (errors.phone && phoneRef.current) { + phoneRef.current.scrollIntoView(options); return; } } }; loadIndustries(); - }, [buttonSubmitClick]); + }, [buttonSubmitClick, chekValid]); const handleSubmit = async (e: ChangeEvent) => { e.preventDefault(); @@ -133,7 +137,7 @@ const Form: React.FC = ({ type='text' id='name' name='name' - className='form-input mt-3' + className='form-input mt-3 transition-all duration-700' placeholder='Masukan nama lengkap anda' value={form.name} ref={nameRef} @@ -155,7 +159,7 @@ const Form: React.FC = ({ type='text' id='email' name='email' - className='form-input mt-3' + className='form-input mt-3 transition-all duration-500' placeholder='Masukan alamat email anda' value={form.email} ref={emailRef} @@ -177,7 +181,7 @@ const Form: React.FC = ({ type='password' name='password' id='password' - className='form-input mt-3' + className='form-input mt-3 transition-all duration-500' placeholder='••••••••••••' value={form.password} ref={passwordRef} @@ -200,10 +204,10 @@ const Form: React.FC = ({ type='tel' id='phone' name='phone' - className='form-input mt-3' - ref={passwordRef} + className='form-input mt-3 transition-all duration-500' placeholder='08xxxxxxxx' value={form.phone} + ref={phoneRef} onChange={handleInputChange} aria-invalid={chekValid && !!errors.phone} /> diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index 2ac998c9..50f3522b 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -47,6 +47,8 @@ const form: React.FC = ({ chekValid, buttonSubmitClick, }) => { + console.log('buttonSubmitClick', buttonSubmitClick); + const { form, errors, updateForm, validate } = useRegisterStore(); const { control, watch, setValue } = useForm(); const [selectedCategory, setSelectedCategory] = useState(''); @@ -65,13 +67,15 @@ const form: React.FC = ({ const emailRef = useRef(null); const businessNameRef = useRef(null); - const comppanyTypeRef = useRef(null); + const companyTypeRef = useRef(null); const industryRef = useRef(null); const addressRef = useRef(null); const namaWajibPajakRef = useRef(null); const alamatWajibPajakRef = useRef(null); const npwpRef = useRef(null); const sppkpRef = useRef(null); + const docsSppkpRef = useRef(null); + const docsNpwpRef = useRef(null); useEffect(() => { const loadCompanyTypes = async () => { @@ -248,44 +252,55 @@ const form: React.FC = ({ const loadIndustries = async () => { const response = await mutation.mutateAsync(form); if (!response?.register) { - // Logic to focus on first invalid input + const options: ScrollIntoViewOptions = { + behavior: 'smooth', + block: 'center', + }; if (errors.email_partner && emailRef.current) { - emailRef.current.focus(); + emailRef.current.scrollIntoView(options); return; } - if (errors.company_type_id && businessNameRef.current) { - businessNameRef.current.focus(); + if (errors.company_type_id && companyTypeRef.current) { + companyTypeRef.current.scrollIntoView(options); return; } if (errors.business_name && businessNameRef.current) { - businessNameRef.current.focus(); + businessNameRef.current.scrollIntoView(options); return; } if (errors.industry_id && industryRef.current) { - industryRef.current.scrollIntoView(); + industryRef.current.scrollIntoView(options); return; } if (errors.alamat_bisnis && addressRef.current) { - addressRef.current.focus(); + addressRef.current.scrollIntoView(options); return; } if (errors.npwp && npwpRef.current) { - npwpRef.current.focus(); + npwpRef.current.scrollIntoView(options); return; } if (errors.sppkp && sppkpRef.current) { - sppkpRef.current.focus(); + sppkpRef.current.scrollIntoView(options); + return; + } + if (errors.sppkp_document && docsSppkpRef.current) { + docsSppkpRef.current.scrollIntoView(options); + return; + } + if (errors.npwp_document && docsNpwpRef.current) { + docsNpwpRef.current.scrollIntoView(options); return; } } }; loadIndustries(); - }, [buttonSubmitClick]); + }, [buttonSubmitClick, chekValid]); const handleSubmit = async (e: ChangeEvent) => { e.preventDefault(); @@ -374,7 +389,7 @@ const form: React.FC = ({ name='email_partner' placeholder='example@email.com' value={!required ? form.email_partner : ''} - className={`form-input max-h-11 mt-3 ${ + className={`form-input max-h-11 mt-3 transition-all duration-500 ${ required ? 'cursor-no-drop' : '' }`} disabled={required} @@ -398,7 +413,10 @@ const form: React.FC = ({ Nama Bisnis
-
+
= ({ type='text' name='business_name' id='business_name' - className='form-input max-h-11' + className='form-input max-h-11 transition-all duration-500' placeholder='Nama Perusahaan' autoCapitalize='true' value={form.business_name} @@ -442,7 +460,10 @@ const form: React.FC = ({ -
+
= ({ name='alamat_bisnis' placeholder='Masukan alamat bisnis anda' value={!required ? form.alamat_bisnis : ''} - className={`form-input mt-3 max-h-11 ${ + className={`form-input mt-3 max-h-11 transition-all duration-500 ${ required ? 'cursor-no-drop' : '' }`} disabled={required} @@ -507,7 +528,7 @@ const form: React.FC = ({ name='nama_wajib_pajak' placeholder='Masukan nama lengkap anda' value={!required ? form.nama_wajib_pajak : ''} - className={`form-input mt-3 max-h-11 ${ + className={`form-input mt-3 max-h-11 transition-all duration-500${ required ? 'cursor-no-drop' : '' }`} disabled={required} @@ -536,7 +557,7 @@ const form: React.FC = ({ (opsional) )}

-
+
= ({ : form.alamat_wajib_pajak : '' } - className={`form-input max-h-11 mt-3 ${ + className={`form-input max-h-11 mt-3 transition-all duration-500 ${ required ? 'cursor-no-drop' : '' }`} disabled={isChekBox || required} @@ -592,7 +613,7 @@ const form: React.FC = ({ type='tel' id='npwp' name='npwp' - className={`form-input max-h-11 mt-3 ${ + className={`form-input max-h-11 mt-3 transition-all duration-500 ${ required ? 'cursor-no-drop' : '' }`} disabled={required} @@ -652,7 +673,7 @@ const form: React.FC = ({ type='tel' id='sppkp' name='sppkp' - className={`form-input max-h-11 mt-3 ${ + className={`form-input max-h-11 mt-3 transition-all duration-500 ${ required ? 'cursor-no-drop' : '' }`} disabled={required} @@ -682,11 +703,12 @@ const form: React.FC = ({ type='file' id='npwp_document' name='npwp_document' - className={`form-input ${ + className={`form-input transition-all duration-500 ${ type === 'bisnis' ? '' : 'border-none' } mt-3 ${required ? 'cursor-no-drop' : ''}`} disabled={required} contentEditable={required} + ref={docsNpwpRef} readOnly={required} onChange={handleFileChange} accept='.pdf,.doc,.docx,.png,.jpg,.jpeg' // Filter file types @@ -709,11 +731,12 @@ const form: React.FC = ({ type='file' id='sppkp_document' name='sppkp_document' - className={`form-input ${ + className={`form-input transition-all duration-500 ${ type === 'bisnis' ? '' : 'border-none' } mt-3 ${required ? 'cursor-no-drop' : ''}`} disabled={required} contentEditable={required} + ref={docsSppkpRef} readOnly={required} onChange={handleFileChange} accept='.pdf,.doc,.docx,.png,.jpg,.jpeg' // Filter file types -- cgit v1.2.3 From c8ecabc13896f93571710881344ec8c2f8ae4b73 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 18 Sep 2024 09:36:21 +0700 Subject: delete console log --- src-migrate/modules/register/components/FormBisnis.tsx | 2 -- 1 file changed, 2 deletions(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index 50f3522b..70ed6bee 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -47,8 +47,6 @@ const form: React.FC = ({ chekValid, buttonSubmitClick, }) => { - console.log('buttonSubmitClick', buttonSubmitClick); - const { form, errors, updateForm, validate } = useRegisterStore(); const { control, watch, setValue } = useForm(); const [selectedCategory, setSelectedCategory] = useState(''); -- cgit v1.2.3 From 4aface3ba2fa7c74a152ac0fe03b9e32e3ef68e1 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Wed, 18 Sep 2024 10:06:14 +0700 Subject: update bug ga bisa pilih alamat --- src-migrate/modules/register/components/Form.tsx | 1 - 1 file changed, 1 deletion(-) (limited to 'src-migrate/modules') diff --git a/src-migrate/modules/register/components/Form.tsx b/src-migrate/modules/register/components/Form.tsx index 55d542f2..cd0b4343 100644 --- a/src-migrate/modules/register/components/Form.tsx +++ b/src-migrate/modules/register/components/Form.tsx @@ -26,7 +26,6 @@ const Form: React.FC = ({ }) => { const { form, isCheckedTNC, isValidCaptcha, errors, updateForm, validate } = useRegisterStore(); - console.log('buttonSubmitClick', buttonSubmitClick); const isFormValid = useMemo(() => Object.keys(errors).length === 0, [errors]); const router = useRouter(); -- cgit v1.2.3