update some bug

gaoshp

2024-10-22 638f3c0cfbf1ace8847dadf5c7b3215f371e9ba8

 src/views/mdc/realtime-status/index.vue

@@ -1,7 +1,7 @@
<!--
 * @Date: 2024-04-09 22:11:21
 * @LastEditors: lzhe lzhe@example.com
 * @LastEditTime: 2024-10-21 12:58:09
 * @LastEditTime: 2024-10-22 20:56:44
 * @FilePath: /cps-web/src/views/mdc/realtime-status/index.vue
 实时看板
-->
@@ -49,7 +49,7 @@
            <div class="status-card-box" style="border-color: #ccc;">
               <div class="status-card-top">
                  <div class="status-card-detail">
                     <div title="461" class="status-card-detail-name">{{ item.code }}</div>
                     <div class="status-card-detail-name" :title="item.name">{{ item.name }}</div>
                     <div class="status-card-detail-status">
                        <div class="status-card-detail-point" :style="{ 'background-color': item.statusStyle }">
                        </div>{{ item.statusName }}
@@ -60,7 +60,7 @@
                  </div>
                  <div class="status-card-machine" style="border-color: #ccc;">
                     <div class="status-card-machine-img">
                        <img src="./station1.jpg" width="68" height="68">
                        <img :src="item.avatar" width="68" height="68">

                     </div>
                     <div class="status-card-machine-mesg">
@@ -94,6 +94,7 @@
</template>

<script>
import station from "./station1.jpg";
import moment from 'moment';
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
let icons = []
@@ -106,6 +107,7 @@
   },
   data() {
      return {
         station: station,
         clickIndex: 0,
         allwcs: [],
         statusStyle: "#ccc",
@@ -221,18 +223,14 @@
         this.gettimestatus();  //查询列表
      },
      showvisible(item, index) {
         //clickIndex
         if(item.properties.length == 0) {
            this.$message({
               message: '该工位没有配置数据点',
               type: 'warning'
            });
            return;
         }
         this.clickIndex = index;
         // if (item.properties == null || item.properties.length == 0) {
         //    this.$message({
         //       message: '请配置采集项',
         //       type: 'warning'
         //    });
         //    return;
         // }
         // var visibleList = JSON.parse(JSON.stringify(item.properties));
         // this.titleMap = "实时数据(" + item.code + ")";
         // this.visibleList = visibleList;
         this.visible = true;
      },
      searchstatus(item, index) {
@@ -255,7 +253,6 @@
         }
      },
      goSet() {
         //console.log(this.$TOOL.data.get("MENU"));name == "配置中心"
         this.$router.push('/mdc/configuration');  //分析设置
      },
      gostatus(item) {
@@ -270,12 +267,12 @@
            }
         })
      },
      changeTime(time) {
      changeTime(time,diffTime) {
         // 使用Moment.js解析这两个日期字符串  
         var date1 = moment(time);
         var date2 = moment(moment().format('YYYY-MM-DD HH:mm:ss'));
         var date2 = moment(diffTime);
         // 计算两个日期之间的差异（毫秒）  
         var differenceInMilliseconds = date2.diff(date1); // 注意：date2 - date1 给出正数差异  
         var differenceInMilliseconds = date1.diff(date2); // 注意：date1 - date2 给出正数差异  
         // 使用duration对象将差异转换为更易于处理的单位  
         var duration = moment.duration(differenceInMilliseconds);
         // 提取天数、小时数、分钟数和秒数  
@@ -297,6 +294,9 @@
            if (res.code == 200) {
               var ids = [];
               res.data.records.forEach(item => {
                  if(item.avatar == "") {
                     item.avatar = station;
                  }
                  ids.push(item.id);
                  if (item.properties != null && item.properties.length != 0) {
                     item.properties.forEach(item1 => {
@@ -334,7 +334,6 @@
               this.$TOOL.socket.websocket.onmessage = function (event) {
                  //num++;
                  var eventData = JSON.parse(event.data);
                  if (Object.keys(eventData.data).length == 0) return;
                  if (that.timestatus.length == 0) return;  //没值不用循环
                  that.timestatus.forEach((item, index) => {  //第一步把v放到code里
                     if (eventData.id == item.id) {
@@ -344,8 +343,10 @@
                        }
                        if (eventData.data.DeviceStatus) {
                           var time = moment(eventData.data.DeviceStatus.t).format('YYYY-MM-DD HH:mm:ss');
                           var diffTime = that.changeTime(time);  //转换成差值（时分秒）
                           var preT = moment(eventData.data.DeviceStatus.preT).format('YYYY-MM-DD HH:mm:ss');
                           var diffTime = that.changeTime(time,preT);  //转换成差值（时分秒）
                           //that.setIntervalTime();   //十秒增加时间
                           var diffTime = diffTime;
                           item.time = diffTime;
                           that.allwcs.forEach(item1 => {
                              if (item1.code == eventData.data.DeviceStatus.v) {
@@ -362,21 +363,25 @@
                        item.properties.forEach((item1, index1) => {
                           if (item1.key == "DeviceStatus") {  //机器状态
                              that.allwcs.forEach(item2 => {
                                 if (item2.code == eventData.data.DeviceStatus.v) {
                                 if(eventData.data.DeviceStatus && item2.code == eventData.data.DeviceStatus.v) {
                                    item1.value = item2.code;
                                    item1.color = item2.color;
                                    item1.code = item2.name;
                                 }
                              })
                              if (Object.keys(eventData.data).length == 0) {  //ws没有data数据，给默认值
                                 item1.code = "";
                                 item1.color = "#E4A512";
                              };
                           } else {
                              if (item1.key == 'Alarm') {  //报警
                                 if (eventData.data[item1.key]) {
                                    if(eventData.data[item1.key].v == "") return;
                                    var v = JSON.parse(eventData.data[item1.key].v);
                                    if (Array.isArray(v)) {  //如果是数组，不赋值
                                       if (v.length == 0) {
                                          res.data.records[index].properties.splice(index1, 1);
                                       } else {
                                          item1.name = v[0].alarmNo;
                                          item1.code = v[0].alarmNo;
                                       }
                                    } else {
@@ -541,7 +546,7 @@
   font-weight: 700;
   font-size: 16px;
   color: #333;
   width: 26%;
   max-width: 37%;
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
@@ -557,12 +562,12 @@
   width: 12px;
   height: 12px;
   border-radius: 6px;
   margin-right: 8px;
   margin-right: 2px;
}

.status-card-detail-time {
   line-height: 12px;
   margin-left: 16px;
   margin-left: 2px;
}

.status-card-machine {