From ee2882cff02d3545b66c7591f88ed4800f730a9a Mon Sep 17 00:00:00 2001 From: spring <2396852758@qq.com> Date: 星期三, 21 五月 2025 10:00:17 +0800 Subject: [PATCH] 消息通知数据自动筛选 --- src/components/view/notice-detail.vue | 104 +++++++++++++++++++++++++++++++++++++--------------- 1 files changed, 74 insertions(+), 30 deletions(-) diff --git a/src/components/view/notice-detail.vue b/src/components/view/notice-detail.vue index 6ea2eae..9a79989 100644 --- a/src/components/view/notice-detail.vue +++ b/src/components/view/notice-detail.vue @@ -1,31 +1,28 @@ <template> <div class="notice-detail-page"> <div class="notice-detail-head"> - <el-row :gutter="20"> - <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" style="margin-bottom: 16px;"> - <label>涓婚锛�</label> - <p></p> - </el-col> - <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" style="margin-bottom: 16px;"> - <label>鍙戜欢鏃堕棿锛�</label> - <p></p> - </el-col> - <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" style="margin-bottom: 16px;"> - <label>鍙戦�佷汉锛�</label> - <p></p> - </el-col> - <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" style="margin-bottom: 16px;"> - <label>鏀朵欢浜猴細</label> - <p></p> - </el-col> - </el-row> - <div class="head-item"> + <h4 style="margin-bottom: 16px;text-align:left;" v-if="noticeInfo.theme">{{ noticeInfo.theme }} <el-tag + style="margin-left: 10px;" :type="options.find(m => m.value == noticeInfo.messageType).type" + v-if="options.find(m => m.value == noticeInfo.messageType)">{{ + options.find(m => m.value == noticeInfo.messageType).label }}</el-tag></h4> + <p style="font-size: 12px;color: #999;margin-bottom: 20px;text-align:left;"> + <!-- <span>娑堟伅绫诲瀷锛氬鎵� </span> --> + <span>鍙戦�佷汉锛歿{ noticeInfo.createUser }} </span> + <span> </span> + <span>鏀朵欢浜猴細{{ noticeInfo.consigneeUser }}</span> + <span> </span> + <span>鍙戜欢鏃堕棿锛歿{ noticeInfo.createTime }}</span> + </p> + <div class="notice-detail-head-content" style="text-align:left;"> <label>鍐呭锛�</label> - <p></p> + <div>{{ noticeInfo.content }}</div> </div> </div> - <component class="notice-content" :is="noticeInfo.u" style="height: calc(100% - 120px);"> - </component> + <div class="info-box" v-if="noticeInfo.jumpPath"> + <component class="notice-content" :is="noticeInfo.jumpPath" :entrustCodeNew="noticeInfo.entrustCode" + :laboratoryNew="noticeInfo.laboratory"> + </component> + </div> </div> </template> @@ -43,25 +40,72 @@ export default { components: comObj, data() { - return{ - noticeInfo:{ - u:'b1-inspect-order-plan' - }, + return { + noticeInfo: {}, + options: [] } + }, + mounted() { + this.noticeInfo = JSON.parse(localStorage.getItem("noticeInfo")); + this.$bus.$on("change", (msg) => { + this.noticeInfo = JSON.parse(msg); + localStorage.setItem("noticeInfo", msg); + }); + this.getTypeDicts() + }, + methods: { + getTypeDicts() { + this.$axios.post(this.$api.enums.selectEnumByCategory, { + category: "娑堟伅绫诲瀷" + }).then(res => { + let data = res.data + this.options = data; + }) + }, } } </script> <style scoped> -.notice-detail-page{ - padding-top: 16px; +.notice-detail-page { + height: calc(100% - 30px); + overflow-y: auto; + padding: 16px 0; } -.notice-detail-head{ + +.notice-detail-page::-webkit-scrollbar { + width: 0; +} + +.notice-detail-head { background: #fff; border-radius: 3px; box-sizing: border-box; padding: 16px; } -.notice-detail-head{ + +.info-box { + margin-top: 16px; + width: 100%; + box-sizing: border-box; + padding: 8px 20px 20px; + background: rgba(0, 0, 0, 0.03); + /* box-shadow: 0 0 10px 10px #fff; */ + border-radius: 4px; + min-height: calc(100% - 192px - 22px); +} + +.notice-detail-head-content div { + border-radius: 8px; + border: 1px solid #ccc; + min-height: 60px; + width: 100%; + padding: 16px; + box-sizing: border-box; + margin-top: 12px; +} + +.notice-content { + height: 600px; } </style> -- Gitblit v1.9.3