Browse Source

合并分支并解决冲突

zhangyu 5 years ago
parent
commit
2020982368

+ 4 - 2
config/dev.env.js

@@ -5,7 +5,9 @@ const prodEnv = require('./prod.env')
 module.exports = merge(prodEnv, {
     NODE_ENV: '"development"',
     BASE_URL: '"http://192.168.20.215"', //测试iframe地址
-    SSO_SERVER: '"http://192.168.20.102:8080"' //(新)测试环境
+    SSO_SERVER: '"http://192.168.20.102:8080"', //(新)测试环境
+    MQTT_SERVICE: '"ws://192.168.20.225:61614/stomp"' //MQ测试环境地址
     // SSO_SERVER: '"http://sso.sagacloud.cn"',  //正式环境
-    // BASE_URL: '"http://mbi.sagacloud.cn"' //线上iframe地址
+    // BASE_URL: '"http://mbi.sagacloud.cn"', //线上iframe地址
+    // MQTT_SERVICE: '""' //MQ正式环境地址
 })

+ 4 - 2
config/prod.env.js

@@ -2,7 +2,9 @@
 module.exports = {
     NODE_ENV: '"production"',
     BASE_URL: '"http://192.168.20.215"', //测试iframe地址
-    SSO_SERVER: '"http://192.168.20.102:8080"' //(新)测试环境
+    SSO_SERVER: '"http://192.168.20.102:8080"', //(新)测试环境
+    MQTT_SERVICE: '"ws://192.168.20.225:61614/stomp"' //MQ测试环境地址
     // BASE_URL: '"http://mbi.sagacloud.cn"', //线上iframe地址
-    // SSO_SERVER: '"http://sso.sagacloud.cn"'  //正式环境
+    // SSO_SERVER: '"http://sso.sagacloud.cn"',  //正式环境
+    // MQTT_SERVICE: '""' //MQ正式环境地址
 }

+ 1 - 0
package.json

@@ -59,6 +59,7 @@
         "sass-loader": "^7.1.0",
         "semver": "^5.3.0",
         "shelljs": "^0.7.6",
+        "stompjs": "^2.3.3",
         "swiper": "^4.0.0",
         "uglifyjs-webpack-plugin": "^1.1.1",
         "url-loader": "^0.5.8",

+ 1 - 1
src/assets/scss/point/point_config/reset.scss

@@ -365,7 +365,7 @@ button,
 input,
 select,
 textarea {
-    font-family: tahoma, Helvetica, Arial, "\5FAE\8F6F\96C5\9ED1";
+    font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif, "\5FAE\8F6F\96C5\9ED1";
     *font-family: "\5FAE\8F6F\96C5\9ED1";
 }
 

+ 6 - 0
src/assets/style/style.scss

