From b3d70503ac2fc009aeb5cd8327b7049cc32daf0d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A5=A5=E5=BE=B7=E5=BD=AA=E6=9C=AC=E5=BD=AA=5C92525?=
 <jin980303>
Date: Sun, 15 Sep 2024 18:42:26 +0800
Subject: [PATCH] no message

---
 src/App.vue                          |  58 +++++++++++-
 src/api/stock.js                     |   6 +-
 src/views/databigscreen/DeptData.vue | 134 ++++++++++++++-------------
 3 files changed, 127 insertions(+), 71 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index bcf47c6..cdf7ef0 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,10 +1,64 @@
 <template>
   <div id="app">
-    <router-view />
+    <router-view/>
   </div>
 </template>
 <script>
+import stockUrl from '@/api/stock'
+
 export default {
-  name: 'App'
+  name: 'App',
+  data() {
+    return {
+      msg: '',
+      websock: null
+    }
+  },
+  mounted() {
+    stockUrl.stockMsg(null)
+    this.initWebSocket()
+  },
+  methods: {
+    initWebSocket() {
+      const wsUri = (process.env.VUE_APP_WS_API === '/' ? '/' : (process.env.VUE_APP_WS_API + '/')) + 'webSocket/stock'
+      this.websock = new WebSocket(wsUri)
+      this.websock.onerror = this.webSocketOnError
+      this.websock.onmessage = this.webSocketOnMessage
+    },
+    webSocketOnError(e) {
+      this.$notify({
+        title: 'WebSocket连接发生错误',
+        type: 'error',
+        duration: 0
+      })
+    }, webSocketOnMessage(e) {
+      const data = JSON.parse(e.data)
+      if (data.msgType === 'INFO') {
+        this.msg = data.msg
+        if (this.msg) {
+          this.$notify({
+            title: '消息通知',
+            message: data.msg,
+            dangerouslyUseHTMLString: true,
+            type: 'success',
+            offset: 50,
+            duration: 0
+          })
+        }
+
+      } else if (data.msgType === 'ERROR') {
+        this.$notify({
+          title: '',
+          message: data.msg,
+          dangerouslyUseHTMLString: true,
+          type: 'error',
+          duration: 0
+        })
+      }
+    },
+    webSocketSend(agentData) {
+      this.websock.send(agentData)
+    }
+  }
 }
 </script>
diff --git a/src/api/stock.js b/src/api/stock.js
index 8ef40c3..f79168e 100644
--- a/src/api/stock.js
+++ b/src/api/stock.js
@@ -80,11 +80,11 @@ export function getItemCode(stockCode) {
   })
 }
 
