机械分厂设备屏 设备列表修改

src/components/assembly/indexList.vue

@@ -33,7 +33,7 @@ function routerpush(isLink:boolean=false) {
 <style scoped>
 .item {
   width: 20%;
-  height: 30%;
+  height: 27%;
   margin: 30px;
 }
 

src/views/Mechanics/components/scrollBoard.vue

@@ -27,7 +27,7 @@
 </template>
 
 <script setup lang='ts'>
-import { getCurrentInstance, onMounted, reactive, ref } from "vue";
+import { getCurrentInstance, onMounted, reactive, ref, watch } from "vue";
 import { devListType } from "@/type/InPlantProducts";
 import { useRouter } from "vue-router"
 import { useI18n } from 'vue-i18n'
@@ -35,6 +35,7 @@ import DecorationFadeOut from "@/components/decoration/DecorationFadeOut.vue";
 let { t } = useI18n();
 const prop = defineProps({
     config: Object,
+    data: Array
 })
 const router = useRouter()
 //弹窗文本
@@ -43,6 +44,7 @@ let tipcontent = ref(null)
 let visible = ref(false)
 //存储弹窗dom
 let triggerRef = ref(null)
+let devList = ref(null)
 /**
  * @函数功能: 鼠标移入组件方法
  * @param {*} value 
@@ -57,6 +59,15 @@ const dvMouseover = (value) => {
     }
 
 };
+watch(
+  () => prop.data,
+  (val) => {
+    devList.value.updateRows(prop.data)
+    
+  },
+  { deep: true }
+);
+
 /**
  * 点击表格事件
  */
@@ -95,7 +106,6 @@ const dvmouseleave = () => {
     tipcontent.value = null
     visible.value = false
 };
-
 </script>
 
 <style scoped>

src/views/Mechanics/indexNew.vue

@@ -16,7 +16,7 @@
               <div style="width: 100%;height: 100%;">
                 <h2 class="module-header">
                   <DecorationFadeOut>
-                     &nbsp;设备总览&nbsp;
+                    &nbsp;设备总览&nbsp;
                   </DecorationFadeOut>
                 </h2>
                 <div class="module-content">
@@ -42,7 +42,7 @@
           </div>
           <div style="width: 100%; height: 78%;">
             <border13>
-              <scrollBoard :config="scrollBoardConfig"></scrollBoard>
+              <scrollBoard ref="DvScrollBoard" :data="scrollBoardConfig_data" :config="scrollBoardConfig"></scrollBoard>
             </border13>
           </div>
         </el-col>
@@ -86,6 +86,7 @@ const store = useMechanicsStore();
 
 let Acontent = ref();
 let headerref = ref();
+let DvScrollBoard = ref()
 
 let DevOverviewData = ref([])
 let devFaultTipData = ref([])
@@ -102,6 +103,7 @@ let scrollBoardConfig = reactive({
   data: [],
   rawData: []
 })
+let scrollBoardConfig_data = ref([])
 let gatewayData = ref([])
 let devNumTimer: any = null
 //车间列表
@@ -128,6 +130,27 @@ function getWebsocket(val) {
       store.changegatewaynum(data.msg);
       // store.changePM(data.msg)
     }
+    if (data.type == "DeviceStatusInMF") {
+      let compare = {
+        H_OFF: '待机',
+        H_ON: '工作',
+        H_IDLE: '停机',
+        H_STOP: '急停',
+        H_E_STOP: '急停',
+      }
+      let id = data.msg.id
+      let status = data.msg.status
+      let dataIndex = scrollBoardConfig.rawData.findIndex((item, index) => {
+        return item.id == id
+      })
+      if (scrollBoardConfig_data.value[dataIndex][3] != compare[status]) {
+        scrollBoardConfig_data.value[dataIndex][3] = compare[status] ? compare[status] : '停机'
+        console.log(scrollBoardConfig_data.value[dataIndex],dataIndex);
+        
+      }
+
+
+    }
   } catch (err) {
     console.log(err);
   }
@@ -165,7 +188,7 @@ async function reqDeviceTotelListMFfun() {
       H_IDLE: '停机',
       H_STOP: '急停',
     }
-    scrollBoardConfig.data = result.data.map((item, index) => {
+    scrollBoardConfig_data.value = result.data.map((item, index) => {
       return [
         index + 1,
         item.name,
@@ -175,6 +198,7 @@ async function reqDeviceTotelListMFfun() {
         // item.failure + '%'
       ]
     })
+    scrollBoardConfig.data = scrollBoardConfig_data.value
     scrollBoardConfig.rawData = result.data;
   }
 }