From 389afb4843c3a1d09298035b765f3ea49e627ece Mon Sep 17 00:00:00 2001
From: caoyang <caoyang@syxysoft.com>
Date: Mon, 14 Mar 2022 09:49:30 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/documentManage/ocr/index.vue    | 97 ++++++++++++++-----
 .../documentManage/tags/dialog/areaManage.vue | 10 +-
 .../documentManage/tags/tabs/tabTable.vue     |  8 +-
 .../documentManage/tags/tabs/tagContent.vue   |  4 +-
 .../documentManage/tags/tabs/tagItem.vue      |  2 +-
 5 files changed, 89 insertions(+), 32 deletions(-)

diff --git a/jero-web/src/views/documentManage/ocr/index.vue b/jero-web/src/views/documentManage/ocr/index.vue
index d34a749d0..4dfc90aa7 100644
--- a/jero-web/src/views/documentManage/ocr/index.vue
+++ b/jero-web/src/views/documentManage/ocr/index.vue
@@ -85,14 +85,14 @@
 </template>
 
 <script>
-  import { axios } from '@/utils/request'
   import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
   import search from '@/components/search/index'
   import tableData from '@/components/ocrTable/index'
   import addForm from '@/components/ocrAddForm/index'
   import docTable from './modules/docTable'
   import ocrUpload from '@/components/ocrUpload/index'
