Browse Source

消息中心

yangjunjing 5 years ago
parent
commit
422204b238

+ 11 - 2
src/framework/components/messagesever/index.vue

@@ -36,7 +36,7 @@
         </div>
         <div class="notice_operate">
           <!-- <div class="readAll">全部标为已读</div> -->
-          <div class="seeAll">查看全部<i class="iconfont icon-right"></i></div>
+          <div class="seeAll" @click="allDetails">查看全部<i class="iconfont icon-right"></i></div>
         </div>
       </div>
     </transition>
@@ -66,6 +66,9 @@ import { MQTT_SERVICE, MQTT_USERNAME, MQTT_PASSWORD } from './mqSetting'
 import { messgeCount, messgeQuery, messgeUpdateState } from '@/api/msgsever'
 
 export default {
+  components:{
+    
+  },
   data() {
     return {
       client: Stomp.client(MQTT_SERVICE),
@@ -84,7 +87,8 @@ export default {
         "Error": "msg-icon el-icon-error error-color",
         "Warning": "msg-icon el-icon-warning warning-color",
         "Info": "msg-icon el-icon-info info-color",
-      }
+      },
+      showTools: false
     }
   },
   created () {
@@ -190,6 +194,11 @@ export default {
     },
     handleClickSendMessage() {//发送消息
       this.send('/topic/datacenter.broadcast',this.sendMessage)
+    },
+    allDetails(){
+      console.log(493498384938)
+      this.noticeListShow = false;
+      this.$router.push({path:"/message/allDetails"});
     }
   }
 }

+ 172 - 0
src/framework/components/messagesever/msgAllDetails.vue

