diff --git a/src/components/pages/marketing/form/MarketingForm.tsx b/src/components/pages/marketing/form/MarketingForm.tsx index f20a44b5..b9a1a1fb 100644 --- a/src/components/pages/marketing/form/MarketingForm.tsx +++ b/src/components/pages/marketing/form/MarketingForm.tsx @@ -361,6 +361,8 @@ const MarketingForm = ({ }, }); + const memoSalesOrder = formik.values.sales_order; + // ================== FORM REPEATER HANDLER ================== const createMarketingHandler = async (values: CreateSalesOrderPayload) => { setIsLoading(true); @@ -471,13 +473,25 @@ const MarketingForm = ({ }, [deleteModal]); // ================== SALES ORDER HANDLER ================== - const handleDeleteSO = useCallback((id: number) => { - const currentProducts = formik.values.sales_order; - formik.setFieldValue( - 'sales_order', - currentProducts.filter((p) => p.id != id) - ); - }, []); + const handleDeleteSO = useCallback( + (id: number) => { + const currentProducts = formik.values.sales_order; + formik.setFieldValue( + 'sales_order', + currentProducts.filter((p) => p.id != id) + ); + }, + [memoSalesOrder] + ); + const handleEditSO = useCallback( + (id: number) => { + const currentProducts = formik.values.sales_order; + const selectedProduct = currentProducts.find((p) => p.id == id); + setSelectedMarketingProduct(selectedProduct ?? null); + addSOModal.openModal(); + }, + [memoSalesOrder] + ); const handleBulkDeleteSO = useCallback(() => { const currentProducts = formik.values.sales_order; formik.setFieldValue( @@ -487,7 +501,7 @@ const MarketingForm = ({ ) ); setRowSOSelection({}); - }, [selectedRowSOIds]); + }, [selectedRowSOIds, memoSalesOrder]); const handleAddSOClick = useCallback(() => { setSelectedMarketingProduct(null); addSOModal.openModal(); @@ -523,7 +537,7 @@ const MarketingForm = ({ addSOModal.closeModal(); }, - [addSOModal] + [addSOModal, memoSalesOrder] ); // ================== DELIVERY ORDER HANDLER ================== @@ -568,8 +582,30 @@ const MarketingForm = ({ }, [addDOModal] ); - - const memoSalesOrder = formik.values.sales_order; + const handleDeleteDO = useCallback( + async (id: number) => { + setDeliveryOrderValues((prev) => + prev.map((product) => + product.id === id + ? { + ...product, + ...{ + unit_price: '', + total_weight: '', + qty: '', + avg_weight: '', + total_price: '', + delivery_date: '', + }, + } + : product + ) + ); + addDOModal.closeModal(); + setSelectedDeliveryProduct(null); + }, + [addDOModal] + ); useEffect(() => { formik.setFieldValue('delivery_order', deliveryOrderValues); @@ -654,6 +690,7 @@ const MarketingForm = ({ setRowSelection={setRowSOSelection} selectedRowIds={selectedRowSOIds} onDelete={handleDeleteSO} + onEdit={handleEditSO} onBulkDelete={handleBulkDeleteSO} onAddProductClick={handleAddSOClick} /> @@ -673,6 +710,7 @@ const MarketingForm = ({ formType={formType} data={deliveryOrderValues} onEdit={handleEditDO} + onDelete={handleDeleteDO} onAddProductClick={handleAddDOClick} /> diff --git a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx index da3b2fee..56f00135 100644 --- a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx +++ b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx @@ -106,6 +106,7 @@ const DeliveryOrderProductForm = ({ await onUpdateForm?.(values.marketing_product_id as number, values); } handleResetForm(); + setSelectedProduct(null); }, }); @@ -124,7 +125,7 @@ const DeliveryOrderProductForm = ({ marketing_product: undefined, }, }); - setSelectedProduct(null); + // setSelectedProduct(null); }; const handleBlurField = (field: string) => { diff --git a/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema.ts b/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema.ts index e62ed701..879efc12 100644 --- a/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema.ts +++ b/src/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema.ts @@ -18,6 +18,7 @@ type SalesOrderProductSchemaType = { avg_weight: string | number | undefined; total_price: string | number | undefined; vehicle_number?: string | undefined; + uom?: string | null | undefined; }; export const SalesOrderProductSchema: Yup.ObjectSchema = @@ -57,6 +58,7 @@ export const SalesOrderProductSchema: Yup.ObjectSchema({ enableReinitialize: true, initialValues: { - vehicle_number: initialValues?.vehicle_number || undefined, + vehicle_number: initialValues?.vehicle_number || '', kandang_id: initialValues?.kandang_id || undefined, - kandang: initialValues?.kandang || undefined, - product_warehouse: initialValues?.product_warehouse || undefined, + kandang: initialValues?.kandang || null, + product_warehouse: initialValues?.product_warehouse || null, product_warehouse_id: initialValues?.product_warehouse_id || undefined, - unit_price: initialValues?.unit_price || undefined, - total_weight: initialValues?.total_weight || undefined, - qty: initialValues?.qty || undefined, - avg_weight: initialValues?.avg_weight || undefined, - total_price: initialValues?.total_price || undefined, + unit_price: initialValues?.unit_price || '', + total_weight: initialValues?.total_weight || '', + qty: initialValues?.qty || '', + avg_weight: initialValues?.avg_weight || '', + total_price: initialValues?.total_price || '', + uom: initialValues?.uom || '', }, validationSchema: SalesOrderProductSchema, onSubmit: async (values) => { @@ -220,7 +221,19 @@ const SalesOrderProductForm = ({ }; // ===== Formik Error List ===== - const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + const { formErrorList, close, handleFormSubmit } = useFormikErrorList( + formik, + { + onBeforeSubmit(e) { + e.preventDefault(); + handleBlurField(currentInput); + formik.setFieldValue( + 'uom', + isResponseSuccess(productData) ? productData?.data?.uom.name : '' + ); + }, + } + ); return ( <> diff --git a/src/components/pages/marketing/form/table-view/DeliveryOrderProductTable.tsx b/src/components/pages/marketing/form/table-view/DeliveryOrderProductTable.tsx index ac59529e..6b6f6a81 100644 --- a/src/components/pages/marketing/form/table-view/DeliveryOrderProductTable.tsx +++ b/src/components/pages/marketing/form/table-view/DeliveryOrderProductTable.tsx @@ -16,6 +16,7 @@ type DeliveryOrderProductTableProps = { data: DeliveryOrderProductFormValues[]; formType?: 'add' | 'edit' | 'add_deliver' | 'edit_deliver'; onEdit: (id: number) => void; + onDelete: (id: number) => void; onAddProductClick: () => void; }; @@ -23,10 +24,13 @@ const DeliveryOrderProductTable = ({ data, formType, onEdit, + onDelete, onAddProductClick, }: DeliveryOrderProductTableProps) => { const onEditRef = useRef(onEdit); onEditRef.current = onEdit; + const onDeleteRef = useRef(onDelete); + onDeleteRef.current = onDelete; const canAddData = data.filter((item) => !Boolean(item.qty)); @@ -144,16 +148,29 @@ const DeliveryOrderProductTable = ({
<> {props.row.original.qty && ( - + <> + + + )} {!props.row.original.qty && '-'} diff --git a/src/components/pages/marketing/form/table-view/SalesOrderProductTable.tsx b/src/components/pages/marketing/form/table-view/SalesOrderProductTable.tsx index c37bbfb1..02d33587 100644 --- a/src/components/pages/marketing/form/table-view/SalesOrderProductTable.tsx +++ b/src/components/pages/marketing/form/table-view/SalesOrderProductTable.tsx @@ -23,6 +23,7 @@ type SalesOrderProductTableProps = { >; selectedRowIds: number[]; onDelete: (id: number) => void; + onEdit: (id: number) => void; onBulkDelete: () => void; onAddProductClick: () => void; }; @@ -34,11 +35,14 @@ const SalesOrderProductTable = ({ setRowSelection, selectedRowIds, onDelete, + onEdit, onBulkDelete, onAddProductClick, }: SalesOrderProductTableProps) => { const onDeleteRef = useRef(onDelete); onDeleteRef.current = onDelete; + const onEditRef = useRef(onEdit); + onEditRef.current = onEdit; const columns = useMemo( () => [ @@ -92,17 +96,26 @@ const SalesOrderProductTable = ({ }, { accessorFn: (row: SalesOrderProductFormValues) => - formatNumber(parseFloat(row.total_weight as string)), + formatNumber(parseFloat(row.total_weight as string), undefined, 0, 5), header: 'Total Bobot (Kg)', }, { accessorFn: (row: SalesOrderProductFormValues) => formatNumber(parseFloat(row.qty as string)), header: 'Kuantitas', + cell: ({ row }: { row: TanStack.Row }) => + formatNumber( + parseFloat(row.original.qty as string), + undefined, + 0, + 5 + ) + + ' ' + + (row.original.uom ?? ''), }, { accessorFn: (row: SalesOrderProductFormValues) => - formatNumber(parseFloat(row.avg_weight as string)), + formatNumber(parseFloat(row.avg_weight as string), undefined, 0, 5), header: 'Avg. Bobot (Kg)', }, { @@ -116,6 +129,14 @@ const SalesOrderProductTable = ({ props: TanStack.CellContext ) => (
+
),