From 6b8427b18ab3cb5bcc83bceaf43cc7b712a83fa6 Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Tue, 5 Dec 2023 15:09:52 +0700 Subject: add page content di formulir --- src/lib/form/components/KunjunganSales.jsx | 4 +- src/lib/form/components/KunjunganService.jsx | 25 +- src/lib/form/components/Merchant.jsx | 360 +++++++++++++----------- src/lib/form/components/PembayaranTempo.jsx | 3 + src/lib/form/components/RequestForQuotation.jsx | 4 +- src/lib/form/components/SuratDukungan.jsx | 339 ++++++++++++---------- 6 files changed, 414 insertions(+), 321 deletions(-) (limited to 'src/lib/form/components') diff --git a/src/lib/form/components/KunjunganSales.jsx b/src/lib/form/components/KunjunganSales.jsx index 7064f807..7470395a 100644 --- a/src/lib/form/components/KunjunganSales.jsx +++ b/src/lib/form/components/KunjunganSales.jsx @@ -8,6 +8,7 @@ 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' const KunjunganSales = () => { const { @@ -74,7 +75,7 @@ const KunjunganSales = () => {

Kunjungan Sales

-
+
{ Simpan +
) diff --git a/src/lib/form/components/KunjunganService.jsx b/src/lib/form/components/KunjunganService.jsx index 965fbc89..1cb0b446 100644 --- a/src/lib/form/components/KunjunganService.jsx +++ b/src/lib/form/components/KunjunganService.jsx @@ -7,6 +7,7 @@ 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' const CreateKunjunganService = () => { const { @@ -82,8 +83,10 @@ const CreateKunjunganService = () => { kami untuk melakukan kunjungan ke tempat Anda di Jabodetabek.