@@ -0,0 +1,172 @@
+<template>
+  <div class="box">
+    <div class="condition">
+      <div class="main" :style="tableData && tableData.length?'height: calc(100% - 96px);':'height: calc(100% - 46px);'">
+        <!-- <el-table ref="multipleTable" :data="tableData" v-loading='loading' stripe height="100%" :header-cell-style="headerStyle"> -->
+        <el-table ref="multipleTable" v-loading='loading' stripe :header-cell-style="headerStyle" :data="tableData">
+          <el-table-column type="selection" width="55"></el-table-column>
+          <el-table-column prop="messageModule" label="模块" width="200"></el-table-column>
+          <el-table-column prop="messageContent" label="消息内容" width="600"></el-table-column>
+          <el-table-column prop="messageTime" label="消息时间">
+          </el-table-column>
+          <el-table-column label="消息类型">
+            <template slot-scope="scope">
+       <i :class="iconClassMap[scope.row.messageType]?iconClassMap[scope.row.messageType]:'msg-icon el-icon-info info-color'"></i>
+      </template>
+            
+          </el-table-column>
+            <el-table-column type="expand">
+            <!-- <template slot-scope="props">
+              <el-form label-position="left" label-width="auto" inline class="demo-table-expand" v-if="props.row.ComponentCount && props.row.ComponentCount.length">
+                <el-form-item v-for="item in props.row.ComponentCount?props.row.ComponentCount:[]" :key="item.code" :label="`${item.name}:`">
+                  <span>{{ item.count }}</span>
+                </el-form-item>
+              </el-form>
+            </template> -->
+          </el-table-column>
+          <template slot="empty">
+            <div style="height: 60%;transform: translateY(50%);">
+              <i class="icon-wushuju iconfont"></i>
+              数据暂无
+            </div>
+          </template>
+        </el-table>
+      </div>
+      <div class=footer>
+        <el-pagination class="right">
+        </el-pagination>
+        <!-- <el-pagination
+          class="right"
+          v-show="tableData && tableData.length"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="page.pageNumber"
+          :page-sizes="page.pageSizes"
+          :page-size="page.pageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="page.total">
+        </el-pagination> -->
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import { messgeCount, messgeQuery, messgeUpdateState } from '@/api/msgsever'
+import Bus from '@/utils/bus.js'
+
+export default {
+  data() {
+    return {
+      tableData:[],
+      loading: false,
+      page: {
+        pageSize: 50,
+        pageSizes: [10, 20, 50, 100],
+        pageNumber: 1,
+        total: 0
+      },
+      headerStyle: {
+        backgroundColor: '#e1e4e5',
+        color: '#2b2b2b',
+        lineHeight: '30px'
+      }, // 列表样式
+      moduleMap: {//消息模块映射
+        "Model": "模型文件管理"
+      },
+      iconClassMap: { //消息类型图标映射
+        "Success": "msg-icon el-icon-success success-color",
+        "Error": "msg-icon el-icon-error error-color",
+        "Warning": "msg-icon el-icon-warning warning-color",
+        "Info": "msg-icon el-icon-info info-color",
+      }
+    }
+  },
+  computed: {
+    ...mapGetters('layout', ['userInfo', 'projectId', 'projects', 'userId'])
+  },
+  created() {
+
+  },
+  mounted() {
+    this.getMessageList()//获取消息列表
+    Bus.$on('messageListUpdate', message => {
+      this.getMessageList()
+    })
+  },
+  watch: {
+    projectId() {
+      this.page.pageNumber = 1
+      this.multipleSelection = []
+    }
+  },
+  methods: {
+    getMessageList(){//获取消息列表
+      let params = {
+        Filters: `UserId='${this.userId}'`,
+        Orders: "CreateTime desc, Id asc",
+        PageNumber: 1,
+        PageSize: 50
+      }
+      messgeQuery(params, res => {
+        this.messageList = res.Content
+        this.messageList.map((item)=>{
+          console.log(item,234232)
+          this.tableData.push({
+            messageModule: this.moduleMap[item.Module],// 模块
+            messageTime: item.CreateTime,// 时间
+            messageType: item.Type,// 类型
+            messageContent: item.Title,// title
+            messageButton: item.ButtonList?item.ButtonList.Name:''// 按钮
+          })
+        })
+      })
+    }
+  }
+};
+</script>
+
+<style scoped lang='less'>
+.box {
+  .condition {
+    padding: 10px;
+    display: flex;
+    height: 100%;
+    flex-direction: column;
+    border: 1px solid #dfe6ec;
+    background: #fff;
+    .main{
+      margin-top: 10px;
+    }
+  }
+}
+</style>
+
+<style>
+  .demo-table-expand {
+    font-size: 0;
+  }
+  .demo-table-expand label {
+    width: 90px;
+    color: #99a9bf;
+  }
+  .demo-table-expand .el-form-item {
+    margin-right: 0;
+    margin-bottom: 0;
+    margin-left: 120px;
+    width: 100%;
+  }
+    .success-color{
+    color: #67C23A;
+  }
+  .error-color{
+    color: #F56C6C;
+  }
+  .warning-color{
+    color: #E6A23C;
+  }
+  .info-color{
+    color: #909399;
+  }
+</style>

+ 14 - 0
src/router/system.js

@@ -1,4 +1,5 @@
 import LayoutMain from '@/framework/layout/Main'
+import MsgAllDetails from "@/framework/components/messagesever/msgAllDetails"
 
 import Login from '@/framework/layout/Login'
 import Dasboard from '@/views/dasboard'
@@ -87,7 +88,20 @@ export default [
     //{ path: '/login', name: 'Login', component: Login },
     { path: '/auth', name: 'auth', component: auth },
     { path: '/noUser', name: 'noUser', component: noUser },
+    // {
+    //     path: '/msgAllDetails',
+    //     name: 'LayoutMain',
+    //     component: MsgAllDetails,
+    // },
     // 业务空间数据导入工具
+    {
+        path: '/message',
+        name: 'LayoutMain',
+        component: LayoutMain,
+        children: [
+            { path: 'allDetails', name: "allDetails", component: MsgAllDetails, meta: { keepAlive: false, breadcrumbs: [{ label: '消息中心' }] } }
+        ]
+    },
     { path: '/dataUtil', name: 'dataUtil', component: LayoutMain, children: [{ path: 'index', component: dataUtil }] },
     // 平台管理
     {