diff --git a/src/frontend/src/forms/SalesOrderForms.tsx b/src/frontend/src/forms/SalesOrderForms.tsx index 36a0963e7f..7550534dc0 100644 --- a/src/frontend/src/forms/SalesOrderForms.tsx +++ b/src/frontend/src/forms/SalesOrderForms.tsx @@ -1,8 +1,10 @@ import { t } from '@lingui/core/macro'; -import { Table } from '@mantine/core'; +import { Alert, Table, Text } from '@mantine/core'; import { IconAddressBook, IconCalendar, + IconCircleCheck, + IconCircleX, IconCoins, IconUser, IconUsers @@ -23,8 +25,9 @@ import type { ApiFormFieldType } from '@lib/types/Forms'; import type { TableFieldRowProps } from '../components/forms/fields/TableField'; -import { useCreateApiFormModal } from '../hooks/UseForm'; +import { useCreateApiFormModal, useEditApiFormModal } from '../hooks/UseForm'; import { useGlobalSettingsState } from '../states/SettingsStates'; +import { useUserState } from '../states/UserState'; import { RenderPartColumn } from '../tables/ColumnRenderers'; export function useSalesOrderFields({ @@ -190,6 +193,64 @@ export function useSalesOrderLineItemFields({ }, [salePrice, partCurrency, orderId, create]); } +export function useCheckShipmentForm({ + shipmentId, + onSuccess +}: { + shipmentId: number; + onSuccess: (response: any) => void; +}) { + const user = useUserState(); + + return useEditApiFormModal({ + url: ApiEndpoints.sales_order_shipment_list, + pk: shipmentId, + title: t`Check Shipment`, + preFormContent: ( + } title={t`Check Shipment`}> + {t`Marking the shipment as checked indicates that you have verified that all items included in this shipment are correct`} + + ), + fetchInitialData: false, + fields: { + checked_by: { + hidden: true, + value: user.getUser()?.pk + } + }, + successMessage: t`Shipment marked as checked`, + onFormSuccess: onSuccess + }); +} + +export function useUncheckShipmentForm({ + shipmentId, + onSuccess +}: { + shipmentId: number; + onSuccess: (response: any) => void; +}) { + return useEditApiFormModal({ + url: ApiEndpoints.sales_order_shipment_list, + pk: shipmentId, + title: t`Uncheck Shipment`, + preFormContent: ( + } title={t`Uncheck Shipment`}> + {t`Marking the shipment as unchecked indicates that the shipment requires further verification`} + + ), + fetchInitialData: false, + fields: { + checked_by: { + hidden: true, + value: null + } + }, + successMessage: t`Shipment marked as unchecked`, + onFormSuccess: onSuccess + }); +} + function SalesOrderAllocateLineRow({ props, record, diff --git a/src/frontend/src/pages/sales/SalesOrderShipmentDetail.tsx b/src/frontend/src/pages/sales/SalesOrderShipmentDetail.tsx index 3353b44278..153933dac9 100644 --- a/src/frontend/src/pages/sales/SalesOrderShipmentDetail.tsx +++ b/src/frontend/src/pages/sales/SalesOrderShipmentDetail.tsx @@ -1,5 +1,5 @@ import { t } from '@lingui/core/macro'; -import { Alert, Grid, Skeleton, Stack, Text } from '@mantine/core'; +import { Grid, Skeleton, Stack, Text } from '@mantine/core'; import { IconBookmark, IconCircleCheck, @@ -39,8 +39,10 @@ import { RenderAddress } from '../../components/render/Company'; import { RenderUser } from '../../components/render/User'; import { formatDate } from '../../defaults/formatters'; import { + useCheckShipmentForm, useSalesOrderShipmentCompleteFields, - useSalesOrderShipmentFields + useSalesOrderShipmentFields, + useUncheckShipmentForm } from '../../forms/SalesOrderForms'; import { useCreateApiFormModal, @@ -320,44 +322,14 @@ export default function SalesOrderShipmentDetail() { onFormSuccess: refreshShipment }); - const checkShipment = useEditApiFormModal({ - url: ApiEndpoints.sales_order_shipment_list, - pk: shipment.pk, - title: t`Check Shipment`, - preFormContent: ( - } title={t`Check Shipment`}> - {t`Marking the shipment as checked indicates that you have verified that all items included in this shipment are correct`} - - ), - fetchInitialData: false, - fields: { - checked_by: { - hidden: true, - value: userId - } - }, - successMessage: t`Shipment marked as checked`, - onFormSuccess: refreshShipment + const checkShipment = useCheckShipmentForm({ + shipmentId: shipment.pk, + onSuccess: refreshShipment }); - const uncheckShipment = useEditApiFormModal({ - url: ApiEndpoints.sales_order_shipment_list, - pk: shipment.pk, - title: t`Uncheck Shipment`, - preFormContent: ( - } title={t`Uncheck Shipment`}> - {t`Marking the shipment as unchecked indicates that the shipment requires further verification`} - - ), - fetchInitialData: false, - fields: { - checked_by: { - hidden: true, - value: null - } - }, - successMessage: t`Shipment marked as unchecked`, - onFormSuccess: refreshShipment + const uncheckShipment = useUncheckShipmentForm({ + shipmentId: shipment.pk, + onSuccess: refreshShipment }); const shipmentBadges = useMemo(() => { diff --git a/src/frontend/src/tables/sales/SalesOrderShipmentTable.tsx b/src/frontend/src/tables/sales/SalesOrderShipmentTable.tsx index 7834c79e4c..1727cad418 100644 --- a/src/frontend/src/tables/sales/SalesOrderShipmentTable.tsx +++ b/src/frontend/src/tables/sales/SalesOrderShipmentTable.tsx @@ -1,5 +1,9 @@ import { t } from '@lingui/core/macro'; -import { IconTruckDelivery } from '@tabler/icons-react'; +import { + IconCircleCheck, + IconCircleX, + IconTruckDelivery +} from '@tabler/icons-react'; import { useCallback, useMemo, useState } from 'react'; import { useNavigate } from 'react-router-dom'; @@ -19,8 +23,10 @@ import type { TableFilter } from '@lib/types/Filters'; import type { TableColumn } from '@lib/types/Tables'; import dayjs from 'dayjs'; import { + useCheckShipmentForm, useSalesOrderShipmentCompleteFields, - useSalesOrderShipmentFields + useSalesOrderShipmentFields, + useUncheckShipmentForm } from '../../forms/SalesOrderForms'; import { useCreateApiFormModal, @@ -91,6 +97,20 @@ export default function SalesOrderShipmentTable({ table: table }); + const checkShipment = useCheckShipmentForm({ + shipmentId: selectedShipment.pk, + onSuccess: () => { + table.refreshTable(); + } + }); + + const uncheckShipment = useUncheckShipmentForm({ + shipmentId: selectedShipment.pk, + onSuccess: () => { + table.refreshTable(); + } + }); + const completeShipment = useCreateApiFormModal({ url: ApiEndpoints.sales_order_shipment_complete, pk: selectedShipment.pk, @@ -188,6 +208,30 @@ export default function SalesOrderShipmentTable({ const shipped: boolean = !!record.shipment_date; return [ + { + hidden: + !!record.checked_by || !user.hasChangeRole(UserRoles.sales_order), + title: t`Check Shipment`, + color: 'blue', + icon: , + onClick: () => { + setSelectedShipment(record); + checkShipment.open(); + } + }, + { + hidden: + shipped || + !record.checked_by || + !user.hasChangeRole(UserRoles.sales_order), + title: t`Uncheck Shipment`, + color: 'red', + icon: , + onClick: () => { + setSelectedShipment(record); + uncheckShipment.open(); + } + }, { hidden: shipped || !user.hasChangeRole(UserRoles.sales_order), title: t`Complete Shipment`, @@ -271,7 +315,9 @@ export default function SalesOrderShipmentTable({ <> {newShipment.modal} {editShipment.modal} + {checkShipment.modal} {deleteShipment.modal} + {uncheckShipment.modal} {completeShipment.modal}