@@ -1,3 +1,9 @@
+body{
+    /deep/ .el-notification.right{
+        text-align: left;
+    }
+}
+
 .icon-wushuju {
     display: block;
     width: 100px;

+ 161 - 0
src/framework/components/messagesever/index.vue

@@ -0,0 +1,161 @@
+<!--
+ * @Author: zhangyu
+ * @Date: 2019-08-26 15:22:13
+ * @Info: 
+ * @LastEditTime: 2019-09-05 17:57:15
+ -->
+<template>
+  <div class="notification-box" @click="handleClickRead">
+    <el-badge :value="unreadNum" :hidden="!unreadNum" :max="99">
+      <i class="el-icon-message-solid"></i>
+    </el-badge>
+    <!-- <el-button type="primary" @click="handleClickConnectMQ">连接MQ</el-button>
+    <el-button type="primary" @click="handleClickDisconnectMQ">断开MQ</el-button>
+    <el-button type="primary" @click="handleClickUnsubscribe">停止接收消息</el-button><br><br>
+    <el-input type="textarea" :autosize="{ minRows: 6, maxRows: 6}" v-model="sendMessage" placeholder="请输入要发送的内容"></el-input>
+    <br><br>
+    <el-button type="primary" @click="handleClickSendMessage">发送消息</el-button>
+    <el-card style="margin-top:20px;text-align:left;">
+      <div slot="header" class="clearfix">
+        <span>消息历史</span>
+      </div>
+      <div v-for="(message, index) in messageList" :key="index" class="text item">
+        {{ message }}
+      </div>
+    </el-card> -->
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex'
+import Stomp from 'stompjs'
+import Msmq from './msmq'
+import { MQTT_SERVICE, MQTT_USERNAME, MQTT_PASSWORD } from './mqSetting'
+
+export default {
+  data() {
+    return {
+      client: Stomp.client(MQTT_SERVICE),
+      unreadNum: 0,
+      sendMessage: '',
+      messageList: [], // 历史消息
+      subList: [], // 订阅的消息实例
+      topics: ["/topic/datacenter.broadcast","/topic/dataPlatform.broadcast"] // 订阅的消息名称
+    }
+  },
+  created () {
+    this.connect()
+    // let url = "ws://192.168.20.225:61614/stomp";
+    // let login = "admin";
+    // let passcode = "admin";
+    // let destination = "/topic/datacenter.broadcast";
+    // let client = Stomp.client(url)
+    // console.log('钩子:',client)
+    // var onconnect = function(frame) {
+    //   client.subscribe(destination, function(message) {
+    //     console.log(message.body);
+    //     alert(message.body);        
+    //   });
+    // };
+    // client.connect(login, passcode, onconnect)
+  },
+  computed: {
+    ...mapGetters('layout', ['userInfo', 'projectId', 'projects'])
+  },
+  methods:{
+    connect() {
+      this.client = Stomp.client(MQTT_SERVICE)
+      this.client.reconnect_delay = 5000
+      var clientid = `sagaMQ-${this.userInfo.username}`
+      var headers = {
+        'login': MQTT_USERNAME,
+        'passcode': MQTT_PASSWORD,
+        'client-id': clientid
+      }
+      this.client.connect(headers, this.onConnected, this.onFailed)
+    },
+    onConnected(frame) {
+      console.log('Connected: ' + frame)
+      //订阅多个消息
+      this.topics.forEach(item => {
+        let sub = this.client.subscribe(item, this.onmessage, this.onFailed)
+        this.subList.push(sub)
+      })
+      // this.client.subscribe(topic, this.onmessage, this.onFailed) 
+    },
+    //接收到消息的回调
+    onmessage(message) {
+      let json
+      try {
+        json = JSON.parse(message.body)
+      } catch (err) {
+        this.$message.error('数据格式错误!')
+      }
+      this.unreadNum = Msmq.handleMsg(json, this.projects, this.unreadNum);
+      // this.unreadNum++
+      // this.$notify.info({ title: '消息',dangerouslyUseHTMLString: true, message: `项目编号:${json.projectId}<br>消息类型:${json.type}<br>描述信息:${json.description}<br>` });
+      // this.messageList.push(json)
+      
+    },
+    // 接收消息失败回调
+    onFailed(frame) {
+      console.log('Failed: ' + frame)
+    },
+    //停止接收消息
+    unsubscribe() {
+      this.subList.forEach((item) => {
+        item.unsubscribe()
+      })
+    },
+    //断开连接
+    disconnect() {
+      this.client.disconnect(function() {
+        console.log("连接已断开!");
+      })
+    },
+    //发送消息
+    send(destination, message, headers = {}) {
+      this.client.send(destination, headers, JSON.stringify(message))
+    },
+    
+    handleClickConnectMQ() {
+      this.connect()
+    },
+    handleClickDisconnectMQ() {
+      this.disconnect()
+    },
+    handleClickUnsubscribe() {
+      this.unsubscribe()
+    },
+    handleClickSendMessage() {
+      this.send('/topic/datacenter.broadcast',this.sendMessage)
+    }, 
+    handleClickRead() {
+      this.unreadNum = 0;
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .notification-box{
+    width: 100%;
+    height: 100%;
+    padding: 16px 10px 10px;
+    box-sizing: border-box;
+    color: #79869a;
+    cursor: pointer;
+    .el-icon-message-solid{
+      font-size: 22px;
+    }
+    /deep/ .el-badge__content{
+      height: 16px;
+      line-height: 16px;
+      border: 1px solid transparent;
+    }
+  }
+  .notification-box:hover{
+    color: #d3d8e2;
+    background-color: #3f4f62;
+  }
+</style>

+ 9 - 0
src/framework/components/messagesever/mqSetting.js

@@ -0,0 +1,9 @@
+/*
+ * @Author: zhangyu
+ * @Date: 2019-08-26 16:03:46
+ * @Info: 
+ * @LastEditTime: 2019-09-05 14:46:30
+ */
+export const MQTT_SERVICE = process.env.MQTT_SERVICE // mq服务地址
+export const MQTT_USERNAME = 'admin' // mq连接用户名
+export const MQTT_PASSWORD = 'admin' // mq连接密码

+ 15 - 0
src/framework/components/messagesever/msmq.js

@@ -0,0 +1,15 @@
+import { Notification } from 'element-ui';
+import Bus from '@/utils/bus.js'
+
+const MSMQ = {
+  handleMsg (data, projects, unreadNum ) {
+    if(projects.some((item) => {return item.id == data.projectId})) { //判断消息是否是当前用户拥有的项目
+      unreadNum++
+      Bus.$emit('modelStatusChange', data)
+      Notification.info({ title: '消息',dangerouslyUseHTMLString: true, message: `项目编号:${data.projectId}<br>消息类型:${data.type}<br>描述信息:${data.description}<br>` })
+      return unreadNum
+    }
+  }
+}
+
+export default MSMQ

+ 9 - 1
src/framework/layout/PageHeader.vue

@@ -26,12 +26,18 @@
                     <el-dropdown-item icon='el-icon-circle-plus'>修改密码</el-dropdown-item>
                 </el-dropdown-menu>
             </el-dropdown>
+            <ul class="header-nav">
+                <li class="header-nav-notification">
+                    <message-sever></message-sever>
+                </li>
+            </ul>
         </div>
     </div>
 </template>
 <script>
 import frameworkApi from '@/api/framework'
 import { mapGetters, mapMutations } from 'vuex'
+import MessageSever from '../components/messagesever/index'
 export default {
     name: 'PageHeader',
     props: [],
@@ -77,6 +83,8 @@ export default {
         }
     },
     mounted() {},
-    components: {}
+    components: {
+        MessageSever
+    }
 }
 </script>

+ 10 - 0
src/framework/style/layout.scss

@@ -114,6 +114,16 @@ body {
         height: 100%;
         display: inline-flex;
         flex-direction: row-reverse;
+        .header-nav{
+            margin-right: 10px;
+            >li{
+                float: left;
+                width: 50px;
+                height: 50px;
+                padding: 0 4px;
+                box-sizing: border-box;
+            }
+        }
         .user-menu-dropdown {
             height: 100%;
             line-height: $pageHeaderHeight;

+ 2 - 0
src/utils/bus.js

@@ -0,0 +1,2 @@
+import Vue from 'vue'
+export default new Vue

+ 37 - 31
src/views/model/file/index.vue

@@ -71,6 +71,7 @@
 <script>
 import { mapGetters } from "vuex";
 import request from "@/api/model/file.js";
+import Bus from '@/utils/bus.js'
 import dasBoard from "@/views/dasboard/index";
 import modelLog from "@/components/model/file/modelLog"; //模型日志弹窗
 import repliceModel from "@/components/model/file/replaceModelDialog"; //替换模型弹窗
@@ -227,40 +228,42 @@ export default {
      * @param currentFolderId 当前选择的文件夹id
      */
     queryFloorFile(currentFolderId) {
-      let data = {
-        FolderId: currentFolderId,
-        ProjectId: this.projectId
-      };
-      return new Promise((resolve, reject) => {
-        request.queryFloorList(data, res => {
-          res.Content.map(item => {
-            /**
-             * @info: 状态显示说明
-             * 0: 上传中(上传的用户可操作:中止)
-             * 1: 等待检查
-             * 10: 模型检查中
-             * 11: 未通过检查
-             * 2、20、21、3、31: 正常(所有用户可操作:下载、查看历史)
-             * 4: 正常(所有用户可操作:下载、替换、查看历史)
-             */
-            if (item.Status == 2 || item.Status == 20 || item.Status == 21 || item.Status == 3 || item.Status == 31 || item.Status == 4) {
-              Object.assign(item, { isDown: false, precent: 0 });
-            } else {
-              Object.assign(item, { isDown: true, precent: 100 });
-              if (this.persentList.length != 0) {
-                this.persentList.forEach(pItem => {
-                  if (item.Id == pItem.Id) {
-                    Object.assign(item, { isDown: true, precent: pItem.precent ? pItem.precent : 0 });
-                  }
-                });
+      if(currentFolderId){
+        let data = {
+          FolderId: currentFolderId,
+          ProjectId: this.projectId
+        };
+        return new Promise((resolve, reject) => {
+          request.queryFloorList(data, res => {
+            res.Content.map(item => {
+              /**
+               * @info: 状态显示说明
+               * 0: 上传中(上传的用户可操作:中止)
+               * 1: 等待检查
+               * 10: 模型检查中
+               * 11: 未通过检查
+               * 2、20、21、3、31: 正常(所有用户可操作:下载、查看历史)
+               * 4: 正常(所有用户可操作:下载、替换、查看历史)
+               */
+              if (item.Status == 2 || item.Status == 20 || item.Status == 21 || item.Status == 3 || item.Status == 31 || item.Status == 4) {
+                Object.assign(item, { isDown: false, precent: 0 });
+              } else {
+                Object.assign(item, { isDown: true, precent: 100 });
+                if (this.persentList.length != 0) {
+                  this.persentList.forEach(pItem => {
+                    if (item.Id == pItem.Id) {
+                      Object.assign(item, { isDown: true, precent: pItem.precent ? pItem.precent : 0 });
+                    }
+                  });
+                }
               }
-            }
+            });
+            this.tableData = res.Content;
+            this.loading = false;
+            resolve();
           });
-          this.tableData = res.Content;
-          this.loading = false;
-          resolve();
         });
-      });
+      }
     },
     //添加楼层文件
     addFloorFile() {
@@ -523,6 +526,9 @@ export default {
   },
   mounted() {
     this.queryModel();
+    Bus.$on('modelStatusChange', message => {
+      this.queryFloorFile(this.currentFolderId);
+    })
     // 十秒刷新次楼层列表
     // setInterval(()=>{
     //    this.queryFloorFile(this.currentFolderId)