@inventreedb/ui 0.0.1 → 0.0.3

package/src/tables/sales/SalesOrderLineItemTable.tsx

@@ -1,508 +0,0 @@
-import { t } from '@lingui/core/macro';
-import { Group, Paper, Text } from '@mantine/core';
-import {
-  IconArrowRight,
-  IconHash,
-  IconShoppingCart,
-  IconSquareArrowRight,
-  IconTools
-} from '@tabler/icons-react';
-import type { DataTableRowExpansionProps } from 'mantine-datatable';
-import { type ReactNode, useCallback, useMemo, useState } from 'react';
-import { useNavigate } from 'react-router-dom';
-
-import { ApiEndpoints } from '@lib/enums/ApiEndpoints';
-import { ModelType } from '@lib/enums/ModelType';
-import { UserRoles } from '@lib/enums/Roles';
-import { apiUrl } from '@lib/functions/Api';
-import type { TableFilter } from '@lib/types/Filters';
-import { ActionButton } from '../../components/buttons/ActionButton';
-import { AddItemButton } from '../../components/buttons/AddItemButton';
-import { ProgressBar } from '../../components/items/ProgressBar';
-import { RenderPart } from '../../components/render/Part';
-import OrderPartsWizard from '../../components/wizards/OrderPartsWizard';
-import { formatCurrency } from '../../defaults/formatters';
-import { useBuildOrderFields } from '../../forms/BuildForms';
-import {
-  useAllocateToSalesOrderForm,
-  useSalesOrderAllocateSerialsFields,
-  useSalesOrderLineItemFields
-} from '../../forms/SalesOrderForms';
-import {
-  useCreateApiFormModal,
-  useDeleteApiFormModal,
-  useEditApiFormModal
-} from '../../hooks/UseForm';
-import { useTable } from '../../hooks/UseTable';
-import { useUserState } from '../../states/UserState';
-import type { TableColumn } from '../Column';
-import { DateColumn, LinkColumn, PartColumn } from '../ColumnRenderers';
-import { InvenTreeTable } from '../InvenTreeTable';
-import {
-  type RowAction,
-  RowDeleteAction,
-  RowDuplicateAction,
-  RowEditAction,
-  RowViewAction
-} from '../RowActions';
-import RowExpansionIcon from '../RowExpansionIcon';
-import { TableHoverCard } from '../TableHoverCard';
-import SalesOrderAllocationTable from './SalesOrderAllocationTable';
-
-export default function SalesOrderLineItemTable({
-  orderId,
-  currency,
-  customerId,
-  editable
-}: Readonly<{
-  orderId: number;
-  currency: string;
-  customerId: number;
-  editable: boolean;
-}>) {
-  const navigate = useNavigate();
-  const user = useUserState();
-  const table = useTable('sales-order-line-item');
-
-  const tableColumns: TableColumn[] = useMemo(() => {
-    return [
-      {
-        accessor: 'part',
-        sortable: true,
-        switchable: false,
-        render: (record: any) => {
-          return (
-            <Group wrap='nowrap'>
-              <RowExpansionIcon
-                enabled={record.allocated}
-                expanded={table.isRowExpanded(record.pk)}
-              />
-              <PartColumn part={record.part_detail} />
-            </Group>
-          );
-        }
-      },
-      {
-        accessor: 'part_detail.IPN',
-        title: t`IPN`,
-        switchable: true
-      },
-      {
-        accessor: 'part_detail.description',
-        title: t`Description`,
-        sortable: false,
-        switchable: true
-      },
-      {
-        accessor: 'reference',
-        sortable: false,
-        switchable: true
-      },
-      {
-        accessor: 'quantity',
-        sortable: true
-      },
-      {
-        accessor: 'sale_price',
-        render: (record: any) =>
-          formatCurrency(record.sale_price, {
-            currency: record.sale_price_currency
-          })
-      },
-      {
-        accessor: 'total_price',
-        title: t`Total Price`,
-        render: (record: any) =>
-          formatCurrency(record.sale_price, {
-            currency: record.sale_price_currency,
-            multiplier: record.quantity
-          })
-      },
-      DateColumn({
-        accessor: 'target_date',
-        sortable: true,
-        title: t`Target Date`
-      }),
-      {
-        accessor: 'stock',
-        title: t`Available Stock`,
-        render: (record: any) => {
-          const part_stock = record?.available_stock ?? 0;
-          const variant_stock = record?.available_variant_stock ?? 0;
-          const available = part_stock + variant_stock;
-
-          const required = Math.max(
-            record.quantity - record.allocated - record.shipped,
-            0
-          );
-
-          let color: string | undefined = undefined;
-          let text = `${available}`;
-
-          const extra: ReactNode[] = [];
-
-          if (available <= 0) {
-            color = 'red';
-            text = t`No stock available`;
-          } else if (available < required) {
-            color = 'orange';
-          }
-
-          if (variant_stock > 0) {
-            extra.push(<Text size='sm'>{t`Includes variant stock`}</Text>);
-          }
-
-          if (record.building > 0) {
-            extra.push(
-              <Text size='sm'>
-                {t`In production`}: {record.building}
-              </Text>
-            );
-          }
-
-          if (record.on_order > 0) {
-            extra.push(
-              <Text size='sm'>
-                {t`On order`}: {record.on_order}
-              </Text>
-            );
-          }
-
-          return (
-            <TableHoverCard
-              value={<Text c={color}>{text}</Text>}
-              extra={extra}
-              title={t`Stock Information`}
-            />
-          );
-        }
-      },
-      {
-        accessor: 'allocated',
-        sortable: true,
-        render: (record: any) => (
-          <ProgressBar
-            progressLabel={true}
-            value={record.allocated}
-            maximum={record.quantity}
-          />
-        )
-      },
-      {
-        accessor: 'shipped',
-        sortable: true,
-        render: (record: any) => (
-          <ProgressBar
-            progressLabel={true}
-            value={record.shipped}
-            maximum={record.quantity}
-          />
-        )
-      },
-      {
-        accessor: 'notes'
-      },
-      LinkColumn({
-        accessor: 'link'
-      })
-    ];
-  }, [table.isRowExpanded]);
-
-  const [selectedLineId, setSelectedLineId] = useState<number>(0);
-
-  const [selectedSupplierPart, setSelectedSupplierPart] = useState<any>(null);
-
-  const [initialData, setInitialData] = useState({});
-
-  const createLineFields = useSalesOrderLineItemFields({
-    orderId: orderId,
-    customerId: customerId,
-    create: true
-  });
-
-  const newLine = useCreateApiFormModal({
-    url: ApiEndpoints.sales_order_line_list,
-    title: t`Add Line Item`,
-    fields: createLineFields,
-    initialData: {
-      ...initialData,
-      sale_price_currency: currency
-    },
-    table: table
-  });
-
-  const editLineFields = useSalesOrderLineItemFields({
-    orderId: orderId,
-    customerId: customerId,
-    create: false
-  });
-
-  const editLine = useEditApiFormModal({
-    url: ApiEndpoints.sales_order_line_list,
-    pk: selectedLineId,
-    title: t`Edit Line Item`,
-    fields: editLineFields,
-    table: table
-  });
-
-  const deleteLine = useDeleteApiFormModal({
-    url: ApiEndpoints.sales_order_line_list,
-    pk: selectedLineId,
-    title: t`Delete Line Item`,
-    table: table
-  });
-
-  const allocateSerialFields = useSalesOrderAllocateSerialsFields({
-    itemId: selectedLineId,
-    orderId: orderId
-  });
-
-  const allocateBySerials = useCreateApiFormModal({
-    url: ApiEndpoints.sales_order_allocate_serials,
-    pk: orderId,
-    title: t`Allocate Serial Numbers`,
-    preFormContent: selectedSupplierPart ? (
-      <Paper withBorder p='sm'>
-        <RenderPart instance={selectedSupplierPart} />
-      </Paper>
-    ) : undefined,
-    initialData: initialData,
-    fields: allocateSerialFields,
-    table: table
-  });
-
-  const buildOrderFields = useBuildOrderFields({ create: true });
-
-  const newBuildOrder = useCreateApiFormModal({
-    url: ApiEndpoints.build_order_list,
-    title: t`Create Build Order`,
-    fields: buildOrderFields,
-    initialData: initialData,
-    follow: true,
-    modelType: ModelType.build
-  });
-
-  const [selectedItems, setSelectedItems] = useState<any[]>([]);
-
-  const allocateStock = useAllocateToSalesOrderForm({
-    orderId: orderId,
-    lineItems: selectedItems,
-    onFormSuccess: () => {
-      table.refreshTable();
-      table.clearSelectedRecords();
-    }
-  });
-
-  const [partsToOrder, setPartsToOrder] = useState<any[]>([]);
-
-  const orderPartsWizard = OrderPartsWizard({
-    parts: partsToOrder
-  });
-
-  const tableFilters: TableFilter[] = useMemo(() => {
-    return [
-      {
-        name: 'allocated',
-        label: t`Allocated`,
-        description: t`Show lines which are fully allocated`
-      },
-      {
-        name: 'completed',
-        label: t`Completed`,
-        description: t`Show lines which are completed`
-      }
-    ];
-  }, []);
-
-  const tableActions = useMemo(() => {
-    return [
-      <AddItemButton
-        key='add-line-item'
-        tooltip={t`Add Line Item`}
-        onClick={() => {
-          setInitialData({
-            order: orderId
-          });
-          newLine.open();
-        }}
-        hidden={!editable || !user.hasAddRole(UserRoles.sales_order)}
-      />,
-      <ActionButton
-        key='order-parts'
-        hidden={!user.hasAddRole(UserRoles.purchase_order)}
-        disabled={!table.hasSelectedRecords}
-        tooltip={t`Order Parts`}
-        icon={<IconShoppingCart />}
-        color='blue'
-        onClick={() => {
-          setPartsToOrder(table.selectedRecords.map((r) => r.part_detail));
-          orderPartsWizard.openWizard();
-        }}
-      />,
-      <ActionButton
-        key='allocate-stock'
-        tooltip={t`Allocate Stock`}
-        icon={<IconArrowRight />}
-        disabled={!table.hasSelectedRecords}
-        color='green'
-        onClick={() => {
-          setSelectedItems(
-            table.selectedRecords.filter((r) => r.allocated < r.quantity)
-          );
-          allocateStock.open();
-        }}
-      />
-    ];
-  }, [user, orderId, table.hasSelectedRecords, table.selectedRecords]);
-
-  const rowActions = useCallback(
-    (record: any): RowAction[] => {
-      const allocated = (record?.allocated ?? 0) > (record?.quantity ?? 0);
-
-      return [
-        RowViewAction({
-          title: t`View Part`,
-          modelType: ModelType.part,
-          modelId: record.part,
-          navigate: navigate,
-          hidden: !user.hasViewRole(UserRoles.part)
-        }),
-        {
-          hidden:
-            allocated ||
-            !editable ||
-            !user.hasChangeRole(UserRoles.sales_order),
-          title: t`Allocate Stock`,
-          icon: <IconSquareArrowRight />,
-          color: 'green',
-          onClick: () => {
-            setSelectedItems([record]);
-            allocateStock.open();
-          }
-        },
-        {
-          hidden:
-            !record?.part_detail?.trackable ||
-            allocated ||
-            !editable ||
-            !user.hasChangeRole(UserRoles.sales_order),
-          title: t`Allocate serials`,
-          icon: <IconHash />,
-          color: 'green',
-          onClick: () => {
-            setSelectedLineId(record.pk);
-            setSelectedSupplierPart(record?.part_detail ?? null);
-            setInitialData({
-              quantity: record.quantity - record.allocated
-            });
-            allocateBySerials.open();
-          }
-        },
-        {
-          hidden:
-            allocated ||
-            !user.hasAddRole(UserRoles.build) ||
-            !record?.part_detail?.assembly,
-          title: t`Build stock`,
-          icon: <IconTools />,
-          color: 'blue',
-          onClick: () => {
-            setInitialData({
-              part: record.part,
-              quantity: (record?.quantity ?? 1) - (record?.allocated ?? 0),
-              sales_order: orderId
-            });
-            newBuildOrder.open();
-          }
-        },
-        {
-          hidden:
-            allocated ||
-            !user.hasAddRole(UserRoles.purchase_order) ||
-            !record?.part_detail?.purchaseable,
-          title: t`Order stock`,
-          icon: <IconShoppingCart />,
-          color: 'blue',
-          onClick: () => {
-            setPartsToOrder([record.part_detail]);
-            orderPartsWizard.openWizard();
-          }
-        },
-        RowEditAction({
-          hidden: !editable || !user.hasChangeRole(UserRoles.sales_order),
-          onClick: () => {
-            setSelectedLineId(record.pk);
-            editLine.open();
-          }
-        }),
-        RowDuplicateAction({
-          hidden: !editable || !user.hasAddRole(UserRoles.sales_order),
-          onClick: () => {
-            setInitialData(record);
-            newLine.open();
-          }
-        }),
-        RowDeleteAction({
-          hidden: !editable || !user.hasDeleteRole(UserRoles.sales_order),
-          onClick: () => {
-            setSelectedLineId(record.pk);
-            deleteLine.open();
-          }
-        })
-      ];
-    },
-    [navigate, user, editable]
-  );
-
-  // Control row expansion
-  const rowExpansion: DataTableRowExpansionProps<any> = useMemo(() => {
-    return {
-      allowMultiple: true,
-      expandable: ({ record }: { record: any }) => {
-        return table.isRowExpanded(record.pk) || record.allocated > 0;
-      },
-      content: ({ record }: { record: any }) => {
-        return (
-          <SalesOrderAllocationTable
-            showOrderInfo={false}
-            showPartInfo={false}
-            orderId={orderId}
-            lineItemId={record.pk}
-            partId={record.part}
-            allowEdit
-            isSubTable
-          />
-        );
-      }
-    };
-  }, [orderId, table.isRowExpanded]);
-
-  return (
-    <>
-      {editLine.modal}
-      {deleteLine.modal}
-      {newLine.modal}
-      {newBuildOrder.modal}
-      {allocateBySerials.modal}
-      {allocateStock.modal}
-      {orderPartsWizard.wizard}
-      <InvenTreeTable
-        url={apiUrl(ApiEndpoints.sales_order_line_list)}
-        tableState={table}
-        columns={tableColumns}
-        props={{
-          enableSelection: true,
-          enableDownload: true,
-          params: {
-            order: orderId,
-            part_detail: true
-          },
-          rowActions: rowActions,
-          tableActions: tableActions,
-          tableFilters: tableFilters,
-          rowExpansion: rowExpansion
-        }}
-      />
-    </>
-  );
-}