gitea-admin/lti-web-client
1
0
Fork 0
mirror of https://gitlab.com/mbugroup/lti-web-client.git synced 2026-05-20 13:32:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(FE-62): replace native checkboxes with CheckboxInput component in MovementForm

Browse Source
This commit is contained in:
rstubryan
2025-10-21 11:26:15 +07:00
parent c746bd94b2
commit 41bb05413c
1 changed files with 54 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/inventory/movement/form/MovementForm.tsx
+54 -45
View File
@@ -29,6 +29,7 @@ import { ProductWarehouseApi } from '@/services/api/inventory';
import { toast } from 'react-hot-toast'; import { toast } from 'react-hot-toast';
import FileInput from '@/components/input/FileInput'; import FileInput from '@/components/input/FileInput';
import FieldMessage from '@/components/helper/FieldMessage'; import FieldMessage from '@/components/helper/FieldMessage';
import CheckboxInput from '@/components/input/CheckboxInput';
interface MovementFormProps { interface MovementFormProps {
type?: 'add' | 'edit' | 'detail'; type?: 'add' | 'edit' | 'detail';
@@ -831,26 +832,29 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
<tr> <tr>
{type !== 'detail' && ( {type !== 'detail' && (
<th> <th>
<input <div className='flex justify-center'>
type='checkbox' <CheckboxInput
className='checkbox' name='select-all-products'
checked={ checked={
formik.values.products?.length === formik.values.products?.length ===
selectedProducts.length && selectedProducts.length &&
formik.values.products?.length > 0 formik.values.products?.length > 0
}
onChange={(e) => {
if (e.target.checked) {
setSelectedProducts(
formik.values.products?.map(
(_, idx) => idx
) ?? []
);
} else {
setSelectedProducts([]);
} }
}} onChange={(e) => {
/> if (e.target.checked) {
setSelectedProducts(
formik.values.products?.map(
(_, idx) => idx
) ?? []
);
} else {
setSelectedProducts([]);
}
}}
naked={true}
size='sm'
/>
</div>
</th> </th>
)} )}
<th>Produk</th> <th>Produk</th>
@@ -863,10 +867,9 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
<tr key={`product-row-${idx}-${product.product_id}`}> <tr key={`product-row-${idx}-${product.product_id}`}>
{type !== 'detail' && ( {type !== 'detail' && (
<td> <td>
<div className='flex flex-col items-start gap-2'> <div className='flex flex-col items-center gap-2'>
<input <CheckboxInput
type='checkbox' name={`product-${idx}`}
className='checkbox'
checked={selectedProducts.includes(idx)} checked={selectedProducts.includes(idx)}
onChange={(e) => { onChange={(e) => {
if (e.target.checked) { if (e.target.checked) {
@@ -880,6 +883,8 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
); );
} }
}} }}
naked={true}
size='sm'
/> />
<FieldMessage message={null} isVisible={false} /> <FieldMessage message={null} isVisible={false} />
</div> </div>
@@ -1019,26 +1024,29 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
<tr> <tr>
{type !== 'detail' && ( {type !== 'detail' && (
<th> <th>
<input <div className='flex justify-center'>
type='checkbox' <CheckboxInput
className='checkbox' name='select-all-deliveries'
checked={ checked={
formik.values.deliveries?.length === formik.values.deliveries?.length ===
selectedDeliveries.length && selectedDeliveries.length &&
formik.values.deliveries?.length > 0 formik.values.deliveries?.length > 0
}
onChange={(e) => {
if (e.target.checked) {
setSelectedDeliveries(
formik.values.deliveries?.map(
(_, idx) => idx
) ?? []
);
} else {
setSelectedDeliveries([]);
} }
}} onChange={(e) => {
/> if (e.target.checked) {
setSelectedDeliveries(
formik.values.deliveries?.map(
(_, idx) => idx
) ?? []
);
} else {
setSelectedDeliveries([]);
}
}}
naked={true}
size='sm'
/>
</div>
</th> </th>
)} )}
<th>Produk</th> <th>Produk</th>
@@ -1058,9 +1066,8 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
{type !== 'detail' && ( {type !== 'detail' && (
<td> <td>
<div className='flex flex-col items-start gap-2'> <div className='flex flex-col items-start gap-2'>
<input <CheckboxInput
type='checkbox' name={`delivery-${idx}`}
className='checkbox'
checked={selectedDeliveries.includes(idx)} checked={selectedDeliveries.includes(idx)}
onChange={(e) => { onChange={(e) => {
if (e.target.checked) { if (e.target.checked) {
@@ -1076,6 +1083,8 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
); );
} }
}} }}
naked={true}
size='sm'
/> />
<FieldMessage message={null} isVisible={false} /> <FieldMessage message={null} isVisible={false} />
</div> </div>