-  import { ACCESS_TOKEN } from "@/store/mutation-types"
+  import store from '@/store/'
+  import { ACCESS_TOKEN } from '@/store/mutation-types'
   import Vue from 'vue'
   import eventBUs from '../../../common/event'
   export default {
@@ -163,6 +163,7 @@
       // this.loadData()
     },
     created() {
+      this.initWebSocket()
       // this.refresh()
     },
     watch:{
@@ -176,20 +177,68 @@
       // }
     },
     methods:{
-      // 定时刷新页面
-      refresh(){
-        const date = new Date(),
-          year = date.getFullYear(),
-          month = date.getMonth()+1,
-          myDate = date.getDate()
-        this.today = `${year}/${month < 10 ? '0'+month : month}/${myDate < 10 ? '0'+myDate : myDate}`
-        if(this.timer){
-          clearInterval(this.timer)
-        }else{
-          eventBUs.$emit('searchReset')
-          this.initSetTimeout(this.today)//调用每隔10秒刷新数据
+      initWebSocket: function () {
+        let token = Vue.ls.get(ACCESS_TOKEN)
+        console.log("------------WebSocket连接成功");
+        // WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
+        let userId = store.getters.userInfo.id;
+        let url = window._CONFIG['domianWebSocketURL'].replace("https://","wss://").replace("http://","ws://") + '/websocket/' + userId;
+        this.websock = new WebSocket(url);
+        this.websock.onopen = this.websocketOnopen;
+        this.websock.onerror = this.websocketOnerror;
+        this.websock.onmessage = this.websocketOnmessage;
+        this.websock.onclose = this.websocketOnclose;
+      },
+      websocketOnopen: function (e) {
+        console.log("WebSocket连接成功");
+        // console.log('eee',e)
+      },
+      websocketOnerror: function (e) {
+        console.log("WebSocket连接发生错误");
+        this.reconnect();
+      },
+      websocketOnmessage: function (e) {
+        console.log("WebSocket连接数据");
+
+      },
+      websocketOnclose: function (e) {
+        this.reconnect();
+      },
+      websocketSend(text) {
+        // 数据发送
+        try {
+          this.websock.send(text);
+        } catch (err) {
+          console.log("send failed (" + err.code + ")");
         }
       },
+      reconnect() {
+        let that = this;
+        if(that.lockReconnect) return;
+        that.lockReconnect = true;
+        //没连接上会一直重连，设置延迟避免请求过多
+        setTimeout(function () {
+          console.info("尝试重连...");
+          that.initWebSocket();
+          that.lockReconnect = false;
+        }, 5000);
+      },
+
+
+      // 定时刷新页面
+      // refresh(){
+      //   const date = new Date(),
+      //     year = date.getFullYear(),
+      //     month = date.getMonth()+1,
+      //     myDate = date.getDate()
+      //   this.today = `${year}/${month < 10 ? '0'+month : month}/${myDate < 10 ? '0'+myDate : myDate}`
+      //   if(this.timer){
+      //     clearInterval(this.timer)
+      //   }else{
+      //     eventBUs.$emit('searchReset')
+      //     this.initSetTimeout(this.today)//调用每隔10秒刷新数据
+      //   }
+      // },
       //上传
       handleUpload(){
         // if(this.timer){
@@ -346,15 +395,19 @@
         this.fileVisible = false
       },
       //10秒刷新页面
-      initSetTimeout(today) {//每隔10秒刷新数据，也就是每隔10秒向后台请求一次数据
-        this.timer=setInterval( () => {
-          eventBUs.$emit('searchReset')
-        }, 10000)
-      },
-    },
-    beforeDestroy(){
-      clearInterval(this.timer)
+      // initSetTimeout(today) {//每隔10秒刷新数据，也就是每隔10秒向后台请求一次数据
+      //   this.timer=setInterval( () => {
+      //     eventBUs.$emit('searchReset')
+      //   }, 10000)
+      // },
     },
+    // beforeDestroy(){
+    //   clearInterval(this.timer)
+    // },
+    destroyed() {
+      // 离开页面生命周期函数
+      this.websocketOnclose();
+    }
   }
 </script>
 
diff --git a/jero-web/src/views/documentManage/tags/dialog/areaManage.vue b/jero-web/src/views/documentManage/tags/dialog/areaManage.vue
index 24edb89be..279ebb8ea 100644
--- a/jero-web/src/views/documentManage/tags/dialog/areaManage.vue
+++ b/jero-web/src/views/documentManage/tags/dialog/areaManage.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="diolag-area">
     <div class="table-operator">
-      <div class="operator-text" @click="showModal">
+      <div class="operator-text" @click="showModal" v-has="'area:add'">
           <a-icon type="plus"  />
           {{$t('add')}}
       </div>
@@ -69,9 +69,8 @@
       @change="handleTableChange">
       <a slot="name" slot-scope="text">{{ text }}</a>
       <span slot="action" slot-scope="text, record">
-          <a @click="editArea(record.id)">{{$t('edit')}}</a>
-          <a-divider type="vertical" />
-          <a style="color:red" href="javascript:;" @click=" deleteArea(record.id)">{{$t('delete')}}</a>
+          <a class="action-edit" @click="editArea(record.id)" v-has="'area:edit'" >{{$t('edit')}}</a>
+          <a style="color:red" href="javascript:;" @click=" deleteArea(record.id)"  v-has="'area:delete'">{{$t('delete')}}</a>
       </span>
     </a-table>
     <div class="page" v-if="areaTable.length > 0">
@@ -323,6 +322,9 @@
   .diolag-area{
     .table-area{
       margin: 20px 0;
+      .action-edit{
+        margin-right: 10px;
+      }
     }
     .table-del{
       color: red;
diff --git a/jero-web/src/views/documentManage/tags/tabs/tabTable.vue b/jero-web/src/views/documentManage/tags/tabs/tabTable.vue
index 923a922aa..6adb06382 100644
--- a/jero-web/src/views/documentManage/tags/tabs/tabTable.vue
+++ b/jero-web/src/views/documentManage/tags/tabs/tabTable.vue
@@ -11,9 +11,8 @@
       :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
       @change="handleTableChange">
       <span slot="action" slot-scope="text, record">
-          <a @click="editVisible(record.id)" v-if="record.isReadOnly==0">{{$t('edit')}}</a>
-          <a-divider type="vertical" v-if="record.isReadOnly==0" />
-          <a class="table-del" v-if="record.isReadOnly==2||record.isReadOnly==0" @click="deleteVisible(record.id)">{{$t('delete')}}</a>
+          <a class="action-edit" @click="editVisible(record.id)" v-if="record.isReadOnly==0" v-has="'tag:edit'">{{$t('edit')}}</a>
+          <a class="table-del" v-if="record.isReadOnly==2||record.isReadOnly==0" @click="deleteVisible(record.id)" v-has="'tag:delete'">{{$t('delete')}}</a>
       </span>
     </a-table>
     <div class="page" v-if="tableData.length > 0">
@@ -91,6 +90,9 @@
 
 <style lang="less" scoped>
   .tab-table{
+    .action-edit{
+      margin-right: 10px;
+    }
     .table-del{
       color: red;
     }
diff --git a/jero-web/src/views/documentManage/tags/tabs/tagContent.vue b/jero-web/src/views/documentManage/tags/tabs/tagContent.vue
index 8ea10b1f3..ab807fc17 100644
--- a/jero-web/src/views/documentManage/tags/tabs/tagContent.vue
+++ b/jero-web/src/views/documentManage/tags/tabs/tagContent.vue
@@ -59,8 +59,8 @@
 
         <template slot="action" slot-scope="text, record">
           <a class="action-dict" @click="handleDicPop(record)">{{$t('DictionaryConfiguration')}}</a>
-          <a class="action-edit" @click="actionEdit(record)">{{$t('edit')}}</a>
-          <a class="action-delete" href="javascript:;" @click="onDelete(record)">{{$t('delete')}}</a>
+          <a class="action-edit" @click="actionEdit(record)" v-has="'dict:edit'">{{$t('edit')}}</a>
+          <a class="action-delete" href="javascript:;" @click="onDelete(record)"  v-has="'dict:logicDelete'">{{$t('delete')}}</a>
         </template>
       </a-table>
       <div class="page" v-if="tableData.length > 0">
diff --git a/jero-web/src/views/documentManage/tags/tabs/tagItem.vue b/jero-web/src/views/documentManage/tags/tabs/tagItem.vue
index 4b045e88e..4469f6beb 100644
--- a/jero-web/src/views/documentManage/tags/tabs/tagItem.vue
+++ b/jero-web/src/views/documentManage/tags/tabs/tagItem.vue
@@ -25,7 +25,7 @@
        </a-form>
      </div>
     <div class="table-operator">
-      <div class="operator-text" @click="handleAddPop">
+      <div class="operator-text" @click="handleAddPop" v-has="'tag:add'">
           <a-icon type="plus" />
           {{$t('add')}}
       </div>