From b3be7e6d5c320764ef3ca38df196218abf9be25b Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Tue, 10 Dec 2024 10:05:47 +0700 Subject: move formulis & add state field --- src/lib/form/components/KunjunganSales.jsx | 215 +++++++++----- src/lib/form/components/KunjunganService.jsx | 361 ++++++++++++++---------- src/lib/form/components/Merchant.jsx | 56 +++- src/lib/form/components/RequestForQuotation.jsx | 215 +++++++++----- src/lib/form/components/SuratDukungan.jsx | 33 +-- 5 files changed, 569 insertions(+), 311 deletions(-) (limited to 'src/lib') diff --git a/src/lib/form/components/KunjunganSales.jsx b/src/lib/form/components/KunjunganSales.jsx index ffa8f135..3779b836 100644 --- a/src/lib/form/components/KunjunganSales.jsx +++ b/src/lib/form/components/KunjunganSales.jsx @@ -1,17 +1,18 @@ -import odooApi from '@/core/api/odooApi' -import HookFormSelect from '@/core/components/elements/Select/HookFormSelect' -import cityApi from '@/lib/address/api/cityApi' -import { yupResolver } from '@hookform/resolvers/yup' -import React, { useEffect, useRef, useState } from 'react' -import ReCAPTCHA from 'react-google-recaptcha' -import { Controller, useForm } from 'react-hook-form' -import { toast } from 'react-hot-toast' -import * as Yup from 'yup' -import createLeadApi from '../api/createLeadApi' -import PageContent from '@/lib/content/components/PageContent' - -import useAuth from '@/core/hooks/useAuth' -import { useRouter } from 'next/router' +import odooApi from '@/core/api/odooApi'; +import HookFormSelect from '@/core/components/elements/Select/HookFormSelect'; +import cityApi from '@/lib/address/api/cityApi'; +import stateApi from '@/lib/address/api/stateApi.js'; +import { yupResolver } from '@hookform/resolvers/yup'; +import React, { useEffect, useRef, useState } from 'react'; +import ReCAPTCHA from 'react-google-recaptcha'; +import { Controller, useForm } from 'react-hook-form'; +import { toast } from 'react-hot-toast'; +import * as Yup from 'yup'; +import createLeadApi from '../api/createLeadApi'; +import PageContent from '@/lib/content/components/PageContent'; + +import useAuth from '@/core/hooks/useAuth'; +import { useRouter } from 'next/router'; const KunjunganSales = () => { const { @@ -19,44 +20,72 @@ const KunjunganSales = () => { handleSubmit, formState: { errors }, control, - reset + reset, + watch, + setValue, } = useForm({ resolver: yupResolver(validationSchema), - defaultValues - }) - const [cities, setCities] = useState([]) - const [companyTypes, setCompanyTypes] = useState([]) - const router = useRouter() + defaultValues, + }); + const [cities, setCities] = useState([]); + const [state, setState] = useState([]); + const [companyTypes, setCompanyTypes] = useState([]); + const router = useRouter(); + + const auth = useAuth(); - const auth = useAuth() + const recaptchaRef = useRef(null); - + if (auth == false) { + router.push(`/login?next=${encodeURIComponent('/kunjungan-sales')}`); + } + + useEffect(() => { + const loadState = async () => { + let dataState = await stateApi(); + dataState = dataState.map((state) => ({ + value: state.id, + label: state.name, + })); + setState(dataState); + }; + loadState(); + }, []); - const recaptchaRef = useRef(null) + const watchState = watch('state'); useEffect(() => { - if(auth == false) { - router.push('/login') + if (auth == false) { + return; } const loadCities = async () => { - let dataCities = await cityApi() - dataCities = dataCities.map((obj) => ({ value: obj.name, label: obj.name })) - setCities(dataCities) - } + setValue('city', ''); + let dataCities = await cityApi({ stateId: watchState }); + dataCities = dataCities?.map((obj) => ({ + value: obj.name, + label: obj.name, + })); + setCities(dataCities); + }; const loadCompanyTypes = async () => { - const dataCompanyTypes = await odooApi('GET', '/api/v1/partner/company_type') - setCompanyTypes(dataCompanyTypes?.map((obj) => ({ value: obj.name, label: obj.name }))) - } + const dataCompanyTypes = await odooApi( + 'GET', + '/api/v1/partner/company_type' + ); + setCompanyTypes( + dataCompanyTypes?.map((obj) => ({ value: obj.name, label: obj.name })) + ); + }; - loadCompanyTypes() - loadCities() - }, [auth]) + loadCompanyTypes(); + loadCities(); + }, [auth, watchState, setValue]); const onSubmitHandler = async (values) => { - const recaptchaValue = recaptchaRef.current.getValue() + const recaptchaValue = recaptchaRef.current.getValue(); if (!recaptchaValue) { - toast.error('Recaptcha harus diisi') - return + toast.error('Recaptcha harus diisi'); + return; } const data = { @@ -71,29 +100,37 @@ const KunjunganSales = () => { `Unit Perusahaan: ${values.companyType}`, `No. Handphone: ${values.mobile}`, `Alamat Email: ${values.email}`, - `Keterangan: ${values.description}` - ].join('\n') - } + `Keterangan: ${values.description}`, + ].join('\n'), + }; - const createLead = await createLeadApi({ data }) + const createLead = await createLeadApi({ data }); if (createLead) { - toast.success('Berhasil mengirimkan formulir kunjungan sales') - reset() - recaptchaRef.current.reset() + toast.success('Berhasil mengirimkan formulir kunjungan sales'); + reset(); + recaptchaRef.current.reset(); } + }; + if (!auth) { + return; } return (
-

Kunjungan Sales

+

+ Kunjungan Sales +

-
+
- Hubungi kami untuk mendapatkan kunjungan sales kami dan dapatkan berbagai kelebihannya - dengan menjadi pelanggan korporat kami. + Hubungi kami untuk mendapatkan kunjungan sales kami dan dapatkan + berbagai kelebihannya dengan menjadi pelanggan korporat kami.
@@ -104,7 +141,9 @@ const KunjunganSales = () => { className='form-input' aria-invalid={errors.company?.message} /> -
{errors.company?.message}
+
+ {errors.company?.message} +
@@ -116,7 +155,9 @@ const KunjunganSales = () => { className='form-input' aria-invalid={errors.phone?.message} /> -
{errors.phone?.message}
+
+ {errors.phone?.message} +
@@ -128,7 +169,21 @@ const KunjunganSales = () => { className='form-input' aria-invalid={errors.address?.message} /> -
{errors.address?.message}
+
+ {errors.address?.message} +
+
+ +
+ + } + /> +
+ {errors.stateId?.message} +
@@ -138,7 +193,9 @@ const KunjunganSales = () => { control={control} render={(props) => } /> -
{errors.city?.message}
+
+ {errors.city?.message} +
@@ -146,9 +203,13 @@ const KunjunganSales = () => { } + render={(props) => ( + + )} /> -
{errors.companyType?.message}
+
+ {errors.companyType?.message} +
@@ -160,7 +221,9 @@ const KunjunganSales = () => { className='form-input' aria-invalid={errors.mobile?.message} /> -
{errors.mobile?.message}
+
+ {errors.mobile?.message} +
@@ -172,34 +235,49 @@ const KunjunganSales = () => { className='form-input' aria-invalid={errors.email?.message} /> -
{errors.email?.message}
+
+ {errors.email?.message} +
-