From a144a18ab582fd3a8c945cba60bc364dbe7f31e8 Mon Sep 17 00:00:00 2001 From: zhuzhuanzhuan Date: 星期四, 28 三月 2024 16:59:55 +0800 Subject: [PATCH] 1、新增点击设备运行状态图标跳转至设备监控页面并根据状态及当前层级筛选页面对应数据 2、新增点击设备利用率的横向柱状图跳转至统计分析页面并根据所点击层级筛选页面对应数据 3、解决router.push以及router.replace跳转后报错 --- src/views/dashboard/IndexSignage.vue | 42 ++++++++++++++++++++++++++---------------- 1 files changed, 26 insertions(+), 16 deletions(-) diff --git a/src/views/dashboard/IndexSignage.vue b/src/views/dashboard/IndexSignage.vue index 201fc6b..aeb3245 100644 --- a/src/views/dashboard/IndexSignage.vue +++ b/src/views/dashboard/IndexSignage.vue @@ -126,10 +126,6 @@ this.drawCharts() this.getChartDataByApi() }, - activated() { - console.log('瑙﹀彂activated') - this.handleWindowResize() - }, beforeDestroy() { window.removeEventListener('resize', this.handleWindowResize) }, @@ -149,8 +145,8 @@ getRunningStateDataByApi() { signageApi.getEquipmentStatusStatisticsApi() .then(res => { - if (res.success) this.runningStateData = res.result - this.drawRunningStateChart() + if (res.success) this.runningStateData = res.result.list + this.drawRunningStateChart(res.result.producitonId) }) }, @@ -253,7 +249,7 @@ }, /* 缁樺埗璁惧杩愯鐘舵�佺帿鐟伴ゼ鍥� */ - drawRunningStateChart() { + drawRunningStateChart(productionId) { this.runningStateChart = this.$echarts.init(document.getElementById('running_state_chart')) const option = { height: 300, @@ -333,6 +329,13 @@ ] } this.runningStateChart.setOption(option, true) + + this.runningStateChart.on('click', params => { + this.$router.push({ + name: 'mdc-base-DeviceBaseInfo', + params: { signageData: params.data, productionId } + }) + }) }, /* 缁樺埗璁惧鍒╃敤鐜囪兌鍥婂浘 */ @@ -526,13 +529,20 @@ this.efficiencyChart.setOption(option, true) this.efficiencyChart.on('click', params => { - // 鐐瑰嚮瑙﹀彂鐨勪负鏌辩姸浣擄紝闄ゆ闄ゅ鏄爣棰� if (params.componentType === 'series') { + // 鏌辩姸浣撹烦杞粺璁″垎鏋愰〉闈㈠睍绀哄搴斿眰绾ф暟鎹� console.log('seriesParams===========', params) + const productionId = this.efficiencyData.find(item => item.productionCode === params.name).productionId + const tierName = this.efficiencyData.find(item => item.productionCode === params.name).name + console.log('productionId', productionId) + this.$router.push({ + name: 'mdc-base-StatisticsChart', + params: { isEquipment: false, productionId, tierName } + }) } else { console.log('yAxisParams===========', params) - this.$emit('switchToBranchFactory', params.value) + this.$emit('switchToNextSignage', { signageName: 'BranchFactory', productionCode: params.value }) } }) }, @@ -734,7 +744,7 @@ xAxis: [{ name: 'OEE杞﹂棿', nameLocation: 'middle', - nameGap: 30, // x杞磏ame涓庢í鍧愭爣杞寸嚎鐨勯棿璺� + nameGap: 40, // x杞磏ame涓庢í鍧愭爣杞寸嚎鐨勯棿璺� type: 'category', data: this.barChartData.map(item => item.name), axisLine: { @@ -743,11 +753,11 @@ } }, axisLabel: { - margin: 10, - color: '#e2e9ff', - textStyle: { - fontSize: 12 - } + show: true, // 鏄惁鏄剧ず鍒诲害鏍囩锛岄粯璁ゆ樉绀� + interval: 0, // 鍧愭爣杞村埢搴︽爣绛剧殑鏄剧ず闂撮殧锛屽湪绫荤洰杞翠腑鏈夋晥锛涢粯璁や細閲囩敤鏍囩涓嶉噸鍙犵殑绛栫暐闂撮殧鏄剧ず鏍囩锛涘彲浠ヨ缃垚0寮哄埗鏄剧ず鎵�鏈夋爣绛撅紱濡傛灉璁剧疆涓�1锛岃〃绀恒�庨殧涓�涓爣绛炬樉绀轰竴涓爣绛俱�忥紝濡傛灉鍊间负2锛岃〃绀洪殧涓や釜鏍囩鏄剧ず涓�涓爣绛撅紝浠ユ绫绘帹銆� + rotate: this.barChartData.length >= 5 ? -30 : 0, // 鍒诲害鏍囩鏃嬭浆鐨勮搴︼紝鍦ㄧ被鐩酱鐨勭被鐩爣绛炬樉绀轰笉涓嬬殑鏃跺�欏彲浠ラ�氳繃鏃嬭浆闃叉鏍囩涔嬮棿閲嶅彔锛涙棆杞殑瑙掑害浠�-90搴﹀埌90搴� + inside: false, // 鍒诲害鏍囩鏄惁鏈濆唴锛岄粯璁ゆ湞澶� + margin: 6 // 鍒诲害鏍囩涓庤酱绾夸箣闂寸殑璺濈 }, axisTick: { show: false @@ -970,7 +980,7 @@ // ['-', '-'] ], index: true, - columnWidth: [100,300,300], + columnWidth: [100, 300, 300], align: ['center'] } }, -- Gitblit v1.9.3