feat:完善我的站内信 50%(列表界面)

pull/77/head
YunaiV 2025-04-21 09:39:08 +08:00
parent 555dc1c063
commit d3d250f16f
6 changed files with 87 additions and 73 deletions

View File

@ -15,8 +15,8 @@ export namespace SystemNotifyMessageApi {
templateType: number;
templateParams: string;
readStatus: boolean;
readTime: string;
createTime: string;
readTime: Date;
createTime: Date;
}
}
@ -38,7 +38,9 @@ export function getMyNotifyMessagePage(params: PageParam) {
/** 批量标记已读 */
export function updateNotifyMessageRead(ids: number[]) {
return requestClient.put('/system/notify-message/update-read', { ids });
return requestClient.put('/system/notify-message/update-read', {}, {
params: { ids },
});
}
/** 标记所有站内信为已读 */

View File

@ -17,10 +17,9 @@ const routes: RouteRecordRaw[] = [
path: '/codegen',
name: 'CodegenEdit',
meta: {
title: '代码生成',
icon: 'ic:baseline-view-in-ar',
keepAlive: true,
order: 1000,
title: '代码生成',
hideInMenu: true,
},
children: [

View File

@ -0,0 +1,16 @@
import type { RouteRecordRaw } from 'vue-router';
const routes: RouteRecordRaw[] = [
{
path: '/system/notify-message',
component: () => import('#/views/system/notify/my/index.vue'),
name: 'MyNotifyMessage',
meta: {
title: '我的站内信',
icon: 'ant-design:message-filled',
hideInMenu: true,
},
},
];
export default routes;

View File

@ -4,9 +4,6 @@ import type { SystemNotifyMessageApi } from '#/api/system/notify/message';
import { getRangePickerDefaultProps } from '#/utils/date';
import { DICT_TYPE, getDictOptions } from '#/utils/dict';
import { useAccess } from '@vben/access';
const { hasAccessByCodes } = useAccess();
/** 列表的搜索表单 */
export function useGridFormSchema(): VbenFormSchema[] {
@ -16,8 +13,8 @@ export function useGridFormSchema(): VbenFormSchema[] {
label: '是否已读',
component: 'Select',
componentProps: {
allowClear: true,
options: getDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING, 'boolean'),
allowClear: true,
placeholder: '请选择是否已读',
},
},
@ -38,6 +35,11 @@ export function useGridColumns<T = SystemNotifyMessageApi.SystemNotifyMessage>(
onActionClick: OnActionClickFn<T>,
): VxeTableGridOptions['columns'] {
return [
{
title: '',
width: 40,
type: 'checkbox',
},
{
field: 'templateNickname',
title: '发送人',
@ -94,8 +96,13 @@ export function useGridColumns<T = SystemNotifyMessageApi.SystemNotifyMessage>(
options: [
{
code: 'detail',
text: '详情',
show: hasAccessByCodes(['system:notify-message:query']),
text: '查看',
show: (row: any) => row.readStatus,
},
{
code: 'read',
text: '已读',
show: (row: any) => !row.readStatus,
},
],
},

View File

@ -33,17 +33,27 @@ function onRefresh() {
/** 查看站内信详情 */
function onDetail(row: SystemNotifyMessageApi.SystemNotifyMessage) {
//
if (!row.readStatus) {
handleReadOne(row.id);
}
detailModalApi.setData(row).open();
}
/** 标记一条站内信已读 */
async function handleReadOne(id: number) {
await updateNotifyMessageRead([id]);
async function onRead(row: SystemNotifyMessageApi.SystemNotifyMessage) {
message.loading({
content: '正在标记已读...',
duration: 0,
key: 'action_process_msg',
});
//
await updateNotifyMessageRead([row.id]);
//
message.success({
content: '标记已读成功',
key: 'action_process_msg',
});
onRefresh();
//
onDetail(row);
}
/** 标记选中的站内信为已读 */
@ -58,42 +68,38 @@ async function onMarkRead() {
}
const ids = rows.map((row: SystemNotifyMessageApi.SystemNotifyMessage) => row.id);
const hideLoading = message.loading({
message.loading({
content: '正在标记已读...',
duration: 0,
key: 'action_process_msg',
});
try {
//
await updateNotifyMessageRead(ids);
//
message.success({
content: '标记已读成功',
key: 'action_process_msg',
});
await gridApi.grid.setAllCheckboxRow(false);
onRefresh();
} finally {
hideLoading();
}
}
/** 标记所有站内信为已读 */
async function onMarkAllRead() {
const hideLoading = message.loading({
message.loading({
content: '正在标记全部已读...',
duration: 0,
key: 'action_process_msg',
});
try {
//
await updateAllNotifyMessageRead();
//
message.success({
content: '全部标记已读成功',
key: 'action_process_msg',
});
await gridApi.grid.setAllCheckboxRow(false);
onRefresh();
} finally {
hideLoading();
}
}
/** 表格操作按钮的回调函数 */
@ -106,12 +112,11 @@ function onActionClick({
onDetail(row);
break;
}
case 'read': {
onRead(row);
break;
}
}
}
//
function checkboxConfig(params: { row: SystemNotifyMessageApi.SystemNotifyMessage }) {
return !params.row.readStatus;
}
const [Grid, gridApi] = useVbenVxeGrid({
@ -141,23 +146,24 @@ const [Grid, gridApi] = useVbenVxeGrid({
search: true,
},
checkboxConfig: {
checkMethod: checkboxConfig,
checkMethod: (params: { row: SystemNotifyMessageApi.SystemNotifyMessage }) => !params.row.readStatus,
highlight: true,
},
} as VxeTableGridOptions<SystemNotifyMessageApi.SystemNotifyMessage>,
});
</script>
<template>
<Page auto-content-height>
<DocAlert title="短信配置" url="https://doc.iocoder.cn/sms/" />
<DocAlert title="站内信配置" url="https://doc.iocoder.cn/notify/" />
<DetailModal @success="onRefresh" />
<Grid table-title="">
<template #toolbar-tools>
<Button type="primary" @click="onMarkRead" v-access:code="['system:notify-message:update-read']">
<Button type="primary" @click="onMarkRead">
<MdiCheckboxMarkedCircleOutline />
标记已读
</Button>
<Button type="primary" class="ml-2" @click="onMarkAllRead" v-access:code="['system:notify-message:update-all-read']">
<Button type="primary" class="ml-2" @click="onMarkAllRead">
<MdiCheckboxMarkedCircleOutline />
全部已读
</Button>

View File

@ -32,31 +32,15 @@ const [Modal, modalApi] = useVbenModal({
</script>
<template>
<Modal title="我的站内信">
<Modal title="消息详情" :show-cancel-button="false" :show-confirm-button="false">
<Descriptions bordered :column="1" size="middle" class="mx-4">
<Descriptions.Item label="编号">{{ formData?.id }}</Descriptions.Item>
<Descriptions.Item label="用户类型">
<DictTag :type="DICT_TYPE.USER_TYPE" :value="formData?.userType" />
</Descriptions.Item>
<Descriptions.Item label="用户编号">
{{ formData?.userId }}
</Descriptions.Item>
<Descriptions.Item label="模版编号">
{{ formData?.templateId }}
</Descriptions.Item>
<Descriptions.Item label="模板编码">
{{ formData?.templateCode }}
</Descriptions.Item>
<Descriptions.Item label="发送人名称">
<Descriptions.Item label="发送人">
{{ formData?.templateNickname }}
</Descriptions.Item>
<Descriptions.Item label="模版内容">
{{ formData?.templateContent }}
<Descriptions.Item label="发送时间">
{{ formatDateTime(formData?.createTime) }}
</Descriptions.Item>
<Descriptions.Item label="模版参数">
{{ formData?.templateParams }}
</Descriptions.Item>
<Descriptions.Item label="模版类型">
<Descriptions.Item label="消息类型">
<DictTag :type="DICT_TYPE.SYSTEM_NOTIFY_TEMPLATE_TYPE" :value="formData?.templateType" />
</Descriptions.Item>
<Descriptions.Item label="是否已读">
@ -65,8 +49,8 @@ const [Modal, modalApi] = useVbenModal({
<Descriptions.Item label="阅读时间">
{{ formatDateTime(formData?.readTime || '') }}
</Descriptions.Item>
<Descriptions.Item label="创建时间">
{{ formatDateTime(formData?.createTime || '') }}
<Descriptions.Item label="消息内容">
{{ formData?.templateContent }}
</Descriptions.Item>
</Descriptions>
</Modal>