消息页面跳转

src/router/index.js

@@ -35,7 +35,9 @@ const mainRoutes = {
     // 提示: 如需要通过iframe嵌套展示内容, 但不通过tab打开, 请自行创建组件使用iframe处理!
     { path: '/home', component: _import('common/home'), name: 'home', meta: { title: '首页' } },
     { path: '/theme', component: _import('common/theme'), name: 'theme', meta: { title: '主题' } },
-    { path: '/msg-center', component: _import('modules/msg-center/notice'), name: 'msgCenter', meta: { title: '我的消息中心' } }
+    { path: '/msg-center', component: _import('modules/msg-center/notice'), name: 'msgCenter', meta: { title: '我的消息中心' } },
+    { path: '/msg-announcement', component: _import('modules/msg-center/announcement'), name: 'msgAnnouncement', meta: { title: '公告消息' } },
+    { path: '/msg-approve', component: _import('modules/msg-center/approve'), name: 'msgApprove', meta: { title: '审批消息' } }
     // { path: '/demo-echarts', component: _import('demo/echarts'), name: 'demo-echarts', meta: { title: 'demo-echarts', isTab: true } },
     // { path: '/demo-ueditor', component: _import('demo/ueditor'), name: 'demo-ueditor', meta: { title: 'demo-ueditor', isTab: true } }
   ],

src/utils/common.js

@@ -18,3 +18,12 @@ export function parseJsonStr (str) {
   str = str.replace(/:s*([0-9]{15,})s*(,?)/g, ': "$1" $2')
   return JSON.parse(str)
 }
+
+/**
+ * 发送通知已读反馈
+ */
+export function readNotice (that, noticeId) {
+  let arr = []
+  arr.push(noticeId)
+  that.$store.dispatch('websocket/WEBSOCKET_SEND', JSON.stringify({'noticeIds': arr}))
+}

src/views/modules/msg-center/announcement.vue

@@ -123,6 +123,19 @@
       this.optionsState = this.$store.state.common.approveStates
       this.queryData()
     },
+    computed: {
+      // 监听消息ID
+      listenNoticeId () {
+        return this.$route.params.noticeId
+      }
+    },
+    watch: {
+      listenNoticeId: function (noticeId) {
+        console.log('noticeId = ' + noticeId)
+        this.dataForm.noticeId = noticeId
+        this.queryData()
+      }
+    },
     data () {
       return {
         addOrUpdateVisible: false,
@@ -151,7 +164,8 @@
           'current': this.pageIndex,
           'size': this.pageSize,
           'createTime': this.dataForm.createTime ? this.dataForm.createTime : null,
-          'state': this.dataForm.state ? this.dataForm.state : null
+          'state': this.dataForm.state ? this.dataForm.state : null,
+          'noticeId': this.dataForm.noticeId ? this.dataForm.noticeId : null
         }
         getAnnouncementList(params).then(({data}) => {
           if (data && data.code === '200') {

src/views/modules/msg-center/approve.vue

@@ -141,6 +141,19 @@
       this.optionsState = this.$store.state.common.approveStates
       this.queryData()
     },
+    computed: {
+      // 监听消息ID
+      listenNoticeId () {
+        return this.$route.params.noticeId
+      }
+    },
+    watch: {
+      listenNoticeId: function (noticeId) {
+        console.log('noticeId = ' + noticeId)
+        this.dataForm.noticeId = noticeId
+        this.queryData()
+      }
+    },
     data () {
       return {
         addOrUpdateVisible: false,
@@ -201,7 +214,8 @@
           'size': this.pageSize,
           'createTime': this.dataForm.createTime ? this.dataForm.createTime : null,
           'state': this.dataForm.state ? this.dataForm.state : null,
-          'businessType': this.dataForm.businessType ? this.dataForm.businessType : null
+          'businessType': this.dataForm.businessType ? this.dataForm.businessType : null,
+          'noticeId': this.dataForm.noticeId ? this.dataForm.noticeId : null
         }
         getApprovalList(params).then(({data}) => {
           if (data && data.code === '200') {

src/views/modules/msg-center/notice.vue

@@ -20,7 +20,7 @@
       </el-form-item>
     </el-form>
     <div>
-      <p style="color: red">未读消息数量：{{dataList.length}}</p>
+      <p>未读消息数量：<span style="color: red">{{dataList.length}}</span>（请点击 “ 查询 ” 获取最新列表）</p>
     </div>
     <el-table
       :data="dataList"
@@ -89,6 +89,7 @@
 </template>
 
 <script>
+  import {readNotice} from '@/utils/common'
   export default {
     name: 'notice',
     created () {
@@ -117,7 +118,6 @@
     methods: {
       // 查询
       queryData () {
-        // this.pageIndex = 1
         this.getNoticeList()
       },
       // 获取数据列表
@@ -141,14 +141,18 @@
         // 获取记录
         let index = this.$store.state.common.msgCollection.findIndex(item => item.noticeId === id)
         this.$store.state.common.msgCollection.splice(index, 1)
-        let arr = []
-        arr.push(id)
-        this.$store.dispatch('websocket/WEBSOCKET_SEND', JSON.stringify({'noticeIds': arr}))
+        readNotice(this, id)
         this.getNoticeList()
       },
       // 查看消息
       detailHandle (row) {
-        // todo
+        if (row.type === 1) {
+          this.$router.push({name: 'msgAnnouncement', params: {noticeId: row.noticeId}})
+        } else if (row.type === 2) {
+          this.$router.push({name: 'msgApprove', params: {noticeId: row.noticeId}})
+        } else {
+          this.$message.warning('没有找到消息类型')
+        }
       }
     }
   }