+
+
-
+
{
{errors.company?.message}
-
+
{
{errors.phone?.message}
-
+
{
{errors.address?.message}
-
+
{
{errors.city?.message}
-
+
{
{errors.cp?.message}
-
+
{
{errors.mobile?.message}
-
+
{
{errors.email?.message}
-
+
-
+
-
+
+ +
) diff --git a/src/lib/form/components/Merchant.jsx b/src/lib/form/components/Merchant.jsx index 24b58a7c..6c1af231 100644 --- a/src/lib/form/components/Merchant.jsx +++ b/src/lib/form/components/Merchant.jsx @@ -1,12 +1,13 @@ -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 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'; const CreateMerchant = () => { const { @@ -14,56 +15,59 @@ const CreateMerchant = () => { handleSubmit, formState: { errors }, control, - reset + reset, } = useForm({ resolver: yupResolver(validationSchema), - defaultValues - }) + defaultValues, + }); const list_unit = [ { value: 'Manufacturing', - label: 'Manufacturing' + label: 'Manufacturing', }, { value: 'Hospitality', - label: 'Hospitality' + label: 'Hospitality', }, { value: 'Automotive', - label: 'Automotive' + label: 'Automotive', }, { value: 'Retail', - label: 'Retail' + label: 'Retail', }, { value: 'Maining', - label: 'Maining' + label: 'Maining', }, { value: 'Lain - Lain', - label: 'Lain - Lain' - } - ] - const [cities, setCities] = useState([]) - const [company_unit, setCompany_unit] = useState(list_unit) + label: 'Lain - Lain', + }, + ]; + const [cities, setCities] = useState([]); + const [company_unit, setCompany_unit] = useState(list_unit); - const recaptchaRef = useRef(null) + const recaptchaRef = useRef(null); useEffect(() => { const loadCities = async () => { - let dataCities = await cityApi() - dataCities = dataCities.map((city) => ({ value: city.id, label: city.name })) - setCities(dataCities) - } - loadCities() - }, []) + let dataCities = await cityApi(); + dataCities = dataCities.map((city) => ({ + value: city.id, + label: city.name, + })); + setCities(dataCities); + }; + loadCities(); + }, []); const onSubmitHandler = async (values) => { - const recaptchaValue = recaptchaRef.current.getValue() + const recaptchaValue = recaptchaRef.current.getValue(); if (!recaptchaValue) { - toast.error('Catcha harus diisi') - return + toast.error('Catcha harus diisi'); + return; } const data = { ...values, @@ -89,166 +93,200 @@ const CreateMerchant = () => { ' \r\n No Hp : ' + values.mobile + 'Keterangan : ' + - values.description - } - const create_leads = await createLeadApi({ data }) + values.description, + }; + const create_leads = await createLeadApi({ data }); if (create_leads) { - toast.success('Berhasil menambahkan data') - reset() - recaptchaRef.current.reset() + toast.success('Berhasil menambahkan data'); + reset(); + recaptchaRef.current.reset(); } - } + }; return (
-

Form Merchant

+

+ Form Merchant +

- Penjualan online adalah hal yang HARUS dilakukan mulai sekarang. Perubahan dalam banyak - industri dan pola pembelian. Gabung dengan platform kami dan mulai penjualan lansung di - ribuan perusahaan d seluruh Indonesia.{' '} + Penjualan online adalah hal yang HARUS dilakukan mulai sekarang. + Perubahan dalam banyak industri dan pola pembelian. Gabung dengan + platform kami dan mulai penjualan lansung di ribuan perusahaan d + seluruh Indonesia.{' '}

-
-
-
- - -
{errors.company?.message}
+
+ +
+
+ + +
+ {errors.company?.message} +
+
-
-
-
- - -
{errors.address?.message}
+
+
+ + +
+ {errors.address?.message} +
+
-
-
-
- - -
{errors.phone?.message}
+
+
+ + +
+ {errors.phone?.message} +
+
-
-
-
- - } - /> -
{errors.city?.message}
+
+
+ + ( + + )} + /> +
+ {errors.city?.message} +
+
-
-
-
- - } - /> -
- {errors.company_unit?.message} +
+
+ + ( + + )} + /> +
+ {errors.company_unit?.message} +
-
-
-
- - -
{errors.website?.message}
+
+
+ + +
+ {errors.website?.message} +
+
-
-
-
- - -
{errors.cp?.message}
+
+
+ + +
+ {errors.cp?.message} +
+
-
-
-
- - -
{errors.mobile?.message}
+
+
+ + +
+ {errors.mobile?.message} +
+
-
-
-
- - -
{errors.email?.message}
+
+
+ + +
+ {errors.email?.message} +
+
-
-
-
- +
+
+ +
-
-
-
- +
+
+ +
-
- + + +
- ) -} + ); +}; const validationSchema = Yup.object().shape({ company: Yup.string().required('Harus di-isi'), - email: Yup.string().email('Format harus seperti contoh@email.com').required('Harus di-isi'), + email: Yup.string() + .email('Format harus seperti contoh@email.com') + .required('Harus di-isi'), phone: Yup.string().required('Harus di-isi'), cp: Yup.string().required('Harus di-isi'), city: Yup.string().required('Harus di-isi'), company_unit: Yup.string().required('Harus di-isi'), address: Yup.string().required('Harus di-isi'), website: Yup.string().required('Harus di-isi'), - mobile: Yup.string().required('Harus di-isi') -}) + mobile: Yup.string().required('Harus di-isi'), +}); const defaultValues = { company: '', email: '', @@ -258,7 +296,7 @@ const defaultValues = { cp: '', address: '', website: '', - mobile: '' -} + mobile: '', +}; -export default CreateMerchant +export default CreateMerchant; diff --git a/src/lib/form/components/PembayaranTempo.jsx b/src/lib/form/components/PembayaranTempo.jsx index ffdb0961..8c624fe2 100644 --- a/src/lib/form/components/PembayaranTempo.jsx +++ b/src/lib/form/components/PembayaranTempo.jsx @@ -6,6 +6,8 @@ import { 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' + const PembayaranTempo = () => { const { @@ -134,6 +136,7 @@ const PembayaranTempo = () => {
+
) diff --git a/src/lib/form/components/RequestForQuotation.jsx b/src/lib/form/components/RequestForQuotation.jsx index 31efb5d6..fa526d5f 100644 --- a/src/lib/form/components/RequestForQuotation.jsx +++ b/src/lib/form/components/RequestForQuotation.jsx @@ -9,6 +9,7 @@ import { toast } from 'react-hot-toast' import * as Yup from 'yup' import createLeadApi from '../api/createLeadApi' import getFileBase64 from '@/core/utils/getFileBase64' +import PageContent from '@/lib/content/components/PageContent' const RequestForQuotation = () => { const { @@ -79,7 +80,7 @@ const RequestForQuotation = () => {

Request for Quotation

-
+
{ Simpan +
) diff --git a/src/lib/form/components/SuratDukungan.jsx b/src/lib/form/components/SuratDukungan.jsx index 360dd838..d73c3fab 100644 --- a/src/lib/form/components/SuratDukungan.jsx +++ b/src/lib/form/components/SuratDukungan.jsx @@ -1,12 +1,14 @@ -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 createLeadsApi from '../api/createLeadApi' +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 createLeadsApi from '../api/createLeadApi'; + +import PageContent from '@/lib/content/components/PageContent'; const CreateSuratDukungan = () => { const { @@ -14,30 +16,33 @@ const CreateSuratDukungan = () => { handleSubmit, formState: { errors }, control, - reset + reset, } = useForm({ resolver: yupResolver(validationSchema), - defaultValues - }) - const [cities, setCities] = useState([]) - const [company_unit, setCompany_unit] = useState([]) + defaultValues, + }); + const [cities, setCities] = useState([]); + const [company_unit, setCompany_unit] = useState([]); - const recaptchaRef = useRef(null) + const recaptchaRef = useRef(null); useEffect(() => { const loadCities = async () => { - let dataCities = await cityApi() - dataCities = dataCities.map((city) => ({ value: city.id, label: city.name })) - setCities(dataCities) - } - loadCities() - }, []) + let dataCities = await cityApi(); + dataCities = dataCities.map((city) => ({ + value: city.id, + label: city.name, + })); + setCities(dataCities); + }; + loadCities(); + }, []); const onSubmitHandler = async (values) => { - const recaptchaValue = recaptchaRef.current.getValue() + const recaptchaValue = recaptchaRef.current.getValue(); if (!recaptchaValue) { - toast.error('Catcha harus diisi') - return + toast.error('Catcha harus diisi'); + return; } const data = { ...values, @@ -61,19 +66,21 @@ const CreateSuratDukungan = () => { ' \r\n Alamat 2 : ' + values.address2 + 'Keterangan : ' + - values.description - } + values.description, + }; - const create_leads = await createLeadsApi({ data }) + const create_leads = await createLeadsApi({ data }); if (create_leads) { - toast.success('Berhasil menambahkan alamat') - reset() - recaptchaRef.current.reset() + toast.success('Berhasil menambahkan alamat'); + reset(); + recaptchaRef.current.reset(); } - } + }; return (
-

Form Surat Dukungan

+

+ Form Surat Dukungan +

{ >

Lengkapi form berikut untuk melakukan konfirmasi pembayaran.

-
-

Data Peserta

-
-
-
-
- - -
{errors.company?.message}
-
-
-
-
- - -
{errors.address?.message}
-
-
-
-
- - -
{errors.phone?.message}
-
-
-
-
- - -
{errors.npwp?.message}
-
-
-
-
- - -
{errors.email?.message}
+
+
+
+

Data Peserta

-
-
-

Data Peserta

-
-
-
- - -
{errors.pengadaan?.message}
-
-
-
-
- -