mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 05:22:02 +00:00
refactor(FE-177-166-167): separate table repeater component and adjust data types with new API Payload
This commit is contained in:
@@ -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,4 +1,4 @@
|
||||
import SalesOrderTable from '@/components/pages/marketing/sales-orders/SalesOrderTable';
|
||||
import SalesOrderTable from '@/components/pages/marketing/MarketingTable';
|
||||
|
||||
const SalesOrder = () => {
|
||||
return (
|
||||
|
||||
+10
-17
@@ -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={[
|
||||
+14
-28
@@ -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!',
|
||||
+3
-4
@@ -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!'),
|
||||
+77
-221
@@ -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>
|
||||
+3
-10
@@ -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
|
||||
>;
|
||||
+12
-47
@@ -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
@@ -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,
|
||||
];
|
||||
|
||||
@@ -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
@@ -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 = {
|
||||
|
||||
Reference in New Issue
Block a user