From bf52db3b6ac01862eff13ac4e333efc7c73a4823 Mon Sep 17 00:00:00 2001 From: lb Date: Wed, 30 Aug 2023 11:37:11 +0800 Subject: [PATCH] =?UTF-8?q?update=20more=20=E8=AE=BE=E5=A4=8724=E5=B0=8F?= =?UTF-8?q?=E6=97=B6=E8=AE=B0=E5=BD=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../monitoring/equipmentRecentHours/index.vue | 355 +++++++++++++----- 1 file changed, 252 insertions(+), 103 deletions(-) diff --git a/src/views/monitoring/equipmentRecentHours/index.vue b/src/views/monitoring/equipmentRecentHours/index.vue index d6df828b..45ac1e59 100644 --- a/src/views/monitoring/equipmentRecentHours/index.vue +++ b/src/views/monitoring/equipmentRecentHours/index.vue @@ -44,14 +44,7 @@ export default { pageNo: 1, pageSize: 10, }, - // jsondemo: '', list: [ - // { - // inspectionContent: '检测内容1', - // '2023-03-18T00:00:00-产线1': '产线1-asdf', - // '2023-03-18T01:00:00-产线2': '产线2-kldf', - // '2023-03-18T02:00:00-产线1': '产线1-vasdkj', - // }, { productLine: '产线1', specification: ['80*11', '100*10'].join(','), @@ -192,7 +185,6 @@ export default { { prop: 'equipmentName', label: '设备', align: 'center' }, { prop: 'totalQuantity', label: '生产总数', align: 'center' }, { - prop: 'l-1', label: 'l-1', align: 'center', children: [ @@ -203,7 +195,6 @@ export default { ], }, { - prop: 'l-2', label: 'l-2', align: 'center', children: [ @@ -214,7 +205,6 @@ export default { ], }, { - prop: 'l-3', label: 'l-3', align: 'center', children: [ @@ -224,76 +214,18 @@ export default { { prop: 'l-3__ratio', label: '报废率', align: 'center' }, ], }, + { + label: 'l-4', + align: 'center', + children: [ + { prop: 'l-4__in', label: '进数据', align: 'center' }, + { prop: 'l-4__out', label: '出数据', align: 'center' }, + { prop: 'l-4__nok', label: '报废数据', align: 'center' }, + { prop: 'l-4__ratio', label: '报废率', align: 'center' }, + ], + }, ], - equipments: [ - { id: 1, name: '上片机' }, - { id: 2, name: '打磨机' }, - { id: 3, name: '清洗机' }, - { id: 4, name: '打孔机' }, - ], - - products: [ - { id: 'p1', name: '产品1', spec: '100*80' }, - { id: 'p2', name: '产品2', spec: '99*99' }, - { id: 'p3', name: '产品3', spec: '1*100' }, - ], - - res: { - code: 0, - msg: '', - data: [ - { - equipmentId: 1, - equipmentName: '上片机', - lineId: 'mock-line-id-1', - lineName: '产线1', - sectionId: 'mock-section-id-1', - sectionName: '工段1', - inQuantity: 100, - outQuantity: 99, - okQuantity: 99, - nokQuantity: 1, - scrapRation: 0.01, - passRate: 99, - recordTime: 1675180800000, - productIds: ['p1', 'p2'], - }, - { - equipmentId: 2, - equipmentName: '打磨机', - lineId: 'mock-line-id-1', - lineName: '产线1', - sectionId: 'mock-section-id-1', - sectionName: '工段1', - inQuantity: 100, - outQuantity: 99, - okQuantity: 99, - nokQuantity: 1, - scrapRation: 0.01, - passRate: 99, - recordTime: 1675180800000, - productIds: ['p3', 'p2'], - }, - { - equipmentId: 3, - equipmentName: '清洗机', - lineId: 'mock-line-id-1', - lineName: '产线1', - sectionId: 'mock-section-id-1', - sectionName: '工段1', - inQuantity: 100, - outQuantity: 99, - okQuantity: 99, - nokQuantity: 1, - scrapRation: 0.01, - passRate: 99, - recordTime: 1675180800000, - productIds: ['p1', 'p3'], - }, - ], - }, - HTTPResponse: { code: 0, msg: 'success', @@ -358,6 +290,170 @@ export default { }, ], }, + + res: { + code: 0, + msg: 'success', + data: [ + { + productLine: '产线22', + specification: ['1000*29*1', '898'], + data: [ + { + equipmentName: '下片机', + totalQuantity: 15, + hourData: { + '2023-08-29T09:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T10:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T11:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T12:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T13:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T14:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T15:24:09.878': { + inQuantity: 9, + nokQuantity: 6, + outQuantity: 8, + scrapRatio: 0.46153846, + }, + '2023-08-29T16:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T17:24:09.878': { + inQuantity: 1, + nokQuantity: 1, + outQuantity: 1, + scrapRatio: 0.5, + }, + '2023-08-29T18:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T19:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T20:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T21:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T22:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-29T23:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T00:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T01:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T02:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T03:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T04:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T05:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T06:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T07:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + '2023-08-30T08:24:09.878': { + inQuantity: 0, + nokQuantity: 0, + outQuantity: 0, + scrapRatio: 0.0, + }, + }, + }, + ], + }, + ], + }, + spanInfo: {}, }; }, @@ -368,46 +464,99 @@ export default { methods: { /** 构建tableProps - 依据第一个元素所提供的信息 */ buildProps(item) { - const { data, productLine, specification } = item; - const props = [{ prop: 'productLine', label: '产线', align: 'center' }]; + const { + data: [{ hourData }], + } = item; + + const props = [ + { prop: 'productLine', label: '产线', align: 'center' }, + { prop: 'specification', label: '规格', align: 'center' }, + { prop: 'equipmentName', label: '设备', align: 'center' }, + { prop: 'totalQuantity', label: '生产总数', align: 'center' }, + ]; + + for (const key of Object.keys(hourData).sort()) { + const subprop = { + label: key, + align: 'center', + children: [ + { prop: key + '__in', label: '进数据', align: 'center' }, + { prop: key + '__out', label: '出数据', align: 'center' }, + { prop: key + '__nok', label: '报废数据', align: 'center' }, + { prop: key + '__ratio', label: '报废率', align: 'center' }, + ], + }; + props.push(subprop); + } this.tableProps = props; }, /** 把 list 里的数据转换成 tableProps 对应的格式 */ - convertList() { - const row = 0; // 记录处理到的行号，并在恰当的时候加入到 this.spanInfo 中 + convertList(list) { + this.list.splice(0); + let row = {}; + let rowIndex = 0; + for (const line of list) { + const { productLine, specification, data } = line; + + // 设置span的行数 + this.spanInfo[rowIndex] = data.length; + for (const equipment of data) { + rowIndex+=1 + for (const [key, hourData] of Object.entries(equipment.hourData)) { + const { equipmentName, totalQuantity } = equipment; + const { inQuantity, outQuantity, nokQuantity, scrapRatio } = + hourData; + row = { + productLine, + specification: specification.join('、'), + equipmentName, + totalQuantity, + }; + row[key + '__in'] = inQuantity; + row[key + '__out'] = outQuantity; + row[key + '__nok'] = nokQuantity; + row[key + '__ratio'] = scrapRatio; + console.log('row', row); + return; + this.list.push(row); + } + return; + } + } + }, + + buildData(data) { + this.convertList(data); }, /** 合并table列的规则 */ mergeColumnHandler({ row, column, rowIndex, columnIndex }) { - console.log('handle merge column', row, column, rowIndex, columnIndex); + // console.log('handle merge column', row, column, rowIndex, columnIndex); if (columnIndex == 0 || columnIndex == 1 || columnIndex == 3) { - return [ - this.spanInfo[rowIndex], // row span - 1, // col span - ]; + if (rowIndex % 3 == 0) { + return [ + 3, // this.spanInfo[rowIndex], // row span + 1, // col span + ]; + } else { + return [0, 0]; + } } - return { rowspan: 3, colspan: 1 }; + // return { rowspan: 3, colspan: 1 }; }, async getList() { - const { data } = await this.$axios({ - url: '/monitoring/equipment-monitor/recent-24-hours', - method: 'get', - }); - console.log('recent-24', data); - // const { - // // data: { nameData }, - // code, - // } = response; - // this.jsondemo = hljs.highlight( - // 'json', - // JSON.stringify(response, null, 2), - // true - // ).value; + // const { data } = await this.$axios({ + // url: '/monitoring/equipment-monitor/recent-24-hours', + // method: 'get', + // }); - // this.buildProps(data[0]); + const data = this.res.data; + console.log('recent-24', data); + this.buildProps(data[0]); + this.buildData(data); // this.initing = true; // const dynamicProps = handleNameData(nameData);