From 3afd9577137f3df0e0059bbe7521dce357b32819 Mon Sep 17 00:00:00 2001
From: nehc <934298133@qq.com>
Date: Fri, 1 Aug 2025 16:11:05 +0800
Subject: [PATCH] =?UTF-8?q?feat(@vben/web-antd):=20erp-stock-in=20?=
=?UTF-8?q?=E4=BC=98=E5=8C=96=E5=BA=93=E5=AD=98=E5=85=A5=E5=BA=93=E6=A8=A1?=
=?UTF-8?q?=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
- 为表格列设置 minWidth 以优化布局
- 使用 Popconfirm组件替代 Modal 确认框
- 通过 message 组件展示操作结果
- 优化删除和审核操作的处理流程
- 引入 useVbenModal 优化表单弹窗
---
apps/web-antd/src/views/erp/stock/in/data.ts | 14 +--
.../web-antd/src/views/erp/stock/in/index.vue | 95 ++++++++++++-------
.../erp/stock/in/modules/StockInItemForm.vue | 5 +-
3 files changed, 71 insertions(+), 43 deletions(-)
diff --git a/apps/web-antd/src/views/erp/stock/in/data.ts b/apps/web-antd/src/views/erp/stock/in/data.ts
index 2086066ff..bd54761d7 100644
--- a/apps/web-antd/src/views/erp/stock/in/data.ts
+++ b/apps/web-antd/src/views/erp/stock/in/data.ts
@@ -281,12 +281,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'supplierName',
title: '供应商',
- width: 120,
+ minWidth: 120,
},
{
field: 'inTime',
title: '入库时间',
- width: 180,
+ minWidth: 180,
cellRender: {
name: 'CellDateTime',
},
@@ -294,12 +294,12 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'creatorName',
title: '创建人',
- width: 100,
+ minWidth: 100,
},
{
field: 'totalCount',
title: '数量',
- width: 100,
+ minWidth: 100,
cellRender: {
name: 'CellAmount',
props: {
@@ -310,7 +310,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'totalPrice',
title: '金额',
- width: 120,
+ minWidth: 120,
cellRender: {
name: 'CellAmount',
props: {
@@ -321,7 +321,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
{
field: 'status',
title: '状态',
- width: 90,
+ minWidth: 90,
fixed: 'right',
cellRender: {
name: 'CellDict',
@@ -330,7 +330,7 @@ export function useGridColumns(): VxeTableGridOptions['columns'] {
},
{
title: '操作',
- width: 220,
+ width: 300,
fixed: 'right',
slots: { default: 'actions' },
},
diff --git a/apps/web-antd/src/views/erp/stock/in/index.vue b/apps/web-antd/src/views/erp/stock/in/index.vue
index 641c4347d..8bb4c15d8 100644
--- a/apps/web-antd/src/views/erp/stock/in/index.vue
+++ b/apps/web-antd/src/views/erp/stock/in/index.vue
@@ -2,12 +2,10 @@
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { ErpStockInApi } from '#/api/erp/stock/in';
-import { ref } from 'vue';
-
-import { DocAlert, Page } from '@vben/common-ui';
+import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
import { downloadFileFromBlobPart } from '@vben/utils';
-import { message, Modal } from 'ant-design-vue';
+import { message } from 'ant-design-vue';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
import {
@@ -24,7 +22,10 @@ import StockInForm from './modules/form.vue';
/** 其它入库单管理 */
defineOptions({ name: 'ErpStockIn' });
-const formRef = ref();
+const [FormModal, formModalApi] = useVbenModal({
+ connectedComponent: StockInForm,
+ destroyOnClose: true,
+});
/** 刷新表格 */
function onRefresh() {
@@ -39,34 +40,46 @@ async function handleExport() {
/** 新增/编辑/详情 */
function openForm(type: string, id?: number) {
- formRef.value?.modalApi.open({ type, id });
+ formModalApi.setData({ type, id }).open();
}
/** 删除 */
-function handleDelete(ids: any[]) {
- Modal.confirm({
- title: '系统提示',
- content: `是否确认删除编号为 ${ids.join(',')} 的其它入库单？`,
- onOk: async () => {
- await deleteStockIn(ids);
- message.success('删除成功');
- onRefresh();
- },
+async function handleDelete(ids: any[]) {
+ const hideLoading = message.loading({
+ content: '删除中...',
+ duration: 0,
+ key: 'action_process_msg',
});
+ try {
+ await deleteStockIn(ids);
+ message.success({
+ content: '删除成功',
+ key: 'action_process_msg',
+ });
+ onRefresh();
+ } finally {
+ hideLoading();
+ }
}
/** 审核/反审核 */
-function handleUpdateStatus(id: any, status: number) {
+async function handleUpdateStatus(id: any, status: number) {
const statusText = status === 20 ? '审核' : '反审核';
- Modal.confirm({
- title: '系统提示',
- content: `确认要${statusText}该入库单吗？`,
- onOk: async () => {
- await updateStockInStatus({ id, status });
- message.success(`${statusText}成功`);
- onRefresh();
- },
+ const hideLoading = message.loading({
+ content: `${statusText}中...`,
+ duration: 0,
+ key: 'action_process_msg',
});
+ try {
+ await updateStockInStatus({ id, status });
+ message.success({
+ content: `${statusText}成功`,
+ key: 'action_process_msg',
+ });
+ onRefresh();
+ } finally {
+ hideLoading();
+ }
}
const [Grid, gridApi] = useVbenVxeGrid({
@@ -135,13 +148,16 @@ const [Grid, gridApi] = useVbenVxeGrid({
danger: true,
icon: ACTION_ICON.DELETE,
auth: ['erp:stock-in:delete'],
- onClick: () => {
- const checkboxRecords = gridApi.grid.getCheckboxRecords();
- if (checkboxRecords.length === 0) {
- message.warning('请选择要删除的数据');
- return;
- }
- handleDelete(checkboxRecords.map((item) => item.id));
+ popConfirm: {
+ title: '是否删除所选中数据？',
+ confirm: () => {
+ const checkboxRecords = gridApi.grid.getCheckboxRecords();
+ if (checkboxRecords.length === 0) {
+ message.warning('请选择要删除的数据');
+ return;
+ }
+ handleDelete(checkboxRecords.map((item) => item.id));
+ },
},
},
]"
@@ -168,21 +184,30 @@ const [Grid, gridApi] = useVbenVxeGrid({
type: 'primary',
auth: ['erp:stock-in:update'],
ifShow: row.status === 10,
- onClick: () => handleUpdateStatus(row.id, 20),
+ popConfirm: {
+ title: '确认要审核该入库单吗？',
+ confirm: () => handleUpdateStatus(row.id, 20),
+ },
},
{
label: '反审核',
danger: true,
auth: ['erp:stock-in:update'],
ifShow: row.status === 20,
- onClick: () => handleUpdateStatus(row.id, 10),
+ popConfirm: {
+ title: '确认要反审核该入库单吗？',
+ confirm: () => handleUpdateStatus(row.id, 10),
+ },
},
{
label: '删除',
danger: true,
auth: ['erp:stock-in:delete'],
ifShow: row.status === 10,
- onClick: () => handleDelete([row.id]),
+ popConfirm: {
+ title: '确认要删除该入库单吗？',
+ confirm: () => handleDelete([row.id]),
+ },
},
]"
/>
@@ -190,6 +215,6 @@ const [Grid, gridApi] = useVbenVxeGrid({
-
+
diff --git a/apps/web-antd/src/views/erp/stock/in/modules/StockInItemForm.vue b/apps/web-antd/src/views/erp/stock/in/modules/StockInItemForm.vue
index d2ba3f195..159e4e4a5 100644
--- a/apps/web-antd/src/views/erp/stock/in/modules/StockInItemForm.vue
+++ b/apps/web-antd/src/views/erp/stock/in/modules/StockInItemForm.vue
@@ -358,7 +358,10 @@ defineExpose({
label: '删除',
type: 'link',
danger: true,
- onClick: () => handleDelete(row),
+ popConfirm: {
+ title: '确认删除该产品吗？',
+ confirm: handleDelete.bind(null, row),
+ },
},
]"
/>