From f29900986f01cf5d39b5755cec674825cef27961 Mon Sep 17 00:00:00 2001 From: gaoshp <291585735@qq.com> Date: 星期二, 19 十一月 2024 19:25:41 +0800 Subject: [PATCH] update --- src/views/mdc/processParam/index.vue | 55 +++++++++++++++++++++++++++++++++---------------------- 1 files changed, 33 insertions(+), 22 deletions(-) diff --git a/src/views/mdc/processParam/index.vue b/src/views/mdc/processParam/index.vue index 429f9b8..4105da8 100644 --- a/src/views/mdc/processParam/index.vue +++ b/src/views/mdc/processParam/index.vue @@ -1,7 +1,7 @@ <!-- * @Date: 2024-04-09 22:11:21 * @LastEditors: gaoshp - * @LastEditTime: 2024-11-10 19:36:53 + * @LastEditTime: 2024-11-13 20:20:54 * @FilePath: /cps-web/src/views/mdc/processParam/index.vue 瀹炴椂鐪嬫澘 --> @@ -50,8 +50,7 @@ <scEcharts v-if="!item.showPie" style="width:100%" :height="item.height" :option="item?.dayCharts"> </scEcharts> - <scEcharts v-else style="width:100%" :height="item.height" - :option="item?.pieCharts"> + <scEcharts v-else style="width:100%" height="300px" :option="item?.pieCharts"> </scEcharts> </div> <el-empty v-else description="鏆傛棤鏁版嵁" /> @@ -179,7 +178,7 @@ this.visible = true }, init() { - this.$HTTP.get('/api/mdc/process-parameter').then(res => { + this.$HTTP.get('/api/smis/global_wcs/wcs-achievements').then(res => { if (res.code === 200) { this.legend = res.data } @@ -230,7 +229,7 @@ return { ...v, name: name, - height: ['ProcessProgram', 'DeviceStatus'].includes(v.name) ? '100px' : '200px' + height: v.paramChartType == 'distribute' ? '300px' : '200px' } }) this.queryChart() @@ -329,25 +328,26 @@ }, setDeviceStatusOptions(data, myname) { + debugger let total = Math.abs(moment(this.timeRange.startTime).diff(moment(this.timeRange.endTime))) let start = this.timeRange.startTime let len = data?.data?.length if (len > 0 && moment(data.data[len - 1].time).unix() < moment(this.timeRange.endTime).unix()) { let addItem = { time: this.timeRange.endTime, - value: data.data[len - 1].value + value: myname === 'DeviceStatus' ? data.data[len - 1].name : data.data[len - 1].value, } data.data.push(addItem) } let series = data.data.map((item, i) => { let current = Math.abs(moment(start).diff(moment(item.time))) start = item.time - let name = i === 0 ? '' : data.data[i - 1].value + let name = i === 0 ? '' : myname === 'DeviceStatus' ? data.data[i - 1].name : data.data[i - 1].value // if (myname === 'ProcessProgram') { try { - name = item.value.slice(-50) + name = myname === 'DeviceStatus' ? item.name.slice(-50) : item.value.slice(-50) } catch (err) { - name = item.value + name = myname === 'DeviceStatus' ? item.name : item.value } // } // let color = !name ? 'transparent' : data.data[i - 1].color @@ -366,11 +366,9 @@ // return `${name}:寮�濮嬫椂闂�${moment(data.data[i - 1].time).format('HH:mm')}-${moment(item.time).format('HH:mm')}` // } // }, - // itemStyle: { - // // color, // 杩欎竴琛屽浐瀹氱殑棰滆壊鍊奸渶瑕佸垹闄ゆ垨娉ㄩ噴 - // borderColor: '#FFF', - // borderWidth: 1 - // }, + itemStyle: { + color: item.color, // 杩欎竴琛屽浐瀹氱殑棰滆壊鍊奸渶瑕佸垹闄ゆ垨娉ㄩ噴 + }, tooltip: { show: true, trigger: 'item', @@ -428,20 +426,21 @@ this.list[index] = Object.assign({ ...this.list[index], dayCharts, - pieCharts: this.getPieCharts(data.data), + pieCharts: this.getPieCharts(data.data, myname), showPie: false }) // console.log(this.list, '>>>>>>>>>>>>>>>>>>>>>>111') }, - getPieCharts(data) { + getPieCharts(data, myname) { let start = this.timeRange.startTime const obj = { } + let key = myname === 'DeviceStatus' ? 'name' : 'value' data.forEach(v => { - if (obj[v.value]) { - obj[v.value] += moment(v.time).valueOf() - moment(start).valueOf() + if (obj[v[key]]) { + obj[v[key]] += moment(v.time).valueOf() - moment(start).valueOf() } else { - obj[v.value] = moment(v.time).valueOf() - moment(start).valueOf() + obj[v[key]] = moment(v.time).valueOf() - moment(start).valueOf() } start = v.time @@ -450,13 +449,26 @@ return { value: obj[key] / 1000, name: key, + // itemStyle: { + // color: item.color, // 杩欎竴琛屽浐瀹氱殑棰滆壊鍊奸渶瑕佸垹闄ゆ垨娉ㄩ噴 + // }, } + }).map(v => { + if (myname === 'DeviceStatus') { + return { + ...v, + itemStyle: { + color: this.legend.find(item => item.name === v.name).color + } + } + } + return v + }) let charts = { tooltip: { trigger: 'item', formatter: function (params) { - console.log(params, '>>>>>.') let d = moment.duration(params.value, 'seconds') return `${params.name}: ${d.hours()}灏忔椂${d.minutes()}鍒�${d.seconds()}绉抈 } @@ -470,11 +482,10 @@ name: '', type: 'pie', radius: '50%', - data: result + data: result, } ], } - console.log(obj, 'pie') return charts }, change(e) { -- Gitblit v1.9.3