summaryrefslogtreecommitdiff
path: root/src/lib/merchant/components/InformasiPerusahaan.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/merchant/components/InformasiPerusahaan.jsx')
-rw-r--r--src/lib/merchant/components/InformasiPerusahaan.jsx1399
1 files changed, 1399 insertions, 0 deletions
diff --git a/src/lib/merchant/components/InformasiPerusahaan.jsx b/src/lib/merchant/components/InformasiPerusahaan.jsx
new file mode 100644
index 00000000..e9486214
--- /dev/null
+++ b/src/lib/merchant/components/InformasiPerusahaan.jsx
@@ -0,0 +1,1399 @@
+// import HookFormSelect from '@/core/components/elements/Select/HookFormSelect';
+// import cityApi from '@/lib/address/api/cityApi';
+// import stateApi from '@/lib/address/api/stateApi.js';
+// import districtApi from '@/lib/address/api/districtApi';
+// import subDistrictApi from '@/lib/address/api/subDistrictApi';
+// import { yupResolver } from '@hookform/resolvers/yup';
+// import React, {
+// useEffect,
+// useRef,
+// useState,
+// forwardRef,
+// useImperativeHandle,
+// } 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 createMerchantApi from '../api/createMerchantApi';
+// import getMerchantApi from '../api/getMerchantApi';
+// import addressApi from '@/lib/address/api/addressApi';
+// import PageContent from '@/lib/content/components/PageContent';
+// import { useRouter } from 'next/router';
+// import useAuth from '@/core/hooks/useAuth';
+// import { Radio, RadioGroup, Stack, Divider, Button } from '@chakra-ui/react';
+// import { EyeIcon } from '@heroicons/react/24/outline';
+// import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
+// import Image from 'next/image';
+// import ImageBanner from '~/components/ui/image';
+// import { ChevronRightIcon, ChevronLeftIcon } from '@heroicons/react/24/outline';
+// import MobileView from '@/core/components/views/MobileView';
+// import DesktopView from '@/core/components/views/DesktopView';
+// import getFileBase64 from '@/core/utils/getFileBase64';
+// import odooApi from '~/libs/odooApi';
+
+// const CreateMerchant = forwardRef(
+// ({ handleIsError, isKonfirmasi, buttonSubmitClick }, ref) => {
+// const isError = (value) => {
+// // Logika menentukan error
+// const result = value ? true : false;
+// handleIsError(result); // Panggil handleIsError dari Merchant
+// return result;
+// };
+// // React.useEffect(() => {
+// // handleIsError(isError());
+// // }, [handleIsError]);
+// const {
+// register,
+// handleSubmit,
+// formState: { errors },
+// control,
+// reset,
+// watch,
+// setValue,
+// getValues,
+// } = useForm({
+// resolver: yupResolver(validationSchema),
+// defaultValues,
+// });
+// const [state, setState] = useState([]);
+// const [cities, setCities] = useState([]);
+// const [districts, setDistricts] = useState([]);
+// const [subDistricts, setSubDistricts] = useState([]);
+// const [zips, setZips] = useState([]);
+// const [isExample, setIsExample] = useState(false);
+// const [isPkp, setIsPkp] = useState(false);
+
+// useEffect(() => {
+// window.scrollTo({
+// top: 0,
+// behavior: 'smooth',
+// });
+// }, []);
+
+
+// useImperativeHandle(ref, () => () => {
+// handleSubmit(onSubmitHandler)();
+// });
+
+// const recaptchaRef = useRef(null);
+// const router = useRouter();
+
+// const auth = useAuth();
+// if (auth == false) {
+// router.push(`/login?next=${encodeURIComponent('/daftar-merchant')}`);
+// }
+// const dataBisnisType = [
+// { value: 1, label: 'PT' },
+// { value: 2, label: 'CV' },
+// { value: 3, label: 'Perorangan' },
+// ];
+// const dataCategoryPerusahaan = [
+// { value: 1, label: 'Principal (Pemegang merk/Produsen)' },
+// { value: 2, label: 'Sole Distributor (Distributor Tunggal)' },
+// { value: 3, label: 'Authorized Distributor (Distributor Resmi)' },
+// { value: 4, label: 'Importer (Pengimpor Barang)' },
+// { value: 5, label: 'Wholesaler (Pedagang Besar)' },
+// ];
+
+// useEffect(() => {
+// const loadData = async () => {
+// try {
+// const data = await getMerchantApi();
+// if (data) {
+// reset({
+// pejabatName: data.pejabatName ? data.pejabatName : '',
+// PICName: data.picMerchant || '',
+// PICPosition: data.picPosition || '',
+// address: data.address ? data.address : '',
+// state: data.state ? data.state : '',
+// city: data.city || '',
+// district: data.district || '',
+// subDistrict: data.subDistrict || '',
+// zip: parseInt(data.zip) || '',
+// email: data.emailCompany || '',
+// emailSales: data.emailSales || '',
+// emailFinance: data.emailFinance || '',
+// bank: data.bankName || '',
+// rekening: data.rekeningName || '',
+// accountNumber: data.accountNumber || '',
+// phone: data.phone || '',
+// mobile: data.mobile || '',
+// bisnisType: data.bisnisType ? parseInt(data.bisnisType) : null,
+// categoryPerusahaan: data.categoryPerusahaan
+// ? parseInt(data.categoryPerusahaan)
+// : null,
+// website: data.website || '',
+// });
+// }
+// } catch (error) {
+// console.error('Error loading profile:', error);
+// handleIsError(true); // Jika ada error, panggil fungsi error handler
+// }
+// };
+
+// loadData();
+// }, [reset, handleIsError]);
+
+// useEffect(() => {
+// const loadProfile = async () => {
+// try {
+// const dataProfile = await addressApi({
+// id: auth.parentId ? auth.parentId : auth.partnerId,
+// });
+// if (dataProfile.companyType == 'pkp') {
+// setIsPkp(true);
+// }
+// setValue('company', dataProfile?.name);
+// setValue('address', dataProfile?.alamatBisnis);
+// setValue('state', parseInt(dataProfile.stateId.id));
+// setValue('city', parseInt(dataProfile.city.id));
+// setValue('district', parseInt(dataProfile.district.id));
+// setValue('subDistrict', parseInt(dataProfile.subDistrict.id));
+// setValue('zip', parseInt(dataProfile.zip));
+// } catch (error) {
+// console.error('Error loading profile:', error);
+// }
+// };
+
+// loadProfile();
+// }, [auth?.parentId]);
+
+// useEffect(() => {
+// const loadState = async () => {
+// let dataState = await stateApi({ tempo: false });
+// dataState = dataState.map((state) => ({
+// value: state.id,
+// label: state.name,
+// }));
+// setState(dataState);
+// };
+// loadState();
+// }, []);
+
+// const watchState = watch('state');
+// useEffect(() => {
+// if (auth == false) {
+// return;
+// }
+// if (watchState) {
+// // setValue('city', '');
+// const loadCities = async () => {
+// let dataCities = await cityApi({ stateId: watchState });
+// dataCities = dataCities?.map((city) => ({
+// value: city.id,
+// label: city.name,
+// }));
+// setCities(dataCities);
+// };
+// loadCities();
+// }
+// }, [auth, watchState]);
+
+// const watchCity = watch('city');
+// useEffect(() => {
+// if (watchCity) {
+// // setValue('district', '');
+// const loadDistricts = async () => {
+// let dataDistricts = await districtApi({ cityId: watchCity });
+// dataDistricts = dataDistricts.map((district) => ({
+// value: district.id,
+// label: district.name,
+// }));
+// setDistricts(dataDistricts);
+// };
+// loadDistricts();
+// }
+// }, [watchCity]);
+
+// const watchDistrict = watch('district');
+// useEffect(() => {
+// if (watchDistrict) {
+// // setValue('subDistrict', '');
+// const loadSubDistricts = async () => {
+// let dataSubDistricts = await subDistrictApi({
+// districtId: watchDistrict,
+// });
+// dataSubDistricts = dataSubDistricts.map((district) => ({
+// value: district.id,
+// label: district.name,
+// }));
+// setSubDistricts(dataSubDistricts);
+// };
+// loadSubDistricts();
+// }
+// }, [watchDistrict]);
+
+// const watchsubDistrict = watch('subDistrict');
+
+// useEffect(() => {
+// let kelurahan = '';
+// let kecamatan = '';
+
+// if (watchDistrict) {
+// // setValue('zip', '');
+// for (const data in districts) {
+// if (districts[data].value == watchDistrict) {
+// kecamatan = districts[data].label.toLowerCase();
+// }
+// }
+// }
+
+// if (watchsubDistrict) {
+// for (const data in subDistricts) {
+// if (subDistricts[data].value == watchsubDistrict) {
+// kelurahan = subDistricts[data].label.toLowerCase();
+// }
+// }
+// const loadZip = async () => {
+// const response = await fetch(
+// `https://alamat.thecloudalert.com/api/cari/index/?keyword=${kelurahan}`
+// );
+
+// let dataMasuk = []; // Array untuk menyimpan kode pos yang sudah diproses
+
+// const result = await response.json();
+
+// // Filter dan map data
+// const dataZips = result.result
+// .filter((zip) => zip.kecamatan.toLowerCase() === kecamatan) // Filter berdasarkan kecamatan
+// .filter((zip) => {
+// // Pastikan zip.kodepos belum ada di dataMasuk
+// if (dataMasuk.includes(zip.kodepos)) {
+// return false; // Jika sudah ada, maka skip (tidak akan ditambahkan)
+// } else {
+// dataMasuk.push(zip.kodepos); // Tambahkan ke dataMasuk
+// return true; // Tambahkan zip ke hasil
+// }
+// })
+// .map((zip) => ({
+// value: parseInt(zip.kodepos),
+// label: zip.kodepos,
+// }));
+
+// setZips(dataZips); // Set hasil ke state
+// };
+
+// loadZip();
+// }
+// }, [watchsubDistrict, subDistricts]);
+// const onSubmitHandler = async (values) => {
+// const toastId = toast.loading('Mengirimkan formulir merchant...');
+// const data = {
+// name_merchant: 'Form Merchant - ' + values.company,
+// pejabat_name: values.pejabatName,
+// pic_merchant: values.PICName,
+// pic_position: values.PICPosition,
+// address: values.address,
+// state: parseInt(values.state),
+// city: parseInt(values.city),
+// district: parseInt(values.district),
+// subDistrict: parseInt(values.subDistrict),
+// zip: values.zip,
+// bank_name: values.bank,
+// rekening_name: values.rekening,
+// account_number: values.accountNumber,
+// email_company: values.email,
+// email_sales: values.emailSales,
+// email_finance: values.emailFinance,
+// phone: values.phone,
+// mobile: values.mobile,
+// bisnis_type: values.bisnisType,
+// category_perusahaan: values.categoryPerusahaan,
+// website: values.website,
+// description:
+// 'Nama Perusahaan : ' +
+// values.company +
+// ' \r\n Alamat : ' +
+// values.address +
+// ' \r\n Kota : ' +
+// values.city +
+// ' \r\n Telepon: ' +
+// values.phone +
+// ' \r\n Email : ' +
+// values.email +
+// ' \r\n No Hp : ' +
+// values.mobile,
+// };
+// const create_leads = await createMerchantApi({ data });
+// if (create_leads) {
+// toast.dismiss(toastId);
+// toast.success('Berhasil menambahkan data');
+// isError(false);
+// reset();
+// // router.push('/');
+// } else {
+// toast.dismiss(toastId);
+// toast.error('Gagal menambahkan data');
+// }
+// };
+
+// // const DownLoadSurat = () => {
+// // download surat dari /public/file/Surat Pernyataan Nomor Rekening.docx
+// // };
+
+// if (!auth) {
+// return;
+// }
+// // Tetap di bagian atas, tidak boleh ada kondisi sebelum hook
+
+
+
+// return (
+// <>
+// <BottomPopup
+// className=''
+// title='Contoh SPPKP'
+// active={isExample}
+// close={() => setIsExample(false)}
+// >
+// <div className='flex p-2'>
+// <Image
+// src='/images/NO-SPPKP-FORMAT-TEMPLATE.jpg'
+// alt='Contoh SPPKP'
+// className='w-full h-full '
+// width={800}
+// height={800}
+// quality={85}
+// />
+// </div>
+// </BottomPopup>
+// <DesktopView>
+// <div className='container flex flex-col items-star py-4 '>
+// <h2 className='text-xs md:text-title-sm font-semibold mb-6'>
+// Informasi Perusahaan
+// </h2>
+
+// <div className='w-full mt-4'>
+// <form
+// onSubmit={handleSubmit(onSubmitHandler)}
+// className='flex flex-col gap-4'
+// >
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Nama Perusahaan
+// </label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Isi detail perusahaan sesuai dengan nama yang terdaftar{' '}
+// </span>
+// )}
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('company')}
+// placeholder='Masukkan nama perusahaan'
+// type='text'
+// className='form-input'
+// />
+// <span className='opacity-65 text-xs'>
+// Format: PT. INDOTEKNIK DOTCOM GEMILANG
+// </span>
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.company?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Pejabat Berwenang
+// </label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// isi dengan nama pejabat yang berwewenang di perusahaan
+// anda
+// </span>
+// )}
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('pejabatName')}
+// placeholder='Masukkan nama pejabat berwenang'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.pejabatName?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>Nama PIC</label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// isi dengan nama sales / penanggung jawab
+// </span>
+// )}
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('PICName')}
+// placeholder='Masukkan nama PIC'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.PICName?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Jabatan PIC
+// </label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// isi dengan jabatan sales / penanggung jawab
+// </span>
+// )}
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('PICPosition')}
+// placeholder='Masukkan jabatan PIC'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.PICPosition?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Alamat Perusahaan
+// </label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Alamat sesuai dengan alamat perusahaan
+// </span>
+// )}
+// </div>
+// <div className='w-3/5 flex flex-col'>
+// <div>
+// <input
+// {...register('address')}
+// placeholder='Masukkan alamat lengkap perusahaan'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.address?.message}
+// </div>
+// </div>
+// <div
+// className={` sub-alamat flex ${
+// isKonfirmasi ? 'flex-col' : 'flex-row'
+// } w-full gap-3`}
+// >
+// <div
+// className={`flex ${
+// isKonfirmasi
+// ? ' flex-row gap-3 w-full'
+// : 'flex-row gap-3 w-2/5'
+// }`}
+// >
+// <div className='provinsi w-full'>
+// <Controller
+// name='state'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={state}
+// placeholder='Provinsi'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.state?.message}
+// </div>
+// </div>
+// <div className='kab w-full'>
+// <Controller
+// name='city'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={cities}
+// disabled={!watchState}
+// placeholder='Kab/Kota'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.city?.message}
+// </div>
+// </div>
+// </div>
+// <div
+// className={`flex-row flex gap-2 justify-between ${
+// isKonfirmasi ? 'w-full' : 'w-3/5'
+// }`}
+// >
+// <div className='kec w-full'>
+// <Controller
+// name='district'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={districts}
+// disabled={!watchState || !watchCity}
+// placeholder='Kecamatan'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.district?.message}
+// </div>
+// </div>
+// <div className='kel w-full'>
+// <Controller
+// name='subDistrict'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={subDistricts}
+// disabled={!watchDistrict}
+// placeholder='Kelurahan'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.subDistrict?.message}
+// </div>
+// </div>
+// <div className='zip w-full'>
+// <Controller
+// name='zip'
+// control={control}
+// render={(props) => (
+// <>
+// {/* Jika zips tidak kosong, tampilkan dropdown */}
+// {zips.length < 0 ? (
+// // Jika zips kosong, tampilkan input manual
+// <input
+// {...register('zip')}
+// placeholder='Kode Pos'
+// type='number'
+// className='form-input'
+// disabled={!watchsubDistrict}
+// />
+// ) : (
+// <HookFormSelect
+// {...props}
+// options={zips}
+// disabled={!watchsubDistrict}
+// placeholder='Zip'
+// />
+// )}
+// </>
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.zip?.message}
+// </div>
+// </div>
+// </div>
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>Data Bank</label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Isi detail data bank perusahaan anda
+// </span>
+// )}
+// </div>
+// <div className='w-3/5 flex flex-row gap-2'>
+// <div>
+// <input
+// {...register('bank')}
+// placeholder='Nama bank'
+// type='text'
+// className='form-input'
+// />
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Format: BCA, Mandiri, CIMB, BNI dll
+// </span>
+// )}
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.bank?.message}
+// </div>
+// </div>
+// <div>
+// <input
+// {...register('rekening')}
+// placeholder='Nama Rekening'
+// type='text'
+// className='form-input'
+// />
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Format: John Doe
+// </span>
+// )}
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.rekening?.message}
+// </div>
+// </div>
+// <div>
+// <input
+// {...register('accountNumber')}
+// placeholder='Nomor Rekening Bank'
+// type='number'
+// className='form-input'
+// />
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Format: 01234567896
+// </span>
+// )}
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.accountNumber?.message}
+// </div>
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Email Perusahaan
+// </label>
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('email')}
+// placeholder='contoh@email.com'
+// type='email'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.email?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Email Sales
+// </label>
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('emailSales')}
+// placeholder='contoh@email.com'
+// type='email'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.emailSales?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Email Finance
+// </label>
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('emailFinance')}
+// placeholder='contoh@email.com'
+// type='email'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.emailFinance?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// No. Telepon Perusahaan
+// </label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Isi no telepon perusahaan yang sesuai
+// </span>
+// )}
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('phone', {
+// required: 'Nomor telepon wajib diisi.',
+// pattern: {
+// value: /^\+?[0-9]{10,15}$/,
+// message: 'Nomor telepon tidak valid.',
+// },
+// })}
+// placeholder='Masukkan nomor telepon perusahaan'
+// type='tel'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.phone?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// No. Handphone
+// </label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// Isi no handphone perusahaan yang sesuai
+// </span>
+// )}
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('mobile')}
+// placeholder='Masukkan nomor handphone'
+// type='tel'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.mobile?.message}
+// </div>
+// </div>
+// </div>
+
+// <div className='flex flex-row justify-between items-center'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Tipe Bisnis
+// </label>
+// {!isKonfirmasi && (
+// <span className='text-xs opacity-60'>
+// Pilih tipe bisnis yang sesuai
+// </span>
+// )}
+// </div>
+// <div className='w-3/5 flex flex-col '>
+// <div className='flex flex-row items-center gap-3'>
+// <div
+// // className={`${isKonfirmasi ? 'w-[75%]' : 'w-[25%]'}`}
+// // ref={tempoDurationRef}
+// >
+// <Controller
+// name='bisnisType'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={dataBisnisType}
+// placeholder={'Pilih tipe bisnis'}
+// />
+// )}
+// />
+
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.bisnisType?.message}
+// </div>
+// </div>
+// </div>
+// </div>
+// </div>
+// <div className='flex flex-row justify-between items-center'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>
+// Kategori Perusahaan
+// </label>
+// {!isKonfirmasi && (
+// <span className='text-xs opacity-60'>
+// Pilih kategori perusahaan yang sesuai
+// </span>
+// )}
+// </div>
+// <div className='w-3/5 flex flex-col '>
+// <div className='flex flex-row items-center gap-3'>
+// <div
+// // className={`${isKonfirmasi ? 'w-[75%]' : 'w-[25%]'}`}
+// className='w-[55%]'
+// // ref={tempoDurationRef}
+// >
+// <Controller
+// name='categoryPerusahaan'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={dataCategoryPerusahaan}
+// placeholder={'Pilih category perusahaan'}
+// />
+// )}
+// />
+
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.categoryPerusahaan?.message}
+// </div>
+// </div>
+// </div>
+// </div>
+// </div>
+
+// <div className='w-full flex flex-row'>
+// <div className='w-2/5'>
+// <label className='form-label text-nowrap'>Website</label>
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// isi dengan website perusahaan anda
+// </span>
+// )}
+// </div>
+// <div className='w-3/5'>
+// <input
+// {...register('website')}
+// placeholder='Masukkan website'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.website?.message}
+// </div>
+// </div>
+// </div>
+
+// <div className=''>
+// {/* <div>
+// <ReCAPTCHA
+// ref={recaptchaRef}
+// sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE}
+// />
+// </div> */}
+// </div>
+// <div className='flex justify-end'>
+// {/* <Button
+// colorScheme='red'
+// className='w-full md:w-fit'
+// type='submit'
+// >
+// Daftar Merchant{' '}
+// {<ChevronRightIcon className='w-5' color='white' />}
+// </Button> */}
+// {!isKonfirmasi && (
+// <div>
+// <span className='text-xs opacity-60'>
+// *Pastikan data yang anda masukan sudah benar dan sesuai
+// </span>
+// <button
+// type='submit'
+// className='btn-light bg-red-500 rounded-lg text-white w-fit py-2 px-4 md:w-fit mt-2 ml-0 md:ml-auto flex justify-between hover:bg-red-400'
+// >
+// <span className={` `}>Langkah Selanjutnya</span>
+// {<ChevronRightIcon className='w-5' />}
+// </button>
+// </div>
+// )}
+// </div>
+// </form>
+// <PageContent path='/daftar-merchant' />
+// </div>
+// </div>
+// </DesktopView>
+// <MobileView>
+// <div className='container flex flex-col items-star py-4'>
+// {!isKonfirmasi && (
+// <h2 className='font-semibold mb-6 text-xl'>
+// Informasi Perusahaan
+// </h2>
+// )}
+
+// <div className='w-full mt-4'>
+// <form
+// onSubmit={handleSubmit(onSubmitHandler)}
+// className='flex flex-col gap-4'
+// >
+// <div className='w-full flex flex-col'>
+// <div className='w-full'>
+// <label className='form-label text-nowrap'>
+// Nama Perusahaan
+// </label>
+// <input
+// {...register('company')}
+// placeholder='Format: PT. INDOTEKNIK DOTCOM GEMILANG'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.company?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi detail perusahaan sesuai dengan nama yang terdaftar{' '}
+// </span>
+// </div>
+// </div>
+// <div className='w-full flex flex-col'>
+// <div className='w-full'>
+// <label className='form-label text-nowrap'>
+// Pejabat Berwenang
+// </label>
+// <input
+// {...register('pejabatName')}
+// placeholder='Masukkan nama pejabat berwenang'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.pejabatName?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// isi dengan nama pejabat yang berwewenang di perusahaan
+// anda{' '}
+// </span>
+// </div>
+// </div>
+// <div className='w-full flex flex-col'>
+// <div className='w-full'>
+// <label className='form-label text-nowrap'>Nama PIC</label>
+// <input
+// {...register('PICName')}
+// placeholder='Masukkan Nama PIC '
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.PICName?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi dengan nama sales / penanggung jawab
+// </span>
+// </div>
+// </div>
+// <div className='w-full flex flex-col'>
+// <div className='w-full'>
+// <label className='form-label text-nowrap'>
+// Jabatan PIC
+// </label>
+// <input
+// {...register('PICPosition')}
+// placeholder='Masukkan jabatan PIC '
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.PICPosition?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// isi dengan jabatan sales / penanggung jawab
+// </span>
+// </div>
+// </div>
+// <div className='w-full flex flex-col'>
+// <div className='w-full'>
+// <label className='form-label text-nowrap'>
+// Alamat Perusahaan
+// </label>
+// <input
+// {...register('address')}
+// placeholder='Masukkan alamat lengkap perusahaan'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.address?.message}
+// </div>
+// <div className='flex flex-row w-full justify-between gap-2'>
+// <div className='provinsi w-full'>
+// <Controller
+// name='state'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={state}
+// placeholder='Provinsi'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.state?.message}
+// </div>
+// </div>
+// <div className='kab w-full'>
+// <Controller
+// name='city'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={cities}
+// disabled={!watchState}
+// placeholder='Kab/Kota'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.city?.message}
+// </div>
+// </div>
+// </div>
+// <div className='flex flex-row w-full justify-between gap-2'>
+// <div className='kec w-full'>
+// <Controller
+// name='district'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={districts}
+// disabled={!watchState || !watchCity}
+// placeholder='Kecamatan'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.district?.message}
+// </div>
+// </div>
+// <div className='kel w-full'>
+// <Controller
+// name='subDistrict'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={subDistricts}
+// disabled={!watchDistrict}
+// placeholder='Kelurahan'
+// />
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.subDistrict?.message}
+// </div>
+// </div>
+// <div className='zip w-full'>
+// <Controller
+// name='zip'
+// control={control}
+// render={(props) => (
+// <>
+// {zips.length > 0 ? (
+// <HookFormSelect
+// {...props}
+// options={zips}
+// disabled={!watchsubDistrict}
+// placeholder='Zip'
+// />
+// ) : (
+// <input
+// {...register('zip')}
+// placeholder='Kode Pos'
+// type='number'
+// className='form-input'
+// disabled={!watchsubDistrict}
+// />
+// )}
+// </>
+// )}
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.zip?.message}
+// </div>
+// </div>
+// </div>
+// </div>
+// <span className='opacity-65 text-xs'>
+// Alamat sesuai dengan alamat perusahaan
+// </span>
+// </div>
+// <div className='w-full flex flex-col'>
+// <label className='form-label text-nowrap'>Data Bank</label>
+// <div className='w-full flex flex-row gap-2'>
+// <div>
+// <input
+// {...register('bank')}
+// placeholder='Nama bank'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.bank?.message}
+// </div>
+// </div>
+// <div>
+// <input
+// {...register('rekening')}
+// placeholder='Nama Rekening'
+// type='text'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.rekening?.message}
+// </div>
+// </div>
+// <div>
+// <input
+// {...register('accountNumber')}
+// placeholder='Nomor Rekening Bank'
+// type='number'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.accountNumber?.message}
+// </div>
+// </div>
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi detail data bank perusahaan anda
+// </span>
+// </div>
+// <div className='w-full flex flex-col'>
+// <label className='form-label text-nowrap'>
+// Email Perusahaan
+// </label>
+// <input
+// {...register('email')}
+// placeholder='contoh@email.com'
+// type='email'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.email?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi detail perusahaan sesuai dengan data yang terdaftar
+// </span>
+// </div>
+// <div className='w-full flex flex-col'>
+// <label className='form-label text-nowrap'>Email Sales</label>
+// <input
+// {...register('emailSales')}
+// placeholder='contoh@email.com'
+// type='email'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.emailSales?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi detail perusahaan sesuai dengan data yang terdaftar
+// </span>
+// </div>
+// <div className='w-full flex flex-col'>
+// <label className='form-label text-nowrap'>
+// Email Finance
+// </label>
+// <input
+// {...register('emailFinance')}
+// placeholder='contoh@email.com'
+// type='email'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.emailFinance?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi detail perusahaan sesuai dengan data yang terdaftar
+// </span>
+// </div>
+// <div className='w-full flex flex-col'>
+// <label className='form-label text-nowrap'>
+// No. Telepon Perusahaan
+// </label>
+// <input
+// {...register('phone')}
+// placeholder='Format: 08123456789 / (021) 123 4567'
+// type='tel'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.phone?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi detail perusahaan sesuai dengan data yang terdaftar
+// </span>
+// </div>
+// <div className='w-full flex flex-col'>
+// <label className='form-label text-nowrap'>
+// No. Handphone
+// </label>
+// <input
+// {...register('mobile')}
+// placeholder='Masukkan nomor handphone'
+// type='tel'
+// className='form-input'
+// />
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.mobile?.message}
+// </div>
+// <span className='opacity-65 text-xs'>
+// Isi detail perusahaan sesuai dengan data yang terdaftar
+// </span>
+// </div>
+// <div className='flex flex-col'>
+// <label className='form-label text-nowrap'>Tipe Bisnis</label>
+// <div className='flex flex-col '>
+// <Controller
+// name='bisnisType'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={dataBisnisType}
+// placeholder={'Pilih tipe bisnis'}
+// />
+// )}
+// />
+// {!isKonfirmasi && (
+// <span className='text-xs opacity-60'>
+// Pilih tipe bisnis yang sesuai
+// </span>
+// )}
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.bisnisType?.message}
+// </div>
+// </div>
+// </div>
+// <div className='flex flex-col'>
+// <label className='form-label text-nowrap'>
+// Kategori Perusahaan
+// </label>
+// <div className='flex flex-col '>
+// <Controller
+// name='categoryPerusahaan'
+// control={control}
+// render={(props) => (
+// <HookFormSelect
+// {...props}
+// options={dataCategoryPerusahaan}
+// placeholder={'Pilih category perusahaan'}
+// />
+// )}
+// />
+// {!isKonfirmasi && (
+// <span className='text-xs opacity-60'>
+// Pilih kategori perusahaan yang sesuai
+// </span>
+// )}
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.categoryPerusahaan?.message}
+// </div>
+// </div>
+// </div>
+// <div className='w-full flex flex-col'>
+// <label className='form-label text-nowrap'>Website</label>
+// <input
+// {...register('website')}
+// placeholder='Masukkan website'
+// type='text'
+// className='form-input'
+// />
+// {!isKonfirmasi && (
+// <span className='opacity-65 text-xs'>
+// isi dengan website perusahaan anda
+// </span>
+// )}
+// <div className='text-caption-2 text-danger-500 mt-1'>
+// {errors.website?.message}
+// </div>
+// </div>
+
+// <div className=''>
+// {/* <div>
+// <ReCAPTCHA
+// ref={recaptchaRef}
+// sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_GOOGLE}
+// />
+// </div> */}
+// </div>
+// <div className='flex justify-center w-full '>
+// {/* <Button
+// colorScheme='red'
+// className='w-full md:w-fit'
+// type='submit'
+// >
+// Daftar Merchant{' '}
+// {<ChevronRightIcon className='w-5' color='white' />}
+// </Button> */}
+// {!isKonfirmasi && (
+// <div className='w-full'>
+// <span className='text-xs opacity-60'>
+// *Pastikan data yang anda masukan sudah benar dan sesuai
+// </span>
+// <button
+// type='submit'
+// className='btn-light bg-red-500 rounded-lg text-white w-full py-2 px-4 md:w-fit mt-2 ml-0 md:ml-auto flex justify-center hover:bg-red-400'
+// >
+// <span className={` `}>Langkah Selanjutnya</span>
+// {<ChevronRightIcon className='w-5' />}
+// </button>
+// </div>
+// )}
+// </div>
+// </form>
+// <PageContent path='/daftar-merchant' />
+// </div>
+// </div>
+// </MobileView>
+// </>
+// );
+// }
+// );
+
+// const validationSchema = Yup.object().shape({
+// company: Yup.string().required('Harus di-isi'),
+// pejabatName: Yup.string().required('Harus di-isi'),
+// PICName: Yup.string().required('Harus di-isi'),
+// PICPosition: Yup.string().required('Harus di-isi'),
+// address: Yup.string().required('Harus di-isi'),
+// state: Yup.string().required('Harus dipilih'),
+// city: Yup.string().required('Harus dipilih'),
+// district: Yup.string().required('Harus dipilih'),
+// subDistrict: Yup.string().required('Harus dipilih'),
+// zip: Yup.string().required('Harus di-isi'),
+// bank: Yup.string().required('Harus di-isi'),
+// rekening: Yup.string().required('Harus di-isi'),
+// accountNumber: Yup.string().required('Harus di-isi'),
+// email: Yup.string()
+// .email('Format harus seperti contoh@email.com')
+// .required('Harus di-isi'),
+// emailSales: Yup.string()
+// .email('Format harus seperti contoh@email.com')
+// .required('Harus di-isi'),
+// emailFinance: Yup.string()
+// .email('Format harus seperti contoh@email.com')
+// .required('Harus di-isi'),
+// phone: Yup.string().required('Harus di-isi'),
+// mobile: Yup.string().required('Harus di-isi'),
+// bisnisType: Yup.string().required('Harus dipilih'),
+// categoryPerusahaan: Yup.string().required('Harus dipilih'),
+// });
+// const defaultValues = {
+// company: '',
+// pejabatName: '',
+// PICName: '',
+// PICPosition: '',
+// address: '',
+// state: '',
+// city: '',
+// district: '',
+// subDistrict: '',
+// zip: '',
+// email: '',
+// emailSales: '',
+// emailFinance: '',
+// bank: '',
+// rekening: '',
+// accountNumber: '',
+// phone: '',
+// mobile: '',
+// };
+
+// export default CreateMerchant;
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-17 22:28:08 +0000