mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
refactor(FE-Storyless): enhance MovementForm schema and validation, improve handling of product quantities and delivery costs
This commit is contained in:
@@ -1,34 +1,82 @@
|
||||
import * as Yup from 'yup';
|
||||
import { Movement } from '@/types/api/inventory/movement';
|
||||
|
||||
type MovementFormSchemaType = {
|
||||
transfer_reason: string;
|
||||
transfer_date: string;
|
||||
source_warehouse?: {
|
||||
value: number;
|
||||
label: string;
|
||||
area?: string;
|
||||
location?: string;
|
||||
} | null;
|
||||
source_warehouse_id: number;
|
||||
destination_warehouse?: {
|
||||
value: number;
|
||||
label: string;
|
||||
area?: string;
|
||||
location?: string;
|
||||
} | null;
|
||||
destination_warehouse_id: number;
|
||||
products: {
|
||||
product?: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
product_id: number;
|
||||
product_qty: number | string;
|
||||
}[];
|
||||
deliveries: {
|
||||
delivery_cost?: number | string;
|
||||
delivery_cost_per_item?: number | string;
|
||||
document?: File | string | null;
|
||||
document_path?: string | null;
|
||||
driver_name: string;
|
||||
vehicle_plate: string;
|
||||
supplier?: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
supplier_id: number;
|
||||
products: {
|
||||
product?: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
product_id: number;
|
||||
product_qty: number | string;
|
||||
}[];
|
||||
}[];
|
||||
};
|
||||
|
||||
export type ProductSchema = {
|
||||
product: {
|
||||
product?: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
product_id: number;
|
||||
product_qty: number;
|
||||
product_qty: number | string;
|
||||
};
|
||||
|
||||
export type DeliverySchema = {
|
||||
delivery_cost?: number | undefined;
|
||||
delivery_cost_per_item?: number | undefined;
|
||||
delivery_cost?: number | string;
|
||||
delivery_cost_per_item?: number | string;
|
||||
document?: File | string | null;
|
||||
document_path?: string | null;
|
||||
driver_name: string;
|
||||
vehicle_plate: string;
|
||||
supplier: {
|
||||
supplier?: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
supplier_id: number;
|
||||
products: {
|
||||
product: {
|
||||
product?: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
product_id: number;
|
||||
product_qty: number;
|
||||
product_qty: number | string;
|
||||
}[];
|
||||
};
|
||||
|
||||
@@ -102,7 +150,7 @@ const DeliveryObjectSchema: Yup.ObjectSchema<DeliverySchema> = Yup.object({
|
||||
.required('Produk wajib diisi!'),
|
||||
});
|
||||
|
||||
export const MovementFormSchema = Yup.object({
|
||||
export const MovementFormSchema: Yup.ObjectSchema<MovementFormSchemaType> = Yup.object({
|
||||
transfer_reason: Yup.string().required('Alasan transfer wajib diisi!'),
|
||||
transfer_date: Yup.string().required('Tanggal transfer wajib diisi!'),
|
||||
source_warehouse: Yup.object({
|
||||
|
||||
@@ -173,8 +173,9 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
}
|
||||
|
||||
return {
|
||||
delivery_cost: d.delivery_cost ?? 0,
|
||||
delivery_cost_per_item: d.delivery_cost_per_item ?? 0,
|
||||
delivery_cost: parseInt((d.delivery_cost || '').toString()) || 0,
|
||||
delivery_cost_per_item:
|
||||
parseInt((d.delivery_cost_per_item || '').toString()) || 0,
|
||||
document_index: documentIndex,
|
||||
document_path: d.document_path,
|
||||
driver_name: d.driver_name,
|
||||
@@ -182,7 +183,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
supplier_id: d.supplier_id,
|
||||
products: d.products.map((p) => ({
|
||||
product_id: p.product_id,
|
||||
product_qty: p.product_qty,
|
||||
product_qty: parseInt(p.product_qty.toString()) || 0,
|
||||
})),
|
||||
};
|
||||
});
|
||||
@@ -194,7 +195,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
destination_warehouse_id: values.destination_warehouse_id,
|
||||
products: values.products.map((p) => ({
|
||||
product_id: p.product_id,
|
||||
product_qty: p.product_qty,
|
||||
product_qty: parseInt(p.product_qty.toString()) || 0,
|
||||
})),
|
||||
deliveries: deliveriesPayload,
|
||||
};
|
||||
@@ -304,7 +305,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
{
|
||||
product: null,
|
||||
product_id: 0,
|
||||
product_qty: 0,
|
||||
product_qty: '',
|
||||
},
|
||||
];
|
||||
formik.setFieldValue('products', newProducts);
|
||||
@@ -339,8 +340,8 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
formik.setFieldValue('deliveries', [
|
||||
...(formik.values.deliveries || []),
|
||||
{
|
||||
delivery_cost: undefined,
|
||||
delivery_cost_per_item: undefined,
|
||||
delivery_cost: '',
|
||||
delivery_cost_per_item: '',
|
||||
document: null,
|
||||
driver_name: '',
|
||||
vehicle_plate: '',
|
||||
@@ -350,7 +351,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
{
|
||||
product: null,
|
||||
product_id: 0,
|
||||
product_qty: 0,
|
||||
product_qty: '',
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -392,7 +393,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
const delivery = formik.values.deliveries?.[idx];
|
||||
if (delivery) {
|
||||
const productQty = delivery.products.reduce(
|
||||
(sum, p) => sum + p.product_qty,
|
||||
(sum, p) => sum + (parseInt(p.product_qty.toString()) || 0),
|
||||
0
|
||||
);
|
||||
if (productQty > 0 && value > 0) {
|
||||
@@ -416,7 +417,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
const delivery = formik.values.deliveries?.[idx];
|
||||
if (delivery) {
|
||||
const productQty = delivery.products.reduce(
|
||||
(sum, p) => sum + p.product_qty,
|
||||
(sum, p) => sum + (parseInt(p.product_qty.toString()) || 0),
|
||||
0
|
||||
);
|
||||
if (productQty > 0 && value > 0) {
|
||||
@@ -690,36 +691,38 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
useEffect(() => {
|
||||
formik.values.deliveries?.forEach((delivery, idx) => {
|
||||
const productQty = delivery.products.reduce(
|
||||
(sum, p) => sum + p.product_qty,
|
||||
(sum, p) => sum + (parseInt(p.product_qty.toString()) || 0),
|
||||
0
|
||||
);
|
||||
|
||||
if (
|
||||
delivery.delivery_cost &&
|
||||
delivery.delivery_cost > 0 &&
|
||||
productQty > 0
|
||||
) {
|
||||
const perItem = delivery.delivery_cost / productQty;
|
||||
if (Math.abs((delivery.delivery_cost_per_item || 0) - perItem) > 0.01) {
|
||||
const deliveryCost =
|
||||
parseInt((delivery.delivery_cost || '').toString()) || 0;
|
||||
const deliveryCostPerItem =
|
||||
parseInt((delivery.delivery_cost_per_item || '').toString()) || 0;
|
||||
|
||||
if (deliveryCost > 0 && productQty > 0) {
|
||||
const perItem = deliveryCost / productQty;
|
||||
if (Math.abs(deliveryCostPerItem - perItem) > 0.01) {
|
||||
formik.setFieldValue(
|
||||
`deliveries.${idx}.delivery_cost_per_item`,
|
||||
perItem
|
||||
);
|
||||
}
|
||||
} else if (
|
||||
delivery.delivery_cost_per_item &&
|
||||
delivery.delivery_cost_per_item > 0 &&
|
||||
productQty > 0
|
||||
) {
|
||||
const totalCost = delivery.delivery_cost_per_item * productQty;
|
||||
if (Math.abs((delivery.delivery_cost || 0) - totalCost) > 0.01) {
|
||||
} else if (deliveryCostPerItem > 0 && productQty > 0) {
|
||||
const totalCost = deliveryCostPerItem * productQty;
|
||||
if (Math.abs(deliveryCost - totalCost) > 0.01) {
|
||||
formik.setFieldValue(`deliveries.${idx}.delivery_cost`, totalCost);
|
||||
}
|
||||
}
|
||||
});
|
||||
}, [
|
||||
formik.values.deliveries
|
||||
?.map((d) => d.products.reduce((sum, p) => sum + p.product_qty, 0))
|
||||
?.map((d) =>
|
||||
d.products.reduce(
|
||||
(sum, p) => sum + (parseInt(p.product_qty.toString()) || 0),
|
||||
0
|
||||
)
|
||||
)
|
||||
.join(','),
|
||||
]);
|
||||
|
||||
@@ -765,6 +768,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
required
|
||||
label='Alasan Transfer'
|
||||
name='transfer_reason'
|
||||
placeholder='Masukkan alasan transfer...'
|
||||
value={formik.values.transfer_reason}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
@@ -802,6 +806,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<SelectInput
|
||||
required
|
||||
label='Gudang'
|
||||
placeholder='Pilih gudang asal...'
|
||||
value={formik.values.source_warehouse}
|
||||
onChange={(val) => {
|
||||
formik.setFieldTouched('source_warehouse', true);
|
||||
@@ -869,6 +874,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<SelectInput
|
||||
required
|
||||
label='Gudang'
|
||||
placeholder='Pilih gudang tujuan...'
|
||||
value={formik.values.destination_warehouse}
|
||||
onChange={(val) => {
|
||||
formik.setFieldTouched('destination_warehouse', true);
|
||||
@@ -1055,8 +1061,8 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
}
|
||||
placeholder={
|
||||
!formik.values.source_warehouse_id
|
||||
? 'Pilih gudang asal terlebih dahulu'
|
||||
: 'Pilih produk'
|
||||
? 'Pilih gudang asal terlebih dahulu...'
|
||||
: 'Pilih produk...'
|
||||
}
|
||||
isClearable
|
||||
{...isRepeaterInputError(
|
||||
@@ -1074,6 +1080,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<NumberInput
|
||||
required
|
||||
name={`products.${idx}.product_qty`}
|
||||
placeholder='Masukkan kuantitas...'
|
||||
value={product.product_qty ?? ''}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
@@ -1294,6 +1301,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<td>
|
||||
<SelectInput
|
||||
required
|
||||
placeholder='Pilih produk...'
|
||||
value={delivery.products[0]?.product ?? undefined}
|
||||
onChange={(val) => {
|
||||
formik.setFieldTouched(
|
||||
@@ -1334,6 +1342,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<NumberInput
|
||||
required
|
||||
name={`deliveries.${idx}.products.0.product_qty`}
|
||||
placeholder='Masukkan kuantitas...'
|
||||
value={delivery.products[0]?.product_qty ?? ''}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
@@ -1364,6 +1373,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<td>
|
||||
<SelectInput
|
||||
required
|
||||
placeholder='Pilih supplier...'
|
||||
value={delivery.supplier}
|
||||
onChange={(val) => {
|
||||
formik.setFieldTouched(
|
||||
@@ -1403,6 +1413,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<TextInput
|
||||
required
|
||||
name={`deliveries.${idx}.vehicle_plate`}
|
||||
placeholder='Masukkan plat nomor...'
|
||||
value={delivery.vehicle_plate}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
@@ -1480,6 +1491,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<NumberInput
|
||||
required
|
||||
name={`deliveries.${idx}.delivery_cost`}
|
||||
placeholder='Masukkan biaya pengiriman...'
|
||||
value={delivery.delivery_cost || ''}
|
||||
onChange={handleDeliveryCostChangeWrapper(idx)}
|
||||
onBlur={formik.handleBlur}
|
||||
@@ -1504,6 +1516,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<NumberInput
|
||||
required
|
||||
name={`deliveries.${idx}.delivery_cost_per_item`}
|
||||
placeholder='Masukkan biaya per item...'
|
||||
value={delivery.delivery_cost_per_item || ''}
|
||||
onChange={handleDeliveryCostPerItemChangeWrapper(
|
||||
idx
|
||||
@@ -1530,6 +1543,7 @@ const MovementForm = ({ type = 'add', initialValues }: MovementFormProps) => {
|
||||
<TextInput
|
||||
required
|
||||
name={`deliveries.${idx}.driver_name`}
|
||||
placeholder='Masukkan nama sopir...'
|
||||
value={delivery.driver_name}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
|
||||
Reference in New Issue
Block a user