From 93c0d9e4868db4a5318484f645d4f1792697785f Mon Sep 17 00:00:00 2001
From: nehc <934298133@qq.com>
Date: Wed, 30 Jul 2025 13:40:54 +0800
Subject: [PATCH 1/3] =?UTF-8?q?feat(@vben/web-antd):=20erp-purchase-suppli?=
=?UTF-8?q?er-=E6=B7=BB=E5=8A=A0=E4=BE=9B=E5=BA=94=E5=95=86=E7=AE=A1?=
=?UTF-8?q?=E7=90=86=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
- 新增供应商管理页面,包括搜索、列表、新增、编辑和删除功能
- 实现供应商数据的分页查询、导出功能
- 使用 Vben Form 和 Vxe Table 组件构建表单和表格
- 添加国际化支持
---
.../src/views/erp/purchase/supplier/data.ts | 233 ++++++++++++++++++
.../src/views/erp/purchase/supplier/index.vue | 226 +++++++++++++++--
.../erp/purchase/supplier/modules/form.vue | 102 ++++++++
3 files changed, 541 insertions(+), 20 deletions(-)
create mode 100644 apps/web-antd/src/views/erp/purchase/supplier/data.ts
create mode 100644 apps/web-antd/src/views/erp/purchase/supplier/modules/form.vue
diff --git a/apps/web-antd/src/views/erp/purchase/supplier/data.ts b/apps/web-antd/src/views/erp/purchase/supplier/data.ts
new file mode 100644
index 000000000..846cebccc
--- /dev/null
+++ b/apps/web-antd/src/views/erp/purchase/supplier/data.ts
@@ -0,0 +1,233 @@
+import type { VbenFormSchema } from '#/adapter/form';
+import type { VxeTableGridOptions } from '#/adapter/vxe-table';
+
+import { DICT_TYPE, getDictOptions } from '#/utils';
+
+/** 新增/修改的表单 */
+export function useFormSchema(): VbenFormSchema[] {
+ return [
+ {
+ component: 'Input',
+ fieldName: 'id',
+ dependencies: {
+ triggerFields: [''],
+ show: () => false,
+ },
+ },
+ {
+ fieldName: 'name',
+ label: '供应商名称',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入供应商名称',
+ },
+ rules: 'required',
+ },
+ {
+ fieldName: 'contact',
+ label: '联系人',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入联系人',
+ },
+ },
+ {
+ fieldName: 'mobile',
+ label: '手机号码',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入手机号码',
+ },
+ },
+ {
+ fieldName: 'telephone',
+ label: '联系电话',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入联系电话',
+ },
+ },
+ {
+ fieldName: 'email',
+ label: '电子邮箱',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入电子邮箱',
+ },
+ },
+ {
+ fieldName: 'fax',
+ label: '传真',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入传真',
+ },
+ },
+ {
+ fieldName: 'status',
+ label: '开启状态',
+ component: 'RadioGroup',
+ componentProps: {
+ options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+ },
+ rules: 'required',
+ defaultValue: 0,
+ },
+ {
+ fieldName: 'sort',
+ label: '排序',
+ component: 'InputNumber',
+ componentProps: {
+ placeholder: '请输入排序',
+ precision: 0,
+ class: 'w-full',
+ },
+ rules: 'required',
+ defaultValue: 0,
+ },
+ {
+ fieldName: 'taxNo',
+ label: '纳税人识别号',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入纳税人识别号',
+ },
+ },
+ {
+ fieldName: 'taxPercent',
+ label: '税率(%)',
+ component: 'InputNumber',
+ componentProps: {
+ placeholder: '请输入税率',
+ min: 0,
+ precision: 2,
+ class: 'w-full',
+ },
+ },
+ {
+ fieldName: 'bankName',
+ label: '开户行',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入开户行',
+ },
+ },
+ {
+ fieldName: 'bankAccount',
+ label: '开户账号',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入开户账号',
+ },
+ },
+ {
+ fieldName: 'bankAddress',
+ label: '开户地址',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入开户地址',
+ },
+ },
+ {
+ fieldName: 'remark',
+ label: '备注',
+ component: 'Textarea',
+ componentProps: {
+ placeholder: '请输入备注',
+ rows: 3,
+ },
+ formItemClass: 'col-span-2',
+ },
+ ];
+}
+
+/** 搜索表单 */
+export function useGridFormSchema(): VbenFormSchema[] {
+ return [
+ {
+ fieldName: 'name',
+ label: '供应商名称',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入供应商名称',
+ allowClear: true,
+ },
+ },
+ {
+ fieldName: 'mobile',
+ label: '手机号码',
+ component: 'Input',
+ componentProps: {
+ placeholder: '请输入手机号码',
+ allowClear: true,
+ },
+ },
+ {
+ fieldName: 'status',
+ label: '状态',
+ component: 'Select',
+ componentProps: {
+ placeholder: '请选择状态',
+ allowClear: true,
+ options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
+ },
+ },
+ ];
+}
+
+/** 列表的字段 */
+export function useGridColumns(): VxeTableGridOptions['columns'] {
+ return [
+ {
+ field: 'name',
+ title: '供应商名称',
+ minWidth: 150,
+ },
+ {
+ field: 'contact',
+ title: '联系人',
+ minWidth: 120,
+ },
+ {
+ field: 'mobile',
+ title: '手机号码',
+ minWidth: 130,
+ },
+ {
+ field: 'telephone',
+ title: '联系电话',
+ minWidth: 130,
+ },
+ {
+ field: 'email',
+ title: '电子邮箱',
+ minWidth: 180,
+ },
+ {
+ field: 'status',
+ title: '状态',
+ width: 100,
+ cellRender: {
+ name: 'CellDict',
+ props: { type: DICT_TYPE.COMMON_STATUS },
+ },
+ },
+ {
+ field: 'sort',
+ title: '排序',
+ width: 80,
+ },
+ {
+ field: 'remark',
+ title: '备注',
+ minWidth: 150,
+ showOverflow: 'tooltip',
+ },
+ {
+ field: 'actions',
+ title: '操作',
+ width: 160,
+ slots: { default: 'actions' },
+ },
+ ];
+}
diff --git a/apps/web-antd/src/views/erp/purchase/supplier/index.vue b/apps/web-antd/src/views/erp/purchase/supplier/index.vue
index a987c6c49..2ace8bbbd 100644
--- a/apps/web-antd/src/views/erp/purchase/supplier/index.vue
+++ b/apps/web-antd/src/views/erp/purchase/supplier/index.vue
@@ -1,7 +1,140 @@
@@ -12,23 +145,76 @@ import { Button } from 'ant-design-vue';
url="https://doc.iocoder.cn/erp/purchase/"
/>
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/apps/web-antd/src/views/erp/purchase/supplier/modules/form.vue b/apps/web-antd/src/views/erp/purchase/supplier/modules/form.vue
new file mode 100644
index 000000000..d99884912
--- /dev/null
+++ b/apps/web-antd/src/views/erp/purchase/supplier/modules/form.vue
@@ -0,0 +1,102 @@
+
+
+
+
+
+
+
From 33cec7caee71601e97ca511cbb8126e75f49d570 Mon Sep 17 00:00:00 2001
From: nehc <934298133@qq.com>
Date: Wed, 30 Jul 2025 14:32:32 +0800
Subject: [PATCH 2/3] =?UTF-8?q?feat(@vben/web-antd):=20erp-purchase-suppli?=
=?UTF-8?q?er-=E4=BE=9B=E5=BA=94=E5=95=86=E7=AE=A1=E7=90=86=E9=A1=B5?=
=?UTF-8?q?=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
- 移除状态字段,增加联系电话字段
- 调整供应商列表的展示逻辑
- 优化搜索和导出功能
- 使用 useVbenVxeGrid 替代原有的表格实现
- 用 downloadFileFromBlobPart 处理文件下载
---
.../src/views/erp/purchase/supplier/data.ts | 9 +-
.../src/views/erp/purchase/supplier/index.vue | 110 ++++--------------
.../erp/purchase/supplier/modules/form.vue | 2 +-
3 files changed, 26 insertions(+), 95 deletions(-)
diff --git a/apps/web-antd/src/views/erp/purchase/supplier/data.ts b/apps/web-antd/src/views/erp/purchase/supplier/data.ts
index 846cebccc..eed9d72db 100644
--- a/apps/web-antd/src/views/erp/purchase/supplier/data.ts
+++ b/apps/web-antd/src/views/erp/purchase/supplier/data.ts
@@ -163,13 +163,12 @@ export function useGridFormSchema(): VbenFormSchema[] {
},
},
{
- fieldName: 'status',
- label: '状态',
- component: 'Select',
+ fieldName: 'telephone',
+ label: '联系电话',
+ component: 'Input',
componentProps: {
- placeholder: '请选择状态',
+ placeholder: '请输入联系电话',
allowClear: true,
- options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
},
},
];
diff --git a/apps/web-antd/src/views/erp/purchase/supplier/index.vue b/apps/web-antd/src/views/erp/purchase/supplier/index.vue
index 2ace8bbbd..b0d6d79ef 100644
--- a/apps/web-antd/src/views/erp/purchase/supplier/index.vue
+++ b/apps/web-antd/src/views/erp/purchase/supplier/index.vue
@@ -2,15 +2,17 @@
import type { VxeTableGridOptions } from '#/adapter/vxe-table';
import type { ErpSupplierApi } from '#/api/erp/purchase/supplier';
-import { ref } from 'vue';
-
import { DocAlert, Page, useVbenModal } from '@vben/common-ui';
+import { downloadFileFromBlobPart } from '@vben/utils';
import { message } from 'ant-design-vue';
-import { useVbenForm } from '#/adapter/form';
import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
-import { deleteSupplier, getSupplierPage } from '#/api/erp/purchase/supplier';
+import {
+ deleteSupplier,
+ exportSupplier,
+ getSupplierPage,
+} from '#/api/erp/purchase/supplier';
import { $t } from '#/locales';
import { useGridColumns, useGridFormSchema } from './data';
@@ -19,53 +21,11 @@ import SupplierForm from './modules/form.vue';
/** 供应商管理 */
defineOptions({ name: 'ErpSupplier' });
-const searchParams = ref({
- pageNo: 1,
- pageSize: 10,
- name: '',
- mobile: '',
- status: undefined,
-});
-
-/** 搜索表单 */
-const [SearchForm, searchFormApi] = useVbenForm({
- commonConfig: {
- componentProps: {
- class: 'w-full',
- },
- formItemClass: 'col-span-1',
- labelWidth: 80,
- },
- layout: 'inline',
- schema: useGridFormSchema(),
- showDefaultActions: false,
-});
-
/** 刷新表格 */
function onRefresh() {
gridApi.query();
}
-/** 搜索 */
-async function handleSearch() {
- const values = await searchFormApi.getValues();
- Object.assign(searchParams.value, values, { pageNo: 1 });
- onRefresh();
-}
-
-/** 重置搜索 */
-async function handleReset() {
- await searchFormApi.resetFields();
- Object.assign(searchParams.value, {
- pageNo: 1,
- pageSize: 10,
- name: '',
- mobile: '',
- status: undefined,
- });
- onRefresh();
-}
-
/** 添加供应商 */
function handleCreate() {
formModalApi.setData({ type: 'create' }).open();
@@ -96,13 +56,8 @@ async function handleDelete(row: ErpSupplierApi.Supplier) {
/** 导出供应商 */
async function handleExport() {
- try {
- // const data = await exportSupplier(searchParams.value);
- // 这里需要处理文件下载逻辑
- message.success('导出成功');
- } catch {
- message.error('导出失败');
- }
+ const data = await exportSupplier(await gridApi.formApi.getValues());
+ downloadFileFromBlobPart({ fileName: '供应商.xls', source: data });
}
const [FormModal, formModalApi] = useVbenModal({
@@ -111,17 +66,20 @@ const [FormModal, formModalApi] = useVbenModal({
});
const [Grid, gridApi] = useVbenVxeGrid({
+ formOptions: {
+ schema: useGridFormSchema(),
+ },
gridOptions: {
columns: useGridColumns(),
- height: 600,
+ height: 'auto',
keepSource: true,
proxyConfig: {
ajax: {
- query: async ({ page }) => {
+ query: async ({ page }, formValues) => {
return await getSupplierPage({
- ...searchParams.value,
pageNo: page.currentPage,
pageSize: page.pageSize,
+ ...formValues,
});
},
},
@@ -131,14 +89,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
},
toolbarConfig: {
refresh: true,
- custom: true,
+ search: true,
},
} as VxeTableGridOptions,
});
-
+
-
-
-
-
-
+
From 423bfffbea0ffc5749cb039230cc26623fcbb961 Mon Sep 17 00:00:00 2001
From: nehc <934298133@qq.com>
Date: Wed, 30 Jul 2025 15:24:05 +0800
Subject: [PATCH 3/3] =?UTF-8?q?feat(@vben/web-antd):=20erp-purchase-suppli?=
=?UTF-8?q?er-=E4=BC=98=E5=8C=96=E9=87=87=E8=B4=AD=E8=AE=A2=E5=8D=95?=
=?UTF-8?q?=E5=AF=BC=E5=87=BA=E5=8A=9F=E8=83=BD=E5=B9=B6=E6=B7=BB=E5=8A=A0?=
=?UTF-8?q?=E4=BE=9B=E5=BA=94=E5=95=86=E7=AE=A1=E7=90=86=E6=9D=83=E9=99=90?=
=?UTF-8?q?=E6=8E=A7=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
- 在供应商管理页面添加权限控制:
- 创建供应商
- 导出供应商信息
- 编辑供应商
- 删除供应商
---
apps/web-antd/src/views/erp/purchase/order/index.vue | 9 ++-------
apps/web-antd/src/views/erp/purchase/supplier/index.vue | 4 ++++
2 files changed, 6 insertions(+), 7 deletions(-)
diff --git a/apps/web-antd/src/views/erp/purchase/order/index.vue b/apps/web-antd/src/views/erp/purchase/order/index.vue
index bc9552c80..3cb0130a6 100644
--- a/apps/web-antd/src/views/erp/purchase/order/index.vue
+++ b/apps/web-antd/src/views/erp/purchase/order/index.vue
@@ -129,13 +129,8 @@ function handleUpdateStatus(
/** 导出 */
async function handleExport() {
- try {
- const formValues = gridApi.getFormData();
- const data = await exportPurchaseOrder(formValues);
- downloadFileFromBlobPart({ fileName: '采购订单.xls', source: data });
- } catch {
- // 处理错误
- }
+ const data = await exportPurchaseOrder(await gridApi.formApi.getValues());
+ downloadFileFromBlobPart({ fileName: '采购订单.xls', source: data });
}
const [Grid, gridApi] = useVbenVxeGrid({
diff --git a/apps/web-antd/src/views/erp/purchase/supplier/index.vue b/apps/web-antd/src/views/erp/purchase/supplier/index.vue
index b0d6d79ef..98288f4ab 100644
--- a/apps/web-antd/src/views/erp/purchase/supplier/index.vue
+++ b/apps/web-antd/src/views/erp/purchase/supplier/index.vue
@@ -113,12 +113,14 @@ const [Grid, gridApi] = useVbenVxeGrid({
label: $t('ui.actionTitle.create', ['供应商']),
type: 'primary',
icon: ACTION_ICON.ADD,
+ auth: ['erp:supplier:create'],
onClick: handleCreate,
},
{
label: $t('ui.actionTitle.export'),
type: 'primary',
icon: ACTION_ICON.DOWNLOAD,
+ auth: ['erp:supplier:export'],
onClick: handleExport,
},
]"
@@ -132,6 +134,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
label: '编辑',
type: 'link',
icon: ACTION_ICON.EDIT,
+ auth: ['erp:supplier:update'],
onClick: handleEdit.bind(null, row),
},
{
@@ -139,6 +142,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
type: 'link',
danger: true,
icon: ACTION_ICON.DELETE,
+ auth: ['erp:supplier:delete'],
popConfirm: {
title: $t('ui.actionMessage.deleteConfirm', [row.name]),
confirm: handleDelete.bind(null, row),