diff --git a/src/api/board/index.js b/src/api/board/index.js index 6bde11a..6c6e637 100644 --- a/src/api/board/index.js +++ b/src/api/board/index.js @@ -6,6 +6,12 @@ export function realTimeData(query) { }) } +export function realTimeDataByEnergy(query) { + return request({ + url: '/ems/board/realTimeDataByEnergy', method: 'get', params: query + }) +} + export function deviceOverview(query) { return request({ url: '/ems/board/deviceOverview', method: 'get', params: query diff --git a/src/views/board/factoryIndex.vue b/src/views/board/factoryIndex.vue index 7aaae7e..06f632c 100644 --- a/src/views/board/factoryIndex.vue +++ b/src/views/board/factoryIndex.vue @@ -8,7 +8,7 @@
本月{{ currentTypeMeta.rankName }}分项统计
能耗统计
实时预警
-
近7天尖峰平谷统计
+
近7天能耗统计
@@ -191,13 +191,13 @@
-
+
- {{ i[0] }}段用电 + {{ i[0] }}
- + {{ i[2] }} %
@@ -404,19 +404,20 @@ export default { ] }) }) - peaksValleysConsumption().then(async res => { - let oriData = res.data?.reportList?.reduce((acc, item) => { - if (!acc[item.priceType]) { - acc[item.priceType] = 0; + peaksValleysConsumption({ monitorType: this.typeData }).then(async res => { + let oriData = (res.data?.reportList || []).reduce((acc, item) => { + if (!acc[item.unitName]) { + acc[item.unitName] = 0; } - acc[item.priceType] += item.expend; + acc[item.unitName] += Number(item.expend || 0); return acc; }, {}) let all = Object.values(oriData).reduce((acc, item) => { - return acc + item + return Number(acc) + Number(item) }, 0) let chartData = Object.keys(oriData).map((e) => { - return [e, oriData[e], (oriData[e] / all * 100).toFixed(2)] + const percentage = all === 0 ? 0 : (oriData[e] / all * 100) + return [e, oriData[e], percentage.toFixed(2)] }) this.peaksValleysConsumptionData = chartData let seriesData = [] @@ -434,7 +435,7 @@ export default { } }) seriesData.push({ - value: e[1], name: e[0] + '段用电', percentage: e[2] + value: e[1], name: e[0], percentage: e[2] }) }) @@ -451,7 +452,7 @@ export default { left: 'center', top: 'center', style: { - text: '{num|1111}\n{unit|kwh}', + text: `{num|${Number(all).toFixed(2)}}\n{unit|${this.currentTypeMeta.unit}}`, textAlign: 'center', rich: { num: { @@ -535,8 +536,8 @@ export default { if (!result[item.date]) { result[item.date] = {date: item.date, data: {}}; } - result[item.date].data[item.priceType] = item.expend; - types.add(item.priceType); + result[item.date].data[item.unitName] = Number(item.expend || 0); + types.add(item.unitName); }); return { @@ -565,7 +566,7 @@ export default { }, yAxis: { type: 'value', - name: '单位(kwh)', + name: `单位(${this.currentTypeMeta.unit})`, max: function (value) { return parseFloat((value.max * 1.2).toFixed(1)); }, @@ -596,13 +597,13 @@ export default { }, series: types.map((e, k) => { return { - name: e + '段用电', + name: e, type: 'bar', stack: 'total', label: { - show: true, - position: 'inside', - color: '#000', + show: false, + position: 'top', + color: '#fff', fontSize: 10 }, barWidth: '50%', @@ -935,29 +936,42 @@ export default { flex-direction: column; justify-content: space-between; + .jfpgtjInfoItem { + display: flex; + align-items: center; + min-width: 0; + width: 100%; + white-space: nowrap; + } .market { - display: inline-block; - vertical-align: middle; + flex: 0 0 auto; width: 0.8vw; height: 0.8vw; - margin-right: 0.8vw; + margin-right: 0.45vw; background-color: #28A7FC; border-radius: 50%; } .text { - display: inline-block; + flex: 1; + min-width: 0; font-size: 0.8vw; - width: calc(100% - 1.6vw - 2.5vw); + overflow: hidden; + text-overflow: ellipsis; text-align: left; } .num { - display: inline-block; + flex: 0 0 2.9vw; font-size: 0.8vw; - width: 2.5vw; - text-align: left; + text-align: right; + white-space: nowrap; + } + + .numValue { + font-weight: bold; + font-size: 0.85vw; } }