efril #6
99
src/views/apps/vendor/list/AddVendorDrawer.tsx
vendored
99
src/views/apps/vendor/list/AddVendorDrawer.tsx
vendored
@ -57,6 +57,7 @@ const AddVendorDrawer = (props: Props) => {
|
||||
nomorRekening: ''
|
||||
}
|
||||
])
|
||||
const [showPemetaanAkun, setShowPemetaanAkun] = useState(false)
|
||||
|
||||
// Hooks
|
||||
const {
|
||||
@ -137,6 +138,7 @@ const AddVendorDrawer = (props: Props) => {
|
||||
}
|
||||
])
|
||||
setShowMore(false)
|
||||
setShowPemetaanAkun(false)
|
||||
}
|
||||
|
||||
const handleReset = () => {
|
||||
@ -152,6 +154,7 @@ const AddVendorDrawer = (props: Props) => {
|
||||
}
|
||||
])
|
||||
setShowMore(false)
|
||||
setShowPemetaanAkun(false)
|
||||
}
|
||||
|
||||
return (
|
||||
@ -531,6 +534,102 @@ const AddVendorDrawer = (props: Props) => {
|
||||
</Typography>
|
||||
</div>
|
||||
|
||||
<div className='flex items-center gap-3 mt-2' onClick={() => setShowPemetaanAkun(!showPemetaanAkun)}>
|
||||
<i className={showPemetaanAkun ? 'tabler-minus text-blue-500' : 'tabler-plus text-blue-500'} />
|
||||
<Typography variant='body1' color='primary' className='cursor-pointer'>
|
||||
{showPemetaanAkun ? 'Sembunyikan pemetaan akun' : 'Tampilkan pemetaan akun'}
|
||||
</Typography>
|
||||
</div>
|
||||
|
||||
{/* Konten Pemetaan Akun */}
|
||||
{showPemetaanAkun && (
|
||||
<div className='mt-6 p-4 border border-gray-200 rounded-lg'>
|
||||
{/* Akun Hutang */}
|
||||
<Grid container spacing={6} className='mb-4'>
|
||||
<Grid size={6}>
|
||||
<Typography variant='body2' className='mb-2 font-medium'>
|
||||
Akun Hutang
|
||||
</Typography>
|
||||
<CustomTextField select fullWidth defaultValue='2-20100 Hutang Usaha'>
|
||||
<MenuItem value='2-20100 Hutang Usaha'>2-20100 Hutang Usaha</MenuItem>
|
||||
<MenuItem value='2-20200 Hutang Bank'>2-20200 Hutang Bank</MenuItem>
|
||||
<MenuItem value='2-20300 Hutang Lainnya'>2-20300 Hutang Lainnya</MenuItem>
|
||||
</CustomTextField>
|
||||
</Grid>
|
||||
<Grid size={6}>
|
||||
<Typography variant='body2' className='mb-2 font-medium'>
|
||||
Maksimal Hutang
|
||||
<i className='tabler-help-circle text-gray-400 ml-1' />
|
||||
</Typography>
|
||||
<CustomTextField fullWidth type='number' defaultValue='0' placeholder='0' />
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
{/* Akun Piutang */}
|
||||
<Grid container spacing={6} className='mb-4'>
|
||||
<Grid size={6}>
|
||||
<Typography variant='body2' className='mb-2 font-medium'>
|
||||
Akun Piutang
|
||||
</Typography>
|
||||
<CustomTextField select fullWidth defaultValue='1-10100 Piutang Usaha'>
|
||||
<MenuItem value='1-10100 Piutang Usaha'>1-10100 Piutang Usaha</MenuItem>
|
||||
<MenuItem value='1-10200 Piutang Karyawan'>1-10200 Piutang Karyawan</MenuItem>
|
||||
<MenuItem value='1-10300 Piutang Lainnya'>1-10300 Piutang Lainnya</MenuItem>
|
||||
</CustomTextField>
|
||||
</Grid>
|
||||
<Grid size={6}>
|
||||
<Typography variant='body2' className='mb-2 font-medium'>
|
||||
Maksimal Piutang
|
||||
<i className='tabler-help-circle text-gray-400 ml-1' />
|
||||
</Typography>
|
||||
<CustomTextField fullWidth type='number' defaultValue='0' placeholder='0' />
|
||||
</Grid>
|
||||
</Grid>
|
||||
|
||||
{/* Kena Pajak */}
|
||||
<div className='mb-4'>
|
||||
<Typography variant='body2' className='mb-3 font-medium'>
|
||||
Kena pajak ?
|
||||
</Typography>
|
||||
<div className='flex items-center'>
|
||||
<input
|
||||
type='checkbox'
|
||||
className='toggle-switch'
|
||||
style={{
|
||||
appearance: 'none',
|
||||
width: '60px',
|
||||
height: '30px',
|
||||
backgroundColor: '#3b82f6',
|
||||
borderRadius: '15px',
|
||||
position: 'relative',
|
||||
cursor: 'pointer',
|
||||
outline: 'none'
|
||||
}}
|
||||
/>
|
||||
<style>
|
||||
{`
|
||||
.toggle-switch::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
left: 3px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background-color: white;
|
||||
border-radius: 50%;
|
||||
transition: transform 0.3s ease;
|
||||
transform: translateX(0);
|
||||
}
|
||||
.toggle-switch:checked::before {
|
||||
transform: translateX(30px);
|
||||
}
|
||||
`}
|
||||
</style>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Grid container spacing={6} className='mt-4'>
|
||||
<Grid size={6}>
|
||||
<Typography variant='body2' className='mb-2'>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user