-export function stockMsg(data) {
+export function stockMsg(msg) {
   return request({
     url: 'api/stock/stockMsg',
-    method: 'post',
-    data
+    method: 'get',
+    params:{msg}
   })
 }
 
diff --git a/src/views/databigscreen/DeptData.vue b/src/views/databigscreen/DeptData.vue
index 2f1f776..75ec3b7 100644
--- a/src/views/databigscreen/DeptData.vue
+++ b/src/views/databigscreen/DeptData.vue
@@ -12,14 +12,14 @@
         <div style="display: flex; align-items: center;">
 
 
-          <img :src="imageUrl" style="weight: 16px;height: 16px;"  v-if="msg">
+          <img :src="imageUrl" style="weight: 16px;height: 16px;" v-if="msg">
           <div style="flex-grow: 1; overflow: hidden;">
             <vue-marquee
-                :speed="10"
-                :delayTime="500"
-                :mouseover="true"
-                color="red"
-                direction="left"
+              :speed="10"
+              :delayTime="500"
+              :mouseover="true"
+              color="red"
+              direction="left"
             >
 
               <span style="font-size: 18px;font-weight: bold">{{ msg }}</span>
@@ -56,8 +56,9 @@
           </div>
 
           <dv-scroll-board
-              :config="this.config2"
-              style="width: 365px; height: 280px;margin-left:10px;"/>
+            :config="this.config2"
+            style="width: 365px; height: 280px;margin-left:10px;"
+          />
         </dv-border-box-8>
 
       </div>
@@ -70,12 +71,13 @@
 
       <div class="div5">
         <el-pagination
-            background
-            layout="prev, pager, next"
-            @current-change="handleCurrentClick"
-            :current-page="currentPage"
-            :page-size="pageSize"
-            :total="total">
+          background
+          layout="prev, pager, next"
+          @current-change="handleCurrentClick"
+          :current-page="currentPage"
+          :page-size="pageSize"
+          :total="total"
+        >
         </el-pagination>
       </div>
     </dv-border-box-11>
@@ -84,14 +86,14 @@
 </template>
 
 <script>
-import * as echarts from 'echarts';
-import moment from "moment";
-import crudPoint from "@/api/point";
-import crudAgvTask from "@/api/agvTask"
-import CRUD from "@crud/crud";
-import 'echarts-gl';
-import VueMarquee from 'aring-vue-marquee';
-import stockUrl from "@/api/stock";
+import * as echarts from 'echarts'
+import moment from 'moment'
+import crudPoint from '@/api/point'
+import crudAgvTask from '@/api/agvTask'
+import CRUD from '@crud/crud'
+import 'echarts-gl'
+import VueMarquee from 'aring-vue-marquee'
+import stockUrl from '@/api/stock'
 
 export default {
   name: 'DeptData',
@@ -101,7 +103,8 @@ export default {
   data() {
     return {
       msg: '',
-      imageUrl: require("@/assets/images/igw-l-news-noticewhite.png"),
+      websock: null,
+      imageUrl: require('@/assets/images/igw-l-news-noticewhite.png'),
       total: 0,
       pageSize: 25,
       currentPage: 1,
@@ -132,7 +135,7 @@ export default {
           {
             name: '西峡',
             value: 98
-          },
+          }
         ]
       },
       config2: {
@@ -145,7 +148,7 @@ export default {
         carousel: 'page',
         rowNum: 8,
         indexHeader: '序号'
-      },
+      }
     }
   },
   computed: {
@@ -157,36 +160,39 @@ export default {
   //销毁前关闭计时器
   beforeDestroy() {
     this.clearTimer()
+    if (this.websock && this.websock.readyState === WebSocket.OPEN) {
+      this.websock.close()
+    }
   },
   mounted() {
     //初始化
-    setInterval(this.updateTime, 1000);//自动读秒
+    setInterval(this.updateTime, 1000)//自动读秒
     this.getInit()//树状图
-    this.queryAgvTaskInfo();//AGV任务列表
+    this.queryAgvTaskInfo()//AGV任务列表
     this.queryListInfo(this.currentPage, this.pageSize)//库位图
-    this.intervalId = setInterval(this.printNextItem, 5000);//定时分页调用
-    this.stockMsg();
-    this.initWebSocket();
+    this.intervalId = setInterval(this.printNextItem, 5000)//定时分页调用
+    stockUrl.stockMsg(null)
+    this.initWebSocket()
   },
   methods: {
     updateTime() {
-      this.currentTime = moment().format('YYYY-MM-DD HH:mm:ss');
+      this.currentTime = moment().format('YYYY-MM-DD HH:mm:ss')
       let weekMap = {
-        1: "一",
-        2: "二",
+        1: '一',
+        2: '二',
         3: '三',
-        4: "四",
-        5: "五",
-        6: "六",
-        0: "日",
-      };
-      this.dayOfWeek = weekMap[moment().day()];
+        4: '四',
+        5: '五',
+        6: '六',
+        0: '日'
+      }
+      this.dayOfWeek = weekMap[moment().day()]
     },
     //界面显示
     getInit() {
-      var chartDom = document.getElementById("main")
-      var myChart = echarts.init(chartDom);
-      var option;
+      var chartDom = document.getElementById('main')
+      var myChart = echarts.init(chartDom)
+      var option
       option = {
         xAxis: {
           type: 'category',
@@ -207,30 +213,30 @@ export default {
             type: 'bar',
             itemStyle: {
               color: '#4675C0'
-            },
+            }
 
           }
         ]
-      };
-      option && myChart.setOption(option);
+      }
+      option && myChart.setOption(option)
     },
     //任务列表
     queryAgvTaskInfo() {
       crudAgvTask.queryAgvTaskInfo().then(res => {
         const cf = this.config2
         cf.data = res.data
-        this.config2 = null;
+        this.config2 = null
         setTimeout(() => {
           this.config2 = cf
         }, 500)
 
       }).catch(() => {
-        this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR);
+        this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR)
       })
     },
     //库位图
     queryListInfo(currentPage, pageSize) {
-      const CurrentPage = {currentPage: currentPage, pageSize: pageSize}
+      const CurrentPage = { currentPage: currentPage, pageSize: pageSize }
       crudPoint.queryPointInfo(CurrentPage).then(res => {
         this.total = Number(res.data.total)
         this.divs = res.data.data
@@ -239,7 +245,7 @@ export default {
           this.collection.push(i)
         }
       }).catch(() => {
-        this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR);
+        this.crud.notify('数据加载失败！', CRUD.NOTIFICATION_TYPE.ERROR)
       })
 
     },
