优化采购单

web/pages/purchase/order.tsx

@@ -32,6 +32,7 @@ import type IPurchaseOrder from '@/domain/iPurchaseOrder.ts';
 import type {
   IPurchaseCell,
   IPurchaseCellItem,
+  IPurchaseContainerStore,
   IPurchaseDetail,
   IPurchaseDetailRow,
   IPurchaseStoreItem,
@@ -44,8 +45,9 @@ import {
   getPurchaseCell,
   getPurchaseDetail,
   getPurchaseStoreSummary,
-  type PurchaseCellUpdateParams, type PurchaseRowUpdateParams,
+  type PurchaseCellUpdateParams, type PurchaseContainerOrderParams, type PurchaseRowUpdateParams,
   updatePurchaseCellItem,
+  updatePurchaseContainer,
   updatePurchaseRow,
 } from '@/api/purchase/order.ts';
 import { Update } from '@/api/common/table.ts';
@@ -98,6 +100,26 @@ const PurchaseOrderPage: React.FC = () => {
   const [storeSummary, setStoreSummary] = useState<IPurchaseStoreSummary | null>(null);
   const [storeLoading, setStoreLoading] = useState(false);
 
+  // 周转框/托盘合并记录修改（按门店覆盖全部订单逐笔修改）
+  const [containerOpen, setContainerOpen] = useState(false);
+  const [containerStore, setContainerStore] = useState<IPurchaseContainerStore | null>(null);
+  const [containerSaving, setContainerSaving] = useState(false);
+  const [containerForm] = Form.useForm<{ orders: PurchaseContainerOrderParams[] }>();
+
+  // 弹窗内实时预览：合并合计 = Σ 各订单框/托盘数量，附加金额 = 合计 × 单价
+  const watchContainerOrders = Form.useWatch('orders', containerForm) ?? [];
+  const previewContainerBox = watchContainerOrders.reduce(
+    (sum, order) => sum + Number(order?.box_num ?? 0),
+    0,
+  );
+  const previewContainerTray = watchContainerOrders.reduce(
+    (sum, order) => sum + Number(order?.tray_num ?? 0),
+    0,
+  );
+  const previewContainerAdded =
+    previewContainerBox * Number(containerStore?.box_price ?? 0) +
+    previewContainerTray * Number(containerStore?.tray_price ?? 0);
+
   useEffect(() => {
     getSupplierOptions().then((res) => setSuppliers(res.data.data ?? []));
   }, []);
@@ -242,6 +264,37 @@ const PurchaseOrderPage: React.FC = () => {
     }
   };
 
+  /** 打开周转框/托盘合并记录修改（初始化该门店全部订单的当前数量） */
+  const openContainerEdit = (store: IPurchaseContainerStore) => {
+    setContainerStore(store);
+    containerForm.setFieldsValue({
+      orders: store.orders.map((order) => ({
+        order_id: order.order_id,
+        box_num: order.box_num,
+        tray_num: order.tray_num,
+      })),
+    });
+    setContainerOpen(true);
+  };
+
+  /** 提交合并记录修改：逐笔更新订单，自动重算附加金额与订单总金额 */
+  const handleContainerSave = async (values: { orders: PurchaseContainerOrderParams[] }) => {
+    if (!detail || !containerStore) {
+      return;
+    }
+    setContainerSaving(true);
+    try {
+      await updatePurchaseContainer(detail.purchase.id!, containerStore.store_id, values.orders);
+      message.success('周转框/托盘已更新，订单金额已重算');
+      setContainerOpen(false);
+      setContainerStore(null);
+      await loadDetail(detail.purchase.id!);
+      await tableRef.current?.reload();
+    } finally {
+      setContainerSaving(false);
+    }
+  };
+
   const handleComplete = async (id: number) => {
     setCompleting(true);
     try {
@@ -420,6 +473,61 @@ const PurchaseOrderPage: React.FC = () => {
     );
   };
 
+  /** 周转框/托盘合并记录列：门店/订单数/框合计/托盘合计/附加金额（合计可点击下钻逐订单修改） */
+  const containerColumns: TableProps<IPurchaseContainerStore>['columns'] = [
+    { title: '门店', dataIndex: 'store_name', width: 180, align: 'center' },
+    { title: '订单数', dataIndex: 'order_count', width: 90, align: 'center' },
+    {
+      title: '周转框合计',
+      dataIndex: 'box_num',
+      width: 110,
+      align: 'center',
+      render: (_, row) => (
+        <Typography.Link onClick={() => openContainerEdit(row)}>{row.box_num}</Typography.Link>
+      ),
+    },
+    {
+      title: '周转托盘合计',
+      dataIndex: 'tray_num',
+      width: 120,
+      align: 'center',
+      render: (_, row) => (
+        <Typography.Link onClick={() => openContainerEdit(row)}>{row.tray_num}</Typography.Link>
+      ),
+    },
+    {
+      title: '附加金额',
+      dataIndex: 'added_amount',
+      width: 110,
+      align: 'center',
+      render: (_, row) => <Text strong type="danger">¥{row.added_amount}</Text>,
+    },
+  ];
+
+  /** 周转框/托盘合并记录合计行 */
+  const renderContainerSummary = () => {
+    const containers = detail?.containers ?? [];
+    const totalBox = containers.reduce((sum, row) => sum + row.box_num, 0);
+    const totalTray = containers.reduce((sum, row) => sum + row.tray_num, 0);
+    const totalAdded = containers.reduce((sum, row) => sum + Number(row.added_amount), 0);
+    return (
+      <Table.Summary.Row>
+        <Table.Summary.Cell index={0} colSpan={2} align="center">
+          <Text strong>合计</Text>
+        </Table.Summary.Cell>
+        <Table.Summary.Cell index={2} align="center">
+          <Text strong>{totalBox}</Text>
+        </Table.Summary.Cell>
+        <Table.Summary.Cell index={3} align="center">
+          <Text strong>{totalTray}</Text>
+        </Table.Summary.Cell>
+        <Table.Summary.Cell index={4} align="center">
+          <Text strong type="danger">¥{totalAdded.toFixed(2)}</Text>
+        </Table.Summary.Cell>
+      </Table.Summary.Row>
+    );
+  };
+
   const columns: XinTableColumn<IPurchaseOrder>[] = [
     {
       title: '采购单号',
@@ -588,6 +696,7 @@ const PurchaseOrderPage: React.FC = () => {
               items={[
                 { key: 'items', label: '商品明细' },
                 { key: 'stores', label: '门店购买详情' },
+                { key: 'containers', label: '周转框/托盘' },
               ]}
             />
 
@@ -627,6 +736,24 @@ const PurchaseOrderPage: React.FC = () => {
                   )}
                 </Spin>
               </>
+            ) : detailTab === 'containers' ? (
+              detail.containers.length > 0 ? (
+                <Table<IPurchaseContainerStore>
+                  rowKey="store_id"
+                  size="small"
+                  bordered
+                  columns={containerColumns}
+                  dataSource={detail.containers}
+                  pagination={false}
+                  summary={renderContainerSummary}
+                />
+              ) : (
+                <Empty
+                  image={Empty.PRESENTED_IMAGE_SIMPLE}
+                  description="该采购单暂无门店订单"
+                  className="py-8!"
+                />
+              )
             ) : (
               <>
                 <Space style={{ marginBottom: 20 }}>
@@ -877,6 +1004,101 @@ const PurchaseOrderPage: React.FC = () => {
           </Form.Item>
         </Form>
       </Modal>
+
+      {/* 周转框/托盘合并记录下钻：按门店展示全部订单逐笔修改（采购单已完成则只读） */}
+      <Modal
+        title={
+          containerStore
+            ? `${containerStore.store_name} · 周转框/托盘`
+            : '周转框/托盘'
+        }
+        open={containerOpen}
+        onCancel={() => {
+          setContainerOpen(false);
+          setContainerStore(null);
+        }}
+        onOk={() => containerForm.submit()}
+        confirmLoading={containerSaving}
+        okText="保存"
+        okButtonProps={{ disabled: detail?.purchase.status !== 0 }}
+        width={760}
+        destroyOnHidden
+      >
+        <div className="py-2 text-gray-500">
+          该门店在本采购单下的全部订单（{containerStore?.order_count ?? 0} 笔）：
+          {detail?.purchase.status === 0
+            ? '逐笔修改后保存，系统将自动重算每笔订单的附加金额与订单总金额。'
+            : '采购单已完成，仅可查看。'}
+        </div>
+        <Form form={containerForm} layout="vertical" onFinish={handleContainerSave}>
+          <Form.List name="orders">
+            {(fields) => (
+              <div className="overflow-hidden rounded border border-gray-200">
+                <div className="flex bg-gray-50 px-4 py-2 text-sm text-gray-500">
+                  <div className="flex-1">订单号</div>
+                  <div className="w-36 shrink-0 text-center">
+                    周转框（单价 ¥{containerStore?.box_price ?? '0.00'}）
+                  </div>
+                  <div className="w-36 shrink-0 text-center">
+                    周转托盘（单价 ¥{containerStore?.tray_price ?? '0.00'}）
+                  </div>
+                </div>
+                {fields.map((field) => {
+                  const order = containerStore?.orders[field.name];
+                  return (
+                    <div key={field.key} className="flex items-center border-t border-gray-100 px-4 py-2">
+                      <div className="min-w-0 flex-1 pr-2 text-sm">
+                        <Text copyable={{ text: order?.order_no ?? '' }}>{order?.order_no ?? '-'}</Text>
+                      </div>
+                      <Form.Item name={[field.name, 'order_id']} hidden>
+                        <Input />
+                      </Form.Item>
+                      <Form.Item
+                        className="m-0! w-36 shrink-0"
+                        name={[field.name, 'box_num']}
+                        rules={[{ required: true, message: '请输入周转框数量' }]}
+                      >
+                        <InputNumber
+                          className="w-full"
+                          min={0}
+                          precision={0}
+                          disabled={detail?.purchase.status !== 0}
+                          placeholder="周转框数量"
+                        />
+                      </Form.Item>
+                      <Form.Item
+                        className="m-0! w-36 shrink-0"
+                        name={[field.name, 'tray_num']}
+                        rules={[{ required: true, message: '请输入周转托盘数量' }]}
+                      >
+                        <InputNumber
+                          className="w-full"
+                          min={0}
+                          precision={0}
+                          disabled={detail?.purchase.status !== 0}
+                          placeholder="周转托盘数量"
+                        />
+                      </Form.Item>
+                    </div>
+                  );
+                })}
+              </div>
+            )}
+          </Form.List>
+        </Form>
+        <Space orientation="vertical" className="mt-3! w-full rounded bg-gray-50 p-3">
+          <div>
+            <Text type="secondary">周转框合计：</Text>
+            <Text strong>{previewContainerBox}</Text>
+            <Text type="secondary" className="ml-6!">周转托盘合计：</Text>
+            <Text strong>{previewContainerTray}</Text>
+          </div>
+          <div>
+            <Text type="secondary">附加金额合计：</Text>
+            <Text strong type="danger">¥{previewContainerAdded.toFixed(2)}</Text>
+          </div>
+        </Space>
+      </Modal>
     </>
   );
 };