fixbug: 🐛 消息相关修复

src/api/v1/message.ts

@@ -13,12 +13,12 @@ export const fetchGetReceivedUserinfoByMessageId = (data: any) => {
 
 /** 系统消息---添加系统消息 */
 export const fetchAddMessage = (data: any) => {
-	return http.request<BaseResult<object>>('post', 'message/addMessage', { data });
+	return http.request<BaseResult<object>>('post', 'messageReceived/addMessage', { data });
 };
 
 /** 系统消息---更新系统消息 */
 export const fetchUpdateMessage = (data: any) => {
-	return http.request<BaseResult<object>>('put', 'message/updateMessage', { data });
+	return http.request<BaseResult<object>>('put', 'messageReceived/updateMessage', { data });
 };
 
 /** 系统消息---删除系统消息 */
@@ -38,7 +38,7 @@ export const fetchGetUserMessageList = (data: any) => {
 
 /** 系统消息---用户将消息标为已读 */
 export const fetchUpdateUserMarkAsRead = (data: any) => {
-	return http.request<BaseResult<object>>('put', 'message/noManage/updateUserMarkAsRead', { data });
+	return http.request<BaseResult<object>>('put', 'messageReceived/noManage/updateUserMarkAsRead', { data });
 };
 
 /** 系统消息---用户删除系统消息 */

src/views/message-management/message-detail/detail-type.vue

@@ -6,7 +6,7 @@ import PureTable from '@pureadmin/table';
 import { markAsAllRead, markAsRead, onDelete, onSearch, selectids } from '@/views/message-management/message-detail/utils/hooks';
 import Delete from '@iconify-icons/ep/delete';
 import { $t } from '@/plugins/i18n';
-import { Message, MessageBox } from '@element-plus/icons-vue';
+import { Message } from '@element-plus/icons-vue';
 import { useRenderIcon } from '@/components/CommonIcon/src/hooks';
 import { isReadStatus } from '@/enums/baseConstant';
 import { useMessageUserStore } from '@/store/message/messageUser';
@@ -40,7 +40,7 @@ const onPageSizeChange = (value: number) => {
  * @param rows
  */
 const onSelectionChange = (rows: Array<any>) => {
-	selectids.value = rows.map((row: any) => row.id);
+	selectids.value = rows.map((row: any) => row.messageReceivedId);
 };
 
 onMounted(() => {
@@ -95,9 +95,10 @@ onMounted(() => {
 					@page-current-change="onCurrentPageChange"
 				>
 					<template #title="{ row }">
-						<el-link v-if="row.status" :icon="MessageBox" :underline="false" type="info" @click="router.push(`/message-detail/${messageTypeStore?.form?.messageType}/${row.id}`)">
+						<el-link v-if="row.status" :icon="useRenderIcon('octicon:read-24')" :underline="false" type="info" @click="router.push(`/message-detail/${messageTypeStore?.form?.messageType}/${row.id}`)">
 							{{ row.title }}
 						</el-link>
+
 						<el-link v-else :icon="Message" :underline="false" type="primary" @click="router.push(`/message-detail/${messageTypeStore?.form?.messageType}/${row.id}`)">
 							{{ row.title }}
 						</el-link>

src/views/message-management/message-detail/utils/hooks.ts

@@ -55,7 +55,7 @@ export const markAsRead = async () => {
 
 /** 全部标为已读 */
 export const markAsAllRead = async () => {
-	const ids = messageUserStore.datalist.map(message => message.id);
+	const ids = messageUserStore.datalist.map(message => message.messageReceivedId);
 
 	// 是否确认标为已读
 	const result = await messageBox({

src/views/message-management/message-editing/index.vue

@@ -27,6 +27,6 @@ import { settingLR } from '@/views/message-management/message-editing/utils/colu
 <style lang="scss" scoped>
 .split-pane {
 	width: 100%;
-	height: calc(100vh - 120px);
+	height: calc(100vh - 150px);
 }
 </style>

src/views/message-management/message-editing/markdown-editor.vue

@@ -28,5 +28,5 @@ const onUploadImg = async (files: any, callback: any) => {
 </script>
 
 <template>
-	<MdEditor v-model="formState.content" :showToolbarName="true" style="height: calc(100vh - 120px)" @onUploadImg="onUploadImg" />
+	<MdEditor v-model="formState.content" :showToolbarName="true" style="height: calc(100vh - 150px)" @onUploadImg="onUploadImg" />
 </template>

src/views/message-management/message-editing/message-editor-from.vue

@@ -12,6 +12,7 @@ import { message } from '@/utils/message';
 import { useMessageStore } from '@/store/message/message';
 import { usePublicHooks } from '@/views/hooks';
 import { Plus } from '@element-plus/icons-vue';
+import { graphlib } from 'dagre';
 
 const formRef = ref();
 // 用户是否停用样式
@@ -35,12 +36,13 @@ const submitForm = (formEl: FormInstance | undefined) => {
 			const data = toRaw(formState);
 			data.content = encode(formState.content);
 
-			// 添加消息
+			console.log(data);
-			const result = await messageStore.addMessage(data);
+			// // 添加消息
-			if (!result) return;
+			// const result = await messageStore.addMessage(data);
-
+			// if (!result) return;
-			// 清除数据
+			//
-			resetForm(formEl);
+			// // 清除数据
+			// resetForm(formEl);
 		}
 	});
 };
@@ -66,9 +68,9 @@ onMounted(() => {
 		</el-form-item>
 
 		<!-- 消息类型 -->
-		<el-form-item :label="$t('messageType')" prop="messageType">
+		<el-form-item :label="$t('messageType')" prop="messageTypeId">
-			<el-select v-model="formState.messageType" :placeholder="`${$t('select')}${$t('messageType')}`" clearable filterable>
+			<el-select v-model="formState.messageTypeId" :placeholder="`${$t('select')}${$t('messageType')}`" clearable filterable>
-				<el-option v-for="(item, index) in messageTypeStore.allMessageTypeList" :key="index" :label="item.messageName" :navigationBar="false" :value="item.messageType" />
+				<el-option v-for="(item, index) in messageTypeStore.allMessageTypeList" :key="index" :label="item.messageName" :navigationBar="false" :value="item.id" />
 			</el-select>
 		</el-form-item>
 
@@ -132,8 +134,10 @@ onMounted(() => {
 
 		<!-- 提交 -->
 		<el-form-item>
-			<el-button type="primary" @click="submitForm(formRef)">{{ $t('submit') }}</el-button>
+			<div class="grid grid-cols-2 w-[100%]">
-			<el-button @click="resetForm(formRef)">{{ $t('buttons.reset') }}</el-button>
+				<el-button bg class="w-[100%]" text type="primary" @click="submitForm(formRef)">{{ $t('submit') }}</el-button>
+				<el-button bg class="w-[100%]" text @click="resetForm(formRef)">{{ $t('buttons.reset') }}</el-button>
+			</div>
 		</el-form-item>
 	</el-form>
 </template>

src/views/message-management/message-editing/rich-editor.vue

@@ -53,6 +53,6 @@ onBeforeUnmount(() => {
 <template>
 	<div class="wangeditor">
 		<Toolbar :defaultConfig="toolbarConfig" :editor="editorRef" :mode="mode" style="border-bottom: 1px solid #ccc" />
-		<Editor v-model="formState.content" :defaultConfig="editorConfig" :mode="mode" style="height: 500px; overflow-y: hidden" @onCreated="handleCreated" />
+		<Editor v-model="formState.content" :defaultConfig="editorConfig" :mode="mode" style="height: calc(100vh - 172px); overflow-y: hidden" @onCreated="handleCreated" />
 	</div>
 </template>

src/views/message-management/message-editing/utils/columns.ts

@@ -6,7 +6,7 @@ export const rules = {
 	// 消息标题
 	title: [{ required: true, message: `${$t('input')}${$t('title')}`, trigger: 'blur' }],
 	// 消息类型
-	messageType: [{ required: true, message: `${$t('input')}${$t('messageType')}`, trigger: 'blur' }],
+	messageTypeId: [{ required: true, message: `${$t('input')}${$t('messageType')}`, trigger: 'blur' }],
 	// 消息内容
 	content: [{ required: true, message: `${$t('input')}${$t('content')}`, trigger: 'blur' }],
 	// 编辑器类型

src/views/message-management/message-editing/utils/hooks.ts

@@ -15,7 +15,7 @@ export const coverUrl = ref('');
 export const formState = reactive({
 	title: '',
 	receivedUserIds: undefined,
-	messageType: undefined,
+	messageTypeId: undefined,
 	content: '',
 	editorType: 'markdown',
 	status: false,

src/views/message-management/message/index.vue

@@ -124,6 +124,18 @@ onMounted(() => {
 					@selection-change="onSelectionChange"
 					@page-current-change="onCurrentPageChange"
 				>
+					<template #cover="{ row }">
+						<el-image :initial-index="0" :preview-src-list="[row.cover]" :src="row.cover" class="w-[50px] h-[50px]" fit="cover" loading="lazy" preview-teleported />
+					</template>
+
+					<template #extra="{ row }">
+						<el-text type="danger">{{ row.extra }}</el-text>
+					</template>
+
+					<template #messageType="{ row }">
+						<el-tag effect="plain" round>{{ row.messageType }}</el-tag>
+					</template>
+
 					<template #createUser="{ row }">
 						<el-button v-show="row.createUser" link type="primary" @click="selectUserinfo(row.createUser)">
 							{{ row.createUsername }}

src/views/message-management/message/markdown-editor.vue

@@ -28,5 +28,5 @@ const onUploadImg = async (files: any, callback: any) => {
 </script>
 
 <template>
-	<MdEditor v-model="updateMessage.content" :showToolbarName="true" style="height: calc(100vh - 120px)" @onUploadImg="onUploadImg" />
+	<MdEditor v-model="updateMessage.content" :showToolbarName="true" style="height: calc(100vh - 130px)" @onUploadImg="onUploadImg" />
 </template>

src/views/message-management/message/message-dialog.vue

@@ -43,9 +43,9 @@ defineExpose({ formRef });
 						</el-form-item>
 
 						<!-- 消息类型 -->
-						<el-form-item :label="$t('messageType')" prop="messageType">
+						<el-form-item :label="$t('messageType')" prop="messageTypeId">
-							<el-select v-model="updateMessage.messageType" :placeholder="`${$t('select')}${$t('messageType')}`" clearable filterable>
+							<el-select v-model="updateMessage.messageTypeId" :placeholder="`${$t('select')}${$t('messageType')}`" clearable filterable>
-								<el-option v-for="(item, index) in messageTypeStore.allMessageTypeList" :key="index" :label="item.messageName" :navigationBar="false" :value="item.messageType" />
+								<el-option v-for="(item, index) in messageTypeStore.allMessageTypeList" :key="index" :label="item.messageName" :navigationBar="false" :value="item.id" />
 							</el-select>
 						</el-form-item>
 

src/views/message-management/message/rich-editor.vue

@@ -51,8 +51,8 @@ onBeforeUnmount(() => {
 </script>
 
 <template>
-	<div class="wangeditor">
+	<div>
 		<Toolbar :defaultConfig="toolbarConfig" :editor="editorRef" :mode="mode" style="border-bottom: 1px solid #ccc" />
-		<Editor v-model="updateMessage.content" :defaultConfig="editorConfig" :mode="mode" style="height: 500px; overflow-y: hidden" @onCreated="handleCreated" />
+		<Editor v-model="updateMessage.content" :defaultConfig="editorConfig" :mode="mode" style="height: calc(100vh - 190px); overflow-y: hidden" @onCreated="handleCreated" />
 	</div>
 </template>

src/views/message-management/message/utils/columns.tsx

@@ -1,7 +1,6 @@
 import { reactive } from 'vue';
 import { $t } from '@/plugins/i18n';
-import type { FormRules } from 'element-plus';
+import { ElTag, type FormRules } from 'element-plus';
-import { ElTag } from 'element-plus';
 
 // 表格列
 export const columns: TableColumnList = [
@@ -9,29 +8,49 @@ export const columns: TableColumnList = [
 	{ type: 'index', index: (index: number) => index + 1, label: '序号', width: 60 },
 	// 消息标题
 	{ label: $t('title'), prop: 'title' },
+	// 消息简介
+	{ label: $t('summary'), prop: 'summary' },
 	// 发送人昵称
 	{ label: $t('sendNickname'), prop: 'sendNickname' },
+	// 接受人昵称
+	{ label: $t('receivedUserNickname'), prop: 'receivedUserNickname' },
 	// 消息类型
-	{ label: $t('messageType'), prop: 'messageType' },
+	{ label: $t('messageType'), prop: 'messageType', slot: 'messageType' },
 	// 编辑器类型
 	{ label: $t('editorType'), prop: 'editorType' },
-	// 编辑器类型
+	// 封面
+	{ label: $t('cover'), prop: 'cover', slot: 'cover', width: 80 },
+	// 消息等级
 	{
 		label: $t('level'),
 		prop: 'level',
 		formatter({ level }) {
-			return <ElTag type={level}>{$t(level)}</ElTag>;
+			return (
+				<ElTag type={level} effect={'plain'} round>
+					{$t(level)}
+				</ElTag>
+			);
 		},
+		width: 100,
 	},
-	// 编辑器类型
+	// 消息等级详情
-	{ label: $t('extra'), prop: 'extra' },
+	{ label: $t('extra'), prop: 'extra', slot: 'extra' },
 	// 0:未读 1:已读
 	{
 		label: $t('status'),
 		prop: 'status',
 		formatter({ status }) {
-			return status ? <ElTag type={'info'}>{$t('readAlready')}</ElTag> : <ElTag type={'primary'}>{$t('unread')}</ElTag>;
+			return status ? (
+				<ElTag type={'info'} effect={'plain'}>
+					{$t('readAlready')}
+				</ElTag>
+			) : (
+				<ElTag type={'danger'} effect={'plain'}>
+					{$t('unread')}
+				</ElTag>
+			);
 		},
+		width: 80,
 	},
 	{ label: $t('table.updateTime'), prop: 'updateTime', sortable: true, width: 160 },
 	{ label: $t('table.createTime'), prop: 'createTime', sortable: true, width: 160 },
@@ -47,7 +66,7 @@ export const rules = reactive<FormRules>({
 	// 发送人用户ID
 	sendUserId: [{ required: true, message: `${$t('input')}${$t('sendUserId')}`, trigger: 'blur' }],
 	// 消息类型
-	messageType: [{ required: true, message: `${$t('input')}${$t('messageType')}`, trigger: 'blur' }],
+	messageTypeId: [{ required: true, message: `${$t('input')}${$t('messageType')}`, trigger: 'blur' }],
 	// 消息内容
 	content: [{ required: true, message: `${$t('input')}${$t('content')}`, trigger: 'blur' }],
 	// 编辑器类型

src/views/message-management/message/utils/hooks.ts

@@ -25,14 +25,14 @@ export const updateMessage = reactive({
 	title: undefined,
 	// 封面
 	cover: undefined,
-	// 接收人用户ID
-	receivedUserIds: undefined,
 	// 发送人用户ID
 	sendUserId: undefined,
 	// 发送人昵称
 	sendNickName: undefined,
 	// 消息类型
-	messageType: undefined,
+	messageTypeId: undefined,
+	// 消息用户表id
+	messageReceivedId: undefined,
 	// 消息内容
 	content: undefined,
 	// 简介
@@ -72,7 +72,7 @@ export async function onUpdate(row: any) {
 	Object.assign(updateMessage, row);
 
 	// 解码内容
-	updateMessage.content = decode(row.content);
+	updateMessage.content = decode(updateMessage.content);
 
 	// 获取当前消息内容和接收者信息
 	const result = await fetchGetReceivedUserinfoByMessageId({ messageId: row.id });

src/views/message-management/message/utils/types.ts

@@ -1,26 +0,0 @@
-// 添加或者修改表单元素
-export interface FormItemProps {
-	// 消息标题
-	title: string;
-	// 接收人用户ID
-	receivedUserIds: string[];
-	// 发送人用户ID
-	sendUserId: string;
-	// 消息类型
-	messageType: string;
-	// 消息内容
-	content: string;
-	// 消息等级
-	level: string;
-	// 消息等级类型
-	extra: string;
-	// 编辑器类型
-	editorType: string;
-	// 0:未读 1:已读
-	status: boolean;
-}
-
-// 添加或修改表单Props
-export interface FormProps {
-	formInline: FormItemProps;
-}