@@ -247,12 +253,12 @@ export default {
 
       if (this.total > 0 && this.collection.length > 0) {
         if (this.currentIndex < this.collection.length - 1) {
-          this.currentIndex++;
-          this.queryListInfo(this.collection[this.currentIndex], this.pageSize);
+          this.currentIndex++
+          this.queryListInfo(this.collection[this.currentIndex], this.pageSize)
           this.handleCurrentChange(this.collection[this.currentIndex])
         } else {
-          this.currentIndex = 0; // 循环到集合的末尾时，重新开始
-          this.queryListInfo(this.collection[this.currentIndex], this.pageSize);
+          this.currentIndex = 0 // 循环到集合的末尾时，重新开始
+          this.queryListInfo(this.collection[this.currentIndex], this.pageSize)
           this.handleCurrentChange(this.collection[this.currentIndex])
         }
       }
@@ -260,25 +266,25 @@ export default {
     },
     autoGrid(total, page) {
       //手动生成库位图
-      const start = ((page - 1) * this.pageSize) + 1;
-      const end = start + this.pageSize;//个数
-      this.divs = [];
+      const start = ((page - 1) * this.pageSize) + 1
+      const end = start + this.pageSize//个数
+      this.divs = []
       for (let i = start; i <= end; i++) {
-        const newItem = `Item ${+i}`;
-        this.$set(this.divs, this.divs.length, newItem);
+        const newItem = `Item ${+i}`
+        this.$set(this.divs, this.divs.length, newItem)
       }
 
     },
     handleCurrentChange(newPage) {
-      this.currentPage = newPage;
+      this.currentPage = newPage
     },
     handleCurrentClick(newPage) {
       this.queryListInfo(newPage, this.pageSize)
     },
     clearTimer() {
       if (this.intervalId) {
-        clearInterval(this.intervalId);
-        this.intervalId = null;
+        clearInterval(this.intervalId)
+        this.intervalId = null
       }
     },
     initWebSocket() {
@@ -299,7 +305,7 @@ export default {
         this.msg = data.msg
       } else if (data.msgType === 'ERROR') {
         this.$notify({
-          title: '',
+          title: '消息通知',
           message: data.msg,
           dangerouslyUseHTMLString: true,
           type: 'error',
@@ -309,14 +315,10 @@ export default {
     },
     webSocketSend(agentData) {
       this.websock.send(agentData)
-    },
-    stockMsg() {
-      stockUrl.stockMsg()
     }
 
   }
 
-
 }
 </script>