From e319888240b618d3f6230cb5341020acfa95ebf9 Mon Sep 17 00:00:00 2001
From: nehc <934298133@qq.com>
Date: Thu, 24 Jul 2025 17:13:15 +0800
Subject: [PATCH] =?UTF-8?q?feat(@vben/web-antd):=20erp-=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E9=87=87=E8=B4=AD=E8=AE=A2=E5=8D=95=E8=A1=A8=E5=8D=95=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E5=92=8C=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加订单单号字段并设置为只读
- 将附件上传组件替换为 FileUpload
- 新增产品清单字段
- 调整表单项的布局和样式
- 优化订单产品清单的展示方式
---
 .../src/views/erp/purchase/order/data.ts      | 38 ++++++++++++++++---
 .../order/modules/PurchaseOrderItemForm.vue   |  1 +
 .../views/erp/purchase/order/modules/form.vue | 34 ++++++++---------
 3 files changed, 49 insertions(+), 24 deletions(-)

diff --git a/apps/web-antd/src/views/erp/purchase/order/data.ts b/apps/web-antd/src/views/erp/purchase/order/data.ts
index 60f9e2954..7a3ea19c6 100644
--- a/apps/web-antd/src/views/erp/purchase/order/data.ts
+++ b/apps/web-antd/src/views/erp/purchase/order/data.ts
@@ -12,6 +12,15 @@ import { DICT_TYPE, getDictOptions } from '#/utils';
 /** 表单的配置项 */
 export function useFormSchema(): VbenFormSchema[] {
   return [
+    {
+      component: 'Input',
+      componentProps: {
+        placeholder: '系统自动生成',
+        disabled: true,
+      },
+      fieldName: 'no',
+      label: '订单单号',
+    },
     {
       component: 'ApiSelect',
       componentProps: {
@@ -50,17 +59,35 @@ export function useFormSchema(): VbenFormSchema[] {
       },
       fieldName: 'remark',
       label: '备注',
-      formItemClass: 'col-span-2',
+      formItemClass: 'col-span-3',
     },
     {
-      component: 'Input',
+      component: 'FileUpload',
       componentProps: {
-        placeholder: '请输入附件地址',
-        class: 'w-full',
+        maxNumber: 5,
+        maxSize: 10,
+        accept: [
+          'pdf',
+          'doc',
+          'docx',
+          'xls',
+          'xlsx',
+          'txt',
+          'jpg',
+          'jpeg',
+          'png',
+        ],
+        showDescription: true,
       },
       fieldName: 'fileUrl',
       label: '附件',
-      formItemClass: 'col-span-2',
+      formItemClass: 'col-span-3',
+    },
+    {
+      fieldName: 'product',
+      label: '产品清单',
+      component: 'Input',
+      formItemClass: 'col-span-3',
     },
     {
       component: 'InputNumber',
@@ -214,6 +241,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         placeholder: '请输入订单单号',
         allowClear: true,
+        disabled: true,
       },
     },
     {
diff --git a/apps/web-antd/src/views/erp/purchase/order/modules/PurchaseOrderItemForm.vue b/apps/web-antd/src/views/erp/purchase/order/modules/PurchaseOrderItemForm.vue
index 977d52a26..2849755bc 100644
--- a/apps/web-antd/src/views/erp/purchase/order/modules/PurchaseOrderItemForm.vue
+++ b/apps/web-antd/src/views/erp/purchase/order/modules/PurchaseOrderItemForm.vue
@@ -40,6 +40,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
     border: true,
     showOverflow: true,
     autoResize: true,
+    minHeight: 250,
     keepSource: true,
     rowConfig: {
       keyField: 'id',
diff --git a/apps/web-antd/src/views/erp/purchase/order/modules/form.vue b/apps/web-antd/src/views/erp/purchase/order/modules/form.vue
index cc3fe0c01..621d0f383 100644
--- a/apps/web-antd/src/views/erp/purchase/order/modules/form.vue
+++ b/apps/web-antd/src/views/erp/purchase/order/modules/form.vue
@@ -34,9 +34,10 @@ const [Form, formApi] = useVbenForm({
     componentProps: {
       class: 'w-full',
     },
+    labelWidth: 120,
   },
-  wrapperClass: 'grid-cols-2',
-  layout: 'horizontal',
+  wrapperClass: 'grid-cols-3',
+  layout: 'vertical',
   schema: useFormSchema(),
   showDefaultActions: false,
 });
@@ -133,22 +134,17 @@ defineExpose({ modalApi });
     :closable="true"
     :mask-closable="true"
   >
-    <Form />
-
-    <!-- Tab卡片 -->
-    <div class="border-border bg-card mt-4 rounded-lg border p-2">
-      <a-tabs default-active-key="1">
-        <a-tab-pane key="1" tab="订单产品清单">
-          <div class="p-4">
-            <PurchaseOrderItemForm
-              ref="itemFormRef"
-              :items="formData?.items || []"
-              :disabled="formType === 'detail'"
-              @update:items="handleUpdateItems"
-            />
-          </div>
-        </a-tab-pane>
-      </a-tabs>
-    </div>
+    <Form class="mx-3">
+      <template #product="slotProps">
+        <PurchaseOrderItemForm
+          v-bind="slotProps"
+          ref="itemFormRef"
+          class="w-full"
+          :items="formData?.items || []"
+          :disabled="formType === 'detail'"
+          @update:items="handleUpdateItems"
+        />
+      </template>
+    </Form>
   </Modal>
 </template>