update 产线实时

2022-08-23 14:16:05 +08:00
parent 70485d293c
commit 2e40570969
2 changed files with 137 additions and 151 deletions
--- a/src/views/modules/monitoring/realtimeEquipment.vue
+++ b/src/views/modules/monitoring/realtimeEquipment.vue
@@ -38,7 +38,7 @@ export default {
 	},
 	created() {
 		this.clearData()
-		this.fetchList('equipment').then(({ data: res }) => {
+		this.fetchList().then(({ data: res }) => {
 			this.testData = res.data.filter(item => !!item.equDet)
 			this.handleData()
 		})
@@ -48,7 +48,7 @@ export default {
 				duration: 1500,
 				onClose: () => {
 					this.clearData()
-					fetchList('equipment').then(({ data: res }) => {
+					this.fetchList().then(({ data: res }) => {
 						this.testData = res.data.filter(item => !!item.equDet)
 						this.handleData()
 					})
@@ -87,7 +87,7 @@ export default {
 		},

 		expandDataStepOne() {
-			console.log('testdata: ', this.testData)
+			// console.log('testdata: ', this.testData)
 			this.stepOneArray = this.testData.map(item => {
 				if (item.equDet) {
 					item.equDet.forEach((equipment, index) => {
--- a/src/views/modules/monitoring/realtimeProductLine.vue
+++ b/src/views/modules/monitoring/realtimeProductLine.vue
@@ -6,171 +6,157 @@
 * @Description: 产线生产实时数据
 -->
 <template>
-  <div>
-    <div class="app-container">
-      <small-title :size="'md'">{{ $t('module.factory.realtime.productLine.name') }}</small-title>
-      <base-table
-        v-if="tableReady"
-        :table-config="tableProps"
-        :table-data="tableData.length ? tableData : []"
-        :is-loading="listLoading"
-        :index-config="{ align: 'left', fixed: 'left' }"
-      />
-    </div>
-  </div>
+	<div>
+		<div class="app-container">
+			<small-title :size="'md'">产线生产实时数据</small-title>
+			<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []" />
+		</div>
+	</div>
 </template>

 <script>
-// import BaseTable from '@/components/BaseTable/index-compound'
+import BaseTable from '@/components/base-table'
 import SmallTitle from '@/components/small-title'
 import moment from 'moment'
-// import fetchList from '@/api/factory-manage/realtimeData'

 export default {
-  name: 'RealtimeDataOfLine',
-  components: { BaseTable, SmallTitle },
-  data() {
-    return {
-      tableReady: false,
-      dynamicPropSet: false,
-      tableProps: [{ label: 'default', prop: 'default' }],
-      tableData: [],
-      testData: null,
-      listLoading: false,
-      intervalId: null
-    }
-  },
+	name: 'RealtimeDataOfLine',
+	components: { BaseTable, SmallTitle },
+	data() {
+		return {
+			loadTable: false,
+			dynamicPropSet: false,
+			tableProps: [{ label: 'default', prop: 'default' }],
+			tableData: [],
+			testData: null,
+			listLoading: false,
+			intervalId: null
+		}
+	},

-  mounted() {
-    this.clearData()
-    fetchList('line').then(res => {
-      this.testData = res
-      this.handleData()
-    })
+	mounted() {
+		this.clearData()
+		this.fetchList().then(({ data: res }) => {
+			// console.log('fetchlist:', res)
+			this.testData = res
+			this.handleData()
+		})

-    this.intervalId = setInterval(() => {
-      this.$message({
-        message: this.$t('module.factory.realtime.productLine.refresh'),
-        type: 'warning',
-        onClose: () => {
-          this.clearData()
-          fetchList('line').then(res => {
-            this.testData = res
-            this.handleData()
-          })
-        }
-      })
-    }, 1000 * 60 * 5)
-  },
+		this.intervalId = setInterval(() => {
+			this.$message({
+				message: this.$t('module.factory.realtime.productLine.refresh'),
+				type: 'warning',
+				onClose: () => {
+					this.clearData()
+					this.fetchList().then(res => {
+						this.testData = res
+						this.handleData()
+					})
+				}
+			})
+		}, 1000 * 60 * 5)
+	},

-  beforeDestroy() {
-    if (this.intervalId) clearInterval(this.intervalId)
-  },
+	beforeDestroy() {
+		if (this.intervalId) clearInterval(this.intervalId)
+	},

-  methods: {
-    clearData() {
-      this.dynamicPropSet = false
-      this.tableReady = false
-      this.testData = null
-      this.tableData.splice(0)
-      this.tableProps.splice(0)
-      this.setStaticTableProps()
-    },
+	methods: {
+		fetchList() {
+			return this.$http({
+				url: this.$http.adornUrl('/monitoring/productionMonitoring/lineProductionRealTimeData'),
+				method: 'post'
+			})
+		},

-    handleData() {
-      this.expandDataStepOne()
-      // this.expandDataStepTwo()
-      if (this.tableData.length > 0) this.tableReady = true
-      else {
-        this.$message({
-          message: '没有查询到相关数据!',
-          type: 'error',
-          duration: 2000
-        })
-      }
-    },
+		clearData() {
+			this.dynamicPropSet = false
+			this.loadTable = false
+			this.testData = null
+			this.tableData.splice(0)
+			this.tableProps.splice(0)
+			this.setStaticTableProps()
+		},

-    expandDataStepOne() {
-      // 扩展服务器返回的数据第一阶段
-      console.log('create new one')
-      this.tableData = this.testData.data.map(item => {
-        const newItem = {
-          lineName: item.lineName,
-          orderName: item.orderName,
-          productSize: item.productSize ?? '-'
-        }
+		handleData() {
+			this.expandDataStepOne()
+			// this.expandDataStepTwo()
+			if (this.tableData.length > 0) this.loadTable = true
+			else {
+				this.$message({
+					message: '没有查询到相关数据!',
+					type: 'error',
+					duration: 2000
+				})
+			}
+		},

-        if (item.det) {
-          item.det.forEach(obj => {
-            // Step2: 设置动态props
-            if (!this.dynamicPropSet) {
-              this.tableProps.push({
-                label: moment(obj.recordTime).format('YYYY-MM-DD HH:mm:ss'),
-                children: [
-                  { prop: obj.recordTime + '-inputNum', label: this.$t('module.factory.realtime.productLine.input') },
-                  { prop: obj.recordTime + '-outputNum', label: this.$t('module.factory.realtime.productLine.output') },
-                  {
-                    prop: obj.recordTime + '-passArea',
-                    label: this.$t('module.factory.realtime.productLine.passArea')
-                  },
-                  {
-                    prop: obj.recordTime + '-scrapNum',
-                    label: this.$t('module.factory.realtime.productLine.scrapNum')
-                  },
-                  {
-                    prop: obj.recordTime + '-scrapRate',
-                    label: this.$t('module.factory.realtime.productLine.scrapRate')
-                  }
-                ]
-              })
-            }
+		expandDataStepOne() {
+			// 扩展服务器返回的数据第一阶段
+			// console.log('create new one')
+			this.tableData = this.testData.data.map(item => {
+				const newItem = {
+					lineName: item.lineName,
+					orderName: item.orderName,
+					productSize: item.productSize ?? '-'
+				}

-            Object.defineProperty(newItem, obj.recordTime + '-inputNum', {
-              value: obj.inputNum ?? '-',
-              enumerable: true,
-              writable: true
-            })
-            Object.defineProperty(newItem, obj.recordTime + '-outputNum', {
-              value: obj.outputNum ?? '-',
-              enumerable: true,
-              writable: true
-            })
-            Object.defineProperty(newItem, obj.recordTime + '-scrapNum', {
-              value: obj.scrapNum ?? '-',
-              enumerable: true,
-              writable: true
-            })
+				if (item.det) {
+					item.det.forEach(obj => {
+						// Step2: 设置动态props
+						if (!this.dynamicPropSet) {
+							this.tableProps.push({
+								label: moment(obj.recordTime).format('YYYY-MM-DD HH:mm:ss'),
+								children: [
+									{ prop: obj.recordTime + '-inputNum', label: '进数据' },
+									{ prop: obj.recordTime + '-outputNum', label: '出数据' },
+									{ prop: obj.recordTime + '-passArea', label: '良品率' },
+									{ prop: obj.recordTime + '-scrapNum', label: '报废数量' },
+									{ prop: obj.recordTime + '-scrapRate', label: '报废比例' }
+								]
+							})
+						}

-            const scrapRate = obj.scrapRate ?? '-'
-            Object.defineProperty(newItem, obj.recordTime + '-scrapRate', {
-              value: scrapRate === '-' ? '-' : scrapRate * 100 + '%',
-              enumerable: true,
-              writable: true
-            })
-            Object.defineProperty(newItem, obj.recordTime + '-passArea', {
-              value: obj.passArea ?? '-',
-              enumerable: true,
-              writable: true
-            })
-          })
+						Object.defineProperty(newItem, obj.recordTime + '-inputNum', {
+							value: obj.inputNum ?? '-',
+							enumerable: true,
+							writable: true
+						})
+						Object.defineProperty(newItem, obj.recordTime + '-outputNum', {
+							value: obj.outputNum ?? '-',
+							enumerable: true,
+							writable: true
+						})
+						Object.defineProperty(newItem, obj.recordTime + '-scrapNum', {
+							value: obj.scrapNum ?? '-',
+							enumerable: true,
+							writable: true
+						})

-          this.dynamicPropSet = true
-          return newItem
-        } else {
-          // console.log('没有item.det属性')
-        }
-      })
-    },
+						const scrapRate = obj.scrapRate ?? '-'
+						Object.defineProperty(newItem, obj.recordTime + '-scrapRate', {
+							value: scrapRate === '-' ? '-' : scrapRate * 100 + '%',
+							enumerable: true,
+							writable: true
+						})
+						Object.defineProperty(newItem, obj.recordTime + '-passArea', {
+							value: obj.passArea ?? '-',
+							enumerable: true,
+							writable: true
+						})
+					})

-    setStaticTableProps() {
-      // Step1: 设置静态的 table props
-      const staticTableProps = [
-        { prop: 'lineName', label: this.$t('module.factory.realtime.productLine.pl'), fixed: true },
-        { prop: 'orderName', label: this.$t('module.factory.realtime.productLine.currOrder'), fixed: true },
-        { prop: 'productSize', label: this.$t('module.factory.realtime.productLine.pSpecs'), fixed: true }
-      ]
-      this.tableProps = staticTableProps
-    }
-  }
+					this.dynamicPropSet = true
+					return newItem
+				}
+			})
+		},
+
+		setStaticTableProps() {
+			// Step1: 设置静态的 table props
+			const staticTableProps = [{ prop: 'lineName', label: '产线', fixed: true }]
+			this.tableProps = staticTableProps
+		}
+	}
 }
 </script>