.env.dev

@@ -1,7 +1,7 @@
 ###
  # @Author: Do not edit
  # @Date: 2023-08-29 09:40:39
- # @LastEditTime: 2024-01-04 15:50:26
+ # @LastEditTime: 2023-12-29 08:57:36
  # @LastEditors: zhp
  # @Description:
 ###
@@ -13,8 +13,7 @@ VUE_APP_TITLE = MES系统
 
 # 芋道管理系统/开发环境
 # VUE_APP_BASE_API = 'http://100.64.0.26:48082'
-# VUE_APP_BASE_API = 'http://10.70.2.2:8080'
+VUE_APP_BASE_API = 'http://192.168.0.33:48082'
-# VUE_APP_BASE_API = 'http://192.168.0.33:48082'
 # VUE_APP_BASE_API = 'http://192.168.4.173:48080'
 # VUE_APP_BASE_API = 'http://192.168.2.173:48080'
 # VUE_APP_BASE_API = 'http://192.168.1.49:48082'
@@ -22,14 +21,10 @@ VUE_APP_TITLE = MES系统
 # VUE_APP_BASE_API = 'http://192.168.4.159:48080'
 # VUE_APP_BASE_API = 'http://192.168.1.104:48082'
 # VUE_APP_BASE_API = 'http://192.168.1.62:48082'
-VUE_APP_BASE_API = 'http://192.168.1.78:48082'
+# VUE_APP_BASE_API = 'http://192.168.1.78:48082'
-# socket地址
-VUE_APP_Socket_API = 'ws://192.168.0.33:48082'
 
-
-# VUE_APP_BASE_API = 'http://100.64.0.23:48082'
 # 积木报表指向地址
-VUE_APP_JIMU_API = 'http://10.70.2.22:8080'
+VUE_APP_JIMU_API = 'http://192.168.0.33:48082'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

.env.prod

@@ -15,11 +15,11 @@ VUE_APP_TITLE = MES系统
 VUE_APP_BASE_API = '/prod-api'
 
 # 积木报表指向地址
-VUE_APP_JIMU_API = 'http://10.70.2.2:8080'
+VUE_APP_JIMU_API = 'http://10.70.2.22:8080'
 
 
 # 根据服务器或域名修改
-PUBLIC_PATH = ''
+PUBLIC_PATH = 'http://10.70.2.32'
 
 # 二级部署路径
 # VUE_APP_APP_NAME ='yudao-admin'

.env.stage

@@ -12,7 +12,7 @@ VUE_APP_JIMU_API = 'http://192.168.0.33:48082'
 
 
 # 根据服务器或域名修改
-PUBLIC_PATH = ''
+PUBLIC_PATH = 'http://192.168.0.33:8889/'
 
 # 二级部署路径
 # VUE_APP_APP_NAME ='yudao-admin'

package.json

