yudao-dev/src/views/databoard/deepProcessing/WorkOrderMonitoring.vue

<template>
  <Container name="工单监控" size="middle" style="">
    <div style="padding: 5px 10px;" class="WOMonitoring">
      <dv-scroll-board :config="config" style="width:900px;height:380px" ref='worderScrollBoard'/>
    </div>
  </Container>
</template>
<script>
import Container from '../components/Container.vue';
import { formatDate } from '@/utils'
export default {
  name: 'WorkOrderMonitoring',
  components: { Container },
  computed: {
    order() {
      return this.$store.state.websocket.workOrder
    }
  },
  data() {
    return {
      config: {
        header: ['序号', '工单名称', '规格','产线','工单状态', '计划完成时间','计划产量','实际产量'],
        headerBGC: 'rgba(32, 55, 96, 0.8)',
        oddRowBGC: 'rgba(32, 55, 96, 0.8)',
        evenRowBGC: 'rgba(14, 32, 62, 0.8)',
        columnWidth: [60, 120, 120, 60, 100, 150],
        align: ['center'],
        data: [],
        rowNum:10
      }
    }
  },
  methods:{
  },
  watch:{
    order: {
			handler(newVal, oldVal) {
        let outArr = this.order.map((item, index) => [
          index+1,
          item.name,
          item.specifications,
          item.lines,
          ['等待','已下发','已完成'][item.status],
          formatDate(item.planFinishTime),
          item.planQuantity,
          item.planAssignQuantity
      ]);
        this.config.data = outArr
        this.$refs['worderScrollBoard'].updateRows(outArr)
			}
		}
  }
}
</script>