yudao
/
admin-vben
mirror of https://gitee.com/yudaocode/yudao-ui-admin-vben.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor: 站内信代码优化

pull/78/head
puhui999 2025-04-22 15:22:39 +08:00
parent 6ca22ff155
commit 86fe4ff96a
5 changed files with 68 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
apps/web-antd/src/views/system/notify/my/index.vue
View File

@ -1,14 +1,11 @@
<script lang="ts" setup>
// TODO @puhui999：需要看看，vben 哪里改下哈。一个是 vben 右上角的站内信、一个是点击查看所有消息，应该跳转到这里。
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemNotifyMessageApi } from '#/api/system/notify/message';
import { DocAlert } from '#/components/doc-alert';
import Detail from './modules/detail.vue';
import { Page, useVbenModal } from '@vben/common-ui';
import { MdiCheckboxMarkedCircleOutline } from '@vben/icons';
import { Button, message } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
@ -17,10 +14,8 @@ import {
updateAllNotifyMessageRead,
updateNotifyMessageRead,
} from '#/api/system/notify/message';
import { DocAlert } from '#/components/doc-alert';
import { useGridColumns, useGridFormSchema } from './data';
import Detail from './modules/detail.vue';
const [DetailModal, detailModalApi] = useVbenModal({
connectedComponent: Detail,
@ -68,9 +63,7 @@ async function onMarkRead() {
return;
}
const ids = rows.map(
(row: SystemNotifyMessageApi.SystemNotifyMessage) => row.id,
);
const ids = rows.map((row: SystemNotifyMessageApi.SystemNotifyMessage) => row.id);
message.loading({
content: '正在标记已读...',
duration: 0,
@ -106,10 +99,7 @@ async function onMarkAllRead() {
}
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<SystemNotifyMessageApi.SystemNotifyMessage>) {
function onActionClick({ code, row }: OnActionClickParams<SystemNotifyMessageApi.SystemNotifyMessage>) {
switch (code) {
case 'detail': {
onDetail(row);
@ -149,9 +139,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
search: true,
},
checkboxConfig: {
checkMethod: (params: {
row: SystemNotifyMessageApi.SystemNotifyMessage;
}) => !params.row.readStatus,
checkMethod: (params: { row: SystemNotifyMessageApi.SystemNotifyMessage }) => !params.row.readStatus,
highlight: true,
},
} as VxeTableGridOptions<SystemNotifyMessageApi.SystemNotifyMessage>,

59
apps/web-antd/src/views/system/notify/template/data.ts
View File

@ -2,13 +2,14 @@ import type { VbenFormSchema } from '#/adapter/form';
import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemNotifyTemplateApi } from '#/api/system/notify/template';
import { useAccess } from '@vben/access';
import { z } from '#/adapter/form';
import { CommonStatusEnum } from '#/utils/constants';
import { getSimpleUserList } from '#/api/system/user';
import { CommonStatusEnum, UserTypeEnum } from '#/utils/constants';
import { getRangePickerDefaultProps } from '#/utils/date';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
import { useAccess } from '@vben/access';
const { hasAccessByCodes } = useAccess();
/** 新增/修改的表单 */
@ -63,10 +64,7 @@ export function useFormSchema(): VbenFormSchema[] {
label: '模板类型',
component: 'Select',
componentProps: {
options: getDictOptions(
DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE,
'number',
),
options: getDictOptions(DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE, 'number'),
class: 'w-full',
placeholder: '请选择模板类型',
},
@ -130,10 +128,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
label: '模板类型',
component: 'Select',
componentProps: {
options: getDictOptions(
DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE,
'number',
),
options: getDictOptions(DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE, 'number'),
allowClear: true,
placeholder: '请选择模板类型',
},
@ -170,13 +165,47 @@ export function useSendNotifyFormSchema(): VbenFormSchema[] {
show: () => false,
},
},
{
fieldName: 'userType',
label: '用户类型',
component: 'RadioGroup',
componentProps: {
options: getDictOptions(DICT_TYPE.USER_TYPE, 'number'),
},
rules: z.number().default(UserTypeEnum.MEMBER),
},
{
fieldName: 'userId',
label: '用户编号',
label: '接收人ID',
component: 'Input',
componentProps: {
placeholder: '请输入用户编号',
},
dependencies: {
show(values) {
return values.userType === UserTypeEnum.MEMBER;
},
triggerFields: ['userType'],
},
rules: 'required',
},
{
fieldName: 'userId',
label: '接收人',
component: 'ApiSelect',
componentProps: {
api: getSimpleUserList,
class: 'w-full',
labelField: 'nickname',
valueField: 'id',
placeholder: '请选择接收人',
},
dependencies: {
show(values) {
return values.userType === UserTypeEnum.ADMIN;
},
triggerFields: ['userType'],
},
rules: 'required',
},
{
@ -192,9 +221,9 @@ export function useSendNotifyFormSchema(): VbenFormSchema[] {
}
/** 列表的字段 */
export function useGridColumns<
T = SystemNotifyTemplateApi.SystemNotifyTemplate,
>(onActionClick: OnActionClickFn<T>): VxeTableGridOptions['columns'] {
export function useGridColumns<T = SystemNotifyTemplateApi.SystemNotifyTemplate>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
return [
{
field: 'id',

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

@ -1,28 +1,20 @@
<script lang="ts" setup>
import type {
OnActionClickParams,
VxeTableGridOptions,
} from '#/adapter/vxe-table';
import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
import type { SystemNotifyTemplateApi } from '#/api/system/notify/template';
import { DocAlert } from '#/components/doc-alert';
import Form from './modules/form.vue';
import SendForm from './modules/send-form.vue';
import { Page, useVbenModal } from '@vben/common-ui';
import { Download, Plus } from '@vben/icons';
import { Button, message } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import {
deleteNotifyTemplate,
exportNotifyTemplate,
getNotifyTemplatePage,
} from '#/api/system/notify/template';
import { DocAlert } from '#/components/doc-alert';
import { deleteNotifyTemplate, exportNotifyTemplate, getNotifyTemplatePage } from '#/api/system/notify/template';
import { $t } from '#/locales';
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,
@ -80,10 +72,7 @@ async function onDelete(row: SystemNotifyTemplateApi.SystemNotifyTemplate) {
}
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<SystemNotifyTemplateApi.SystemNotifyTemplate>) {
function onActionClick({ code, row }: OnActionClickParams<SystemNotifyTemplateApi.SystemNotifyTemplate>) {
switch (code) {
case 'delete': {
onDelete(row);
@ -138,20 +127,11 @@ const [Grid, gridApi] = useVbenVxeGrid({
<SendModal />
<Grid table-title="站内信模板列表">
<template #toolbar-tools>
<Button
type="primary"
@click="onCreate"
v-access:code="['system:notify-template:create']"
>
<Button type="primary" @click="onCreate" v-access:code="['system:notify-template:create']">
<Plus class="size-5" />
{{ $t('ui.actionTitle.create', ['站内信模板']) }}
</Button>
<Button
type="primary"
class="ml-2"
@click="onExport"
v-access:code="['system:notify-template:export']"
>
<Button type="primary" class="ml-2" @click="onExport" v-access:code="['system:notify-template:export']">
<Download class="size-5" />
{{ $t('ui.actionTitle.export') }}
</Button>

25
apps/web-antd/src/views/system/notify/template/modules/form.vue
View File

@ -1,28 +1,20 @@
<script lang="ts" setup>
import type { SystemNotifyTemplateApi } from '#/api/system/notify/template';
import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import { useVbenForm } from '#/adapter/form';
import {
createNotifyTemplate,
getNotifyTemplate,
updateNotifyTemplate,
} from '#/api/system/notify/template';
import { createNotifyTemplate, getNotifyTemplate, updateNotifyTemplate } from '#/api/system/notify/template';
import { $t } from '#/locales';
import { computed, ref } from 'vue';
import { useFormSchema } from '../data';
const emit = defineEmits(['success']);
const formData = ref<SystemNotifyTemplateApi.SystemNotifyTemplate>();
const getTitle = computed(() => {
return formData.value?.id
? $t('ui.actionTitle.edit', ['站内信模板'])
: $t('ui.actionTitle.create', ['站内信模板']);
return formData.value?.id ? $t('ui.actionTitle.edit', ['站内信模板']) : $t('ui.actionTitle.create', ['站内信模板']);
});
const [Form, formApi] = useVbenForm({
@ -39,12 +31,9 @@ const [Modal, modalApi] = useVbenModal({
}
modalApi.lock();
// 提交表单
const data =
(await formApi.getValues()) as SystemNotifyTemplateApi.SystemNotifyTemplate;
const data = (await formApi.getValues()) as SystemNotifyTemplateApi.SystemNotifyTemplate;
try {
await (formData.value?.id
? updateNotifyTemplate(data)
: createNotifyTemplate(data));
await (formData.value?.id ? updateNotifyTemplate(data) : createNotifyTemplate(data));
// 关闭并提示
await modalApi.close();
emit('success');
@ -60,9 +49,9 @@ const [Modal, modalApi] = useVbenModal({
if (!isOpen) {
return;
}
// 加载数据
const data =
modalApi.getData<SystemNotifyTemplateApi.SystemNotifyTemplate>();
const data = modalApi.getData<SystemNotifyTemplateApi.SystemNotifyTemplate>();
if (!data || !data.id) {
return;
}

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

@ -1,15 +1,13 @@
<script lang="ts" setup>
import type { SystemNotifyTemplateApi } from '#/api/system/notify/template';
import { ref } from 'vue';
import { useVbenModal } from '@vben/common-ui';
import { message } from 'ant-design-vue';
import { useVbenForm } from '#/adapter/form';
import { sendNotify } from '#/api/system/notify/template';
import { $t } from '#/locales';
import { ref } from 'vue';
import { useSendNotifyFormSchema } from '../data';
@ -24,7 +22,6 @@ const [Form, formApi] = useVbenForm({
},
});
// TODO @puhui999：有个用户类型的选项。不同的用户类型，对应的接收人处理不同。
const [Modal, modalApi] = useVbenModal({
async onConfirm() {
const { valid } = await formApi.validate();
@ -42,6 +39,7 @@ const [Modal, modalApi] = useVbenModal({
}
const data: SystemNotifyTemplateApi.SystemNotifySendReqVO = {
userId: values.userId,
userType: values.userType,
templateCode: formData.value?.code || '',
templateParams: paramsObj,
};
@ -67,8 +65,7 @@ const [Modal, modalApi] = useVbenModal({
return;
}
// 获取数据
const data =
modalApi.getData<SystemNotifyTemplateApi.SystemNotifyTemplate>();
const data = modalApi.getData<SystemNotifyTemplateApi.SystemNotifyTemplate>();
if (!data || !data.id) {
return;
}