From e9cd13307f0095dc4edc5048752675d80c551564 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 6 Dec 2024 17:06:26 +0700
Subject: <iman> pengajuan tempo

---
 .../pengajuan-tempo/component/KontakPerusahaan.jsx | 245 ++++++++++++++-------
 1 file changed, 171 insertions(+), 74 deletions(-)

(limited to 'src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx')

diff --git a/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx b/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx
index e7bfdbbe..d5bb69fb 100644
--- a/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx
+++ b/src/lib/pengajuan-tempo/component/KontakPerusahaan.jsx
@@ -11,6 +11,7 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   const { isDesktop, isMobile } = useDevice();
   const handleInputChange = (event) => {
     const { name, value } = event.target;
+    console.log('name', name, value);
     updateFormKontakPerson(name, value);
     validateKontakPerson();
   };
@@ -84,6 +85,7 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
   useEffect(() => {
     validateKontakPerson();
   }, [buttonSubmitClick]);
+  console.log('formKontakPerson', formKontakPerson);
   return (
     <>
       {isDesktop && (
@@ -93,24 +95,42 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
           </h1>
           <form className='flex flex-col w-full '>
             <div className='w-full grid grid-row-2 gap-5'>
-              <div className='flex flex-row  justify-between items-start'>
+              <div className='flex flex-row justify-between items-start'>
                 <div className='w-2/5'>
-                  <label className='form-label  text-nowrap'>
+                  <label className='form-label text-nowrap'>
                     Nama Lengkap Direktur
                   </label>
                 </div>
                 <div className='w-3/5'>
-                  <input
-                    value={formKontakPerson.direkturName}
-                    id='direkturName'
-                    name='direkturName'
-                    placeholder='Masukkan nama direktur anda'
-                    type='text'
-                    className='form-input'
-                    aria-invalid={errorsKontakPerson.direkturName}
-                    ref={direkturNameRef}
-                    onChange={handleInputChange}
-                  />
+                  <div className='flex items-center border border-gray-300 rounded-md'>
+                    {/* Dropdown untuk memilih "Bpk" atau "Ibu" */}
+                    <select
+                      value={formKontakPerson.direkturTittle || ''}
+                      id='direkturTittle'
+                      name='direkturTittle'
+                      className=' p-2   rounded-l-md'
+                      onChange={handleInputChange}
+                    >
+                      <option value='' disabled>
+                        Pilih
+                      </option>
+                      <option value='Bpk'>Bpk</option>
+                      <option value='Ibu'>Ibu</option>
+                    </select>
+
+                    {/* Input untuk nama */}
+                    <input
+                      value={formKontakPerson.direkturName}
+                      id='direkturName'
+                      name='direkturName'
+                      placeholder='Masukkan nama direktur anda'
+                      type='text'
+                      className='form-input border-l  border-r-0 border-t-0 border-b-0 border-gray-300 p-2 ml-2 flex-grow rounded-none'
+                      aria-invalid={errorsKontakPerson.direkturName}
+                      ref={direkturNameRef}
+                      onChange={handleInputChange}
+                    />
+                  </div>
                   {chekValid && (
                     <div className='text-caption-2 text-danger-500 mt-1'>
                       {errorsKontakPerson.direkturName}
@@ -122,7 +142,8 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               <div className='flex flex-row  justify-between items-start'>
                 <div className='w-2/5'>
                   <label className='form-label text-nowrap'>
-                    No. Telpon Direktur
+                    No. HP Direktur{' '}
+                    <span className=' opacity-60'>(Opsional)</span>
                   </label>
                   {!isKonfirmasi && (
                     <span className='text-xs opacity-60'>
@@ -194,17 +215,32 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   )}
                 </div>
                 <div className='w-3/5'>
-                  <input
-                    id='purchasingName'
-                    name='purchasingName'
-                    ref={purchasingNameRef}
-                    placeholder='Masukkan nama purchasing anda'
-                    value={formKontakPerson.purchasingName}
-                    type='text'
-                    className='form-input'
-                    aria-invalid={errorsKontakPerson.purchasingName}
-                    onChange={handleInputChange}
-                  />
+                  <div className='flex items-center border border-gray-300 rounded-md'>
+                    <select
+                      value={formKontakPerson.purchasingTittle || ''}
+                      id='purchasingTittle'
+                      name='purchasingTittle'
+                      className=' p-2   rounded-l-md'
+                      onChange={handleInputChange}
+                    >
+                      <option value='' disabled>
+                        Pilih
+                      </option>
+                      <option value='Bpk'>Bpk</option>
+                      <option value='Ibu'>Ibu</option>
+                    </select>
+                    <input
+                      id='purchasingName'
+                      name='purchasingName'
+                      ref={purchasingNameRef}
+                      placeholder='Masukkan nama purchasing anda'
+                      value={formKontakPerson.purchasingName}
+                      type='text'
+                      className='form-input border-l border-r-0 border-t-0 border-b-0 border-gray-300 p-2 ml-2 flex-grow rounded-none'
+                      aria-invalid={errorsKontakPerson.purchasingName}
+                      onChange={handleInputChange}
+                    />
+                  </div>
                   {chekValid && (
                     <div className='text-caption-2 text-danger-500 mt-1'>
                       {errorsKontakPerson.purchasingName}
@@ -216,7 +252,7 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               <div className='flex flex-row  justify-between items-start'>
                 <div className='w-2/5'>
                   <label className='form-label  text-nowrap'>
-                    No. Telpon Purchasing
+                    No. HP Purchasing
                   </label>
                   {!isKonfirmasi && (
                     <span className='text-xs opacity-60'>
@@ -288,17 +324,32 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                   )}
                 </div>
                 <div className='w-3/5'>
-                  <input
-                    id='financeName'
-                    name='financeName'
-                    ref={financeNameRef}
-                    placeholder='Masukkan nama finance'
-                    value={formKontakPerson.financeName}
-                    type='text'
-                    className='form-input'
-                    aria-invalid={errorsKontakPerson.financeName}
-                    onChange={handleInputChange}
-                  />
+                  <div className='flex items-center border border-gray-300 rounded-md'>
+                    <select
+                      value={formKontakPerson.financeTittle || ''}
+                      id='financeTittle'
+                      name='financeTittle'
+                      className=' p-2   rounded-l-md'
+                      onChange={handleInputChange}
+                    >
+                      <option value='' disabled>
+                        Pilih
+                      </option>
+                      <option value='Bpk'>Bpk</option>
+                      <option value='Ibu'>Ibu</option>
+                    </select>
+                    <input
+                      id='financeName'
+                      name='financeName'
+                      ref={financeNameRef}
+                      placeholder='Masukkan nama finance'
+                      value={formKontakPerson.financeName}
+                      type='text'
+                      className='form-input border-l border-r-0 border-t-0 border-b-0 border-gray-300 p-2 ml-2 flex-grow rounded-none'
+                      aria-invalid={errorsKontakPerson.financeName}
+                      onChange={handleInputChange}
+                    />
+                  </div>
                   {chekValid && (
                     <div className='text-caption-2 text-danger-500 mt-1'>
                       {errorsKontakPerson.financeName}
@@ -309,7 +360,7 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               <div className='flex flex-row  justify-between items-start'>
                 <div className='w-2/5'>
                   <label className='form-label   text-nowrap'>
-                    No. Telpon Finance
+                    No. HP Finance
                   </label>
                   {!isKonfirmasi && (
                     <span className='text-xs opacity-60'>
@@ -387,17 +438,32 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <label className='form-label  text-nowrap'>
                   Nama Lengkap Direktur
                 </label>
-                <input
-                  value={formKontakPerson.direkturName}
-                  id='direkturName'
-                  name='direkturName'
-                  placeholder='Masukkan nama direktur anda'
-                  type='text'
-                  className='form-input'
-                  aria-invalid={errorsKontakPerson.direkturName}
-                  ref={direkturNameRef}
-                  onChange={handleInputChange}
-                />
+                <div className='flex items-center border border-gray-300 rounded-md w-full'>
+                  <select
+                    value={formKontakPerson.direkturTittle || ''}
+                    id='direkturTittle'
+                    name='direkturTittle'
+                    className=' p-2   rounded-l-md'
+                    onChange={handleInputChange}
+                  >
+                    <option value='' disabled>
+                      Pilih
+                    </option>
+                    <option value='Bpk'>Bpk</option>
+                    <option value='Ibu'>Ibu</option>
+                  </select>
+                  <input
+                    value={formKontakPerson.direkturName}
+                    id='direkturName'
+                    name='direkturName'
+                    placeholder='Masukkan nama direktur anda'
+                    type='text'
+                    className='form-input border-l border-r-0 border-t-0 border-b-0 border-gray-300 p-2 ml-2 flex-grow rounded-none'
+                    aria-invalid={errorsKontakPerson.direkturName}
+                    ref={direkturNameRef}
+                    onChange={handleInputChange}
+                  />
+                </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsKontakPerson.direkturName}
@@ -407,7 +473,8 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
 
               <div className='flex flex-col gap-2  justify-between items-start'>
                 <label className='form-label text-nowrap'>
-                  No. Telpon Direktur
+                  No. HP Direktur{' '}
+                  <span className=' opacity-60'>(Opsional)</span>
                 </label>
                 <input
                   id='direkturMobile'
@@ -453,17 +520,32 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
                 <label className='form-label text-nowrap'>
                   Nama Purchasing
                 </label>
-                <input
-                  id='purchasingName'
-                  name='purchasingName'
-                  ref={purchasingNameRef}
-                  placeholder='Masukkan nama purchasing anda'
-                  value={formKontakPerson.purchasingName}
-                  type='text'
-                  className='form-input'
-                  aria-invalid={errorsKontakPerson.purchasingName}
-                  onChange={handleInputChange}
-                />
+                <div className='flex items-center border border-gray-300 rounded-md w-full'>
+                  <select
+                    value={formKontakPerson.purchasingTittle || ''}
+                    id='purchasingTittle'
+                    name='purchasingTittle'
+                    className=' p-2   rounded-l-md'
+                    onChange={handleInputChange}
+                  >
+                    <option value='' disabled>
+                      Pilih
+                    </option>
+                    <option value='Bpk'>Bpk</option>
+                    <option value='Ibu'>Ibu</option>
+                  </select>
+                  <input
+                    id='purchasingName'
+                    name='purchasingName'
+                    ref={purchasingNameRef}
+                    placeholder='Masukkan nama purchasing anda'
+                    value={formKontakPerson.purchasingName}
+                    type='text'
+                    className='form-input border-l border-r-0 border-t-0 border-b-0 border-gray-300 p-2 ml-2 flex-grow rounded-none'
+                    aria-invalid={errorsKontakPerson.purchasingName}
+                    onChange={handleInputChange}
+                  />
+                </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsKontakPerson.purchasingName}
@@ -473,7 +555,7 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
 
               <div className='flex flex-col gap-2  justify-between items-start'>
                 <label className='form-label  text-nowrap'>
-                  No. Telpon Purchasing
+                  No. HP Purchasing
                 </label>
                 <input
                   id='purchasingMobile'
@@ -517,17 +599,32 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
 
               <div className='flex flex-col gap-2  justify-between items-start'>
                 <label className='form-label  text-nowrap'>Nama Finance</label>
-                <input
-                  id='financeName'
-                  name='financeName'
-                  ref={financeNameRef}
-                  placeholder='Masukkan nama finance'
-                  value={formKontakPerson.financeName}
-                  type='text'
-                  className='form-input'
-                  aria-invalid={errorsKontakPerson.financeName}
-                  onChange={handleInputChange}
-                />
+                <div className='flex items-center border border-gray-300 rounded-md w-full'>
+                  <select
+                    value={formKontakPerson.financeTittle || ''}
+                    id='financeTittle'
+                    name='financeTittle'
+                    className=' p-2   rounded-l-md'
+                    onChange={handleInputChange}
+                  >
+                    <option value='' disabled>
+                      Pilih
+                    </option>
+                    <option value='Bpk'>Bpk</option>
+                    <option value='Ibu'>Ibu</option>
+                  </select>
+                  <input
+                    id='financeName'
+                    name='financeName'
+                    ref={financeNameRef}
+                    placeholder='Masukkan nama finance'
+                    value={formKontakPerson.financeName}
+                    type='text'
+                    className='form-input border-l border-r-0 border-t-0 border-b-0 border-gray-300 p-2 ml-2 flex-grow rounded-none'
+                    aria-invalid={errorsKontakPerson.financeName}
+                    onChange={handleInputChange}
+                  />
+                </div>
                 {chekValid && (
                   <div className='text-caption-2 text-danger-500 mt-1'>
                     {errorsKontakPerson.financeName}
@@ -536,7 +633,7 @@ const KontakPerusahaan = ({ chekValid, buttonSubmitClick, isKonfirmasi }) => {
               </div>
               <div className='flex flex-col gap-2  justify-between items-start'>
                 <label className='form-label   text-nowrap'>
-                  No. Telpon Finance
+                  No. HP Finance
                 </label>
                 <input
                   id='financeMobile'
-- 
cgit v1.2.3