aiotagro/admin-vben
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'yudao/v5-next' into v5-next-tmp

Browse Source
This commit is contained in:
puhui999
2025-04-04 10:43:13 +08:00
parent 8ecb0bca39 4870bff2a0
commit 53d2d33ab0
67 changed files with 3660 additions and 1061 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/web-antd/src/api/system/mail/account/index.ts
View File

@@ -2,6 +2,7 @@ import type { PageResult } from '@vben/request';
import { requestClient } from '#/api/request';
// TODO @puhui999：代码风格的统一
export namespace SystemMailAccountApi {
export interface MailAccountVO {
id: number;

1
apps/web-antd/src/api/system/mail/log/index.ts
View File

@@ -2,6 +2,7 @@ import type { PageResult } from '@vben/request';
import { requestClient } from '#/api/request';
// TODO @puhui999：代码风格的统一
export namespace SystemMailLogApi {
export interface MailLogVO {
id: number;

1
apps/web-antd/src/api/system/mail/template/index.ts
View File

@@ -2,6 +2,7 @@ import type { PageResult } from '@vben/request';
import { requestClient } from '#/api/request';
// TODO @puhui999：代码风格的统一
export namespace SystemMailTemplateApi {
export interface MailTemplateVO {
id: number;

20
apps/web-antd/src/api/system/sms/channel/index.ts
View File

@@ -1,10 +1,10 @@
import type { PageResult } from '@vben/request';
import type { PageParam, PageResult } from '@vben/request';
import { requestClient } from '#/api/request';
export namespace SystemSmsChannelApi {
/** 短信渠道信息 */
export interface SmsChannelVO {
export interface SmsChannel {
id?: number;
code: string;
status: number;
@@ -18,8 +18,8 @@ export namespace SystemSmsChannelApi {
}
/** 查询短信渠道列表 */
export function getSmsChannelPage(params: any) {
return requestClient.get<PageResult<SystemSmsChannelApi.SmsChannelVO>>(
export function getSmsChannelPage(params: PageParam) {
return requestClient.get<PageResult<SystemSmsChannelApi.SmsChannel>>(
'/system/sms-channel/page',
{ params },
);
@@ -27,25 +27,21 @@ export function getSmsChannelPage(params: any) {
/** 获得短信渠道精简列表 */
export function getSimpleSmsChannelList() {
return requestClient.get<SystemSmsChannelApi.SmsChannelVO[]>(
'/system/sms-channel/simple-list',
);
return requestClient.get<SystemSmsChannelApi.SmsChannel[]>('/system/sms-channel/simple-list');
}
/** 查询短信渠道详情 */
export function getSmsChannel(id: number) {
return requestClient.get<SystemSmsChannelApi.SmsChannelVO>(
`/system/sms-channel/get?id=${id}`,
);
return requestClient.get<SystemSmsChannelApi.SmsChannel>(`/system/sms-channel/get?id=${id}`);
}
/** 新增短信渠道 */
export function createSmsChannel(data: SystemSmsChannelApi.SmsChannelVO) {
export function createSmsChannel(data: SystemSmsChannelApi.SmsChannel) {
return requestClient.post('/system/sms-channel/create', data);
}
/** 修改短信渠道 */
export function updateSmsChannel(data: SystemSmsChannelApi.SmsChannelVO) {
export function updateSmsChannel(data: SystemSmsChannelApi.SmsChannel) {
return requestClient.put('/system/sms-channel/update', data);
}

9
apps/web-antd/src/api/system/sms/log/index.ts
View File

@@ -1,4 +1,4 @@
import type { PageResult } from '@vben/request';
import type { PageParam, PageResult } from '@vben/request';
import { requestClient } from '#/api/request';
@@ -32,11 +32,8 @@ export namespace SystemSmsLogApi {
}
/** 查询短信日志列表 */
export function getSmsLogPage(params: any) {
return requestClient.get<PageResult<SystemSmsLogApi.SmsLogVO>>(
'/system/sms-log/page',
{ params },
);
export function getSmsLogPage(params: PageParam) {
return requestClient.get<PageResult<SystemSmsLogApi.SmsLogVO>>('/system/sms-log/page', { params });
}
/** 导出短信日志 */

20
apps/web-antd/src/api/system/sms/template/index.ts
View File

@@ -4,7 +4,7 @@ import { requestClient } from '#/api/request';
export namespace SystemSmsTemplateApi {
/** 短信模板信息 */
export interface SmsTemplateVO {
export interface SmsTemplate {
id?: number;
type?: number;
status: number;
@@ -20,7 +20,7 @@ export namespace SystemSmsTemplateApi {
}
/** 发送短信请求 */
export interface SendSmsReqVO {
export interface SmsSendReqVO {
mobile: string;
templateCode: string;
templateParams: Record<string, any>;
@@ -29,7 +29,7 @@ export namespace SystemSmsTemplateApi {
/** 查询短信模板列表 */
export function getSmsTemplatePage(params: any) {
return requestClient.get<PageResult<SystemSmsTemplateApi.SmsTemplateVO>>(
return requestClient.get<PageResult<SystemSmsTemplateApi.SmsTemplate>>(
'/system/sms-template/page',
{ params },
);
@@ -37,18 +37,16 @@ export function getSmsTemplatePage(params: any) {
/** 查询短信模板详情 */
export function getSmsTemplate(id: number) {
return requestClient.get<SystemSmsTemplateApi.SmsTemplateVO>(
`/system/sms-template/get?id=${id}`,
);
return requestClient.get<SystemSmsTemplateApi.SmsTemplate>(`/system/sms-template/get?id=${id}`);
}
/** 新增短信模板 */
export function createSmsTemplate(data: SystemSmsTemplateApi.SmsTemplateVO) {
export function createSmsTemplate(data: SystemSmsTemplateApi.SmsTemplate) {
return requestClient.post('/system/sms-template/create', data);
}
/** 修改短信模板 */
export function updateSmsTemplate(data: SystemSmsTemplateApi.SmsTemplateVO) {
export function updateSmsTemplate(data: SystemSmsTemplateApi.SmsTemplate) {
return requestClient.put('/system/sms-template/update', data);
}
@@ -59,12 +57,10 @@ export function deleteSmsTemplate(id: number) {
/** 导出短信模板 */
export function exportSmsTemplate(params: any) {
return requestClient.download('/system/sms-template/export-excel', {
params,
});
return requestClient.download('/system/sms-template/export-excel', { params });
}
/** 发送短信 */
export function sendSms(data: SystemSmsTemplateApi.SendSmsReqVO) {
export function sendSms(data: SystemSmsTemplateApi.SmsSendReqVO) {
return requestClient.post('/system/sms-template/send-sms', data);
}

51
apps/web-antd/src/api/system/tenant-package/index.ts Normal file
View File

@@ -0,0 +1,51 @@
import type { PageParam, PageResult } from '@vben/request';
import { requestClient } from '#/api/request';
export namespace SystemTenantPackageApi {
/** 租户套餐信息 */
export interface SystemTenantPackage {
id: number;
name: string;
status: number;
remark: string;
creator: string;
updater: string;
updateTime: string;
menuIds: number[];
createTime: Date;
}
}
/** 租户套餐列表 */
export function getTenantPackagePage(params: PageParam) {
return requestClient.get<PageResult<SystemTenantPackageApi.SystemTenantPackage>>(
'/system/tenant-package/page',
{ params }
);
}
/** 查询租户套餐详情 */
export function getTenantPackage(id: number) {
return requestClient.get(`/system/tenant-package/get?id=${id}`);
}
/** 新增租户套餐 */
export function createTenantPackage(data: SystemTenantPackageApi.SystemTenantPackage) {
return requestClient.post('/system/tenant-package/create', data);
}
/** 修改租户套餐 */
export function updateTenantPackage(data: SystemTenantPackageApi.SystemTenantPackage) {
return requestClient.put('/system/tenant-package/update', data);
}
/** 删除租户套餐 */
export function deleteTenantPackage(id: number) {
return requestClient.delete(`/system/tenant-package/delete?id=${id}`);
}
/** 获取租户套餐精简信息列表 */
export function getTenantPackageList() {
return requestClient.get<SystemTenantPackageApi.SystemTenantPackage[]>('/system/tenant-package/get-simple-list');
}

55
apps/web-antd/src/api/system/tenant/index.ts Normal file
View File

@@ -0,0 +1,55 @@
import type { PageParam, PageResult } from '@vben/request';
import { requestClient } from '#/api/request';
export namespace SystemTenantApi {
/** 租户信息 */
export interface SystemTenant {
id?: number;
name: string;
packageId: number;
contactName: string;
contactMobile: string;
accountCount: number;
expireTime: Date;
website: string;
status: number;
}
}
/** 租户列表 */
export function getTenantPage(params: PageParam) {
return requestClient.get<PageResult<SystemTenantApi.SystemTenant>>('/system/tenant/page', { params });
}
/** 获取租户精简信息列表 */
export function getSimpleTenantList() {
return requestClient.get<SystemTenantApi.SystemTenant[]>('/system/tenant/simple-list');
}
/** 查询租户详情 */
export function getTenant(id: number) {
return requestClient.get<SystemTenantApi.SystemTenant>(`/system/tenant/get?id=${id}`,);
}
/** 新增租户 */
export function createTenant(data: SystemTenantApi.SystemTenant) {
return requestClient.post('/system/tenant/create', data);
}
/** 修改租户 */
export function updateTenant(data: SystemTenantApi.SystemTenant) {
return requestClient.put('/system/tenant/update', data);
}
/** 删除租户 */
export function deleteTenant(id: number) {
return requestClient.delete(`/system/tenant/delete?id=${id}`);
}
/** 导出租户 */
export function exportTenant(params: any) {
return requestClient.download('/system/tenant/export-excel', {
params,
});
}

2
apps/web-antd/src/views/system/dept/modules/form.vue
View File

@@ -47,7 +47,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}

2
apps/web-antd/src/views/system/menu/modules/form.vue
View File

@@ -47,7 +47,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}

2
apps/web-antd/src/views/system/post/modules/form.vue
View File

@@ -47,7 +47,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}

2
apps/web-antd/src/views/system/role/modules/assign-data-permission-form.vue
View File

@@ -59,7 +59,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}

2
apps/web-antd/src/views/system/role/modules/assign-menu-form.vue
View File

@@ -54,7 +54,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}

2
apps/web-antd/src/views/system/role/modules/form.vue
View File

@@ -47,7 +47,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}

27
apps/web-antd/src/views/system/sms/channel/data.ts
View File

@@ -11,7 +11,6 @@ export function useFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'id',
label: 'id',
component: 'Input',
dependencies: {
triggerFields: [''],
@@ -22,6 +21,9 @@ export function useFormSchema(): VbenFormSchema[] {
fieldName: 'signature',
label: '短信签名',
component: 'Input',
componentProps: {
placeholder: '请输入短信签名',
},
rules: 'required',
},
{
@@ -29,8 +31,9 @@ export function useFormSchema(): VbenFormSchema[] {
label: '渠道编码',
component: 'Select',
componentProps: {
class: 'w-full',
options: getDictOptions(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, 'string'),
class: 'w-full',
placeholder: '请选择短信渠道',
},
rules: 'required',
},
@@ -49,22 +52,34 @@ export function useFormSchema(): VbenFormSchema[] {
fieldName: 'remark',
label: '备注',
component: 'Textarea',
componentProps: {
placeholder: '请输入备注',
}
},
{
fieldName: 'apiKey',
label: '短信 API 的账号',
component: 'Input',
componentProps: {
placeholder: '请输入短信 API 的账号',
},
rules: 'required',
},
{
fieldName: 'apiSecret',
label: '短信 API 的密钥',
component: 'Input',
componentProps: {
placeholder: '请输入短信 API 的密钥',
}
},
{
fieldName: 'callbackUrl',
label: '短信发送回调 URL',
component: 'Input',
componentProps: {
placeholder: '请输入短信发送回调 URL',
}
},
];
}
@@ -76,6 +91,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
fieldName: 'signature',
label: '短信签名',
component: 'Input',
componentProps: {
allowClear: true,
placeholder: '请输入短信签名',
}
},
{
fieldName: 'code',
@@ -84,6 +103,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
componentProps: {
allowClear: true,
options: getDictOptions(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE, 'string'),
placeholder: '请选择短信渠道',
},
},
{
@@ -96,6 +116,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
},
},
{
// TODO @芋艿：怎么解决范围检索
fieldName: 'createTime',
label: '创建时间',
component: 'RangePicker',
@@ -107,7 +128,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<T = SystemSmsChannelApi.SmsChannelVO>(
export function useGridColumns<T = SystemSmsChannelApi.SmsChannel>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
return [

34
apps/web-antd/src/views/system/sms/channel/index.vue
View File

@@ -1,26 +1,18 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemSmsChannelApi } from '#/api/system/sms/channel';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download, Plus } from '@vben/icons';
import { Button, message } from 'ant-design-vue';
import { Download, Plus } from '@vben/icons';
import Form from './modules/form.vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import {
deleteSmsChannel,
exportSmsChannel,
getSmsChannelPage,
} from '#/api/system/sms/channel';
import { $t } from '#/locales';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getSmsChannelPage, deleteSmsChannel, exportSmsChannel } from '#/api/system/sms/channel';
import { downloadByData } from '#/utils/download';
import { useGridColumns, useGridFormSchema } from './data';
import Form from './modules/form.vue';
const [FormModal, formModalApi] = useVbenModal({
connectedComponent: Form,
@@ -44,12 +36,12 @@ function onCreate() {
}
/** 编辑短信渠道 */
function onEdit(row: SystemSmsChannelApi.SmsChannelVO) {
function onEdit(row: SystemSmsChannelApi.SmsChannel) {
formModalApi.setData(row).open();
}
/** 删除短信渠道 */
async function onDelete(row: SystemSmsChannelApi.SmsChannelVO) {
async function onDelete(row: SystemSmsChannelApi.SmsChannel) {
const hideLoading = message.loading({
content: $t('ui.actionMessage.deleting', [row.signature]),
duration: 0,
@@ -71,16 +63,16 @@ async function onDelete(row: SystemSmsChannelApi.SmsChannelVO) {
function onActionClick({
code,
row,
}: OnActionClickParams<SystemSmsChannelApi.SmsChannelVO>) {
}: OnActionClickParams<SystemSmsChannelApi.SmsChannel>) {
switch (code) {
case 'delete': {
onDelete(row);
break;
}
case 'edit': {
onEdit(row);
break;
}
case 'delete': {
onDelete(row);
break;
}
}
}
@@ -110,7 +102,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
refresh: { code: 'query' },
search: true,
},
} as VxeTableGridOptions<SystemSmsChannelApi.SmsChannelVO>,
} as VxeTableGridOptions<SystemSmsChannelApi.SmsChannel>,
});
</script>

28
apps/web-antd/src/views/system/sms/channel/modules/form.vue
View File

@@ -1,24 +1,18 @@
<script lang="ts" setup>
import type { SystemSmsChannelApi } from '#/api/system/sms/channel';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import { useVbenForm } from '#/adapter/form';
import {
createSmsChannel,
getSmsChannel,
updateSmsChannel,
} from '#/api/system/sms/channel';
import { $t } from '#/locales';
import { computed, ref } from 'vue';
import { useVbenForm } from '#/adapter/form';
import { getSmsChannel, createSmsChannel, updateSmsChannel } from '#/api/system/sms/channel';
import { useFormSchema } from '../data';
const emit = defineEmits(['success']);
const formData = ref<SystemSmsChannelApi.SmsChannelVO>();
const formData = ref<SystemSmsChannelApi.SmsChannel>();
const getTitle = computed(() => {
return formData.value?.id
? $t('ui.actionTitle.edit', ['短信渠道'])
@@ -29,6 +23,9 @@ const [Form, formApi] = useVbenForm({
layout: 'horizontal',
schema: useFormSchema(),
showDefaultActions: false,
commonConfig: {
labelWidth: 120
}
});
const [Modal, modalApi] = useVbenModal({
@@ -39,12 +36,9 @@ const [Modal, modalApi] = useVbenModal({
}
modalApi.lock();
// 提交表单
const data =
(await formApi.getValues()) as SystemSmsChannelApi.SmsChannelVO;
const data = (await formApi.getValues()) as SystemSmsChannelApi.SmsChannel;
try {
await (formData.value?.id
? updateSmsChannel(data)
: createSmsChannel(data));
await (formData.value?.id ? updateSmsChannel(data) : createSmsChannel(data));
// 关闭并提示
await modalApi.close();
emit('success');
@@ -56,12 +50,12 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}
// 加载数据
const data = modalApi.getData<SystemSmsChannelApi.SmsChannelVO>();
const data = modalApi.getData<SystemSmsChannelApi.SmsChannel>();
if (!data || !data.id) {
return;
}

17
apps/web-antd/src/views/system/sms/log/data.ts
View File

@@ -12,6 +12,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
fieldName: 'mobile',
label: '手机号',
component: 'Input',
componentProps: {
allowClear: true,
placeholder: '请输入手机号',
}
},
{
fieldName: 'channelId',
@@ -22,23 +26,30 @@ export function useGridFormSchema(): VbenFormSchema[] {
labelField: 'signature',
valueField: 'id',
allowClear: true,
placeholder: '请选择短信渠道',
},
},
{
fieldName: 'templateId',
label: '模板编号',
component: 'Input',
componentProps: {
allowClear: true,
placeholder: '请输入模板编号',
}
},
{
fieldName: 'sendStatus',
label: '发送状态',
component: 'Select',
componentProps: {
allowClear: true,
options: getDictOptions(DICT_TYPE.SYSTEM_SMS_SEND_STATUS, 'number'),
allowClear: true,
placeholder: '请选择发送状态',
},
},
{
// TODO @芋艿：怎么解决范围检索
fieldName: 'sendTime',
label: '发送时间',
component: 'RangePicker',
@@ -51,11 +62,13 @@ export function useGridFormSchema(): VbenFormSchema[] {
label: '接收状态',
component: 'Select',
componentProps: {
allowClear: true,
options: getDictOptions(DICT_TYPE.SYSTEM_SMS_RECEIVE_STATUS, 'number'),
allowClear: true,
placeholder: '请选择接收状态',
},
},
{
// TODO @芋艿：怎么解决范围检索
fieldName: 'receiveTime',
label: '接收时间',
component: 'RangePicker',

10
apps/web-antd/src/views/system/sms/log/index.vue
View File

@@ -1,22 +1,18 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemSmsLogApi } from '#/api/system/sms/log';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download } from '@vben/icons';
import { Button } from 'ant-design-vue';
import Form from './modules/form.vue';
import { $t } from '#/locales';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { exportSmsLog, getSmsLogPage } from '#/api/system/sms/log';
import { $t } from '#/locales';
import { downloadByData } from '#/utils/download';
import { useGridColumns, useGridFormSchema } from './data';
import Form from './modules/form.vue';
const [FormModal, formModalApi] = useVbenModal({
connectedComponent: Form,

23
apps/web-antd/src/views/system/sms/log/modules/form.vue
View File

@@ -1,17 +1,14 @@
<script lang="ts" setup>
import type { SystemSmsLogApi } from '#/api/system/sms/log';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { ref } from 'vue';
const formData = ref<SystemSmsLogApi.SmsLogVO>();
const getTitle = computed(() => {
return '短信日志详情';
});
const [Modal, modalApi] = useVbenModal({
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}
@@ -30,8 +27,9 @@ const [Modal, modalApi] = useVbenModal({
});
</script>
<!-- TODO @puhui999：https://ant-design.antgroup.com/components/descriptions-cn 参考这个？ -->
<template>
<Modal :title="getTitle">
<Modal title="短信日志详情">
<div class="p-4">
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
<div class="form-item">
@@ -39,6 +37,7 @@ const [Modal, modalApi] = useVbenModal({
<div>{{ formData?.id }}</div>
</div>
<div class="form-item">
<!-- TODO @puhui：格式不对 -->
<div class="form-label">创建时间：</div>
<div>{{ formData?.createTime }}</div>
</div>
@@ -67,6 +66,7 @@ const [Modal, modalApi] = useVbenModal({
<div class="mt-4 grid grid-cols-1 gap-4 md:grid-cols-2">
<div class="form-item">
<!-- TODO @puhui：格式不对 -->
<div class="form-label">发送状态：</div>
<div>{{ formData?.sendStatus }}</div>
</div>
@@ -83,6 +83,7 @@ const [Modal, modalApi] = useVbenModal({
<div>{{ formData?.apiSendMsg }}</div>
</div>
<div class="form-item">
<!-- TODO @puhui：格式不对 -->
<div class="form-label">接收状态：</div>
<div>{{ formData?.receiveStatus }}</div>
</div>
@@ -91,19 +92,19 @@ const [Modal, modalApi] = useVbenModal({
<div>{{ formData?.receiveTime }}</div>
</div>
<div class="form-item">
<div class="form-label">API接收编码：</div>
<div class="form-label">API 接收编码：</div>
<div>{{ formData?.apiReceiveCode }}</div>
</div>
<div class="form-item">
<div class="form-label">API接收消息：</div>
<div class="form-label">API 接收消息：</div>
<div>{{ formData?.apiReceiveMsg }}</div>
</div>
<div class="form-item">
<div class="form-label">API请求ID：</div>
<div class="form-label">API 请求 ID：</div>
<div>{{ formData?.apiRequestId }}</div>
</div>
<div class="form-item">
<div class="form-label">API序列号：</div>
<div class="form-label">API 序列号：</div>
<div>{{ formData?.apiSerialNo }}</div>
</div>
</div>

44
apps/web-antd/src/views/system/sms/template/data.ts
View File

@@ -12,7 +12,6 @@ export function useFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'id',
label: 'id',
component: 'Input',
dependencies: {
triggerFields: [''],
@@ -24,8 +23,9 @@ export function useFormSchema(): VbenFormSchema[] {
label: '短信类型',
component: 'Select',
componentProps: {
class: 'w-full',
options: getDictOptions(DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE, 'number'),
class: 'w-full',
placeholder: '请选择短信类型',
},
rules: 'required',
},
@@ -33,12 +33,18 @@ export function useFormSchema(): VbenFormSchema[] {
fieldName: 'name',
label: '模板名称',
component: 'Input',
componentProps: {
placeholder: '请输入模板名称',
},
rules: 'required',
},
{
fieldName: 'code',
label: '模板编码',
component: 'Input',
componentProps: {
placeholder: '请输入模板编码',
},
rules: 'required',
},
{
@@ -50,6 +56,7 @@ export function useFormSchema(): VbenFormSchema[] {
class: 'w-full',
labelField: 'signature',
valueField: 'id',
placeholder: '请选择短信渠道',
},
rules: 'required',
},
@@ -68,17 +75,27 @@ export function useFormSchema(): VbenFormSchema[] {
fieldName: 'content',
label: '模板内容',
component: 'Textarea',
componentProps: {
placeholder: '请输入模板内容',
},
rules: 'required',
},
{
fieldName: 'apiTemplateId',
label: '短信 API 的模板编号',
component: 'Input',
componentProps: {
placeholder: '请输入短信 API 的模板编号',
},
rules: 'required',
},
{
fieldName: 'remark',
label: '备注',
component: 'Textarea',
componentProps: {
placeholder: '请输入备注',
}
},
];
}
@@ -91,8 +108,9 @@ export function useGridFormSchema(): VbenFormSchema[] {
label: '短信类型',
component: 'Select',
componentProps: {
allowClear: true,
options: getDictOptions(DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE, 'number'),
allowClear: true,
placeholder: '请选择短信类型',
},
},
{
@@ -100,19 +118,28 @@ export function useGridFormSchema(): VbenFormSchema[] {
label: '开启状态',
component: 'Select',
componentProps: {
allowClear: true,
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
allowClear: true,
placeholder: '请选择开启状态',
},
},
{
fieldName: 'code',
label: '模板编码',
component: 'Input',
componentProps: {
allowClear: true,
placeholder: '请输入模板编码',
}
},
{
fieldName: 'name',
label: '模板名称',
component: 'Input',
componentProps: {
allowClear: true,
placeholder: '请输入模板名称',
}
},
{
fieldName: 'channelId',
@@ -123,8 +150,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
labelField: 'signature',
valueField: 'id',
allowClear: true,
placeholder: '请选择短信渠道',
},
},
// TODO @芋艿：范围检索的处理
{
fieldName: 'createTime',
label: '创建时间',
@@ -143,6 +172,9 @@ export function useSendSmsFormSchema(): VbenFormSchema[] {
fieldName: 'mobile',
label: '手机号码',
component: 'Input',
componentProps: {
placeholder: '请输入手机号码',
},
rules: 'required',
},
{
@@ -158,7 +190,7 @@ export function useSendSmsFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<T = SystemSmsTemplateApi.SmsTemplateVO>(
export function useGridColumns<T = SystemSmsTemplateApi.SmsTemplate>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
return [
@@ -228,7 +260,7 @@ export function useGridColumns<T = SystemSmsTemplateApi.SmsTemplateVO>(
{
field: 'operation',
title: '操作',
minWidth: 300,
minWidth: 180,
align: 'center',
fixed: 'right',
cellRender: {

36
apps/web-antd/src/views/system/sms/template/index.vue
View File

@@ -1,27 +1,19 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemSmsTemplateApi } from '#/api/system/sms/template';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download, Plus } from '@vben/icons';
import { Button, message } from 'ant-design-vue';
import Form from './modules/form.vue';
import SendForm from './modules/send-form.vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import {
deleteSmsTemplate,
exportSmsTemplate,
getSmsTemplatePage,
} from '#/api/system/sms/template';
import { $t } from '#/locales';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { deleteSmsTemplate, exportSmsTemplate, getSmsTemplatePage } from '#/api/system/sms/template';
import { downloadByData } from '#/utils/download';
import { useGridColumns, useGridFormSchema } from './data';
import Form from './modules/form.vue';
import SendForm from './modules/send-form.vue';
const [FormModal, formModalApi] = useVbenModal({
connectedComponent: Form,
@@ -50,17 +42,17 @@ function onCreate() {
}
/** 编辑短信模板 */
function onEdit(row: SystemSmsTemplateApi.SmsTemplateVO) {
function onEdit(row: SystemSmsTemplateApi.SmsTemplate) {
formModalApi.setData(row).open();
}
/** 发送测试短信 */
function onSend(row: SystemSmsTemplateApi.SmsTemplateVO) {
function onSend(row: SystemSmsTemplateApi.SmsTemplate) {
sendModalApi.setData(row).open();
}
/** 删除短信模板 */
async function onDelete(row: SystemSmsTemplateApi.SmsTemplateVO) {
async function onDelete(row: SystemSmsTemplateApi.SmsTemplate) {
const hideLoading = message.loading({
content: $t('ui.actionMessage.deleting', [row.name]),
duration: 0,
@@ -82,16 +74,16 @@ async function onDelete(row: SystemSmsTemplateApi.SmsTemplateVO) {
function onActionClick({
code,
row,
}: OnActionClickParams<SystemSmsTemplateApi.SmsTemplateVO>) {
}: OnActionClickParams<SystemSmsTemplateApi.SmsTemplate>) {
switch (code) {
case 'delete': {
onDelete(row);
break;
}
case 'edit': {
onEdit(row);
break;
}
case 'delete': {
onDelete(row);
break;
}
case 'sms-send': {
onSend(row);
break;
@@ -125,7 +117,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
refresh: { code: 'query' },
search: true,
},
} as VxeTableGridOptions<SystemSmsTemplateApi.SmsTemplateVO>,
} as VxeTableGridOptions<SystemSmsTemplateApi.SmsTemplate>,
});
</script>

23
apps/web-antd/src/views/system/sms/template/modules/form.vue
View File

@@ -1,24 +1,18 @@
<script lang="ts" setup>
import type { SystemSmsTemplateApi } from '#/api/system/sms/template';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import { useVbenForm } from '#/adapter/form';
import {
createSmsTemplate,
getSmsTemplate,
updateSmsTemplate,
} from '#/api/system/sms/template';
import { $t } from '#/locales';
import { computed, ref } from 'vue';
import { useVbenForm } from '#/adapter/form';
import { createSmsTemplate, getSmsTemplate, updateSmsTemplate } from '#/api/system/sms/template';
import { useFormSchema } from '../data';
const emit = defineEmits(['success']);
const formData = ref<SystemSmsTemplateApi.SmsTemplateVO>();
const formData = ref<SystemSmsTemplateApi.SmsTemplate>();
const getTitle = computed(() => {
return formData.value?.id
? $t('ui.actionTitle.edit', ['短信模板'])
@@ -29,6 +23,9 @@ const [Form, formApi] = useVbenForm({
layout: 'horizontal',
schema: useFormSchema(),
showDefaultActions: false,
commonConfig: {
labelWidth: 140
}
});
const [Modal, modalApi] = useVbenModal({
@@ -40,7 +37,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock();
// 提交表单
const data =
(await formApi.getValues()) as SystemSmsTemplateApi.SmsTemplateVO;
(await formApi.getValues()) as SystemSmsTemplateApi.SmsTemplate;
try {
await (formData.value?.id
? updateSmsTemplate(data)
@@ -56,12 +53,12 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}
// 加载数据
const data = modalApi.getData<SystemSmsTemplateApi.SmsTemplateVO>();
const data = modalApi.getData<SystemSmsTemplateApi.SmsTemplate>();
if (!data || !data.id) {
return;
}

19
apps/web-antd/src/views/system/sms/template/modules/send-form.vue
View File

@@ -1,24 +1,19 @@
<script lang="ts" setup>
import type { SystemSmsTemplateApi } from '#/api/system/sms/template';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { ref } from 'vue';
import { message } from 'ant-design-vue';
import { useVbenForm } from '#/adapter/form';
import { sendSms } from '#/api/system/sms/template';
import { $t } from '#/locales';
import { useSendSmsFormSchema } from '../data';
const emit = defineEmits(['success']);
const templateData = ref<SystemSmsTemplateApi.SmsTemplateVO>();
const getTitle = computed(() => {
return $t('ui.actionTitle.send', ['短信']);
});
const templateData = ref<SystemSmsTemplateApi.SmsTemplate>();
// TODO @puhui999：貌似发送短信，少了参数展示
// 动态构建表单
const buildSchema = () => {
const schema = useSendSmsFormSchema();
@@ -63,7 +58,7 @@ const [Modal, modalApi] = useVbenModal({
}
// 构建发送短信请求
const data: SystemSmsTemplateApi.SendSmsReqVO = {
const data: SystemSmsTemplateApi.SmsSendReqVO = {
mobile: values.mobile,
templateCode: templateData.value?.code || '',
templateParams: paramsObj,
@@ -84,12 +79,12 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}
// 获取数据
const data = modalApi.getData<SystemSmsTemplateApi.SmsTemplateVO>();
const data = modalApi.getData<SystemSmsTemplateApi.SmsTemplate>();
if (!data) {
return;
}
@@ -103,7 +98,7 @@ const [Modal, modalApi] = useVbenModal({
</script>
<template>
<Modal :title="getTitle">
<Modal title="发送短信">
<Form class="mx-4" />
</Modal>
</template>

239
apps/web-antd/src/views/system/tenant/data.ts Normal file
View File

@@ -0,0 +1,239 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemTenantApi } from '#/api/system/tenant';
import { z } from '#/adapter/form';
import { getTenantPackageList } from '#/api/system/tenant-package';
import { CommonStatusEnum } from '#/utils/constants';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
/** 新增/修改的表单 */
export function useFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'id',
component: 'Input',
dependencies: {
triggerFields: [''],
show: () => false,
},
},
{
fieldName: 'name',
label: '租户名称',
component: 'Input',
rules: 'required',
},
{
fieldName: 'packageId',
label: '租户套餐',
component: 'ApiSelect',
componentProps: {
api: () => getTenantPackageList(),
class: 'w-full',
labelField: 'name',
valueField: 'id',
placeholder: '请选择租户套餐',
},
rules: 'required',
},
{
fieldName: 'contactName',
label: '联系人',
component: 'Input',
rules: 'required',
},
{
fieldName: 'contactMobile',
label: '联系手机',
component: 'Input',
},
{
label: '用户名称',
fieldName: 'username',
component: 'Input',
rules: 'required',
dependencies: {
triggerFields: ['id'],
show: (values) => !values.id,
},
},
{
label: '用户密码',
fieldName: 'password',
component: 'InputPassword',
rules: 'required',
dependencies: {
triggerFields: ['id'],
show: (values) => !values.id,
},
},
{
label: '账号额度',
fieldName: 'accountCount',
component: 'InputNumber',
componentProps: {
class: 'w-full',
placeholder: '请输入账号额度',
},
rules: 'required',
},
{
label: '过期时间',
fieldName: 'expireTime',
component: 'DatePicker',
componentProps: {
format: 'YYYY-MM-DD',
valueFormat: 'x',
class: 'w-full',
},
rules: 'required',
},
{
label: '绑定域名',
fieldName: 'website',
component: 'Input',
rules: 'required',
},
{
fieldName: 'status',
label: '租户状态',
component: 'RadioGroup',
componentProps: {
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
buttonStyle: 'solid',
optionType: 'button',
},
rules: z.number().default(CommonStatusEnum.ENABLE),
},
];
}
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'name',
label: '租户名',
component: 'Input',
componentProps: {
allowClear: true,
},
},
{
fieldName: 'contactName',
label: '联系人',
component: 'Input',
componentProps: {
allowClear: true,
},
},
{
fieldName: 'contactMobile',
label: '联系手机',
component: 'Input',
componentProps: {
allowClear: true,
},
},
{
fieldName: 'status',
label: '状态',
component: 'Select',
componentProps: {
allowClear: true,
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
},
},
{
fieldName: 'createTime',
label: '创建时间',
component: 'RangePicker',
componentProps: {
allowClear: true,
},
},
];
}
/** 列表的字段 */
const tenantPackageList = await getTenantPackageList();
export function useGridColumns<T = SystemTenantApi.SystemTenant>(onActionClick: OnActionClickFn<T>): VxeTableGridOptions['columns'] {
return [
{
field: 'id',
title: '租户编号',
minWidth: 100,
},
{
field: 'name',
title: '租户名',
minWidth: 180,
},
{
field: 'packageId',
title: '租户套餐',
minWidth: 180,
formatter: (row) => {
const packageId = row.cellValue;
return packageId === 0 ? '系统租户' : tenantPackageList.find((tenantPackage) => tenantPackage.id === packageId)?.name || '-';
},
},
{
field: 'contactName',
title: '联系人',
minWidth: 100,
},
{
field: 'contactMobile',
title: '联系手机',
minWidth: 180,
},
{
field: 'accountCount',
title: '账号额度',
minWidth: 100,
},
{
field: 'expireTime',
title: '过期时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'website',
title: '绑定域名',
minWidth: 180,
},
{
field: 'status',
title: '租户状态',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.COMMON_STATUS },
},
},
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'operation',
title: '操作',
minWidth: 130,
align: 'center',
fixed: 'right',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '租户',
onClick: onActionClick,
},
name: 'CellOperation',
},
},
];
}

125
apps/web-antd/src/views/system/tenant/index.vue Normal file
View File

@@ -0,0 +1,125 @@
<script lang="ts" setup>
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemTenantApi } from '#/api/system/tenant';
import { Page, useVbenModal } from '@vben/common-ui';
import { Button, message } from 'ant-design-vue';
import { Plus, Download } from '@vben/icons';
import Form from './modules/form.vue';
import { $t } from '#/locales';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getTenantPage, deleteTenant, exportTenant } from '#/api/system/tenant';
import { downloadByData } from '#/utils/download';
import { useGridColumns, useGridFormSchema } from './data';
const [FormModal, formModalApi] = useVbenModal({
connectedComponent: Form,
destroyOnClose: true,
});
/** 刷新表格 */
function onRefresh() {
gridApi.query();
}
/** 导出表格 */
async function onExport() {
const data = await exportTenant(await gridApi.formApi.getValues());
downloadByData(data, '租户.xls');
}
/** 创建租户 */
function onCreate() {
formModalApi.setData(null).open();
}
/** 编辑租户 */
function onEdit(row: SystemTenantApi.SystemTenant) {
formModalApi.setData(row).open();
}
/** 删除租户 */
async function onDelete(row: SystemTenantApi.SystemTenant) {
const hideLoading = message.loading({
content: $t('ui.actionMessage.deleting', [row.name]),
duration: 0,
key: 'action_process_msg',
});
try {
await deleteTenant(row.id as number);
message.success({
content: $t('ui.actionMessage.deleteSuccess', [row.name]),
key: 'action_process_msg',
});
onRefresh();
} catch {
hideLoading();
}
}
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<SystemTenantApi.SystemTenant>) {
switch (code) {
case 'edit': {
onEdit(row);
break;
}
case 'delete': {
onDelete(row);
break;
}
}
}
const [Grid, gridApi] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
// TODO @芋艿：时间筛选，后续处理；
},
gridOptions: {
columns: useGridColumns(onActionClick),
height: 'auto',
keepSource: true,
proxyConfig: {
ajax: {
query: async ({ page }, formValues) => {
return await getTenantPage({
pageNo: page.currentPage,
pageSize: page.pageSize,
...formValues,
});
},
},
},
rowConfig: {
keyField: 'id',
},
toolbarConfig: {
refresh: { code: 'query' },
search: true,
},
} as VxeTableGridOptions<SystemTenantApi.SystemTenant>,
});
</script>
<template>
<Page auto-content-height>
<FormModal @success="onRefresh" />
<Grid table-title="租户列表">
<template #toolbar-tools>
<Button type="primary" @click="onCreate">
<Plus class="size-5" />
{{ $t('ui.actionTitle.create', ['租户']) }}
</Button>
<Button type="primary" class="ml-2" @click="onExport">
<Download class="size-5" />
{{ $t('ui.actionTitle.export') }}
</Button>
</template>
</Grid>
</Page>
</template>

74
apps/web-antd/src/views/system/tenant/modules/form.vue Normal file
View File

@@ -0,0 +1,74 @@
<script lang="ts" setup>
import type { SystemTenantApi } from '#/api/system/tenant';
import { useVbenModal } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import { $t } from '#/locales';
import { computed, ref } from 'vue';
import { useVbenForm } from '#/adapter/form';
import { createTenant, getTenant, updateTenant } from '#/api/system/tenant';
import { useFormSchema } from '../data';
const emit = defineEmits(['success']);
const formData = ref<SystemTenantApi.SystemTenant>();
const getTitle = computed(() => {
return formData.value
? $t('ui.actionTitle.edit', ['租户'])
: $t('ui.actionTitle.create', ['租户']);
});
const [Form, formApi] = useVbenForm({
layout: 'horizontal',
schema: useFormSchema(),
showDefaultActions: false,
});
const [Modal, modalApi] = useVbenModal({
async onConfirm() {
const { valid } = await formApi.validate();
if (!valid) {
return;
}
modalApi.lock();
// 提交表单
const data = (await formApi.getValues()) as SystemTenantApi.SystemTenant;
try {
await (formData.value ? updateTenant(data) : createTenant(data));
// 关闭并提示
await modalApi.close();
emit('success');
message.success({
content: $t('ui.actionMessage.operationSuccess'),
key: 'action_process_msg',
});
} finally {
modalApi.lock(false);
}
},
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}
// 加载数据
const data = modalApi.getData<SystemTenantApi.SystemTenant>();
if (!data || !data.id) {
return;
}
modalApi.lock();
try {
formData.value = await getTenant(data.id as number);
// 设置到 values
await formApi.setValues(formData.value);
} finally {
modalApi.lock(false);
}
},
});
</script>
<template>
<Modal :title="getTitle">
<Form class="mx-4" />
</Modal>
</template>

139
apps/web-antd/src/views/system/tenantPackage/data.ts Normal file
View File

@@ -0,0 +1,139 @@
import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemTenantPackageApi } from '#/api/system/tenant-package';
import { z } from '#/adapter/form';
import { CommonStatusEnum } from '#/utils/constants';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
/** 新增/修改的表单 */
export function useFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'id',
component: 'Input',
dependencies: {
triggerFields: [''],
show: () => false,
},
},
{
fieldName: 'name',
label: '套餐名称',
component: 'Input',
componentProps: {
placeholder: '请输入套餐名称',
},
rules: 'required',
},
{
fieldName: 'menuIds',
label: '菜单权限',
component: 'Input',
formItemClass: 'items-start',
},
{
fieldName: 'status',
label: '状态',
component: 'RadioGroup',
componentProps: {
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
buttonStyle: 'solid',
optionType: 'button',
},
rules: z.number().default(CommonStatusEnum.ENABLE),
},
{
fieldName: 'remark',
label: '备注',
component: 'Textarea',
componentProps: {
placeholder: '请输入备注',
}
},
];
}
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
return [
{
fieldName: 'name',
label: '套餐名称',
component: 'Input',
componentProps: {
allowClear: true,
placeholder: '请输入套餐名称',
},
},
{
fieldName: 'status',
label: '状态',
component: 'Select',
componentProps: {
options: getDictOptions(DICT_TYPE.COMMON_STATUS, 'number'),
allowClear: true,
placeholder: '请选择状态',
},
},
{
fieldName: 'createTime',
label: '创建时间',
component: 'RangePicker',
componentProps: {
allowClear: true,
},
},
];
}
/** 列表的字段 */
export function useGridColumns<T = SystemTenantPackageApi.SystemTenantPackage>(onActionClick: OnActionClickFn<T>): VxeTableGridOptions['columns'] {
return [
{
field: 'id',
title: '套餐编号',
minWidth: 100,
},
{
field: 'name',
title: '套餐名称',
minWidth: 180,
},
{
field: 'status',
title: '状态',
minWidth: 100,
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.COMMON_STATUS },
},
},
{
field: 'remark',
title: '备注',
minWidth: 200,
},
{
field: 'createTime',
title: '创建时间',
minWidth: 180,
formatter: 'formatDateTime',
},
{
field: 'operation',
title: '操作',
minWidth: 130,
align: 'center',
fixed: 'right',
cellRender: {
attrs: {
nameField: 'name',
nameTitle: '套餐',
onClick: onActionClick,
},
name: 'CellOperation',
},
},
];
}

111
apps/web-antd/src/views/system/tenantPackage/index.vue Normal file
View File

@@ -0,0 +1,111 @@
<script lang="ts" setup>
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemTenantPackageApi } from '#/api/system/tenant-package';
import { Page, useVbenModal } from '@vben/common-ui';
import { Button, message } from 'ant-design-vue';
import Form from './modules/form.vue';
import { $t } from '#/locales';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { deleteTenantPackage, getTenantPackagePage } from '#/api/system/tenant-package';
import { useGridColumns, useGridFormSchema } from './data';
const [FormModal, formModalApi] = useVbenModal({
connectedComponent: Form,
destroyOnClose: true,
});
/** 刷新表格 */
function onRefresh() {
gridApi.query();
}
/** 创建租户套餐 */
function onCreate() {
formModalApi.setData(null).open();
}
/** 编辑租户套餐 */
function onEdit(row: SystemTenantPackageApi.SystemTenantPackage) {
formModalApi.setData(row).open();
}
/** 删除租户套餐 */
async function onDelete(row: SystemTenantPackageApi.SystemTenantPackage) {
const hideLoading = message.loading({
content: $t('ui.actionMessage.deleting', [row.name]),
duration: 0,
key: 'action_process_msg',
});
try {
await deleteTenantPackage(row.id as number);
message.success({
content: $t('ui.actionMessage.deleteSuccess', [row.name]),
key: 'action_process_msg',
});
onRefresh();
} catch {
hideLoading();
}
}
/** 表格操作按钮的回调函数 */
function onActionClick({ code, row }: OnActionClickParams<SystemTenantPackageApi.SystemTenantPackage>) {
switch (code) {
case 'edit': {
onEdit(row);
break;
}
case 'delete': {
onDelete(row);
break;
}
}
}
const [Grid, gridApi] = useVbenVxeGrid({
formOptions: {
schema: useGridFormSchema(),
// TODO @芋艿：时间筛选，后续处理；
},
gridOptions: {
columns: useGridColumns(onActionClick),
height: 'auto',
keepSource: true,
proxyConfig: {
ajax: {
query: async ({ page }, formValues) => {
return await getTenantPackagePage({
pageNo: page.currentPage,
pageSize: page.pageSize,
...formValues,
});
},
},
},
rowConfig: {
keyField: 'id',
},
toolbarConfig: {
refresh: { code: 'query' },
search: true,
},
} as VxeTableGridOptions<SystemTenantPackageApi.SystemTenantPackage>,
});
</script>
<template>
<Page auto-content-height>
<FormModal @success="onRefresh" />
<Grid table-title="租户套餐列表">
<template #toolbar-tools>
<Button type="primary" @click="onCreate">
<Plus class="size-5" />
{{ $t('ui.actionTitle.create', ['套餐']) }}
</Button>
</template>
</Grid>
</Page>
</template>

133
apps/web-antd/src/views/system/tenantPackage/modules/form.vue Normal file
View File

@@ -0,0 +1,133 @@
<script lang="ts" setup>
import type { SystemDeptApi } from '#/api/system/dept';
import type { SystemTenantPackageApi } from '#/api/system/tenant-package';
import { useVbenModal, VbenTree } from '@vben/common-ui';
import { Checkbox, message } from 'ant-design-vue';
import { computed, ref } from 'vue';
import { $t } from '#/locales';
import { useVbenForm } from '#/adapter/form';
import { getMenuList } from '#/api/system/menu';
import { createTenantPackage, getTenantPackage, updateTenantPackage } from '#/api/system/tenant-package';
import { handleTree } from '#/utils/tree';
import { useFormSchema } from '../data';
const emit = defineEmits(['success']);
const formData = ref<SystemTenantPackageApi.SystemTenantPackage>();
const getTitle = computed(() => {
return formData.value ? $t('ui.actionTitle.edit', ['套餐']) : $t('ui.actionTitle.create', ['套餐']);
});
const menuTree = ref<SystemDeptApi.SystemDept[]>([]); // 菜单树
const menuLoading = ref(false); // 加载菜单列表
const isAllSelected = ref(false); // 全选状态
const isExpanded = ref(false); // 展开状态
const expandedKeys = ref<number[]>([]); // 展开的节点
const [Form, formApi] = useVbenForm({
layout: 'horizontal',
schema: useFormSchema(),
showDefaultActions: false,
});
const [Modal, modalApi] = useVbenModal({
async onConfirm() {
const { valid } = await formApi.validate();
if (!valid) {
return;
}
modalApi.lock();
// 提交表单
const data = (await formApi.getValues()) as SystemTenantPackageApi.SystemTenantPackage;
try {
await (formData.value ? updateTenantPackage(data) : createTenantPackage(data));
// 关闭并提示
await modalApi.close();
emit('success');
message.success({
content: $t('ui.actionMessage.operationSuccess'),
key: 'action_process_msg',
});
} finally {
modalApi.lock(false);
}
},
async onOpenChange(isOpen: boolean) {
// 加载菜单列表
await loadMenuTree();
if (!isOpen) {
return;
}
const data = modalApi.getData<SystemTenantPackageApi.SystemTenantPackage>();
if (!data || !data.id) {
return;
}
modalApi.lock();
try {
formData.value = await getTenantPackage(data.id as number);
await formApi.setValues(data);
} finally {
modalApi.lock(false);
}
},
});
/** 加载菜单树 */
async function loadMenuTree() {
menuLoading.value = true;
try {
const data = await getMenuList();
menuTree.value = handleTree(data);
} finally {
menuLoading.value = false;
}
}
/** 全选/全不选 */
function toggleSelectAll() {
isAllSelected.value = !isAllSelected.value;
if (isAllSelected.value) {
const allIds = getAllNodeIds(menuTree.value);
formApi.setFieldValue('menuIds', allIds);
} else {
formApi.setFieldValue('menuIds', []);
}
}
/** 展开/折叠所有节点 */
function toggleExpandAll() {
isExpanded.value = !isExpanded.value;
expandedKeys.value = isExpanded.value ? getAllNodeIds(menuTree.value) : [];
}
/** 递归获取所有节点 ID */
function getAllNodeIds(nodes: any[], ids: number[] = []): number[] {
nodes.forEach((node: any) => {
ids.push(node.id);
if (node.children && node.children.length > 0) {
getAllNodeIds(node.children, ids);
}
});
return ids;
}
</script>
<template>
<Modal :title="getTitle">
<Form class="mx-6">
<template #menuIds="slotProps">
<Spin :spinning="menuLoading" class="w-full">
<!-- TODO @芋艿：可优化，使用 antd 的 tree？原因是，更原生 -->
<VbenTree :tree-data="menuTree" multiple bordered :expanded="expandedKeys" v-bind="slotProps" value-field="id" label-field="name" />
</Spin>
</template>
</Form>
<template #prepend-footer>
<div class="flex flex-auto items-center">
<Checkbox :checked="isAllSelected" @change="toggleSelectAll"> 全选 </Checkbox>
<Checkbox :checked="isExpanded" @change="toggleExpandAll"> 全部展开 </Checkbox>
</div>
</template>
</Modal>
</template>

43
apps/web-antd/src/views/system/user/data.ts
View File

@@ -103,17 +103,26 @@ export function useGridFormSchema(): VbenFormSchema[] {
fieldName: 'username',
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'),
},
@@ -124,6 +133,9 @@ export function useGridFormSchema(): VbenFormSchema[] {
component: 'RangePicker',
componentProps: {
allowClear: true,
showTime: true,
format: 'YYYY-MM-DD HH:mm:ss',
placeholder: ['开始日期', '结束日期'],
},
},
];
@@ -150,7 +162,7 @@ export function useGridColumns<T = SystemUserApi.SystemUser>(
minWidth: 120,
},
{
field: 'deptId',
field: 'deptName',
title: '部门',
minWidth: 120,
},
@@ -159,13 +171,18 @@ export function useGridColumns<T = SystemUserApi.SystemUser>(
title: '手机号码',
minWidth: 120,
},
// TODO @芋艿：switch 的接入
{
field: 'status',
title: '状态',
minWidth: 100,
align: 'center',
cellRender: {
name: 'CellDict',
props: { type: DICT_TYPE.COMMON_STATUS },
name: 'CellSwitch',
props: {
activeValue: 0,
inactiveValue: 1
},
},
},
{
@@ -177,16 +194,28 @@ export function useGridColumns<T = SystemUserApi.SystemUser>(
{
field: 'operation',
title: '操作',
minWidth: 180,
align: 'center',
minWidth: 160,
fixed: 'right',
align: 'center',
cellRender: {
attrs: {
nameField: 'username',
nameTitle: '用户',
nameField: 'name',
nameTitle: '角色',
onClick: onActionClick,
},
name: 'CellOperation',
options: [
'edit', // 默认的编辑按钮
'delete', // 默认的删除按钮
{
code: 'assign-data-permission',
text: '数据权限',
},
{
code: 'assign-menu',
text: '菜单权限',
}
],
},
},
];

2
apps/web-antd/src/views/system/user/modules/form.vue
View File

@@ -47,7 +47,7 @@ const [Modal, modalApi] = useVbenModal({
modalApi.lock(false);
}
},
async onOpenChange(isOpen) {
async onOpenChange(isOpen: boolean) {
if (!isOpen) {
return;
}