From e2dced9dcd39fb53566020c53e131400daac01e6 Mon Sep 17 00:00:00 2001
From: VVT789 <sdxt_0802@163.com>
Date: 星期四, 13 二月 2025 14:28:08 +0800
Subject: [PATCH] Merge branch 'develop1.0' into wt_from_develop1.0
---
zhitan-vue/src/views/powerquality/threephase/index.vue | 504 ++++
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/common/DateTimeUtil.java | 750 ++++++
zhitan-vue/src/api/powerquality/electricThreePhase/api.js | 10
zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js | 19
zhitan-vue/src/views/powerquality/load/index.vue | 402 +++
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/impl/EnergyConsumeDataServiceImpl.java | 308 ++
zhitan-system/src/main/java/com/zhitan/peakvalley/mapper/PeakValleyMapper.java | 12
zhitan-vue/src/api/powerquality/electric-power-factor/api.js | 9
zhitan-vue/src/utils/ruoyi.js | 207 +
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendPage.java | 22
zhitan-vue/src/views/alarmmanage/energyconsumption/energyConsumption.vue | 415 +-
zhitan-admin/src/main/java/com/zhitan/web/controller/statisticalAnalysis/EnergyConsumeDataController.java | 69
zhitan-system/src/main/resources/mapper/dataitem/DataItemMapper.xml | 18
zhitan-vue/src/views/alarmmanage/measuremen/measuremen.vue | 417 +-
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendItem.java | 51
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/IEnergyConsumeDataService.java | 35
zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js | 26
zhitan-vue/src/views/carbonemission/carbonEmission.vue | 268 +-
zhitan-vue/src/assets/styles/ruoyi.scss | 20
zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue | 241 ++
zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue | 245 ++
zhitan-vue/src/views/powerquality/power/index.vue | 331 ++
zhitan-system/src/main/java/com/zhitan/dataitem/mapper/DataItemMapper.java | 12
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeVO.java | 43
zhitan-vue/src/views/deepanalysis/deepAnalysis.vue | 304 +-
zhitan-system/src/main/resources/mapper/peakvalley/ElectricityDataItemMapper.xml | 26
zhitan-vue/src/components/Echarts/LineChart.vue | 176 +
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeTrendDetailItem.java | 83
zhitan-vue/src/api/energyAnalysis/energyAnalysis.js | 46
zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue | 245 ++
zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js | 17
zhitan-vue/src/views/peakvalley/period/period.vue | 308 +-
zhitan-vue/src/views/peakvalley/timeSharing/timeSharing.vue | 329 --
zhitan-vue/src/views/index.vue | 14
/dev/null | 0
zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js | 17
zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/CostTrendEnergyTypeItem.java | 47
zhitan-vue/src/api/powerquality/load-analysis/api.js | 28
zhitan-vue/src/views/comprehensive/comps/LineChart.vue | 177 +
zhitan-vue/src/views/svg/components/configure.vue | 4
zhitan-vue/src/views/realtimemonitor/realtimemonitor/components/chart-modal.vue | 286 +-
zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js | 70
42 files changed, 5,250 insertions(+), 1,361 deletions(-)
diff --git a/zhitan-admin/src/main/java/com/zhitan/web/controller/statisticalAnalysis/EnergyConsumeDataController.java b/zhitan-admin/src/main/java/com/zhitan/web/controller/statisticalAnalysis/EnergyConsumeDataController.java
new file mode 100644
index 0000000..e91dc45
--- /dev/null
+++ b/zhitan-admin/src/main/java/com/zhitan/web/controller/statisticalAnalysis/EnergyConsumeDataController.java
@@ -0,0 +1,69 @@
+package com.zhitan.web.controller.statisticalAnalysis;
+
+import com.zhitan.common.annotation.Log;
+import com.zhitan.common.core.domain.AjaxResult;
+import io.swagger.annotations.Api;
+import io.swagger.annotations.ApiOperation;
+import lombok.extern.slf4j.Slf4j;
+import com.zhitan.statisticalAnalysis.service.IEnergyConsumeDataService;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.web.bind.annotation.*;
+
+
+/**
+ * @Description: 鑳芥簮娑堣�楃粺璁″垎鏋�
+ * @author: yxw
+ * @date: 2022骞�04鏈�12鏃� 14:11
+ */
+@Api(tags = "鑳借�楃粺璁″垎鏋�")
+@RestController
+@RequestMapping("/energyTypeAnalysis")
+@Slf4j
+public class EnergyConsumeDataController {
+ @Autowired
+ private IEnergyConsumeDataService energyConsumeDataService;
+
+ /**
+ * 鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級- 鑾峰彇琛ㄦ牸鍒楄〃鏁版嵁
+ *
+ * @param pageNo 椤电爜鏁�
+ * @param pageSize 姣忛〉鏁版嵁澶氬皯
+ * @param timeCode 鏃堕棿鍊� 涓庢椂闂寸被鍨嬪搴旓細2022-03-21/2022-03/2022
+ * @param timeType 鏃堕棿绫诲瀷 DAY/MONTH/YEAR
+ * @param energyType 鑳芥簮绫诲瀷
+ * @param modelCode 妯″瀷Code
+ * @return
+ */
+ @Log(title = "鑳借�楃粺璁″垎鏋�-鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級- 鑾峰彇琛ㄦ牸鍒楄〃鏁版嵁")
+ @ApiOperation(value = "鑳借�楃粺璁″垎鏋�-鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級- 鑾峰彇琛ㄦ牸鍒楄〃鏁版嵁", notes = "鑳借�楃粺璁″垎鏋�-鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級- 鑾峰彇琛ㄦ牸鍒楄〃鏁版嵁")
+ @GetMapping(value = "/listEnergyCostTrend")
+ public AjaxResult listEnergyCostTrend(@RequestParam(name = "pageNo", defaultValue = "1") Integer pageNo,
+ @RequestParam(name = "pageSize", defaultValue = "10") Integer pageSize,
+ @RequestParam(name = "timeCode") String timeCode,
+ @RequestParam(name = "timeType") String timeType,
+ @RequestParam(name = "energyType",required = false) String energyType,
+ @RequestParam(name = "modelCode") String modelCode) {
+ return AjaxResult.success(energyConsumeDataService.listEnergyCostTrend(pageNo, pageSize, timeCode, timeType,energyType,
+ modelCode));
+ }
+
+ /**
+ * 鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級
+ *
+ * @param timeCode 鏃堕棿鍊� 涓庢椂闂寸被鍨嬪搴旓細2022-03-21/2022-03/2022
+ * @param timeType 鏃堕棿绫诲瀷 DAY/MONTH/YEAR
+ * @param modelCode 妯″瀷Code
+ * @param energyType 鑳芥簮绫诲瀷
+ * @return
+ */
+ @Log(title = "鑳借�楃粺璁″垎鏋�-鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級")
+ @ApiOperation(value = "鑳借�楃粺璁″垎鏋�-鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級", notes = "鑳借�楃粺璁″垎鏋�-鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級")
+ @GetMapping(value = "/listEnergyCostTrendDetail")
+ public AjaxResult listEnergyCostTrendDetail(@RequestParam(name = "timeCode") String timeCode,
+ @RequestParam(name = "timeType") String timeType,
+ @RequestParam(name = "modelCode") String modelCode,
+ @RequestParam(name = "energyType",required = false) String energyType) {
+ return AjaxResult.success(energyConsumeDataService.listEnergyCostTrendDetail(timeCode, timeType, modelCode, energyType));
+ }
+
+}
diff --git a/zhitan-system/src/main/java/com/zhitan/dataitem/mapper/DataItemMapper.java b/zhitan-system/src/main/java/com/zhitan/dataitem/mapper/DataItemMapper.java
index 94f00fe..99d5317 100644
--- a/zhitan-system/src/main/java/com/zhitan/dataitem/mapper/DataItemMapper.java
+++ b/zhitan-system/src/main/java/com/zhitan/dataitem/mapper/DataItemMapper.java
@@ -123,4 +123,16 @@
*/
List<DataItem> getDataItemHourInforByIndexIds(@Param("beginTime") Date beginTime, @Param("endTime") Date endTime,
@Param("timeType") String timeType, @Param("indexIds") List<String> indexIds);
+
+ /**
+ * 鏌ヨ鑳芥簮绫诲瀷闈炵數鐨勭敤閲�
+ * @param beginTime
+ * @param endTime
+ * @param timeType 鏃堕棿绫诲瀷
+ * @param nodeId 鑺傜偣Id
+ * @param energyType 鑳芥簮绫诲瀷
+ * @return
+ */
+ BigDecimal getDataItemTimeRangeValueByNodeId(@Param("beginTime") Date beginTime, @Param("endTime") Date endTime,
+ @Param("timeType") String timeType, @Param("nodeId") String nodeId, @Param("energyType") String energyType);
}
diff --git a/zhitan-system/src/main/java/com/zhitan/peakvalley/mapper/PeakValleyMapper.java b/zhitan-system/src/main/java/com/zhitan/peakvalley/mapper/PeakValleyMapper.java
index b11d097..98b4e01 100644
--- a/zhitan-system/src/main/java/com/zhitan/peakvalley/mapper/PeakValleyMapper.java
+++ b/zhitan-system/src/main/java/com/zhitan/peakvalley/mapper/PeakValleyMapper.java
@@ -38,4 +38,16 @@
List<ElectricityDataItem> getDataStatisticsDeviationAnalysis(@Param("indexIdSet") Set<String> indexIdSet,
@Param("timeType") String timeType);
+ /**
+ * 鏌ヨ鎴愭湰瓒嬪娍
+ * @param beginTime
+ * @param endTime
+ * @param timeType 鏃堕棿绫诲瀷
+ * @param nodeId 鑺傜偣Id
+ * @param energyType 鑳芥簮绫诲瀷
+ * @return
+ */
+ List<ElectricityDataItem> getCostTrends(@Param("beginTime") Date beginTime, @Param("endTime") Date endTime,
+ @Param("timeType") String timeType, @Param("nodeId") String nodeId,@Param("energyType") String energyType);
+
}
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/common/DateTimeUtil.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/common/DateTimeUtil.java
new file mode 100644
index 0000000..d38bfce
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/common/DateTimeUtil.java
@@ -0,0 +1,750 @@
+package com.zhitan.statisticalAnalysis.common;
+
+import cn.hutool.core.date.DateTime;
+import cn.hutool.core.date.DateUtil;
+import cn.hutool.core.util.ObjectUtil;
+import com.zhitan.common.constant.CommonConst;
+import com.zhitan.common.constant.TimeTypeConst;
+import com.zhitan.common.utils.IntegerUtil;
+import com.zhitan.common.utils.StringUtil;
+import lombok.extern.slf4j.Slf4j;
+import org.apache.commons.lang3.time.DateUtils;
+
+import java.text.ParseException;
+import java.text.SimpleDateFormat;
+import java.util.Calendar;
+import java.util.Date;
+import java.util.GregorianCalendar;
+
+/**
+ * @Description: 鏃堕棿宸ュ叿绫�
+ * @author: yxw
+ * @date: 2022骞�02鏈�02鏃� 12:23
+ */
+@Slf4j
+public class DateTimeUtil {
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡
+ */
+ public static final String COMMON_PATTERN = "yyyy-MM-dd HH:mm:ss";
+ /**
+ * 鏍煎紡鍖栨棩鏈熷埌鍒嗛挓
+ */
+ public static final String COMMON_PATTERN_END_WITH_MINUTE = "yyyy-MM-dd HH:mm";
+ /**
+ * 鏃ユ湡鏍煎紡 - 灏忔椂:鍒嗛挓
+ */
+ public static final String COMMON_PATTERN_HOUR_MINUTE = "HH:mm";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 骞翠唤
+ */
+ public static final String COMMON_PATTERN_YEAR = "yyyy";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 鏌愪竴骞�,
+ */
+ public static final String COMMON_PATTERN_CERTAIN_YEAR = "yy";
+
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 鏈堜唤
+ */
+ public static final String COMMON_PATTERN_MONTH = "yyyyMM";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 鏈堜唤
+ */
+ public static final String COMMON_PATTERN_TO_MONTH = "yyyy-MM";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 鏈堜唤
+ */
+ public static final String COMMON_PATTERN_TO_MONTH_WORD = "yyyy-MM鏈�";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 鏈堜唤
+ */
+ public static final String COMMON_PATTERN_TO_MONTH_ZH = "yyyy骞碝M鏈�";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 澶�
+ */
+ public static final String COMMON_PATTERN_DAY = "yyyyMMdd";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 澶�
+ */
+ public static final String COMMON_PATTERN_TO_DAY = "yyyy-MM-dd";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 澶�
+ */
+ public static final String COMMON_PATTERN_TO_DAY_WORD = "yyyy-MM-dd鏃�";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 鏈堟棩
+ */
+ public static final String COMMON_PATTERN_MONTH_DAY = "MM-dd";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 澶╂煇涓�澶�,
+ */
+ public static final String COMMON_PATTERN_DAY_OF_MONTH = "dd";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 灏忔椂
+ */
+ public static final String COMMON_PATTERN_HOUR = "yyyyMMddHH";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 灏忔椂
+ */
+ public static final String COMMON_PATTERN_TO_HOUR = "yyyy-MM-dd HH";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 灏忔椂
+ */
+ public static final String COMMON_PATTERN_TO_HOUR_WORD = "yyyy-MM-dd HH鏃�";
+ /**
+ * 鏃ユ湡甯哥敤鏍煎紡 - 灏忔椂
+ */
+ public static final String COMMON_PATTERN_TO_HOUR_TEXT = "yyyy骞碝M鏈坉d鏃� HH鏃�";
+
+ /**
+ * 鑾峰彇褰撳墠鏃堕棿,鏃堕棿鏍煎紡锛歽yyy-MM-dd HH:mm:ss
+ *
+ * @return
+ */
+ public static String getNowDateTime() {
+ return getNowDateTime(COMMON_PATTERN);
+ }
+
+ /**
+ * 鑾峰彇褰撳墠鏃堕棿
+ *
+ * @param pattern 鏃堕棿鏍煎紡
+ * @return
+ */
+ public static String getNowDateTime(String pattern) {
+ //璁剧疆鏃ユ湡鏍煎紡
+ SimpleDateFormat df = new SimpleDateFormat(pattern);
+ String dateTime = df.format(new Date());
+ return dateTime;
+ }
+
+ /**
+ * 鑾峰彇浠婂勾鐨勫勾浠藉��
+ *
+ * @return
+ */
+ public static String getNowYear() {
+ return getNowDateTime(COMMON_PATTERN_YEAR);
+ }
+
+ /**
+ * 鑾峰彇浠婂勾鐨勬湀浠藉��
+ *
+ * @return
+ */
+ public static String getNowMonth() {
+ return getNowDateTime(COMMON_PATTERN_MONTH);
+ }
+
+ /**
+ * 瀛楃涓茶浆鎴愭椂闂寸被鍨�,榛樿鏍煎紡锛歽yyy-MM-dd HH:mm:ss
+ *
+ * @param dateTimeStr
+ * @return
+ */
+ public static Date toDateTime(String dateTimeStr) {
+ DateTime dt = null;
+ try {
+ dt = DateTime.of(dateTimeStr, COMMON_PATTERN);
+ } catch (Exception e) {
+
+ }
+ return dt;
+ }
+
+ /**
+ * 瀛楃涓茶浆鎴愭椂闂寸被鍨�
+ *
+ * @param dateTimeStr
+ * @return
+ */
+ public static Date toDateTime(String dateTimeStr, String pattern) {
+ DateTime dt = null;
+ try {
+ dt = DateTime.of(dateTimeStr, pattern);
+ } catch (Exception e) {
+
+ }
+ return dt;
+ }
+
+ /**
+ * 瀛楃涓茶浆鎴愮壒瀹氭牸寮忕殑鏃堕棿瀛楃涓茬被鍨�
+ *
+ * @param dateTimeStr 鏃堕棿瀛楃涓�
+ * @param sourcePattern 瀛楃涓叉椂闂存牸寮�
+ * @param toPattern 瑕佽浆鎴愪粈涔堟牸寮忕殑鏃堕棿
+ * @return
+ */
+ public static String toDateTimeStr(String dateTimeStr, String sourcePattern, String toPattern) {
+ String str = CommonConst.EMPTY;
+ try {
+ DateTime dt = DateTime.of(dateTimeStr, sourcePattern);
+ str = getDateTime(dt, toPattern);
+ } catch (Exception e) {
+
+ }
+ return str;
+ }
+
+ /**
+ * 鏃堕棿杞垚鎸囧畾鐨勬牸寮�
+ *
+ * @param pattern 鏃堕棿鏍煎紡
+ * @return
+ */
+ public static String getDateTime(Date dt, String pattern) {
+ //璁剧疆鏃ユ湡鏍煎紡
+ SimpleDateFormat df = new SimpleDateFormat(pattern);
+ return df.format(dt);
+ }
+
+ /**
+ * 鏃堕棿杞垚yyyy-MM-dd HH:mm:ss鏍煎紡
+ *
+ * @return
+ */
+ public static String getDateTime(Date dt) {
+ if (ObjectUtil.isEmpty(dt)) {
+ return CommonConst.EMPTY;
+ }
+ return getDateTime(dt, COMMON_PATTERN);
+ }
+
+ /**
+ * 鑾峰彇褰撳墠鏃堕棿鎵�灞炴湀浠界殑鏈�鍚庝竴澶�
+ *
+ * @return
+ */
+ public static int getDateTimeLastDay(Date dt) {
+ String month = getMonth(dt);
+ String firstDate = month + "01";
+ Date nextMonthFirstDate = addMonths(toDateTime(firstDate, COMMON_PATTERN_DAY), CommonConst.DIGIT_1);
+ Date currentMonthLastDate = addDays(nextMonthFirstDate, CommonConst.DIGIT_MINUS_1);
+ int day = IntegerUtil.toInt(getDateTime(currentMonthLastDate, COMMON_PATTERN_DAY_OF_MONTH));
+ return day;
+ }
+
+ /**
+ * 鑾峰彇骞翠唤鍊�
+ *
+ * @return
+ */
+ public static String getYear(Date dt) {
+ return getDateTime(dt, COMMON_PATTERN_YEAR);
+ }
+
+ /**
+ * 鑾峰彇鏈堜唤鍊� 202202
+ *
+ * @return
+ */
+ public static String getMonth(Date dt) {
+ return getDateTime(dt, COMMON_PATTERN_MONTH);
+ }
+
+ /**
+ * 鑾峰彇澶�,鏍煎紡锛歽yyyMMdd
+ *
+ * @return
+ */
+ public static String toDay(Date dt) {
+ return getDateTime(dt, COMMON_PATTERN_DAY);
+ }
+
+ /**
+ * 鑾峰彇灏忔椂:yyyyMMddHH
+ *
+ * @return
+ */
+ public static String toHour(Date dt) {
+ return getDateTime(dt, COMMON_PATTERN_HOUR);
+ }
+
+ /**
+ * 杞垚瀛楃涓茬被鍨嬪��
+ *
+ * @return
+ */
+ public static String toString(Date dt) {
+ return getDateTime(dt, COMMON_PATTERN);
+ }
+
+ /**
+ * 鏃堕棿澧炲姞瀵瑰簲鐨勫勾鏁�
+ *
+ * @param dateTime
+ * @param years
+ * @return
+ */
+ public static Date addYears(Date dateTime, int years) {
+ return calcDate(dateTime, years, Calendar.YEAR);
+ }
+
+ /**
+ * 鏃堕棿澧炲姞瀵瑰簲鐨勬湀鏁�
+ *
+ * @param dateTime
+ * @param months
+ * @return
+ */
+ public static Date addMonths(Date dateTime, int months) {
+ return calcDate(dateTime, months, Calendar.MONTH);
+ }
+
+ /**
+ * 鏃堕棿澧炲姞瀵瑰簲鐨勫ぉ鏁�
+ *
+ * @param dateTime
+ * @param days
+ * @return
+ */
+ public static Date addDays(Date dateTime, int days) {
+ return calcDate(dateTime, days, Calendar.DATE);
+ }
+
+ /**
+ * 鏃堕棿澧炲姞瀵瑰簲鐨勫皬鏃舵暟
+ *
+ * @param dateTime
+ * @param hours
+ * @return
+ */
+ public static Date addHours(Date dateTime, int hours) {
+ return calcDate(dateTime, hours, Calendar.HOUR);
+ }
+
+ /**
+ * 鏃堕棿澧炲姞瀵瑰簲鐨勫垎閽熸暟
+ *
+ * @param dateTime
+ * @param minutes
+ * @return
+ */
+ public static Date addMinutes(Date dateTime, int minutes) {
+ return calcDate(dateTime, minutes, Calendar.MINUTE);
+ }
+
+ /**
+ * 鏃堕棿澧炲姞瀵瑰簲鐨勫皬鏃舵暟
+ *
+ * @param dateTime
+ * @param seconds
+ * @return
+ */
+ public static Date addSeconds(Date dateTime, int seconds) {
+ return calcDate(dateTime, seconds, Calendar.SECOND);
+ }
+
+ /**
+ * 璁＄畻鏃ユ湡閫氱敤鏂规硶
+ *
+ * @param dateTime
+ * @param addValue
+ * @param calendarType 璁＄畻绫诲瀷锛欳alendar.YEAR锛孋alendar.MONTH,Calendar.DAY
+ * @return
+ */
+ private static Date calcDate(Date dateTime, int addValue, int calendarType) {
+ Date dt = null;
+ try {
+ Calendar calendar = new GregorianCalendar();
+ calendar.setTime(dateTime);
+ //鎶婃棩鏈熷線鍚庡鍔犱竴骞达紝鏁存暟寰�鍚庢帹锛岃礋鏁板線鍓嶇Щ
+ calendar.add(calendarType, addValue);
+ // 鑾峰彇鐩稿姞鎴栬�呯浉鍑忎箣鍚庣殑鏃堕棿鍊�
+ Date tempDt = calendar.getTime();
+ // 鎶婃椂闂磋浆鎴愭墍闇�瑕佺殑鏍煎紡
+ String temp = getDateTime(tempDt, COMMON_PATTERN);
+ dt = toDateTime(temp);
+ } catch (Exception e) {
+
+ }
+ return dt;
+ }
+
+ /**
+ * 鑾峰彇璇ユ椂闂村睘浜庡綋澶╃殑绗嚑涓皬鏃�
+ *
+ * @param dateTime
+ * @return
+ */
+ public static int getHourOfDay(Date dateTime) {
+ return getDateValue(dateTime, Calendar.HOUR_OF_DAY);
+ }
+
+ /**
+ * 鑾峰彇璇ユ椂闂村睘浜庡綋鏈堢殑绗嚑澶�
+ *
+ * @param dateTime
+ * @return
+ */
+ public static int getDayOfMonth(Date dateTime) {
+ return getDateValue(dateTime, Calendar.DAY_OF_MONTH);
+ }
+
+ /**
+ * 鑾峰彇璇ユ椂闂村睘浜庡綋鍛ㄧ殑绗嚑澶�
+ * 涓�鍛ㄧ殑绗竴澶╂槸鍛ㄦ棩
+ *
+ * @param dateTime
+ * @return
+ */
+ public static int getDayOfWeek(Date dateTime) {
+ return getDateValue(dateTime, Calendar.DAY_OF_WEEK);
+ }
+
+ /**
+ * 鑾峰彇璇ユ椂闂村睘浜庡勾鐨勭鍑犱釜鏈�
+ * 鏈堜唤鍊�+1鏄湡瀹炵殑褰撳墠鏈�
+ *
+ * @param dateTime
+ * @return 宸茬粡鍦ㄧ郴缁熶腑鑾峰彇鍊肩殑鍩虹涓婂姞1浜嗭紝鐜板湪鏄湡瀹炵殑褰撳墠鏈堜唤鍊�
+ */
+ public static int getMonthOfYear(Date dateTime) {
+ return getDateValue(dateTime, Calendar.MONTH) + 1;
+ }
+
+ /**
+ * 鑾峰彇褰撳ぉ鐨勭鍑犱釜灏忔椂/褰撴湀鐨勭鍑犲ぉ/褰撳勾鐨勭鍑犱釜鏈�
+ *
+ * @param dateTime 濡傛灉鏃堕棿鍊间负绌猴紝榛樿褰撳墠鏃堕棿
+ * @param calendarType
+ * @return
+ */
+ private static int getDateValue(Date dateTime, int calendarType) {
+ int value = 0;
+ try {
+ if (ObjectUtil.isEmpty(dateTime)) {
+ dateTime = new Date();
+ }
+ Calendar calendar = new GregorianCalendar();
+ calendar.setTime(dateTime);
+ value = calendar.get(calendarType);
+ } catch (Exception e) {
+
+ }
+ return value;
+ }
+
+ /**
+ * 瀵规瘮time1 鍜� time2 鐨勫ぇ灏�
+ *
+ * @param time1
+ * @param time2
+ * @return -1:time1灏忎簬time2;0:time1绛変簬time2;1:time1澶т簬time2;
+ */
+ public static int compareDateDiff(Date time1, Date time2) {
+ long diff = time1.getTime() - time2.getTime();
+ int res = 0;
+ if (diff > 0) {
+ res = 1;
+ } else if (diff < 0) {
+ res = -1;
+ }
+ return res;
+ }
+
+ /**
+ * 鑾峰彇鏌ヨdata_item鎵�闇�瑕佺殑timecode鍊�
+ *
+ * @param timeType 鏃ユ湡绫诲瀷
+ * @param date 鏃堕棿
+ * @return
+ */
+ public static String getTimeCode(String timeType, Date date) {
+ String timeCode = CommonConst.EMPTY;
+ if (ObjectUtil.isEmpty(date)) {
+ date = new Date();
+ }
+ timeType = StringUtil.ifEmptyOrNullReturnValue(timeType).toUpperCase();
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ timeCode = CommonConst.WORD_H + getDateTime(date, COMMON_PATTERN_HOUR);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ timeCode = CommonConst.WORD_D + getDateTime(date, COMMON_PATTERN_DAY);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ timeCode = CommonConst.WORD_M + getDateTime(date, COMMON_PATTERN_MONTH);
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ timeCode = CommonConst.WORD_Y + getDateTime(date, COMMON_PATTERN_YEAR);
+ break;
+ default:
+ break;
+ }
+ return timeCode;
+ }
+
+ /**
+ * 鑾峰彇鏌ヨ鏃ユ湀骞存姤琛ㄦ墍闇�瑕佺殑timecode鍊�
+ *
+ * @param timeType 鏃ユ湡绫诲瀷
+ * @param date 鏃堕棿
+ * @return
+ */
+ public static String getReportTimeCode(String timeType, Date date) {
+ String timeCode = CommonConst.EMPTY;
+ if (ObjectUtil.isEmpty(date)) {
+ date = new Date();
+ }
+ timeType = StringUtil.ifEmptyOrNullReturnValue(timeType).toUpperCase();
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ timeCode = getDateTime(date, COMMON_PATTERN_TO_HOUR);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ timeCode = getDateTime(date, COMMON_PATTERN_TO_DAY);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ timeCode = getDateTime(date, COMMON_PATTERN_TO_MONTH);
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ timeCode = getDateTime(date, COMMON_PATTERN_YEAR);
+ break;
+ default:
+ break;
+ }
+ return timeCode;
+ }
+
+ /**
+ * 鑾峰彇鏃堕棿瀵瑰簲鐨勭幆姣旀椂闂�
+ *
+ * @param timeType HOUR/DAY/MONTH/YEAR
+ * @param date 鏃堕棿鍊�
+ * @return
+ */
+ public static Date getLoopTime(String timeType, Date date) {
+ Date dt = null;
+ if (ObjectUtil.isEmpty(date)) {
+ date = new Date();
+ }
+ timeType = StringUtil.ifEmptyOrNullReturnValue(timeType).toUpperCase();
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ dt = addHours(date, CommonConst.DIGIT_MINUS_1);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ dt = addDays(date, CommonConst.DIGIT_MINUS_1);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ dt = addMonths(date, CommonConst.DIGIT_MINUS_1);
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ dt = addYears(date, CommonConst.DIGIT_MINUS_1);
+ break;
+ default:
+ break;
+ }
+ return dt;
+ }
+
+ /**
+ * 鑾峰彇鏁寸偣鏃堕棿
+ *
+ * @param timeType HOUR/DAY/MONTH/YEAR
+ * @param date 鏃堕棿鍊�
+ * @return
+ */
+ public static Date getHourTime(String timeType, Date date) {
+ Date dt = null;
+ if (ObjectUtil.isEmpty(date)) {
+ date = new Date();
+ }
+ String tempStr = null;
+ timeType = StringUtil.ifEmptyOrNullReturnValue(timeType).toUpperCase();
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ tempStr = getDateTime(date, COMMON_PATTERN_TO_HOUR);
+ dt = toDateTime(tempStr, COMMON_PATTERN_TO_HOUR);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ tempStr = getDateTime(date, COMMON_PATTERN_TO_DAY);
+ dt = toDateTime(tempStr, COMMON_PATTERN_TO_DAY);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ tempStr = getDateTime(date, COMMON_PATTERN_TO_MONTH);
+ dt = toDateTime(tempStr, COMMON_PATTERN_TO_MONTH);
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ tempStr = getDateTime(date, COMMON_PATTERN_YEAR);
+ dt = toDateTime(tempStr, COMMON_PATTERN_YEAR);
+ break;
+ default:
+ break;
+ }
+ return dt;
+ }
+
+ /**
+ * 璁＄畻涓や釜鏃堕棿闂撮殧澶╂暟锛堟棩鏈熸牸寮忔瘮杈冿級
+ *
+ * @param beginTime
+ * @param endTime
+ * @return
+ */
+ public static int daysBetween(Date beginTime, Date endTime) {
+ Calendar calendar = Calendar.getInstance();
+ calendar.setTime(beginTime);
+ long beginStamp = calendar.getTimeInMillis();
+ calendar.setTime(endTime);
+ long endStamp = calendar.getTimeInMillis();
+ long betweenDays = (endStamp - beginStamp) / (1000 * 3600 * 24);
+ return Integer.parseInt(String.valueOf(betweenDays));
+ }
+
+ /**
+ * 璁＄畻涓や釜鏃堕棿闂撮殧澶╂暟锛堝瓧绗︿覆鏍煎紡姣旇緝锛�
+ *
+ * @param beginTime
+ * @param endTime
+ * @return
+ */
+ public static int daysBetween(String beginTime, String endTime) {
+ try {
+ SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd");
+ Date begin = format.parse(beginTime);
+ Date end = format.parse(endTime);
+ return daysBetween(begin, end);
+ } catch (ParseException exception) {
+ log.error("璁＄畻涓や釜鏃堕棿闂撮殧澶╂暟" + exception.getMessage());
+ return 0;
+ }
+ }
+
+ /**
+ * 鏍规嵁鏃堕棿绫诲瀷鎶婂瓧绗︿覆杞垚瀵瑰簲鐨勬椂闂�
+ *
+ * @param timeType 鏃堕棿绫诲瀷
+ * @param time 鏃堕棿瀛楃涓�
+ * @return
+ */
+ public static Date getTime(String timeType, String time) {
+ Date dt = null;
+ timeType = StringUtil.ifEmptyOrNullReturnValue(timeType).toUpperCase();
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ dt = toDateTime(time, COMMON_PATTERN_TO_HOUR);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ dt = toDateTime(time, COMMON_PATTERN_TO_DAY);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ dt = toDateTime(time, COMMON_PATTERN_TO_MONTH);
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ dt = toDateTime(time, COMMON_PATTERN_YEAR);
+ break;
+ default:
+ break;
+ }
+ return dt;
+ }
+
+ /**
+ * 鏍规嵁鏃堕棿绫诲瀷鎶婅繛缁殑鏃ユ湡瀛楃涓茶浆鎴愬搴旂殑鏃堕棿 锛�202303銆�20230303銆�2023030301銆�202303030101锛�
+ *
+ * @param timeType 鏃堕棿绫诲瀷
+ * @param time 鏃堕棿瀛楃涓�
+ * @return
+ */
+ public static Date getTimeByContinuousTimeCode(String timeType, String time) {
+ Date dt = null;
+ timeType = StringUtil.ifEmptyOrNullReturnValue(timeType).toUpperCase();
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ dt = toDateTime(time, COMMON_PATTERN_HOUR);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ dt = toDateTime(time, COMMON_PATTERN_DAY);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ dt = toDateTime(time, COMMON_PATTERN_MONTH);
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ dt = toDateTime(time, COMMON_PATTERN_YEAR);
+ break;
+ default:
+ break;
+ }
+ return dt;
+ }
+
+ /**
+ * 鏍规嵁鏃堕棿绫诲瀷杩斿洖澶┿�佹湀銆佸勾鏈�鍚庣殑鏃堕棿
+ *
+ * @param timeType 鏃堕棿绫诲瀷
+ * @param time 鏃堕棿
+ * @return
+ */
+ public static Date getEndTimeByType(String timeType, Date time) {
+ Date dt = null;
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_DAY:
+ dt = DateUtil.endOfDay(time);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ dt = DateUtil.endOfMonth(time);
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ dt = DateUtil.endOfYear(time);
+ break;
+ default:
+ break;
+ }
+ return dt;
+ }
+
+ /**
+ * 鏍规嵁鍛ㄦ湡绫诲瀷瀵圭敓浜у懆鏈熻繘琛屽姞鍑忚绠�
+ * 濉姤鍛ㄦ湡绫诲瀷锛圚OUR灏忔椂銆丏AY澶┿�丮ONTH鏈堛�乊EAR骞达級
+ *
+ * @param date 鐢熶骇鍛ㄦ湡
+ * @param cycleType 鐢熶骇鍛ㄦ湡绫诲瀷
+ * @param cycleType 鐢熶骇鍛ㄦ湡绫诲瀷
+ * @param val 璁＄畻鍊�
+ * @return
+ */
+ public static Date productionCycleCal(Date date, String cycleType,int val) {
+ Date momDate = date;
+ switch (cycleType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ momDate = DateUtils.addHours(date, val);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ momDate = DateUtils.addDays(date, val);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ momDate = DateUtils.addMonths(date, val);
+ break;
+ }
+ return momDate;
+ }
+
+ /**
+ * 鏍规嵁鍛ㄦ湡绫诲瀷瀵圭敓浜у懆鏈熻繘琛屽姞鍑忚绠� 骞朵笖杩涗綅 渚嬪锛� HOUR +1杩涗綅灏辨槸 鍔犱竴澶�
+ * 濉姤鍛ㄦ湡绫诲瀷锛圚OUR灏忔椂銆丏AY澶┿�丮ONTH鏈堛�乊EAR骞达級
+ *
+ * @param date 鐢熶骇鍛ㄦ湡
+ * @param cycleType 鐢熶骇鍛ㄦ湡绫诲瀷
+ * @param val 璁＄畻鍊�
+ * @return
+ */
+ public static Date productionCycleCalCarry(Date date, String cycleType,int val) {
+ Date momDate = date;
+ switch (cycleType) {
+ case TimeTypeConst.TIME_TYPE_HOUR:
+ momDate = DateUtils.addDays(date, val);
+ break;
+ case TimeTypeConst.TIME_TYPE_DAY:
+ momDate = DateUtils.addMonths(date, val);
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ momDate = DateUtils.addYears(date, val);
+ break;
+ }
+ return momDate;
+ }
+}
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/CostTrendEnergyTypeItem.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/CostTrendEnergyTypeItem.java
new file mode 100644
index 0000000..6ccf9a9
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/CostTrendEnergyTypeItem.java
@@ -0,0 +1,47 @@
+package com.zhitan.statisticalAnalysis.domain.vo;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import io.swagger.annotations.ApiModel;
+import io.swagger.annotations.ApiModelProperty;
+import lombok.Data;
+
+import java.io.Serializable;
+import java.math.BigDecimal;
+
+
+/**
+ * 鎴愭湰瓒嬪娍-鑳芥簮绫诲瀷
+ *
+ * @Author: Zhujw
+ * @Date: 2023/2/14
+ */
+@Data
+@ApiModel(value = "鎴愭湰瓒嬪娍-鑳芥簮绫诲瀷", description = "鎴愭湰瓒嬪娍-鑳芥簮绫诲瀷")
+public class CostTrendEnergyTypeItem implements Serializable {
+
+ /**
+ * 鑳芥簮绫诲瀷
+ */
+ @ApiModelProperty(value = "鑳芥簮绫诲瀷")
+ private String energyType;
+
+ /**
+ * 鑳芥簮鍚嶇О
+ */
+ @ApiModelProperty(value = "鑳芥簮鍚嶇О")
+ private String energyName;
+
+ /**
+ * 绱Н閲�
+ */
+ @ApiModelProperty(value = "绱Н閲�")
+ @JsonFormat(shape = JsonFormat.Shape.STRING)
+ private BigDecimal accumulation;
+
+ /**
+ * 璐圭敤
+ */
+ @ApiModelProperty(value = "璐圭敤")
+ @JsonFormat(shape = JsonFormat.Shape.STRING)
+ private BigDecimal cost;
+}
\ No newline at end of file
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeTrendDetailItem.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeTrendDetailItem.java
new file mode 100644
index 0000000..ccc4a25
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeTrendDetailItem.java
@@ -0,0 +1,83 @@
+package com.zhitan.statisticalAnalysis.domain.vo;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import io.swagger.annotations.ApiModel;
+import io.swagger.annotations.ApiModelProperty;
+import lombok.Data;
+
+import java.math.BigDecimal;
+import java.util.List;
+
+
+/**
+ * 璐圭敤鍒嗘瀽-鎴愭湰瓒嬪娍鍒嗘瀽缁熻鍥捐繑鍥炲�间俊鎭�
+ *
+ * @Author: Zhujw
+ * @Date: 2023/2/14
+*/
+@Data
+@ApiModel(value = "璐圭敤鍒嗘瀽-鎴愭湰瓒嬪娍鍒嗘瀽缁熻鍥捐繑鍥炲�间俊鎭�", description = "璐圭敤鍒嗘瀽-鎴愭湰瓒嬪娍鍒嗘瀽缁熻鍥捐繑鍥炲�间俊鎭�")
+public class EnergyConsumeTrendDetailItem {
+
+ /**
+ * 鑳芥簮绫诲瀷
+ */
+ @ApiModelProperty(value = "鑳芥簮绫诲瀷")
+ private String energyType;
+
+ /**
+ * 鑳芥簮鍗曚綅
+ */
+ @ApiModelProperty(value = "鑳芥簮鍗曚綅")
+ private String energyUnit;
+
+ /**
+ * 绱Н閲忔爣绛�
+ */
+ @ApiModelProperty(value = "绱Н閲忔爣绛�")
+ private String accumulationLabel;
+
+ /**
+ * 璐圭敤鏍囩
+ */
+ @ApiModelProperty(value = "璐圭敤鏍囩")
+ private String costLabel;
+
+ /**
+ * 绱Н閲�
+ */
+ @ApiModelProperty(value = "绱Н閲�")
+ @JsonFormat(shape = JsonFormat.Shape.STRING)
+ private BigDecimal accumulation;
+
+ /**
+ * 璐圭敤
+ */
+ @ApiModelProperty(value = "璐圭敤")
+ @JsonFormat(shape = JsonFormat.Shape.STRING)
+ private BigDecimal cost;
+
+ /**
+ * 绱Н閲弅ey闆嗗悎
+ */
+ @ApiModelProperty(value = "绱Н閲弅ey闆嗗悎")
+ private List<String> accumulationKeyList;
+
+ /**
+ * 绱Н閲弙alue闆嗗悎
+ */
+ @ApiModelProperty(value = "绱Н閲弙alue闆嗗悎")
+ private List<BigDecimal> accumulationValueList;
+
+ /**
+ * 璐圭敤key闆嗗悎
+ */
+ @ApiModelProperty(value = "璐圭敤key闆嗗悎")
+ private List<String> costKeyList;
+
+ /**
+ * 璐圭敤value闆嗗悎
+ */
+ @ApiModelProperty(value = "璐圭敤value闆嗗悎")
+ private List<BigDecimal> costValueList;
+}
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeVO.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeVO.java
new file mode 100644
index 0000000..c38a70e
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyConsumeVO.java
@@ -0,0 +1,43 @@
+package com.zhitan.statisticalAnalysis.domain.vo;
+
+import lombok.Data;
+
+import java.io.Serializable;
+import java.math.BigDecimal;
+import java.util.Date;
+
+
+/**
+ * 鑳借�楀疄浣撶被
+ *
+ * @Author: Zhujw
+ * @Date: 2023/1/28
+ */
+@Data
+public class EnergyConsumeVO implements Serializable {
+
+ /**
+ * 璁￠噺鍣ㄥ叿id
+ */
+ private String deviceId;
+
+ /**
+ * 鑳芥簮绫诲瀷
+ */
+ private String energyType;
+
+ /**
+ * 鏃堕棿缂栫爜
+ */
+ private Date dataTime;
+
+ /**
+ * 璐圭敤
+ */
+ private BigDecimal costValue;
+
+ /**
+ * 绱閲�
+ */
+ private BigDecimal accumulationValue;
+}
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendItem.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendItem.java
new file mode 100644
index 0000000..2d5b8d4
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendItem.java
@@ -0,0 +1,51 @@
+package com.zhitan.statisticalAnalysis.domain.vo;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import io.swagger.annotations.ApiModel;
+import io.swagger.annotations.ApiModelProperty;
+import lombok.Data;
+
+import java.math.BigDecimal;
+import java.util.List;
+
+/**
+ * 鎴愭湰瓒嬪娍鍒嗘瀽-琛ㄦ牸淇℃伅
+ *
+ * @Author: Zhujw
+ * @Date: 2023/2/14
+ */
+@Data
+@ApiModel(value = "鎴愭湰瓒嬪娍鍒嗘瀽-琛ㄦ牸淇℃伅", description = "鎴愭湰瓒嬪娍鍒嗘瀽-琛ㄦ牸淇℃伅")
+public class EnergyCostTrendItem {
+
+ /**
+ * 鐢ㄨ兘鍗曞厓id
+ */
+ @ApiModelProperty(value = "鐢ㄨ兘鍗曞厓id")
+ private String energyUnitId;
+
+ /**
+ * 鐢ㄨ兘鍗曞厓鍚嶇О
+ */
+ @ApiModelProperty(value = "鐢ㄨ兘鍗曞厓鍚嶇О")
+ private String energyUnitName;
+
+ /**
+ * 鎬昏垂鐢�
+ */
+ @ApiModelProperty(value = "鎬昏垂鐢�")
+ @JsonFormat(shape = JsonFormat.Shape.STRING)
+ private BigDecimal total;
+
+ /**
+ * 鏃堕棿
+ */
+ @ApiModelProperty(value = "鏃堕棿")
+ private String dateCode;
+
+ /**
+ * 鑳芥簮绫诲瀷
+ */
+ @ApiModelProperty(value = "鑳芥簮绫诲瀷")
+ private List<CostTrendEnergyTypeItem> itemList;
+}
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendPage.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendPage.java
new file mode 100644
index 0000000..a865034
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/domain/vo/EnergyCostTrendPage.java
@@ -0,0 +1,22 @@
+package com.zhitan.statisticalAnalysis.domain.vo;
+
+import lombok.Data;
+
+import java.util.List;
+
+/**
+ * @Description: TODO
+ * @author: yxw
+ * @date: 2022骞�04鏈�15鏃� 10:07
+ */
+@Data
+public class EnergyCostTrendPage {
+ /**
+ * 鏁版嵁鍒楄〃
+ */
+ private List<EnergyCostTrendItem> itemList;
+ /**
+ * 璁板綍鎬绘暟閲�
+ */
+ private long total;
+}
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/IEnergyConsumeDataService.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/IEnergyConsumeDataService.java
new file mode 100644
index 0000000..e7c0174
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/IEnergyConsumeDataService.java
@@ -0,0 +1,35 @@
+package com.zhitan.statisticalAnalysis.service;
+
+import com.zhitan.statisticalAnalysis.domain.vo.*;
+
+import java.util.List;
+
+/**
+ * 鑳芥簮娑堣�楃粺璁＄浉鍏虫煡璇�
+ */
+public interface IEnergyConsumeDataService {
+
+ /**
+ * 鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級- 鑾峰彇琛ㄦ牸鍒楄〃鏁版嵁
+ *
+ * @param pageNo 椤电爜鏁�
+ * @param pageSize 姣忛〉鏁版嵁澶氬皯
+ * @param timeCode 鏃堕棿鍊� 涓庢椂闂寸被鍨嬪搴旓細2022-03-21/2022-03/2022
+ * @param timeType 鏃堕棿绫诲瀷 DAY/MONTH/YEAR
+ * @param energyType 鑳芥簮绫诲瀷
+ * @param modelCode 妯″瀷Code
+ * @return
+ */
+ EnergyCostTrendPage listEnergyCostTrend(int pageNo, int pageSize, String timeCode, String timeType,String energyType, String modelCode);
+
+ /**
+ * 鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級
+ *
+ * @param timeCode 鏃堕棿鍊� 涓庢椂闂寸被鍨嬪搴旓細2022-03-21/2022-03/2022
+ * @param timeType 鏃堕棿绫诲瀷 DAY/MONTH/YEAR
+ * @param modelCode 妯″瀷Code
+ * @param energyType 鑳芥簮绫诲瀷
+ * @return
+ */
+ List<EnergyConsumeTrendDetailItem> listEnergyCostTrendDetail(String timeCode, String timeType, String modelCode, String energyType);
+}
diff --git a/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/impl/EnergyConsumeDataServiceImpl.java b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/impl/EnergyConsumeDataServiceImpl.java
new file mode 100644
index 0000000..5819d02
--- /dev/null
+++ b/zhitan-system/src/main/java/com/zhitan/statisticalAnalysis/service/impl/EnergyConsumeDataServiceImpl.java
@@ -0,0 +1,308 @@
+package com.zhitan.statisticalAnalysis.service.impl;
+
+import cn.hutool.core.date.DateUtil;
+import com.baomidou.mybatisplus.core.toolkit.Wrappers;
+import com.zhitan.basicdata.domain.SysEnergy;
+import com.zhitan.basicdata.mapper.SysEnergyMapper;
+import com.zhitan.carbonemission.domain.CarbonEmission;
+import com.zhitan.common.constant.CommonConst;
+import com.zhitan.common.constant.TimeTypeConst;
+import com.zhitan.common.utils.StringUtils;
+import com.zhitan.dataitem.mapper.DataItemMapper;
+import com.zhitan.model.domain.ModelNode;
+import com.zhitan.model.domain.NodeIndex;
+import com.zhitan.model.mapper.ModelNodeMapper;
+import com.zhitan.model.mapper.NodeIndexMapper;
+import com.zhitan.peakvalley.domain.ElectricityDataItem;
+import com.zhitan.peakvalley.mapper.PeakValleyMapper;
+import com.zhitan.statisticalAnalysis.common.DateTimeUtil;
+import lombok.AllArgsConstructor;
+import org.apache.commons.lang3.ObjectUtils;
+import com.zhitan.statisticalAnalysis.domain.vo.*;
+import com.zhitan.statisticalAnalysis.service.IEnergyConsumeDataService;
+import org.springframework.stereotype.Service;
+
+import java.math.BigDecimal;
+import java.math.RoundingMode;
+import java.text.SimpleDateFormat;
+import java.util.*;
+import java.util.stream.Collectors;
+
+/**
+ * @Description: TODO
+ * @author: yxw
+ * @date: 2022骞�04鏈�12鏃� 14:15
+ */
+@Service
+@AllArgsConstructor
+public class EnergyConsumeDataServiceImpl implements IEnergyConsumeDataService {
+
+ private DataItemMapper dataItemMapper;
+ private ModelNodeMapper modelNodeMapper;
+ private NodeIndexMapper nodeIndexMapper;
+ private PeakValleyMapper peakValleyMapper;
+ private SysEnergyMapper sysEnergyMapper;
+
+ /**
+ * 鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級- 鑾峰彇琛ㄦ牸鍒楄〃鏁版嵁
+ *
+ * @param pageNo 椤电爜鏁�
+ * @param pageSize 姣忛〉鏁版嵁澶氬皯
+ * @param timeCode 鏃堕棿鍊� 涓庢椂闂寸被鍨嬪搴旓細2022-03-21/2022-03/2022
+ * @param timeType 鏃堕棿绫诲瀷 DAY/MONTH/YEAR
+ * @param energyType 鑳芥簮绫诲瀷
+ * @param modelCode 妯″瀷Code
+ * @return
+ */
+ @Override
+ public EnergyCostTrendPage listEnergyCostTrend(int pageNo, int pageSize, String timeCode, String timeType, String energyType,
+ String modelCode) {
+ //鑳芥簮绫诲瀷淇℃伅
+ SysEnergy sysEnergy = new SysEnergy();
+ if (StringUtils.isNotEmpty(energyType)) {
+ sysEnergy.setEnersno(energyType);
+ }
+ List<SysEnergy> sysEnergies = sysEnergyMapper.selectSysEnergyList(sysEnergy);
+ if (sysEnergies.isEmpty()) {
+ throw new RuntimeException("鏈煡璇㈠埌鑳芥簮淇℃伅");
+ }
+ //鑺傜偣淇℃伅
+ List<ModelNode> modelNodes = modelNodeMapper.selectList(Wrappers.<ModelNode>lambdaQuery().eq(ModelNode::getModelCode, modelCode)
+ .isNull(ModelNode::getParentId));
+ if (ObjectUtils.isEmpty(modelNodes)) {
+ throw new RuntimeException("鏈煡璇㈠埌鑺傜偣淇℃伅");
+ }
+ ModelNode modelNodeInfo = modelNodes.stream().findFirst().get();
+ //鐐逛綅淇℃伅
+ List<NodeIndex> nodeIndices = nodeIndexMapper.selectList(Wrappers.<NodeIndex>lambdaQuery()
+ .eq(NodeIndex::getNodeId, modelNodeInfo.getNodeId()));
+ if (nodeIndices.isEmpty()) {
+ throw new RuntimeException("鏈煡璇㈠埌鐐逛綅淇℃伅");
+ }
+
+ // 鎬昏垂鐢�
+ BigDecimal totalCost = BigDecimal.ZERO;
+ // 閬嶅巻鑳芥簮绫诲瀷
+ List<CostTrendEnergyTypeItem> itemList = new ArrayList<>();
+ for (SysEnergy sysEnergyInfo : sysEnergies) {
+ CostTrendEnergyTypeItem item = new CostTrendEnergyTypeItem();
+ item.setEnergyType(sysEnergyInfo.getEnersno());
+ item.setEnergyName(sysEnergyInfo.getEnername());
+ // 澶勭悊鏃堕棿
+ Date bsTime = DateTimeUtil.getTime(timeType, timeCode);
+ Date endTime = DateTimeUtil.getEndTimeByType(timeType, bsTime);
+ totalCost = getEnergyUnitCostTrendAnalysisValueInfo(timeType, bsTime, endTime, totalCost, nodeIndices, modelNodeInfo.getNodeId(), sysEnergyInfo, item);
+ itemList.add(item);
+ }
+ // 閬嶅巻鐢ㄨ兘鍗曞厓鑾峰彇琛ㄦ牸涓殑鏁版嵁
+ List<EnergyCostTrendItem> trendItemList = new ArrayList<>();
+ EnergyCostTrendItem energyCostTrendItem = new EnergyCostTrendItem();
+ energyCostTrendItem.setDateCode(timeCode);
+ energyCostTrendItem.setTotal(totalCost.setScale(CommonConst.DIGIT_2, RoundingMode.HALF_UP));
+ energyCostTrendItem.setItemList(itemList);
+ trendItemList.add(energyCostTrendItem);
+
+ EnergyCostTrendPage energyCostTrendPage = new EnergyCostTrendPage();
+ energyCostTrendPage.setTotal(1);
+ energyCostTrendPage.setItemList(trendItemList);
+ return energyCostTrendPage;
+ }
+
+ /**
+ * 鑾峰彇鐢ㄨ兘鍗曞厓鎴愭湰瓒嬪娍鍒嗘瀽绱Н閲忋�佽垂鐢ㄤ俊鎭�
+ *
+ * @param timeType 鏃堕棿绫诲瀷
+ * @param bsTime 寮�濮嬫椂闂�
+ * @param endTime 缁撴潫鏃堕棿
+ * @param totalCost 鎬昏垂鐢�
+ * @param nodeIndices 鑺傜偣鐐逛綅闆嗗悎
+ * @param nodeId 鑺傜偣id
+ * @param sysEnergyInfo 鑳芥簮绫诲瀷淇℃伅
+ * @param item 杩斿洖瀵硅薄
+ * @return
+ */
+ private BigDecimal getEnergyUnitCostTrendAnalysisValueInfo(String timeType, Date bsTime, Date endTime, BigDecimal totalCost,
+ List<NodeIndex> nodeIndices, String nodeId, SysEnergy sysEnergyInfo,
+ CostTrendEnergyTypeItem item) {
+ BigDecimal costValue = BigDecimal.ZERO;
+ BigDecimal accumulationValue = BigDecimal.ZERO;
+ switch (sysEnergyInfo.getEnersno()) {
+ case "electric":
+ List<ElectricityDataItem> electricityDataItems = peakValleyMapper.getDataStatistics(nodeIndices.stream().map(NodeIndex::getIndexId).collect(Collectors.toSet()), bsTime, endTime, timeType);
+ costValue = electricityDataItems.stream().map(ElectricityDataItem::getCost).reduce(BigDecimal.ZERO, BigDecimal::add);
+ accumulationValue = electricityDataItems.stream().map(ElectricityDataItem::getElectricity).reduce(BigDecimal.ZERO, BigDecimal::add);
+ break;
+ default:
+ accumulationValue = dataItemMapper.getDataItemTimeRangeValueByNodeId(bsTime, endTime, timeType, nodeId, sysEnergyInfo.getEnersno());
+ costValue = accumulationValue.multiply(sysEnergyInfo.getPrice());
+ break;
+ }
+ costValue = costValue.setScale(CommonConst.DIGIT_2, RoundingMode.HALF_UP);
+ totalCost = totalCost.add(costValue);
+ item.setCost(costValue);
+ item.setAccumulation(accumulationValue.setScale(CommonConst.DIGIT_2, RoundingMode.HALF_UP));
+ return totalCost;
+ }
+
+ /**
+ * 鎴愭湰瓒嬪娍鍒嗘瀽锛堣兘婧愭秷鑰楁垚鏈級
+ *
+ * @param timeCode 鏃堕棿鍊� 涓庢椂闂寸被鍨嬪搴旓細2022-03-21/2022-03/2022
+ * @param timeType 鏃堕棿绫诲瀷 DAY/MONTH/YEAR
+ * @param modelCode 妯″瀷Code
+ * @param energyType 鑳芥簮绫诲瀷
+ * @return
+ */
+ @Override
+ public List<EnergyConsumeTrendDetailItem> listEnergyCostTrendDetail(String timeCode, String timeType, String modelCode, String energyType) {
+ //鑳芥簮绫诲瀷淇℃伅
+ SysEnergy sysEnergy = new SysEnergy();
+ if (StringUtils.isNotEmpty(energyType)) {
+ sysEnergy.setEnersno(energyType);
+ }
+ List<SysEnergy> sysEnergies = sysEnergyMapper.selectSysEnergyList(sysEnergy);
+ if (sysEnergies.isEmpty()) {
+ throw new RuntimeException("鏈煡璇㈠埌鑳芥簮淇℃伅");
+ }
+
+ //鑺傜偣淇℃伅
+ List<ModelNode> modelNodes = modelNodeMapper.selectList(Wrappers.<ModelNode>lambdaQuery().eq(ModelNode::getModelCode, modelCode)
+ .isNull(ModelNode::getParentId));
+ if (modelNodes.isEmpty()) {
+ throw new RuntimeException("鏈煡璇㈠埌鑺傜偣淇℃伅");
+ }
+ String nodeId = modelNodes.stream().findFirst().get().getNodeId();
+
+ // 鑳借�椾俊鎭�
+ List<EnergyConsumeTrendDetailItem> itemList = new ArrayList<>();
+ List<EnergyConsumeVO> energyConsumeVOList = new ArrayList<>();
+ Date startTime = DateTimeUtil.getTime(timeType, timeCode);
+ Date endTime = DateTimeUtil.getEndTimeByType(timeType, startTime);
+ for (SysEnergy sysEnergyInfo : sysEnergies) {
+ switch (sysEnergyInfo.getEnersno()) {
+ case "electric":
+ List<ElectricityDataItem> electricityDataItems = peakValleyMapper.getCostTrends(startTime, endTime, timeType, nodeId, sysEnergyInfo.getEnersno());
+ if (!electricityDataItems.isEmpty()) {
+ electricityDataItems.forEach(electricityDataItem -> {
+ EnergyConsumeVO temp = new EnergyConsumeVO();
+ temp.setDataTime(electricityDataItem.getDataTime());
+ temp.setCostValue(electricityDataItem.getCost());
+ temp.setAccumulationValue(electricityDataItem.getElectricity());
+ energyConsumeVOList.add(temp);
+ });
+ }
+ break;
+ default:
+ List<CarbonEmission> dataItems = dataItemMapper.getMiddleCarbonEmission(startTime, endTime, timeType, nodeId, sysEnergyInfo.getEnersno());
+ if (!dataItems.isEmpty()) {
+ dataItems.forEach(electricityDataItem -> {
+ EnergyConsumeVO temp = new EnergyConsumeVO();
+ temp.setDataTime(electricityDataItem.getDataTime());
+ temp.setCostValue(new BigDecimal(electricityDataItem.getValue()));
+ temp.setAccumulationValue(new BigDecimal(electricityDataItem.getValue()).multiply(sysEnergyInfo.getPrice()));
+ energyConsumeVOList.add(temp);
+ });
+ }
+ break;
+ }
+ BigDecimal cost = energyConsumeVOList.stream().map(EnergyConsumeVO::getCostValue)
+ .reduce(BigDecimal.ZERO, BigDecimal::add).setScale(CommonConst.DIGIT_2, RoundingMode.HALF_UP);
+ BigDecimal accumulation = energyConsumeVOList.stream().map(EnergyConsumeVO::getAccumulationValue)
+ .reduce(BigDecimal.ZERO, BigDecimal::add).setScale(CommonConst.DIGIT_2, RoundingMode.HALF_UP);
+ // 缁勮缁熻鍥句俊鎭�
+ EnergyConsumeTrendDetailItem item = new EnergyConsumeTrendDetailItem();
+ item.setEnergyType(sysEnergyInfo.getEnersno());
+ item.setEnergyUnit(sysEnergyInfo.getMuid());
+ item.setCostLabel(sysEnergyInfo.getEnername() + "璐�");
+ item.setAccumulationLabel(sysEnergyInfo.getEnername() + "鐢ㄩ噺");
+ item.setCost(cost);
+ item.setAccumulation(accumulation);
+ // 缁勮鍥捐〃淇℃伅
+ getTrendAnalysisCharInfoByEnergyType(startTime, timeType, energyConsumeVOList, item);
+ itemList.add(item);
+ }
+ return itemList;
+ }
+
+ /**
+ * 缁勮鎴愭湰瓒嬪娍鍒嗘瀽-缁熻鍥句俊鎭�
+ *
+ * @param bsTime 鏃堕棿
+ * @param timeType 鏃堕棿绫诲瀷
+ * @param dataItems 鑳借��
+ * @param item 杩斿洖瀵硅薄
+ */
+ private void getTrendAnalysisCharInfoByEnergyType(Date bsTime, String timeType,
+ List<EnergyConsumeVO> dataItems, EnergyConsumeTrendDetailItem item) {
+ List<String> costKeyList = new ArrayList<>();
+ List<String> accumulationKeyList = new ArrayList<>();
+ List<BigDecimal> costValueList = new ArrayList<>();
+ List<BigDecimal> accumulationValueList = new ArrayList<>();
+ Map<String, List<EnergyConsumeVO>> energyConsumeVOMap;
+ //鎸夋椂闂寸被鍨嬬粍缁囪繑鍥炴暟鎹�
+ switch (timeType) {
+ case TimeTypeConst.TIME_TYPE_DAY:
+ energyConsumeVOMap = dataItems.stream().collect(Collectors.groupingBy(li -> DateUtil.formatDateTime(li.getDataTime())));
+ for (int i = 0; i < CommonConst.DIGIT_24; i++) {
+ String formatDate = i + CommonConst.TIME_UNIT_SHOW_HOUR;
+ costKeyList.add(formatDate);
+ accumulationKeyList.add(formatDate);
+ String key = DateUtil.formatDateTime(DateUtil.offsetHour(bsTime, i));
+ calculateCostAndAccumulation(energyConsumeVOMap, key, costValueList, accumulationValueList);
+ }
+ break;
+ case TimeTypeConst.TIME_TYPE_MONTH:
+ energyConsumeVOMap = dataItems.stream().collect(Collectors.groupingBy(li -> DateUtil.formatDate(li.getDataTime())));
+ Date endTime = DateTimeUtil.getEndTimeByType(timeType, bsTime);
+ while (bsTime.before(endTime)) {
+ String formatDate = DateUtil.formatDate(bsTime);
+ costKeyList.add(formatDate);
+ accumulationKeyList.add(formatDate);
+ calculateCostAndAccumulation(energyConsumeVOMap, formatDate, costValueList, accumulationValueList);
+ bsTime = DateUtil.offsetDay(bsTime, CommonConst.DIGIT_1);
+ }
+ break;
+ case TimeTypeConst.TIME_TYPE_YEAR:
+ SimpleDateFormat formatter = new SimpleDateFormat("yyyy-MM");
+ energyConsumeVOMap = dataItems.stream().collect(Collectors.groupingBy(li -> formatter.format(li.getDataTime())));
+ for (int i = 0; i < CommonConst.DIGIT_12; i++) {
+ Date newDate = DateUtil.offsetMonth(bsTime, i);
+ String formatDate = DateUtil.format(newDate, DateTimeUtil.COMMON_PATTERN_TO_MONTH_ZH);
+ costKeyList.add(formatDate);
+ accumulationKeyList.add(formatDate);
+ calculateCostAndAccumulation(energyConsumeVOMap, formatDate, costValueList, accumulationValueList);
+ }
+ break;
+ default:
+ break;
+ }
+
+ item.setCostKeyList(costKeyList);
+ item.setCostValueList(costValueList);
+ item.setAccumulationKeyList(accumulationKeyList);
+ item.setAccumulationValueList(accumulationValueList);
+ }
+
+ /**
+ * 璁＄畻璐圭敤鍜岀敤閲�
+ * @param energyConsumeVOMap
+ * @param formatDate
+ * @param costValueList
+ * @param accumulationValueList
+ */
+ private static void calculateCostAndAccumulation(Map<String, List<EnergyConsumeVO>> energyConsumeVOMap, String formatDate, List<BigDecimal> costValueList, List<BigDecimal> accumulationValueList) {
+ List<EnergyConsumeVO> energyConsumeList = Optional.ofNullable(energyConsumeVOMap.get(formatDate))
+ .orElse(Collections.emptyList());
+ BigDecimal totalCost = energyConsumeList.stream()
+ .map(EnergyConsumeVO::getCostValue)
+ .reduce(BigDecimal.ZERO, BigDecimal::add)
+ .setScale(CommonConst.DIGIT_2, RoundingMode.HALF_UP);
+
+ BigDecimal totalAccumulation = energyConsumeList.stream()
+ .map(EnergyConsumeVO::getAccumulationValue)
+ .reduce(BigDecimal.ZERO, BigDecimal::add)
+ .setScale(CommonConst.DIGIT_2, RoundingMode.HALF_UP);
+ costValueList.add(totalCost);
+ accumulationValueList.add(totalAccumulation);
+ }
+}
diff --git a/zhitan-system/src/main/resources/mapper/dataitem/DataItemMapper.xml b/zhitan-system/src/main/resources/mapper/dataitem/DataItemMapper.xml
index 37b928f..e06ddbe 100644
--- a/zhitan-system/src/main/resources/mapper/dataitem/DataItemMapper.xml
+++ b/zhitan-system/src/main/resources/mapper/dataitem/DataItemMapper.xml
@@ -215,4 +215,22 @@
AND ( begin_time BETWEEN #{beginTime} AND #{endTime} )
AND time_type = #{timeType}
</select>
+
+ <select id="getDataItemTimeRangeValueByNodeId" resultType="java.math.BigDecimal">
+ SELECT
+ COALESCE (SUM ( "value" ), 0)
+ FROM
+ "data_item" di
+ JOIN energy_index ei ON di.index_id = ei.index_id
+ WHERE
+ di.index_id IN ( SELECT index_id FROM node_index WHERE node_id = #{nodeId})
+ <if test="energyType !='' and energyType !=null and energyType =='allType'">
+ AND ei.energy_id != ''
+ </if>
+ <if test="energyType !='' and energyType !=null and energyType !='allType'">
+ AND ei.energy_id = #{energyType}
+ </if>
+ AND (di.data_time BETWEEN #{beginTime} AND #{endTime})
+ AND di.time_type = #{timeType}
+ </select>
</mapper>
\ No newline at end of file
diff --git a/zhitan-system/src/main/resources/mapper/peakvalley/ElectricityDataItemMapper.xml b/zhitan-system/src/main/resources/mapper/peakvalley/ElectricityDataItemMapper.xml
index 2676c7d..d478107 100644
--- a/zhitan-system/src/main/resources/mapper/peakvalley/ElectricityDataItemMapper.xml
+++ b/zhitan-system/src/main/resources/mapper/peakvalley/ElectricityDataItemMapper.xml
@@ -49,4 +49,30 @@
AND time_type = #{timeType}
</select>
+ <select id="getCostTrends"
+ resultType="com.zhitan.peakvalley.domain.ElectricityDataItem">
+ SELECT
+ di.index_code,
+ di.time_code,
+ di.electricity_type,
+ di.data_time,
+ di.electricity,
+ di.cost,
+ di.time_type,
+ di.price,
+ di.remark
+ FROM
+ "electricity_data_item" di
+ JOIN energy_index ei ON di.index_id = ei.index_id
+ WHERE
+ di.index_id IN ( SELECT index_id FROM node_index WHERE node_id = #{nodeId})
+ <if test="energyType !='' and energyType !=null and energyType =='allType'">
+ AND ei.energy_id != ''
+ </if>
+ <if test="energyType !='' and energyType !=null and energyType !='allType'">
+ AND ei.energy_id = #{energyType}
+ </if>
+ AND (di.data_time BETWEEN #{beginTime} AND #{endTime})
+ AND di.time_type = #{timeType}
+ </select>
</mapper>
\ No newline at end of file
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js
new file mode 100644
index 0000000..bd8dbb5
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/comprehensive.js
@@ -0,0 +1,70 @@
+import request from '@/utils/request'
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁�
+export function getDataList(query) {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/list',
+ method: 'get',
+ params: query
+ })
+}
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁″浘
+export function getlistChart(query) {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/listChart',
+ method: 'get',
+ params: query
+ })
+}
+export function exportList(query) {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/export',
+ method: 'get',
+ params: query
+ })
+}
+export function getEnergyList(query) {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/getList',
+ method: 'get',
+ params: query
+ })
+}
+//閲嶇偣璁惧鑳借�楁帓鍚�
+export function energyList(query) {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/energyList',
+ method: 'get',
+ params: query
+ })
+}
+//璁惧
+export function getFacilityArchives() {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/getFacilityArchives',
+ method: 'get'
+ })
+}
+//閲嶇偣璁惧
+export function getPointFacility() {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/getPointFacility',
+ method: 'get'
+ })
+}
+export function getDeviceList(query) {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/getDeviceList',
+ method: 'get',
+ params: query
+ })
+}
+//鑾峰彇妯″瀷涓嬬殑鑳芥簮鍝佺
+export function energyDevice(query) {
+ return request({
+ url: '/statisticalData/comprehensiveStatistics/energyDevice',
+ method: 'get',
+ params: query
+ })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js
new file mode 100644
index 0000000..701aa46
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive.js
@@ -0,0 +1,26 @@
+import request from "@/utils/request"
+
+//鏌ヨ鏃ユ姤琛�
+export function getDataList(query) {
+ return request({
+ url: "/comprehensive/dailyComprehensive/list",
+ method: "get",
+ params: query,
+ })
+}
+export function getlistChart(query) {
+ return request({
+ url: "/comprehensive/dailyComprehensive/listChart",
+ method: "get",
+ params: query,
+ })
+}
+
+// 瀵煎嚭缁煎悎鎶ヨ〃
+export function exportList(query) {
+ return request({
+ url: "/report/dailyReport/export",
+ method: "get",
+ params: query,
+ })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js
new file mode 100644
index 0000000..b3a5668
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive.js
@@ -0,0 +1,17 @@
+import request from '@/utils/request'
+
+//鏌ヨ鏃ユ姤琛�
+export function getDataList(query) {
+ return request({
+ url: '/comprehensive/monthlyComprehensive/list',
+ method: 'get',
+ params: query
+ })
+}
+export function getlistChart(query) {
+ return request({
+ url: '/comprehensive/monthlyComprehensive/listChart',
+ method: 'get',
+ params: query
+ })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js b/zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js
new file mode 100644
index 0000000..38858e5
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/processEnergyConsumption.js
@@ -0,0 +1,19 @@
+import request from '@/utils/request'
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁�
+export function getDataList(query) {
+ return request({
+ url: '/statisticalData/processEnergyConsumption/list',
+ method: 'get',
+ params: query
+ })
+}
+
+//鍏ㄥ巶缁煎悎鑳借�楃粺璁″浘
+export function getlistChart(query) {
+ return request({
+ url: '/statisticalData/processEnergyConsumption/listChart',
+ method: 'get',
+ params: query
+ })
+}
diff --git a/zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js b/zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js
new file mode 100644
index 0000000..03cb827
--- /dev/null
+++ b/zhitan-vue/src/api/comprehensiveStatistics/yearComprehensive/yearComprehensive.js
@@ -0,0 +1,17 @@
+import request from '@/utils/request'
+
+//鏌ヨ鏃ユ姤琛�
+export function getDataList(query) {
+ return request({
+ url: '/comprehensive/yearComprehensive/list',
+ method: 'get',
+ params: query
+ })
+}
+export function getlistChart(query) {
+ return request({
+ url: '/comprehensive/yearComprehensive/listChart',
+ method: 'get',
+ params: query
+ })
+}
diff --git a/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js b/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js
index 510703c..cbb5712 100644
--- a/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js
+++ b/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js
@@ -1,54 +1,62 @@
-import request from '@/utils/request'
+import request from "@/utils/request"
// 鑳借�楀姣斿垎鏋�-鍖哄煙鑳借�楀垎鏋�-鑳借�楄秼鍔�/鍖哄煙鑳借�楃粺璁″垎鏋愯〃-鍒楄〃
// 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-鑳借�楄秼鍔�/鑳借�楃粺璁″垎鏋愯〃-鍒楄〃
// 鑳借�楀姣斿垎鏋�-璁惧鑳借�楀垎鏋�-鑳借�楄秼鍔�/鑳借�楃粺璁″垎鏋愯〃-鍒楄〃
export function listRegion(query) {
return request({
- url: '/consumptionanalysis/getByArea',
- method: 'get',
- params: query
+ url: "/consumptionanalysis/getByArea",
+ method: "get",
+ params: query,
})
}
// 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-鑳借�楁帓鍚�-鍒楄〃
// 鑳借�楀姣斿垎鏋�-璁惧鑳借�楀垎鏋�-鑳借�楁帓鍚�-鍒楄〃
export function listDepartment(query) {
return request({
- url: '/consumptionanalysis/getByDepartment',
- method: 'get',
- params: query
+ url: "/consumptionanalysis/getByDepartment",
+ method: "get",
+ params: query,
})
}
// 鑳借�楀姣斿垎鏋�-鑳借�楁寚鏍囪�冩牳-鑳借�楄秼鍔�/鍖哄煙鑳借�楃粺璁″垎鏋愯〃
export function listIndicatorassessment(query) {
return request({
- url: '/consumptionanalysis/getPlanAndProdCount',
- method: 'get',
- params: query
+ url: "/consumptionanalysis/getPlanAndProdCount",
+ method: "get",
+ params: query,
})
}
// 鑳借�楀姣斿垎鏋�-缁煎悎鑳借�楀垎鏋�-缁煎悎鑳借�楄秼鍔�/鍚勪粙璐ㄨ兘鑰楀崰姣�/鍖哄煙鑳借�楃粺璁″垎鏋愯〃-鍒楄〃
export function listComprehensive(query) {
return request({
- url: '/consumptionanalysis/getComprehensiveEnergy',
- method: 'get',
- params: query
+ url: "/consumptionanalysis/getComprehensiveEnergy",
+ method: "get",
+ params: query,
})
}
// 鑳借�楀姣斿垎鏋�-缁煎悎鑳借�楀垎鏋�-鑳借�楀悓姣旂幆姣�-鍒楄〃
export function listYoY(query) {
return request({
- url: '/consumptionanalysis/getYOY',
- method: 'get',
- params: query
+ url: "/consumptionanalysis/getYOY",
+ method: "get",
+ params: query,
})
}
// 鑳借�楀姣斿垎鏋�-缁煎悎鑳借�楀垎鏋�-鐢ㄨ兘鍗曞厓鑳借�楁帓鍚�-鍒楄〃
export function listEnergyRanking(query) {
return request({
- url: '/consumptionanalysis/getEnergyRanking',
- method: 'get',
- params: query
+ url: "/consumptionanalysis/getEnergyRanking",
+ method: "get",
+ params: query,
})
}
+// statisticsAnalysis/getFlowCharts
+export function getFlowCharts(query) {
+ return request({
+ url: "/statisticsAnalysis/getFlowCharts",
+ method: "get",
+ params: query,
+ })
+}
diff --git a/zhitan-vue/src/api/powerquality/electric-power-factor/api.js b/zhitan-vue/src/api/powerquality/electric-power-factor/api.js
new file mode 100644
index 0000000..1b9a7c3
--- /dev/null
+++ b/zhitan-vue/src/api/powerquality/electric-power-factor/api.js
@@ -0,0 +1,9 @@
+import request from "@/utils/request"
+// 鑾峰彇鐢ㄨ兘鍗曞厓涓嬬殑鏌愪釜鐢佃〃鐨勫姛鐜囧洜鏁版暟鎹�
+export function powerFactorAnalysisDetail(params) {
+ return request({
+ url: "/powerFactorAnalysis/detail",
+ method: "get",
+ params,
+ })
+}
diff --git a/zhitan-vue/src/api/powerquality/electricThreePhase/api.js b/zhitan-vue/src/api/powerquality/electricThreePhase/api.js
new file mode 100644
index 0000000..cf8072c
--- /dev/null
+++ b/zhitan-vue/src/api/powerquality/electricThreePhase/api.js
@@ -0,0 +1,10 @@
+import request from "@/utils/request"
+
+// 鑾峰彇涓夌浉涓嶅钩琛″垎鏋愭暟鎹�
+export function threePhaseUnbalanceAnalysisDetail(params) {
+ return request({
+ url: "/threePhaseUnbalanceAnalysis/detail",
+ method: "get",
+ params,
+ })
+}
diff --git a/zhitan-vue/src/api/powerquality/load-analysis/api.js b/zhitan-vue/src/api/powerquality/load-analysis/api.js
new file mode 100644
index 0000000..b6859f4
--- /dev/null
+++ b/zhitan-vue/src/api/powerquality/load-analysis/api.js
@@ -0,0 +1,28 @@
+import request from "@/utils/request"
+
+// 鑾峰彇鐢ㄨ兘鍗曞厓涓嬬殑鐢佃〃鍒楄〃
+export function listElectricityMeter(params) {
+ return request({
+ url: "/meter/listElectricityMeter",
+ method: "get",
+ params,
+ })
+}
+
+// 鑾峰彇鐢ㄨ兘鍗曞厓涓嬬殑鏌愪釜鐢佃〃鐨勮礋鑽峰垎鏋愭暟鎹�
+export function loadAnalysisDetail(params) {
+ return request({
+ url: "/loadAnalysis/detail",
+ method: "get",
+ params,
+ })
+}
+
+// 鑾峰彇鐢ㄨ兘鍗曞厓涓嬬殑鐢佃〃鍒楄〃-瀹炰綋琛�
+export function listElectricityDeviceMeter(params) {
+ return request({
+ url: "/loadAnalysis/listElectricMeter",
+ method: "get",
+ params,
+ })
+}
diff --git a/zhitan-vue/src/assets/images/login-background.png b/zhitan-vue/src/assets/images/login-background.png
deleted file mode 100644
index b27391b..0000000
--- a/zhitan-vue/src/assets/images/login-background.png
+++ /dev/null
Binary files differ
diff --git a/zhitan-vue/src/assets/images/login-bg.jpg b/zhitan-vue/src/assets/images/login-bg.jpg
deleted file mode 100644
index d3ab6e6..0000000
--- a/zhitan-vue/src/assets/images/login-bg.jpg
+++ /dev/null
Binary files differ
diff --git a/zhitan-vue/src/assets/styles/ruoyi.scss b/zhitan-vue/src/assets/styles/ruoyi.scss
index d83440a..cd8f03c 100644
--- a/zhitan-vue/src/assets/styles/ruoyi.scss
+++ b/zhitan-vue/src/assets/styles/ruoyi.scss
@@ -312,6 +312,10 @@
// tr:hover > td {
// background-color: #141E4A;
// }
+
+ .el-table-fixed-column--left {
+ background-color: #110f2e !important;
+ }
}
}
@@ -564,6 +568,19 @@
}
.el-tabs__item.is-active {
color: #409EFF;
+ }
+
+ .el-descriptions__cell {
+ background: transparent;
+ color: #fff !important;
+ }
+ .el-descriptions__body {
+ background-color: transparent;
+ color: #fff;
+ }
+ .el-descriptions__label {
+ color: #fff !important;
+ background-color: #1a235d !important;
}
}
@@ -858,6 +875,9 @@
// tr:hover > td {
// background-color: #141E4A;
// }
+ .el-table-fixed-column--left {
+ background-color: #fff;
+ }
}
}
diff --git a/zhitan-vue/src/components/Echarts/LineChart.vue b/zhitan-vue/src/components/Echarts/LineChart.vue
new file mode 100644
index 0000000..3294c0c
--- /dev/null
+++ b/zhitan-vue/src/components/Echarts/LineChart.vue
@@ -0,0 +1,176 @@
+<template>
+ <div class="chart-item">
+ <div id="ChartDom" style="width: 100%; height: 100%"></div>
+ </div>
+</template>
+
+<script setup>
+import * as echarts from "echarts"
+const { proxy } = getCurrentInstance()
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
+const emit = defineEmits()
+const props = defineProps({
+ chartData: {
+ type: Object,
+ default: () => {},
+ },
+ chartType: {
+ type: String,
+ default: "line", // bar
+ },
+})
+
+watch(
+ () => props.chartData,
+ (val) => {
+ console.log("watch", val)
+ initChart()
+ }
+)
+watch(
+ () => settingsStore.sideTheme,
+ (val) => {
+ initChart()
+ }
+)
+
+onMounted(() => {
+ initChart()
+})
+
+function initChart(value) {
+ console.log("initChart", props.chartData)
+ if (!props.chartData.xAxis) {
+ return
+ }
+ const chartDom = document.getElementById("ChartDom")
+ if (echarts.getInstanceByDom(chartDom)) {
+ echarts.dispose(chartDom)
+ }
+ const myChart = echarts.init(chartDom)
+ // 澶勭悊澶氱郴鍒楁暟鎹�
+ const series = props.chartData.series.map((item) => ({
+ name: item.name,
+ type: props.chartType, // 鏍规嵁浼犲叆绫诲瀷娓叉煋
+ data: item.data,
+ barWidth: "16",
+ itemStyle: {
+ borderRadius: [15, 15, 0, 0],
+ },
+ smooth: true, // 鍚敤骞虫粦鏇茬嚎
+ }))
+ let option = {
+ title: {
+ // text: props.chartData.title,
+ left: "40",
+ textStyle: {
+ color: "#2979ff",
+ },
+ },
+ color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"],
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ type: "shadow",
+ },
+ },
+ legend: {
+ data: props.chartData.series.map((item) => item.name), // 鍥句緥鏁版嵁
+ icon: "rect",
+ right: 40,
+ itemWidth: 14,
+ itemHeight: 10,
+ textStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ grid: {
+ top: "40",
+ left: "40",
+ right: "40",
+ bottom: "20",
+ containLabel: true,
+ },
+ xAxis: {
+ type: "category",
+ axisPointer: {
+ type: "shadow",
+ },
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ splitArea: {
+ show: false,
+ },
+ splitLine: {
+ show: false,
+ },
+ axisLabel: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ padding: [5, 0, 0, 0],
+ // formatter: '{value} ml'
+ },
+ data: props.chartData.xAxis,
+ },
+ yAxis: [
+ {
+ type: "value",
+ nameTextStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ padding: [0, 0, 5, 0],
+ },
+ axisLine: {
+ show: false,
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: "dashed",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ splitArea: {
+ show: false,
+ },
+ axisLabel: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ },
+ },
+ ],
+ series: series,
+ }
+ setTimeout(() => {
+ myChart.setOption(option)
+ }, 200)
+
+ window.addEventListener(
+ "resize",
+ () => {
+ myChart.resize()
+ },
+ { passive: true }
+ )
+}
+</script>
+
+<style lang="scss" scoped>
+.chart-item {
+ width: 100%;
+ height: 360px !important;
+ margin-top: 0px;
+ padding-top: 20px;
+}
+</style>
diff --git a/zhitan-vue/src/utils/ruoyi.js b/zhitan-vue/src/utils/ruoyi.js
index 4efca08..74f7c30 100644
--- a/zhitan-vue/src/utils/ruoyi.js
+++ b/zhitan-vue/src/utils/ruoyi.js
@@ -1,5 +1,3 @@
-
-
/**
* 閫氱敤js鏂规硶灏佽澶勭悊
* Copyright (c) 2019 ruoyi
@@ -10,17 +8,20 @@
if (arguments.length === 0 || !time) {
return null
}
- const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+ const format = pattern || "{y}-{m}-{d} {h}:{i}:{s}"
let date
- if (typeof time === 'object') {
+ if (typeof time === "object") {
date = time
} else {
- if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+ if (typeof time === "string" && /^[0-9]+$/.test(time)) {
time = parseInt(time)
- } else if (typeof time === 'string') {
- time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
+ } else if (typeof time === "string") {
+ time = time
+ .replace(new RegExp(/-/gm), "/")
+ .replace("T", " ")
+ .replace(new RegExp(/\.[\d]{3}/gm), "")
}
- if ((typeof time === 'number') && (time.toString().length === 10)) {
+ if (typeof time === "number" && time.toString().length === 10) {
time = time * 1000
}
date = new Date(time)
@@ -32,14 +33,16 @@
h: date.getHours(),
i: date.getMinutes(),
s: date.getSeconds(),
- a: date.getDay()
+ a: date.getDay(),
}
const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
let value = formatObj[key]
// Note: getDay() returns 0 on Sunday
- if (key === 'a') { return ['鏃�', '涓�', '浜�', '涓�', '鍥�', '浜�', '鍏�'][value] }
+ if (key === "a") {
+ return ["鏃�", "涓�", "浜�", "涓�", "鍥�", "浜�", "鍏�"][value]
+ }
if (result.length > 0 && value < 10) {
- value = '0' + value
+ value = "0" + value
}
return value || 0
})
@@ -49,89 +52,92 @@
// 琛ㄥ崟閲嶇疆
export function resetForm(refName) {
if (this.$refs[refName]) {
- this.$refs[refName].resetFields();
+ this.$refs[refName].resetFields()
}
}
// 娣诲姞鏃ユ湡鑼冨洿
export function addDateRange(params, dateRange, propName) {
- let search = params;
- search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
- dateRange = Array.isArray(dateRange) ? dateRange : [];
- if (typeof (propName) === 'undefined') {
- search.params['beginTime'] = dateRange[0];
- search.params['endTime'] = dateRange[1];
+ let search = params
+ search.params =
+ typeof search.params === "object" && search.params !== null && !Array.isArray(search.params) ? search.params : {}
+ dateRange = Array.isArray(dateRange) ? dateRange : []
+ if (typeof propName === "undefined") {
+ search.params["beginTime"] = dateRange[0]
+ search.params["endTime"] = dateRange[1]
} else {
- search.params['begin' + propName] = dateRange[0];
- search.params['end' + propName] = dateRange[1];
+ search.params["begin" + propName] = dateRange[0]
+ search.params["end" + propName] = dateRange[1]
}
- return search;
+ return search
}
// 鍥炴樉鏁版嵁瀛楀吀
export function selectDictLabel(datas, value) {
if (value === undefined) {
- return "";
+ return ""
}
- var actions = [];
+ var actions = []
Object.keys(datas).some((key) => {
- if (datas[key].value == ('' + value)) {
- actions.push(datas[key].label);
- return true;
+ if (datas[key].value == "" + value) {
+ actions.push(datas[key].label)
+ return true
}
})
if (actions.length === 0) {
- actions.push(value);
+ actions.push(value)
}
- return actions.join('');
+ return actions.join("")
}
// 鍥炴樉鏁版嵁瀛楀吀锛堝瓧绗︿覆鏁扮粍锛�
export function selectDictLabels(datas, value, separator) {
- if (value === undefined || value.length ===0) {
- return "";
+ if (value === undefined || value.length === 0) {
+ return ""
}
if (Array.isArray(value)) {
- value = value.join(",");
+ value = value.join(",")
}
- var actions = [];
- var currentSeparator = undefined === separator ? "," : separator;
- var temp = value.split(currentSeparator);
+ var actions = []
+ var currentSeparator = undefined === separator ? "," : separator
+ var temp = value.split(currentSeparator)
Object.keys(value.split(currentSeparator)).some((val) => {
- var match = false;
+ var match = false
Object.keys(datas).some((key) => {
- if (datas[key].value == ('' + temp[val])) {
- actions.push(datas[key].label + currentSeparator);
- match = true;
+ if (datas[key].value == "" + temp[val]) {
+ actions.push(datas[key].label + currentSeparator)
+ match = true
}
})
if (!match) {
- actions.push(temp[val] + currentSeparator);
+ actions.push(temp[val] + currentSeparator)
}
})
- return actions.join('').substring(0, actions.join('').length - 1);
+ return actions.join("").substring(0, actions.join("").length - 1)
}
// 瀛楃涓叉牸寮忓寲(%s )
export function sprintf(str) {
- var args = arguments, flag = true, i = 1;
+ var args = arguments,
+ flag = true,
+ i = 1
str = str.replace(/%s/g, function () {
- var arg = args[i++];
- if (typeof arg === 'undefined') {
- flag = false;
- return '';
+ var arg = args[i++]
+ if (typeof arg === "undefined") {
+ flag = false
+ return ""
}
- return arg;
- });
- return flag ? str : '';
+ return arg
+ })
+ return flag ? str : ""
}
// 杞崲瀛楃涓诧紝undefined,null绛夎浆鍖栦负""
export function parseStrEmpty(str) {
if (!str || str == "undefined" || str == "null") {
- return "";
+ return ""
}
- return str;
+ return str
}
// 鏁版嵁鍚堝苟
@@ -139,16 +145,16 @@
for (var p in target) {
try {
if (target[p].constructor == Object) {
- source[p] = mergeRecursive(source[p], target[p]);
+ source[p] = mergeRecursive(source[p], target[p])
} else {
- source[p] = target[p];
+ source[p] = target[p]
}
} catch (e) {
- source[p] = target[p];
+ source[p] = target[p]
}
}
- return source;
-};
+ return source
+}
/**
* 鏋勯�犳爲鍨嬬粨鏋勬暟鎹�
@@ -159,88 +165,105 @@
*/
export function handleTree(data, id, parentId, children) {
let config = {
- id: id || 'id',
- parentId: parentId || 'parentId',
- childrenList: children || 'children'
- };
+ id: id || "id",
+ parentId: parentId || "parentId",
+ childrenList: children || "children",
+ }
- var childrenListMap = {};
- var nodeIds = {};
- var tree = [];
+ var childrenListMap = {}
+ var nodeIds = {}
+ var tree = []
for (let d of data) {
- let parentId = d[config.parentId];
+ let parentId = d[config.parentId]
if (childrenListMap[parentId] == null) {
- childrenListMap[parentId] = [];
+ childrenListMap[parentId] = []
}
- nodeIds[d[config.id]] = d;
- childrenListMap[parentId].push(d);
+ nodeIds[d[config.id]] = d
+ childrenListMap[parentId].push(d)
}
for (let d of data) {
- let parentId = d[config.parentId];
+ let parentId = d[config.parentId]
if (nodeIds[parentId] == null) {
- tree.push(d);
+ tree.push(d)
}
}
for (let t of tree) {
- adaptToChildrenList(t);
+ adaptToChildrenList(t)
}
function adaptToChildrenList(o) {
if (childrenListMap[o[config.id]] !== null) {
- o[config.childrenList] = childrenListMap[o[config.id]];
+ o[config.childrenList] = childrenListMap[o[config.id]]
}
if (o[config.childrenList]) {
for (let c of o[config.childrenList]) {
- adaptToChildrenList(c);
+ adaptToChildrenList(c)
}
}
}
- return tree;
+ return tree
}
/**
-* 鍙傛暟澶勭悊
-* @param {*} params 鍙傛暟
-*/
+ * 鍙傛暟澶勭悊
+ * @param {*} params 鍙傛暟
+ */
export function tansParams(params) {
- let result = ''
+ let result = ""
for (const propName of Object.keys(params)) {
- const value = params[propName];
- var part = encodeURIComponent(propName) + "=";
- if (value !== null && value !== "" && typeof (value) !== "undefined") {
- if (typeof value === 'object') {
+ const value = params[propName]
+ var part = encodeURIComponent(propName) + "="
+ if (value !== null && value !== "" && typeof value !== "undefined") {
+ if (typeof value === "object") {
for (const key of Object.keys(value)) {
- if (value[key] !== null && value[key] !== "" && typeof (value[key]) !== 'undefined') {
- let params = propName + '[' + key + ']';
- var subPart = encodeURIComponent(params) + "=";
- result += subPart + encodeURIComponent(value[key]) + "&";
+ if (value[key] !== null && value[key] !== "" && typeof value[key] !== "undefined") {
+ let params = propName + "[" + key + "]"
+ var subPart = encodeURIComponent(params) + "="
+ result += subPart + encodeURIComponent(value[key]) + "&"
}
}
} else {
- result += part + encodeURIComponent(value) + "&";
+ result += part + encodeURIComponent(value) + "&"
}
}
}
return result
}
-
// 杩斿洖椤圭洰璺緞
export function getNormalPath(p) {
- if (p.length === 0 || !p || p == 'undefined') {
+ if (p.length === 0 || !p || p == "undefined") {
return p
- };
- let res = p.replace('//', '/')
- if (res[res.length - 1] === '/') {
+ }
+ let res = p.replace("//", "/")
+ if (res[res.length - 1] === "/") {
return res.slice(0, res.length - 1)
}
- return res;
+ return res
}
// 楠岃瘉鏄惁涓篵lob鏍煎紡
export function blobValidate(data) {
- return data.type !== 'application/json'
+ return data.type !== "application/json"
+}
+
+// 閫氱敤涓嬭浇鏂规硶
+const baseURL = import.meta.env.VITE_APP_BASE_API
+export function download(fileName) {
+ window.location.href = baseURL + "/common/download?fileName=" + encodeURI(fileName) + "&delete=" + true
+}
+
+// 閫氱敤涓嬭浇鏂规硶 showfileName锛氫笅杞藉悗鐨勬枃浠跺悕绉板甫鎵╁睍鍚�;filePath:瑕佷笅杞芥枃浠剁殑缁濆璺緞,甯︾潃鏂囦欢鍚嶅拰鎵╁睍鍚嶏紱deleteflage涓嬭浇瀹屾垚鍚庢槸鍚﹀垹闄ゆ枃浠�
+export function fileDownload(showfileName, filePath, deleteflage) {
+ window.location.href =
+ baseURL +
+ "/common/downloadAssign?showFileName=" +
+ encodeURI(showfileName) +
+ "&filePath=" +
+ encodeURI(filePath) +
+ "&delete=" +
+ deleteflage
}
diff --git a/zhitan-vue/src/views/alarmmanage/energyconsumption/energyConsumption.vue b/zhitan-vue/src/views/alarmmanage/energyconsumption/energyConsumption.vue
index 38a308a..4a3a835 100644
--- a/zhitan-vue/src/views/alarmmanage/energyconsumption/energyConsumption.vue
+++ b/zhitan-vue/src/views/alarmmanage/energyconsumption/energyConsumption.vue
@@ -8,16 +8,28 @@
<div class="form-card">
<el-form :model="form" ref="queryRef" :inline="true" label-width="85px">
<el-form-item label="鏈熼棿" prop="timeType">
- <el-select v-model="queryParams.timeType" placeholder="鏈熼棿" clearable style="width: 100%"
- @change="handleTimeType">
+ <el-select
+ v-model="queryParams.timeType"
+ placeholder="鏈熼棿"
+ clearable
+ style="width: 100%"
+ @change="handleTimeType"
+ >
<el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="鏃堕棿">
- <el-date-picker v-model="queryParams.dataTime" :clearable="false"
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ :clearable="false"
:type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'"
- :format="queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD'"
- value-format="YYYY-MM-DD" placeholder="鏃堕棿" style="width: 100%" />
+ :format="
+ queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD'
+ "
+ value-format="YYYY-MM-DD"
+ placeholder="鏃堕棿"
+ style="width: 100%"
+ />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
@@ -55,70 +67,69 @@
</template>
<script setup>
-import * as echarts from 'echarts';
-import { onMounted, reactive, ref } from 'vue';
-import { listEnergyTypeList } from "@/api/modelConfiguration/energyType";
-const { proxy } = getCurrentInstance();
-const { period } = proxy.useDict("period");
-let { alarm_record_category } = proxy.useDict("alarm_record_category");
+import * as echarts from "echarts"
+import { onMounted, reactive, ref } from "vue"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+const { proxy } = getCurrentInstance()
+const { period } = proxy.useDict("period")
+let { alarm_record_category } = proxy.useDict("alarm_record_category")
let energyTypeList = ref([])
function getEnergyTypeList() {
listEnergyTypeList().then((res) => {
- energyTypeList.value = res.data;
- });
+ energyTypeList.value = res.data
+ })
}
getEnergyTypeList()
function formatterLabel(list, value) {
- console.log(list, value);
+ console.log(list, value)
- let dict = list.find(item => item.enersno == value)
- return dict ? dict.enername : ''
+ let dict = list.find((item) => item.enersno == value)
+ return dict ? dict.enername : ""
}
-
let queryParams = ref({
timeType: null,
dataTime: null,
- nodeId: null
+ nodeId: null,
})
-import { getByNodeId, getCountInfo } from "@/api/alarmManage/alarmManage";
-import { el } from 'element-plus/es/locales.mjs';
-let form = ref({});
+import { getByNodeId, getCountInfo } from "@/api/alarmManage/alarmManage"
+import { el } from "element-plus/es/locales.mjs"
+let form = ref({})
let currentNode = ref()
function handleTimeType(e) {
- queryParams.value.timeType = e;
- queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD");
+ queryParams.value.timeType = e
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")
}
function handleNodeClick(e) {
currentNode.value = e
queryParams.value.nodeId = e.id
- handleTimeType('YEAR')
+ handleTimeType("YEAR")
getByNodeIdFun()
}
function getByNodeIdFun() {
- getByNodeId(queryParams.value).then(res => {
+ getByNodeId(queryParams.value).then((res) => {
let alarmList = []
let energyList = []
let alarmNumberList = {
data: [],
- xAxisData: []
+ xAxisData: [],
}
- console.log(111, res);
+ console.log(111, res)
if (res.code == 200) {
let { data } = res
- alarmList = data.alarmProportion.map(item => {
+ alarmList = data.alarmProportion.map((item) => {
return {
name: proxy.selectDictLabel(alarm_record_category.value, item.energyName),
- value: item.percentage
+ value: item.percentage,
}
})
- energyList = data.energyProportion.map(item => {
+ energyList = data.energyProportion.map((item) => {
return {
name: formatterLabel(energyTypeList.value, item.energyName),
- value: item.percentage
+ value: item.percentage,
}
})
for (const item of data.chartDataList) {
@@ -126,9 +137,9 @@
alarmNumberList.data.push(item.yvalue)
}
- pieChart('Chart1', alarmList, '鎶ヨ绫诲瀷鍗犳瘮')
- pieChart('Chart2', energyList, '鑳芥簮绫诲瀷鍗犳瘮')
- getChart('Chart3', alarmNumberList)
+ pieChart("Chart1", alarmList, "鎶ヨ绫诲瀷鍗犳瘮")
+ pieChart("Chart2", energyList, "鑳芥簮绫诲瀷鍗犳瘮")
+ getChart("Chart3", alarmNumberList)
}
})
}
@@ -138,227 +149,233 @@
getByNodeIdFun()
}
function resetQuery() {
- handleTimeType('YEAR')
+ handleTimeType("YEAR")
getByNodeIdFun()
}
-
function pieChart(Id, data, name) {
- let total = 0;
+ let total = 0
data.forEach(function (val, idx, arr) {
- total += val.value;
+ total += val.value
})
- const myChart = echarts.init(document.getElementById(Id));
+ const myChart = echarts.init(document.getElementById(Id))
myChart.setOption({
- color: ['#4D94FF', '#00C27C', '#F0142F', '#F2D261', '#0E7CE2', '#FF8352', '#E271DE', '#F8456B', '#00FFFF', '#4AEAB0'],
+ color: [
+ "#4D94FF",
+ "#00C27C",
+ "#F0142F",
+ "#F2D261",
+ "#0E7CE2",
+ "#FF8352",
+ "#E271DE",
+ "#F8456B",
+ "#00FFFF",
+ "#4AEAB0",
+ ],
grid: {
- top: '20%',
- left: '1%',
- right: '1%',
- bottom: '0%',
- containLabel: true
+ top: "20%",
+ left: "1%",
+ right: "1%",
+ bottom: "0%",
+ containLabel: true,
},
tooltip: {
- trigger: 'item'
+ trigger: "item",
},
legend: {
- orient: 'vertical',
- top: 'center',
- icon: 'circle',
+ orient: "vertical",
+ top: "center",
+ icon: "circle",
itemWidth: 14,
itemHeight: 14,
- right: '2%',
+ right: "2%",
itemGap: 10,
textStyle: {
- align: 'left',
- verticalAlign: 'middle',
+ align: "left",
+ verticalAlign: "middle",
rich: {
name: {
- color: '#999',
+ color: "#999",
fontSize: 14,
},
value: {
- color: '#999',
+ color: "#999",
fontSize: 14,
},
rate: {
- color: '#999',
+ color: "#999",
fontSize: 14,
},
},
},
formatter: (name) => {
if (data.length) {
- let target, percent;
+ let target, percent
for (let i = 0; i < data.length; i++) {
if (data[i].name === name) {
- target = data[i].value;
- percent = ((target / total) * 100).toFixed(2);
+ target = data[i].value
+ percent = ((target / total) * 100).toFixed(2)
}
}
- return `{name|${name} }{value| ${target}} {rate| ${percent}%}`;
-
+ return `{name|${name} }{value| ${target}} {rate| ${percent}%}`
} else {
- return `{name|${name} }{value| ${0}} {rate| ${0}%}`;
-
+ return `{name|${name} }{value| ${0}} {rate| ${0}%}`
}
},
},
- series: [{
- name,
- type: 'pie',
- radius: ['45%', '70%'],
- center: ['35%', '50%'],
- avoidLabelOverlap: false,
- label: {
- show: false,
- overflow: 'none',
- formatter: '{b} {d}% \n {c} tce',
+ series: [
+ {
+ name,
+ type: "pie",
+ radius: ["45%", "70%"],
+ center: ["35%", "50%"],
+ avoidLabelOverlap: false,
+ label: {
+ show: false,
+ overflow: "none",
+ formatter: "{b} {d}% \n {c} tce",
+ },
+ data,
},
- data,
- }]
+ ],
})
}
function getChart(Id, dataList) {
- const myChart3 = echarts.init(document.getElementById(Id));
- myChart3.setOption(
- {
-
- grid: {
- left: '3%',
- right: '2%',
- bottom: '2%',
- containLabel: true
+ const myChart3 = echarts.init(document.getElementById(Id))
+ myChart3.setOption({
+ grid: {
+ left: "3%",
+ right: "2%",
+ bottom: "2%",
+ containLabel: true,
+ },
+ tooltip: {
+ trigger: "axis",
+ },
+ xAxis: {
+ type: "category",
+ // boundaryGap: false,
+ data: dataList.xAxisData,
+ axisPointer: {
+ type: "shadow",
},
- tooltip: {
- trigger: 'axis',
-
+ axisTick: {
+ show: false,
+ alignWithLabel: true,
+ length: 5,
},
- xAxis: {
- type: 'category',
- // boundaryGap: false,
- data: dataList.xAxisData,
- axisPointer: {
- type: 'shadow'
+ // 鍧愭爣杞村埢搴︾嚎鏍峰紡
+ axisTick: {
+ show: false,
+ length: 5,
+ lineStyle: {
+ color: "#ddd",
},
- axisTick: {
- show: false,
- alignWithLabel: true,
- length: 5
- },
- // 鍧愭爣杞村埢搴︾嚎鏍峰紡
- axisTick: {
- show: false,
- length: 5,
- lineStyle: {
- color: '#ddd'
- }
- },
-
- // 鍒嗗壊绾�
- splitLine: {
- show: false,
- lineStyle: {
- type: 'dashed',
- color: 'rgba(220,222,226,0.4)'
- }
- },
- axisLabel: {
- color: '#999',
- fontSize: 14,
- padding: [5, 0, 0, 0],
- // formatter: '{value} ml'
- }
},
- yAxis: {
- type: 'value',
- name: '锛堟锛�',
- // 璁剧疆鍚嶇О鏍峰紡
- nameTextStyle: {
- color: ' #CEE3FF',
- fontSize: 14,
- padding: [0, 0, 5, 0],
- },
- // 鍧愭爣杞村埢搴�
- axisTick: {
- show: false,
- alignWithLabel: true,
- length: 5
- },
- // 鍧愭爣杞村埢搴︾嚎鏍峰紡
- axisTick: {
- show: false,
- length: 5,
- lineStyle: {
- color: ''
- }
- },
- // 鍒嗗壊绾�
- splitLine: {
- show: true,
- lineStyle: {
- type: 'dashed',
- color: 'rgba(220,222,226,0.4)'
- }
+ // 鍒嗗壊绾�
+ splitLine: {
+ show: false,
+ lineStyle: {
+ type: "dashed",
+ color: "rgba(220,222,226,0.4)",
},
-
- // 鍧愭爣杞村埢搴﹂棿闅�
- // interval: '50',
- // // 鍧愭爣杞存渶灏忓��
- // min: 'dataMin',
- // // 鍧愭爣杞存渶澶у��
- // max: 'dataMax',
- // // 鍧愭爣杞村皬鏁扮偣绮惧害
- // precision: 0,
- // // 鍧愭爣杞村埢搴︽枃鏈殑甯冨眬鏈濆悜
- // position: 'left'
- axisLabel: {
- color: '#B2B8C2',
- fontSize: 14,
- // formatter: '{value} ml'
- }
},
- series: [
- {
- name: "鎶ヨ娆℃暟",
- type: "bar",
- barWidth: '17',
- stack: 'number',
- data: dataList.data,
- tooltip: {
- show: false,
- }
+ axisLabel: {
+ color: "#999",
+ fontSize: 14,
+ padding: [5, 0, 0, 0],
+ // formatter: '{value} ml'
+ },
+ },
+ yAxis: {
+ type: "value",
+ name: "锛堟锛�",
+ // 璁剧疆鍚嶇О鏍峰紡
+ nameTextStyle: {
+ color: " #CEE3FF",
+ fontSize: 14,
+ padding: [0, 0, 5, 0],
+ },
+ // 鍧愭爣杞村埢搴�
+ axisTick: {
+ show: false,
+ alignWithLabel: true,
+ length: 5,
+ },
+ // 鍧愭爣杞村埢搴︾嚎鏍峰紡
+ axisTick: {
+ show: false,
+ length: 5,
+ lineStyle: {
+ color: "",
},
- {
- name: '鎶ヨ娆℃暟',
- type: 'line',
- symbol: 'none', // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣
- lineStyle: {
- color: '#EE0303'
- },
- data: dataList.data,
- },
- ]
- })
+ },
- window.addEventListener("resize", () => {
- myChart1.resize();
- myChart2.resize();
- myChart3.resize();
- }, { passive: true });
+ // 鍒嗗壊绾�
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: "dashed",
+ color: "rgba(220,222,226,0.4)",
+ },
+ },
+
+ // 鍧愭爣杞村埢搴﹂棿闅�
+ // interval: '50',
+ // // 鍧愭爣杞存渶灏忓��
+ // min: 'dataMin',
+ // // 鍧愭爣杞存渶澶у��
+ // max: 'dataMax',
+ // // 鍧愭爣杞村皬鏁扮偣绮惧害
+ // precision: 0,
+ // // 鍧愭爣杞村埢搴︽枃鏈殑甯冨眬鏈濆悜
+ // position: 'left'
+ axisLabel: {
+ color: "#B2B8C2",
+ fontSize: 14,
+ // formatter: '{value} ml'
+ },
+ },
+ series: [
+ {
+ name: "鎶ヨ娆℃暟",
+ type: "bar",
+ barWidth: "12",
+ stack: "number",
+ data: dataList.data,
+ tooltip: {
+ show: false,
+ },
+ },
+ {
+ name: "鎶ヨ娆℃暟",
+ type: "line",
+ symbol: "none", // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣
+ lineStyle: {
+ color: "#EE0303",
+ },
+ data: dataList.data,
+ },
+ ],
+ })
+
+ window.addEventListener(
+ "resize",
+ () => {
+ myChart1.resize()
+ myChart2.resize()
+ myChart3.resize()
+ },
+ { passive: true }
+ )
}
-
-
-
-
</script>
<style scoped lang="scss">
@import "@/assets/styles/page.scss";
-
.chart-box {
- height: calc((100vh - 410px)/2) !important;
+ height: calc((100vh - 410px) / 2) !important;
}
-</style>
\ No newline at end of file
+</style>
diff --git a/zhitan-vue/src/views/alarmmanage/measuremen/measuremen.vue b/zhitan-vue/src/views/alarmmanage/measuremen/measuremen.vue
index b46e7a2..cbd3852 100644
--- a/zhitan-vue/src/views/alarmmanage/measuremen/measuremen.vue
+++ b/zhitan-vue/src/views/alarmmanage/measuremen/measuremen.vue
@@ -8,16 +8,28 @@
<div class="form-card">
<el-form :model="form" ref="queryRef" :inline="true" label-width="85px">
<el-form-item label="鏈熼棿" prop="timeType">
- <el-select v-model="queryParams.timeType" placeholder="鏈熼棿" clearable style="width: 120px"
- @change="handleTimeType">
+ <el-select
+ v-model="queryParams.timeType"
+ placeholder="鏈熼棿"
+ clearable
+ style="width: 120px"
+ @change="handleTimeType"
+ >
<el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="鏃堕棿">
- <el-date-picker v-model="queryParams.dataTime" :clearable="false"
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ :clearable="false"
:type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'"
- :format="queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD'"
- value-format="YYYY-MM-DD" placeholder="鏃堕棿" style="width: 100%" />
+ :format="
+ queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD'
+ "
+ value-format="YYYY-MM-DD"
+ placeholder="鏃堕棿"
+ style="width: 100%"
+ />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
@@ -27,8 +39,10 @@
</div>
<div class="mt20 mb20 text-center data-item">
- 鏈敤鑳藉崟鍏冩寚鏍�<span>{{ dataArray.indexCount }}</span>涓紝
- 鏈勾搴︽姤璀�<span>{{ dataArray.yearCount }}</span>娆★紝鏈湀<span>{{ dataArray.monthCount }}</span>娆�
+ 鏈敤鑳藉崟鍏冩寚鏍�<span>{{ dataArray.indexCount }}</span
+ >涓紝 鏈勾搴︽姤璀�<span>{{ dataArray.yearCount }}</span
+ >娆★紝鏈湀<span>{{ dataArray.monthCount }}</span
+ >娆�
</div>
<el-row :gutter="24" class="mb20">
<el-col :span="12">
@@ -60,71 +74,70 @@
</template>
<script setup>
-import * as echarts from 'echarts';
-import { onMounted, reactive, ref } from 'vue';
-import { listEnergyTypeList } from "@/api/modelConfiguration/energyType";
-const { proxy } = getCurrentInstance();
-const { period } = proxy.useDict("period");
-let { alarm_record_category } = proxy.useDict("alarm_record_category");
+import * as echarts from "echarts"
+import { onMounted, reactive, ref } from "vue"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+const { proxy } = getCurrentInstance()
+const { period } = proxy.useDict("period")
+let { alarm_record_category } = proxy.useDict("alarm_record_category")
let energyTypeList = ref([])
function getEnergyTypeList() {
listEnergyTypeList().then((res) => {
- energyTypeList.value = res.data;
- queryParams.value.energyType = energyTypeList.value[0].enersno;
- });
+ energyTypeList.value = res.data
+ queryParams.value.energyType = energyTypeList.value[0].enersno
+ })
}
getEnergyTypeList()
function formatterLabel(list, value) {
- let dict = list.find(item => item.enersno == value)
- return dict ? dict.enername : ''
+ let dict = list.find((item) => item.enersno == value)
+ return dict ? dict.enername : ""
}
-
let queryParams = ref({
timeType: null,
dataTime: null,
- nodeId: null
+ nodeId: null,
})
-import { getByNodeId, getCountInfo } from "@/api/alarmManage/alarmManage";
-import { el } from 'element-plus/es/locales.mjs';
-let form = ref({});
+import { getByNodeId, getCountInfo } from "@/api/alarmManage/alarmManage"
+import { el } from "element-plus/es/locales.mjs"
+let form = ref({})
let currentNode = ref()
function handleTimeType(e) {
- queryParams.value.timeType = e;
- queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD");
+ queryParams.value.timeType = e
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")
}
function handleNodeClick(e) {
currentNode.value = e
queryParams.value.nodeId = e.id
- handleTimeType(period.value[0].value);
+ handleTimeType(period.value[0].value)
getByNodeIdFun()
}
function getByNodeIdFun() {
- getByNodeId(queryParams.value).then(res => {
+ getByNodeId(queryParams.value).then((res) => {
let alarmList = []
let energyList = []
let alarmNumberList = {
data: [],
- xAxisData: []
+ xAxisData: [],
}
if (res.code == 200) {
let { data } = res
- alarmList = data.alarmProportion.map(item => {
+ alarmList = data.alarmProportion.map((item) => {
return {
name: proxy.selectDictLabel(alarm_record_category.value, item.energyName),
value: item.count,
- percentage: item.percentage
+ percentage: item.percentage,
}
})
- energyList = data.energyProportion.map(item => {
+ energyList = data.energyProportion.map((item) => {
return {
name: formatterLabel(energyTypeList.value, item.energyName),
value: item.count,
- percentage: item.percentage
+ percentage: item.percentage,
}
})
for (const item of data.chartDataList) {
@@ -132,9 +145,9 @@
alarmNumberList.data.push(item.yvalue)
}
- pieChart('Chart1', alarmList, '鎶ヨ绫诲瀷鍗犳瘮')
- pieChart('Chart2', energyList, '鑳芥簮绫诲瀷鍗犳瘮')
- getChart('Chart3', alarmNumberList)
+ pieChart("Chart1", alarmList, "鎶ヨ绫诲瀷鍗犳瘮")
+ pieChart("Chart2", energyList, "鑳芥簮绫诲瀷鍗犳瘮")
+ getChart("Chart3", alarmNumberList)
}
})
}
@@ -144,16 +157,16 @@
getByNodeIdFun()
}
function resetQuery() {
- handleTimeType('YEAR')
+ handleTimeType("YEAR")
getByNodeIdFun()
}
let dataArray = ref({
indexCount: 0,
yearCount: 0,
- monthCount: 0
+ monthCount: 0,
})
function getCountInfoFun() {
- getCountInfo(queryParams.value).then(res => {
+ getCountInfo(queryParams.value).then((res) => {
if (res.code == 200) {
dataArray.value = res.data
}
@@ -163,45 +176,56 @@
getCountInfoFun()
function pieChart(Id, data, name) {
console.log(data)
- let total = 0;
+ let total = 0
data.forEach(function (val, idx, arr) {
- total += val.value;
+ total += val.value
})
- const myChart = echarts.init(document.getElementById(Id));
+ const myChart = echarts.init(document.getElementById(Id))
myChart.setOption({
- color: ['#4D94FF', '#00C27C', '#F0142F', '#F2D261', '#0E7CE2', '#FF8352', '#E271DE', '#F8456B', '#00FFFF', '#4AEAB0'],
+ color: [
+ "#4D94FF",
+ "#00C27C",
+ "#F0142F",
+ "#F2D261",
+ "#0E7CE2",
+ "#FF8352",
+ "#E271DE",
+ "#F8456B",
+ "#00FFFF",
+ "#4AEAB0",
+ ],
grid: {
- top: '20%',
- left: '1%',
- right: '1%',
- bottom: '0%',
- containLabel: true
+ top: "20%",
+ left: "1%",
+ right: "1%",
+ bottom: "0%",
+ containLabel: true,
},
tooltip: {
- trigger: 'item'
+ trigger: "item",
},
legend: {
- orient: 'vertical',
- top: 'center',
- icon: 'circle',
+ orient: "vertical",
+ top: "center",
+ icon: "circle",
itemWidth: 14,
itemHeight: 14,
- right: '2%',
+ right: "2%",
itemGap: 10,
textStyle: {
- align: 'left',
- verticalAlign: 'middle',
+ align: "left",
+ verticalAlign: "middle",
rich: {
name: {
- color: '#999',
+ color: "#999",
fontSize: 14,
},
value: {
- color: '#999',
+ color: "#999",
fontSize: 14,
},
rate: {
- color: '#999',
+ color: "#999",
fontSize: 14,
},
},
@@ -209,167 +233,165 @@
formatter: (name) => {
for (let i = 0; i < data.length; i++) {
if (data[i].name === name) {
- return `{name|${data[i].name} }{value| ${data[i].value}} {rate| ${data[i].percentage}%}`;
+ return `{name|${data[i].name} }{value| ${data[i].value}} {rate| ${data[i].percentage}%}`
}
}
},
},
- series: [{
- name,
- type: 'pie',
- radius: ['45%', '70%'],
- center: ['35%', '50%'],
- avoidLabelOverlap: false,
- label: {
- show: false,
- overflow: 'none',
- formatter: '{b} {d}% \n {c} tce',
+ series: [
+ {
+ name,
+ type: "pie",
+ radius: ["45%", "70%"],
+ center: ["35%", "50%"],
+ avoidLabelOverlap: false,
+ label: {
+ show: false,
+ overflow: "none",
+ formatter: "{b} {d}% \n {c} tce",
+ },
+ data,
},
- data,
- }]
+ ],
})
}
function getChart(Id, dataList) {
- const myChart3 = echarts.init(document.getElementById(Id));
- myChart3.setOption(
- {
-
- grid: {
- left: '3%',
- right: '2%',
- bottom: '2%',
- containLabel: true
+ const myChart3 = echarts.init(document.getElementById(Id))
+ myChart3.setOption({
+ grid: {
+ left: "3%",
+ right: "2%",
+ bottom: "2%",
+ containLabel: true,
+ },
+ tooltip: {
+ trigger: "axis",
+ },
+ xAxis: {
+ type: "category",
+ // boundaryGap: false,
+ data: dataList.xAxisData,
+ axisPointer: {
+ type: "shadow",
},
- tooltip: {
- trigger: 'axis',
-
+ axisTick: {
+ show: false,
+ alignWithLabel: true,
+ length: 5,
},
- xAxis: {
- type: 'category',
- // boundaryGap: false,
- data: dataList.xAxisData,
- axisPointer: {
- type: 'shadow'
+ // 鍧愭爣杞村埢搴︾嚎鏍峰紡
+ axisTick: {
+ show: false,
+ length: 5,
+ lineStyle: {
+ color: "#ddd",
},
- axisTick: {
- show: false,
- alignWithLabel: true,
- length: 5
- },
- // 鍧愭爣杞村埢搴︾嚎鏍峰紡
- axisTick: {
- show: false,
- length: 5,
- lineStyle: {
- color: '#ddd'
- }
- },
-
- // 鍒嗗壊绾�
- splitLine: {
- show: false,
- lineStyle: {
- type: 'dashed',
- color: 'rgba(220,222,226,0.4)'
- }
- },
- axisLabel: {
- color: '#999',
- fontSize: 14,
- padding: [5, 0, 0, 0],
- // formatter: '{value} ml'
- }
},
- yAxis: {
- type: 'value',
- name: '锛堟锛�',
- // 璁剧疆鍚嶇О鏍峰紡
- nameTextStyle: {
- color: ' #CEE3FF',
- fontSize: 14,
- padding: [0, 0, 5, 0],
- },
- // 鍧愭爣杞村埢搴�
- axisTick: {
- show: false,
- alignWithLabel: true,
- length: 5
- },
- // 鍧愭爣杞村埢搴︾嚎鏍峰紡
- axisTick: {
- show: false,
- length: 5,
- lineStyle: {
- color: ''
- }
- },
- // 鍒嗗壊绾�
- splitLine: {
- show: true,
- lineStyle: {
- type: 'dashed',
- color: 'rgba(220,222,226,0.4)'
- }
+ // 鍒嗗壊绾�
+ splitLine: {
+ show: false,
+ lineStyle: {
+ type: "dashed",
+ color: "rgba(220,222,226,0.4)",
},
-
- // 鍧愭爣杞村埢搴﹂棿闅�
- // interval: '50',
- // // 鍧愭爣杞存渶灏忓��
- // min: 'dataMin',
- // // 鍧愭爣杞存渶澶у��
- // max: 'dataMax',
- // // 鍧愭爣杞村皬鏁扮偣绮惧害
- // precision: 0,
- // // 鍧愭爣杞村埢搴︽枃鏈殑甯冨眬鏈濆悜
- // position: 'left'
- axisLabel: {
- color: '#B2B8C2',
- fontSize: 14,
- // formatter: '{value} ml'
- }
},
- series: [
- {
- name: "鎶ヨ娆℃暟",
- type: "bar",
- barWidth: '17',
- stack: 'number',
- data: dataList.data,
- tooltip: {
- show: false,
- }
+ axisLabel: {
+ color: "#999",
+ fontSize: 14,
+ padding: [5, 0, 0, 0],
+ // formatter: '{value} ml'
+ },
+ },
+ yAxis: {
+ type: "value",
+ name: "锛堟锛�",
+ // 璁剧疆鍚嶇О鏍峰紡
+ nameTextStyle: {
+ color: " #CEE3FF",
+ fontSize: 14,
+ padding: [0, 0, 5, 0],
+ },
+ // 鍧愭爣杞村埢搴�
+ axisTick: {
+ show: false,
+ alignWithLabel: true,
+ length: 5,
+ },
+ // 鍧愭爣杞村埢搴︾嚎鏍峰紡
+ axisTick: {
+ show: false,
+ length: 5,
+ lineStyle: {
+ color: "",
},
- {
- name: '鎶ヨ娆℃暟',
- type: 'line',
- symbol: 'none', // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣
- lineStyle: {
- color: '#EE0303'
- },
- data: dataList.data,
- },
- ]
- })
+ },
- window.addEventListener("resize", () => {
- myChart1.resize();
- myChart2.resize();
- myChart3.resize();
- }, { passive: true });
+ // 鍒嗗壊绾�
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: "dashed",
+ color: "rgba(220,222,226,0.4)",
+ },
+ },
+
+ // 鍧愭爣杞村埢搴﹂棿闅�
+ // interval: '50',
+ // // 鍧愭爣杞存渶灏忓��
+ // min: 'dataMin',
+ // // 鍧愭爣杞存渶澶у��
+ // max: 'dataMax',
+ // // 鍧愭爣杞村皬鏁扮偣绮惧害
+ // precision: 0,
+ // // 鍧愭爣杞村埢搴︽枃鏈殑甯冨眬鏈濆悜
+ // position: 'left'
+ axisLabel: {
+ color: "#B2B8C2",
+ fontSize: 14,
+ // formatter: '{value} ml'
+ },
+ },
+ series: [
+ {
+ name: "鎶ヨ娆℃暟",
+ type: "bar",
+ barWidth: "12",
+ stack: "number",
+ data: dataList.data,
+ tooltip: {
+ show: false,
+ },
+ },
+ {
+ name: "鎶ヨ娆℃暟",
+ type: "line",
+ symbol: "none", // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣
+ lineStyle: {
+ color: "#EE0303",
+ },
+ data: dataList.data,
+ },
+ ],
+ })
+
+ window.addEventListener(
+ "resize",
+ () => {
+ myChart1.resize()
+ myChart2.resize()
+ myChart3.resize()
+ },
+ { passive: true }
+ )
}
-
-
-
-
</script>
<style scoped lang="scss">
@import "@/assets/styles/page.scss";
-
.chart-box {
- height: calc((100vh - 410px)/2) !important;
+ height: calc((100vh - 410px) / 2) !important;
}
.data-item {
@@ -378,7 +400,7 @@
font-weight: bold;
span {
- color: #397AEE;
+ color: #397aee;
margin: 0 5px;
}
}
@@ -390,10 +412,9 @@
font-weight: bold;
span {
- color: #397AEE;
+ color: #397aee;
margin: 0 5px;
}
}
-
}
-</style>
\ No newline at end of file
+</style>
diff --git a/zhitan-vue/src/views/carbonemission/carbonEmission.vue b/zhitan-vue/src/views/carbonemission/carbonEmission.vue
index 8d49140..550abd7 100644
--- a/zhitan-vue/src/views/carbonemission/carbonEmission.vue
+++ b/zhitan-vue/src/views/carbonemission/carbonEmission.vue
@@ -8,42 +8,40 @@
<div class="form-card">
<el-form :model="queryParams" ref="queryRef" :inline="true">
<el-form-item label="鏈熼棿" prop="timeType">
- <el-select v-model="queryParams.timeType" placeholder="鏈熼棿" clearable style="width: 120px"
- @change="handleTimeType">
+ <el-select
+ v-model="queryParams.timeType"
+ placeholder="鏈熼棿"
+ clearable
+ style="width: 120px"
+ @change="handleTimeType"
+ >
<el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="鏃堕棿">
- <el-date-picker v-model="queryParams.dataTime" :type="queryParams.timeType == 'YEAR'
- ? 'year'
- : queryParams.timeType == 'MONTH'
- ? 'month'
- : 'date'
- " :format="queryParams.timeType == 'YEAR'
- ? 'YYYY'
- : queryParams.timeType == 'MONTH'
- ? 'YYYY-MM'
- : 'YYYY-MM-DD'
- " value-format="YYYY-MM-DD" placeholder="鏃堕棿" style="width: 100%" />
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ :type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'"
+ :format="
+ queryParams.timeType == 'YEAR' ? 'YYYY' : queryParams.timeType == 'MONTH' ? 'YYYY-MM' : 'YYYY-MM-DD'
+ "
+ value-format="YYYY-MM-DD"
+ placeholder="鏃堕棿"
+ style="width: 100%"
+ />
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">
- 鎼滅储
- </el-button>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
<el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Download" @click="handleExport">
- 瀵煎嚭
- </el-button>
+ <el-button type="primary" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
</el-form-item>
</el-form>
</div>
- <div style="
- height: calc(100vh - 220px) !important;
- max-height: calc(100vh - 220px) !important;
- overflow-y: auto;
- ">
+ <div
+ style="height: calc(100vh - 220px) !important; max-height: calc(100vh - 220px) !important; overflow-y: auto"
+ >
<div class="card-list" v-if="listTop.length > 1">
<el-button @click="dialogVisible = true"> 鏌ョ湅鏇村 </el-button>
</div>
@@ -52,9 +50,12 @@
<template v-for="(item, index) in row" :key="index">
<div class="card-list-item">
<div class="item-top">
- <div class="top-icon" :style="{
- backgroundImage: 'url(' + bgList[index].icon + ')',
- }" />
+ <div
+ class="top-icon"
+ :style="{
+ backgroundImage: 'url(' + bgList[index].icon + ')',
+ }"
+ />
<div class="top-right">
{{ item.allEneryType }}
</div>
@@ -69,12 +70,10 @@
<div class="bottom-left">鍚屾瘮</div>
<div class="bottom-right" :style="{ color: bgList[index].color }">
{{ Math.abs(item.yoyEnery) }}%
- <el-icon v-if="!!item.yoyEnery" :color="item.yoyEnery > 0
- ? 'green'
- : item.yoyEnery < 0
- ? 'red'
- : ''
- ">
+ <el-icon
+ v-if="!!item.yoyEnery"
+ :color="item.yoyEnery > 0 ? 'green' : item.yoyEnery < 0 ? 'red' : ''"
+ >
<Top v-if="item.yoyEnery > 0" />
<Bottom v-if="item.yoyEnery < 0" />
</el-icon>
@@ -84,25 +83,23 @@
</template>
</div>
</template>
- <BaseCard :title="queryParams.nodeName +
- '-纰虫帓鏀鹃噺鍚岀幆姣�(' +
- queryParams.dataTime +
- ')'
- ">
+ <BaseCard :title="queryParams.nodeName + '-纰虫帓鏀鹃噺鍚岀幆姣�(' + queryParams.dataTime + ')'">
<div class="chart-box" v-loading="loading">
<div id="Chart1" />
</div>
</BaseCard>
- <BaseCard :title="queryParams.nodeName +
- '-纰虫帓鏀鹃噺缁熻鍒嗘瀽琛�(' +
- queryParams.dataTime +
- ')'
- ">
+ <BaseCard :title="queryParams.nodeName + '-纰虫帓鏀鹃噺缁熻鍒嗘瀽琛�(' + queryParams.dataTime + ')'">
<div class="table-box">
<el-table :data="listBottom" v-loading="loading">
<el-table-column label="鏃堕棿" align="center" key="xaxis" prop="xaxis" :show-overflow-tooltip="true" />
- <el-table-column label="鐮存帓鏀鹃噺(tCO鈧俥)
- " align="center" key="yaxis" prop="yaxis" :show-overflow-tooltip="true" />
+ <el-table-column
+ label="鐮存帓鏀鹃噺(tCO鈧俥)
+ "
+ align="center"
+ key="yaxis"
+ prop="yaxis"
+ :show-overflow-tooltip="true"
+ />
<el-table-column label="鍚屾瘮" align="center" key="yoy" prop="yoy" :show-overflow-tooltip="true" />
<el-table-column label="鐜瘮" align="center" key="qoq" prop="qoq" :show-overflow-tooltip="true" />
</el-table>
@@ -117,9 +114,12 @@
<template v-for="(item, index) in row" :key="index">
<div class="card-list-item">
<div class="item-top">
- <div class="top-icon" :style="{
- backgroundImage: 'url(' + bgList[index].icon + ')',
- }" />
+ <div
+ class="top-icon"
+ :style="{
+ backgroundImage: 'url(' + bgList[index].icon + ')',
+ }"
+ />
<div class="top-right">
{{ item.allEneryType }}
</div>
@@ -134,12 +134,7 @@
<div class="bottom-left">鍚屾瘮</div>
<div class="bottom-right" :style="{ color: bgList[index].color }">
{{ Math.abs(item.yoyEnery) }}%
- <el-icon v-if="!!item.yoyEnery" :color="item.yoyEnery > 0
- ? 'green'
- : item.yoyEnery < 0
- ? 'red'
- : ''
- ">
+ <el-icon v-if="!!item.yoyEnery" :color="item.yoyEnery > 0 ? 'green' : item.yoyEnery < 0 ? 'red' : ''">
<Top v-if="item.yoyEnery > 0" />
<Bottom v-if="item.yoyEnery < 0" />
</el-icon>
@@ -153,29 +148,26 @@
</div>
</template>
<script setup name="carbonEmission">
-import {
- listUpCarbonemission,
- listMiddleCarbonemission,
-} from "@/api/carbonemission/carbonemission";
-import * as echarts from "echarts";
-const { proxy } = getCurrentInstance();
-import { useRoute } from "vue-router";
-const { period } = proxy.useDict("period");
-import useSettingsStore from "@/store/modules/settings";
-const settingsStore = useSettingsStore();
+import { listUpCarbonemission, listMiddleCarbonemission } from "@/api/carbonemission/carbonemission"
+import * as echarts from "echarts"
+const { proxy } = getCurrentInstance()
+import { useRoute } from "vue-router"
+const { period } = proxy.useDict("period")
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
watch(
() => settingsStore.sideTheme,
(val) => {
- getList();
+ getList()
}
-);
-const loading = ref(false);
-const dialogVisible = ref(false);
-import icon1 from "@/assets/images/period/icon1.png";
-import icon2 from "@/assets/images/period/icon2.png";
-import icon3 from "@/assets/images/period/icon3.png";
-import icon4 from "@/assets/images/period/icon4.png";
-import icon5 from "@/assets/images/period/icon5.png";
+)
+const loading = ref(false)
+const dialogVisible = ref(false)
+import icon1 from "@/assets/images/period/icon1.png"
+import icon2 from "@/assets/images/period/icon2.png"
+import icon3 from "@/assets/images/period/icon3.png"
+import icon4 from "@/assets/images/period/icon4.png"
+import icon5 from "@/assets/images/period/icon5.png"
const bgList = ref([
{
icon: icon1,
@@ -197,9 +189,9 @@
icon: icon5,
color: "#78e801",
},
-]);
-const listTop = ref([]);
-const listBottom = ref([]);
+])
+const listTop = ref([])
+const listBottom = ref([])
const data = reactive({
queryParams: {
nodeId: null,
@@ -208,23 +200,23 @@
dataTime: null,
},
query: { ...useRoute().query },
-});
-const { queryParams, query } = toRefs(data);
+})
+const { queryParams, query } = toRefs(data)
/** 鑺傜偣鍗曞嚮浜嬩欢 */
function handleNodeClick(data) {
- queryParams.value.nodeId = data.id;
- queryParams.value.nodeName = data.label;
- handleTimeType(period.value[0].value);
- handleQuery();
+ queryParams.value.nodeId = data.id
+ queryParams.value.nodeName = data.label
+ handleTimeType(period.value[0].value)
+ handleQuery()
}
function handleTimeType(e) {
- queryParams.value.timeType = e;
- queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD");
+ queryParams.value.timeType = e
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")
}
// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-鍒楄〃
function getList() {
- loading.value = true;
- listTop.value = [];
+ loading.value = true
+ listTop.value = []
listUpCarbonemission(
proxy.addDateRange({
...queryParams.value,
@@ -233,15 +225,15 @@
).then((res) => {
res.data.upData.map((item, index) => {
if (index % 5 === 0) {
- listTop.value.push(res.data.upData.slice(index, index + 5));
+ listTop.value.push(res.data.upData.slice(index, index + 5))
}
- });
- });
+ })
+ })
// 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥
if (echarts.getInstanceByDom(document.getElementById("Chart1"))) {
- echarts.dispose(document.getElementById("Chart1"));
+ echarts.dispose(document.getElementById("Chart1"))
}
- const myChart1 = echarts.init(document.getElementById("Chart1"));
+ const myChart1 = echarts.init(document.getElementById("Chart1"))
listMiddleCarbonemission(
proxy.addDateRange({
emissionType: "allType",
@@ -250,19 +242,19 @@
})
).then((res) => {
if (!!res.code && res.code == 200) {
- loading.value = false;
- let xaxis = [];
- let yaxis = [];
- let yoy = [];
- let qoq = [];
+ loading.value = false
+ let xaxis = []
+ let yaxis = []
+ let yoy = []
+ let qoq = []
if (!!res.data) {
res.data.map((item) => {
- xaxis.push(item.xaxis);
- yaxis.push(!!item.yaxis ? item.yaxis : 0);
- yoy.push(!!item.yoy ? item.yoy : 0);
- qoq.push(!!item.qoq ? item.qoq : 0);
- });
- listBottom.value = res.data;
+ xaxis.push(item.xaxis)
+ yaxis.push(!!item.yaxis ? item.yaxis : 0)
+ yoy.push(!!item.yoy ? item.yoy : 0)
+ qoq.push(!!item.qoq ? item.qoq : 0)
+ })
+ listBottom.value = res.data
}
setTimeout(() => {
myChart1.setOption({
@@ -273,10 +265,7 @@
type: "shadow",
textStyle: {
fontSize: 14,
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
},
@@ -292,8 +281,7 @@
itemWidth: 14,
itemHeight: 10,
textStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
xAxis: {
@@ -304,10 +292,7 @@
axisLine: {
show: true,
lineStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -320,8 +305,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [5, 0, 0, 0],
// formatter: '{value} ml'
@@ -333,10 +317,7 @@
name: "tCO鈧俥",
type: "value",
nameTextStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [0, 0, 5, 0],
},
@@ -347,10 +328,7 @@
show: true,
lineStyle: {
type: "dashed",
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -360,10 +338,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
},
},
@@ -372,10 +347,7 @@
name: "%",
alignTicks: true,
nameTextStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [0, 0, 5, 0],
},
@@ -389,20 +361,14 @@
show: true,
lineStyle: {
type: "dashed",
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
splitArea: {
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
},
},
@@ -411,7 +377,7 @@
{
name: "纰虫帓鏀鹃噺",
type: "bar",
- barWidth: "27",
+ barWidth: "12",
itemStyle: {
borderRadius: [15, 15, 0, 0],
},
@@ -438,29 +404,29 @@
data: qoq,
},
],
- });
- }, 100);
+ })
+ }, 100)
window.addEventListener(
"resize",
() => {
- myChart1.resize();
+ myChart1.resize()
},
{ passive: true }
- );
+ )
}
- });
+ })
}
// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-鎼滅储
function handleQuery() {
- getList();
+ getList()
}
// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-閲嶇疆
function resetQuery() {
- proxy.resetForm("queryRef");
- queryParams.value.timeType = null;
- queryParams.value.dataTime = null;
- handleTimeType(period.value[0].value);
- handleQuery();
+ proxy.resetForm("queryRef")
+ queryParams.value.timeType = null
+ queryParams.value.dataTime = null
+ handleTimeType(period.value[0].value)
+ handleQuery()
}
// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-瀵煎嚭
function handleExport() {
@@ -472,7 +438,7 @@
...query.value,
},
`${queryParams.value.nodeName}-纰虫帓鏀鹃噺鏍哥畻_${new Date().getTime()}.xlsx`
- );
+ )
}
</script>
<style scoped lang="scss">
diff --git a/zhitan-vue/src/views/comprehensive/comps/LineChart.vue b/zhitan-vue/src/views/comprehensive/comps/LineChart.vue
new file mode 100644
index 0000000..891d8e5
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/comps/LineChart.vue
@@ -0,0 +1,177 @@
+<template>
+ <div class="chart-box">
+ <div id="ChartDom" style="width: 100%; height: 100%"></div>
+ </div>
+</template>
+
+<script setup>
+import * as echarts from "echarts"
+const { proxy } = getCurrentInstance()
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
+const emit = defineEmits()
+const props = defineProps({
+ chartData: {
+ type: Object,
+ default: () => {},
+ },
+})
+
+watch(
+ () => props.chartData,
+ (val) => {
+ console.log("watch", val)
+ initChart()
+ }
+)
+watch(
+ () => settingsStore.sideTheme,
+ (val) => {
+ initChart()
+ }
+)
+
+onMounted(() => {
+ initChart()
+})
+
+function initChart(value) {
+ const chartDom = document.getElementById("ChartDom")
+ if (echarts.getInstanceByDom(chartDom)) {
+ echarts.dispose(chartDom)
+ }
+ const myChart = echarts.init(chartDom)
+ let option = {
+ title: {
+ text: props.chartData.title,
+ left: "40",
+ textStyle: {
+ color: "#2979ff",
+ },
+ },
+ color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"],
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ type: "shadow",
+ },
+ },
+ legend: {
+ icon: "rect",
+ itemWidth: 14,
+ itemHeight: 10,
+ textStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ grid: {
+ top: "40",
+ left: "50",
+ right: "40",
+ bottom: "20",
+ containLabel: true,
+ },
+ xAxis: {
+ type: "category",
+ axisPointer: {
+ type: "shadow",
+ },
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ splitArea: {
+ show: false,
+ },
+ splitLine: {
+ show: false,
+ },
+ axisLabel: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ padding: [5, 0, 0, 0],
+ // formatter: '{value} ml'
+ },
+ data: props.chartData.xData,
+ },
+ yAxis: [
+ {
+ type: "value",
+ nameTextStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ padding: [0, 0, 5, 0],
+ },
+ axisLine: {
+ show: false,
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: "dashed",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ splitArea: {
+ show: false,
+ },
+ axisLabel: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ },
+ },
+ ],
+ series: [
+ {
+ name: props.chartData.title,
+ type: "bar",
+ barWidth: "16",
+ // tooltip: {
+ // valueFormatter: function (value) {
+ // return value + "tce"
+ // },
+ // },
+ itemStyle: {
+ borderRadius: [15, 15, 0, 0],
+ },
+ data: props.chartData.yData,
+ markPoint: {
+ data: [
+ { type: "max", name: "Max" },
+ { type: "min", name: "Min" },
+ ],
+ },
+ },
+ ],
+ }
+ setTimeout(() => {
+ myChart.setOption(option)
+ }, 200)
+
+ window.addEventListener(
+ "resize",
+ () => {
+ myChart.resize()
+ },
+ { passive: true }
+ )
+}
+</script>
+
+<style lang="scss" scoped>
+.chart-box {
+ width: 100%;
+ height: 400px;
+ border: 1px solid #eaeaea;
+ margin-top: 20px;
+ padding-top: 20px;
+}
+</style>
diff --git a/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue b/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue
new file mode 100644
index 0000000..a3d5183
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/dailyComprehensive/index.vue
@@ -0,0 +1,245 @@
+<template>
+ <div class="page">
+ <div class="form-card">
+ <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px">
+ <el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
+ <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷">
+ <el-option
+ :label="item.enername"
+ :value="item.enersno"
+ v-for="item in energyTypeList"
+ :key="item.enersno"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="缁熻鏃堕棿">
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ type="date"
+ format="YYYY-MM-DD"
+ value-format="YYYY-MM-DD"
+ placeholder="閫夋嫨鏃ユ湡"
+ style="width: 100%"
+ :clearable="false"
+ />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ <!-- <el-form-item>
+ <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+ </el-form-item> -->
+ </el-form>
+ </div>
+
+ <div class="table-bg-style">
+ <div class="table-box">
+ <el-table :data="energyList" v-loading="loading" border max-height="380px">
+ <el-table-column fixed prop="indexName" label="鎸囨爣鍚嶇О" width="210px">
+ <template #default="scope">
+ <div style="width: 100%; text-align: left">
+ <el-button
+ v-if="scope.row.indexId == queryParams.indexId"
+ icon="search"
+ circle
+ @click="selectChange(scope.row)"
+ style="color: #fff; background: #409eff; margin-right: 8px"
+ ></el-button>
+ <el-button
+ v-else
+ icon="search"
+ circle
+ @click="selectChange(scope.row)"
+ style="margin-right: 8px"
+ ></el-button>
+ <el-tooltip
+ v-if="scope.row.indexName.length > 9"
+ class="item"
+ effect="dark"
+ :content="scope.row.indexName"
+ placement="top-end"
+ >
+ <span>
+ {{ scope.row.indexName.substr(0, 9) + "..." }}
+ </span>
+ </el-tooltip>
+ <span v-else>{{ scope.row.indexName }}</span>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column v-for="index in 24" :key="index" :label="index - 1 + '鏃�'" align="center" min-width="100">
+ <template #default="scope">{{ numFilter(scope.row[`value${index - 1}`]) }}</template>
+ </el-table-column>
+ </el-table>
+
+ <div>
+ <line-chart ref="LineChartRef" :chartData="lineChartData" />
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script setup>
+import {
+ getDataList,
+ getlistChart,
+ exportList,
+} from "@/api/comprehensiveStatistics/dailyComprehensive/dailyComprehensive"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+import LineChart from "../comps/LineChart.vue"
+let { proxy } = getCurrentInstance()
+const energyTypeList = ref()
+function getEnergyTypeList() {
+ listEnergyTypeList().then((res) => {
+ energyTypeList.value = res.data
+ // form.value.indexType = alarm_record_category.value[0].value
+ // form.value.energyType = energyTypeList.value[0].enersno
+ getList()
+ })
+}
+getEnergyTypeList()
+function numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = ""
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(2)
+ } else {
+ realVal = "--"
+ }
+ return realVal
+}
+let loading = ref(false)
+let total = ref(0)
+let queryParams = ref({
+ indexStorageId: "",
+ indexCode: "",
+ pageNum: 1,
+ pageSize: 10,
+ dataTime: "",
+})
+
+const energyList = ref([])
+const lineChartData = ref({})
+function getList() {
+ queryParams.value.indexCode = proxy.$route.query.modelCode
+ getDataList({
+ ...queryParams.value,
+ timeType: "HOUR",
+ }).then((response) => {
+ energyList.value = response.data
+ if (response.data && response.data.length !== 0) {
+ selectChange(response.data[0])
+ }
+ })
+}
+
+const LineChartRef = ref()
+function selectChange(row) {
+ queryParams.value.indexId = row ? row.indexId : undefined
+ queryParams.value.timeType = "HOUR"
+ getlistChart(queryParams.value).then((response) => {
+ let actualData = []
+ let expectedData = []
+ let title = ""
+ response.data.forEach((item) => {
+ expectedData.push(numFilter(item.value))
+ actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�")
+ title = item.indexName + "(" + (item.unitId || "") + ")"
+ })
+
+ console.log(response)
+ console.log(actualData)
+ console.log(expectedData)
+
+ lineChartData.value = {
+ // xData: [
+ // "0鏃�",
+ // "1鏃�",
+ // "2鏃�",
+ // "3鏃�",
+ // "4鏃�",
+ // "5鏃�",
+ // "6鏃�",
+ // "7鏃�",
+ // "8鏃�",
+ // "9鏃�",
+ // "10鏃�",
+ // "11鏃�",
+ // "12鏃�",
+ // "13鏃�",
+ // "14鏃�",
+ // "15鏃�",
+ // "16鏃�",
+ // "17鏃�",
+ // "18鏃�",
+ // "19鏃�",
+ // "20鏃�",
+ // "21鏃�",
+ // "22鏃�",
+ // "23鏃�",
+ // ],
+ xData: actualData,
+ yData: expectedData,
+ title,
+ }
+ // LineChartRef.value.initChart()
+ // this.lineChartData.actualData = actualData;
+ // this.lineChartData.expectedData = expectedData;
+ // this.lineChartData.title = title;
+ // this.$refs.LineChart.initChart(this.lineChartData);
+ // this.$refs.BarChart.initChart(this.lineChartData);
+ })
+}
+
+function getTime() {
+ var date = new Date()
+ var year = date.getFullYear()
+ var month = date.getMonth() + 1
+ var date = date.getDate()
+ month = month < 10 ? "0" + month : month
+ date = date < 10 ? "0" + date : date
+ queryParams.value.dataTime = year + "-" + month + "-" + date
+}
+getTime()
+
+// 瀵煎嚭鎸夐挳鎿嶄綔
+function handleExport() {
+ exportList(queryParams.value).then((response) => {
+ console.log(response)
+ // download(response.msg);
+ })
+}
+
+function handleQuery() {
+ queryParams.value.pageNum = 1
+ getList()
+}
+
+function resetQuery() {
+ queryParams.value = {
+ limitName: "",
+ pageNum: 1,
+ pageSize: 10,
+ dataTime: null,
+ }
+ getTime()
+ getList()
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/styles/page.scss";
+
+.header-box {
+ :deep .el-form-item__content {
+ color: #fff;
+ font-size: 16px;
+ }
+}
+
+:deep .el-table--fit {
+ border-bottom: 1px solid #eaeaea;
+}
+</style>
diff --git a/zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue b/zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue
new file mode 100644
index 0000000..c63c0fe
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/monthlyComprehensive/index.vue
@@ -0,0 +1,241 @@
+<template>
+ <div class="page">
+ <div class="form-card">
+ <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px">
+ <el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
+ <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷">
+ <el-option
+ :label="item.enername"
+ :value="item.enersno"
+ v-for="item in energyTypeList"
+ :key="item.enersno"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="缁熻鏃堕棿">
+ <el-date-picker
+ style="width: 100%"
+ v-model="queryParams.dataTime"
+ type="month"
+ :clearable="false"
+ value-format="yyyy-MM"
+ placeholder="閫夋嫨鏃ユ湡"
+ >
+ </el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ <!-- <el-form-item>
+ <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+ </el-form-item> -->
+ </el-form>
+ </div>
+
+ <div class="table-bg-style">
+ <div class="table-box">
+ <el-table :data="energyList" v-loading="loading" border max-height="380px">
+ <el-table-column fixed prop="indexName" label="鎸囨爣鍚嶇О" width="210px">
+ <template #default="scope">
+ <div style="width: 100%; text-align: left">
+ <el-button
+ v-if="scope.row.indexId == queryParams.indexId"
+ icon="search"
+ circle
+ @click="selectChange(scope.row)"
+ style="color: #fff; background: #409eff; margin-right: 8px"
+ ></el-button>
+ <el-button
+ v-else
+ icon="search"
+ circle
+ @click="selectChange(scope.row)"
+ style="margin-right: 8px"
+ ></el-button>
+ <el-tooltip
+ v-if="scope.row.indexName.length > 9"
+ class="item"
+ effect="dark"
+ :content="scope.row.indexName"
+ placement="top-end"
+ >
+ <span>
+ {{ scope.row.indexName.substr(0, 9) + "..." }}
+ </span>
+ </el-tooltip>
+ <span v-else>{{ scope.row.indexName }}</span>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column v-for="index in 31" :key="index" :label="index + '鏃�'" align="center" min-width="100">
+ <template #default="scope">{{ numFilter(scope.row[`value${index - 1}`]) }}</template>
+ </el-table-column>
+ </el-table>
+
+ <div>
+ <line-chart ref="LineChartRef" :chartData="lineChartData" />
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script setup>
+import { getDataList, getlistChart } from "@/api/comprehensiveStatistics/monthlyComprehensive/monthlyComprehensive"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+import LineChart from "../comps/LineChart.vue"
+let { proxy } = getCurrentInstance()
+const energyTypeList = ref()
+function getEnergyTypeList() {
+ listEnergyTypeList().then((res) => {
+ energyTypeList.value = res.data
+ // form.value.indexType = alarm_record_category.value[0].value
+ // form.value.energyType = energyTypeList.value[0].enersno
+ getList()
+ })
+}
+getEnergyTypeList()
+function numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = ""
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(2)
+ } else {
+ realVal = "--"
+ }
+ return realVal
+}
+let loading = ref(false)
+let total = ref(0)
+let queryParams = ref({
+ indexStorageId: "",
+ indexCode: "",
+ pageNum: 1,
+ pageSize: 10,
+ dataTime: "",
+ timeType: "DAY",
+})
+
+const energyList = ref([])
+const lineChartData = ref({})
+function getList() {
+ queryParams.value.indexCode = proxy.$route.query.modelCode
+ getDataList({
+ ...queryParams.value,
+ }).then((response) => {
+ energyList.value = response.data.tabledata
+ if (energyList.value && energyList.value.length !== 0) {
+ selectChange(energyList.value[0])
+ }
+ })
+}
+
+const LineChartRef = ref()
+function selectChange(row) {
+ queryParams.value.indexId = row ? row.indexId : undefined
+ getlistChart(queryParams.value).then((response) => {
+ let actualData = []
+ let expectedData = []
+ let title = ""
+ response.data.forEach((item) => {
+ expectedData.push(numFilter(item.value))
+ actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�")
+ title = item.indexName + "(" + (item.unitId || "") + ")"
+ })
+
+ console.log(response)
+ console.log(actualData)
+ console.log(expectedData)
+
+ lineChartData.value = {
+ // xData: [
+ // "0鏃�",
+ // "1鏃�",
+ // "2鏃�",
+ // "3鏃�",
+ // "4鏃�",
+ // "5鏃�",
+ // "6鏃�",
+ // "7鏃�",
+ // "8鏃�",
+ // "9鏃�",
+ // "10鏃�",
+ // "11鏃�",
+ // "12鏃�",
+ // "13鏃�",
+ // "14鏃�",
+ // "15鏃�",
+ // "16鏃�",
+ // "17鏃�",
+ // "18鏃�",
+ // "19鏃�",
+ // "20鏃�",
+ // "21鏃�",
+ // "22鏃�",
+ // "23鏃�",
+ // ],
+ xData: actualData,
+ yData: expectedData,
+ title,
+ }
+ // LineChartRef.value.initChart()
+ // this.lineChartData.actualData = actualData;
+ // this.lineChartData.expectedData = expectedData;
+ // this.lineChartData.title = title;
+ // this.$refs.LineChart.initChart(this.lineChartData);
+ // this.$refs.BarChart.initChart(this.lineChartData);
+ })
+}
+
+function getTime() {
+ var date = new Date()
+ var year = date.getFullYear()
+ var month = date.getMonth() + 1
+ var date = date.getDate()
+ month = month < 10 ? "0" + month : month
+ date = date < 10 ? "0" + date : date
+ queryParams.value.dataTime = year + "-" + month
+}
+getTime()
+
+// 瀵煎嚭鎸夐挳鎿嶄綔
+function handleExport() {
+ exportList(queryParams.value).then((response) => {
+ console.log(response)
+ // download(response.msg);
+ })
+}
+
+function handleQuery() {
+ queryParams.value.pageNum = 1
+ getList()
+}
+
+function resetQuery() {
+ queryParams.value = {
+ limitName: "",
+ pageNum: 1,
+ pageSize: 10,
+ dataTime: null,
+ timeType: "DAY",
+ }
+ getTime()
+ getList()
+}
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/styles/page.scss";
+
+.header-box {
+ :deep .el-form-item__content {
+ color: #fff;
+ font-size: 16px;
+ }
+}
+
+:deep .el-table--fit {
+ border-bottom: 1px solid #eaeaea;
+}
+</style>
diff --git a/zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue b/zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue
new file mode 100644
index 0000000..494e37a
--- /dev/null
+++ b/zhitan-vue/src/views/comprehensive/yearComprehensive/index.vue
@@ -0,0 +1,245 @@
+<template>
+ <div class="page">
+ <div class="form-card">
+ <el-form :model="queryParams" ref="queryRef" :inline="true" label-width="68px">
+ <el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
+ <el-select v-model="queryParams.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷">
+ <el-option
+ :label="item.enername"
+ :value="item.enersno"
+ v-for="item in energyTypeList"
+ :key="item.enersno"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="缁熻鏃堕棿">
+ <el-date-picker
+ style="width: 100%"
+ v-model="queryParams.dataTime"
+ type="year"
+ :clearable="false"
+ value-format="YYYY"
+ placeholder="閫夋嫨鏃ユ湡"
+ >
+ </el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ <!-- <el-form-item>
+ <el-button type="warning" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+ </el-form-item> -->
+ </el-form>
+ </div>
+
+ <div class="table-bg-style">
+ <div class="table-box">
+ <el-table :data="energyList" v-loading="loading" border max-height="380px">
+ <el-table-column fixed prop="indexName" label="鎸囨爣鍚嶇О" width="210px">
+ <template #default="scope">
+ <div style="width: 100%; text-align: left">
+ <el-button
+ v-if="scope.row.indexId == queryParams.indexId"
+ icon="search"
+ circle
+ @click="selectChange(scope.row)"
+ style="color: #fff; background: #409eff; margin-right: 8px"
+ ></el-button>
+ <el-button
+ v-else
+ icon="search"
+ circle
+ @click="selectChange(scope.row)"
+ style="margin-right: 8px"
+ ></el-button>
+ <el-tooltip
+ v-if="scope.row.indexName.length > 9"
+ class="item"
+ effect="dark"
+ :content="scope.row.indexName"
+ placement="top-end"
+ >
+ <span>
+ {{ scope.row.indexName.substr(0, 9) + "..." }}
+ </span>
+ </el-tooltip>
+ <span v-else>{{ scope.row.indexName }}</span>
+ </div>
+ </template>
+ </el-table-column>
+ <el-table-column v-for="index in 12" :key="index" :label="index + '鏈�'" align="center" min-width="100">
+ <template #default="scope">{{ numFilter(scope.row[`value${index - 1}`]) }}</template>
+ </el-table-column>
+ </el-table>
+
+ <div>
+ <line-chart ref="LineChartRef" :chartData="lineChartData" />
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script setup>
+import { getDataList, getlistChart } from "@/api/comprehensiveStatistics/yearComprehensive/yearComprehensive"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+import LineChart from "../comps/LineChart.vue"
+let { proxy } = getCurrentInstance()
+const energyTypeList = ref()
+function getEnergyTypeList() {
+ listEnergyTypeList().then((res) => {
+ energyTypeList.value = res.data
+ // form.value.indexType = alarm_record_category.value[0].value
+ // form.value.energyType = energyTypeList.value[0].enersno
+ getList()
+ })
+}
+getEnergyTypeList()
+function numFilter(value) {
+ // 鎴彇褰撳墠鏁版嵁鍒板皬鏁扮偣鍚庣殑鍑犱綅
+ let realVal = ""
+ if (!isNaN(value) && value !== "" && value !== null) {
+ realVal = parseFloat(value).toFixed(2)
+ } else {
+ realVal = "--"
+ }
+ return realVal
+}
+let loading = ref(false)
+let queryParams = ref({
+ indexStorageId: "",
+ indexCode: "",
+ pageNum: 1,
+ pageSize: 10,
+ dataTime: "2025-01-0",
+ timeType: "MONTH",
+})
+
+const energyList = ref([])
+const lineChartData = ref({})
+function getList() {
+ queryParams.value.indexCode = proxy.$route.query.modelCode
+ getDataList({
+ ...queryParams.value,
+ dataTime: queryParams.value.dataTime ? queryParams.value.dataTime + "-01" : "",
+ }).then((response) => {
+ energyList.value = response.data
+ if (response.data && response.data.length !== 0) {
+ selectChange(response.data[0])
+ }
+ })
+}
+
+const LineChartRef = ref()
+function selectChange(row) {
+ queryParams.value.indexId = row ? row.indexId : undefined
+ getlistChart({
+ ...queryParams.value,
+ dataTime: queryParams.value.dataTime ? queryParams.value.dataTime + "-01" : "",
+ }).then((response) => {
+ let actualData = []
+ let expectedData = []
+ let title = ""
+ response.data.forEach((item) => {
+ expectedData.push(numFilter(item.value))
+ actualData.push(item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�")
+ title = item.indexName + "(" + (item.unitId || "") + ")"
+ })
+
+ console.log(response)
+ console.log(actualData)
+ console.log(expectedData)
+
+ lineChartData.value = {
+ // xData: [
+ // "0鏃�",
+ // "1鏃�",
+ // "2鏃�",
+ // "3鏃�",
+ // "4鏃�",
+ // "5鏃�",
+ // "6鏃�",
+ // "7鏃�",
+ // "8鏃�",
+ // "9鏃�",
+ // "10鏃�",
+ // "11鏃�",
+ // "12鏃�",
+ // "13鏃�",
+ // "14鏃�",
+ // "15鏃�",
+ // "16鏃�",
+ // "17鏃�",
+ // "18鏃�",
+ // "19鏃�",
+ // "20鏃�",
+ // "21鏃�",
+ // "22鏃�",
+ // "23鏃�",
+ // ],
+ xData: actualData,
+ yData: expectedData,
+ title,
+ }
+ // LineChartRef.value.initChart()
+ // this.lineChartData.actualData = actualData;
+ // this.lineChartData.expectedData = expectedData;
+ // this.lineChartData.title = title;
+ // this.$refs.LineChart.initChart(this.lineChartData);
+ // this.$refs.BarChart.initChart(this.lineChartData);
+ })
+}
+
+function getTime() {
+ var date = new Date()
+ var year = date.getFullYear()
+ var month = date.getMonth() + 1
+ var date = date.getDate()
+ month = month < 10 ? "0" + month : month
+ date = date < 10 ? "0" + date : date
+ queryParams.value.dataTime = year + ""
+}
+
+// 瀵煎嚭鎸夐挳鎿嶄綔
+function handleExport() {
+ exportList(queryParams.value).then((response) => {
+ console.log(response)
+ // download(response.msg);
+ })
+}
+
+function handleQuery() {
+ queryParams.value.pageNum = 1
+ getList()
+}
+
+function resetQuery() {
+ queryParams.value = {
+ limitName: "",
+ pageNum: 1,
+ pageSize: 10,
+ dataTime: null,
+ timeType: "MONTH",
+ }
+ getTime()
+ getList()
+}
+
+getTime()
+</script>
+
+<style lang="scss" scoped>
+@import "@/assets/styles/page.scss";
+
+.header-box {
+ :deep .el-form-item__content {
+ color: #fff;
+ font-size: 16px;
+ }
+}
+
+:deep .el-table--fit {
+ border-bottom: 1px solid #eaeaea;
+}
+</style>
diff --git a/zhitan-vue/src/views/deepanalysis/deepAnalysis.vue b/zhitan-vue/src/views/deepanalysis/deepAnalysis.vue
index 11e5ea0..c4b13c4 100644
--- a/zhitan-vue/src/views/deepanalysis/deepAnalysis.vue
+++ b/zhitan-vue/src/views/deepanalysis/deepAnalysis.vue
@@ -4,19 +4,28 @@
<el-form :model="form" ref="queryRef" :inline="true" label-width="80px">
<el-form-item label="鑳芥簮绫诲瀷" prop="energyType">
<el-select v-model="form.energyType" placeholder="璇烽�夋嫨鑳芥簮绫诲瀷">
- <el-option :label="item.enername" :value="item.enersno" v-for="item in energyTypeList"
- :key="item.enersno" />
+ <el-option
+ :label="item.enername"
+ :value="item.enersno"
+ v-for="item in energyTypeList"
+ :key="item.enersno"
+ />
</el-select>
</el-form-item>
- <el-form-item label="鏈熼棿" prop="timeType" >
+ <el-form-item label="鏈熼棿" prop="timeType">
<el-select v-model="form.timeType" placeholder="鏈熼棿" clearable style="width: 120px" @change="handleTimeType">
<el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item label="鏃堕棿閫夋嫨" prop="dataTime">
- <el-date-picker v-if="form.type == 1" v-model="form.dataTime" type="year" />
- <el-date-picker v-else-if="form.type == 2" v-model="form.dataTime" type="month" format="YYYY-MM"
- value-format="YYYY-MM" />
+ <el-date-picker v-if="form.timeType == 'YEAR'" v-model="form.dataTime" type="year" />
+ <el-date-picker
+ v-else-if="form.timeType == 'MONTH'"
+ v-model="form.dataTime"
+ type="month"
+ format="YYYY-MM"
+ value-format="YYYY-MM"
+ />
<el-date-picker v-else v-model="form.dataTime" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
</el-form-item>
<el-form-item>
@@ -46,178 +55,245 @@
</div>
</template>
<script setup>
-import useSettingsStore from '@/store/modules/settings'
-import { listEnergyTypeList } from "@/api/modelConfiguration/energyType";
+import useSettingsStore from "@/store/modules/settings"
+import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"
+import { getFlowCharts } from "@/api/energyAnalysis/energyAnalysis"
const settingsStore = useSettingsStore()
-import * as echarts from 'echarts';
+import * as echarts from "echarts"
let { proxy } = getCurrentInstance()
-import { onMounted } from 'vue';
-const { period } = proxy.useDict("period");
+import { nextTick, onMounted } from "vue"
+const { period } = proxy.useDict("period")
+console.log(period)
let form = ref({
energyType: null,
timeType: null,
dataTime: null,
})
function handleTimeType(e) {
- form.value.timeType = e;
- form.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD");
+ form.value.timeType = e
+ form.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")
+ getData()
}
-const energyTypeList = ref();
+const energyTypeList = ref()
function getEnergyTypeList() {
listEnergyTypeList().then((res) => {
- energyTypeList.value = res.data;
+ energyTypeList.value = res.data
form.value.energyType = energyTypeList.value[0].enersno
- handleTimeType(period.value[0].value);
- });
+ handleTimeType(period.value[0].value)
+ })
}
-getEnergyTypeList()
function handleSelect(e) {
console.log(e, form.value.type)
if (form.value.type == 1) {
- form.value.time = proxy.dayjs().format('YYYY')
+ form.value.time = proxy.dayjs().format("YYYY")
} else if (form.value.type == 2) {
- form.value.time = proxy.dayjs().format('YYYY-MM')
+ form.value.time = proxy.dayjs().format("YYYY-MM")
} else {
- form.value.time = proxy.dayjs().format('YYYY-MM-DD')
+ form.value.time = proxy.dayjs().format("YYYY-MM-DD")
}
}
-function handleQuery() { }
+function handleQuery() {
+ getData()
+}
function resetQuery() {
form.value = {
type: 1,
- time: proxy.dayjs().format('YYYY'),
+ time: proxy.dayjs().format("YYYY"),
}
}
-import icon1 from '@/assets/images/period/icon1.png'
-import icon2 from '@/assets/images/period/icon2.png'
-import icon3 from '@/assets/images/period/icon3.png'
-import icon4 from '@/assets/images/period/icon4.png'
-import icon5 from '@/assets/images/period/icon5.png'
+import icon1 from "@/assets/images/period/icon1.png"
+import icon2 from "@/assets/images/period/icon2.png"
+import icon3 from "@/assets/images/period/icon3.png"
+import icon4 from "@/assets/images/period/icon4.png"
+import icon5 from "@/assets/images/period/icon5.png"
const periodList = ref([
{
icon: icon1,
color: "#3371eb",
title: "绱鑳借��",
- data: '1000.1 m鲁'
+ data: "1000.1 m鲁",
},
{
icon: icon3,
color: "#ff6200",
title: "鍒嗚〃鑳借��",
- data: ' 0 m鲁'
+ data: " 0 m鲁",
},
{
icon: icon4,
color: "#ffce0c",
title: "鎹熷け閲�",
- data: '1000.1 m鲁'
+ data: "1000.1 m鲁",
},
{
icon: icon5,
color: "#78e801",
title: "鎹熷け姣斾緥",
- data: '100.00%'
+ data: "100.00%",
},
])
-watch(() => settingsStore.sideTheme, (val) => {
- getChart()
-})
+const flowData = ref({})
+function getData() {
+ getFlowCharts({
+ energyType: form.value.energyType,
+ nodeId: "",
+ queryTime: form.value.dataTime,
+ timeType: form.value.timeType,
+ modelCode: proxy.$route.query.modelCode,
+ }).then((res) => {
+ periodList.value[0].data = res.data.totalAccumulatedAmount
+ periodList.value[1].data = res.data.childNodeAccumulatedAmount
+ periodList.value[2].data = res.data.difference
+ periodList.value[3].data = res.data.energyLossRatio + "%"
+ flowData.value = res.data.itemVOList
+ nextTick(() => {
+ getChart()
+ })
+ })
+}
+
+watch(
+ () => settingsStore.sideTheme,
+ (val) => {
+ getChart()
+ }
+)
function getChart() {
+ let colors = ["#FBB4AE", "#B3CDE3", "#CCEBC5", "#DECBE4", "#5470C6"]
+ let mydata = []
+ let mylinks = []
+ if (flowData.value.length) {
+ mylinks = flowData.value || []
+ let nodes = []
+ mylinks.forEach((element) => {
+ nodes.push(element.source)
+ nodes.push(element.target)
+ })
+ mydata = Array.from(new Set(nodes)).map((item) => {
+ return {
+ name: item,
+ }
+ })
+ }
+ console.log(mydata)
+ console.log(mylinks)
-
- let colors = ['#FBB4AE', '#B3CDE3', '#CCEBC5', '#DECBE4', '#5470C6'];
- let mydata = [
- { name: 'L1', itemStyle: { color: colors[0] }, depth: 0 },
- { name: 'L1-1', itemStyle: { color: colors[0] }, depth: 0 },
- { name: 'L1-2', itemStyle: { color: colors[0] }, depth: 0 },
- { name: 'L1-3', itemStyle: { color: colors[0] }, depth: 0 },
-
-
- { name: 'L2', itemStyle: { color: colors[1] }, depth: 1 },
- { name: 'L2-1', itemStyle: { color: colors[1] }, depth: 1 },
- { name: 'L2-2', itemStyle: { color: colors[1] }, depth: 1 },
- { name: 'L2-3', itemStyle: { color: colors[1] }, depth: 1 },
-
-
- { name: 'L3', itemStyle: { color: colors[2] }, depth: 2 },
- { name: 'L3-1', itemStyle: { color: colors[2] }, depth: 2 },
- { name: 'L3-2', itemStyle: { color: colors[2] }, depth: 2 },
-
-
- { name: 'L4', itemStyle: { color: colors[3] }, depth: 3 },
-
-
-
- ];
- // mydata.reverse()
- let mylinks = [
- // L1鈫扡4 9720
- { source: 'L1', target: 'L4', value: 9720 },
- // L2鈫扡4 24396
- { source: 'L2', target: 'L4', value: 24396 },
- // L3鈫扡4 1462
- { source: 'L3', target: 'L4', value: 1462 },
-
- // L1鈫扡2鈫扡3鈫扡4 215
- { source: 'L1-1', target: 'L2-1', value: 215 },
- { source: 'L2-1', target: 'L3-1', value: 215 },
- { source: 'L3-1', target: 'L4', value: 215 },
-
- // L1鈫扡2鈫扡4 4518
- { source: 'L1-2', target: 'L2-2', value: 4518 },
- { source: 'L2-2', target: 'L4', value: 4518 },
- // L1鈫扡3鈫扡4 217
- { source: 'L1-3', target: 'L3-2', value: 217 },
- { source: 'L3-2', target: 'L4', value: 217 },
-
- // L2鈫扡3鈫扡4 893
- { source: 'L2-3', target: 'L3-3', value: 893 },
- { source: 'L3-3', target: 'L4', value: 893 },
-
- ];
-
-
- const myChart1 = echarts.init(document.getElementById("Chart1"));
+ const myChart1 = echarts.init(document.getElementById("Chart1"))
myChart1.setOption({
tooltip: {
- trigger: 'item',
- triggerOn: 'mousemove',
+ trigger: "item",
+ triggerOn: "mousemove",
},
- series: {
- type: 'sankey',
- lineStyle: {
- opacity: 0.3,
- color: 'gradient',
- curveness: 0.7,
+ // series: {
+ // type: "sankey",
+ // lineStyle: {
+ // opacity: 0.3,
+ // color: "gradient",
+ // curveness: 0.7,
+ // },
+ // // nodeAlign: 'left',
+ // nodeGap: 18,
+ // layoutIterations: 1,
+ // emphasis: {
+ // focus: "adjacency",
+ // },
+ // data: mydata,
+ // links: mylinks,
+ // },
+ series: [
+ {
+ type: "sankey",
+ left: 50.0,
+ top: 20.0,
+ right: 100.0,
+ bottom: 25.0,
+ data: mydata,
+ links: mylinks,
+ nodeGap: 18,
+ layoutIterations: 1,
+ //emphasis: {
+ // focus: 'adjacency',
+ //},
+ nodeAlign: "left",
+ lineStyle: {
+ color: "source",
+ curveness: 0.7,
+ opacity: 0.3,
+ },
+ itemStyle: {
+ color: "#333",
+ borderColor: "#1f77b4",
+ },
+ // label: {
+ // color: "rgba(0,0,0,0.7)",
+ // fontSize: 10,
+ // },
+ levels: [
+ {
+ depth: 0,
+ itemStyle: {
+ color: colors[0],
+ },
+ lineStyle: {
+ color: "source",
+ opacity: 0.3,
+ },
+ },
+ {
+ depth: 1,
+ itemStyle: {
+ color: colors[1],
+ },
+ lineStyle: {
+ color: "source",
+ opacity: 0.3,
+ },
+ },
+ {
+ depth: 2,
+ itemStyle: {
+ color: colors[2],
+ },
+ lineStyle: {
+ color: "source",
+ opacity: 0.3,
+ },
+ },
+ {
+ depth: 3,
+ itemStyle: {
+ color: colors[3],
+ },
+ lineStyle: {
+ color: "source",
+ opacity: 0.3,
+ },
+ },
+ ],
},
- // nodeAlign: 'left',
- nodeGap: 18,
- layoutIterations: 1,
- emphasis: {
- focus: 'adjacency',
- },
- data: mydata,
- links: mylinks,
- },
+ ],
})
- window.addEventListener("resize", () => {
- myChart1.resize();
- }, { passive: true });
+ window.addEventListener(
+ "resize",
+ () => {
+ myChart1.resize()
+ },
+ { passive: true }
+ )
}
onMounted(() => {
- getChart()
+ getEnergyTypeList()
})
</script>
<style scoped lang="scss">
@import "@/assets/styles/page.scss";
.themeDark {
-
.card-list {
display: flex;
justify-content: space-between;
@@ -295,7 +371,7 @@
height: 167px;
background: #fff;
border-radius: 5px 5px 5px 5px;
- border: 1px solid #E8E8E8;
+ border: 1px solid #e8e8e8;
background-size: 100% 100%;
box-sizing: border-box;
padding: 20px 18px 23px 16px;
@@ -337,7 +413,7 @@
font-family: OPPOSans, OPPOSans;
font-weight: 500;
font-size: 14px;
- color: #5D5C5C;
+ color: #5d5c5c;
}
.bottom-right {
@@ -360,4 +436,4 @@
height: 100%;
}
}
-</style>
\ No newline at end of file
+</style>
diff --git a/zhitan-vue/src/views/index.vue b/zhitan-vue/src/views/index.vue
index 2474cd7..168b68f 100644
--- a/zhitan-vue/src/views/index.vue
+++ b/zhitan-vue/src/views/index.vue
@@ -20,10 +20,11 @@
<div class="top-right">
<div class="right-name">
{{ item.energyName }}
+ <span v-if="item.energyUnit" class="unit">({{ item.energyUnit }})</span>
</div>
<div class="right-value">
<span> {{ item.count }}</span>
- <span class="unit">{{ item.energyUnit }}</span>
+ <!-- <span class="unit">{{ item.energyUnit }}</span> -->
</div>
</div>
</div>
@@ -889,18 +890,23 @@
display: flex;
.top-icon {
- width: 69px;
- height: 69px;
+ width: 50px;
+ height: 50px;
background-size: 100% 100%;
}
.top-right {
- margin-left: 16px;
+ margin-left: 12px;
.right-name {
font-weight: bold;
font-size: 16px;
font-family: OPPOSans-Bold;
+ .unit {
+ margin-left: 2px;
+ font-size: 16px;
+ font-weight: normal;
+ }
}
.right-value {
diff --git a/zhitan-vue/src/views/peakvalley/period/period.vue b/zhitan-vue/src/views/peakvalley/period/period.vue
index c550828..749fa2e 100644
--- a/zhitan-vue/src/views/peakvalley/period/period.vue
+++ b/zhitan-vue/src/views/peakvalley/period/period.vue
@@ -6,11 +6,7 @@
</div>
<div class="page-container-right">
<div class="form-card">
- <el-form
- :model="queryParams"
- ref="queryRef"
- :inline="true"
- >
+ <el-form :model="queryParams" ref="queryRef" :inline="true">
<el-form-item label="鏃堕棿" prop="queryTime">
<el-date-picker
v-model="queryParams.queryTime"
@@ -22,39 +18,22 @@
/>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">
- 鎼滅储
- </el-button>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
<el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
</el-form-item>
</el-form>
</div>
<div
- style="
- height: calc(100vh - 205px) !important;
- max-height: calc(100vh - 205px) !important;
- overflow-y: auto;
- "
+ style="height: calc(100vh - 205px) !important; max-height: calc(100vh - 205px) !important; overflow-y: auto"
v-loading="loading"
>
<div class="card-list">
- <div
- class="card-list-item"
- v-for="item in periodList"
- :key="item.title"
- >
+ <div class="card-list-item" v-for="item in periodList" :key="item.title">
<div class="item-top">
- <div
- class="icon"
- :style="{ backgroundImage: 'url(' + item.icon + ')' }"
- ></div>
+ <div class="icon" :style="{ backgroundImage: 'url(' + item.icon + ')' }"></div>
<div class="name">{{ item.title }}</div>
</div>
- <div
- class="item-bottom"
- v-for="(node, nodeIndex) in item.data"
- :key="nodeIndex"
- >
+ <div class="item-bottom" v-for="(node, nodeIndex) in item.data" :key="nodeIndex">
<div class="bottom-left">{{ node.label }}</div>
<div class="bottom-right" :style="{ color: item.color }">
{{ node.value }}
@@ -62,12 +41,12 @@
</div>
</div>
</div>
- <BaseCard :title="queryParams.nodeName+'-灏栧嘲骞宠胺鐢甸噺鍥�'">
+ <BaseCard :title="queryParams.nodeName + '-灏栧嘲骞宠胺鐢甸噺鍥�'">
<div class="chart-box">
<div id="Chart1" />
</div>
</BaseCard>
- <BaseCard :title="queryParams.nodeName+'-灏栧嘲骞宠胺鐢佃垂鍥�'">
+ <BaseCard :title="queryParams.nodeName + '-灏栧嘲骞宠胺鐢佃垂鍥�'">
<div class="chart-box">
<div id="Chart2" />
</div>
@@ -78,24 +57,24 @@
</div>
</template>
<script setup name="period">
-import { listPeriod } from "@/api/peakValley/period";
-import * as echarts from "echarts";
-const { proxy } = getCurrentInstance();
-import { useRoute } from "vue-router";
-import useSettingsStore from "@/store/modules/settings";
-const settingsStore = useSettingsStore();
+import { listPeriod } from "@/api/peakValley/period"
+import * as echarts from "echarts"
+const { proxy } = getCurrentInstance()
+import { useRoute } from "vue-router"
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
watch(
() => settingsStore.sideTheme,
(val) => {
- getList();
+ getList()
}
-);
-const loading = ref(false);
-import icon1 from "@/assets/images/period/icon1.png";
-import icon2 from "@/assets/images/period/icon2.png";
-import icon3 from "@/assets/images/period/icon3.png";
-import icon4 from "@/assets/images/period/icon4.png";
-import icon5 from "@/assets/images/period/icon5.png";
+)
+const loading = ref(false)
+import icon1 from "@/assets/images/period/icon1.png"
+import icon2 from "@/assets/images/period/icon2.png"
+import icon3 from "@/assets/images/period/icon3.png"
+import icon4 from "@/assets/images/period/icon4.png"
+import icon5 from "@/assets/images/period/icon5.png"
const periodList = ref([
{
icon: icon1,
@@ -204,7 +183,7 @@
},
],
},
-]);
+])
const data = reactive({
queryParams: {
nodeId: null,
@@ -213,121 +192,90 @@
queryTime: null,
},
query: { ...useRoute().query },
-});
-const { queryParams, query } = toRefs(data);
+})
+const { queryParams, query } = toRefs(data)
/** 鑺傜偣鍗曞嚮浜嬩欢 */
function handleNodeClick(data) {
- queryParams.value.nodeId = data.id;
- queryParams.value.nodeName = data.label;
- queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM");
- handleQuery();
+ queryParams.value.nodeId = data.id
+ queryParams.value.nodeName = data.label
+ queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM")
+ handleQuery()
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋锋椂娈电粺璁�-鍒楄〃
function getList() {
- loading.value = true;
+ loading.value = true
listPeriod(
proxy.addDateRange({
...queryParams.value,
...query.value,
})
).then((res) => {
- loading.value = false;
+ loading.value = false
if (!!res.code && res.code == 200) {
if (!!res.data.totalVO) {
- periodList.value[0].data[0].value = !!res.data.totalVO
- .totalPowerConsumption
+ periodList.value[0].data[0].value = !!res.data.totalVO.totalPowerConsumption
? res.data.totalVO.totalPowerConsumption
- : 0;
- periodList.value[0].data[1].value = !!res.data.totalVO.totalCost
- ? res.data.totalVO.totalCost
- : 0;
+ : 0
+ periodList.value[0].data[1].value = !!res.data.totalVO.totalCost ? res.data.totalVO.totalCost : 0
- periodList.value[1].data[0].value = !!res.data.totalVO
- .tipPowerConsumption
+ periodList.value[1].data[0].value = !!res.data.totalVO.tipPowerConsumption
? res.data.totalVO.tipPowerConsumption
- : 0;
+ : 0
periodList.value[1].data[1].value =
- (!!res.data.totalVO.tipPowerProportion
- ? res.data.totalVO.tipPowerProportion
- : 0) + "%";
- periodList.value[1].data[2].value = !!res.data.totalVO.tipPowerCost
- ? res.data.totalVO.tipPowerCost
- : 0;
+ (!!res.data.totalVO.tipPowerProportion ? res.data.totalVO.tipPowerProportion : 0) + "%"
+ periodList.value[1].data[2].value = !!res.data.totalVO.tipPowerCost ? res.data.totalVO.tipPowerCost : 0
periodList.value[1].data[3].value =
- (!!res.data.totalVO.tipPowerCostProportion
- ? res.data.totalVO.tipPowerCostProportion
- : 0) + "%";
+ (!!res.data.totalVO.tipPowerCostProportion ? res.data.totalVO.tipPowerCostProportion : 0) + "%"
- periodList.value[2].data[0].value = !!res.data.totalVO
- .peakPowerConsumption
+ periodList.value[2].data[0].value = !!res.data.totalVO.peakPowerConsumption
? res.data.totalVO.peakPowerConsumption
- : 0;
+ : 0
periodList.value[2].data[1].value =
- (!!res.data.totalVO.peakPowerProportion
- ? res.data.totalVO.peakPowerProportion
- : 0) + "%";
- periodList.value[2].data[2].value = !!res.data.totalVO.peakPowerCost
- ? res.data.totalVO.peakPowerCost
- : 0;
+ (!!res.data.totalVO.peakPowerProportion ? res.data.totalVO.peakPowerProportion : 0) + "%"
+ periodList.value[2].data[2].value = !!res.data.totalVO.peakPowerCost ? res.data.totalVO.peakPowerCost : 0
periodList.value[2].data[3].value =
- (!!res.data.totalVO.peakPowerCostProportion
- ? res.data.totalVO.peakPowerCostProportion
- : 0) + "%";
+ (!!res.data.totalVO.peakPowerCostProportion ? res.data.totalVO.peakPowerCostProportion : 0) + "%"
- periodList.value[3].data[0].value = !!res.data.totalVO
- .flatPowerConsumption
+ periodList.value[3].data[0].value = !!res.data.totalVO.flatPowerConsumption
? res.data.totalVO.flatPowerConsumption
- : 0;
+ : 0
periodList.value[3].data[1].value =
- (!!res.data.totalVO.flatPowerProportion
- ? res.data.totalVO.flatPowerProportion
- : 0) + "%";
- periodList.value[3].data[2].value = !!res.data.totalVO.flatPowerCost
- ? res.data.totalVO.flatPowerCost
- : 0;
+ (!!res.data.totalVO.flatPowerProportion ? res.data.totalVO.flatPowerProportion : 0) + "%"
+ periodList.value[3].data[2].value = !!res.data.totalVO.flatPowerCost ? res.data.totalVO.flatPowerCost : 0
periodList.value[3].data[3].value =
- (!!res.data.totalVO.flatPowerCostProportion
- ? res.data.totalVO.flatPowerCostProportion
- : 0) + "%";
+ (!!res.data.totalVO.flatPowerCostProportion ? res.data.totalVO.flatPowerCostProportion : 0) + "%"
- periodList.value[4].data[0].value = !!res.data.totalVO
- .troughPowerConsumption
+ periodList.value[4].data[0].value = !!res.data.totalVO.troughPowerConsumption
? res.data.totalVO.troughPowerConsumption
- : 0;
+ : 0
periodList.value[4].data[1].value =
- (!!res.data.totalVO.troughPowerProportion
- ? res.data.totalVO.troughPowerProportion
- : 0) + "%";
- periodList.value[4].data[2].value = !!res.data.totalVO.troughPowerCost
- ? res.data.totalVO.troughPowerCost
- : 0;
+ (!!res.data.totalVO.troughPowerProportion ? res.data.totalVO.troughPowerProportion : 0) + "%"
+ periodList.value[4].data[2].value = !!res.data.totalVO.troughPowerCost ? res.data.totalVO.troughPowerCost : 0
periodList.value[4].data[3].value =
- (!!res.data.totalVO.troughPowerCostProportion
- ? res.data.totalVO.troughPowerCostProportion
- : 0) + "%";
+ (!!res.data.totalVO.troughPowerCostProportion ? res.data.totalVO.troughPowerCostProportion : 0) + "%"
}
// 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥
if (echarts.getInstanceByDom(document.getElementById("Chart1"))) {
- echarts.dispose(document.getElementById("Chart1"));
+ echarts.dispose(document.getElementById("Chart1"))
}
if (echarts.getInstanceByDom(document.getElementById("Chart2"))) {
- echarts.dispose(document.getElementById("Chart2"));
+ echarts.dispose(document.getElementById("Chart2"))
}
- const myChart1 = echarts.init(document.getElementById("Chart1"));
- const myChart2 = echarts.init(document.getElementById("Chart2"));
+ const myChart1 = echarts.init(document.getElementById("Chart1"))
+ const myChart2 = echarts.init(document.getElementById("Chart2"))
if (!!res.data.powerConsumptionList) {
- let xdata = [];
- let ytip = [];
- let ypeak = [];
- let yflat = [];
- let ytrough = [];
+ let xdata = []
+ let ytip = []
+ let ypeak = []
+ let yflat = []
+ let ytrough = []
res.data.powerConsumptionList.map((item) => {
- xdata.push(Number(item.xdata.slice(-2)) + "鏃�");
- ytip.push(!!item.ytip ? item.ytip : 0);
- ypeak.push(!!item.ypeak ? item.ypeak : 0);
- yflat.push(!!item.yflat ? item.yflat : 0);
- ytrough.push(!!item.ytrough ? item.ytrough : 0);
- });
+ xdata.push(Number(item.xdata.slice(-2)) + "鏃�")
+ ytip.push(!!item.ytip ? item.ytip : 0)
+ ypeak.push(!!item.ypeak ? item.ypeak : 0)
+ yflat.push(!!item.yflat ? item.yflat : 0)
+ ytrough.push(!!item.ytrough ? item.ytrough : 0)
+ })
myChart1.setOption({
color: ["#f52528", "#ff6200", "#ffce0c", "#78e801"],
tooltip: {
@@ -336,10 +284,7 @@
type: "shadow",
textStyle: {
fontSize: 14,
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
},
@@ -356,8 +301,7 @@
itemHeight: 10,
// right: 0,
textStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
xAxis: {
@@ -365,10 +309,7 @@
axisLine: {
show: true,
lineStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -381,8 +322,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [5, 0, 0, 0],
// formatter: '{value} ml'
@@ -393,8 +333,7 @@
name: "鑰楃數閲�(KWH)",
type: "value",
nameTextStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [0, 0, 5, 0],
},
@@ -405,10 +344,7 @@
show: true,
lineStyle: {
type: "dashed",
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -418,8 +354,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
// formatter: '{value} ml'
},
@@ -429,46 +364,46 @@
name: "灏�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: ytip,
},
{
name: "宄�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: ypeak,
},
{
name: "骞�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: yflat,
},
{
name: "璋�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: ytrough,
},
],
- });
+ })
}
if (!!res.data.costList) {
- let xdata = [];
- let ytip = [];
- let ypeak = [];
- let yflat = [];
- let ytrough = [];
+ let xdata = []
+ let ytip = []
+ let ypeak = []
+ let yflat = []
+ let ytrough = []
res.data.costList.map((item) => {
- xdata.push(Number(item.xdata.slice(-2)) + "鏃�");
- ytip.push(!!item.ytip ? item.ytip : 0);
- ypeak.push(!!item.ypeak ? item.ypeak : 0);
- yflat.push(!!item.yflat ? item.yflat : 0);
- ytrough.push(!!item.ytrough ? item.ytrough : 0);
- });
+ xdata.push(Number(item.xdata.slice(-2)) + "鏃�")
+ ytip.push(!!item.ytip ? item.ytip : 0)
+ ypeak.push(!!item.ypeak ? item.ypeak : 0)
+ yflat.push(!!item.yflat ? item.yflat : 0)
+ ytrough.push(!!item.ytrough ? item.ytrough : 0)
+ })
myChart2.setOption({
color: ["#f52528", "#ff6200", "#ffce0c", "#78e801"],
tooltip: {
@@ -477,10 +412,7 @@
type: "shadow",
textStyle: {
fontSize: 14,
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
},
@@ -497,8 +429,7 @@
itemHeight: 10,
// right: 0,
textStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
xAxis: {
@@ -506,10 +437,7 @@
axisLine: {
show: true,
lineStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -522,8 +450,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [5, 0, 0, 0],
// formatter: '{value} ml'
@@ -534,8 +461,7 @@
name: "鐢佃垂(鍏�)",
type: "value",
nameTextStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [0, 0, 5, 0],
},
@@ -546,10 +472,7 @@
show: true,
lineStyle: {
type: "dashed",
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -559,8 +482,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
// formatter: '{value} ml'
},
@@ -570,49 +492,53 @@
name: "灏�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: ytip,
},
{
name: "宄�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: ypeak,
},
{
name: "骞�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: yflat,
},
{
name: "璋�",
type: "bar",
stack: "total",
- barWidth: "27",
+ barWidth: "12",
data: ytrough,
},
],
- });
+ })
}
- window.addEventListener("resize", () => {
- myChart1.resize();
- myChart2.resize();
- },{passive: true});
+ window.addEventListener(
+ "resize",
+ () => {
+ myChart1.resize()
+ myChart2.resize()
+ },
+ { passive: true }
+ )
}
- });
+ })
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋锋椂娈电粺璁�-鎼滅储
function handleQuery() {
- getList();
+ getList()
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋锋椂娈电粺璁�-閲嶇疆
function resetQuery() {
- proxy.resetForm("queryRef");
- queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM");
- handleQuery();
+ proxy.resetForm("queryRef")
+ queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM")
+ handleQuery()
}
</script>
<style scoped lang="scss">
diff --git a/zhitan-vue/src/views/peakvalley/timeSharing/timeSharing.vue b/zhitan-vue/src/views/peakvalley/timeSharing/timeSharing.vue
index 7acba9e..091d88f 100644
--- a/zhitan-vue/src/views/peakvalley/timeSharing/timeSharing.vue
+++ b/zhitan-vue/src/views/peakvalley/timeSharing/timeSharing.vue
@@ -17,24 +17,16 @@
/>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">
- 鎼滅储
- </el-button>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
<el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Download" @click="handleExport">
- 瀵煎嚭
- </el-button>
+ <el-button type="primary" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
</el-form-item>
</el-form>
</div>
<div
- style="
- height: calc(100vh - 205px) !important;
- max-height: calc(100vh - 205px) !important;
- overflow-y: auto;
- "
+ style="height: calc(100vh - 205px) !important; max-height: calc(100vh - 205px) !important; overflow-y: auto"
v-loading="loading"
>
<el-row>
@@ -55,16 +47,8 @@
<el-col :span="24">
<BaseCard :title="queryParams.nodeName + '-宄板钩璋峰垎鏃剁粺璁�'">
<div class="table-box">
- <el-table
- :data="timeSharingList"
- style="width: 100%"
- show-summary
- >
- <el-table-column
- label="鏃堕棿"
- align="center"
- show-overflow-tooltip
- >
+ <el-table :data="timeSharingList" style="width: 100%" show-summary>
+ <el-table-column label="鏃堕棿" align="center" show-overflow-tooltip>
<template #default="scope">
{{ proxy.dayjs(scope.row.time).format("HH鏃�") }}
</template>
@@ -77,12 +61,7 @@
show-overflow-tooltip
width="120"
/>
- <el-table-column
- prop="sharpFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- />
+ <el-table-column prop="sharpFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip />
</el-table-column>
<el-table-column label="宄�" align="center">
<el-table-column
@@ -92,12 +71,7 @@
show-overflow-tooltip
width="120"
/>
- <el-table-column
- prop="peakFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- />
+ <el-table-column prop="peakFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip />
</el-table-column>
<el-table-column label="骞�" align="center">
<el-table-column
@@ -107,12 +81,7 @@
show-overflow-tooltip
width="120"
/>
- <el-table-column
- prop="flatFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- />
+ <el-table-column prop="flatFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip />
</el-table-column>
<el-table-column label="璋�" align="center">
<el-table-column
@@ -122,12 +91,7 @@
show-overflow-tooltip
width="120"
/>
- <el-table-column
- prop="valleyFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- />
+ <el-table-column prop="valleyFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip />
</el-table-column>
<el-table-column label="鍚堣" align="center">
<el-table-column
@@ -137,12 +101,7 @@
show-overflow-tooltip
width="120"
/>
- <el-table-column
- prop="totalFee"
- label="鎬荤數璐�(鍏�)"
- align="center"
- show-overflow-tooltip
- />
+ <el-table-column prop="totalFee" label="鎬荤數璐�(鍏�)" align="center" show-overflow-tooltip />
</el-table-column>
<!-- <el-table-column label="鎿嶄綔" align="center">
<template #default="scope">
@@ -159,84 +118,27 @@
</div>
</div>
</div>
- <el-dialog
- v-model="timeSharingDialogTableVisible"
- title="鏌ョ湅鍒嗘椂缁熻璇︽儏"
- width="1300"
- >
+ <el-dialog v-model="timeSharingDialogTableVisible" title="鏌ョ湅鍒嗘椂缁熻璇︽儏" width="1300">
<div class="table-box">
<el-table :data="viewTimeSharingList" style="width: 100%" height="420">
- <el-table-column
- label="鏃堕棿"
- align="center"
- show-overflow-tooltip
- width="200"
- >
+ <el-table-column label="鏃堕棿" align="center" show-overflow-tooltip width="200">
<template #default="scope"> {{ scope.row.time }}鏃� </template>
</el-table-column>
<el-table-column label="灏�" align="center">
- <el-table-column
- prop="sharpPower"
- label="鑰楃數閲�(kWh)"
- align="center"
- show-overflow-tooltip
- width="120"
- />
- <el-table-column
- prop="sharpFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- width="90"
- />
+ <el-table-column prop="sharpPower" label="鑰楃數閲�(kWh)" align="center" show-overflow-tooltip width="120" />
+ <el-table-column prop="sharpFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip width="90" />
</el-table-column>
<el-table-column label="宄�" align="center">
- <el-table-column
- prop="peakPower"
- label="鑰楃數閲�(kWh)"
- align="center"
- show-overflow-tooltip
- width="120"
- />
- <el-table-column
- prop="peakFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- width="90"
- />
+ <el-table-column prop="peakPower" label="鑰楃數閲�(kWh)" align="center" show-overflow-tooltip width="120" />
+ <el-table-column prop="peakFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip width="90" />
</el-table-column>
<el-table-column label="骞�" align="center">
- <el-table-column
- prop="flatPower"
- label="鑰楃數閲�(kWh)"
- align="center"
- show-overflow-tooltip
- width="120"
- />
- <el-table-column
- prop="flatFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- width="90"
- />
+ <el-table-column prop="flatPower" label="鑰楃數閲�(kWh)" align="center" show-overflow-tooltip width="120" />
+ <el-table-column prop="flatFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip width="90" />
</el-table-column>
<el-table-column label="璋�" align="center">
- <el-table-column
- prop="valleyPower"
- label="鑰楃數閲�(kWh)"
- align="center"
- show-overflow-tooltip
- width="120"
- />
- <el-table-column
- prop="valleyFee"
- label="鐢佃垂(鍏�)"
- align="center"
- show-overflow-tooltip
- width="90"
- />
+ <el-table-column prop="valleyPower" label="鑰楃數閲�(kWh)" align="center" show-overflow-tooltip width="120" />
+ <el-table-column prop="valleyFee" label="鐢佃垂(鍏�)" align="center" show-overflow-tooltip width="90" />
</el-table-column>
<el-table-column label="鍚堣" align="center">
<el-table-column
@@ -247,38 +149,16 @@
width="120"
>
<template #default="scope">
- {{
- scope.row.sharpPower +
- scope.row.peakPower +
- scope.row.flatPower +
- scope.row.valleyPower
- }}
+ {{ scope.row.sharpPower + scope.row.peakPower + scope.row.flatPower + scope.row.valleyPower }}
</template>
</el-table-column>
- <el-table-column
- prop="totalCost"
- label="鎬荤數璐�(鍏�)"
- align="center"
- show-overflow-tooltip
- width="100"
- >
+ <el-table-column prop="totalCost" label="鎬荤數璐�(鍏�)" align="center" show-overflow-tooltip width="100">
<template #default="scope">
- {{
- scope.row.sharpFee +
- scope.row.peakFee +
- scope.row.flatFee +
- scope.row.valleyFee
- }}
+ {{ scope.row.sharpFee + scope.row.peakFee + scope.row.flatFee + scope.row.valleyFee }}
</template>
</el-table-column>
</el-table-column>
- <el-table-column
- prop="nodeName"
- label="鐢ㄨ兘鍗曞厓"
- align="center"
- show-overflow-tooltip
- width="200"
- />
+ <el-table-column prop="nodeName" label="鐢ㄨ兘鍗曞厓" align="center" show-overflow-tooltip width="200" />
</el-table>
</div>
</el-dialog>
@@ -286,23 +166,23 @@
</template>
<script setup name="timeSharing">
-import { listTimeSharing } from "@/api/peakValley/timeSharing";
-import * as echarts from "echarts";
-const { proxy } = getCurrentInstance();
-import { useRoute } from "vue-router";
-import useSettingsStore from "@/store/modules/settings";
-const settingsStore = useSettingsStore();
+import { listTimeSharing } from "@/api/peakValley/timeSharing"
+import * as echarts from "echarts"
+const { proxy } = getCurrentInstance()
+import { useRoute } from "vue-router"
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
watch(
() => settingsStore.sideTheme,
(val) => {
- getList();
+ getList()
}
-);
-const loading = ref(false);
-const timeSharingList = ref([]);
-const timeSharingDialogTableVisible = ref(false);
-const viewTimeSharingList = ref([]);
-const nodeOptions = ref(undefined);
+)
+const loading = ref(false)
+const timeSharingList = ref([])
+const timeSharingDialogTableVisible = ref(false)
+const viewTimeSharingList = ref([])
+const nodeOptions = ref(undefined)
const data = reactive({
queryParams: {
nodeId: null,
@@ -311,52 +191,52 @@
queryTime: null,
},
query: { ...useRoute().query },
-});
-const { queryParams, query } = toRefs(data);
+})
+const { queryParams, query } = toRefs(data)
/** 閫氳繃鏉′欢杩囨护鑺傜偣 */
const filterNode = (value, data) => {
- if (!value) return true;
- return data.label.indexOf(value) !== -1;
-};
+ if (!value) return true
+ return data.label.indexOf(value) !== -1
+}
function handleNodeClick(data) {
- queryParams.value.nodeId = data.id;
- queryParams.value.nodeName = data.label;
- queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM-DD");
- handleQuery();
+ queryParams.value.nodeId = data.id
+ queryParams.value.nodeName = data.label
+ queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")
+ handleQuery()
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋峰垎鏃剁粺璁�-鍒楄〃
function getList() {
- loading.value = true;
+ loading.value = true
listTimeSharing(
proxy.addDateRange({
...queryParams.value,
...query.value,
})
).then((res) => {
- loading.value = false;
+ loading.value = false
if (!!res.code && res.code == 200) {
// 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥
if (echarts.getInstanceByDom(document.getElementById("Chart1"))) {
- echarts.dispose(document.getElementById("Chart1"));
+ echarts.dispose(document.getElementById("Chart1"))
}
if (echarts.getInstanceByDom(document.getElementById("Chart2"))) {
- echarts.dispose(document.getElementById("Chart2"));
+ echarts.dispose(document.getElementById("Chart2"))
}
- const myChart1 = echarts.init(document.getElementById("Chart1"));
- const myChart2 = echarts.init(document.getElementById("Chart2"));
+ const myChart1 = echarts.init(document.getElementById("Chart1"))
+ const myChart2 = echarts.init(document.getElementById("Chart2"))
if (!!res.data.lineChat) {
- let xdata = [];
- let ytip = [];
- let ypeak = [];
- let yflat = [];
- let ytrough = [];
+ let xdata = []
+ let ytip = []
+ let ypeak = []
+ let yflat = []
+ let ytrough = []
res.data.lineChat.map((item) => {
- xdata.push(Number(item.xdata.slice(-8).substring(0, 2)) + "鏃�");
- ytip.push(!!item.ytip ? item.ytip : 0);
- ypeak.push(!!item.ypeak ? item.ypeak : 0);
- yflat.push(!!item.yflat ? item.yflat : 0);
- ytrough.push(!!item.ytrough ? item.ytrough : 0);
- });
+ xdata.push(Number(item.xdata.slice(-8).substring(0, 2)) + "鏃�")
+ ytip.push(!!item.ytip ? item.ytip : 0)
+ ypeak.push(!!item.ypeak ? item.ypeak : 0)
+ yflat.push(!!item.yflat ? item.yflat : 0)
+ ytrough.push(!!item.ytrough ? item.ytrough : 0)
+ })
myChart1.setOption({
color: ["#f52528", "#ff6200", "#ffce0c", "#78e801"],
grid: {
@@ -378,8 +258,7 @@
itemHeight: 10,
// right: 0,
textStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
// data: ['灏�', '宄�', '骞�', '璋�']
},
@@ -388,10 +267,7 @@
axisLine: {
show: true,
lineStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -404,8 +280,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [5, 0, 0, 0],
// formatter: '{value} ml'
@@ -416,8 +291,7 @@
name: "鑰楃數閲�(KWH)",
type: "value",
nameTextStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
padding: [0, 0, 5, 0],
},
@@ -428,10 +302,7 @@
show: true,
lineStyle: {
type: "dashed",
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
axisTick: {
@@ -441,8 +312,7 @@
show: false,
},
axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
fontSize: 14,
// formatter: '{value} ml'
},
@@ -451,33 +321,33 @@
{
name: "灏�", // ytip
type: "bar",
- barWidth: "27",
+ barWidth: "12",
stack: "total",
data: ytip,
},
{
name: "宄�", // ypeak
type: "bar",
- barWidth: "27",
+ barWidth: "12",
stack: "total",
data: ypeak,
},
{
name: "骞�", // yflat
type: "bar",
- barWidth: "27",
+ barWidth: "12",
stack: "total",
data: yflat,
},
{
name: "璋�", // ytrough
type: "bar",
- barWidth: "27",
+ barWidth: "12",
stack: "total",
data: ytrough,
},
],
- });
+ })
}
if (!!res.data.pieChat) {
myChart2.setOption({
@@ -492,8 +362,7 @@
itemGap: 10,
// right: 0,
textStyle: {
- color:
- settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
},
series: [
@@ -505,70 +374,58 @@
label: {
overflow: "none",
formatter: "{b} {c}% ",
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
},
data: [
{
- value: !!res.data.pieChat.tip
- ? Number(res.data.pieChat.tip)
- : 0,
+ value: !!res.data.pieChat.tip ? Number(res.data.pieChat.tip) : 0,
name: "灏�",
},
{
- value: !!res.data.pieChat.peak
- ? Number(res.data.pieChat.peak)
- : 0,
+ value: !!res.data.pieChat.peak ? Number(res.data.pieChat.peak) : 0,
name: "宄�",
},
{
- value: !!res.data.pieChat.flat
- ? Number(res.data.pieChat.flat)
- : 0,
+ value: !!res.data.pieChat.flat ? Number(res.data.pieChat.flat) : 0,
name: "骞�",
},
{
- value: !!res.data.pieChat.trough
- ? Number(res.data.pieChat.trough)
- : 0,
+ value: !!res.data.pieChat.trough ? Number(res.data.pieChat.trough) : 0,
name: "璋�",
},
],
},
],
- });
+ })
}
if (!!res.data.dataList) {
- timeSharingList.value = !!res.data.dataList ? res.data.dataList : [];
+ timeSharingList.value = !!res.data.dataList ? res.data.dataList : []
}
window.addEventListener(
"resize",
() => {
- myChart1.resize();
- myChart2.resize();
+ myChart1.resize()
+ myChart2.resize()
},
{ passive: true }
- );
+ )
}
- });
+ })
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋峰垎鏃剁粺璁�-鏌ョ湅
function handleView(row) {
- queryParams.value.key = row.timeStr;
- timeSharingDialogTableVisible.value = true;
- viewTimeSharingList.value = [row];
+ queryParams.value.key = row.timeStr
+ timeSharingDialogTableVisible.value = true
+ viewTimeSharingList.value = [row]
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋峰垎鏃剁粺璁�-鎼滅储
function handleQuery() {
- getList();
+ getList()
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋峰垎鏃剁粺璁�-閲嶇疆
function resetQuery() {
- proxy.resetForm("queryRef");
- (queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")),
- handleQuery();
+ proxy.resetForm("queryRef")
+ ;(queryParams.value.queryTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")), handleQuery()
}
// 宄板钩璋疯兘鑰楀垎鏋�-宄板钩璋峰垎鏃剁粺璁�-瀵煎嚭
function handleExport() {
@@ -579,7 +436,7 @@
...query.value,
},
`${queryParams.value.nodeName}_宄板钩璋峰垎鏃剁粺璁${new Date().getTime()}.xlsx`
- );
+ )
}
</script>
<style scoped lang="scss">
diff --git a/zhitan-vue/src/views/powerquality/load/index.vue b/zhitan-vue/src/views/powerquality/load/index.vue
new file mode 100644
index 0000000..a386abe
--- /dev/null
+++ b/zhitan-vue/src/views/powerquality/load/index.vue
@@ -0,0 +1,402 @@
+<template>
+ <div class="page">
+ <div class="page-container">
+ <div class="page-container-left">
+ <LeftTree ref="leftTreeRef" @handleNodeClick="handleNodeClick" />
+ </div>
+ <div class="page-container-right">
+ <div
+ style="height: calc(100vh - 150px) !important; max-height: calc(100vh - 150px) !important; overflow-y: auto"
+ >
+ <BaseCard :title="queryParams.nodeName + '-璐熻嵎鍒嗘瀽'">
+ <div class="form-card">
+ <el-form :model="queryParams" ref="queryRef" :inline="true">
+ <el-form-item label="鏈熼棿" prop="timeType">
+ <el-select
+ v-model="queryParams.timeType"
+ placeholder="鏈熼棿"
+ clearable
+ style="width: 120px"
+ @change="handleTimeType"
+ >
+ <el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鏃堕棿" prop="dataTime">
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ :type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'"
+ :format="
+ queryParams.timeType == 'YEAR'
+ ? 'YYYY'
+ : queryParams.timeType == 'MONTH'
+ ? 'YYYY-MM'
+ : 'YYYY-MM-DD'
+ "
+ value-format="YYYY-MM-DD"
+ placeholder="鏃堕棿"
+ style="width: 100%"
+ />
+ </el-form-item>
+ <el-form-item label="閫夋嫨鐢佃〃" prop="meterId">
+ <el-select v-model="queryParams.meterId" placeholder="閫夋嫨鐢佃〃" clearable style="width: 200px">
+ <el-option
+ v-for="dict in electricityMeter"
+ :key="dict.value"
+ :label="dict.label"
+ :value="dict.value"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
+ </el-form-item>
+ <!-- <el-form-item>
+ <el-button type="primary" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+ </el-form-item> -->
+ </el-form>
+ </div>
+ <div class="display-buttons">
+ <div class="display-btn" @click="activeKey = 1" :class="{ 'active-display-btn': activeKey === 1 }">
+ 鍥惧舰
+ </div>
+ <div class="display-btn" @click="activeKey = 2" :class="{ 'active-display-btn': activeKey === 2 }">
+ 鏁版嵁
+ </div>
+ </div>
+ <div class="chart-box" v-loading="loading" v-show="activeKey === 1">
+ <LineChart ref="LineChartRef" :chartData="lineChartData" />
+ <div style="padding: 16px">
+ <el-descriptions title="" size="large" border :column="2">
+ <el-descriptions-item label="鏈�澶ц礋鑽�">
+ {{ detailData.max || "--" }}
+ </el-descriptions-item>
+ <el-descriptions-item label="鍙戠敓鏃堕棿">
+ {{ detailData.maxTime || "" }}
+ </el-descriptions-item>
+
+ <el-descriptions-item label="鏈�灏忚礋鑽�">
+ {{ detailData.min || "--" }}
+ </el-descriptions-item>
+ <el-descriptions-item label="鍙戠敓鏃堕棿">
+ {{ detailData.minTime || "--" }}
+ </el-descriptions-item>
+
+ <el-descriptions-item label="骞冲潎璐熻嵎">
+ {{ detailData.avg || "--" }}
+ </el-descriptions-item>
+ <el-descriptions-item label="璐熻嵎鐜�">
+ {{ detailData.rate || "" }}
+ </el-descriptions-item>
+ </el-descriptions>
+ </div>
+ </div>
+ <div style="margin-top: 16px" v-show="activeKey === 2">
+ <div class="" style="padding: 0 16px">
+ <el-table :data="tableData" v-loading="loading" height="calc(100vh - 400px)">
+ <el-table-column label="鏃堕棿" prop="timeCode" align="center" />
+ <el-table-column label="鐢佃〃鍚嶇О" prop="name" align="center" />
+ <el-table-column v-if="queryParams.timeType == 'DAY'" label="璐熻嵎" prop="value" align="center" />
+ <el-table-column v-if="queryParams.timeType != 'DAY'" label="鏈�澶ц礋鑽�" prop="max" align="center" />
+ <el-table-column v-if="queryParams.timeType != 'DAY'" label="鏈�灏忚礋鑽�" prop="min" align="center" />
+ <el-table-column v-if="queryParams.timeType != 'DAY'" label="骞冲潎璐熻嵎" prop="avg" align="center" />
+ <el-table-column v-if="queryParams.timeType != 'DAY'" label="璐熻嵎鐜�(%)" prop="rate" align="center" />
+ </el-table>
+ </div>
+ </div>
+ </BaseCard>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+<script setup name="loadAnalysis">
+import { loadAnalysisDetail, listElectricityDeviceMeter } from "@/api/powerquality/load-analysis/api.js"
+import LineChart from "@/components/Echarts/LineChart.vue"
+const { proxy } = getCurrentInstance()
+import { useRoute } from "vue-router"
+const { period } = proxy.useDict("period")
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
+watch(
+ () => settingsStore.sideTheme,
+ (val) => {
+ getList()
+ }
+)
+const activeKey = ref(1)
+const loading = ref(false)
+const tableData = ref([])
+const detailData = ref({})
+const lineChartData = ref({})
+const electricityMeter = ref([])
+const data = reactive({
+ queryParams: {
+ nodeId: null,
+ nodeName: null,
+ timeType: null,
+ dataTime: null,
+ meterId: "",
+ },
+ query: { ...useRoute().query },
+})
+const { queryParams, query } = toRefs(data)
+function getElectricityMeter(params) {
+ listElectricityDeviceMeter(params).then((res) => {
+ if (res.code === 200) {
+ electricityMeter.value = res.data.map((item) => {
+ return {
+ ...item,
+ value: item.code,
+ }
+ })
+ queryParams.value.meterId = res.data.length > 0 ? res.data[0].code : ""
+ getList()
+ }
+ })
+}
+/** 鑺傜偣鍗曞嚮浜嬩欢 */
+function handleNodeClick(data) {
+ queryParams.value.nodeId = data.id
+ queryParams.value.nodeName = data.label
+ setTimeout(() => {
+ handleTimeType(period.value[0].value)
+ }, 200)
+}
+function handleTimeType(e) {
+ queryParams.value.timeType = e
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")
+ getElectricityMeter({ nodeId: queryParams.value.nodeId })
+}
+const LineChartRef = ref()
+function getList() {
+ loading.value = true
+ let params = {
+ nodeId: queryParams.value.nodeId,
+ timeType: queryParams.value.timeType,
+ timeCode: queryParams.value.dataTime,
+ meterId: queryParams.value.meterId,
+ }
+ if (queryParams.value.timeType == "DAY") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY-MM-DD")
+ } else if (queryParams.value.timeType == "MONTH") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY-MM")
+ } else if (queryParams.value.timeType == "YEAR") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY")
+ }
+ loadAnalysisDetail(params)
+ .then((res) => {
+ if (res.code == 200) {
+ loading.value = false
+ tableData.value = res.data.itemList
+ detailData.value = res.data.detail
+ let itemList = res.data.itemList
+ if (queryParams.value.timeType == "DAY") {
+ lineChartData.value = {
+ title: "璐熻嵎鍒嗘瀽",
+ xAxis: itemList.map((item) => {
+ return item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�"
+ }),
+ series: [
+ {
+ name: "璐熻嵎鍊�",
+ data: itemList.map((item) => {
+ return item.value
+ }),
+ },
+ ],
+ }
+ } else {
+ lineChartData.value = {
+ title: "璐熻嵎鍒嗘瀽",
+ xAxis: itemList.map((item) => {
+ return item.timeCodeChart
+ }),
+ series: [
+ {
+ name: "骞冲潎璐熻嵎",
+ data: itemList.map((item) => {
+ return item.avg
+ }),
+ },
+ {
+ name: "鏈�澶ц礋鑽�",
+ data: itemList.map((item) => {
+ return item.max
+ }),
+ },
+ {
+ name: "鏈�灏忚礋鑽�",
+ data: itemList.map((item) => {
+ return item.min
+ }),
+ },
+ ],
+ }
+ }
+ }
+ })
+ .catch(() => {
+ loading.value = false
+ })
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-鎼滅储
+function handleQuery() {
+ getList()
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-閲嶇疆
+function resetQuery() {
+ proxy.resetForm("queryRef")
+ queryParams.value.timeType = null
+ queryParams.value.dataTime = null
+ handleTimeType(period.value[0].value)
+ handleQuery()
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-瀵煎嚭
+function handleExport() {
+ proxy.download(
+ "carbonEmission/export",
+ {
+ emissionType: "allType",
+ ...queryParams.value,
+ ...query.value,
+ },
+ `${queryParams.value.nodeName}-纰虫帓鏀鹃噺鏍哥畻_${new Date().getTime()}.xlsx`
+ )
+}
+</script>
+<style scoped lang="scss">
+@import "@/assets/styles/page.scss";
+
+.themeDark {
+ .card-list {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 18px;
+ color: #fff;
+
+ .card-list-item {
+ width: 19%;
+ margin-right: 1%;
+ height: 157px;
+ background: #223386;
+ border-radius: 5px 5px 5px 5px;
+ border: 1px solid #4868b7;
+ background-size: 100% 100%;
+ box-sizing: border-box;
+ padding: 25px 18px 12px 16px;
+
+ .item-top {
+ display: flex;
+ align-items: center;
+
+ .top-icon {
+ width: 40px;
+ height: 40px;
+ background-size: 100% 100%;
+ }
+
+ .top-right {
+ margin-left: 16px;
+ font-weight: bold;
+ font-size: 16px;
+ font-family: OPPOSans-Bold;
+ }
+ }
+
+ .item-bottom {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 18px;
+ font-family: OPPOSans, OPPOSans;
+ font-weight: bold;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+.themeLight {
+ .card-list {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 18px;
+
+ .card-list-item {
+ width: 19%;
+ margin-right: 1%;
+ height: 157px;
+ background: #fff;
+ border-radius: 5px 5px 5px 5px;
+ border: 1px solid #e8e8e8;
+ background-size: 100% 100%;
+ box-sizing: border-box;
+ padding: 25px 18px 12px 16px;
+
+ .item-top {
+ display: flex;
+ align-items: center;
+
+ .top-icon {
+ width: 40px;
+ height: 40px;
+ background-size: 100% 100%;
+ }
+
+ .top-right {
+ margin-left: 16px;
+ font-weight: bold;
+ font-size: 16px;
+ color: #000;
+ font-family: OPPOSans-Bold;
+ }
+ }
+
+ .item-bottom {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 18px;
+ font-family: OPPOSans, OPPOSans;
+ font-weight: bold;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+.chart-box {
+ width: 100%;
+ height: 100% !important;
+}
+.display-buttons {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: 16px;
+ margin-right: 16px;
+ .display-btn,
+ .active-display-btn {
+ width: 78px;
+ height: 34px;
+ background: #fff;
+ color: #409eff;
+ border: 2px solid #409eff;
+ border-radius: 4px;
+ margin-left: 10px;
+ text-align: center;
+ line-height: 31px;
+ font-size: 14px;
+ font-weight: 400;
+ cursor: pointer;
+ &:hover {
+ opacity: 0.9;
+ }
+ }
+ .active-display-btn {
+ background: #409eff;
+ color: #fff;
+ }
+}
+</style>
diff --git a/zhitan-vue/src/views/powerquality/power/index.vue b/zhitan-vue/src/views/powerquality/power/index.vue
new file mode 100644
index 0000000..37d5bba
--- /dev/null
+++ b/zhitan-vue/src/views/powerquality/power/index.vue
@@ -0,0 +1,331 @@
+<template>
+ <div class="page">
+ <div class="page-container">
+ <div class="page-container-left">
+ <LeftTree ref="leftTreeRef" @handleNodeClick="handleNodeClick" />
+ </div>
+ <div class="page-container-right">
+ <div
+ style="height: calc(100vh - 150px) !important; max-height: calc(100vh - 150px) !important; overflow-y: auto"
+ >
+ <BaseCard :title="queryParams.nodeName + '-鍔熺巼鍥犳暟鍒嗘瀽'">
+ <div class="form-card">
+ <el-form :model="queryParams" ref="queryRef" :inline="true">
+ <el-form-item label="鏃堕棿" prop="dataTime">
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ :type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'"
+ :format="
+ queryParams.timeType == 'YEAR'
+ ? 'YYYY'
+ : queryParams.timeType == 'MONTH'
+ ? 'YYYY-MM'
+ : 'YYYY-MM-DD'
+ "
+ value-format="YYYY-MM-DD"
+ placeholder="鏃堕棿"
+ style="width: 100%"
+ />
+ </el-form-item>
+ <el-form-item label="閫夋嫨鐢佃〃" prop="meterId">
+ <el-select v-model="queryParams.meterId" placeholder="閫夋嫨鐢佃〃" clearable style="width: 200px">
+ <el-option
+ v-for="dict in electricityMeter"
+ :key="dict.value"
+ :label="dict.label"
+ :value="dict.value"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
+ </el-form-item>
+ <!-- <el-form-item>
+ <el-button type="primary" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+ </el-form-item> -->
+ </el-form>
+ </div>
+
+ <div class="chart-box" v-loading="loading">
+ <LineChart ref="LineChartRef" :chartData="lineChartData" />
+ <div style="padding: 16px">
+ <el-table :data="tableData" v-loading="loading">
+ <el-table-column label="鍔熺巼鍥犳暟" prop="title" align="center" />
+ <el-table-column label="鏈�澶у��" prop="max" align="center" />
+ <el-table-column label="鏈�灏忓��" prop="min" align="center" />
+ <el-table-column label="骞冲潎鍊�" prop="avg" align="center" />
+ </el-table>
+ </div>
+ </div>
+ </BaseCard>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+<script setup name="loadAnalysis">
+import { powerFactorAnalysisDetail } from "@/api/powerquality/electric-power-factor/api.js"
+import { listElectricityDeviceMeter } from "@/api/powerquality/load-analysis/api.js"
+import LineChart from "@/components/Echarts/LineChart.vue"
+const { proxy } = getCurrentInstance()
+import { useRoute } from "vue-router"
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
+watch(
+ () => settingsStore.sideTheme,
+ (val) => {
+ getList()
+ }
+)
+const loading = ref(false)
+const tableData = ref([])
+const lineChartData = ref({})
+const electricityMeter = ref([])
+const data = reactive({
+ queryParams: {
+ nodeId: null,
+ nodeName: null,
+ timeType: "DAY",
+ dataTime: proxy.dayjs(new Date()).format("YYYY-MM-DD"),
+ meterId: "",
+ },
+ query: { ...useRoute().query },
+})
+const { queryParams, query } = toRefs(data)
+function getElectricityMeter(params) {
+ listElectricityDeviceMeter(params).then((res) => {
+ if (res.code === 200) {
+ electricityMeter.value = res.data.map((item) => {
+ return {
+ ...item,
+ value: item.code,
+ }
+ })
+ queryParams.value.meterId = res.data.length > 0 ? res.data[0].code : ""
+ getList()
+ }
+ })
+}
+/** 鑺傜偣鍗曞嚮浜嬩欢 */
+function handleNodeClick(data) {
+ queryParams.value.nodeId = data.id
+ queryParams.value.nodeName = data.label
+ getElectricityMeter({ nodeId: queryParams.value.nodeId })
+}
+
+const LineChartRef = ref()
+function getList() {
+ loading.value = true
+ let params = {
+ nodeId: queryParams.value.nodeId,
+ timeType: queryParams.value.timeType,
+ timeCode: queryParams.value.dataTime,
+ meterId: queryParams.value.meterId,
+ }
+ if (queryParams.value.timeType == "DAY") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY-MM-DD")
+ } else if (queryParams.value.timeType == "MONTH") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY-MM")
+ } else if (queryParams.value.timeType == "YEAR") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY")
+ }
+ powerFactorAnalysisDetail(params)
+ .then((res) => {
+ if (res.code == 200) {
+ loading.value = false
+ let detailData = res.data.detail
+ tableData.value = [
+ {
+ title: "鍙戠敓鍊�",
+ max: detailData.max,
+ min: detailData.min,
+ avg: detailData.avg,
+ },
+ {
+ title: "鍙戠敓鏃堕棿",
+ max: detailData.maxTime,
+ min: detailData.minTime,
+ avg: "--",
+ },
+ ]
+ detailData.value = res.data.detail
+ let itemList = res.data.itemList
+ lineChartData.value = {
+ title: "鍔熺巼鍥犳暟鍒嗘瀽",
+ xAxis: itemList.map((item) => {
+ return item.timeCode.slice(0, 2) + "鏃�"
+ }),
+ series: [
+ {
+ name: "鍔熺巼鍥犳暟",
+ data: itemList.map((item) => {
+ return item.value
+ }),
+ },
+ ],
+ }
+ }
+ })
+ .catch(() => {
+ loading.value = false
+ })
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-鎼滅储
+function handleQuery() {
+ getList()
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-閲嶇疆
+function resetQuery() {
+ proxy.resetForm("queryRef")
+ queryParams.value.timeType = null
+ queryParams.value.dataTime = null
+ handleQuery()
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-瀵煎嚭
+function handleExport() {
+ proxy.download(
+ "carbonEmission/export",
+ {
+ emissionType: "allType",
+ ...queryParams.value,
+ ...query.value,
+ },
+ `${queryParams.value.nodeName}-纰虫帓鏀鹃噺鏍哥畻_${new Date().getTime()}.xlsx`
+ )
+}
+</script>
+<style scoped lang="scss">
+@import "@/assets/styles/page.scss";
+
+.themeDark {
+ .card-list {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 18px;
+ color: #fff;
+
+ .card-list-item {
+ width: 19%;
+ margin-right: 1%;
+ height: 157px;
+ background: #223386;
+ border-radius: 5px 5px 5px 5px;
+ border: 1px solid #4868b7;
+ background-size: 100% 100%;
+ box-sizing: border-box;
+ padding: 25px 18px 12px 16px;
+
+ .item-top {
+ display: flex;
+ align-items: center;
+
+ .top-icon {
+ width: 40px;
+ height: 40px;
+ background-size: 100% 100%;
+ }
+
+ .top-right {
+ margin-left: 16px;
+ font-weight: bold;
+ font-size: 16px;
+ font-family: OPPOSans-Bold;
+ }
+ }
+
+ .item-bottom {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 18px;
+ font-family: OPPOSans, OPPOSans;
+ font-weight: bold;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+.themeLight {
+ .card-list {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 18px;
+
+ .card-list-item {
+ width: 19%;
+ margin-right: 1%;
+ height: 157px;
+ background: #fff;
+ border-radius: 5px 5px 5px 5px;
+ border: 1px solid #e8e8e8;
+ background-size: 100% 100%;
+ box-sizing: border-box;
+ padding: 25px 18px 12px 16px;
+
+ .item-top {
+ display: flex;
+ align-items: center;
+
+ .top-icon {
+ width: 40px;
+ height: 40px;
+ background-size: 100% 100%;
+ }
+
+ .top-right {
+ margin-left: 16px;
+ font-weight: bold;
+ font-size: 16px;
+ color: #000;
+ font-family: OPPOSans-Bold;
+ }
+ }
+
+ .item-bottom {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 18px;
+ font-family: OPPOSans, OPPOSans;
+ font-weight: bold;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+.chart-box {
+ width: 100%;
+ height: 100% !important;
+}
+.display-buttons {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ margin-top: 16px;
+ margin-right: 16px;
+ .display-btn,
+ .active-display-btn {
+ width: 78px;
+ height: 34px;
+ background: #fff;
+ color: #409eff;
+ border: 2px solid #409eff;
+ border-radius: 4px;
+ margin-left: 10px;
+ text-align: center;
+ line-height: 31px;
+ font-size: 14px;
+ font-weight: 400;
+ cursor: pointer;
+ &:hover {
+ opacity: 0.9;
+ }
+ }
+ .active-display-btn {
+ background: #409eff;
+ color: #fff;
+ }
+}
+</style>
diff --git a/zhitan-vue/src/views/powerquality/threephase/index.vue b/zhitan-vue/src/views/powerquality/threephase/index.vue
new file mode 100644
index 0000000..aeab645
--- /dev/null
+++ b/zhitan-vue/src/views/powerquality/threephase/index.vue
@@ -0,0 +1,504 @@
+<template>
+ <div class="page">
+ <div class="page-container">
+ <div class="page-container-left">
+ <LeftTree ref="leftTreeRef" @handleNodeClick="handleNodeClick" />
+ </div>
+ <div class="page-container-right">
+ <div
+ style="height: calc(100vh - 150px) !important; max-height: calc(100vh - 150px) !important; overflow-y: auto"
+ >
+ <BaseCard :title="queryParams.nodeName + '-涓夌浉涓嶅钩琛″垎鏋�'">
+ <div class="form-card">
+ <el-form :model="queryParams" ref="queryRef" :inline="true">
+ <el-form-item label="鏈熼棿" prop="timeType">
+ <el-select
+ v-model="queryParams.timeType"
+ placeholder="鏈熼棿"
+ clearable
+ style="width: 120px"
+ @change="handleTimeType"
+ >
+ <el-option v-for="dict in period" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鏃堕棿">
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ :type="queryParams.timeType == 'YEAR' ? 'year' : queryParams.timeType == 'MONTH' ? 'month' : 'date'"
+ :format="
+ queryParams.timeType == 'YEAR'
+ ? 'YYYY'
+ : queryParams.timeType == 'MONTH'
+ ? 'YYYY-MM'
+ : 'YYYY-MM-DD'
+ "
+ value-format="YYYY-MM-DD"
+ placeholder="鏃堕棿"
+ style="width: 100%"
+ />
+ </el-form-item>
+ <el-form-item label="閫夋嫨鐢佃〃" prop="meterId">
+ <el-select
+ v-model="queryParams.meterId"
+ placeholder="閫夋嫨鐢佃〃"
+ clearable
+ style="width: 200px"
+ @change="handleTimeType"
+ >
+ <el-option
+ v-for="dict in electricityMeter"
+ :key="dict.value"
+ :label="dict.label"
+ :value="dict.value"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
+ </el-form-item>
+ <!-- <el-form-item>
+ <el-button type="primary" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
+ </el-form-item> -->
+ </el-form>
+ </div>
+
+ <div style="padding: 0 16px">
+ <el-tabs v-model="activeTabKey" type="card">
+ <el-tab-pane label="鐢靛帇涓嶅钩琛�" name="1"> </el-tab-pane>
+ <el-tab-pane label="鐢垫祦涓嶅钩琛�" name="2"> </el-tab-pane>
+ </el-tabs>
+ <div class="display-buttons">
+ <div class="display-btn" @click="switchBtnType(1)" :class="{ 'active-display-btn': activeKey === 1 }">
+ 鍥惧舰
+ </div>
+ <div class="display-btn" @click="switchBtnType(2)" :class="{ 'active-display-btn': activeKey === 2 }">
+ 鏁版嵁
+ </div>
+ </div>
+ </div>
+
+ <div class="chart-box" v-loading="loading" v-show="activeKey === 1">
+ <LineChart ref="LineChartRef" :chartData="lineChartData" />
+ <el-table :data="tableData1" v-loading="loading">
+ <el-table-column label="绫诲瀷" prop="type" align="center" />
+ <el-table-column label="涓夐」涓嶅钩琛℃瀬鍊�" prop="value" align="center" />
+ <el-table-column label="鍙戠敓鏃堕棿" prop="time" align="center" />
+ <el-table-column v-if="activeTabKey == 1" label="A椤圭數鍘�(V)" prop="valueA" align="center" />
+ <el-table-column v-if="activeTabKey == 1" label="B椤圭數鍘�(V)" prop="valueB" align="center" />
+ <el-table-column v-if="activeTabKey == 1" label="C椤圭數鍘�(V)" prop="valueC" align="center" />
+ <el-table-column v-if="activeTabKey == 2" label="A椤圭數娴�(A)" prop="valueA" align="center" />
+ <el-table-column v-if="activeTabKey == 2" label="B椤圭數娴�(A)" prop="valueB" align="center" />
+ <el-table-column v-if="activeTabKey == 2" label="C椤圭數娴�(A)" prop="valueC" align="center" />
+ </el-table>
+ </div>
+ <div style="margin-top: 16px" v-show="activeKey === 2">
+ <div class="" style="padding: 0 16px">
+ <el-table :data="tableData2" v-loading="loading" height="calc(100vh - 400px)">
+ <el-table-column label="鏃堕棿" prop="timeCode" align="center" />
+ <el-table-column label="鐢佃〃鍚嶇О" prop="name" align="center" />
+ <el-table-column
+ v-if="activeTabKey == 1 && queryParams.timeType == 'DAY'"
+ label="A椤圭數鍘�(V)"
+ prop="valueA"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 1 && queryParams.timeType == 'DAY'"
+ label="B椤圭數鍘�(V)"
+ prop="valueB"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 1 && queryParams.timeType == 'DAY'"
+ label="C椤圭數鍘�(V)"
+ prop="valueC"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 2 && queryParams.timeType == 'DAY'"
+ label="A椤圭數娴�(A)"
+ prop="valueA"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 2 && queryParams.timeType == 'DAY'"
+ label="B椤圭數娴�(A)"
+ prop="valueB"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 2 && queryParams.timeType == 'DAY'"
+ label="C椤圭數娴�(A)"
+ prop="valueC"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 1 && queryParams.timeType !== 'DAY'"
+ label="鏈�澶у��(V)"
+ prop="max"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 1 && queryParams.timeType !== 'DAY'"
+ label="鏈�灏忓��(V)"
+ prop="min"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 2 && queryParams.timeType !== 'DAY'"
+ label="鏈�澶у��(A)"
+ prop="max"
+ align="center"
+ />
+ <el-table-column
+ v-if="activeTabKey == 2 && queryParams.timeType !== 'DAY'"
+ label="鏈�灏忓��(A)"
+ prop="min"
+ align="center"
+ />
+ </el-table>
+ </div>
+ </div>
+ </BaseCard>
+ </div>
+ </div>
+ </div>
+ </div>
+</template>
+<script setup name="loadAnalysis">
+import { threePhaseUnbalanceAnalysisDetail } from "@/api/powerquality/electricThreePhase/api.js"
+import { listElectricityDeviceMeter } from "@/api/powerquality/load-analysis/api.js"
+import LineChart from "@/components/Echarts/LineChart.vue"
+const { proxy } = getCurrentInstance()
+import { useRoute } from "vue-router"
+const { period } = proxy.useDict("period")
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
+watch(
+ () => settingsStore.sideTheme,
+ (val) => {
+ getList()
+ }
+)
+const activeTabKey = ref("1")
+const activeKey = ref(1)
+const activeKeyA = ref(1)
+const loading = ref(false)
+const tableData1 = ref([])
+const tableData2 = ref([])
+const detailData = ref({})
+const lineChartData = ref({})
+const electricityMeter = ref([])
+const data = reactive({
+ queryParams: {
+ nodeId: null,
+ nodeName: null,
+ timeType: null,
+ dataTime: null,
+ meterId: "",
+ },
+ query: { ...useRoute().query },
+})
+const { queryParams, query } = toRefs(data)
+function getElectricityMeter(params) {
+ listElectricityDeviceMeter(params).then((res) => {
+ if (res.code === 200) {
+ electricityMeter.value = res.data.map((item) => {
+ return {
+ ...item,
+ value: item.code,
+ }
+ })
+ queryParams.value.meterId = res.data.length > 0 ? res.data[0].code : ""
+ getList()
+ }
+ })
+}
+/** 鑺傜偣鍗曞嚮浜嬩欢 */
+function handleNodeClick(data) {
+ queryParams.value.nodeId = data.id
+ queryParams.value.nodeName = data.label
+ handleTimeType(period.value[0].value)
+ getElectricityMeter({ nodeId: queryParams.value.nodeId })
+}
+function handleTimeType(e) {
+ queryParams.value.timeType = e
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD")
+}
+
+function switchBtnType(e) {
+ activeKey.value = e
+ if (e === 1) {
+ getList()
+ }
+}
+// 鍒楄〃
+function getList() {
+ loading.value = true
+ let params = {
+ nodeId: queryParams.value.nodeId,
+ timeType: queryParams.value.timeType,
+ timeCode: queryParams.value.dataTime,
+ meterId: queryParams.value.meterId,
+ requestType: activeTabKey.value == 1 ? 0 : 1,
+ }
+ if (queryParams.value.timeType == "DAY") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY-MM-DD")
+ } else if (queryParams.value.timeType == "MONTH") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY-MM")
+ } else if (queryParams.value.timeType == "YEAR") {
+ params.timeCode = proxy.dayjs(new Date(queryParams.value.dataTime)).format("YYYY")
+ }
+ threePhaseUnbalanceAnalysisDetail(params)
+ .then((res) => {
+ if (!!res.code && res.code == 200) {
+ // detailData.value = res.data.detail
+ loading.value = false
+ let itemList = res.data.itemList || []
+ let detail = res.data.detail || {}
+ if (detail) {
+ tableData1.value = [
+ {
+ type: "鏈�澶у��",
+ value: detail.max || "--",
+ time: detail.maxTime,
+ valueA: detail.valueMaxA,
+ valueB: detail.valueMaxB,
+ valueC: detail.valueMaxC,
+ },
+ {
+ type: "鏈�灏忓��",
+ value: detail.min,
+ time: detail.minTime,
+ valueA: detail.valueMinA,
+ valueB: detail.valueMinB,
+ valueC: detail.valueMinC,
+ },
+ ]
+ }
+
+ let tableDataWithMeterList = itemList
+ tableData2.value =
+ tableDataWithMeterList.map((item) => {
+ // item.timeCode = this.formatTime(item.timeCode)
+ return item
+ }) || []
+
+ // chart
+ let chartData = {}
+ chartData.title = "涓夌浉涓嶅钩琛″垎鏋�"
+ if (queryParams.value.timeType !== "DAY") {
+ chartData = {
+ title: "涓夌浉涓嶅钩琛″垎鏋�",
+ xAxis: itemList.map((item) => {
+ return item.timeCodeChart
+ }),
+ series: [
+ {
+ name: "鏈�灏忓��",
+ data: itemList.map((item) => {
+ return item.min === "--" || !item.min ? null : Number(item.min)
+ }),
+ },
+ {
+ name: "鏈�澶у��",
+ data: itemList.map((item) => {
+ return item.max === "--" || !item.max ? null : Number(item.max)
+ }),
+ },
+ ],
+ }
+ } else {
+ chartData = {
+ title: "涓夌浉涓嶅钩琛″垎鏋�",
+ xAxis: itemList.map((item) => {
+ return item.timeCode.slice(item.timeCode.length - 2, item.timeCode.length) + "鏃�"
+ }),
+ series: [
+ {
+ name: "A鐩�" + (activeTabKey.value == 1 ? "鐢靛帇" : "鐢垫祦"),
+ data: itemList.map((item) => {
+ return item.valueA === "--" || !item.valueA ? null : Number(item.valueA)
+ }),
+ },
+ {
+ name: "B鐩�" + (activeTabKey.value == 1 ? "鐢靛帇" : "鐢垫祦"),
+ data: itemList.map((item) => {
+ return item.valueB === "--" || !item.valueB ? null : Number(item.valueB)
+ }),
+ },
+ {
+ name: "C鐩�" + (activeTabKey.value == 1 ? "鐢靛帇" : "鐢垫祦"),
+ data: itemList.map((item) => {
+ return item.valueC === "--" || !item.valueC ? null : Number(item.valueC)
+ }),
+ },
+ ],
+ }
+ }
+ lineChartData.value = chartData
+ }
+ })
+ .catch(() => {
+ loading.value = false
+ })
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-鎼滅储
+function handleQuery() {
+ getList()
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-閲嶇疆
+function resetQuery() {
+ proxy.resetForm("queryRef")
+ queryParams.value.timeType = null
+ queryParams.value.dataTime = null
+ handleTimeType(period.value[0].value)
+ handleQuery()
+}
+// 纰虫帓鏀剧鐞�-纰虫帓鏀鹃噺鏍哥畻-瀵煎嚭
+function handleExport() {
+ proxy.download(
+ "carbonEmission/export",
+ {
+ emissionType: "allType",
+ ...queryParams.value,
+ ...query.value,
+ },
+ `${queryParams.value.nodeName}-纰虫帓鏀鹃噺鏍哥畻_${new Date().getTime()}.xlsx`
+ )
+}
+</script>
+<style scoped lang="scss">
+@import "@/assets/styles/page.scss";
+
+.themeDark {
+ .card-list {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 18px;
+ color: #fff;
+
+ .card-list-item {
+ width: 19%;
+ margin-right: 1%;
+ height: 157px;
+ background: #223386;
+ border-radius: 5px 5px 5px 5px;
+ border: 1px solid #4868b7;
+ background-size: 100% 100%;
+ box-sizing: border-box;
+ padding: 25px 18px 12px 16px;
+
+ .item-top {
+ display: flex;
+ align-items: center;
+
+ .top-icon {
+ width: 40px;
+ height: 40px;
+ background-size: 100% 100%;
+ }
+
+ .top-right {
+ margin-left: 16px;
+ font-weight: bold;
+ font-size: 16px;
+ font-family: OPPOSans-Bold;
+ }
+ }
+
+ .item-bottom {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 18px;
+ font-family: OPPOSans, OPPOSans;
+ font-weight: bold;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+.themeLight {
+ .card-list {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 18px;
+
+ .card-list-item {
+ width: 19%;
+ margin-right: 1%;
+ height: 157px;
+ background: #fff;
+ border-radius: 5px 5px 5px 5px;
+ border: 1px solid #e8e8e8;
+ background-size: 100% 100%;
+ box-sizing: border-box;
+ padding: 25px 18px 12px 16px;
+
+ .item-top {
+ display: flex;
+ align-items: center;
+
+ .top-icon {
+ width: 40px;
+ height: 40px;
+ background-size: 100% 100%;
+ }
+
+ .top-right {
+ margin-left: 16px;
+ font-weight: bold;
+ font-size: 16px;
+ color: #000;
+ font-family: OPPOSans-Bold;
+ }
+ }
+
+ .item-bottom {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 18px;
+ font-family: OPPOSans, OPPOSans;
+ font-weight: bold;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+.chart-box {
+ width: 100%;
+ height: 100% !important;
+}
+.display-buttons {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ .display-btn,
+ .active-display-btn {
+ width: 78px;
+ height: 34px;
+ background: #fff;
+ color: #409eff;
+ border: 2px solid #409eff;
+ border-radius: 4px;
+ margin-left: 10px;
+ text-align: center;
+ line-height: 31px;
+ font-size: 14px;
+ font-weight: 400;
+ cursor: pointer;
+ &:hover {
+ opacity: 0.9;
+ }
+ }
+ .active-display-btn {
+ background: #409eff;
+ color: #fff;
+ }
+}
+</style>
diff --git a/zhitan-vue/src/views/realtimemonitor/realtimemonitor/components/chart-modal.vue b/zhitan-vue/src/views/realtimemonitor/realtimemonitor/components/chart-modal.vue
index c1fde4f..1c4a4ab 100644
--- a/zhitan-vue/src/views/realtimemonitor/realtimemonitor/components/chart-modal.vue
+++ b/zhitan-vue/src/views/realtimemonitor/realtimemonitor/components/chart-modal.vue
@@ -4,19 +4,20 @@
<div class="page">
<el-form :model="queryParams" ref="queryRef" :inline="true" label-width="80px">
<el-form-item label="鏃ユ湡绛涢��" prop="dataTime">
- <el-date-picker v-model="queryParams.dataTime" value-format="YYYY-MM-DD 00:00:00" type="date"
- placeholder="鏃ユ湡绛涢��" style="width: 100%" />
+ <el-date-picker
+ v-model="queryParams.dataTime"
+ value-format="YYYY-MM-DD 00:00:00"
+ type="date"
+ placeholder="鏃ユ湡绛涢��"
+ style="width: 100%"
+ />
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">
- 鎼滅储
- </el-button>
+ <el-button type="primary" icon="Search" @click="handleQuery"> 鎼滅储 </el-button>
<el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
</el-form-item>
<el-form-item>
- <el-button type="primary" icon="Download" @click="handleExport">
- 瀵煎嚭
- </el-button>
+ <el-button type="primary" icon="Download" @click="handleExport"> 瀵煎嚭 </el-button>
</el-form-item>
</el-form>
<div class="chart-box" v-loading="loading">
@@ -28,173 +29,148 @@
</template>
<script setup name="chartModal">
-import * as echarts from "echarts";
-import { getEnergyRealTimeMonitor } from "@/api/realTimeMonitor/realTimeMonitor";
-const { proxy } = getCurrentInstance();
-import useSettingsStore from "@/store/modules/settings";
-const settingsStore = useSettingsStore();
-const dialogTableVisible = ref(false);
+import * as echarts from "echarts"
+import { getEnergyRealTimeMonitor } from "@/api/realTimeMonitor/realTimeMonitor"
+const { proxy } = getCurrentInstance()
+import useSettingsStore from "@/store/modules/settings"
+const settingsStore = useSettingsStore()
+const dialogTableVisible = ref(false)
const data = reactive({
title: null,
queryParams: {
tagCode: null,
dataTime: null,
},
-});
-const { queryParams, title } = toRefs(data);
-const loading = ref(false);
-defineExpose({ handleOpen });
+})
+const { queryParams, title } = toRefs(data)
+const loading = ref(false)
+defineExpose({ handleOpen })
function handleOpen(row) {
- title.value = row.name;
- dialogTableVisible.value = true;
- queryParams.value.nodeName = row.nodeName;
- queryParams.value.tagCode = row.indexCode;
- queryParams.value.unit = row.unit;
- queryParams.value.name = row.name;
- queryParams.value.dataTime = proxy
- .dayjs(new Date())
- .format("YYYY-MM-DD 00:00:00");
- getList();
+ title.value = row.name
+ dialogTableVisible.value = true
+ queryParams.value.nodeName = row.nodeName
+ queryParams.value.tagCode = row.indexCode
+ queryParams.value.unit = row.unit
+ queryParams.value.name = row.name
+ queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD 00:00:00")
+ getList()
}
function handleClose() {
- dialogTableVisible.value = false;
+ dialogTableVisible.value = false
}
// 鑳芥簮瀹炴椂鐩戞帶-鑳芥簮瀹炴椂鐩戞帶-鍒楄〃
function getList() {
- loading.value = true;
- getEnergyRealTimeMonitor(proxy.addDateRange(queryParams.value)).then(
- (res) => {
- const myChart1 = echarts.init(document.getElementById("Chart1"));
- if (!!res.code && res.code == 200) {
- if (!!res.data) {
- let xdata = [];
- let ydata = [];
- res.data.map((item) => {
- xdata.push(proxy.dayjs(item.name).format("HH:mm"));
- ydata.push(!!item.value ? item.value : 0);
- });
- loading.value = false;
- myChart1.setOption({
- color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"],
- grid: {
- top: "45",
- left: "6%",
- right: "5%",
- bottom: "10",
- containLabel: true,
- },
- tooltip: {
- trigger: "axis",
- axisPointer: {
- type: "shadow",
- },
- },
- xAxis: {
- type: "category",
- axisLine: {
- show: true,
- lineStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
- },
- },
- axisTick: {
- show: false,
- },
- splitArea: {
- show: false,
- },
- splitLine: {
- show: false,
- },
- axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
- fontSize: 14,
- padding: [5, 0, 0, 0],
- // formatter: '{value} ml'
- },
- data: xdata,
- },
- yAxis: {
- type: "value",
- name:
- queryParams.value.name +
- (!!queryParams.value.unit
- ? "(" + queryParams.value.unit + ")"
- : ""),
- nameTextStyle: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
- fontSize: 14,
- padding: [0, 0, 5, 0],
- },
- axisLine: {
- show: false,
- },
- splitLine: {
- show: true,
- lineStyle: {
- type: "dashed",
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
- },
- },
- axisTick: {
- show: false,
- },
- splitArea: {
- show: false,
- },
- axisLabel: {
- color:
- settingsStore.sideTheme == "theme-dark"
- ? "#FFFFFF"
- : "#222222",
- fontSize: 14,
- },
- },
- series: [
- {
- name: title.value + "鍘嗗彶鏁版嵁鏌ヨ", // ytip
- type: "line",
- barWidth: "27",
- stack: "total",
- data: ydata,
- },
- ],
- });
- }
- window.addEventListener(
- "resize",
- () => {
- myChart1.resize();
+ loading.value = true
+ getEnergyRealTimeMonitor(proxy.addDateRange(queryParams.value)).then((res) => {
+ const myChart1 = echarts.init(document.getElementById("Chart1"))
+ if (!!res.code && res.code == 200) {
+ if (!!res.data) {
+ let xdata = []
+ let ydata = []
+ res.data.map((item) => {
+ xdata.push(proxy.dayjs(item.name).format("HH:mm"))
+ ydata.push(!!item.value ? item.value : 0)
+ })
+ loading.value = false
+ myChart1.setOption({
+ color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"],
+ grid: {
+ top: "45",
+ left: "6%",
+ right: "5%",
+ bottom: "10",
+ containLabel: true,
},
- { passive: true }
- );
+ tooltip: {
+ trigger: "axis",
+ axisPointer: {
+ type: "shadow",
+ },
+ },
+ xAxis: {
+ type: "category",
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ splitArea: {
+ show: false,
+ },
+ splitLine: {
+ show: false,
+ },
+ axisLabel: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ padding: [5, 0, 0, 0],
+ // formatter: '{value} ml'
+ },
+ data: xdata,
+ },
+ yAxis: {
+ type: "value",
+ name: queryParams.value.name + (!!queryParams.value.unit ? "(" + queryParams.value.unit + ")" : ""),
+ nameTextStyle: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ padding: [0, 0, 5, 0],
+ },
+ axisLine: {
+ show: false,
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: "dashed",
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ splitArea: {
+ show: false,
+ },
+ axisLabel: {
+ color: settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222",
+ fontSize: 14,
+ },
+ },
+ series: [
+ {
+ name: title.value + "鍘嗗彶鏁版嵁鏌ヨ", // ytip
+ type: "line",
+ barWidth: "12",
+ stack: "total",
+ data: ydata,
+ },
+ ],
+ })
}
+ window.addEventListener(
+ "resize",
+ () => {
+ myChart1.resize()
+ },
+ { passive: true }
+ )
}
- );
+ })
}
// 鑳芥簮瀹炴椂鐩戞帶-鑳芥簮瀹炴椂鐩戞帶-鎼滅储
function handleQuery() {
- getList();
+ getList()
}
// 鑳芥簮瀹炴椂鐩戞帶-鑳芥簮瀹炴椂鐩戞帶-閲嶇疆
function resetQuery() {
- proxy.resetForm("queryRef");
- (queryParams.value.dataTime = proxy
- .dayjs(new Date())
- .format("YYYY-MM-DD 00:00:00")),
- handleNodeClick(nodeOptions.value[0]);
+ proxy.resetForm("queryRef")
+ ;(queryParams.value.dataTime = proxy.dayjs(new Date()).format("YYYY-MM-DD 00:00:00")),
+ handleNodeClick(nodeOptions.value[0])
}
// 鑳芥簮瀹炴椂鐩戞帶-鑳芥簮瀹炴椂鐩戞帶-瀵煎嚭
function handleExport() {
@@ -202,7 +178,7 @@
"rtdb/realtimeTrend/export",
queryParams.value,
`${queryParams.value.nodeName}-${queryParams.value.name}_鑳芥簮瀹炴椂鐩戞帶_${new Date().getTime()}.xlsx`
- );
+ )
}
</script>
<style scoped lang="scss">
diff --git a/zhitan-vue/src/views/svg/components/configure.vue b/zhitan-vue/src/views/svg/components/configure.vue
index 7137b94..3b4820b 100644
--- a/zhitan-vue/src/views/svg/components/configure.vue
+++ b/zhitan-vue/src/views/svg/components/configure.vue
@@ -131,7 +131,7 @@
form.value.svgType = "COLLECT"
updateEquipmentfile(form.value).then((result) => {
if (result.code === 200) {
- filePath.value = response.msg
+ filePath.value = val[0].fullUrl
tags.value = []
getSvg()
} else {
@@ -139,7 +139,7 @@
}
})
} else {
- proxy.$modal.msgError(response.msg)
+ proxy.$modal.msgError(result.msg)
}
}
--
Gitblit v1.9.3