perf 消息通知功能优化

This commit is contained in:
xxm
2022-11-19 20:05:29 +08:00
parent 897f4fdec7
commit 8b9a72366c
7 changed files with 93 additions and 6 deletions

View File

@@ -1,6 +1,6 @@
/* wangEditor start */ /* wangEditor start */
.editor-content-view { .editor-content-view {
border: 3px solid #ccc; //border: 3px solid #ccc;
border-radius: 5px; border-radius: 5px;
padding: 0 10px; padding: 0 10px;
margin-top: 20px; margin-top: 20px;

View File

@@ -11,7 +11,7 @@
<a-card class="daily-article" :loading="confirmLoading"> <a-card class="daily-article" :loading="confirmLoading">
<a-card-meta :title="message.title" :description="'发布人:' + message.senderName + ' 发布时间: ' + message.senderTime" /> <a-card-meta :title="message.title" :description="'发布人:' + message.senderName + ' 发布时间: ' + message.senderTime" />
<a-divider /> <a-divider />
<span v-html="message.content" class="article-content"></span> <div class="editor-content-view" v-html="message.content"></div>
</a-card> </a-card>
<template #footer> <template #footer>
<a-button key="cancel" @click="handleCancel">取消</a-button> <a-button key="cancel" @click="handleCancel">取消</a-button>
@@ -23,7 +23,7 @@
import BasicModal from '/@/components/Modal/src/BasicModal.vue' import BasicModal from '/@/components/Modal/src/BasicModal.vue'
import { $ref } from 'vue/macros' import { $ref } from 'vue/macros'
import { SiteMessage } from '/@/views/modules/notice/site/SiteMessage.api' import { SiteMessage } from '/@/views/modules/notice/site/SiteMessage.api'
import { findById } from './SiteMessage.api' import { findById, read } from './SiteMessage.api'
const modalWidth = $ref('60%') const modalWidth = $ref('60%')
let visible = $ref(false) let visible = $ref(false)
@@ -37,6 +37,7 @@
message = messageInfo message = messageInfo
findById(messageInfo.id).then(({ data }) => { findById(messageInfo.id).then(({ data }) => {
message = data message = data
read(messageInfo.id)
confirmLoading = false confirmLoading = false
}) })
} }

View File

@@ -30,3 +30,13 @@ export function findById(id) {
params: { id }, params: { id },
}) })
} }
/**
* 标记为已读
*/
export function read(id) {
return defHttp.post({
url: '/site/message/read',
params: { id },
})
}

View File

@@ -3,8 +3,8 @@
*/ */
import dayjs from 'dayjs' import dayjs from 'dayjs'
const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss' export const DATE_TIME_FORMAT = 'YYYY-MM-DD HH:mm:ss'
const DATE_FORMAT = 'YYYY-MM-DD' export const DATE_FORMAT = 'YYYY-MM-DD'
export function formatToDateTime(date: dayjs.Dayjs | undefined = undefined, format = DATE_TIME_FORMAT): string { export function formatToDateTime(date: dayjs.Dayjs | undefined = undefined, format = DATE_TIME_FORMAT): string {
return dayjs(date).format(format) return dayjs(date).format(format)

View File

@@ -0,0 +1,72 @@
const css = `.editor-content-view {
border-radius: 5px;
padding: 0 10px;
margin-top: 20px;
overflow-x: auto;
}
.editor-content-view p,
.editor-content-view li {
white-space: pre-wrap; /* 保留空格 */
}
.editor-content-view blockquote {
border-left: 8px solid #d0e5f2;
padding: 10px 10px;
margin: 10px 0;
background-color: #f1f1f1;
}
.editor-content-view code {
font-family: monospace;
background-color: #eee;
padding: 3px;
border-radius: 3px;
}
.editor-content-view pre>code {
display: block;
padding: 10px;
}
.editor-content-view table {
border-collapse: collapse;
}
.editor-content-view td,
.editor-content-view th {
border: 1px solid #ccc;
min-width: 50px;
height: 20px;
}
.editor-content-view th {
background-color: #f1f1f1;
}
.editor-content-view ul,
.editor-content-view ol {
padding-left: 20px;
}
.editor-content-view input[type="checkbox"] {
margin-right: 5px;
}`
/**
* 输出带样式的html代码
* @param content
*/
export function renderHtml(content: string) {
return `<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<style type="text/css">
${css}
</style>
</head>
<body class="editor-content-view">
${content}
</body>
</html>
`
}

View File

@@ -1,5 +1,6 @@
<template> <template>
<basic-modal <basic-modal
defaultFullscreen
v-bind="$attrs" v-bind="$attrs"
width="60%" width="60%"
title="发布系统通知消息" title="发布系统通知消息"
@@ -107,11 +108,13 @@
}) })
} else { } else {
confirmLoading.value = false confirmLoading.value = false
form.efficientTime = XEUtils.toDateString(new Date(), 'yyyy-MM-dd') const date = XEUtils.getWhatDay(new Date(), 30)
form.efficientTime = XEUtils.toDateString(date, 'yyyy-MM-dd')
} }
} }
// 保存 // 保存
function handleOk() { function handleOk() {
console.log(form.efficientTime)
formRef.validate().then(async () => { formRef.validate().then(async () => {
confirmLoading.value = true confirmLoading.value = true
await saveOrUpdate(form) await saveOrUpdate(form)

View File

@@ -141,6 +141,7 @@
//发送 //发送
function sendMessage(record) { function sendMessage(record) {
loading.value = true
send(record.id).then(() => { send(record.id).then(() => {
createMessage.success('发送成功') createMessage.success('发送成功')
queryPage() queryPage()