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

chore(FE-188,193): adjust ExpenseRequestKandangDetailExpense component

Browse Source
This commit is contained in:
ValdiANS
2025-11-25 09:17:02 +07:00
parent e4a6b22357
commit b868a37485
1 changed files with 174 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/expense/form/ExpenseRequestKandangDetailExpense.tsx
+32 -27
View File
@@ -41,28 +41,28 @@ const ExpenseRequestKandangDetailExpense: React.FC<
val: OptionType | OptionType[] | null val: OptionType | OptionType[] | null
) => { ) => {
formik.setFieldTouched( formik.setFieldTouched(
`kandangExpenses[${kandangExpenseIdx}].expenses[${expenseIdx}].nonstock`, `cost_per_kandangs[${kandangExpenseIdx}].cost_items[${expenseIdx}].nonstock`,
true true
); );
formik.setFieldValue( formik.setFieldValue(
`kandangExpenses[${kandangExpenseIdx}].expenses[${expenseIdx}].nonstock`, `cost_per_kandangs[${kandangExpenseIdx}].cost_items[${expenseIdx}].nonstock`,
val val
); );
}; };
const addExpenseItemHandler = (kandangExpenseIdx: number) => { const addExpenseItemHandler = (kandangExpenseIdx: number) => {
const newExpensesValue = [ const newExpensesValue = [
...formik.values.kandangExpenses[kandangExpenseIdx].expenses, ...formik.values.cost_per_kandangs[kandangExpenseIdx].cost_items,
{ {
nonstock: undefined, nonstock: undefined,
totalExpense: undefined, total_cost: undefined,
totalQuantity: undefined, quantity: undefined,
notes: '', notes: '',
}, },
]; ];
formik.setFieldValue( formik.setFieldValue(
`kandangExpenses[${kandangExpenseIdx}].expenses`, `cost_per_kandangs[${kandangExpenseIdx}].cost_items`,
newExpensesValue newExpensesValue
); );
}; };
@@ -71,27 +71,28 @@ const ExpenseRequestKandangDetailExpense: React.FC<
kandangExpenseIdx: number, kandangExpenseIdx: number,
expenseIdx: number expenseIdx: number
) => { ) => {
const path = `kandangExpenses[${kandangExpenseIdx}].expenses`; const path = `cost_per_kandangs[${kandangExpenseIdx}].cost_items`;
// trims values, errors, and touched at expenseIdx // trims values, errors, and touched at expenseIdx
removeArrayItemAndSync(formik, path, expenseIdx); removeArrayItemAndSync(formik, path, expenseIdx);
}; };
const isExpenseRepeaterInputError = ( const isExpenseRepeaterInputError = (
column: 'nonstock' | 'totalQuantity' | 'totalExpense' | 'notes', column: 'nonstock' | 'quantity' | 'total_cost' | 'notes',
kandangExpenseIdx: number, kandangExpenseIdx: number,
expenseIdx: number expenseIdx: number
) => { ) => {
return ( return (
formik.touched.kandangExpenses?.[kandangExpenseIdx]?.expenses?.[ formik.touched.cost_per_kandangs?.[kandangExpenseIdx]?.cost_items?.[
expenseIdx expenseIdx
]?.[column] && ]?.[column] &&
Boolean( Boolean(
formik.errors.kandangExpenses?.[kandangExpenseIdx] instanceof Object && formik.errors.cost_per_kandangs?.[kandangExpenseIdx] instanceof
formik.errors.kandangExpenses?.[kandangExpenseIdx].expenses?.[ Object &&
formik.errors.cost_per_kandangs?.[kandangExpenseIdx].cost_items?.[
expenseIdx expenseIdx
] instanceof Object && ] instanceof Object &&
formik.errors.kandangExpenses?.[kandangExpenseIdx].expenses?.[ formik.errors.cost_per_kandangs?.[kandangExpenseIdx].cost_items?.[
expenseIdx expenseIdx
]?.[column] ]?.[column]
) )
@@ -112,7 +113,8 @@ const ExpenseRequestKandangDetailExpense: React.FC<
</div> </div>
<div className='w-full flex flex-col gap-6'> <div className='w-full flex flex-col gap-6'>
{formik.values.kandangExpenses.length === 0 && ( {(formik.values.cost_per_kandangs.length === 0 ||
!formik.values.supplier?.value) && (
<div> <div>
<p className='text-sm text-gray-400 text-center'> <p className='text-sm text-gray-400 text-center'>
Pilih kandang terlebih dahulu! Pilih kandang terlebih dahulu!
@@ -120,10 +122,12 @@ const ExpenseRequestKandangDetailExpense: React.FC<
</div> </div>
)} )}
{formik.values.kandangExpenses.map( {formik.values.cost_per_kandangs.length > 0 &&
formik.values.supplier?.value &&
formik.values.cost_per_kandangs.map(
(kandangExpense, kandangExpenseIdx) => { (kandangExpense, kandangExpenseIdx) => {
const kandangName = formik.values.kandangs?.find( const kandangName = formik.values.kandangs?.find(
(kandang) => kandang.id === kandangExpense.kandangId (kandang) => kandang.id === kandangExpense.kandang_id
); );
return ( return (
@@ -150,7 +154,7 @@ const ExpenseRequestKandangDetailExpense: React.FC<
</thead> </thead>
<tbody> <tbody>
{kandangExpense.expenses.map( {kandangExpense.cost_items.map(
(expenseItem, expenseIdx) => ( (expenseItem, expenseIdx) => (
<tr key={`expense-${expenseIdx}`}> <tr key={`expense-${expenseIdx}`}>
<td className='p-2'> <td className='p-2'>
@@ -174,17 +178,17 @@ const ExpenseRequestKandangDetailExpense: React.FC<
<td className='p-2'> <td className='p-2'>
<NumberInput <NumberInput
required required
name={`kandangExpenses[${kandangExpenseIdx}].expenses[${expenseIdx}].totalQuantity`} name={`cost_per_kandangs[${kandangExpenseIdx}].cost_items[${expenseIdx}].quantity`}
placeholder='Masukkan Total Kuantitas' placeholder='Masukkan Total Kuantitas'
value={ value={
formik.values.kandangExpenses[ formik.values.cost_per_kandangs[
kandangExpenseIdx kandangExpenseIdx
].expenses[expenseIdx].totalQuantity ?? '' ].cost_items[expenseIdx].quantity ?? ''
} }
onChange={formik.handleChange} onChange={formik.handleChange}
onBlur={formik.handleBlur} onBlur={formik.handleBlur}
isError={isExpenseRepeaterInputError( isError={isExpenseRepeaterInputError(
'totalQuantity', 'quantity',
kandangExpenseIdx, kandangExpenseIdx,
expenseIdx expenseIdx
)} )}
@@ -194,17 +198,18 @@ const ExpenseRequestKandangDetailExpense: React.FC<
<td className='p-2'> <td className='p-2'>
<NumberInput <NumberInput
name={`kandangExpenses[${kandangExpenseIdx}].expenses[${expenseIdx}].totalExpense`} name={`cost_per_kandangs[${kandangExpenseIdx}].cost_items[${expenseIdx}].total_cost`}
placeholder='Masukkan Total Biaya' placeholder='Masukkan Total Biaya'
value={ value={
formik.values.kandangExpenses[ formik.values.cost_per_kandangs[
kandangExpenseIdx kandangExpenseIdx
].expenses[expenseIdx].totalExpense ?? '' ].cost_items[expenseIdx].total_cost ??
''
} }
onChange={formik.handleChange} onChange={formik.handleChange}
onBlur={formik.handleBlur} onBlur={formik.handleBlur}
isError={isExpenseRepeaterInputError( isError={isExpenseRepeaterInputError(
'totalExpense', 'total_cost',
kandangExpenseIdx, kandangExpenseIdx,
expenseIdx expenseIdx
)} )}
@@ -219,12 +224,12 @@ const ExpenseRequestKandangDetailExpense: React.FC<
<td className='p-2'> <td className='p-2'>
<TextInput <TextInput
name={`kandangExpenses[${kandangExpenseIdx}].expenses[${expenseIdx}].notes`} name={`cost_per_kandangs[${kandangExpenseIdx}].cost_items[${expenseIdx}].notes`}
placeholder='Tuliskan catatan' placeholder='Tuliskan catatan'
value={ value={
formik.values.kandangExpenses[ formik.values.cost_per_kandangs[
kandangExpenseIdx kandangExpenseIdx
].expenses[expenseIdx].notes ?? '' ].cost_items[expenseIdx].notes ?? ''
} }
onChange={formik.handleChange} onChange={formik.handleChange}
onBlur={formik.handleBlur} onBlur={formik.handleBlur}