@@ -43,7 +43,6 @@
   "dependencies": {
     "@antv/x6": "^2.15.3",
     "@babel/parser": "7.18.4",
-    "@jiaminghi/data-view": "^2.10.0",
     "@riophae/vue-treeselect": "0.4.0",
     "axios": "0.27.2",
     "benz-amr-recorder": "^1.1.5",
@@ -81,7 +80,6 @@
     "vue-plugin-hiprint": "0.0.54-fix",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "3.4.9",
-    "vue-seamless-scroll": "^1.1.23",
     "vue-video-player": "^5.0.2",
     "vuedraggable": "2.24.3",
     "vuex": "3.6.2",

src/layout/components/TagsView/index.vue

@@ -48,7 +48,6 @@
 <script>
 import ScrollPane from './ScrollPane';
 import path from 'path';
-import { getDcsMsg, closeDcsMsg } from "@/websocket/wsInterface"
 
 export default {
 	components: { ScrollPane },
@@ -59,7 +58,6 @@ export default {
 			left: 0,
 			selectedTag: {},
 			affixTags: [],
-			wsIsOpen: false
 		};
 	},
 	computed: {
@@ -85,27 +83,6 @@ export default {
 				document.body.removeEventListener('click', this.closeMenu);
 			}
 		},
-		visitedViews(newVal, oldVal){
-			let num = 0
-			newVal && newVal.map(item => {
-				if (item.path === '/databoard/kiln' || item.path === '/databoard/whole-plant' || item.path === '/databoard/deep-processing') {
-					num++
-				}
-			})
-			if (num > 0) {
-				if(!this.wsIsOpen) {
-					getDcsMsg()
-					this.wsIsOpen = true
-					console.log('开启websocket==========')
-				}
-			}else{
-				if (this.wsIsOpen) {
-					closeDcsMsg()
-					this.wsIsOpen = false
-					console.log('关闭============')
-				}
-			}
-		}
 	},
 	mounted() {
 		this.initTags();

src/main.js

@@ -9,7 +9,6 @@ import store from './store';
 import router from './router';
 import directive from './directive'; // directive
 import plugins from './plugins'; // plugins
-// import { borderBox1 } from '@jiaminghi/data-view'
 
 import './assets/icons'; // icon
 import './permission'; // permission control
@@ -79,10 +78,8 @@ Vue.use(CodeBrickZj)
 Vue.use(directive);
 Vue.use(plugins);
 Vue.use(VueMeta);
-// Vue.use(dataV)
 // Vue.use(hljs.vuePlugin);
-import scroll from 'vue-seamless-scroll'
+
-Vue.use(scroll)
 // bpmnProcessDesigner 需要引入
 import MyPD from '@/components/bpmnProcessDesigner/package/index.js';
 Vue.use(MyPD);

src/store/modules/websocket.js

@@ -1,30 +1,10 @@
 const state = {
   fanFrequencyInfo:{},// 分机运行频率
   kilnInfo:{},// 窑炉信息
-  gasInfo:{},// 天然气流量图
+  gasInfo:{},// 天然气
-  sumGasInfo: {},// 天然气总量
 
-  israKiln:[],// ISRA窑炉缺陷检测
+  israKiln:[],// ISRA缺陷检测
-  material:[],// 原料
+  material:[]// 原料
-  energyInfo: {
-    elecQty1: '',
-    elecQty2: '',
-    waterQty: ''
-  }, // 能耗
-  energyWeekTrend:[],
-  energyMonthTrend:[],
-  energyYearTrend:[],// 能耗图
-  energyMonitoring: [], // 能源监控
-  exhaustGasInfo:{}, // 烟气
-  gasChartDayTrend:{}, // 烟气
-  gasChartWeekTrend:{}, // 烟气
-  gasChartMonthTrend:{}, // 烟气
-  gasChartYearTrend:{}, // 烟气
-  israDayStatistic: [],//缺陷统计
-  israWeekStatistic: [],//缺陷统计
-  israMonthStatistic: [],//缺陷统计
-  israYearStatistic: [],//缺陷统计
-  productline: [] // 产线产量及良品率
 };
 const mutations = {
   SET_FANFREQUENCYINFO: (state, fanFrequencyInfo) => {
@@ -36,9 +16,6 @@ const mutations = {
   SET_GASINFO: (state, gasInfo) => {
     state.gasInfo = gasInfo
   },
-  SET_SUMGASINFO: (state, sumGasInfo) => {
-    state.sumGasInfo = sumGasInfo
-  },
 
 
   SET_ISRAKILN: (state, israKiln) => {
@@ -46,46 +23,6 @@ const mutations = {
   },
   SET_MATERIAL: (state, material) => {
     state.material = material
-  },
-  SET_ENERGYINFO: (state, energyInfo) => {
-    if (Object.keys(energyInfo).length > 1) {
-      state.energyInfo.elecQty1 = energyInfo.elecQty1
-      state.energyInfo.elecQty2 = energyInfo.elecQty2
-    } else {
-      state.energyInfo.waterQty = energyInfo.waterQty
-    }
-  },
-  SET_ENERGYTREND: (state, energyTrend) => {
-    if (energyTrend.week.length > 0) {
-      state.energyWeekTrend = energyTrend.week
-    }
-    if (energyTrend.month.length > 0) {
-      state.energyMonthTrend = energyTrend.month
-    }
-    if (energyTrend.year.length > 0) {
-      state.energyYearTrend = energyTrend.year
-    }
-  },
-  SET_ENERGY_MONITORING: (state, energyMonitoring) => {
-    state.energyMonitoring = energyMonitoring
-  },
-  SET_EXHAUSTGASINFO: (state, exhaustGasInfo) => {
-    state.exhaustGasInfo = exhaustGasInfo
-  },
-  SET_EXHAUSTGASCHART: (state, exhaustGasChart) => {
-    state.gasChartDayTrend = exhaustGasChart.gasChartDayTrend
-    state.gasChartWeekTrend = exhaustGasChart.gasChartWeekTrend
-    state.gasChartMonthTrend = exhaustGasChart.gasChartMonthTrend
-    state.gasChartYearTrend = exhaustGasChart.gasChartYearTrend
-  },
-  SET_DEFECTCHART: (state, israStatistic) => {
-    state.israDayStatistic = israStatistic.dayStatistic
-    state.israWeekStatistic = israStatistic.weekStatistic
-    state.israMonthStatistic = israStatistic.monthStatistic
-    state.israYearStatistic = israStatistic.yearStatistic
-  },
-  SET_PRODUCTLINE: (state, productline) => {
-    state.productline = productline
   }
 };
 const actions = {
@@ -98,9 +35,6 @@ const actions = {
   setGasInfo({ commit }, gasInfo) {
     commit('SET_GASINFO', gasInfo.payload)
   },
-  setSumGasInfo({ commit }, sumGasInfo) {
-    commit('SET_SUMGASINFO', sumGasInfo.payload)
-  },
 
 
   setIsraKiln({ commit }, israKiln) {
@@ -109,27 +43,6 @@ const actions = {
   setMaterial({ commit }, material) {
     commit('SET_MATERIAL', material.payload)
   },
-  setEnergyInfo({ commit }, energyInfo) {
-    commit('SET_ENERGYINFO', energyInfo.payload)
-  },
-  setEnergyTrend({ commit }, energyTrend) {
-    commit('SET_ENERGYTREND', energyTrend.payload)
-  },
-  setEnergyMonitoring({ commit }, energyMonitoring) {
-    commit('SET_ENERGY_MONITORING', energyMonitoring.payload)
-  },
-  setExhaustGasInfo({ commit }, exhaustGasInfo) {
-    commit('SET_EXHAUSTGASINFO', exhaustGasInfo.payload)
-  },
-  setExhaustGasChart({ commit }, exhaustGasChart) {
-    commit('SET_EXHAUSTGASCHART', exhaustGasChart.payload)
-  },
-  setDefectChart({ commit }, israStatistic) {
-    commit('SET_DEFECTCHART', israStatistic.payload)
-  },
-  setProductline({ commit }, productline) {
-    commit('SET_PRODUCTLINE', productline.payload)
-  },
 };
 export default {
   namespaced: true,

src/views/OperationalOverview/AGVBoard.vue

@@ -12,7 +12,7 @@
       lineHeight: 88 + 'px',
       fontSize: 31 + 'px'
     }">
-      <img src="../../assets/img/logo.png" style="width:1.1em;position:relative;top:.22em" alt="">
+      <img src="../../assets/img/logo.png" style="width:1.1em;position:relative;top:.4em" alt="">
       许昌安彩AGV原片周转看板
       <h3 class="unit">单位：河南汇融科技服务有限公司</h3>
       <h3 class="time">{{ times }}</h3>

src/views/OperationalOverview/coldBoard.vue

@@ -2,7 +2,7 @@
  * @Author: zwq
  * @Date: 2021-07-19 15:18:30
  * @LastEditors: zhp
- * @LastEditTime: 2024-01-04 16:41:17
+ * @LastEditTime: 2023-12-29 16:41:18
  * @Description:
 -->
 <template>
@@ -41,8 +41,8 @@
               <top-radio-group />
             </div> -->
             <!-- 像下面这样表格里的limit值，也许可以用js动态计算出来 -->
-            <double-y-chart ref="productChart" :id="'doubleYChart'" :name-list="cxNameList" :data-list="cxDataList"
+            <double-y-chart ref="productChart" :id="'doubleYChart'" :name-list="cxNameList" :data-list="cxDataList" :height="359"
-              :height="359" :show-legend="true" />
+              :show-legend="true" />
           </base-container>
         </el-col>
 
@@ -83,18 +83,11 @@
               <top-radio-group />
             </div> -->
             <!-- 像下面这样表格里的limit值，也许可以用js动态计算出来 -->
-            <el-col :span="6">
+            <el-col :span="12">
-              <h4 style="margin: 5px 0 5px 0;">融化风机</h4>
+              <base-table1 :page="1" :limit="9" :show-index="false" :table-config="EqMonitoringProps"
-              <base-table1 :page="1" :limit="9" :show-index="false" :table-config="EqMonitoringPropsFun"
                 :table-data="funList" />
             </el-col>
-            <el-col :span="6">
-              <h3 style="margin: 5px 0 5px 0;">退火风机</h3>
-              <base-table1 :page="1" :limit="9" :show-index="false" :table-config="EqMonitoringPropsFun"
-                :table-data="annealFunList" />
-            </el-col>
             <el-col :span="12" style="float: right;">
-              <h3 style="margin: 5px 0 5px 0;">产线设备</h3>
               <base-table1 :page="1" :limit="9" :show-index="false" :table-config="EqMonitoringProps"
                 :table-data="realEqList" />
             </el-col>
@@ -144,33 +137,32 @@ import { parseTime } from '../core/mixins/code-filter';
 
 import LinearBarChart from './components/linearBarChart'
 const qualityYearTableProps= []
-const EqMonitoringPropsFun = [
-  { prop: 'equipmentName', label: '设备名称' },
-  { prop: 'status', label: '运行状态', width: 80}
-]
 const EqMonitoringProps = [
-  { prop: 'line', label: '产线' },
+  { prop: 'productLine', label: '产线' },
-  { prop: 'name', label: '设备名称' },
+  { prop: 'equipmentName', label: '设备名称' },
-  { prop: 'code', label: '设备编码' },
+  { prop: 'equipmentCode', label: '设备编码' },
   {
-    prop: 'run',
+    prop: 'status',
     label: '运行状态',
+    filter: (val) =>
+      val != null ? ['正常', '计划停机', '故障'][val] : '',
   },
   {
     prop: 'error',
     label: '故障状态',
+    filter: (val) => (val != null ? (val ? '是' : '否') : ''),
   },
 ]
 const cutProps = [
-  { prop: 'lineName', label: '产线', width: 50 },
+  { prop: 'lineName', label: '产线' },
   {
     prop: 'time', label: '时间',
     filter: parseTime
   },
   { prop: 'size', label: '规格' },
-  { prop: 'productArea', label: '良品面积', width: 80 },
+  { prop: 'productArea', label: '良品面积' },
-  { prop: 'wasteArea', label: '废片面积', width: 80 },
+  { prop: 'wasteArea', label: '废片面积' },
-  { prop: 'product', label: '良品率', width: 80 },
+  { prop: 'product', label: '良品率' },
 ]
 const cxNameList = ['周一', '周二', '周三', '周四', '周五']
 
@@ -254,7 +246,6 @@ export default {
       beilv: 1,
       value: 100,
       EqMonitoringProps,
-      EqMonitoringPropsFun,
       realEqList:[],
       qualityYearTableProps,
       ISRATableProps,
@@ -272,13 +263,9 @@ export default {
       clientWidth: 0,
       containerWidth: 111111,
       isFullScreen: false,
-      cutWsData: {},
-      funWsData: {},
-      SJGWsData: {},
       // orderProcessList: [],
       dateType: '0',
       funList:[],
-      annealFunList: [],
       queryParams: {
         pageNo: 1,
         pageSize: 10,
@@ -324,7 +311,7 @@ export default {
     this.funInitWebSocket()
     this.CutInitWebSocket()
     this.SJGInitWebSocket()
-    // this.getList()
+
     this.getTimes()
     const _this = this;
     _this.beilv2 = document.documentElement.clientWidth / 1920
@@ -334,7 +321,7 @@ export default {
         this.beilv2 = _this.clientWidth / 1920
       })()
     }
-    // this.getList()
+    this.getList()
     // const _this = this;
     // window.onresize = () => {
     //   return (() => {
@@ -347,6 +334,7 @@ export default {
     //   this.beilv2 = window.innerWidth / 1920
     // })
     // erd.listenTo(document, (element) => {
+    //   console.log(element.offsetWidth)
     //   this.beilv2 = element.offsetWidth / 1920
 
     //   // var width = element.offsetWidth;
@@ -359,30 +347,32 @@ export default {
   //   removeEventListener('resize', resizeFun)
   // },
   methods: {
-    // getList() {
+    getList() {
-    //   // this.loading = true;
+      // this.loading = true;
-    //   // 执行查询
+      // 执行查询
-    //   // let data = '{ "data": { "FanFrequencyInfo": { "1#10处拐角冷却风机": "0", "1#L型吊墙冷却风机": "0", "1#助燃风机": "44.8", "1#澄清带池壁风机": "40", "1#融化带池壁风机": "43", "1#钢碹碴小炉垛风机": "48", "2#10处拐角冷却风机": "50", "2#L型吊墙冷却风机": "49.7", "2#助燃风机": "0", "2#澄清带池壁风机": "0", "2#融化带池壁风机": "0", "2#钢碹碴小炉垛风机": "48", "3#澄清带池壁风机": "0", "3#融化带池壁风机": "0", "4#澄清带池壁风机": "40", "4#融化带池壁风机": "43" } }, "type": "FanFrequencyInfo" }'
+      // let data = '{ "data": { "FanFrequencyInfo": { "1#10处拐角冷却风机": "0", "1#L型吊墙冷却风机": "0", "1#助燃风机": "44.8", "1#澄清带池壁风机": "40", "1#融化带池壁风机": "43", "1#钢碹碴小炉垛风机": "48", "2#10处拐角冷却风机": "50", "2#L型吊墙冷却风机": "49.7", "2#助燃风机": "0", "2#澄清带池壁风机": "0", "2#融化带池壁风机": "0", "2#钢碹碴小炉垛风机": "48", "3#澄清带池壁风机": "0", "3#融化带池壁风机": "0", "4#澄清带池壁风机": "40", "4#融化带池壁风机": "43" } }, "type": "FanFrequencyInfo" }'
-    //   // let obj = JSON.parse(data)
+      // let obj = JSON.parse(data)
-    //   // // for()
+      // console.log('data', obj.data.FanFrequencyInfo)
-    //   // let arr = []
+      // // for()
-    //   // for (let i in obj.data.FanFrequencyInfo) {
+      // let arr = []
-    //   //   arr.push({
+      // for (let i in obj.data.FanFrequencyInfo) {
-    //   //     equipmentName: i,
+      //   arr.push({
-    //   //     status: obj.data.FanFrequencyInfo[i]
+      //     equipmentName: i,
-    //   //   })
+      //     status: obj.data.FanFrequencyInfo[i]
-    //   // }
+      //   })
-    //   // this.funList = arr``
+      // }
-    //   this.$axios.get(
+      // this.funList = arr``
-    //     '/monitoring/equipment-monitor/realtime-page',
+      this.$axios.get(
-    //     'get',
+        '/monitoring/equipment-monitor/realtime-page',
-    //     this.queryParams
+        'get',
-    //   ).then((res) => {
+        this.queryParams
-    //     this.realEqList = res.data.list;
+      ).then((res) => {
-    //     // this.total = response.data.total;
+        console.log('222222222222222', res);
-    //     // this.loading = false;
+        this.realEqList = res.data.list;
-    //   });
+        // this.total = response.data.total;
-    // },
+        // this.loading = false;
+      });
+    },
     getTimes() {
       setInterval(this.getTimesInterval, 1000);
     },
@@ -414,7 +404,8 @@ export default {
         // const wsUrl = 'ws://192.168.1.74:48080/websocket/message?userId=EN111'
         // const wsUrl = 'ws://192.168.1.104:48082/websocket/message?userId=SJG'
         let date = new Date().valueOf()
-        const SJGWsUrl = process.env.VUE_APP_Socket_API + `/websocket/message?userId=COLD${date}`
+        console.log(date);
+        const SJGWsUrl = `ws://192.168.0.30:8888/websocket/message?userId=COLD${date}`
         this.SJGWebsocket = new WebSocket(SJGWsUrl)
         // 监听 WebSocket 连接
         this.SJGWebsocket.onopen = this.SJGWebsocketOnOpen
@@ -433,7 +424,8 @@ export default {
         // const wsUrl = 'ws://192.168.1.74:48080/websocket/message?userId=EN111'
         // const wsUrl = 'ws://192.168.1.104:48082/websocket/message?userId=SJG'
         let date = new Date().valueOf()
-        const cutWsUrl = process.env.VUE_APP_Socket_API + `/websocket/message?userId=CUTTING${date}`
+        console.log(date);
+        const cutWsUrl = `ws://192.168.0.30:8888/websocket/message?userId=CUTTING${date}`
 
         this.cutWebsocket = new WebSocket(cutWsUrl)
         // 监听 WebSocket 连接
@@ -447,52 +439,46 @@ export default {
       }
     },
     funInitWebSocket() {
-      if (typeof (WebSocket) === 'undefined') {
+      // if (typeof (WebSocket) === 'undefined') {
-        alert('您的浏览器不支持WebSocket')
+      //   alert('您的浏览器不支持WebSocket')
-      } else {
+      // } else {
-        // const wsUrl = 'ws://192.168.1.74:48080/websocket/message?userId=EN111'
+      //   // const wsUrl = 'ws://192.168.1.74:48080/websocket/message?userId=EN111'
-        // const wsUrl = 'ws://192.168.1.104:48082/websocket/message?userId=SJG'
+      //   // const wsUrl = 'ws://192.168.1.104:48082/websocket/message?userId=SJG'
-        let date = new Date().valueOf()
+      //   let date = new Date().valueOf()
-        const funWsUrl = `ws://10.70.180.10:8081/xc-screen/websocket/${date}`
+      //   const funWsUrl = `ws://10.70.2.2:8080/xc-screen/websocket/${date}`
-        this.funWebsocket = new WebSocket(funWsUrl)
+      //   this.funWebsocket = new WebSocket(funWsUrl)
-        // 监听 WebSocket 连接
+      //   // 监听 WebSocket 连接
-        this.funWebsocket.onopen = this.funWebsocketOnOpen
+      //   this.funWebsocket.onopen = this.funWebsocketOnOpen
-        // 监听 WebSocket 错误信息
+      //   // 监听 WebSocket 错误信息
-        this.funWebsocket.onerror = this.funWebsocketOnError
+      //   this.funWebsocket.onerror = this.funWebsocketOnError
-        // 监听 WebSocket 消息
+      //   // 监听 WebSocket 消息
-        this.funWebsocket.onmessage = this.funWebsocketOnMessage
+      //   this.funWebsocket.onmessage = this.funWebsocketOnMessage
-        // 监听 webSocket 断开信息
+      //   // 监听 webSocket 断开信息
-        this.funWebsocket.onclose = this.funWebsocketClose
+      //   this.funWebsocket.onclose = this.funWebsocketClose
-      }
+      // }
     },
     funWebsocketOnOpen() {
       console.log('socket连接成功')
+      // console.log(this.SJGWebsocket.onmessage);
       this.SJGWebsocket.onmessage()
     },
     // 连接建立失败重连
     funWebsocketOnError(e) {
+      console.log('222222', e)
       this.funInitWebSocket()
     },
     // 数据接收
     funWebsocketOnMessage(e) {
-      this.funWsData = e?.data ? JSON.parse(e?.data) : {}
+      // console.log(1111, e)
-      // FanInfo
+      // console.log(this.wsData)
-      if (this.funWsData.type === 'AnnealFanInfo') {
+      // console.log('22222', this.wsData.data)
+      this.funWsData = JSON.parse(e.data)
+      if (this.funWsData.type === 'FanFrequencyInfo') {
         let arr = []
-        for (let i in this.funWsData.data.annealFanInfo) {
+        for (let i in this.funWsData.FanFrequencyInfo) {
           arr.push({
             equipmentName: i,
-            status: this.funWsData.data.annealFanInfo[i]
+            status: obj.data.FanFrequencyInfo[i]
-          })
-        }
-        this.annealFunList = arr
-      }
-      if (this.funWsData.type === 'FanInfo') {
-        let arr = []
-        for (let i in this.funWsData.data.fanInfo) {
-          arr.push({
-            equipmentName: i,
-            status: this.funWsData.data.fanInfo[i]
           })
         }
         this.funList = arr
@@ -500,23 +486,20 @@ export default {
     },
     cutWebsocketOnOpen() {
       console.log('socket连接成功')
+      // console.log(this.SJGWebsocket.onmessage);
       this.SJGWebsocket.onmessage()
     },
     // 连接建立失败重连
     cutWebsocketOnError(e) {
+      console.log('11111', e)
       this.CutInitWebSocket()
     },
-    getSize(str) {
-      console.log(str.match(/\d+(\.\d+)?/g))
-     let size =  str.match(/\d+(\.\d+)?/g).map(ele => {
-        return parseFloat(ele)
-     })
-      console.log(size[0] + '*' + size[1] + '*' + size[2]);
-      return size[0] + '*' + size[1] + '*' + size[2]
-    },
     // 数据接收
     cutWebsocketOnMessage(e) {
-      this.cutWsData = e?.data ? JSON.parse(e?.data) : {}
+      // console.log(1111, e)
+      this.cutWsData = JSON.parse(e.data)
+      // console.log('22222', this.wsData.data)
+      console.log('table', this.cutWsData)
       if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'table') {
         this.cutTableDataList = this.cutWsData.productHourData.map((ele, index) => {
           // if (ele.progressRate != 1) {
@@ -524,14 +507,15 @@ export default {
             id: ele.id,
             lineName: ele.lineName,
             time: ele.time,
-            size: this.getSize(ele.size),
+            size: ele.size,
             productArea: ele.productArea + '㎡',
             wasteArea: ele.wasteArea + '㎡',
-            product: (ele.product * 100).toFixed(2) + '%'
+            product: (ele.product *100).toFixed + '%'
 
           }
           // }
         });
+        // console.log(this.orderList)
       } else if (this.cutWsData.type === 'cutting' && this.cutWsData.name === 'chart' && this.cutWsData.dateType === 'day') {
         let nameList = []
         let nameWasteList = []
@@ -540,8 +524,7 @@ export default {
         let wasteList = []
         let sumAreaList = []
         let yieldList = []
-        // this.cutTableDataList =
+        this.cutTableDataList = this.cutWsData.coldDetData.forEach((ele, index) => {
-        this.cutWsData.coldDetData.forEach((ele, index) => {
           nameList.push(ele.lineName)
           topNameList.push('产线: ' + ele.lineName + '   ' + '总面积:' + ele.sumArea)
           productList.push(ele.productArea)
@@ -551,22 +534,33 @@ export default {
           yieldList.push((ele.yield *100).toFixed(3))
         })
         this.$refs.pileChart.initChart(nameList, topNameList, nameWasteList, productList, wasteList)
+        // console.log(this.cutWsData)
+        // console.log('chart',nameList, topNameList, nameWasteList, productList, wasteList);
         this.$refs.productChart.initChart(nameList, yieldList, sumAreaList)
+        // this.$refs.pileChart.initWebSocket
+        // console.log(this.orderList)
       }
     },
     SJGWebsocketOnOpen() {
       console.log('socket连接成功')
+      // console.log(this.SJGWebsocket.onmessage);
       this.SJGWebsocket.onmessage()
     },
     // 连接建立失败重连
     SJGWebsocketOnError(e) {
+      console.log('11111', e)
       this.SJGInitWebSocket()
     },
     // 数据接收
     SJGWebsocketOnMessage(e) {
+      console.log(e);
+      // console.log(1111, e)
       // let data = { "data": { "FanFrequencyInfo": { "1#10处拐角冷却风机": "0", "1#L型吊墙冷却风机": "0", "1#助燃风机": "44.8", "1#澄清带池壁风机": "40", "1#融化带池壁风机": "43", "1#钢碹碴小炉垛风机": "48", "2#10处拐角冷却风机": "50", "2#L型吊墙冷却风机": "49.7", "2#助燃风机": "0", "2#澄清带池壁风机": "0", "2#融化带池壁风机": "0", "2#钢碹碴小炉垛风机": "48", "3#澄清带池壁风机": "0", "3#融化带池壁风机": "0", "4#澄清带池壁风机": "40", "4#融化带池壁风机": "43" } }, "type": "FanFrequencyInfo" }
       // let obj = JSON.parse(data.data)
-      this.SJGWsData = e?.data ? JSON.parse(e?.data) : {}
+      // console.log(obj);
+      this.SJGWsData = JSON.parse(e.data)
+      console.log(this.SJGWsData)
+      // console.log('22222', this.wsData.data)
       if (this.SJGWsData.type === 'isra') {
         this.ISRAList = this.SJGWsData.detData.map((ele, index) => {
           // if (ele.progressRate != 1) {
@@ -580,20 +574,7 @@ export default {
           }
           // }
         });
-      } else if (this.SJGWsData.type === 'equipment') {
+        // console.log(this.orderList)
-        this.realEqList = this.SJGWsData.detData.map((ele, index) => {
-          // if (ele.progressRate != 1) {
-          return {
-            line: ele.line,
-            name: ele.name,
-            code: ele.code,
-            run: ele.run,
-            error: ele.error,
-            // percent: ele.percent
-          }
-          // }
-        });
-
       }
     },
     windowWidth(value) {

src/views/OperationalOverview/components/baseContainer/index.vue

@@ -2,7 +2,7 @@
  * @Author: gtz
  * @Date: 2022-01-19 15:58:17
  * @LastEditors: zhp
- * @LastEditTime: 2024-01-04 16:16:22
+ * @LastEditTime: 2023-11-14 13:28:27
  * @Description: file content
  * @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseContainer\index.vue
 -->

src/views/OperationalOverview/components/baseTable.vue

@@ -1,51 +1,47 @@
 <!--
  * @Date: 2020-12-14 09:07:03
  * @LastEditors: zhp
- * @LastEditTime: 2024-01-04 16:16:00
+ * @LastEditTime: 2023-12-28 09:00:44
  * @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseTable.vue
  * @Description:
 -->
 <template>
-
+  <div class="visual-base-table-container">
-  <div class="visual-base-table-container scroll_table">
+    <el-table
-    <div style="display: inline-block; width: 100%">
+      v-loading="isLoading"
-      <el-table class="top" v-loading="isLoading"
+      :header-cell-style="{background:'rgba(4, 74, 132, .19)',color:'#fff'}"
-        :header-cell-style="{background:'rgba(4, 74, 132, .19)',color:'#fff',}" :row-style="setRowStyle"
+      :row-style="setRowStyle"
-        :data="renderData" border style="width: 100%; background: transparent">
+      :data="renderData"
-        <el-table-column prop="_pageIndex" label="序号" :width="50" align="center" />
+      border
-        <el-table-column v-for="item in renderTableHeadList" :key="item.prop" :show-overflow-tooltip="showOverflow"
+      style="width: 100%; background: transparent"
-          v-bind="item">
+    >
+      <el-table-column
+        prop="_pageIndex"
+        label="序号"
+        :width="70"
+        align="center"
+      />
+      <el-table-column
+        v-for="item in renderTableHeadList"
+        :key="item.prop"
+        :show-overflow-tooltip="showOverflow"
+        v-bind="item"
+      >
         <template slot-scope="scope">
 
-            <component :is="item.subcomponent" v-if="item.subcomponent" :inject-data="{...scope.row, ...item}"
+          <component
-              @emitData="emitData" />
+            :is="item.subcomponent"
+            v-if="item.subcomponent"
+            :inject-data="{...scope.row, ...item}"
+            @emitData="emitData"
+          />
           <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
 
         </template>
       </el-table-column>
       <slot name="content" />
     </el-table>
-      <vue-seamless-scroll :data="renderData" class="seamless-warp" style="width: 100%" :class-option="classOption">
-        <el-table class="bottom" v-loading="isLoading"
-          :header-cell-style="{background:'rgba(4, 74, 132, .19)',color:'#fff',}" :row-style="setRowStyle"
-          :data="renderData" border style="width: 100%; background: transparent">
-          <el-table-column prop="_pageIndex" label="序号" :width="50" align="center" />
-          <el-table-column v-for="item in renderTableHeadList" :key="item.prop" :show-overflow-tooltip="showOverflow"
-            v-bind="item">
-            <template slot-scope="scope">
-
-              <component :is="item.subcomponent" v-if="item.subcomponent" :inject-data="{...scope.row, ...item}"
-                @emitData="emitData" />
-              <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
-
-            </template>
-          </el-table-column>
-          <slot name="content" />
-        </el-table>
-      </vue-seamless-scroll>
   </div>
-  </div>
-
 </template>
 <script>
 import { isObject, isString } from 'lodash'
@@ -113,19 +109,7 @@ export default {
       return this.tableConfig.filter((item, index) => {
         return this.selectedBox[index]
       })
-    },
+    }
-    classOption() {
-      return {
-        step: 0.3, // 数值越大速度滚动越快
-        limitMoveNum: 1, // 开始无缝滚动的数据量 this.list
-        hoverStop: true, // 是否开启鼠标悬停stop
-        direction: 1, // 0向下 1向上 2向左 3向右
-        openWatch: true, // 开启数据实时监控刷新dom
-        singleHeight: 0, // 单步运动停止的高度(默认值0是无缝不停止的滚动) direction => 0/1
-        singleWidth: 0, // 单步运动停止的宽度(默认值0是无缝不停止的滚动) direction => 2/3
-        waitTime: 1000, // 单步运动停止的时间(默认值1000ms)
-      };
-    },
   },
   beforeMount() {
     this.selectedBox = new Array(100).fill(true)
@@ -187,23 +171,16 @@ export default {
     background-color: rgba(79,114,136,0.29) !important;
   }
 }
-</style>
+// .setting {
-
+//   text-align: right;
-<style lang="scss">
+//   padding: 15px;
- .seamless-warp {
+//   .setting-box {
-  height: 308px;
+//     width: 100px;
-  overflow: hidden;
+//   }
-}
+//   i {
- .min {
+//     color: #aaa;
-  display: flex;
+//     @extend .pointer;
-  width: 100%;
+//   }
-}
+// }
- .top  .el-table__body-wrapper {
-  display: none;
-}
- .bottom .el-table__header-wrapper {
-  display: none;
-  width: 100%;
-}
 
 </style>

src/views/OperationalOverview/components/doubleYChart .vue

@@ -60,6 +60,7 @@ export default {
   data() {
     return {
       chart: null,
+      nameList: [],
       series: [{
         type: 'bar',
         data: [],
@@ -226,7 +227,7 @@ export default {
             },
             scale: true,
             type: 'value',
-            name: '产量/㎡', // y轴上方的单位
+            name: '产量/片', // y轴上方的单位
             nameTextStyle: {// y轴上方单位的颜色
               color: '#fff'
             },

src/views/OperationalOverview/processingBoard.vue

@@ -2,7 +2,7 @@
  * @Author: zwq
  * @Date: 2021-07-19 15:18:30
  * @LastEditors: zhp
- * @LastEditTime: 2024-01-04 15:52:52
+ * @LastEditTime: 2023-12-29 15:15:50
  * @Description:
 -->
 <template>
@@ -12,7 +12,7 @@
       lineHeight: 88 + 'px',
       fontSize: 31 + 'px'
     }">
-      <img src="../../assets/img/logo.png" style="width:1.1em;position:relative;top:.22em" alt="">
+      <img src="../../assets/img/logo.png" style="width:1.1em;position:relative;top:.4em" alt="">
       许昌安彩深加工看板
       <h3 class="unit">单位：河南汇融科技服务有限公司</h3>
       <h3 class="time">{{ times }}</h3>
@@ -27,23 +27,23 @@
       </el-button> -->
     </el-row>
     <el-row class="container-main flex-col" type="flex">
-      <el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15" type="flex" class="flex-1" style="height: 50%;">
+      <el-row :style="{ padding: '0 ' + 9 + 'px' }" :gutter="15" type="flex" class="flex-1">
-        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8" height="100%">
+        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
-          <base-container :title="'设备报警'" :height="318" :title-icon="'eqAlarm'">
+          <base-container :title="'设备报警'" :title-icon="'eqAlarm'">
             <base-table1 :page="1" :limit="9" :show-index="false" :table-config="qualityYearTableProps"
               :table-data="equipmentList" />
           </base-container>
         </el-col>
 
-        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8" height="100%">
+        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
           <base-container :title="'各工序缺陷汇总'" :title-icon="'scrap'">
             <base-table1 :page="1" :limit="9" :show-index="false" :table-config="qualityMonthTableProps"
               :table-data="qualityMonthList" />
           </base-container>
         </el-col>
 
-        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8" height="100%">
+        <el-col :style="{ margin: 8 + 'px' + ' 0' }" :span="8">
-          <base-container :height="318" :title="'工单监控'" :title-icon="'eqMonitoring'">
+          <base-container :title="'工单监控'" :title-icon="'eqMonitoring'">
             <!-- <div style="width: 45%;position: absolute; top: 3em; right: 3em;">
               <top-radio-group />
             </div> -->
@@ -606,7 +606,7 @@ export default {
         'get',
       ).then((res) => {
         // console.log('11111', res);
-        this.qualityMonthList = res.data ? res.data : []
+        this.qualityMonthList = res.data
       })
     },
     getTimes() {
@@ -637,10 +637,10 @@ export default {
       if (typeof (WebSocket) === 'undefined') {
         alert('您的浏览器不支持WebSocket')
       } else {
-        let date = new Date().valueOf()
+        const wsUrl = `ws://192.168.0.33:48082/websocket/message?userId=EN${date}`
-        const wsUrl = process.env.VUE_APP_Socket_API + `/websocket/message?userId=EN${date}`
         // const wsUrl = 'ws://192.168.1.104:48082/websocket/message?userId=SJG'
-        // const wsUrl = 'ws://10.70.2.2:8080/websocket/message?userId=EN111'
+        let date = new Date().valueOf()
+        // const wsUrl = 'ws://192.168.0.33:48082/websocket/message?userId=EN111'
         // 实例化 WebSocket
         this.websocket = new WebSocket(wsUrl)
         // 监听 WebSocket 连接
@@ -657,12 +657,11 @@ export default {
       if (typeof (WebSocket) === 'undefined') {
         alert('您的浏览器不支持WebSocket')
       } else {
-        // const wsUrl = `ws://10.70.2.2:8080/websocket/message?userId=EN${date}`
+        // const wsUrl = `ws://192.168.0.33:48082/websocket/message?userId=EN${date}`
         // const wsUrl = 'ws://192.168.1.104:48082/websocket/message?userId=SJG'
         let date = new Date().valueOf()
         // console.log(date);
-        console.log(process.env);
+        const SJGWsUrl = `ws://192.168.0.33:48082/websocket/message?userId=SJG${date}`
-        const SJGWsUrl = process.env.VUE_APP_Socket_API + `/websocket/message?userId=SJG${date}`
         this.SJGWebsocket = new WebSocket(SJGWsUrl)
         // 监听 WebSocket 连接
         this.SJGWebsocket.onopen = this.SJGWebsocketOnOpen
@@ -676,7 +675,7 @@ export default {
     },
     SJGWebsocketOnOpen() {
       console.log('socket连接成功')
-      // console.log(this.SJGWebsocket.onmessage);
+      console.log(this.SJGWebsocket.onmessage);
       this.SJGWebsocket.onmessage()
     },
     // 连接建立失败重连
@@ -687,7 +686,7 @@ export default {
     // 数据接收
     SJGWebsocketOnMessage(e) {
       // console.log(1111, e)
-      this.SJGWsData = e?.data ? JSON.parse(e?.data) : {}
+      this.SJGWsData = JSON.parse(e.data)
       // console.log(this.wsData.detData);
       // console.log('22222', this.wsData.data)
       if (this.SJGWsData.type === 'order') {
@@ -728,6 +727,7 @@ export default {
             }
           })
         })
+        console.log(Array.from(new Set(nameList)))
         // progressRateList = EnergyNameList
         // let EnergyDataList = []
         this.SJGWsData.detData.forEach((ele) => {
@@ -741,7 +741,7 @@ export default {
         // console.log(this.EnergyMonitoringNameList)
         // console.log(this.EnergyMonitoringList)
         // this.$nextTick(() => {
-        this.$refs.productLineChart.initChart(Array.from(new Set(nameList)), passRateList, outputNumList)
+        this.$refs.productLineChart.initChart(nameList, passRateList, outputNumList)
       }
     },
     // 数据发送
@@ -765,7 +765,7 @@ export default {
     // 数据接收
     websocketOnMessage(e) {
       // console.log(1111, e)
-      this.wsData = e?.data ? JSON.parse(e?.data) : {}
+      this.wsData = JSON.parse(e.data)
       // console.log('22222', this.wsData.data)
       if (this.wsData.type === 'EnergyMonitoring') {
         let EnergyNameList = []
@@ -926,10 +926,6 @@ export default {
   background-color: unset;
   background-image: linear-gradient(to right, #4573fe, #47f8dc);
 }
-// ::v-deep .el-progress-bar__outer {
-//   background-color:rgba(71, 248, 220, 1);
-//   // background-image: rgba(71, 248, 220, 1))
-// }
  .visual-select {
    position: absolute;
    right: 1em;
@@ -939,6 +935,8 @@ export default {
 // .container-main {
 //    padding: 5px;
 //  }
+
+
 </style>
 
 <style lang="scss">

src/views/databoard/components/Container.vue

@@ -55,24 +55,6 @@ export default {
 					return require('../assets/msg.png');
 				case '烟气处理':
 					return require('../assets/gas.png');
-				case '产线缺陷统计':
-					return require('../assets/defectStatistics.png');
-				case '产线当日缺陷分类':
-					return require('../assets/check.png');
-				case '本日生产良品率':
-					return require('../assets/goodRate.png');
-				case '订单完成情况':
-					return require('../assets/order.png');
-				case '设备报警':
-					return require('../assets/goodRate.png');
-				case '各工序缺陷汇总':
-					return require('../assets/check.png');
-				case '能源监控':
-					return require('../assets/defectStatistics.png');
-				case '产线产量及良品率':
-					return require('../assets/order.png');
-				case '工单监控':
-					return require('../assets/eqMonitor.png');
 			}
 		},
 	},

src/views/databoard/components/DefectChart.vue

@@ -1,216 +0,0 @@
-<template>
-  <div class="defect-chart"></div>
-</template>
-<script>
-import * as echarts from 'echarts';
-import resize from './../mixins/resize'
-export default {
-  name: 'DefectChart',
-  mixins: [resize],
-  props: {
-		chartTime: ''
-	},
-  data() {
-    return {
-      chart: null,
-      tempData: []
-    }
-  },
-  computed: {
-    israDayStatistic() {
-      return this.$store.state.websocket.israDayStatistic
-    },
-    israWeekStatistic() {
-      return this.$store.state.websocket.israWeekStatistic
-    },
-    israMonthStatistic() {
-      return this.$store.state.websocket.israMonthStatistic
-    },
-    israYearStatistic() {
-      return this.$store.state.websocket.israYearStatistic
-    }
-  },
-  watch: {
-    israDayStatistic: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '日') {
-          this.tempData = israDayStatistic
-					this.updateChart()
-				}
-			}
-		},
-    israWeekStatistic: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '周') {
-          this.tempData = israWeekStatistic
-					this.updateChart()
-				}
-			}
-		},
-    israMonthStatistic: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '月') {
-          this.tempData = israMonthStatistic
-					this.updateChart()
-				}
-			}
-		},
-    israYearStatistic: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '年') {
-          this.tempData = israYearStatistic
-					this.updateChart()
-				}
-			}
-		}
-  },
-  mounted() {
-		this.$el.addEventListener('resize', () => {
-			console.log('resziing.....');
-		});
-		this.updateChart()
-	},
-  methods: {
-    updateChart() {
-      if (
-        this.chart !== null &&
-        this.chart !== '' &&
-        this.chart !== undefined
-      ) {
-        this.chart.dispose()
-      }
-      this.chart = echarts.init(this.$el);
-      let legendData = []
-      let xData = []
-      let yData = []
-      this.tempData && this.tempData.length > 0 && this.tempData.map(item => {
-        xData.push(item.name)
-      })
-      var series = [
-        {
-          data: [120, 200, 150, 80, 70, 110, 130],
-          type: 'bar',
-          stack: 'all',
-          name: 'a',
-          barWidth: 12,
-        },
-        {
-          data: [10, 46, 64, '-', 0, '-', 0],
-          type: 'bar',
-          stack: 'all',
-          name: 'b',
-          barWidth: 12,
-        },
-        {
-          data: [30, '-', 0, 20, 10, '-', 0],
-          type: 'bar',
-          stack: 'all',
-          barWidth: 12,
-          name: 'c'
-        },
-        {
-          data: [30, '-', 0, 20, 10, '-', 0],
-          type: 'bar',
-          stack: 'all',
-          barWidth: 12,
-          name: 'd'
-        },
-        {
-          data: [10, 20, 150, 0, '-', 50, 10],
-          type: 'bar',
-          stack: 'all',
-          name: 'e',
-          barWidth: 12,
-          label: {
-            show: true,
-            position: 'top'
-          }
-        }
-      ];
-      var option = {
-        color: ['#2760FF','#5B9BFF','#FFD160','#8167F6', '#99D66C', '#FF8A40'],
-        grid: { top: 40, right: 12, bottom: 20, left: 48 },
-        legend: {
-          top: 10,
-          left: 80,
-          padding: 5,
-          itemWidth: 12,
-          itemHeight: 12,
-          itemGap: 12,
-          height: 12,
-          textStyle: {
-            color: "#DFF1FE",
-            fontSize: 12,
-          },
-          data:['a','b','c','d','e'],
-        },
-        xAxis: {
-          type: "category",
-          data: xData,
-          axisLabel: {
-            color: "#fffc",
-            fontSize: 12,
-          },
-          axisTick: { show: false },
-          axisLine: {
-            lineStyle: {
-              width: 1,
-              color: "#213259",
-            },
-          },
-        },
-        yAxis: {
-          name: "单位/个",
-          nameTextStyle: {
-            color: "#fff",
-            fontSize: 10,
-            align: "right",
-          },
-          type: "value",
-          axisLabel: {
-            color: "#fff",
-            fontSize: 12,
-            formatter: "{value}",
-          },
-          axisLine: {
-            show: true,
-            lineStyle: {
-              color: "#213259",
-            },
-          },
-          splitLine: {
-            lineStyle: {
-              color: "#213259a0",
-            },
-          },
-        },
-        tooltip: {
-          trigger: "axis",
-          axisPointer: {
-            type: "shadow",
-          },
-          className: "defect-chart-tooltip"
-        },
-        series: series
-      };
-      option && this.chart.setOption(option)
-    }
-  }
-}
-</script>
-<style scoped lang="scss">
-.defect-chart {
-	width: 100%;
-	height: 100%;
-}
-</style>
-<style>
-  .defect-chart-tooltip {
-    background: #0a2b4f77 !important;
-    border: none !important;
-    backdrop-filter: blur(12px);
-  }
-  .defect-chart-tooltip * {
-    color: #fff !important;
-  }
-</style>

src/views/databoard/components/DefectClassChart.vue

@@ -1,170 +0,0 @@
-<template>
-  <div class="defect-class-chart"></div>
-</template>
-<script>
-import * as echarts from 'echarts';
-import resize from './../mixins/resize'
-export default {
-  name: 'DefectClassChart',
-  mixins: [resize],
-  props: {
-		chartType: ''
-	},
-  data() {
-    return {
-      chart: null
-    }
-  },
-  computed: {
-    israDayStatistic() {
-      return this.$store.state.websocket.israDayStatistic
-    }
-  },
-  watch:{
-    israDayStatistic: {
-			handler(newVal, oldVal) {
-        if (newVal === oldVal) {
-          return false
-        }
-        this.updateChart()
-			}
-		},
-    chartType: {// 监听类型变化，更新图
-			handler(newVal, oldVal) {
-				this.updateChart()
-			}
-		}
-  },
-  mounted() {
-		this.$el.addEventListener('resize', () => {
-			console.log('resziing.....');
-		});
-		this.updateChart()
-	},
-  methods: {
-    updateChart() {
-      if (
-        this.chart !== null &&
-        this.chart !== '' &&
-        this.chart !== undefined
-      ) {
-        this.chart.dispose()
-      }
-      this.chart = echarts.init(this.$el);
-      let tempData = []
-      let xData = []
-      let yData = []
-      this.israDayStatistic && this.israDayStatistic.length > 0 && this.israDayStatistic.map(item => {
-        if (this.chartType === item.name) {
-          tempData = item.data
-          return
-        }
-      })
-      tempData.length > 0 && tempData.map(item => {
-        xData.push(item.checkType)
-        yData.push(item.checkNum)
-      })
-      var option = {
-        color: ['#2760FF','#5B9BFF','#FFD160','#8167F6', '#99D66C', '#FF8A40'],
-        grid: { top: 40, right: 12, bottom: 80, left: 60 },
-        // legend: {
-        //   top: 10,
-        //   left: 80,
-        //   padding: 5,
-        //   itemWidth: 12,
-        //   itemHeight: 12,
-        //   itemGap: 12,
-        //   height: 12,
-        //   textStyle: {
-        //     color: "#DFF1FE",
-        //     fontSize: 12,
-        //   },
-        //   data:['a','b','c','d','e'],
-        // },
-        xAxis: {
-          type: "category",
-          data: xData,
-          axisLabel: {
-            color: "#fffc",
-            fontSize: 12,
-            rotate: 45
-          },
-          axisTick: { show: false },
-          axisLine: {
-            lineStyle: {
-              width: 1,
-              color: "#213259",
-            },
-          },
-        },
-        yAxis: {
-          name: "单位/次",
-          nameTextStyle: {
-            color: "#fff",
-            fontSize: 10,
-            align: "right",
-          },
-          type: "value",
-          axisLabel: {
-            color: "#fff",
-            fontSize: 12,
-            formatter: "{value}",
-          },
-          axisLine: {
-            show: true,
-            lineStyle: {
-              color: "#213259",
-            },
-          },
-          splitLine: {
-            lineStyle: {
-              color: "#213259a0",
-            },
-          },
-        },
-        tooltip: {
-          trigger: "axis",
-          axisPointer: {
-            type: "shadow",
-          },
-          className: "defect-chart-tooltip"
-        },
-        series: [
-          {
-          data: yData,
-          type: 'bar',
-          barWidth: 12,
-          label: {
-            show: true,
-            position: 'top'
-          },
-          itemStyle: {
-            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-              { offset: 0, color: '#5CB7FF' },
-              { offset: 1, color: '#364BFE' }
-            ])
-          },
-        }
-      ]
-      };
-      option && this.chart.setOption(option)
-    }
-  }
-}
-</script>
-<style scoped lang="scss">
-.defect-class-chart {
-	width: 100%;
-	height: 100%;
-}
-</style>
-<style>
-  .defect-chart-tooltip {
-    background: #0a2b4f77 !important;
-    border: none !important;
-    backdrop-filter: blur(12px);
-  }
-  .defect-chart-tooltip * {
-    color: #fff !important;
-  }
-</style>

src/views/databoard/components/EnergeMonitoringChart.vue

@@ -1,157 +0,0 @@
-<template>
-  <div class="energe-monitoring-chart"></div>
-</template>
-<script>
-import * as echarts from 'echarts';
-import resize from './../mixins/resize'
-export default {
-  name: 'EnergeMonitoringChart',
-  mixins: [resize],
-  data() {
-    return {
-      chart: null
-    }
-  },
-  computed: {
-    energyMonitoring() {
-      return this.$store.state.websocket.energyMonitoring
-    }
-  },
-  watch:{
-    energyMonitoring: {
-			handler(newVal, oldVal) {
-        if (newVal === oldVal) {
-          return false
-        }
-        this.updateChart()
-			}
-		}
-  },
-  mounted() {
-		this.$el.addEventListener('resize', () => {
-			console.log('resziing.....');
-		});
-		this.updateChart()
-	},
-  methods: {
-    updateChart() {
-      if (
-        this.chart !== null &&
-        this.chart !== '' &&
-        this.chart !== undefined
-      ) {
-        this.chart.dispose()
-      }
-      this.chart = echarts.init(this.$el);
-      let xData = []
-      let yData = []
-      this.energyMonitoring && this.energyMonitoring.length > 0 && this.energyMonitoring.map(item => {
-        xData.push(item.lineName)
-        yData.push(item.useQuantity)
-      })
-      var option = option = {
-        // color: ['#FF8A40','#FFD160','#99D66C','#5B9BFF','#8167F6','#2760FF'],
-        grid: { top: 32, right: 12, bottom: 20, left: 60 },
-        tooltip: {
-          trigger: 'axis',
-          axisPointer: {
-            type: 'cross',
-            crossStyle: {
-              color: '#999'
-            }
-          },
-          className: "energe-monitoring-chart-tooltip"
-        },
-        legend: {
-          data: ['电耗能'],
-          textStyle: {
-            color: "#DFF1FE",
-            fontSize: 12,
-          }
-        },
-        xAxis: [
-          {
-            type: 'category',
-            data: xData,
-            axisPointer: {
-              type: 'shadow'
-            },
-            axisLabel: {
-              color: "#fff",
-              fontSize: 12,
-            },
-            axisTick: { show: false },
-            axisLine: {
-              lineStyle: {
-                width: 1,
-                color: "#213259",
-              },
-            }
-          }
-        ],
-        yAxis: [
-          {
-            type: 'value',
-            name: '单位',
-            // min: 0,
-            // max: 250,
-            // interval: 50,
-            axisLabel: {
-              color: "#fff",
-              fontSize: 12,
-              formatter: '{value}'
-            },
-            axisLine: {
-              show: true,
-              lineStyle: {
-                color: "#213259",
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                color: "#213259a0",
-              },
-            }
-          }
-        ],
-        series: [
-          {
-            name: '电耗能',
-            type: 'bar',
-            // barWidth: 12,
-            tooltip: {
-              valueFormatter: function (value) {
-                return value + ' ml';
-              }
-            },
-            itemStyle: {
-              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                { offset: 0, color: '#5CB7FF' },
-                { offset: 1, color: '#364BFE' }
-              ])
-            },
-            data: yData
-          }
-        ]
-      }
-      option && this.chart.setOption(option)
-    }
-  }
-}
-</script>
-<style scoped lang="scss">
-.energe-monitoring-chart {
-	width: 100%;
-	height: 100%;
-}
-</style>
-<style>
-  .energe-monitoring-chart-tooltip {
-    background: #0a2b4f77 !important;
-    border: none !important;
-    backdrop-filter: blur(12px);
-  }
-  .energe-monitoring-chart-tooltip * {
-    color: #fff !important;
-  }
-</style>

src/views/databoard/components/FlueGas.vue

@@ -1,234 +0,0 @@
-<template>
-	<div class="gas-chart"></div>
-</template>
-
-<script>
-import * as echarts from 'echarts';
-import resize from './../mixins/resize'
-
-export default {
-	name: 'GasChart',
-	mixins: [resize],
-	components: {},
-	props: {
-		chartType: '',
-		chartTime: ''
-	},
-	data() {
-		const colors = [
-			'#12FFF5',
-			'#2760FF',
-			'#FFD160',
-			'#E80091',
-			'#8064ff',
-			'#ff8a3b',
-			'#8cd26d',
-			'#2aa1ff',
-		];
-		return {
-			chart: null
-		};
-	},
-	computed: {
-		gasChartDayTrend() {
-			return this.$store.state.websocket.gasChartDayTrend
-		},
-		gasChartWeekTrend() {
-			return this.$store.state.websocket.gasChartWeekTrend
-		},
-		gasChartMonthTrend() {
-			return this.$store.state.websocket.gasChartMonthTrend
-		},
-		gasChartYearTrend() {
-			return this.$store.state.websocket.gasChartYearTrend
-		}
-	},
-	watch: {
-		gasChartDayTrend: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '日') {
-					this.updateChart()
-				}
-			}
-		},
-		gasChartWeekTrend: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '周') {
-					this.updateChart()
-				}
-			}
-		},
-		gasChartMonthTrend: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '月') {
-					this.updateChart()
-				}
-			}
-		},
-		gasChartYearTrend: {
-			handler(newVal, oldVal) {
-				if (this.chartTime === '年') {
-					this.updateChart()
-				}
-			}
-		},
-		chartType: {// 监听类型变化，更新图
-			handler(newVal, oldVal) {
-				this.updateChart()
-			}
-		},
-		chartTime: {// 监听时间变化，更新图
-			handler(newVal, oldVal) {
-				this.updateChart()
-			}
-		}
-	},
-	mounted() {
-		this.$el.addEventListener('resize', () => {
-			console.log('resziing.....');
-		});
-		this.updateChart()
-	},
-	methods: {
-		updateChart() {
-			let gasName  = ''
-			const colors = ['#FFCB59'];
-			let temp1 = []
-			let temp2 = []
-			let seriesData = []
-			let xData = []
-			let yData = []
-			switch (this.chartTime) {
-				case '日':{
-					temp1 = this.gasChartDayTrend
-					break;
-				}
-				case '周':{
-					temp1 = this.gasChartWeekTrend
-					break;
-				}
-				case '月':{
-					temp1 = this.gasChartMonthTrend
-					break;
-				}
-				case '年':{
-					temp1 = this.gasChartYearTrend
-					break;
-				}
-				default:
-			}
-			switch (this.chartType) {
-				case '氧气含量':{
-					temp2 = temp1.O2_float || []
-					break;
-				}
-				case '二氧化硫':{
-					temp2 = temp1.SO2_float || []
-					break;
-				}
-				case '一氧化氮':{
-					temp2 = temp1.NOX_float || []
-					break;
-				}
-				case '颗粒物':{
-					temp2 = temp1.dust_float || []
-					break;
-				}
-				default:
-			}
-			temp2.length > 0 && temp2.map(i => {
-				xData.push(i.time)
-				yData.push(i.value)
-			}) 
-			if (yData.length == 0) {
-				seriesData = []
-			}else {
-				seriesData = [{
-					name: gasName,
-					data: yData,
-					type: "line",
-					areaStyle: {
-							color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-							{ offset: 0, color: '#FFCB59' + "40" },
-							{ offset: 0.5, color: '#FFCB59' + "20" },
-							{ offset: 1, color: '#FFCB59' + "00" },
-							]),
-					},
-					lineStyle: {
-							width: 1
-					},
-					symbolSize: 1,
-					emphasis: {
-							focus: 'series'
-					}
-				}]
-					
-			}
-			// 绘图
-			if (
-        this.chart !== null &&
-        this.chart !== '' &&
-        this.chart !== undefined
-      ) {
-        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
-      }
-			this.chart = echarts.init(this.$el);
-			var option = {
-				color: colors,
-				grid: { top: 32, right: 12, bottom: 20, left: 48 },
-				xAxis: {
-					type: 'category',
-					data: xData,
-					axisLabel: {
-						color: '#fff',
-						fontSize: 12,
-					},
-					axisTick: { show: false },
-					axisLine: {
-						lineStyle: {
-							width: 1,
-							color: '#213259',
-						},
-					},
-				},
-				yAxis: {
-					name: '单位m³/h',
-					nameTextStyle: {
-						color: '#fff',
-						fontSize: 10,
-						align: 'right',
-					},
-					type: 'value',
-					axisLabel: {
-						color: '#fff',
-						fontSize: 12,
-					},
-					axisLine: {
-						show: true,
-						lineStyle: {
-							color: '#213259',
-						},
-					},
-					splitLine: {
-						lineStyle: {
-							color: '#213259a0',
-						},
-					},
-				},
-				series: seriesData,
-				tooltip: {
-					trigger: 'axis',
-				},
-			}
-			option && this.chart.setOption(option)
-		}
-	},
-};
-</script>
-
-<style scoped lang="scss">
-.gas-chart {
-	width: 100%;
-	height: 100%;
-}
-</style>

src/views/databoard/components/GasChart.vue

@@ -17,10 +17,7 @@ export default {
 	name: 'GasChart',
 	mixins: [resize],
 	components: {},
-	props: {
+	props: {},
-		chartType: '', // 能源类型
-		chartTime: ''
-	},
 	data() {
 		const colors = [
 			'#12FFF5',
@@ -33,155 +30,22 @@ export default {
 			'#2aa1ff',
 		];
 		return {
-			chart: null
+			chart: null,
-		};
+			option: {
-	},
-	computed: {
-		gasChartMsg() {
-			return this.$store.state.websocket.sumGasInfo
-		},
-		energyWeekTrend() {
-			return this.$store.state.websocket.energyWeekTrend
-		},
-		energyMonthTrend() {
-			return this.$store.state.websocket.energyMonthTrend
-		},
-		energyYearTrend() {
-			return this.$store.state.websocket.energyYearTrend
-		}
-	},
-	watch: {
-		energyWeekTrend: {// 监听周电能，更新图
-			handler(newVal, oldVal) {
-				if (this.chartTime === '周' && this.chartType === '电耗能') {
-					this.updateChart()
-				}
-			}
-		},
-		energyMonthTrend: {// 监听月电能，更新图
-			handler(newVal, oldVal) {
-				if (this.chartTime === '月' && this.chartType === '电耗能') {
-					this.updateChart()
-				}
-			}
-		},
-		energyYearTrend: {// 监听年电能，更新图
-			handler(newVal, oldVal) {
-				if (this.chartTime === '年' && this.chartType === '电耗能') {
-					this.updateChart()
-				}
-			}
-		},
-		gasChartMsg: {// 监听天然气，更新图
-			handler(newVal, oldVal) {
-				if (this.chartType === '天然气I' || this.chartType === '天然气II') {
-					this.updateChart()
-				}
-			}
-		},
-		chartTime: {// 监听时间变化，更新图
-			handler(newVal, oldVal) {
-				this.updateChart()
-			}
-		},
-		chartType: {// 监听能源类型变化，更新图
-			handler(newVal, oldVal) {
-				this.updateChart()
-			}
-		}
-	},
-	mounted() {
-		this.$el.addEventListener('resize', () => {
-			console.log('resziing.....');
-		});
-		this.updateChart()
-	},
-	methods: {
-		updateChart() {
-			let gasName  = ''
-			const colors = ['#FFCB59'];
-			let temp = []
-			let seriesData = []
-			let xData = []
-			let yData = []
-			switch (this.chartType) {
-				case '电耗能':{
-					gasName = '电耗能'
-					if (this.chartTime === '周') {
-						temp = this.energyWeekTrend || []
-					}else if(this.chartTime === '月') {
-						temp = this.energyMonthTrend || []
-					}else{
-						temp = this.energyYearTrend || []
-					}
-					temp && temp.map(i => {
-						xData.push(i.time)
-						yData.push(i.qty)
-					})
-					break;
-				}
-				case '天然气I':{
-					if (this.chartTime === '周') {
-						yData = this.gasChartMsg.hisSumGas1For7Day || []
-					}else if(this.chartTime === '月') {
-						yData = this.gasChartMsg.sumGas1ForMonth || []
-					}else{
-						yData = this.gasChartMsg.sumGas1ForYear || []
-					}
-					gasName = '天然气I'
-					xData = this.getXdata()
-					break;
-				}
-				default:
-				gasName = '天然气II'
-				if (this.chartTime === '周') {
-						yData = this.gasChartMsg.hisSumGas2For7Day || []
-					}else if(this.chartTime === '月') {
-						yData = this.gasChartMsg.sumGas2ForMonth || []
-					}else{
-						yData = this.gasChartMsg.sumGas2ForYear || []
-					}
-				xData = this.getXdata()
-			}
-			if (yData.length == 0) {
-				seriesData = []
-			}else {
-				seriesData = [{
-					name: gasName,
-					data: yData,
-					type: "line",
-					areaStyle: {
-							color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-							{ offset: 0, color: '#FFCB59' + "40" },
-							{ offset: 0.5, color: '#FFCB59' + "20" },
-							{ offset: 1, color: '#FFCB59' + "00" },
-							]),
-					},
-					lineStyle: {
-							width: 1
-					},
-					symbolSize: 1,
-					emphasis: {
-							focus: 'series'
-					}
-				}]
-					
-			}
-			// 绘图
-			if (
-        this.chart !== null &&
-        this.chart !== '' &&
-        this.chart !== undefined
-      ) {
-        this.chart.dispose() // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
-      }
-			this.chart = echarts.init(this.$el);
-			var option = {
 				color: colors,
-				grid: { top: 32, right: 12, bottom: 20, left: 60 },
+				grid: { top: 32, right: 12, bottom: 20, left: 48 },
 				xAxis: {
 					type: 'category',
-					data: xData,
+					data: Array(7)
+						.fill(1)
+						.map((_, index) => {
+							const today = new Date();
+							const dtimestamp = today - index * 24 * 60 * 60 * 1000;
+							return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
+								dtimestamp
+							).getDate()}`;
+						})
+						.reverse(),
 					axisLabel: {
 						color: '#fff',
 						fontSize: 12,
@@ -218,48 +82,71 @@ export default {
 						},
 					},
 				},
-				series: seriesData,
+				series: [
+					Array(7)
+						.fill(1)
+						.map((_) => Math.ceil(Math.random() * 100)),
+					Array(7)
+						.fill(1)
+						.map((_) => Math.ceil(Math.random() * 100)),
+					Array(7)
+						.fill(1)
+						.map((_) => Math.ceil(Math.random() * 100)),
+				].map((v, i) => ({
+					name: ['总量', '白班', '夜班'][i],
+					data: v,
+					type: 'line',
+					symbol: 'circle',
+					areaStyle: {
+						color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+							// i % 8 避免超过8个数据时无颜色的问题
+							{ offset: 0, color: colors[i % 8] + '40' },
+							{ offset: 0.5, color: colors[i % 8] + '20' },
+							{ offset: 1, color: colors[i % 8] + '00' },
+						]),
+					},
+				})),
 				tooltip: {
 					trigger: 'axis',
 				},
-			}
-			option && this.chart.setOption(option)
 			},
-		getXdata() {
+		};
-			const today = new Date();
+	},
-			const currentYear = today.getFullYear();
+	computed: {
-			const currentMonth = today.getMonth() + 1;
+		sidebarStatus() {
-			let days = 30;
+			return this.$store.state.app.sidebar.opened;
-			if (this.chartTime === '周') {
+		},
-				return Array(7)
+		gasChartMsg() {
-						.fill(1)
+			return this.$store.state.websocket.gasInfo
-						.map((_, index) => {
-							const today = new Date();
-							const dtimestamp = today - (index+1) * 24 * 60 * 60 * 1000;
-							return `${new Date(dtimestamp).getMonth() + 1}.${new Date(
-								dtimestamp
-							).getDate()}`;}).reverse()
-			}else if (this.chartTime == "月") {
-				if (currentMonth in [1, 3, 5, 7, 8, 10, 12]) {
-					days = 31;
-				} else if (currentMonth == 2) {
-					days = this.isLeapYear(currentYear) ? 29 : 28;
-				}
-				return Array(days)
-						.fill(1)
-						.map((_, index) => {
-							return `${currentMonth}.${days - index}`;}).reverse()
-			} else {
-				return Array(12)
-						.fill(1)
-						.map((_, index) => {
-							return `${currentYear}.${12 - index}`;}).reverse()
 		}
 	},
-		isLeapYear(year) {
+	watch: {
-			return year % 400 == 0 || (year % 4 == 0 && year % 100 != 0);
+		sidebarStatus(val) {
+			console.log('sidebarStatus', val);
+			this.chart && this.chart.dispose();
+
+			setTimeout(() => {
+				this.chart = echarts.init(this.$el);
+				this.chart.setOption(this.option);
+			}, 500);
+		},
+		gasChartMsg: {
+			handler(newVal, oldVal) {
+				console.log(newVal)
+				// this.chartData = newVal
+				console.log('newVal============')
+				// this.updateChart()
+			}
 		}
 	},
+	mounted() {
+		this.$el.addEventListener('resize', () => {
+			console.log('resziing.....');
+		});
+		this.chart = echarts.init(this.$el);
+		this.chart.setOption(this.option);
+	},
+	methods: {},
 };
 </script>
 

src/views/databoard/components/ISRAChart.vue

@@ -1,3 +1,10 @@
+<!-- 
+    filename: ISRAChart.vue
+    author: liubin
+    date: 2023-12-12 09:05:25
+    description: 
+-->
+
 <template>
 	<div class="isra-chart"></div>
 </template>
@@ -61,7 +68,9 @@ export default {
 	watch: {
 		israChartMsg: {
 			handler(newVal, oldVal) {
+				console.log(newVal)
 				this.chartData = newVal
+				console.log('newVal============')
 				this.updateChart()
 			}
 		}
@@ -90,18 +99,48 @@ export default {
 						color: '#fff',
 					},
 					subtextStyle: {
-						fontSize: 20,
+						fontSize: 16,
 						color: '#fff00',
 					},
 				},
 				series:[{
-						name: 'ISRA缺陷检测',
+						name: 'Access From',
 						type: 'pie',
-						center: ['50%', '40%'],
+						radius: ['45%', '65%'],
-						radius: ['45%', '70%'],
 						avoidLabelOverlap: true,
 						label: {
-							show: false
+							show: true,
+							position: 'outside',
+							formatter: ({ dataIndex, percent }) => {
+								const styleName = ['a', 'b', 'c', 'd'][dataIndex % 4];
+								return `{${styleName}|${percent}%}`;
+							},
+							rich: {
+								a: {
+									color: '#2760ff',
+									fontSize: 24,
+									borderWidth: 0,
+									textBorderWidth: 0,
+								},
+								b: {
+									color: '#518eec',
+									fontSize: 24,
+									borderWidth: 0,
+									textBorderWidth: 0,
+								},
+								c: {
+									color: '#0ee8e4',
+									fontSize: 24,
+									borderWidth: 0,
+									textBorderWidth: 0,
+								},
+								d: {
+									color: '#ddb523',
+									fontSize: 24,
+									borderWidth: 0,
+									textBorderWidth: 0,
+								},
+							},
 						},
 						labelLine: {
 							show: true,

src/views/databoard/components/NumRateChart.vue

@@ -1,204 +0,0 @@
-<template>
-  <div class="num-rate-chart"></div>
-</template>
-<script>
-import * as echarts from 'echarts';
-import resize from './../mixins/resize'
-export default {
-  name: 'NumRateChart',
-  mixins: [resize],
-  data() {
-    return {
-      chart: null
-    }
-  },
-  computed: {
-    productline() {
-      return this.$store.state.websocket.productline
-    }
-  },
-  watch:{
-    productline: {
-			handler(newVal, oldVal) {
-        if (newVal === oldVal) {
-          return false
-        }
-        this.updateChart()
-			}
-		}
-  },
-  mounted() {
-		this.$el.addEventListener('resize', () => {
-			console.log('resziing.....');
-		});
-		this.updateChart()
-	},
-  methods: {
-    updateChart() {
-      if (
-        this.chart !== null &&
-        this.chart !== '' &&
-        this.chart !== undefined
-      ) {
-        this.chart.dispose()
-      }
-      this.chart = echarts.init(this.$el);
-      let xData = []
-      let outputNum = []
-      let passRate = []
-      this.productline && this.productline.length > 0 && this.productline.map(item => {
-        xData.push(itme.productionLineId)
-        outputNum.push(itme.outputNum)
-        passRate.push(item.passRate)
-      })
-      var option = {
-        grid: { top: 32, right: 60, bottom: 20, left: 60 },
-        tooltip: {
-          trigger: "axis",
-          axisPointer: {
-            type: "shadow",
-          },
-          className: "num-rate-chart-tooltip"
-        },
-        legend: {
-          data: ['产线产量', '合格率'],
-          textStyle: {
-            color: "#DFF1FE",
-            fontSize: 12,
-          }
-        },
-        xAxis: [
-          {
-            type: 'category',
-            data: ['Y61', 'Y62', 'Y63', 'Y64', 'Y65', 'Y66', 'Y67'],
-            axisLabel: {
-              color: "#fff",
-              fontSize: 12,
-            },
-            axisPointer: {
-              type: 'shadow'
-            },
-            axisTick: { show: false },
-            axisLine: {
-              lineStyle: {
-                width: 1,
-                color: "#213259",
-              },
-            },
-          }
-        ],
-        yAxis: [
-          {
-            type: 'value',
-            name: '产量/片',
-            // min: 0,
-            // max: 250,
-            // interval: 50,
-            axisLabel: {
-              color: "#fff",
-              fontSize: 12,
-              formatter: '{value}'
-            },
-            axisLine: {
-              show: true,
-              lineStyle: {
-                color: "#213259",
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                color: "#213259a0",
-              },
-            }
-          },
-          {
-            type: 'value',
-            name: '良品率',
-            min: 0,
-            max: 25,
-            interval: 5,
-            axisLabel: {
-              color: "#fff",
-              fontSize: 12,
-              formatter: '{value} %'
-            },
-          axisLine: {
-            show: true,
-            lineStyle: {
-              color: "#213259",
-            },
-          },
-          splitLine: {
-            lineStyle: {
-              color: "#213259a0",
-            },
-          }
-          }
-        ],
-        series: [
-          {
-            name: '产线产量',
-            type: 'bar',
-            tooltip: {
-              valueFormatter: function (value) {
-                return value;
-              }
-            },
-            barWidth: 12,
-            itemStyle: {
-              color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                { offset: 0, color: '#5CB7FF' },
-                { offset: 1, color: '#364BFE' }
-              ])
-            },
-            data: [
-              2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
-            ]
-          },
-          {
-            name: '合格率',
-            type: 'line',
-            yAxisIndex: 1,
-            tooltip: {
-              valueFormatter: function (value) {
-                return value + '%';
-              }
-            },
-            itemStyle: {
-              color: '#FFD160'
-            },
-            areaStyle: {
-							color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                { offset: 0, color: '#FFCB59' + "40" },
-                { offset: 0.5, color: '#FFCB59' + "20" },
-                { offset: 1, color: '#FFCB59' + "00" },
-                ]),
-            },
-            lineStyle: {
-                width: 1
-            },
-            data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
-          }
-        ]
-      };
-      option && this.chart.setOption(option)
-    }
-  }
-}
-</script>
-<style scoped lang="scss">
-.num-rate-chart {
-	width: 100%;
-	height: 100%;
-}
-</style>
-<style>
-  .num-rate-chart-tooltip {
-    background: #0a2b4f77 !important;
-    border: none !important;
-    backdrop-filter: blur(12px);
-  }
-  .num-rate-chart-tooltip * {
-    color: #fff !important;
-  }
-</style>

src/views/databoard/components/SelectorBtnGroup.vue

@@ -11,7 +11,7 @@
 			class="btn"
 			v-for="opt in options"
 			:key="opt"
-			@click="clickBtn(opt)"
+			@click="active = opt"
 			:class="active == opt ? 'btn-active' : ''">
 			{{ opt }}
 		</button>
@@ -22,18 +22,15 @@
 export default {
 	name: 'SelectorBtnGroup',
 	components: {},
-	props: ['options', 'active'],
+	props: ['options'],
 	data() {
 		return {
-			// active: this.options[0] || 'default'
+			active: this.options[0] || 'default'
 		};
 	},
 	computed: {},
 	methods: {
-		clickBtn(opt) {
+		
-			// this.active = opt
-			this.$emit('emitFun', opt)
-		}
 	},
 };
 </script>

src/views/databoard/deepProcessing/BottomTwo.vue

@@ -1,34 +1,22 @@
 <template>
 	<div
 		class="bottom-two"
-		style="flex: 1; display: flex; gap: 20px; padding: 0px 16px">
-		<div class="left-side" style="flex: 1">
-			<div
 		style="
 			display: grid;
-					grid-template-rows: 462px;
+			gap: 16px;
+			grid-template-rows: 462px 462px;
 		">
-				<EnergyMonitoring />
+		<OrderStatus />
-			</div>
+		<YieldRate />
-		</div>
-		<div class="right-side" style="flex: 1">
-			<div
-				style="
-					display: grid;
-					grid-template-rows: 462px;
-				">
-				<NumRate />
-			</div>
-		</div>
 	</div>
 </template>
 
 <script>
-import NumRate from './NumRate';
+import OrderStatus from './OrderStatus.vue';
-import  EnergyMonitoring from './EnergyMonitoring';
+import YieldRate from './YieldRate.vue';
 export default {
 	name: 'BottomTwo',
-	components: { NumRate,  EnergyMonitoring },
+	components: { OrderStatus, YieldRate },
 	props: {},
 	data() {
 		return {};

src/views/databoard/deepProcessing/EnergyMonitoring.vue

@@ -1,30 +0,0 @@
-<template>
-  <div style="flex: 1;">
-    <Container name="能源监控" size="small" style="">
-      <div class="chart" style="height: 370px; margin-top: 8px;">
-        <EnergeMonitoringChart/>
-      </div>
-    </Container>
-  </div>
-</template>
-<script>
-import Container from '../components/Container.vue';
-import EnergeMonitoringChart from '../components/EnergeMonitoringChart';
-export default {
-  name: 'EnergyMonitoring',
-  components: { Container, EnergeMonitoringChart },
-  data() {
-    return {
-    }
-  },
-  methods: {
-  }
-}
-</script>
-<style lang='scss' scoped>
-.timeToggle {
-  position: absolute;
-  right: 20px;
-  top: 30px;
-}
-</style>

src/views/databoard/deepProcessing/NumRate.vue

@@ -1,30 +0,0 @@
-<template>
-  <div style="flex: 1;">
-    <Container name="产线产量及良品率" size="small" style="">
-      <div class="chart" style="height: 370px; margin-top: 8px;">
-        <NumRateChart />
-      </div>
-    </Container>
-  </div>
-</template>
-<script>
-import Container from '../components/Container';
-import NumRateChart from '../components/NumRateChart';
-export default {
-  name: 'NumRate',
-  components: { Container, NumRateChart },
-  data() {
-    return {
-    }
-  },
-  methods: {
-  }
-}
-</script>
-<style lang='scss' scoped>
-.timeToggle {
-  position: absolute;
-  right: 20px;
-  top: 30px;
-}
-</style>

src/views/databoard/deepProcessing/OrderStatus.vue

@@ -1,14 +1,14 @@
 <template>
   <div style="flex: 1;">
-    <Container name="设备报警" size="small" style="">
+    <Container name="订单完成情况" size="small" style="">
-      设备报警
+      digndna
     </Container>
   </div>
 </template>
 <script>
 import Container from '../components/Container.vue';
 export default {
-  name: 'EqAlarm',
+  name: 'OrderStatus',
   components: { Container },
 }
 </script>

src/views/databoard/deepProcessing/TopThree.vue

@@ -1,44 +1,22 @@
 <template>
 	<div
 		class="top-three"
-		style="flex: 1; display: flex; gap: 20px; padding: 0px 16px;">
-		<div class="left-side" style="flex: 1;">
-			<div
 		style="
 			display: grid;
-					grid-template-rows: 462px;
+			gap: 16px;
+			grid-template-rows: 462px 462px;
 		">
-				<EqAlarm />
+		<OrderStatus />
-			</div>
+		<YieldRate />
-		</div>
-		<div class="middle-side" style="flex: 1">
-			<div
-				style="
-					display: grid;
-					grid-template-rows: 462px;
-				">
-				<DefectSum />
-			</div>
-		</div>
-		<div class="righe-side" style="flex: 1">
-			<div
-				style="
-					display: grid;
-					grid-template-rows: 462px;
-				">
-				<WorkOrderMonitoring />
-			</div>
-		</div>
 	</div>
 </template>
 
 <script>
-import WorkOrderMonitoring from './WorkOrderMonitoring';
+import OrderStatus from './OrderStatus.vue';
-import EqAlarm from './EqAlarm'
+import YieldRate from './YieldRate.vue';
-import DefectSum from './DefectSum'
 export default {
 	name: 'TopThree',
-	components: { EqAlarm, DefectSum, WorkOrderMonitoring },
+	components: { OrderStatus, YieldRate },
 	props: {},
 	data() {
 		return {};

src/views/databoard/deepProcessing/WorkOrderMonitoring.vue

@@ -1,14 +0,0 @@
-<template>
-  <div style="flex: 1;">
-    <Container name="工单监控" size="small" style="">
-      设备报警111
-    </Container>
-  </div>
-</template>
-<script>
-import Container from '../components/Container.vue';
-export default {
-  name: 'WorkOrderMonitoring',
-  components: { Container },
-}
-</script>

src/views/databoard/deepProcessing/YieldRate.vue

@@ -1,14 +1,14 @@
 <template>
   <div style="flex: 1;">
-    <Container name="各工序缺陷汇总" size="small" style="">
+    <Container name="本日生产良品率" size="small" style="">
-      设备报警
+      0000987
     </Container>
   </div>
 </template>
 <script>
 import Container from '../components/Container.vue';
 export default {
-  name: 'DefectSum',
+  name: 'YieldRate',
   components: { Container },
 }
 </script>

src/views/databoard/deepProcessing/index.vue

@@ -6,10 +6,10 @@
 			class="deepProcessingBoard"
 			style="
 				position: absolute;
-				transform-origin: left top;
+				transform-origin: 16px 8px;
 				font-size: 16px;
-				top: 0px;
+				top: -8px;
-				left: 0px;
+				left: -16px;
 				width: 1920px;
 				height: 1080px;
 				display: flex;
@@ -19,17 +19,6 @@
 			:style="{transform:'scale('+scaleNum+')'}">
 			<KHeader :isFullScreen='isFullScreen' @screenfullChange='screenfullChange' topTitle='全厂总览驾驶舱'/>
 			<div
-				class="main-body"
-				style="
-					display: grid;
-					gap: 16px;
-					grid-template-rows: 462px 462px;
-				">
-				<TopThree />
-				<BottomTwo />
-			</div>
-
-			<!-- <div
 				class="main-body"
 				style="flex: 1; display: flex; gap: 20px; padding: 0px 16px">
 				<div class="left-side" style="flex: 1">
@@ -38,7 +27,7 @@
 				<div class="middle-side" style="flex: 1">
 					<BottomTwo />
 				</div>
-			</div> -->
+			</div>
 		</div>
 	</div>
 </template>
@@ -114,14 +103,14 @@ export default {
         })
         return false
       }
-      screenfull.toggle(this.$refs.deepProcessingContainerB)
+      screenfull.toggle(this.$refs.wholePlantContainerB)
     },
 		resetSize() {
-      let deepProcessingContainer = document.querySelector('#deepProcessingContainer')
+      let wholePlantContainerBox = document.querySelector('#wholePlantContainer')
       let rw = parseFloat(window.innerWidth)
       let rh = parseFloat(window.innerHeight)
-      let bw = parseFloat(deepProcessingContainer.style.width)
+      let bw = parseFloat(wholePlantContainerBox.style.width)
-      let bh = parseFloat(deepProcessingContainer.style.height)
+      let bh = parseFloat(wholePlantContainerBox.style.height)
 			let wx = 0
 			let hx = 0
 			if (screenfull.isFullscreen) {

src/views/databoard/kiln/EnergeCost.vue

@@ -31,24 +31,24 @@
 					justify-content: space-between;
 				">
 				<SelectorBtnGroup
-					:options="['电耗能', '天然气I', '天然气II']" @emitFun='toggleType' :active='chartType'/>
+					:options="['电耗能', '天然气I', '天然气II']" @emitFun='toggleType'/>
-				<SelectorBtnGroup :options="['周', '月', '年']" @emitFun='toggleDate' :active='chartTime'/>
+				<SelectorBtnGroup :options="['周', '月', '年']" @emitFun='toggleDate'/>
 			</div>
 			<div class="chart" style="height: 200px; margin-top: 8px;">
-				<GasChart :chartType='chartType' :chartTime='chartTime'/>
+				<GasChart />
 			</div>
 		</div>
 	</Container>
 </template>
 
 <script>
-import Container from '../components/Container';
+import Container from '../components/Container.vue';
 import ShadowRect from '../components/ShadowRect.vue';
 import SplitLine from '../components/line';
 import Switcher from '../components/Switcher';
 import EnergeTop from './EnergeTop';
 import GasChart from '../components/GasChart.vue';
-import SelectorBtnGroup from '../components/SelectorBtnGroup';
+import SelectorBtnGroup from '../components/SelectorBtnGroup.vue';
 export default {
 	name: 'EnergeCost',
 	components: {
@@ -62,44 +62,17 @@ export default {
 	},
 	props: {},
 	data() {
-		return {
+		return {};
-			chartType:'电耗能',
-			chartTime:'周'
-		};
-	},
-	computed: {
-		gasInfoMsg() {
-			return this.$store.state.websocket.gasInfo
-		},
 	},
+	computed: {},
 	methods: {
 		// 切换能源
-		toggleType(val) {
+		toggleType() {
-			console.log('能源' + val)
+
-			this.chartType = val
-			// if (val === '天然气I' || val === '天然气II') {
-			// 	if (this.chartTime === '周') {
-			// 		this.chartType = val
-			// 	} else {
-			// 		this.$message.warning('暂无数据')
-			// 	}
-			// }else {
-			// 	this.chartType = val
-			// }
 		},
 		// 切换时间
-		toggleDate(val) {
+		toggleDate() {
-			console.log('时间' + val)
+			
-			this.chartTime = val
-			// if (val === '月' || val === '年') {
-			// 	if (this.chartType === '电耗能') {
-			// 		this.chartTime = val
-			// 	} else {
-			// 		this.$message.warning('暂无数据')
-			// 	}
-			// }else{
-			// 	this.chartTime = val
-			// }
 		}
 	},
 };

src/views/databoard/kiln/EnergeTop.vue

@@ -23,7 +23,8 @@
 				style="
 					font-size: 16px;
 					line-height: 1.55;
-					text-align: center;
+					text-align: right;
+					padding-right: 8px;
 					letter-spacing: 1px;
 				">
 				余热发电
@@ -32,10 +33,11 @@
 				style="
 					font-size: 16px;
 					line-height: 1.55;
-					text-align: center;
+					text-align: right;
+					padding-right: 8px;
 					letter-spacing: 1px;
 				">
-				{{energyInfo.elecQty1}}kwh
+				1023kWh
 			</span>
 		</ShadowRect>
 
@@ -44,14 +46,14 @@
 				style="
 					font-size: 16px;
 					line-height: 1.25;
-					flex: 1;
+					flex: 1.2;
 					text-align: right;
 					padding-right: 8px;
 					letter-spacing: 3px;
 				">
 				<p style="margin: 0; line-height: inherit">水耗量</p>
 			</div>
-			<span style="font-size: 16px; line-height: 1.24; flex: 1">{{energyInfo.waterQty}}m³</span>
+			<span style="font-size: 16px; line-height: 1.24; flex: 1">32Km³</span>
 		</ShadowRect>
 
 		<ShadowRect>
@@ -59,14 +61,14 @@
 				style="
 					font-size: 16px;
 					line-height: 1.25;
-					flex: 1;
+					flex: 1.2;
 					text-align: right;
 					padding-right: 8px;
 					letter-spacing: 3px;
 				">
 				<p style="margin: 0; line-height: inherit">天然气I</p>
 			</div>
-			<span style="font-size: 16px; line-height: 1.24; flex: 1">{{sumGasInfo.sumGas1Now}}</span>
+			<span style="font-size: 16px; line-height: 1.24; flex: 1">322Km³</span>
 		</ShadowRect>
 
 		<ShadowRect>
@@ -74,14 +76,14 @@
 				style="
 					font-size: 16px;
 					line-height: 1.25;
-					flex: 1;
+					flex: 1.2;
 					text-align: right;
 					padding-right: 8px;
 					letter-spacing: 3px;
 				">
 				<p style="margin: 0; line-height: inherit">电耗量</p>
 			</div>
-			<span style="font-size: 16px; line-height: 1.24; flex: 1">{{energyInfo.elecQty2}}kwh</span>
+			<span style="font-size: 16px; line-height: 1.24; flex: 1">132kWh</span>
 		</ShadowRect>
 
 		<ShadowRect>
@@ -89,14 +91,14 @@
 				style="
 					font-size: 16px;
 					line-height: 1.25;
-					flex: 1;
+					flex: 1.2;
 					text-align: right;
 					padding-right: 8px;
 					letter-spacing: 3px;
 				">
 				<p style="margin: 0; line-height: inherit">天然气II</p>
 			</div>
-			<span style="font-size: 16px; line-height: 1.24; flex: 1">{{sumGasInfo.sumGas2Now}}</span>
+			<span style="font-size: 16px; line-height: 1.24; flex: 1">992Km³</span>
 		</ShadowRect>
 	</div>
 </template>
@@ -111,14 +113,7 @@ export default {
 	data() {
 		return {};
 	},
-	computed: {
+	computed: {},
-		sumGasInfo(){
-			return this.$store.state.websocket.sumGasInfo
-		},
-		energyInfo() {
-			return this.$store.state.websocket.energyInfo
-		}
-	},
 	methods: {},
 };
 </script>

src/views/databoard/kiln/FanSequence.vue

@@ -7,13 +7,13 @@
 
 <template>
 	<Container name="风机运行频率" size="middle" style="">
-		<!-- <div class="" style="position: absolute; top: 26px; left: 220px">
+		<div class="" style="position: absolute; top: 26px; left: 220px">
 			<Switcher />
-		</div> -->
+		</div>
 		<div
 			class="absolute"
 			style="
-				padding: 5px 12px;
+				padding: 12px;
 				display: grid;
 				grid-template-columns: repeat(2, 1fr);
 				grid-auto-rows: auto;
@@ -23,7 +23,7 @@
 				<span
 					style="
 						font-size: 18px;
-						line-height: 1.15;
+						line-height: 1.1;
 						flex: 3.5;
 						text-align: right;
 						padding-right: 8px;
@@ -31,7 +31,7 @@
 					">
 					{{ key }}:
 				</span>
-				<span style="font-size: 20px; line-height: 1.15; flex: 1">
+				<span style="font-size: 20px; line-height: 1; flex: 1">
 					{{ value }}Hz
 				</span>
 			</ShadowRect>

src/views/databoard/kiln/GasHandle.vue

@@ -1,3 +1,10 @@
+<!-- 
+    filename: GasHandle.vue
+    author: liubin
+    date: 2023-12-11 09:02:40
+    description: 
+-->
+
 <template>
 	<div class="gas-handle" style="flex: 2">
 		<Container name="烟气处理" size="large" style="">
@@ -19,11 +26,11 @@
 							flex: 1.2;
 							text-align: right;
 							padding-right: 8px;
-							letter-spacing: 3px;
+							letter-spacing: 1px;
 						">
 						氧气含量
 					</span>
-					<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.O2_float ? (exhaustGasInfo?.O2_float).toFixed(2): ''}}%</span>
+					<span style="font-size: 20px; line-height: 1.24; flex: 1">82%</span>
 				</ShadowRect>
 				<ShadowRect>
 					<div
@@ -38,7 +45,7 @@
 						<p style="margin: 0; line-height: inherit">一氧化氮</p>
 						<p style="margin: 0; line-height: inherit">排放浓度</p>
 					</div>
-					<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.NOX_float ? (exhaustGasInfo?.NOX_float).toFixed(2):''}}mg/m³</span>
+					<span style="font-size: 20px; line-height: 1.24; flex: 1">82%</span>
 				</ShadowRect>
 
 				<ShadowRect>
@@ -54,22 +61,23 @@
 						<p style="margin: 0; line-height: inherit">二氧化硫</p>
 						<p style="margin: 0; line-height: inherit">排放浓度</p>
 					</div>
-					<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.SO2_float ? (exhaustGasInfo?.SO2_float).toFixed(2): ''}}mg/m³</span>
+					<span style="font-size: 20px; line-height: 1.24; flex: 1">59mg/m³</span>
 				</ShadowRect>
 
 				<ShadowRect>
-					<span
+					<div
 						style="
 							font-size: 20px;
-							line-height: 1.24;
+							line-height: 1.5;
 							flex: 1.2;
 							text-align: right;
 							padding-right: 8px;
-							letter-spacing: 1px;
+							letter-spacing: 3px;
 						">
-						颗粒物浓度
+						<p style="margin: 0; line-height: inherit">二氧化氮</p>
-					</span>
+						<p style="margin: 0; line-height: inherit">排放浓度</p>
-					<span style="font-size: 20px; line-height: 1.24; flex: 1">{{exhaustGasInfo?.dust_float ? (exhaustGasInfo?.dust_float).toFixed(2) : ''}}mg/m³</span>
+					</div>
+					<span style="font-size: 20px; line-height: 1.24; flex: 1">82%</span>
 				</ShadowRect>
 			</div>
 			<KilnLine :horizontal="true" />
@@ -95,11 +103,11 @@
 						justify-content: space-between;
 					">
 					<SelectorBtnGroup
-						:options="['氧气含量', '二氧化硫', '一氧化氮', '颗粒物']" @emitFun='toggleType' :active='chartType'/>
+						:options="['氧气含量', '二氧化硫', '一氧化氮', '二氧化氮']" />
-					<SelectorBtnGroup :options="['日', '周', '月', '年']" @emitFun='toggleDate' :active='chartTime' />
+					<SelectorBtnGroup :options="['日', '周', '月', '年']" />
 				</div>
 				<div class="chart" style="height: 250px;margin-top: 10px;">
-					<FlueGas :chartType='chartType' :chartTime='chartTime'/>
+					<GasChart />
 				</div>
 			</div>
 		</Container>
@@ -107,12 +115,12 @@
 </template>
 
 <script>
-import Container from '../components/Container';
+import Container from '../components/Container.vue';
 import ShadowRect from '../components/ShadowRect.vue';
 import KilnLine from '../components/line';
 import Switcher from '../components/Switcher';
-import SelectorBtnGroup from '../components/SelectorBtnGroup';
+import SelectorBtnGroup from '../components/SelectorBtnGroup.vue';
-import FlueGas from '../components/FlueGas';
+import GasChart from '../components/GasChart.vue';
 
 export default {
 	name: 'GasHandle',
@@ -122,32 +130,14 @@ export default {
 		KilnLine,
 		Switcher,
 		SelectorBtnGroup,
-		FlueGas,
+		GasChart,
 	},
 	props: {},
 	data() {
-		return {
+		return {};
-			chartType:'氧气含量',
-			chartTime:'日'
-		};
-	},
-	computed: {
-		exhaustGasInfo() {
-			return this.$store.state.websocket.exhaustGasInfo
-		}
-	},
-	methods: {
-		// 烟气
-		toggleType(val) {
-			console.log('烟气' + val)
-			this.chartType = val
-		},
-		// 切换时间
-		toggleDate(val) {
-			console.log('时间' + val)
-			this.chartTime = val
-		}
 	},
+	computed: {},
+	methods: {},
 };
 </script>
 

src/views/databoard/kiln/IsraCheck.vue

@@ -33,7 +33,7 @@
 </template>
 
 <script>
-import Container from '../components/Container';
+import Container from '../components/Container.vue';
 import ShadowRect from '../components/ShadowRect.vue';
 import ISRAChart from '../components/ISRAChart.vue';
 

src/views/databoard/kiln/MaterialCost.vue

@@ -34,7 +34,7 @@
 							{{item.materialUsed}}
 						</span>
 						<span style="color: #fff; font-size: 16px; letter-spacing: 1px">
-							- {{item.materialName}}/kg-
+							- {{item.materialName}} -
 						</span>
 					</div>
 				</ShadowRect>
@@ -60,7 +60,7 @@
 							{{item.materialUsed}}
 						</span>
 						<span style="color: #fff; font-size: 16px; letter-spacing: 1px">
-							- {{item.materialName}}/kg-
+							- {{item.materialName}} -
 						</span>
 					</div>
 				</ShadowRect>
@@ -71,7 +71,7 @@
 </template>
 
 <script>
-import Container from '../components/Container';
+import Container from '../components/Container.vue';
 import ShadowRect from '../components/ShadowRect.vue';
 export default {
 	name: 'MaterialCost',

src/views/databoard/kiln/RightTwo.vue

@@ -19,11 +19,11 @@
 </template>
 
 <script>
-import Container from '../components/Container';
+import Container from '../components/Container.vue';
 import ShadowRect from '../components/ShadowRect.vue';
 import KilnLine from '../components/line';
 import Switcher from '../components/Switcher';
-import SelectorBtnGroup from '../components/SelectorBtnGroup';
+import SelectorBtnGroup from '../components/SelectorBtnGroup.vue';
 import KilnInfo from './KilnInfo.vue';
 import GasHandle from './GasHandle.vue';
 export default {

src/views/databoard/kiln/index.vue

@@ -1,3 +1,10 @@
+<!-- 
+    filename: KilnDataBoard.vue
+    author: liubin
+    date: 2023-12-04 16:51:00
+    description: 
+-->
+
 <template>
 	<div id='kilnContainerB' ref='kilnContainerB' style="width: 100%;height: 100%;">
 		<div
@@ -6,10 +13,10 @@
 			class="KilnDataBoard"
 			style="
 				position: absolute;
-				transform-origin: left top;
+				transform-origin: 16px 8px;
 				font-size: 16px;
-				top: 0px;
+				top: -8px;
-				left: 0px;
+				left: -16px;
 				width: 1920px;
 				height: 1080px;
 				display: flex;
@@ -38,19 +45,15 @@ import LeftFour from './LeftFour';
 import RightTwo from './RightTwo.vue';
 import screenfull from 'screenfull'
 import { debounce } from '@/utils/debounce'
+import { getDcsMsg, getMesMsg } from './../utils/wsInterface'
 
 export default {
-	name: 'Kiln',
+	name: 'KilnDataBoard',
 	components: {
 		KHeader,
 		LeftFour,
 		RightTwo,
 	},
-	computed:{
-		sidebarStatus() {
-			return this.$store.state.app.sidebar.opened;
-		}
-	},
 	// provide() {
 	// 	return {
 	// 		resizeChart: null,
@@ -62,11 +65,6 @@ export default {
 			scaleNum: 0.8
 		};
 	},
-	watch: {
-		sidebarStatus() {
-			this.boxReset()
-		},
-	},
 	created() {
 		this.init()
 	},
@@ -81,6 +79,14 @@ export default {
     window.addEventListener('resize', () => {
       this.boxReset()
     })
+		// this.getMes()
+		// closeWebsocket()
+		getDcsMsg()
+		// getMesMsg()
+		console.log('mounted...........')
+	},
+	destroyed() {
+		console.log('destroyed...........')
 	},
 	methods: {
 		change() {

src/views/databoard/utils/wsInterface.js

@@ -1,4 +1,4 @@
-import { connectWebsocket, closeWebsocket } from './websocket'
+import { connectWebsocket, closeWebsocket } from './../utils/websocket'
 import store from "@/store";
 
 // 创建dcs链接
@@ -27,10 +27,6 @@ export const getDcsMsg = () => {
           store.dispatch({type: "websocket/setGasInfo", payload: msgData.data})
           break;
         }
-        case "SumGasInfo": {
-          store.dispatch({type: "websocket/setSumGasInfo", payload: msgData.data})
-          break;
-        }
         default:
       }
     },
@@ -45,110 +41,54 @@ export const getDcsMsg = () => {
 export const getMesMsg = () => {
   const sj = new Date().getTime()
   // ISRA
-  // connectWebsocket(
-  //   // 测试地址
-  //   'ws://10.70.2.2:8080/websocket/message?userId=KI'+sj,
-  //   // 传递给后台的数据
-  //   '',
-  //   // 成功拿到后台返回的数据的回调函数
-  //   (data) => {
-  //     console.log('mes ISRA成功的回调函数, 接收到的data数据: ', data)
-  //     let msgData = JSON.parse(data)
-  //     if (msgData == null) return;
-  //     switch (msgData?.type) {
-  //       case "israKiln": {
-  //         store.dispatch({type: "websocket/setIsraKiln", payload:msgData.detData.dayStatistic})
-  //         break;
-  //       }
-  //       // case "KilnInfo": {
-  //       //   // store.dispatch({type: "websocket/setKilnInfo", payload: msgData.data.kilnInfo})
-  //       //   break;
-  //       // }
-  //       default:
-  //     }
-  //   },
-  //   // websocket连接失败的回调函数
-  //   (err) => {
-  //     console.log('失败的回调函数', err)
-  //   }
-  // )
-
-  // // 原料 MA
-  // connectWebsocket(
-  //   // 测试地址
-  //   'ws://10.70.2.2:8080/websocket/message?userId=MA'+sj,
-  //   // 传递给后台的数据
-  //   '',
-  //   // 成功拿到后台返回的数据的回调函数
-  //   (data) => {
-  //     console.log('mes 原料成功的回调函数, 接收到的data数据: ', data)
-  //     let msgData = JSON.parse(data)
-  //     if (msgData == null) return;
-  //     switch (msgData?.type) {
-  //       case "material": {
-  //         store.dispatch({type: "websocket/setMaterial", payload:msgData.data})
-  //         break;
-  //       }
-  //       // case "KilnInfo": {
-  //       //   // store.dispatch({type: "websocket/setKilnInfo", payload: msgData.data.kilnInfo})
-  //       //   break;
-  //       // }
-  //       default:
-  //     }
-  //   },
-  //   // websocket连接失败的回调函数
-  //   (err) => {
-  //     console.log('失败的回调函数', err)
-  //   }
-  // )
-
-   // 能耗 EN
-  //  connectWebsocket(
-  //   // 测试地址
-  //   'ws://10.70.2.2:8080/websocket/message?userId=ENERGY'+sj,
-  //   // 传递给后台的数据
-  //   '',
-  //   // 成功拿到后台返回的数据的回调函数
-  //   (data) => {
-  //     console.log('mes 能耗成功的回调函数, 接收到的data数据: ', data)
-  //     let msgData = JSON.parse(data)
-  //     if (msgData == null) return;
-  //     switch (msgData?.type) {
-  //       case "EnergyInfo": {
-  //         store.dispatch({type: "websocket/setEnergyInfo", payload:msgData.data})
-  //         break;
-  //       }
-  //       default:
-  //     }
-  //   },
-  //   // websocket连接失败的回调函数
-  //   (err) => {
-  //     console.log('失败的回调函数', err)
-  //   }
-  // )
-
-  // 烟气 GAS
   connectWebsocket(
     // 测试地址
-    'ws://10.70.2.2:8080/websocket/message?userId=GAS'+sj,
+    'ws://10.70.2.2:8080/websocket/message?userId=KI'+sj,
     // 传递给后台的数据
     '',
     // 成功拿到后台返回的数据的回调函数
     (data) => {
-      console.log('mes 烟气成功的回调函数, 接收到的data数据: ', data)
+      console.log('mes ISRA成功的回调函数, 接收到的data数据: ', data)
       let msgData = JSON.parse(data)
       if (msgData == null) return;
       switch (msgData?.type) {
-        case "exhaustGas": {
+        case "israKiln": {
-          store.dispatch({type: "websocket/setExhaustGasInfo", payload:msgData.realtime})
+          store.dispatch({type: "websocket/setIsraKiln", payload:msgData.detData.dayStatistic})
-          store.dispatch({type: "websocket/setExhaustGasChart", payload:{
-            dayTrend: msgData.dayTrend,
-            weekTrend: msgData.weekTrend,
-            monthTrend: msgData.monthTrend,
-            yearTrend: msgData.yearTrend,
-          }})
           break;
         }
+        // case "KilnInfo": {
+        //   // store.dispatch({type: "websocket/setKilnInfo", payload: msgData.data.kilnInfo})
+        //   break;
+        // }
+        default:
+      }
+    },
+    // websocket连接失败的回调函数
+    (err) => {
+      console.log('失败的回调函数', err)
+    }
+  )
+
+  // 原料 MA
+  connectWebsocket(
+    // 测试地址
+    'ws://10.70.2.2:8080/websocket/message?userId=MA'+sj,
+    // 传递给后台的数据
+    '',
+    // 成功拿到后台返回的数据的回调函数
+    (data) => {
+      console.log('mes 原料成功的回调函数, 接收到的data数据: ', data)
+      let msgData = JSON.parse(data)
+      if (msgData == null) return;
+      switch (msgData?.type) {
+        case "material": {
+          store.dispatch({type: "websocket/setMaterial", payload:msgData.data})
+          break;
+        }
+        // case "KilnInfo": {
+        //   // store.dispatch({type: "websocket/setKilnInfo", payload: msgData.data.kilnInfo})
+        //   break;
+        // }
         default:
       }
     },

src/views/databoard/wholePlant/DefectClass.vue

@@ -1,38 +0,0 @@
-<template>
-  <div style="flex: 1;">
-    <Container name="产线当日缺陷分类" size="small">
-      <SelectorBtnGroup class="typeToggle" :options="['Y61', 'Y62', 'Y63', 'Y64', 'Y65']" @emitFun='toggleType' :active='chartType' />
-      <div class="chart" style="height: 370px; margin-top: 8px;">
-        <DefectClassChart :chartType='chartType'/>
-      </div>
-    </Container>
-  </div>
-</template>
-<script>
-import Container from '../components/Container';
-import SelectorBtnGroup from '../components/SelectorBtnGroup';
-import DefectClassChart from '../components/DefectClassChart';
-export default {
-  name: 'DefectClass',
-  components: { Container, SelectorBtnGroup, DefectClassChart },
-  data() {
-    return {
-      chartType:'Y61'
-    }
-  },
-  methods: {
-    // 切换产线
-		toggleType(val) {
-			console.log('产线' + val)
-			this.chartType = val
-		}
-  }
-}
-</script>
-<style lang='scss' scoped>
-.typeToggle {
-  position: absolute;
-  right: 20px;
-  top: 30px;
-}
-</style>

src/views/databoard/wholePlant/DefectStatistics.vue

@@ -1,38 +0,0 @@
-<template>
-  <div style="flex: 1;">
-    <Container name="产线缺陷统计" size="small">
-        <SelectorBtnGroup class="timeToggle" :options="['日', '周', '月', '年']" @emitFun='toggleDate' :active='chartTime' />
-        <div class="chart" style="height: 238px; margin-top: 8px;">
-          <DefectChart :chartTime='chartTime'/>
-        </div>
-      </Container>
-  </div>
-</template>
-<script>
-import Container from '../components/Container';
-import SelectorBtnGroup from '../components/SelectorBtnGroup';
-import DefectChart from '../components/DefectChart';
-export default {
-  name: 'DefectStatistics',
-  components: { Container, SelectorBtnGroup, DefectChart },
-  data() {
-    return {
-      chartTime:'日'
-    }
-  },
-  methods: {
-    // 切换时间
-		toggleDate(val) {
-			console.log('时间' + val)
-			this.chartTime = val
-		}
-  }
-}
-</script>
-<style lang='scss' scoped>
-.timeToggle {
-  position: absolute;
-  right: 20px;
-  top: 20px;
-}
-</style>

src/views/databoard/wholePlant/LeftTwo.vue

@@ -4,7 +4,7 @@
 		style="
 			display: grid;
 			gap: 16px;
-			grid-template-rows: 308px 616px;
+			grid-template-rows: 462px 462px;
 		">
 		<OrderStatus />
 		<YieldRate />

src/views/databoard/wholePlant/MiddleTwo.vue

@@ -4,19 +4,19 @@
 		style="
 			display: grid;
 			gap: 16px;
-			grid-template-rows: 605px 320px;
+			grid-template-rows: 462px 462px;
 		">
-		<GasHandle />
+		<OrderStatus />
-		<DefectStatistics />
+		<YieldRate />
 	</div>
 </template>
 
 <script>
-import GasHandle from './../kiln/GasHandle';
+import OrderStatus from './OrderStatus.vue';
-import DefectStatistics from './DefectStatistics';
+import YieldRate from './YieldRate.vue';
 export default {
 	name: 'MiddleFour',
-	components: { GasHandle, DefectStatistics },
+	components: { OrderStatus, YieldRate },
 	props: {},
 	data() {
 		return {};

src/views/databoard/wholePlant/OrderStatus.vue

@@ -1,155 +1,14 @@
 <template>
   <div style="flex: 1;">
-    <Container name="订单完成情况" size="small" class="wholeOrder">
+    <Container name="订单完成情况" size="small" style="">
-      <div style="width: 100%;padding: 10px; 20px">
+      digndna
-        <el-table
-        :header-cell-style="{background:'rgba(4, 74, 132, 0.8)',color:'#fff',height: '40px',lineHeight: '40px', padding: 0,fontSize:'16px'}"
-        :row-style="setRowStyle"
-        :data="list"
-        height="225"
-        border
-        style="width: 100%; background: transparent"
-      >
-        <el-table-column
-          v-for="item in tableProps"
-          :key="item.prop"
-          :show-overflow-tooltip="item.showOverflowtooltip"
-          v-bind="item"
-        >
-          <template slot-scope="scope">
-            <component :is="item.subcomponent" v-if="item.subcomponent" :inject-data="{...scope.row, ...item}" @emitData="emitData" />
-            <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
-          </template>
-        </el-table-column>
-        <slot name="content" />
-      </el-table>
-      </div>
     </Container>
   </div>
 </template>
 <script>
-// :header-cell-style="{background:'rgba(79,114,136,0.29)',color:'#fff'}"
-const tableProps = [
-    {
-      prop: 'time',
-      label: '添加时间',
-      filter: parseTime,
-      minWidth: 140
-    },
-    {
-      prop: 'name',
-      label: '订单名称',
-      minWidth: 120,
-      showOverflowtooltip: true
-    },
-    {
-      prop: 'code',
-      label: '订单编码',
-      minWidth: 180
-    },
-    {
-      prop: 'customerId',
-      label: '客户',
-      showOverflowtooltip: true
-    }
-  ]
 import Container from '../components/Container.vue';
-import { parseTime } from '@/utils/ruoyi'
 export default {
   name: 'OrderStatus',
-  filters: {
-    commonFilter: (source, filterType = a => a) => {
-      return filterType(source)
-    }
-  },
   components: { Container },
-  data() {
-    return {
-      tableProps,
-      list:[
-        {time: '2023-12-12', name: '名称名称'},
-        {time: '2023-12-13', name: '名称名称'},
-        {time: '2023-12-14', name: '名称名称'},
-        {time: '2023-12-15', name: '名称名称'},
-        {time: '2023-12-16', name: '名称名称'},
-        {time: '2023-12-17', name: '名称名称'},
-        {time: '2023-12-18', name: '名称名称'},
-        {time: '2023-12-19', name: '名称名称'},
-        {time: '2023-12-20', name: '名称名称'},
-        {time: '2023-12-21', name: '名称名称'}
-      ]
-    }
-  },
-  mounted() {
-    
-  },
-  methods:{
-    setRowStyle(v) {
-      if (v.rowIndex % 2 === 0) {
-        return {
-          background: 'rgba(11, 84, 153, 0.5)',
-          color: 'rgba(255,255,255,0.8)',
-          height: '40px',
-          lineHeight: '40px',
-          padding: 0,
-          fontSize: '16px'
-        }
-      } else {
-        return {
-          background: 'rgba(4, 74, 132, 0.5)',
-          color: 'rgba(255,255,255,0.8)',
-          height: '40px',
-          lineHeight: '40px',
-          padding: 0,
-          fontSize: '16px'
-        }
-      }
-    }
-  }
 }
 </script>
-<style lang='scss'>
-.wholeOrder {
-  .el-table {
-    border: 0;
-  }
-  .el-table::before,.el-table--border::after {
-    background-color: transparent;
-  }
-  .el-table th,td{
-    border-color: #0D1728 !important;
-    padding: 0;
-  }
-  .el-table tr {
-    background: transparent;
-  }
-  .el-table__row:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-    }
-
-  .el-table__row--striped:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-  }
-  // .el-table {
-  //   border: 0;
-  // }
-  // .el-table::before,.el-table--border::after {
-  //   background-color: transparent;
-  // }
-  // .el-table th,td{
-  //   border-color: #0D1728 !important;
-  //   padding: 0;
-  // }
-  // .el-table tr {
-  //   background: transparent;
-  // }
-  // .el-table__row:hover > td {
-  //   background-color: rgba(79,114,136,0.29) !important;
-  //   }
-
-  // .el-table__row--striped:hover > td {
-  //   background-color: rgba(79,114,136,0.29) !important;
-  // }
-  
-}
-</style>

src/views/databoard/wholePlant/RightTwo.vue

@@ -6,17 +6,17 @@
 			gap: 16px;
 			grid-template-rows: 462px 462px;
 		">
-		<EnergeCost />
+		<OrderStatus />
-		<DefectClass />
+		<YieldRate />
 	</div>
 </template>
 
 <script>
-import EnergeCost from './../kiln/EnergeCost.vue';
+import OrderStatus from './OrderStatus.vue';
-import DefectClass from './DefectClass.vue';
+import YieldRate from './YieldRate.vue';
 export default {
 	name: 'RightFour',
-	components: { EnergeCost, DefectClass },
+	components: { OrderStatus, YieldRate },
 	props: {},
 	data() {
 		return {};

src/views/databoard/wholePlant/YieldRate.vue

@@ -1,127 +1,14 @@
 <template>
-  <div style="flex: 2;" class="aaa">
+  <div style="flex: 1;">
     <Container name="本日生产良品率" size="small" style="">
-      <el-table
+      0000987
-        :header-cell-style="{background:'rgba(4, 74, 132, 0.8)',color:'#fff',height: '40px',lineHeight: '40px', padding: 0,fontSize:'16px'}"
-        :row-style="setRowStyle"
-        :data="list"
-        border
-        style="width: 100%; background: transparent"
-      >
-        <el-table-column
-          v-for="item in tableProps"
-          :key="item.prop"
-          :show-overflow-tooltip="item.showOverflowtooltip"
-          v-bind="item"
-        >
-          <template slot-scope="scope">
-            <component :is="item.subcomponent" v-if="item.subcomponent" :inject-data="{...scope.row, ...item}" @emitData="emitData" />
-            <span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span>
-          </template>
-        </el-table-column>
-        <slot name="content" />
-      </el-table>
     </Container>
   </div>
 </template>
 <script>
-const tableProps = [
+import Container from '../components/Container.vue';
-    {
-      prop: 'time',
-      label: '添加时间',
-      filter: parseTime,
-      minWidth: 140
-    },
-    {
-      prop: 'name',
-      label: '订单名称',
-      minWidth: 120,
-      showOverflowtooltip: true
-    },
-    {
-      prop: 'code',
-      label: '订单编码',
-      minWidth: 180
-    },
-    {
-      prop: 'customerId',
-      label: '客户',
-      showOverflowtooltip: true
-    }
-  ]
-import Container from '../components/Container';
-import { parseTime } from '@/utils/ruoyi'
 export default {
   name: 'YieldRate',
-  filters: {
-    commonFilter: (source, filterType = a => a) => {
-      return filterType(source)
-    }
-  },
   components: { Container },
-  data() {
-    return {
-      tableProps,
-      list:[
-        {time: '2023-12-12', name: '名称名称'},
-        // {time: '2023-12-13', name: '名称名称'},
-        // {time: '2023-12-14', name: '名称名称'},
-        // {time: '2023-12-15', name: '名称名称'},
-        // {time: '2023-12-16', name: '名称名称'},
-        // {time: '2023-12-17', name: '名称名称'},
-        // {time: '2023-12-18', name: '名称名称'},
-        // {time: '2023-12-19', name: '名称名称'},
-        // {time: '2023-12-20', name: '名称名称'},
-        // {time: '2023-12-21', name: '名称名称'}
-      ]
-    }
-  },
-  methods: {
-    setRowStyle(v) {
-      if (v.rowIndex % 2 === 0) {
-        return {
-          background: 'rgba(11, 84, 153, 1)',
-          color: 'rgba(255,255,255,0.8)',
-          height: '40px',
-          lineHeight: '40px',
-          padding: 0,
-          fontSize: '16px'
-        }
-      } else {
-        return {
-          background: 'rgba(4, 74, 132, 1)',
-          color: 'rgba(255,255,255,0.8)',
-          height: '40px',
-          lineHeight: '40px',
-          padding: 0,
-          fontSize: '16px'
-        }
-      }
-    }
-  }
 }
 </script>
-<style lang='scss'>
-.aaa {
-  .el-table {
-    border: 0;
-  }
-  .el-table::before,.el-table--border::after {
-    background-color: transparent;
-  }
-  .el-table th,td{
-    border-color: #0D1728 !important;
-    padding: 0;
-  }
-  .el-table tr {
-    background: transparent;
-  }
-  .el-table__row:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-    }
-
-  .el-table__row--striped:hover > td {
-    background-color: rgba(79,114,136,0.29) !important;
-  }
-}
-</style>

src/views/databoard/wholePlant/index.vue

@@ -8,8 +8,8 @@
 				position: absolute;
 				transform-origin: 16px 8px;
 				font-size: 16px;
-				top: 0px;
+				top: -8px;
-				left: 0px;
+				left: -16px;
 				width: 1920px;
 				height: 1080px;
 				display: flex;
@@ -42,6 +42,7 @@ import MiddleTwo from './MiddleTwo';
 import RightTwo from './RightTwo';
 import screenfull from 'screenfull'
 import { debounce } from '@/utils/debounce'
+import { getDcsMsg, getMesMsg } from './../utils/wsInterface'
 
 export default {
 	name: 'wholePlantBoard',
@@ -76,6 +77,9 @@ export default {
     window.addEventListener('resize', () => {
       this.boxReset()
     })
+		// closeWebsocket()
+		// getDcsMsg()
+		// getMesMsg()
 		console.log('mounted...........')
 	},
 	destroyed() {

src/views/login.vue

@@ -47,7 +47,7 @@
 						向世界先进水平挑战，为人类社会文明做贡献
 					</p>
 				</div>
-				<!-- <video
+				<video
 					src="/static/videos/login.webm"
 					muted
 					autoplay
@@ -58,7 +58,7 @@
 						top: 28%;
 						width: 100%;
 						height: 70%;
-					"></video> -->
+					"></video>
 			</div>
 			<!-- 表单 -->
 			<div class="field">

src/views/specialEquipment/basic/FireFighthing.vue

@@ -170,12 +170,7 @@ export default {
 				{ width: 256, prop: 'code', label: '设备编码' },
 				{ prop: 'location', label: '位置' },
 				{ prop: 'responsiblePeopleName', label: '负责人' },
-				{
+				{ prop: 'dueTime', label: '有效期至' },
-					prop: 'dueDate',
-					label: '有效期至',
-					filter: (val) =>
-						val != null ? moment(val).format('yyyy-MM-DD HH:mm:ss') : '--',
-				},
 				{ prop: 'remark', label: '备注' },
 			],
 			searchBarFormConfig: [
@@ -255,8 +250,8 @@ export default {
 				[
 					{
 						datetime: true,
-						label: '有效期',
+						label: '有效期至',
-						prop: 'dueDate',
+						prop: 'dueTime',
 						bind: { clearable: true },
 					},
 					{},

src/views/specialEquipment/maintain/Record.vue

@@ -195,21 +195,18 @@ export default {
 						{ id: 3, name: '特种设备' },
 					],
 					filterable: true,
-					defaultSelect: null
 				},
 				{
 					type: 'select',
 					label: '设备',
 					placeholder: '请选择设备',
 					param: 'equipmentId',
-					defaultSelect: null
 				},
 				{
 					type: 'select',
 					label: '计划名称',
 					placeholder: '请选择计划名称',
 					param: 'maintainPlanId',
-					defaultSelect: null
 				},
 				// 开始结束时间
 				{
@@ -223,7 +220,6 @@ export default {
 					endPlaceholder: '结束日期',
 					defaultTime: ['00:00:00', '23:59:59'],
 					param: 'startTime',
-					defaultSelect: null
 					// width: 350,
 				},
 				{
@@ -233,7 +229,6 @@ export default {
 						{ name: '是', id: 1 },
 						{ name: '否', id: 2 },
 					],
-					defaultSelect: null,
 					param: 'relatePlan',
 				},
 				{
@@ -439,16 +434,12 @@ export default {
 	created() {
 		this.initSearchBar();
 		if (this.$route.query) {
-			this.queryParams.specialType =
-				this.$route.query?.specialType ?? undefined;
 			this.queryParams.equipmentId =
 				this.$route.query?.equipmentId ?? undefined;
 			this.queryParams.maintainPlanId =
 				this.$route.query?.maintainPlanId ?? undefined;
 			this.queryParams.relatePlan = this.$route.query?.relatePlan ?? undefined;
 			this.queryParams.startTime = this.$route.query?.createTime ?? undefined;
-			this.searchBarFormConfig[0].defaultSelect =
-				this.$route.query.specialType ?? undefined;
 			this.searchBarFormConfig[1].defaultSelect =
 				this.$route.query.equipmentId ?? undefined;
 			this.searchBarFormConfig[2].defaultSelect =

src/websocket/websocket.js

@@ -1,176 +0,0 @@
-/**
- * 发起websocket请求函数
- * @param {string} url ws连接地址
- * @param {Object} agentData 传给后台的参数
- * @param {function} successCallback 接收到ws数据，对数据进行处理的回调函数
- * @param {function} errCallback ws连接错误的回调函数
- */
-export function WsConnect(url, agentData, successCallback, errCallback) {
-  this.wsUrl = url;
-  this.wsObj = null;
-  // 是否执行重连 true/不执行 ； false/执行
-  this.lockReconnect = false;
-  // 重连定时器
-  this.wsCreateHandler = null;
-  // 连接成功，执行回调函数
-  this.messageCallback = successCallback;
-  // 连接失败，执行回调函数
-  this.errorCallback = errCallback;
-  // 发送给后台的数据
-  this.sendDatas = agentData;
-  // 创建ws函数
-  this.createWebSoket = () => {
-    if (typeof WebSocket === "undefined") {
-      writeToScreen("您的浏览器不支持WebSocket，无法获取数据");
-      return false;
-    }
-    try {
-      this.wsObj = new WebSocket(url);
-      initWsEventHandle();
-    } catch (e) {
-      writeToScreen("连接异常，开始重连");
-      reconnect();
-    }
-  };
-  // 手动关闭websocket （这里手动关闭会执行onclose事件）
-  this.closeWebsocket = () => {
-    if (this.wsObj) {
-      writeToScreen("手动关闭websocket");
-      this.wsObj.close(); // 关闭websocket
-      // this.wsObj.onclose() // 关闭websocket(如果上面的关闭不生效就加上这一条)
-      // 关闭重连
-      this.lockReconnect = true;
-      this.wsCreateHandler && clearTimeout(this.wsCreateHandler);
-      // 关闭心跳检查
-      // heartCheck.stop();
-    }
-  };
-  const initWsEventHandle = () => {
-    try {
-      // 连接成功
-      this.wsObj.onopen = (event) => {
-        onWsOpen(event);
-        // heartCheck.start();
-      };
-
-      // 监听服务器端返回的信息
-      this.wsObj.onmessage = (event) => {
-        onWsMessage(event);
-        // heartCheck.start();
-      };
-
-      this.wsObj.onclose = (event) => {
-        writeToScreen("onclose执行关闭事件");
-        onWsClose(event);
-      };
-
-      this.wsObj.onerror = (event) => {
-        writeToScreen("onerror执行error事件，开始重连");
-        onWsError(event);
-        reconnect();
-      };
-    } catch (err) {
-      writeToScreen("绑定事件没有成功，开始重连");
-      reconnect();
-    }
-  };
-
-  const onWsOpen = (event) => {
-    writeToScreen("CONNECT");
-    // // 客户端与服务器端通信
-    // wsObj.send('我发送消息给服务端');
-    // 添加状态判断，当为OPEN时，发送消息
-    if (this.wsObj.readyState === this.wsObj.OPEN) {
-      // wsObj.OPEN = 1
-      // 发给后端的数据需要字符串化
-      this.wsObj.send(JSON.stringify(this.sendDatas));
-    }
-    if (this.wsObj.readyState === this.wsObj.CLOSED) {
-      // wsObj.CLOSED = 3
-      writeToScreen("wsObj.readyState=3, ws连接异常，开始重连");
-      reconnect();
-      this.errorCallback(event);
-    }
-  };
-  const onWsMessage = (event) => {
-    const jsonStr = event.data;
-    writeToScreen("onWsMessage接收到服务器的数据: ", jsonStr);
-    this.messageCallback(jsonStr);
-  };
-  const onWsClose = (event) => {
-    writeToScreen("DISCONNECT");
-    // e.code === 1000  表示正常关闭。 无论为何目的而创建, 该链接都已成功完成任务。
-    // e.code !== 1000  表示非正常关闭。
-    console.log("onclose event: ", event);
-    if (event && event.code !== 1000) {
-      writeToScreen("非正常关闭");
-      this.errorCallback(event);
-      // 如果不是手动关闭，这里的重连会执行；如果调用了手动关闭函数，这里重连不会执行
-      reconnect();
-    }
-  };
-  const onWsError = (event) => {
-    writeToScreen("onWsError: ", event.data);
-    this.errorCallback(event);
-  };
-
-  const writeToScreen = (massage) => {
-    console.log(massage);
-  };
-
-  // 重连函数
-  const reconnect = () => {
-    if (this.lockReconnect) {
-      return;
-    }
-    writeToScreen("3秒后重连");
-    this.lockReconnect = true;
-    // 没连接上会一直重连，设置延迟避免请求过多
-    this.wsCreateHandler && clearTimeout(this.wsCreateHandler);
-    this.wsCreateHandler = setTimeout(() => {
-      writeToScreen("重连..." + this.wsUrl);
-      this.createWebSoket();
-      this.lockReconnect = false;
-      writeToScreen("重连完成");
-    }, 3000);
-  };
-
-  // 心跳检查（看看websocket是否还在正常连接中）
-  // let heartCheck = {
-  //   timeout: 15000,
-  //   timeoutObj: null,
-  //   serverTimeoutObj: null,
-  //   // 重启
-  //   reset() {
-  //     clearTimeout(this.timeoutObj);
-  //     clearTimeout(this.serverTimeoutObj);
-  //     this.start();
-  //   },
-  //   // 停止
-  //   stop() {
-  //     clearTimeout(this.timeoutObj);
-  //     clearTimeout(this.serverTimeoutObj);
-  //   },
-  //   // 开启定时器
-  //   start() {
-  //     this.timeoutObj && clearTimeout(this.timeoutObj);
-  //     this.serverTimeoutObj && clearTimeout(this.serverTimeoutObj);
-  //     // 15s之内如果没有收到后台的消息，则认为是连接断开了，需要重连
-  //     this.timeoutObj = setTimeout(() => {
-  //       writeToScreen("心跳检查，发送ping到后台");
-  //       try {
-  //         const datas = { ping: true };
-  //         this.wsObj.send(JSON.stringify(datas));
-  //       } catch (err) {
-  //         writeToScreen("发送ping异常");
-  //       }
-  //       console.log("内嵌定时器this.serverTimeoutObj: ", this.serverTimeoutObj);
-  //       // 内嵌定时器
-  //       this.serverTimeoutObj = setTimeout(() => {
-  //         writeToScreen("没有收到后台的数据，重新连接");
-  //         reconnect();
-  //       }, this.timeout);
-  //     }, this.timeout);
-  //   },
-  // };
-}

src/websocket/wsInterface.js

@@ -1,227 +0,0 @@
-import { WsConnect } from './websocket'
-import store from "@/store";
-
-// 创建websocket链接
-
-const timestr = new Date().getTime()
-const dcsConn = new WsConnect(
-  // websocket地址
-  'ws://10.70.180.10:8081/xc-screen/websocket/dcsmsg'+timestr,
-  // 传递给后台的数据
-  '',
-  (data) => {
-    // console.log('dcs成功的回调函数, 接收到的data数据: ', data)
-    let msgData = JSON.parse(data)
-    if (msgData == null) return;
-    switch (msgData?.type) {
-      case "FanFrequencyInfo": {
-        store.dispatch({type: "websocket/setFanFrequencyInfo", payload:msgData.data.FanFrequencyInfo})
-        break;
-      }
-      case "KilnInfo": {
-        store.dispatch({type: "websocket/setKilnInfo", payload: msgData.data})
-        break;
-      }
-      case "GasInfo": {
-        store.dispatch({type: "websocket/setGasInfo", payload: msgData.data})
-        break;
-      }
-      case "SumGasInfo": {
-        store.dispatch({type: "websocket/setSumGasInfo", payload: msgData.data})
-        break;
-      }
-      default:
-    }
-  },
-  (err) => {
-    console.log('失败的回调函数', err)
-  }
-)
-// ISRA
-const mesIsra = new WsConnect(
-  'ws://10.70.2.2:8080/websocket/message?userId=KILN'+timestr,
-  '',
-  (data) => {
-    // console.log('mes ISRA成功的回调函数, 接收到的data数据: ', data)
-    let msgData = JSON.parse(data)
-    // console.log(msgData)
-    if (msgData == null) return;
-    switch (msgData?.type) {
-      case "israKiln": {
-        store.dispatch({type: "websocket/setIsraKiln", payload:msgData.detData.dayStatistic})
-        break;
-      }
-      // case "KilnInfo": {
-      //   // store.dispatch({type: "websocket/setKilnInfo", payload: msgData.data.kilnInfo})
-      //   break;
-      // }
-      default:
-    }
-  },
-  (err) => {
-    console.log('失败的回调函数', err)
-  }
-)
-
-// 原料 MA
-const mesMA = new WsConnect(
-  'ws://10.70.2.2:8080/websocket/message?userId=MA'+timestr,
-  '',
-  (data) => {
-    // console.log('mes 原料成功的回调函数, 接收到的data数据: ', data)
-    let msgData = JSON.parse(data)
-    if (msgData == null) return;
-    switch (msgData?.type) {
-      case "material": {
-        store.dispatch({type: "websocket/setMaterial", payload:msgData.data})
-        break;
-      }
-      // case "KilnInfo": {
-      //   // store.dispatch({type: "websocket/setKilnInfo", payload: msgData.data.kilnInfo})
-      //   break;
-      // }
-      default:
-    }
-  },
-  (err) => {
-    console.log('失败的回调函数', err)
-  }
-)
-// 能耗 EN
-const mesEN = new WsConnect(
-  // websocket地址
-  'ws://10.70.2.2:8080/websocket/message?userId=ENERGY'+timestr,
-  // 传递给后台的数据
-  '',
-  // 成功拿到后台返回的数据的回调函数
-  (data) => {
-    // console.log('mes 能耗成功的回调函数, 接收到的data数据: ', data)
-    let msgData = JSON.parse(data)
-    if (msgData == null) return;
-    switch (msgData?.type) {
-      case "EnergyInfo": {
-        store.dispatch({type: "websocket/setEnergyInfo", payload:msgData.data})
-        break;
-      }
-      case "EnergyTrend": {
-        store.dispatch({type: "websocket/setEnergyTrend", payload:msgData.data})
-        break;
-      }
-      case "EnergyMonitoring": {
-        store.dispatch({type: "websocket/setEnergyMonitoring", payload:msgData.data})
-        break;
-      }
-      default:
-    }
-  },
-  // websocket连接失败的回调函数
-  (err) => {
-    console.log('失败的回调函数', err)
-  }
-)
-// 烟气 GAS
-const mesGAS = new WsConnect(
-  // websocket地址
-  'ws://10.70.2.2:8080/websocket/message?userId=GAS'+timestr,
-  // 传递给后台的数据
-  '',
-  // 成功拿到后台返回的数据的回调函数
-  (data) => {
-    // console.log('mes 烟气成功的回调函数, 接收到的data数据: ', data)
-    let msgData = JSON.parse(data)
-    if (msgData == null) return;
-    switch (msgData?.type) {
-      case "exhaustGas": {
-        store.dispatch({type: "websocket/setExhaustGasInfo", payload:msgData.realtime})
-        store.dispatch({type: "websocket/setExhaustGasChart", payload:{
-          dayTrend: msgData.dayTrend,
-          weekTrend: msgData.weekTrend,
-          monthTrend: msgData.monthTrend,
-          yearTrend: msgData.yearTrend,
-        }})
-        break;
-      }
-      default:
-    }
-  },
-  // websocket连接失败的回调函数
-  (err) => {
-    console.log('失败的回调函数', err)
-  }
-)
-
-// 缺陷分类/统计 IS
-const mesIS = new WsConnect(
-  // websocket地址
-  'ws://10.70.2.2:8080/websocket/message?userId=IS'+timestr,
-  // 传递给后台的数据
-  '',
-  // 成功拿到后台返回的数据的回调函数
-  (data) => {
-    // console.log('mes 缺陷成功的回调函数, 接收到的data数据: ', data)
-    let msgData = JSON.parse(data)
-    if (msgData == null) return;
-    switch (msgData?.type) {
-      case "isra": {
-        store.dispatch({type: "websocket/setDefectChart", payload:{
-          dayStatistic: msgData.detData.dayStatistic,
-          weekStatistic: msgData.detData.weekStatistic,
-          monthStatistic: msgData.detData.monthStatistic,
-          yearStatistic: msgData.detData.yearStatistic,
-        }})
-        break;
-      }
-      default:
-    }
-  },
-  // websocket连接失败的回调函数
-  (err) => {
-    console.log('失败的回调函数', err)
-  }
-)
-
-// 产线产量及良品率 SJG
-const mesSJG = new WsConnect(
-  // websocket地址
-  // 'ws://10.70.2.2:8080/websocket/message?userId=SJG'+timestr,
-  'ws://192.168.1.104:48082/websocket/message?userId=SJG'+timestr,
-  // 传递给后台的数据
-  '',
-  // 成功拿到后台返回的数据的回调函数
-  (data) => {
-    // console.log('mes 产线产量及良品率成功的回调函数, 接收到的data数据: ', data)
-    let msgData = JSON.parse(data)
-    if (msgData == null) return;
-    switch (msgData?.type) {
-      case "productline": {
-        store.dispatch({type: "websocket/setProductline", payload:msgData.detData})
-        break;
-      }
-      default:
-    }
-  },
-  // websocket连接失败的回调函数
-  (err) => {
-    console.log('失败的回调函数', err)
-  }
-)
-
-
-export const getDcsMsg = () => {
-  dcsConn.createWebSoket()
-  mesIsra.createWebSoket()
-  mesMA.createWebSoket()
-  mesEN.createWebSoket()
-  mesGAS.createWebSoket()
-  mesIS.createWebSoket()
-  // mesSJG.createWebSoket()
-}
-export const closeDcsMsg = () => {
-  dcsConn.closeWebsocket()
-  mesIsra.closeWebsocket()
-  mesMA.closeWebsocket()
-  mesEN.closeWebsocket()
-  mesGAS.closeWebsocket()
-  mesIS.closeWebsocket()
-  // mesSJG.closeWebsocket()
-}