refactor(FE-177-166-167): separate table repeater component and adjust data types with new API Payload

This commit is contained in:
randy-ar
2025-11-16 23:19:28 +07:00
parent 3fdb10ec7f
commit d3c4706d87
16 changed files with 593 additions and 496 deletions
+1 -1
View File
@@ -1,4 +1,4 @@
import SalesForm from '@/components/pages/marketing/sales-orders/form/SalesForm';
import SalesForm from '@/components/pages/marketing/form/MarketingForm';
const AddSalesOrder = () => {
return (
@@ -1,6 +1,6 @@
'use client';
import SalesForm from '@/components/pages/marketing/sales-orders/form/SalesForm';
import SalesForm from '@/components/pages/marketing/form/MarketingForm';
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
import { MarketingApi } from '@/services/api/marketing/marketing';
import { useRouter, useSearchParams } from 'next/navigation';
@@ -1,6 +1,6 @@
'use client';
import SalesOrderDetail from '@/components/pages/marketing/sales-orders/detail/SalesOrderDetail';
import SalesOrderDetail from '@/components/pages/marketing/detail/MarketingDetail';
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
import { MarketingApi } from '@/services/api/marketing/marketing';
import { useRouter, useSearchParams } from 'next/navigation';
+1 -1
View File
@@ -1,4 +1,4 @@
import SalesOrderTable from '@/components/pages/marketing/sales-orders/SalesOrderTable';
import SalesOrderTable from '@/components/pages/marketing/MarketingTable';
const SalesOrder = () => {
return (
@@ -12,16 +12,10 @@ import { TableRowSizeSelector } from '@/components/table/TableRowSizeSelector';
import { TableToolbar } from '@/components/table/TableToolbar';
import { ROWS_OPTIONS } from '@/config/constant';
import { isResponseSuccess } from '@/lib/api-helper';
import {
cn,
formatCurrency,
formatDate,
formatVechicleNumber,
} from '@/lib/helper';
import { cn, formatCurrency, formatDate } from '@/lib/helper';
import { MarketingApi } from '@/services/api/marketing/marketing';
import { useTableFilter } from '@/services/hooks/useTableFilter';
import { Marketing, MarketingProduct } from '@/types/api/marketing/marketing';
import { Customer } from '@/types/api/master-data/customer';
import { BaseSalesOrder, Marketing } from '@/types/api/marketing/marketing';
import { Icon } from '@iconify/react';
import { CellContext } from '@tanstack/react-table';
import { useCallback, useState } from 'react';
@@ -241,13 +235,13 @@ const SalesOrderTable = () => {
},
{
accessorFn: (row) =>
row.marketing_products
row.sales_order
?.map((product) => product.total_price)
.reduce((a, b) => a + b, 0) ?? 0,
header: 'Grand Total',
cell: (props) => {
return formatCurrency(
props.row.original?.marketing_products
props.row.original?.sales_order
?.map((product) => product.total_price)
.reduce((a, b) => a + b, 0) ?? 0
);
@@ -257,8 +251,8 @@ const SalesOrderTable = () => {
accessorKey: 'marketing_products.length',
header: 'Product Details',
cell: (props) => {
if (props?.row?.original?.marketing_products?.length) {
if (props?.row?.original?.marketing_products?.length > 1) {
if (props?.row?.original?.sales_order?.length) {
if (props?.row?.original?.sales_order?.length > 1) {
return (
<Button
variant='link'
@@ -268,12 +262,11 @@ const SalesOrderTable = () => {
productsClickHandler(props?.row?.original);
}}
>
Lihat {props?.row?.original?.marketing_products?.length}{' '}
Produk
Lihat {props?.row?.original?.sales_order?.length} Produk
</Button>
);
} else {
const product = props?.row?.original?.marketing_products[0];
const product = props?.row?.original?.sales_order[0];
return <>{product?.product_warehouse?.product?.name}</>;
}
}
@@ -379,10 +372,10 @@ const SalesOrderTable = () => {
<Icon icon='mdi:close' width={16} height={16} />
</Button>
</div>
<Table<MarketingProduct>
<Table<BaseSalesOrder>
data={
isResponseSuccess(marketing) && selectedItem
? (selectedItem?.marketing_products ?? [])
? (selectedItem?.sales_order ?? [])
: []
}
columns={[
@@ -10,15 +10,9 @@ import ApprovalSteps, {
} from '@/components/pages/ApprovalSteps';
import Table from '@/components/Table';
import { MARKETING_APPROVAL_LINE } from '@/config/approval-line';
import {
cn,
formatCurrency,
formatDate,
formatNumber,
formatVechicleNumber,
} from '@/lib/helper';
import { cn, formatCurrency, formatDate, formatNumber } from '@/lib/helper';
import { MarketingApi } from '@/services/api/marketing/marketing';
import { Marketing, MarketingProduct } from '@/types/api/marketing/marketing';
import { BaseSalesOrder, Marketing } from '@/types/api/marketing/marketing';
import { Icon } from '@iconify/react';
import { useState } from 'react';
import toast from 'react-hot-toast';
@@ -34,7 +28,7 @@ const SalesOrderDetail = ({
'APPROVED'
);
const [grandTotal, setGrandTotal] = useState(
initialValues?.marketing_products
initialValues?.sales_order
?.map((item) => item.total_price)
.reduce((a, b) => a + b, 0)
);
@@ -48,7 +42,7 @@ const SalesOrderDetail = ({
isLoading: isLoadingApproval,
refresh: refreshApproval,
} = useApprovalSteps({
latestApproval: initialValues?.approval,
latestApproval: initialValues?.latest_approval,
approvalLines: MARKETING_APPROVAL_LINE,
moduleName: 'MARKETINGS',
moduleId: initialValues?.id as number as unknown as string,
@@ -114,12 +108,12 @@ const SalesOrderDetail = ({
<ApprovalSteps approvals={approvals} />
)}
<div className='flex-row flex gap-3'>
{initialValues?.approval?.step_number != 3 && (
{initialValues?.latest_approval?.step_number != 3 && (
<>
<Button
color='success'
onClick={approveClickHandler}
disabled={initialValues?.approval?.step_number != 1}
disabled={initialValues?.latest_approval?.step_number != 1}
>
<Icon icon='mdi:check' width={24} height={24} />
Approve
@@ -127,14 +121,14 @@ const SalesOrderDetail = ({
<Button
color='error'
onClick={rejectClickHandler}
disabled={initialValues?.approval?.step_number != 2}
disabled={initialValues?.latest_approval?.step_number != 2}
>
<Icon icon='mdi:close' width={24} height={24} />
Reject
</Button>
</>
)}
{initialValues?.approval?.step_number == 2 && (
{initialValues?.latest_approval?.step_number == 2 && (
<Button color='success' onClick={deliveryClickHandler}>
<Icon icon='mdi:check' width={24} height={24} />
Delivery Order
@@ -166,7 +160,7 @@ const SalesOrderDetail = ({
<tr>
<td className='font-semibold'>Status</td>
<td>:</td>
<td>{initialValues?.approval?.step_name}</td>
<td>{initialValues?.latest_approval?.step_name}</td>
</tr>
<tr>
<td className='font-semibold'>Tanggal Penjualan</td>
@@ -187,24 +181,16 @@ const SalesOrderDetail = ({
</table>
</div>
</Card>
{initialValues?.marketing_products && (
{initialValues?.sales_order && (
<Card
title='Daftar Produk'
className={{
wrapper: 'w-full bg-white',
}}
>
<Table<MarketingProduct>
data={initialValues?.marketing_products}
<Table<BaseSalesOrder>
data={initialValues?.sales_order}
columns={[
{
header: 'No. Polisi',
accessorFn(row) {
return formatVechicleNumber(
row.delivery_product?.vehicle_number as string
);
},
},
{
header: 'Kandang',
accessorFn(row) {
@@ -251,8 +237,8 @@ const SalesOrderDetail = ({
className={{
containerClassName: cn({
'mb-20':
initialValues?.marketing_products &&
initialValues?.marketing_products?.length === 0,
initialValues?.sales_order &&
initialValues?.sales_order?.length === 0,
}),
tableWrapperClassName: 'overflow-x-auto min-h-full!',
tableClassName: 'font-inter w-full table-auto min-h-full!',
@@ -1,9 +1,8 @@
import * as Yup from 'yup';
import { MarketingProduct } from '@/types/api/marketing/marketing';
import {
SalesOrderProductFormValues,
SalesOrderProductSchema,
} from './repeater/MarketingProduct.schema';
} from '@/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema';
type MarketingSchemaType = {
customer_id: number | undefined;
@@ -20,7 +19,7 @@ type MarketingSchemaType = {
};
type SalesOrderSchemaType = MarketingSchemaType & {
marketing_products: SalesOrderProductFormValues[];
sales_order: SalesOrderProductFormValues[];
};
export const SalesOrderSchema: Yup.ObjectSchema<SalesOrderSchemaType> =
@@ -33,7 +32,7 @@ export const SalesOrderSchema: Yup.ObjectSchema<SalesOrderSchemaType> =
}).nullable(),
so_date: Yup.string().required('Tanggal wajib diisi!'),
notes: Yup.string().required('Catatan wajib diisi!'),
marketing_products: Yup.array()
sales_order: Yup.array()
.of(SalesOrderProductSchema)
.min(1, 'Produk wajib diisi!')
.required('Produk wajib diisi!'),
@@ -10,36 +10,56 @@ import SelectInput, {
} from '@/components/input/SelectInput';
import TextArea from '@/components/input/TextArea';
import Modal, { useModal } from '@/components/Modal';
import * as TanStack from '@tanstack/react-table';
import Table from '@/components/Table'; // Keep this import
import { cn, formatCurrency, formatDate, formatNumber } from '@/lib/helper';
import { formatCurrency, formatDate } from '@/lib/helper';
import {
BaseSalesOrder,
CreateSalesOrderPayload,
CreateSalesOrderProductPayload,
Marketing,
MarketingProduct,
} from '@/types/api/marketing/marketing';
import { Icon } from '@iconify/react';
import { useCallback, useEffect, useMemo, useState } from 'react';
import MarketingProductForm from './repeater/MarketingProductForm';
import CheckboxInput from '@/components/input/CheckboxInput';
import { Customer } from '@/types/api/master-data/customer';
import { CustomerApi } from '@/services/api/master-data';
import { useFormik } from 'formik';
import { SalesOrderFormValues, SalesOrderSchema } from './SalesForm.schema';
import { SalesOrderFormValues, SalesOrderSchema } from './MarketingForm.schema';
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
import { MarketingApi } from '@/services/api/marketing/marketing';
import { SalesOrderProductFormValues } from './repeater/MarketingProduct.schema';
import { SalesOrderProductFormValues } from './repeater/sales-order/SalesOrderProduct.schema';
import ConfirmationModal from '@/components/modal/ConfirmationModal';
import toast from 'react-hot-toast';
import { useRouter } from 'next/navigation';
import SalesOrderProductTable from './table-view/SalesOrderProductTable';
import SalesOrderProductForm from './repeater/sales-order/SalesOrderProductForm';
const MarketingProductToFieldValues = (
product: BaseSalesOrder
): SalesOrderProductFormValues => {
return {
kandang_id: product.product_warehouse.warehouse.id,
kandang: {
value: product.product_warehouse.warehouse.id,
label: product.product_warehouse.warehouse.name,
},
product_warehouse: {
value: product.product_warehouse.id,
label: product.product_warehouse.product.name,
},
product_warehouse_id: product.product_warehouse.id,
unit_price: product.unit_price,
total_weight: product.total_weight,
qty: product.qty,
avg_weight: product.avg_weight,
total_price: product.total_price,
};
};
const SalesForm = ({
formType = 'add',
initialValues,
afterSubmit,
}: {
formType?: 'add' | 'edit';
formType?: 'add' | 'edit' | 'deliver';
initialValues?: Marketing;
afterSubmit?: () => void;
}) => {
@@ -49,10 +69,14 @@ const SalesForm = ({
const [isLoading, setIsLoading] = useState(false);
const [selectedMarketingProduct, setSelectedMarketingProduct] =
useState<MarketingProduct | null>(null);
useState<SalesOrderProductFormValues | null>(null);
const [rawMarketingProducts, setRawMarketingProducts] = useState<
MarketingProduct[]
>(initialValues?.marketing_products || []);
SalesOrderProductFormValues[]
>(
initialValues?.sales_order.map((item) =>
MarketingProductToFieldValues(item)
) || []
);
const [selectedCustomer, setSelectedCustomer] = useState<OptionType | null>(
initialValues?.customer
? { value: initialValues.customer.id, label: initialValues.customer.name }
@@ -63,63 +87,54 @@ const SalesForm = ({
parseInt(item)
);
const [grandTotal, setGrandTotal] = useState<number>(
initialValues?.marketing_products
initialValues?.sales_order
?.map((item) => item.total_price)
.reduce((a, b) => a + b, 0) ?? 0
);
const {
options: customerOptions,
rawData: customerRawData,
isLoadingOptions: isLoadingCustomerOptions,
} = useSelect<Customer>(CustomerApi.basePath, 'id', 'name');
const handleAddProduct = useCallback(() => {
addProductModal.openModal();
}, [addProductModal]);
const handleDeleteProduct = useCallback((id: number) => {
setRawMarketingProducts((prev) => prev.filter((p) => p.id !== id));
}, []);
const handleDeleteProduct = useCallback(
(product_warehouse_id: number, kandang_id: number) => {
setRawMarketingProducts((prev) =>
prev.filter(
(p) =>
p.product_warehouse_id !== product_warehouse_id &&
p.kandang_id !== kandang_id
)
);
},
[]
);
const handleBulkDeleteProduct = () => {
setRawMarketingProducts((prev) =>
prev.filter((product) => !selectedRowIds.includes(product.id))
prev.filter(
(product) =>
!selectedRowIds.includes(
parseInt(`${product.product_warehouse_id}${product.kandang_id}`)
)
)
);
};
const handleDelete = () => {
deleteModal.openModal();
};
const handleAddProductClick = useCallback(() => {
setSelectedMarketingProduct(null); // Pastikan form tambah
addProductModal.openModal();
}, [addProductModal]);
const handleAddSubmitProduct = useCallback(
async (
tableValue: CreateSalesOrderProductPayload,
fieldValues: SalesOrderProductFormValues
) => {
const newMarketingProduct: MarketingProduct = {
id: rawMarketingProducts.length + 1,
product_warehouse: tableValue.product_warehouse!,
unit_price: tableValue.unit_price as number,
total_weight: tableValue.total_weight as number,
qty: tableValue.qty as number,
avg_weight: tableValue.avg_weight as number,
total_price: tableValue.total_price as number,
delivery_product: {
id: rawMarketingProducts.length + 1,
vehicle_number: tableValue.vehicle_number as string,
delivery_date: '' as string,
unit_price: tableValue.unit_price as number,
total_weight: tableValue.total_weight as number,
qty: tableValue.qty as number,
avg_weight: tableValue.avg_weight as number,
total_price: tableValue.total_price as number,
},
};
setRawMarketingProducts((prev) => [...prev, newMarketingProduct]);
async (values: SalesOrderProductFormValues) => {
setRawMarketingProducts((prev) => [...prev, values]);
formik.setValues({
...formik.values,
marketing_products: [...formik.values.marketing_products, fieldValues],
sales_order: [...formik.values.sales_order, values],
});
setGrandTotal((prev) => prev + (tableValue.total_price as number));
setGrandTotal((prev) => prev + (values.total_price as number));
addProductModal.closeModal();
},
[rawMarketingProducts.length, addProductModal]
@@ -176,41 +191,18 @@ const SalesForm = ({
router.push('/marketing/sales-orders');
};
const MarketingProductToFieldValues = (
product: MarketingProduct
): SalesOrderProductFormValues => {
return {
vehicle_number: product.delivery_product?.vehicle_number,
kandang_id: product.product_warehouse.warehouse.id,
kandang: {
value: product.product_warehouse.warehouse.id,
label: product.product_warehouse.warehouse.name,
},
product_warehouse: {
value: product.product_warehouse.product.id,
label: product.product_warehouse.product.name,
},
product_warehouse_id: product.product_warehouse.product.id,
unit_price: product.unit_price,
total_weight: product.total_weight,
qty: product.qty,
avg_weight: product.avg_weight,
total_price: product.total_price,
};
};
const formikInitialValues = useMemo(() => {
return {
so_date: initialValues?.so_date || undefined,
notes: initialValues?.notes || undefined,
customer_id: initialValues?.customer?.id || undefined,
sales_person_id: initialValues?.sales_person_id || 1,
sales_person_id: initialValues?.sales_person?.id || 1,
customer: {
value: initialValues?.customer?.id as number,
label: initialValues?.customer?.name as string,
},
marketing_products:
initialValues?.marketing_products?.map((product) =>
sales_order:
initialValues?.sales_order?.map((product) =>
MarketingProductToFieldValues(product)
) ?? [],
};
@@ -227,9 +219,9 @@ const SalesForm = ({
sales_person_id: values.sales_person_id as number,
date: formatDate(values.so_date as string, 'yyyy-MM-DD'),
notes: values.notes as string,
marketing_products: values.marketing_products.map((product) => {
marketing_products: values.sales_order.map((product) => {
return {
vehicle_number: product.vehicle_number as string,
vehicle_number: 'D 1234 XXXX',
kandang_id: product.kandang_id as number,
product_warehouse_id: product.product_warehouse_id as number,
unit_price: parseFloat(product.unit_price as string),
@@ -261,23 +253,14 @@ const SalesForm = ({
}, [formikSetValues, formik.initialValues]);
useEffect(() => {
// Konversi array MarketingProduct ke format SalesOrderProductFormValues
const newMarketingProductValues = rawMarketingProducts.map((product) =>
MarketingProductToFieldValues(product)
);
// Hitung Grand Total baru
const newGrandTotal = rawMarketingProducts.reduce(
(total, product) => total + product.total_price,
(total, product) => total + parseFloat(product.total_price as string),
0
);
// Perbarui nilai formik.values.marketing_products
formik.setFieldValue(
'marketing_products',
newMarketingProductValues,
false
);
formik.setFieldValue('marketing_products', rawMarketingProducts, false);
// Parameter ketiga (false) untuk menghindari validasi secara langsung
// Perbarui state grandTotal
@@ -287,85 +270,6 @@ const SalesForm = ({
setRowSelection({});
}, [rawMarketingProducts]);
const columns = useMemo(
() => [
{
id: 'select',
header: ({ table }: { table: TanStack.Table<MarketingProduct> }) => (
<div className='w-full flex flex-row justify-center'>
<CheckboxInput
name='allRow'
checked={table.getIsAllRowsSelected()}
indeterminate={table.getIsSomeRowsSelected()}
onChange={table.getToggleAllRowsSelectedHandler()}
/>
</div>
),
cell: ({ row }: { row: TanStack.Row<MarketingProduct> }) => (
<div>
<CheckboxInput
name='row'
checked={row.getIsSelected()}
disabled={!row.getCanSelect()}
indeterminate={row.getIsSomeSelected()}
onChange={row.getToggleSelectedHandler()}
/>
</div>
),
},
{
accessorFn: (row: MarketingProduct) =>
row.delivery_product?.vehicle_number,
header: 'No. Polisi',
},
{
accessorFn: (row: MarketingProduct) =>
row.product_warehouse.warehouse.name,
header: 'Kandang',
},
{
accessorFn: (row: MarketingProduct) =>
row.product_warehouse.product.name,
header: 'Produk',
},
{
accessorFn: (row: MarketingProduct) => formatCurrency(row.unit_price),
header: 'Harga Satuan (Rp)',
},
{
accessorFn: (row: MarketingProduct) => formatNumber(row.total_weight),
header: 'Total Bobot (Kg)',
},
{
accessorFn: (row: MarketingProduct) => formatNumber(row.qty),
header: 'Kuantitas',
},
{
accessorFn: (row: MarketingProduct) => formatNumber(row.avg_weight),
header: 'Avg. Bobot (Kg)',
},
{
accessorFn: (row: MarketingProduct) => formatCurrency(row.total_price),
header: 'Total Penjualan (Rp)',
},
{
header: 'Aksi',
cell: (props: TanStack.CellContext<MarketingProduct, unknown>) => (
<div className='flex flex-row gap-1 items-center justify-end h-full mt-2'>
<Button
color='error'
className='p-1'
onClick={() => handleDeleteProduct(props.row.original.id)}
>
<Icon icon='mdi:trash' width={16} height={16} />
</Button>
</div>
),
},
],
[handleDeleteProduct, initialValues, rawMarketingProducts] // dependensi tunggal
);
return (
<>
<form
@@ -414,64 +318,17 @@ const SalesForm = ({
wrapper: 'bg-white w-full',
}}
>
{JSON.stringify(formik.values.marketing_products)}
{JSON.stringify(formik.values.sales_order)}
<div className='text-green-500'>
{JSON.stringify(formik.values.marketing_products)}
{JSON.stringify(formik.values.sales_order)}
</div>
<span className='text-red-500'>{JSON.stringify(formik.errors)}</span>
<Table<MarketingProduct>
rowSelection={rowSelection}
setRowSelection={setRowSelection}
<SalesOrderProductTable
data={rawMarketingProducts}
columns={columns}
className={{
tableWrapperClassName: 'overflow-x-auto min-h-full!',
tableClassName: 'font-inter w-full table-auto min-h-full!',
headerRowClassName: 'border-b border-b-gray-200',
headerColumnClassName:
'px-2 py-3 text-xs font-semibold text-gray-500 last:flex last:flex-row last:justify-end first:flex first:flex-row first:justify-end',
bodyRowClassName: 'border-b border-b-gray-200',
bodyColumnClassName:
'px-2 py-2 last:flex last:flex-row last:justify-end first:flex first:flex-row first:justify-start',
paginationClassName: 'hidden',
}}
emptyContent={
<div
className={cn(
'w-full h-16 flex flex-col justify-center items-center gap-2'
)}
>
<span className='text-gray-500'>Belum ada data penjualan</span>
</div>
}
onDelete={handleDeleteProduct}
onBulkDelete={handleBulkDeleteProduct}
onAddProductClick={handleAddProductClick}
/>
<div className='flex flex-row gap-3 mt-3'>
<Button
type='button'
variant='outline'
className='justify-start w-fit py-1 text-sm'
onClick={handleAddProduct}
>
<Icon icon='mdi:plus' width={16} height={16} />
Tambah Produk
</Button>
{selectedRowIds.length > 0 && (
<Button
type='button'
variant='outline'
color='error'
className='justify-start w-fit py-1 text-sm'
onClick={handleBulkDeleteProduct}
>
<Icon icon='mdi:trash' width={16} height={16} />
Hapus
{selectedRowIds.length > 0
? ` (${selectedRowIds.length})`
: ''}{' '}
Produk
</Button>
)}
</div>
</Card>
<div className='grid grid-cols-2 gap-3'>
<TextArea
@@ -532,10 +389,9 @@ const SalesForm = ({
</Button>
</div>
<div>
<MarketingProductForm
<SalesOrderProductForm
onSubmitForm={handleAddSubmitProduct}
modalRef={addProductModal.ref}
data={rawMarketingProducts}
initialValues={selectedMarketingProduct ?? undefined}
/>
</div>
@@ -1,7 +1,6 @@
import * as Yup from 'yup';
type MarketingProductSchemaType = {
vehicle_number: string | undefined;
type SalesOrderProductSchemaType = {
kandang_id?: number;
kandang?: {
value: number;
@@ -19,11 +18,8 @@ type MarketingProductSchemaType = {
total_price: string | number | undefined;
};
type SalesOrderProductSchemaType = MarketingProductSchemaType;
const MarketingProductSchema: Yup.ObjectSchema<MarketingProductSchemaType> =
export const SalesOrderProductSchema: Yup.ObjectSchema<SalesOrderProductSchemaType> =
Yup.object({
vehicle_number: Yup.string().required('No. Polisi wajib diisi!'),
kandang: Yup.object({
value: Yup.number().min(1).required(),
label: Yup.string().required(),
@@ -48,16 +44,13 @@ const MarketingProductSchema: Yup.ObjectSchema<MarketingProductSchemaType> =
.min(1, 'Kuantitas wajib diisi!')
.required('Kuantitas wajib diisi!'),
avg_weight: Yup.number()
.min(1, 'Avg. Bobot wajib diisi!')
.min(0, 'Avg. Bobot wajib diisi!')
.required('Avg. Bobot wajib diisi!'),
total_price: Yup.number()
.min(1, 'Total Penjualan wajib diisi!')
.required('Total Penjualan wajib diisi!'),
});
export const SalesOrderProductSchema: Yup.ObjectSchema<SalesOrderProductSchemaType> =
MarketingProductSchema;
export type SalesOrderProductFormValues = Yup.InferType<
typeof SalesOrderProductSchema
>;
@@ -1,14 +1,10 @@
'use client';
import {
CreateSalesOrderProductPayload,
MarketingProduct,
} from '@/types/api/marketing/marketing';
import { useFormik } from 'formik';
import {
SalesOrderProductFormValues,
SalesOrderProductSchema,
} from './MarketingProduct.schema';
} from './SalesOrderProduct.schema';
import { RefObject, useEffect, useState } from 'react';
import SelectInput, {
OptionType,
@@ -21,22 +17,15 @@ import { ProductWarehouseApi } from '@/services/api/inventory';
import NumberInput from '@/components/input/NumberInput';
import Button from '@/components/Button';
import { isResponseSuccess } from '@/lib/api-helper';
import PatternInput from '@/components/input/PatternInput';
import { formatVechicleNumber } from '@/lib/helper';
const MarketingProductForm = ({
const SalesOrderProductForm = ({
initialValues,
data,
modalRef,
onSubmitForm,
}: {
initialValues?: MarketingProduct;
data: MarketingProduct[];
initialValues?: SalesOrderProductFormValues;
modalRef?: RefObject<HTMLDialogElement | null>;
onSubmitForm?: (
tableValues: CreateSalesOrderProductPayload,
fieldValues: SalesOrderProductFormValues
) => Promise<void>;
onSubmitForm?: (value: SalesOrderProductFormValues) => Promise<void>;
}) => {
// State
const [selectedOptionsKandang, setSelectedOptionsKandang] =
@@ -97,19 +86,10 @@ const MarketingProductForm = ({
const formik = useFormik<SalesOrderProductFormValues>({
enableReinitialize: true,
initialValues: {
vehicle_number:
initialValues?.delivery_product?.vehicle_number || undefined,
kandang_id: initialValues?.product_warehouse.warehouse.id || undefined,
kandang: {
value: initialValues?.product_warehouse.warehouse.id as number,
label: initialValues?.product_warehouse.warehouse.name as string,
},
product_warehouse: {
value: initialValues?.product_warehouse.product.id as number,
label: initialValues?.product_warehouse.product.name as string,
},
product_warehouse_id:
initialValues?.product_warehouse.product.id || undefined,
kandang_id: initialValues?.kandang_id || undefined,
kandang: initialValues?.kandang || undefined,
product_warehouse: initialValues?.product_warehouse || undefined,
product_warehouse_id: initialValues?.product_warehouse_id || undefined,
unit_price: initialValues?.unit_price || undefined,
total_weight: initialValues?.total_weight || undefined,
qty: initialValues?.qty || undefined,
@@ -130,21 +110,7 @@ const MarketingProductForm = ({
(item: Kandang) => item.id === values.kandang_id
);
const marketingProduct: CreateSalesOrderProductPayload = {
id: initialValues?.id || undefined,
vehicle_number: formatVechicleNumber(values.vehicle_number as string),
kandang_id: values.kandang_id as number,
kandang: kandang,
product_warehouse_id: values.product_warehouse_id as number,
product_warehouse: productWarehouse,
unit_price: values.unit_price as number,
total_weight: values.total_weight as number,
qty: values.qty as number,
avg_weight: values.avg_weight as number,
total_price: values.total_price as number,
};
onSubmitForm?.(marketingProduct, values);
onSubmitForm?.(values);
handleResetForm();
}
},
@@ -161,7 +127,6 @@ const MarketingProductForm = ({
setFormErrorMessage('');
formik.resetForm({
values: {
vehicle_number: '',
kandang_id: undefined,
kandang: null,
product_warehouse: null,
@@ -216,7 +181,7 @@ const MarketingProductForm = ({
onReset={handleResetForm}
>
<div className='grid grid-cols-2 gap-4 z-200'>
<PatternInput
{/* <PatternInput
name='vehicle_number'
label='No. Polisi'
format='AA #### AAA'
@@ -233,7 +198,7 @@ const MarketingProductForm = ({
Boolean(formik.errors.vehicle_number)
}
errorMessage={formik.errors.vehicle_number}
/>
/> */}
<SelectInput
required
label='Kandang'
@@ -347,4 +312,4 @@ const MarketingProductForm = ({
);
};
export default MarketingProductForm;
export default SalesOrderProductForm;
@@ -0,0 +1,200 @@
'use client';
import Button from '@/components/Button';
import Table from '@/components/Table';
import { SalesOrderProductFormValues } from '@/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema';
import { cn, formatCurrency, formatNumber } from '@/lib/helper';
import { Icon } from '@iconify/react';
import { useMemo, useState } from 'react';
import * as TanStack from '@tanstack/react-table';
import CheckboxInput from '@/components/input/CheckboxInput';
// Hapus import Modal, useModal, dan MarketingProductForm
// Tentukan Tipe Props baru yang diterima dari SalesForm
type SalesOrderProductTableProps = {
data: SalesOrderProductFormValues[];
onDelete: (product_warehouse_id: number, kandang_id: number) => void;
onBulkDelete: (selectedIds: number[]) => void;
onAddProductClick: () => void; // Prop baru untuk memanggil modal di parent
};
const SalesOrderProductTable = ({
data,
onDelete,
onBulkDelete,
onAddProductClick,
}: SalesOrderProductTableProps) => {
const [rowSelection, setRowSelection] = useState<Record<string, boolean>>({});
const selectedRowIds = Object.keys(rowSelection).map((item) =>
parseInt(item)
);
const handleBulkDeleteClick = () => {
onBulkDelete(selectedRowIds);
setRowSelection({});
};
const columns = useMemo(
() => [
{
id: 'select',
header: ({
table,
}: {
table: TanStack.Table<SalesOrderProductFormValues>;
}) => (
<div className='w-full flex flex-row justify-center'>
<CheckboxInput
name='allRow'
checked={table.getIsAllRowsSelected()}
indeterminate={table.getIsSomeRowsSelected()}
onChange={table.getToggleAllRowsSelectedHandler()}
/>
</div>
),
cell: ({ row }: { row: TanStack.Row<SalesOrderProductFormValues> }) => (
<div>
<CheckboxInput
name='row'
checked={row.getIsSelected()}
disabled={!row.getCanSelect()}
indeterminate={row.getIsSomeSelected()}
onChange={row.getToggleSelectedHandler()}
value={`${row.original.product_warehouse_id}${row.original.kandang_id}`}
/>
</div>
),
},
{
accessorFn: (row: SalesOrderProductFormValues) => row.kandang?.label,
header: 'Kandang',
},
{
accessorFn: (row: SalesOrderProductFormValues) =>
row.product_warehouse?.label,
header: 'Produk',
},
{
accessorFn: (row: SalesOrderProductFormValues) =>
formatCurrency(parseFloat(row.unit_price as string)),
header: 'Harga Satuan (Rp)',
},
{
accessorFn: (row: SalesOrderProductFormValues) =>
formatNumber(parseFloat(row.total_weight as string)),
header: 'Total Bobot (Kg)',
},
{
accessorFn: (row: SalesOrderProductFormValues) =>
formatNumber(parseFloat(row.qty as string)),
header: 'Kuantitas',
},
{
accessorFn: (row: SalesOrderProductFormValues) =>
formatNumber(parseFloat(row.avg_weight as string)),
header: 'Avg. Bobot (Kg)',
},
{
accessorFn: (row: SalesOrderProductFormValues) =>
formatCurrency(parseFloat(row.total_price as string)),
header: 'Total Penjualan (Rp)',
},
{
header: 'Aksi',
cell: (
props: TanStack.CellContext<SalesOrderProductFormValues, unknown>
) => (
<div className='flex flex-row gap-1 items-center justify-end h-full mt-2'>
<Button
color='error'
className='p-1'
disabled={
!props.row.original.product_warehouse_id ||
!props.row.original.kandang_id
}
onClick={() => {
// PANGGIL CALLBACK PARENT (onDelete)
if (
props.row.original.product_warehouse_id &&
props.row.original.kandang_id
) {
onDelete(
props.row.original.product_warehouse_id,
props.row.original.kandang_id
);
}
}}
>
<Icon icon='mdi:trash' width={16} height={16} />
</Button>
</div>
),
},
],
[onDelete]
);
return (
<>
<Table<SalesOrderProductFormValues>
rowSelection={rowSelection}
setRowSelection={setRowSelection}
data={data}
columns={columns}
className={{
tableWrapperClassName: 'overflow-x-auto min-h-full!',
tableClassName: 'font-inter w-full table-auto min-h-full!',
headerRowClassName: 'border-b border-b-gray-200',
headerColumnClassName:
'px-2 py-2 text-xs font-semibold text-gray-500 last:flex last:flex-row last:justify-end first:flex first:flex-row first:justify-start',
bodyRowClassName: 'border-b border-b-gray-200',
bodyColumnClassName:
'px-2 py-2 last:flex last:flex-row last:justify-end first:flex first:flex-row first:justify-start',
paginationClassName: 'hidden',
}}
emptyContent={
<div
className={cn(
'w-full h-16 flex flex-col justify-center items-center gap-2'
)}
>
<span className='text-gray-500'>Belum ada data penjualan</span>
</div>
}
/>
<div className='flex flex-row gap-3 mt-3'>
<Button
type='button'
variant='outline'
className='justify-start w-fit py-1 text-sm'
onClick={onAddProductClick}
>
<Icon icon='mdi:plus' width={16} height={16} />
Tambah Produk
</Button>
{selectedRowIds.length > 0 && (
<Button
type='button'
variant='outline'
color='error'
className='justify-start w-fit py-1 text-sm'
onClick={handleBulkDeleteClick}
>
<Icon icon='mdi:trash' width={16} height={16} />
Hapus
{selectedRowIds.length > 0
? ` (${selectedRowIds.length})`
: ''}{' '}
Produk
</Button>
)}
</div>
{/* Modal dan Form dihapus dari sini */}
</>
);
};
export default SalesOrderProductTable;
+187 -162
View File
@@ -4,12 +4,34 @@ import { Location } from '@/types/api/master-data/location';
import { Kandang } from '@/types/api/master-data/kandang';
import { Warehouse } from '@/types/api/master-data/warehouse';
import { ProductWarehouse } from '@/types/api/inventory/product-warehouse';
import { Marketing } from '@/types/api/marketing/marketing';
import { CreatedUser } from '@/types/api/api-general';
import {
BaseMarketing,
Marketing,
BaseSalesOrder,
BaseDeliveryOrder,
BaseDelivery,
} from '@/types/api/marketing/marketing';
import {
CreatedUser,
BaseApproval,
BaseMetadata,
} from '@/types/api/api-general';
import { Product } from '@/types/api/master-data/product';
import { Customer } from '@/types/api/master-data/customer';
import { Uom } from '@/types/api/master-data/uom';
import { ProductCategory } from '@/types/api/master-data/product-category';
import { Supplier } from '@/types/api/master-data/supplier';
// Waktu saat ini untuk created_at/updated_at
const now = format(new Date(), 'yyyy-MM-dd HH:mm:ss');
const today = format(new Date(), 'yyyy-MM-dd');
const tomorrow = format(
new Date().setDate(new Date().getDate() + 1),
'yyyy-MM-dd'
);
// ======================
// 👤 Created User
// 👤 Created User & Helper Data
// ======================
export const createdUser: CreatedUser = {
id: 1,
@@ -18,6 +40,24 @@ export const createdUser: CreatedUser = {
name: 'Admin Utama',
};
const dummyProductBase: Product = {
id: 101,
name: 'Pakan Ayam Premium',
brand: 'Brand Hebat',
sku: 'PAK-001',
product_price: 15000,
selling_price: 18000,
tax: 0.1,
expiry_period: 365,
uom: { id: 1, name: 'Sak' } as Uom,
product_category: { id: 1, name: 'Pakan' } as ProductCategory,
suppliers: [{ id: 1, name: 'Supplier A' } as Supplier],
flags: ['PAKAN'],
created_user: createdUser,
created_at: now,
updated_at: now,
};
// ======================
// 📍 Area Dummy
// ======================
@@ -26,15 +66,15 @@ export const dummyAreas: Area[] = [
id: 1,
name: 'Bandung Barat',
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
{
id: 2,
name: 'Cimahi Utara',
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
];
@@ -48,8 +88,8 @@ export const dummyLocations: Location[] = [
address: 'Jl. Sukajadi No. 12',
area: dummyAreas[0],
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
{
id: 2,
@@ -57,8 +97,8 @@ export const dummyLocations: Location[] = [
address: 'Jl. Setiabudi No. 45',
area: dummyAreas[1],
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
];
@@ -74,8 +114,8 @@ export const dummyKandangs: Kandang[] = [
location: dummyLocations[0],
pic: createdUser,
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
{
id: 2,
@@ -85,8 +125,8 @@ export const dummyKandangs: Kandang[] = [
location: dummyLocations[1],
pic: createdUser,
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
];
@@ -100,9 +140,9 @@ export const dummyWarehouses: Warehouse[] = [
name: 'Gudang Wilayah Bandung Barat',
area: dummyAreas[0],
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
created_at: now,
updated_at: now,
} as Warehouse,
{
id: 2,
type: 'LOKASI',
@@ -110,9 +150,9 @@ export const dummyWarehouses: Warehouse[] = [
area: dummyAreas[0],
location: { ...dummyLocations[0], area: dummyAreas[0] },
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
created_at: now,
updated_at: now,
} as Warehouse,
{
id: 3,
type: 'KANDANG',
@@ -125,9 +165,9 @@ export const dummyWarehouses: Warehouse[] = [
pic: createdUser,
},
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
created_at: now,
updated_at: now,
} as Warehouse,
];
// ======================
@@ -139,16 +179,11 @@ export const dummyProductWarehouses: ProductWarehouse[] = [
product_id: 101,
warehouse_id: 1,
quantity: 1000,
product: {
id: 101,
name: 'Pakan Ayam Premium',
sku: 'PAK-001',
category: 'PAKAN',
} as unknown as Product,
product: dummyProductBase,
warehouse: dummyWarehouses[0],
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
{
id: 2,
@@ -156,28 +191,92 @@ export const dummyProductWarehouses: ProductWarehouse[] = [
warehouse_id: 2,
quantity: 500,
product: {
...dummyProductBase,
id: 102,
name: 'Vitamin Ayam Super',
sku: 'VIT-002',
category: 'VITAMIN',
} as unknown as Product,
flags: ['VITAMIN'],
selling_price: 25000,
},
warehouse: dummyWarehouses[1],
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
created_at: now,
updated_at: now,
},
];
// ======================
// 💼 Marketing Dummy
// ======================
export const dummyMarketings: Marketing[] = [
// Step 1: Pengajuan Order
// Helper untuk Sales Order (SO) Item
const soItem1: BaseSalesOrder = {
id: 101,
marketing_id: 1,
product_warehouse_id: 1,
qty: 100,
unit_price: 18000, // Harga jual
avg_weight: 1.0,
total_weight: 100 * 1.0,
total_price: 100 * 18000,
product_warehouse: dummyProductWarehouses[0] as ProductWarehouse,
};
const soItem2: BaseSalesOrder = {
id: 102,
marketing_id: 2,
product_warehouse_id: 2,
qty: 50,
unit_price: 25000,
avg_weight: 0.5,
total_weight: 50 * 0.5,
total_price: 50 * 25000,
product_warehouse: dummyProductWarehouses[1] as ProductWarehouse,
};
// Helper untuk Delivery Item (DO) Detail
const doDelivery1: BaseDelivery[] = [
{
product_warehouse: dummyProductWarehouses[0] as ProductWarehouse,
qty: soItem1.qty,
unit_price: soItem1.unit_price,
total_weight: soItem1.total_weight,
avg_weight: soItem1.avg_weight,
total_price: soItem1.total_price,
vehicle_number: 'B 1234 ABC',
},
];
const doDelivery2: BaseDelivery[] = [
{
product_warehouse: dummyProductWarehouses[1] as ProductWarehouse,
qty: soItem2.qty,
unit_price: soItem2.unit_price,
total_weight: soItem2.total_weight,
avg_weight: soItem2.avg_weight,
total_price: soItem2.total_price,
vehicle_number: 'D 5678 EFG',
},
];
// Helper untuk Delivery Order (DO) Header
const deliveryOrder1: BaseDeliveryOrder[] = [
{
id: 1,
status: 'APPROVED',
marketing_id: 3,
do_number: 'DO-003-2025',
delivery_date: tomorrow,
warehouse: dummyWarehouses[0],
deliveries: doDelivery1,
},
];
export const dummyMarketings: Marketing[] = [
// 1. Pengajuan Order (Langkah Pertama/Awal)
{
id: 1,
status: 'DRAFT',
name: 'SO-001-2025',
so_date: format(new Date(), 'yyyy-MM-dd'),
so_date: today,
customer: {
id: 1,
name: 'PT Maju Jaya',
@@ -189,50 +288,31 @@ export const dummyMarketings: Marketing[] = [
email: 'contact@majujaya.com',
account_number: '1234567890',
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
sales_person_id: createdUser.id,
notes: 'Pengiriman awal bulan.',
approval: {
created_at: now,
updated_at: now,
} as Customer,
sales_person: createdUser,
notes: 'Pengajuan Order Awal, menunggu persetujuan harga.',
latest_approval: {
step_number: 1,
step_name: 'Pengajuan Order',
action: 'APPROVED',
action: 'CREATED',
action_by: createdUser,
action_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
marketing_products: [
{
id: 1,
qty: 100,
unit_price: 75000,
avg_weight: 2.5,
total_weight: 250,
total_price: 7500000,
product_warehouse: dummyProductWarehouses[0],
delivery_product: {
id: 1,
qty: 100,
unit_price: 75000,
avg_weight: 2.5,
total_weight: 250,
total_price: 7500000,
delivery_date: format(new Date(), 'yyyy-MM-dd'),
vehicle_number: 'B 1234 XY',
},
},
],
action_at: now,
} as BaseApproval,
sales_order: [soItem1],
delivery_order: [],
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
created_at: now,
updated_at: now,
} as Marketing,
// Step 2: Sales Order
// 2. Sales Order (Disetujui dan Siap DO)
{
id: 2,
status: 'APPROVED',
name: 'SO-002-2025',
so_date: format(new Date(), 'yyyy-MM-dd'),
so_date: today,
customer: {
id: 2,
name: 'CV Sumber Sehat',
@@ -244,50 +324,32 @@ export const dummyMarketings: Marketing[] = [
email: 'info@sumbersehat.com',
account_number: '9876543210',
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
sales_person_id: createdUser.id,
notes: 'Pesanan kedua untuk stok akhir tahun.',
approval: {
created_at: now,
updated_at: now,
} as Customer,
sales_person: createdUser,
notes: 'Sales Order telah disetujui oleh Supervisor.',
latest_approval: {
id: 2,
step_number: 2,
step_name: 'Sales Order',
action: 'APPROVED',
action_by: createdUser,
action_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
marketing_products: [
{
id: 2,
qty: 50,
unit_price: 75000,
avg_weight: 2.5,
total_weight: 125,
total_price: 3750000,
product_warehouse: dummyProductWarehouses[1],
delivery_product: {
id: 2,
qty: 50,
unit_price: 75000,
avg_weight: 2.5,
total_weight: 125,
total_price: 3750000,
delivery_date: format(new Date(), 'yyyy-MM-dd'),
vehicle_number: 'B 5678 YZ',
},
},
],
action_at: now,
} as BaseApproval,
sales_order: [soItem2],
delivery_order: [], // Belum ada pengiriman (DO) yang dibuat
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
created_at: now,
updated_at: now,
} as Marketing,
// Step 3: Delivery Order
// 3. Delivery Order (Proses Pengiriman telah dibuat)
{
id: 3,
status: 'APPROVED',
status: 'DELIVERED', // Asumsi status DELIVERED berarti DO sudah selesai/terbuat
name: 'SO-003-2025',
so_date: format(new Date(), 'yyyy-MM-dd'),
so_date: today,
customer: {
id: 3,
name: 'UD Ternak Sejahtera',
@@ -299,60 +361,23 @@ export const dummyMarketings: Marketing[] = [
email: 'halo@ternaksejahtera.com',
account_number: '1122334455',
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
sales_person_id: createdUser.id,
notes: 'Order untuk pengiriman ke luar kota.',
approval: {
created_at: now,
updated_at: now,
} as Customer,
sales_person: createdUser,
notes: 'Pengiriman barang telah berhasil dilakukan.',
latest_approval: {
id: 3,
step_number: 3,
step_name: 'Delivery Order',
action: 'APPROVED',
action: 'COMPLETED',
action_by: createdUser,
action_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
marketing_products: [
{
id: 3,
qty: 80,
unit_price: 70000,
avg_weight: 2.4,
total_weight: 192,
total_price: 5600000,
product_warehouse: dummyProductWarehouses[0],
delivery_product: {
id: 3,
qty: 80,
unit_price: 70000,
avg_weight: 2.4,
total_weight: 192,
total_price: 5600000,
delivery_date: format(new Date(), 'yyyy-MM-dd'),
vehicle_number: 'D 9090 ZZ',
},
},
{
id: 4,
qty: 80,
unit_price: 70000,
avg_weight: 2.4,
total_weight: 192,
total_price: 5600000,
product_warehouse: dummyProductWarehouses[0],
delivery_product: {
id: 3,
qty: 80,
unit_price: 70000,
avg_weight: 2.4,
total_weight: 192,
total_price: 5600000,
delivery_date: format(new Date(), 'yyyy-MM-dd'),
vehicle_number: 'D 9090 ZZ',
},
},
],
action_at: now,
} as BaseApproval,
sales_order: [soItem1, soItem2],
delivery_order: deliveryOrder1, // DO sudah terbuat
created_user: createdUser,
created_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
updated_at: format(new Date(), 'yyyy-MM-dd HH:mm:ss'),
},
created_at: now,
updated_at: now,
} as Marketing,
];
+46
View File
@@ -9,6 +9,17 @@ import {
UpdateSalesOrderPayload,
} from '@/types/api/marketing/marketing';
/**
* 💡 Helper untuk membuat respons dummy
* @param data Data yang akan dimasukkan ke dalam body respons
*/
const createDummyResponse = <T>(data: T): BaseApiResponse<T> => ({
code: 200,
status: 'success',
message: 'Data retrieved successfully (MOCK)',
data: data,
});
export class MarketingService extends BaseApiService<
Marketing,
CreateSalesOrderPayload,
@@ -18,6 +29,41 @@ export class MarketingService extends BaseApiService<
super(basePath);
}
/**
* Override: Mengambil semua data Marketing dari dummyMarketings
*/
async getAllFetcher(endpoint: string): Promise<BaseApiResponse<Marketing[]>> {
// Simulasi delay jaringan
await sleep(500);
// Filter data marketing yang valid (jika menggunakan BaseMarketing[])
const data = dummyMarketings as Marketing[];
return createDummyResponse<Marketing[]>(data);
}
/**
* Override: Mengambil satu data Marketing berdasarkan ID dari dummyMarketings
*/
async getSingle(id: number): Promise<BaseApiResponse<Marketing> | undefined> {
// Simulasi delay jaringan
await sleep(300);
const foundData = dummyMarketings.find((m) => m.id == id);
if (foundData) {
// Data ditemukan, kembalikan respons sukses
return createDummyResponse<Marketing>(foundData as Marketing);
} else {
// Data tidak ditemukan, simulasi respons error
return {
code: 404,
status: 'error',
message: 'Marketing data not found (MOCK)',
};
}
}
/**
* Approve single marketing data
*/
+37 -3
View File
@@ -6,6 +6,8 @@ import {
} from '@/types/api/api-general';
import { ProductWarehouse } from '@/types/api/inventory/product-warehouse';
import { Kandang } from '@/types/api/master-data/kandang';
import { id } from 'react-day-picker/locale';
import { Warehouse } from '../master-data/warehouse';
/**
* Base Data Response
@@ -16,10 +18,42 @@ export type BaseMarketing = {
name: string;
customer: Customer;
so_date: string;
sales_person_id: number;
sales_person: CreatedUser;
notes: string;
approval: BaseApproval;
marketing_products?: MarketingProduct[];
latest_approval: BaseApproval;
sales_order: BaseSalesOrder[];
delivery_order: BaseDeliveryOrder[];
};
export type BaseSalesOrder = {
id: number;
marketing_id: number;
product_warehouse_id: number;
qty: number;
unit_price: number;
avg_weight: number;
total_weight: number;
total_price: number;
product_warehouse: ProductWarehouse;
};
export type BaseDeliveryOrder = {
id: number;
marketing_id: number;
do_number: string;
delivery_date: string;
warehouse: Warehouse;
deliveries: BaseDelivery[];
};
export type BaseDelivery = {
product_warehouse: ProductWarehouse;
qty: number;
unit_price: number;
total_weight: number;
avg_weight: number;
total_price: number;
vehicle_number: string;
};
export type MarketingProduct = {