From 6623dba2f6cd4a4ca7b25f7086991afef092cd26 Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Thu, 22 Aug 2024 15:48:00 +0700 Subject: update new register view --- .../modules/register/components/FormBisnis.tsx | 88 +++++++++++----------- 1 file changed, 44 insertions(+), 44 deletions(-) (limited to 'src-migrate/modules/register/components/FormBisnis.tsx') diff --git a/src-migrate/modules/register/components/FormBisnis.tsx b/src-migrate/modules/register/components/FormBisnis.tsx index d014f4e7..8b666ad7 100644 --- a/src-migrate/modules/register/components/FormBisnis.tsx +++ b/src-migrate/modules/register/components/FormBisnis.tsx @@ -4,7 +4,7 @@ import { useRegisterStore } from "../stores/useRegisterStore"; import { RegisterProps } from "~/types/auth"; import { registerUser } from "~/services/auth"; import { useRouter } from "next/router"; -import { UseToastOptions, useToast } from "@chakra-ui/react"; +import { UseToastOptions, color, useToast } from "@chakra-ui/react"; import Link from "next/link"; import getFileBase64 from '@/core/utils/getFileBase64' import { Controller, useForm } from 'react-hook-form' @@ -14,6 +14,7 @@ import odooApi from "~/libs/odooApi"; interface FormProps { type: string; required: boolean; + isPKP: boolean; } interface Industry { @@ -27,7 +28,7 @@ interface CompanyType { label: string; } -const FormBisnis: React.FC = ({ type, required }) => { +const FormBisnis: React.FC = ({ type, required, isPKP }) => { const { formBisnis, isCheckedTNC, @@ -39,7 +40,7 @@ const FormBisnis: React.FC = ({ type, required }) => { const { control, watch, setValue } = useForm(); const [selectedCategory, setSelectedCategory] = useState(''); - const [selectedCompanyId, setSelectedCompanyId] = useState(); + const [selectedCompanyId, setSelectedCompanyId] = useState(''); const [industries, setIndustries] = useState([]); const [companyTypes, setCompanyTypes] = useState([]); @@ -60,6 +61,7 @@ const FormBisnis: React.FC = ({ type, required }) => { const selectedCompanyType = companyTypes.find(company => company.value === watch('companyType')); if (selectedCompanyType) { updateFormBisnis("company_type_id", selectedCompanyType?.value); + setSelectedCompanyId(selectedCompanyType?.label) validateFormBisnis(); } }, [watch('companyType'), companyTypes]); @@ -68,8 +70,8 @@ const FormBisnis: React.FC = ({ type, required }) => { const selectedIndustryType = industries.find(industry => industry.value === watch('industry')); if (selectedIndustryType) { updateFormBisnis("industry_id", selectedIndustryType?.value); + setSelectedCategory(selectedIndustryType.label); validateFormBisnis(); - console.log("selectedIndustryType",selectedIndustryType) } }, [watch('industry'), industries]); @@ -81,17 +83,7 @@ const FormBisnis: React.FC = ({ type, required }) => { loadIndustries(); }, []); - const selectedIndustry = watch('industry'); - useEffect(() => { - const selected = industries.find(industry => industry.value === selectedIndustry); - console.log("selected",selected) - if (selected) { - setSelectedCategory(selected.category); - } - }, [selectedIndustry, industries]); - const handleInputChange = (event: ChangeEvent) => { - console.log("event",event) const { name, value } = event.target; updateFormBisnis(name, value); validateFormBisnis(); @@ -156,11 +148,10 @@ const FormBisnis: React.FC = ({ type, required }) => { break; } }; - return (
- + = ({ type, required }) => { readOnly={required} onChange={handleInputChange} autoComplete="username" - aria-invalid={!required && !!errors.email_partner} + aria-invalid={!required && isPKP && !!errors.email_partner} /> - {!required && !!errors.email_partner && {errors.email_partner}} + {!required && isPKP && !!errors.email_partner && {errors.email_partner}}
-
+
} - /> + /> + {!required && selectedCompanyId === '' && {errors.companyType}} +
+
+ + + { !!errors.business_name && {errors.business_name}}
-
-
+
@@ -214,12 +211,15 @@ const FormBisnis: React.FC = ({ type, required }) => { name='industry' control={control} render={(props) => } - /> - Kategori : {selectedCategory} + /> + {selectedCategory && + Kategori : {selectedCategory} + } + {!required && selectedCategory === '' && {errors.industry}}
- + = ({ type, required }) => { contentEditable={required} readOnly={required} onChange={handleInputChange} - aria-invalid={!required && !!errors.nama_wajib_pajak} + aria-invalid={isPKP && !required && !!errors.nama_wajib_pajak} /> - {!required && !!errors.nama_wajib_pajak && {errors.nama_wajib_pajak}} + {isPKP && !required && !!errors.nama_wajib_pajak && {errors.nama_wajib_pajak}}
- + = ({ type, required }) => { placeholder='000.000.000.0-000.000' value={!required ? formBisnis.npwp : ''} onChange={handleInputChange} - aria-invalid={!required && !!errors.npwp} + aria-invalid={isPKP && !required && !!errors.npwp} /> - {!required && !!errors.npwp && {errors.npwp}} + {isPKP && !required && !!errors.npwp && {errors.npwp}}
- + = ({ type, required }) => { accept=".pdf,.doc,.docx,.png,.jpg,.jpeg" // Filter file types /> - {!required && !!errors.npwp_document && {errors.npwp_document}} + {isPKP && !required && !!errors.npwp_document && {errors.npwp_document}}
- + = ({ type, required }) => { accept=".pdf,.doc,.docx,.png,.jpg,.jpeg" // Filter file types /> - {!required && !!errors.sppkp_document && {errors.sppkp_document}} + {isPKP && !required && !!errors.sppkp_document && {errors.sppkp_document}}
{/*