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

- 移除了 totalCount 和 totalPrice 的计算逻辑
- 调整了添加产品的按钮位置
- 为表格底部的单元格添加了自定义样式
- 简化了组件的 props 接口
pull/188/head
nehc 2025-08-01 17:35:56 +08:00
parent 3afd957713
commit 1433a0980d
3 changed files with 28 additions and 108 deletions

View File

@ -1,8 +1,6 @@
import type { VbenFormSchema } from '#/adapter/form'; import type { VbenFormSchema } from '#/adapter/form';
import type { VxeTableGridOptions } from '#/adapter/vxe-table'; import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import { erpPriceInputFormatter } from '@vben/utils';
import { getSupplierSimpleList } from '#/api/erp/purchase/supplier'; import { getSupplierSimpleList } from '#/api/erp/purchase/supplier';
import { getSimpleUserList } from '#/api/system/user'; import { getSimpleUserList } from '#/api/system/user';
import { DICT_TYPE, getDictOptions } from '#/utils'; import { DICT_TYPE, getDictOptions } from '#/utils';
@ -96,29 +94,6 @@ export function useFormSchema(): VbenFormSchema[] {
component: 'Input', component: 'Input',
formItemClass: 'col-span-3', 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: '创建人', title: '创建人',
minWidth: 100, 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', field: 'status',
title: '状态', title: '状态',

View File

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

View File

@ -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') { if (itemFormInstance && typeof itemFormInstance.init === 'function') {
itemFormInstance.init([]); itemFormInstance.init([]);
} }
//
if (formType.value === 'create' && itemFormInstance) {
itemFormInstance.handleAdd();
}
return; return;
} }
@ -209,8 +195,6 @@ defineExpose({ modalApi, handleUpdateStatus });
:items="formData?.items ?? []" :items="formData?.items ?? []"
:disabled="formType === 'detail'" :disabled="formType === 'detail'"
@update:items="handleUpdateItems" @update:items="handleUpdateItems"
@update:total-count="handleUpdateTotalCount"
@update:total-price="handleUpdateTotalPrice"
/> />
</template> </template>
</Form> </Form>