驾驶舱

src/views/databoard/deepProcessing/WorkOrderMonitoring.vue

@@ -2,17 +2,21 @@
   <div style="flex: 1;">
     <Container name="工单监控" size="small" style="">
       <div style="padding: 5px 10px;">
-        <ScrollBoard :config = "config" width='575px' height='380px'/>
+        <dv-scroll-board :config="config" style="width:575px;height:380px" ref='worderScrollBoard'/>
       </div>
     </Container>
   </div>
 </template>
 <script>
 import Container from '../components/Container.vue';
-import ScrollBoard from '../components/ScrollBoard'
 export default {
   name: 'WorkOrderMonitoring',
-  components: { Container, ScrollBoard },
+  components: { Container },
+  computed: {
+    order() {
+      return this.$store.state.websocket.workOrder
+    }
+  },
   data() {
     return {
       config: {
@@ -21,23 +25,41 @@ export default {
         headerBGC: 'rgba(32, 55, 96, 0.8)',
         oddRowBGC: 'rgba(32, 55, 96, 0.8)',
         evenRowBGC: 'rgba(14, 32, 62, 0.8)',
-        columnWidth: [60],
+        columnWidth: [60, 120, 80, 60, 80, 120, 120, 120],
         align: ['center'],
         data: [
-          [1, '设备1', '行1列3', '', '','','',''],
-          [2, '设备2', '行2列3', '', '','','',''],
-          [3, '设备3', '行3列3', '', '','','',''],
-          [4, '设备4', '行4列3', '', '','','',''],
-          [5, '设备5', '行5列3', '', '','','',''],
-          [6, '设备6', '行6列3', '', '','','',''],
-          [7, '设备7', '行7列3', '', '','','',''],
-          [8, '设备8', '行8列3', '', '','','',''],
-          [9, '设备9', '行9列3', '', '','','',''],
-          [10, '设备10', '行10列3', '', '','','','']
+          [1, '工单1', '行1列3', '', '','','',''],
+          [2, '工单2', '行2列3', '', '','','',''],
+          [3, '工单3', '行3列3', '', '','','',''],
+          [4, '工单4', '行4列3', '', '','','',''],
+          [5, '工单5', '行5列3', '', '','','',''],
+          [6, '工单6', '行6列3', '', '','','',''],
+          [7, '工单7', '行7列3', '', '','','',''],
+          [8, '工单8', '行8列3', '', '','','',''],
+          [9, '工单9', '行9列3', '', '','','',''],
+          [10, '工单10', '行10列3', '', '','','','']
         ],
         rowNum: 10
       }
     }
+  },
+  watch:{
+    order: {
+			handler(newVal, oldVal) {
+        let outArr = this.order.map((item, index) => [
+          index+1,
+          item.name,
+          item.specifications,
+          item.lines,
+          item.status,
+          item.planFinishTime,
+          item.planQuantity,
+          item.planAssignQuantity
+      ]);
+        this.config.data = outArr
+        this.$refs['worderScrollBoard'].updateRows(outArr)
+			}
+		}
   }
 }
 </script>