feat(@vben/web-antd): erp-stock-in 优化入库单产品清单组件

- 移除了 totalCount 和 totalPrice 的计算逻辑
- 调整了添加产品的按钮位置
- 为表格底部的单元格添加了自定义样式
- 简化了组件的 props 接口

apps/web-antd/src/views/erp/stock/in/data.ts

@@ -1,8 +1,6 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { VxeTableGridOptions } from '#/adapter/vxe-table';
 
-import { erpPriceInputFormatter } from '@vben/utils';
-
 import { getSupplierSimpleList } from '#/api/erp/purchase/supplier';
 import { getSimpleUserList } from '#/api/system/user';
 import { DICT_TYPE, getDictOptions } from '#/utils';
@@ -96,29 +94,6 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Input',
       formItemClass: 'col-span-3',
     },
-    {
-      component: 'InputNumber',
-      componentProps: {
-        placeholder: '合计数量',
-        precision: 2,
-        disabled: true,
-        style: { width: '100%' },
-      },
-      fieldName: 'totalCount',
-      label: '合计数量',
-    },
-    {
-      component: 'InputNumber',
-      componentProps: {
-        placeholder: '合计金额',
-        precision: 2,
-        formatter: erpPriceInputFormatter,
-        disabled: true,
-        style: { width: '100%' },
-      },
-      fieldName: 'totalPrice',
-      label: '合计金额',
-    },
   ];
 }
 
@@ -296,28 +271,6 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
       title: '创建人',
       minWidth: 100,
     },
-    {
-      field: 'totalCount',
-      title: '数量',
-      minWidth: 100,
-      cellRender: {
-        name: 'CellAmount',
-        props: {
-          digits: 2,
-        },
-      },
-    },
-    {
-      field: 'totalPrice',
-      title: '金额',
-      minWidth: 120,
-      cellRender: {
-        name: 'CellAmount',
-        props: {
-          digits: 2,
-        },
-      },
-    },
     {
       field: 'status',
       title: '状态',

apps/web-antd/src/views/erp/stock/in/modules/StockInItemForm.vue

@@ -19,11 +19,7 @@ const props = withDefaults(defineProps<Props>(), {
   disabled: false,
 });
 
-const emit = defineEmits([
-  'update:items',
-  'update:total-count',
-  'update:total-price',
-]);
+const emit = defineEmits(['update:items']);
 
 interface Props {
   items?: ErpStockInApi.StockInItem[];
@@ -58,6 +54,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
       enabled: false,
     },
     showFooter: true,
+    footerCellClassName: 'stock-in-footer-cell',
     footerMethod: ({ columns }) => {
       const footers: any[][] = [];
       const sums = getSummaries();
@@ -96,31 +93,6 @@ watch(
   },
 );
 
-/** 计算 totalCount、totalPrice */
-watch(
-  () => tableData.value,
-  () => {
-    if (!tableData.value || tableData.value.length === 0) {
-      emit('update:total-count', 0);
-      emit('update:total-price', 0);
-      return;
-    }
-    const totalCount = tableData.value.reduce(
-      (prev, curr) => prev + (curr.count || 0),
-      0,
-    );
-    const totalPrice = tableData.value.reduce(
-      (prev, curr) => prev + (curr.totalPrice || 0),
-      0,
-    );
-
-    // 发送计算结果给父组件
-    emit('update:total-count', totalCount);
-    emit('update:total-price', totalPrice);
-  },
-  { deep: true },
-);
-
 /** 初始化 */
 onMounted(async () => {
   productOptions.value = await getProductSimpleList();
@@ -260,23 +232,14 @@ function init(items: ErpStockInApi.StockInItem[]) {
 defineExpose({
   validate,
   init,
+  handleAdd,
 });
 </script>
 
 <template>
   <div class="w-full">
     <div class="mb-4 flex justify-between">
-      <span class="text-lg font-medium">入库产品清单</span>
-      <TableAction
-        v-if="!disabled"
-        :actions="[
-          {
-            label: '添加产品',
-            type: 'primary',
-            onClick: handleAdd,
-          },
-        ]"
-      />
+      <span class="text-lg font-medium"></span>
     </div>
 
     <Grid>
@@ -366,6 +329,26 @@ defineExpose({
           ]"
         />
       </template>
+
+      <template #bottom>
+        <TableAction
+          v-if="!disabled"
+          class="mt-4 flex justify-center"
+          :actions="[
+            {
+              label: '添加产品',
+              type: 'default',
+              onClick: handleAdd,
+            },
+          ]"
+        />
+      </template>
     </Grid>
   </div>
 </template>
+
+<style scoped>
+:deep(.vxe-table .vxe-footer--column.stock-in-footer-cell .vxe-cell) {
+  background-color: #f5f5f5 !important;
+}
+</style>

apps/web-antd/src/views/erp/stock/in/modules/form.vue

@@ -49,24 +49,6 @@ const handleUpdateItems = (items: ErpStockInApi.StockInItem[]) => {
   }
 };
 
-const handleUpdateTotalCount = (totalCount: number) => {
-  if (formData.value) {
-    formData.value.totalCount = totalCount;
-    formApi.setValues({
-      totalCount: formData.value.totalCount,
-    });
-  }
-};
-
-const handleUpdateTotalPrice = (totalPrice: number) => {
-  if (formData.value) {
-    formData.value.totalPrice = totalPrice;
-    formApi.setValues({
-      totalPrice: formData.value.totalPrice,
-    });
-  }
-};
-
 /**
  * 创建或更新其它入库单
  */
@@ -145,6 +127,10 @@ const [Modal, modalApi] = useVbenModal({
       if (itemFormInstance && typeof itemFormInstance.init === 'function') {
         itemFormInstance.init([]);
       }
+      // 如果是新增，自动添加一行
+      if (formType.value === 'create' && itemFormInstance) {
+        itemFormInstance.handleAdd();
+      }
       return;
     }
 
@@ -209,8 +195,6 @@ defineExpose({ modalApi, handleUpdateStatus });
           :items="formData?.items ?? []"
           :disabled="formType === 'detail'"
           @update:items="handleUpdateItems"
-          @update:total-count="handleUpdateTotalCount"
-          @update:total-price="handleUpdateTotalPrice"
         />
       </template>
     </Form>