From c9d4f449ed2cf44a24564b18b5943b72ee304320 Mon Sep 17 00:00:00 2001 From: letsgocoding <sdxt_0802@163.com> Date: 星期六, 15 二月 2025 09:59:31 +0800 Subject: [PATCH] !80 同比环比集成完毕接口 Merge pull request !80 from netmouse/develop_Yao --- package-lock.json | 6 zhitan-vue/src/views/poweranalysis/perPassu/index.vue | 594 +++++++++++++++++++++++++++ zhitan-vue/src/views/poweranalysis/pariPassu/index.vue | 592 ++++++++++++++++++++++++++ zhitan-vue/src/api/energyAnalysis/energyAnalysis.js | 16 zhitan-admin/src/.DS_Store | 0 zhitan-system/.DS_Store | 0 zhitan-system/src/.DS_Store | 0 /dev/null | 92 ---- zhitan-common/src/.DS_Store | 0 zhitan-generator/.DS_Store | 0 zhitan-vue/vite.config.js | 2 zhitan-admin/.DS_Store | 0 zhitan-common/.DS_Store | 0 .DS_Store | 0 zhitan-quartz/.DS_Store | 0 15 files changed, 1,210 insertions(+), 92 deletions(-) diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000..af0ac34 --- /dev/null +++ b/.DS_Store Binary files differ diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..56b8aee --- /dev/null +++ b/package-lock.json @@ -0,0 +1,6 @@ +{ + "name": "zhitan-ems", + "lockfileVersion": 3, + "requires": true, + "packages": {} +} diff --git a/zhitan-admin/.DS_Store b/zhitan-admin/.DS_Store new file mode 100644 index 0000000..f5754cb --- /dev/null +++ b/zhitan-admin/.DS_Store Binary files differ diff --git a/zhitan-admin/src/.DS_Store b/zhitan-admin/src/.DS_Store new file mode 100644 index 0000000..0d5f426 --- /dev/null +++ b/zhitan-admin/src/.DS_Store Binary files differ diff --git a/zhitan-common/.DS_Store b/zhitan-common/.DS_Store new file mode 100644 index 0000000..d52fba7 --- /dev/null +++ b/zhitan-common/.DS_Store Binary files differ diff --git a/zhitan-common/src/.DS_Store b/zhitan-common/src/.DS_Store new file mode 100644 index 0000000..8fef99f --- /dev/null +++ b/zhitan-common/src/.DS_Store Binary files differ diff --git a/zhitan-generator/.DS_Store b/zhitan-generator/.DS_Store new file mode 100644 index 0000000..9c98af2 --- /dev/null +++ b/zhitan-generator/.DS_Store Binary files differ diff --git a/zhitan-quartz/.DS_Store b/zhitan-quartz/.DS_Store new file mode 100644 index 0000000..93d6ade --- /dev/null +++ b/zhitan-quartz/.DS_Store Binary files differ diff --git a/zhitan-system/.DS_Store b/zhitan-system/.DS_Store new file mode 100644 index 0000000..bb388d5 --- /dev/null +++ b/zhitan-system/.DS_Store Binary files differ diff --git a/zhitan-system/src/.DS_Store b/zhitan-system/src/.DS_Store new file mode 100644 index 0000000..08dd54b --- /dev/null +++ b/zhitan-system/src/.DS_Store Binary files differ diff --git a/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js b/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js index cbb5712..20f6551 100644 --- a/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js +++ b/zhitan-vue/src/api/energyAnalysis/energyAnalysis.js @@ -60,3 +60,19 @@ params: query, }) } +// 瀵规瘮鍒嗘瀽鍚屾瘮 +export function querySameCompareList(query) { + return request({ + url: "/statisticsAnalysis/querySameCompareList", + method: "get", + params: query, + }) +} +// 瀵规瘮鍒嗘瀽鐜瘮 +export function queryLoopCompareList(query) { + return request({ + url: "/statisticsAnalysis/queryLoopCompareList", + method: "get", + params: query, + }) +} diff --git a/zhitan-vue/src/views/energyconservation/policyrule/components/EditModal copy.vue b/zhitan-vue/src/views/energyconservation/policyrule/components/EditModal copy.vue deleted file mode 100644 index fc5f899..0000000 --- a/zhitan-vue/src/views/energyconservation/policyrule/components/EditModal copy.vue +++ /dev/null @@ -1,92 +0,0 @@ -<template> - <el-dialog v-model="visible" :title="title" width="600" @close="handleClose"> - <el-form :model="form" ref="queryRef" :rules="formRules" label-width="120px" v-loading="loading"> - <el-form-item label="鏂囦欢鏍囬" prop="limitName"> - <el-input v-model="form.value1" placeholder="璇疯緭鍏ユ枃浠舵爣棰�" /> - </el-form-item> - <el-form-item label="鏂囦欢绫诲埆"> - <el-select v-model="form.value2" placeholder="璇烽�夋嫨"> - <el-option v-for="item in 6" :key="item" :label="item" :value="item"> - </el-option> - </el-select> - </el-form-item> - - </el-form> - <div slot="footer" class="text-right"> - <el-button type="primary" @click="submitForm" :loading="loading">纭� 瀹�</el-button> - <el-button @click="handleClose">鍙� 娑�</el-button> - </div> - </el-dialog> -</template> - -<script setup> -const { proxy } = getCurrentInstance(); - - -let visible = ref(false) -let title = ref('') -let loading = ref(false) -let form = ref({ - value1: '', - value2: '', -}) -let emit = defineEmits(['get-list']) -const formRules = { - value1: [{ required: true, trigger: "blur", message: "璇疯緭鍏ユ枃浠舵爣棰�" }], - value2: [{ required: true, trigger: "change", message: "璇烽�夋嫨鏂囦欢绫诲瀷" }], -} - -function submitForm() { - proxy.$refs.queryRef.validate(valid => { - if (valid) { - // loading.value = true; - // let obj = form.value.id ? alarmEdit(form.value) : alarmAdd(form.value) - // obj.then((res) => { - // if (res.code == 200) { - // proxy.$modal.msgSuccess(res.message); - // emit('get-list') - // } else { - // proxy.$modal.msgError(res.message); - // } - - // }).catch((err) => { - - // }).finally(() => { - // handleClose() - // }); - } - }) -} - - - - - -function handleOpen(row) { - if (row && row.id) { - title.value = "缂栬緫鏀跨瓥娉曡" - form.value = JSON.parse(JSON.stringify(row)) - } else { - title.value = "娣诲姞鏀跨瓥娉曡" - } - visible.value = true -} - -function handleClose(value) { - visible.value = false - loading.value = false - proxy.$refs.queryRef.resetFields() - form.value = { - value1: '', - value2: '', - - } -} - -defineExpose({ handleOpen }) - -</script> - - - -<style lang="scss" scoped></style> \ No newline at end of file diff --git a/zhitan-vue/src/views/poweranalysis/pariPassu/index.vue b/zhitan-vue/src/views/poweranalysis/pariPassu/index.vue new file mode 100644 index 0000000..d6bcfd1 --- /dev/null +++ b/zhitan-vue/src/views/poweranalysis/pariPassu/index.vue @@ -0,0 +1,592 @@ +<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 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="energyType"> + <el-select v-model="queryParams.energyType" placeholder="鑳芥簮绫诲瀷" clearable style="width: 120px"> + <el-option :label="item.enername" :value="item.enersno" v-for="item in energyTypeList" + :key="item.enersno" @click="handleEnergyType(item)" /> + </el-select> + </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="queryParams.analysisType == 'YOY' ? 'primary' : ''" @click="handleAnalysisType('YOY')"> + 鍚屾瘮 + </el-button> + <el-button :type="queryParams.analysisType == 'MOM' ? 'primary' : ''" @click="handleAnalysisType('MOM')"> + 鐜瘮 + </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=" + height: calc(100vh - 220px) !important; + max-height: calc(100vh - 220px) !important; + overflow-y: auto; + " v-loading="loading"> + + <BaseCard :title="queryParams.nodeName + '-鑳借�楀姣斿垎鏋�'"> + <div class="chart-box"> + <div id="Chart1" /> + </div> + </BaseCard> + + <BaseCard :title="queryParams.nodeName + + '-鑳借�楀姣斿垎鏋愬悓姣斿垎鏋愯〃-' + + queryParams.enername + "> + <div class="table-box"> + <el-table :data="departmentList" show-summary> + <el-table-column label="鏈湡鏃堕棿" align="center" key="currentTime" prop="currentTime" + :show-overflow-tooltip="true" /> + <el-table-column :label="'鏈湡鑰�' + + queryParams.enername + + '(' + + queryParams.muid + + ')' + " align="center" key="currentValue" prop="currentValue" :show-overflow-tooltip="true" /> + <el-table-column label="鍚屾湡鏃堕棿" align="center" key="compareTime" prop="compareTime" + :show-overflow-tooltip="true" /> + <el-table-column :label="'鍚屾湡鑰�' + + queryParams.enername + + '(' + + queryParams.muid + + ')' + " align="center" key="contrastValues" prop="contrastValues" :show-overflow-tooltip="true" /> + <el-table-column :label="(queryParams.analysisType == 'YOY' ? '鍚�' : '鐜�') + '姣�(%)' + " align="center" key="ratio" prop="ratio" :show-overflow-tooltip="true" width="200" /> + </el-table> + </div> + </BaseCard> + <!-- </el-col> + </el-row> --> + </div> + </div> + </div> + </div> +</template> + +<script setup name="department"> +import { + listRegion, + listDepartment, + querySameCompareList, +} from "@/api/energyAnalysis/energyAnalysis"; +import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"; +import * as echarts from "echarts"; +const { proxy } = getCurrentInstance(); +const { period } = proxy.useDict("period"); +import { useRoute } from "vue-router"; +import useSettingsStore from "@/store/modules/settings"; +const settingsStore = useSettingsStore(); +watch( + () => settingsStore.sideTheme, + (val) => { + getList(); + } +); +const energyTypeList = ref(undefined); +const departmentList = ref([]); +const loading = ref(false); +const data = reactive({ + queryParams: { + nodeId: null, + timeType: null, + dataTime: null, + timeCode: null, + analysisType: "YOY", + energyType: null, + }, + query: { + modelCode: null, + }, +}); +const { queryParams, query } = toRefs(data); +/** 鑺傜偣鍗曞嚮浜嬩欢 */ +function handleNodeClick(data) { + queryParams.value.nodeId = data.id; + queryParams.value.nodeName = data.label; + handleTimeType(period.value[1].value); + listEnergyTypeList().then((res) => { + energyTypeList.value = res.data; + queryParams.value.energyType = energyTypeList.value[0].enersno; + queryParams.value.enername = energyTypeList.value[0].enername; + queryParams.value.muid = energyTypeList.value[0].muid; + handleQuery(); + }); +} +function handleTimeType(e) { + queryParams.value.timeType = e; + if(e=='MONTH'){ + queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM"); + }else if(e=='YEAR'){ + queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY"); + }else{ + queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM-DD"); + } + +} +function handleEnergyType(item) { + queryParams.value.enername = item.enername; + queryParams.value.muid = item.muid; + handleQuery(); +} +function handleAnalysisType(analysisType) { + queryParams.value.analysisType = analysisType; + getList(); +} +// 鑳借�楀姣斿垎鏋�-鍒楄〃 +function getList() { + loading.value = true; + // 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥 + if (echarts.getInstanceByDom(document.getElementById("Chart1"))) { + echarts.dispose(document.getElementById("Chart1")); + } + // if (echarts.getInstanceByDom(document.getElementById("Chart2"))) { + // echarts.dispose(document.getElementById("Chart2")); + // } + const myChart1 = echarts.init(document.getElementById("Chart1")); + // const myChart2 = echarts.init(document.getElementById("Chart2")); + querySameCompareList( + proxy.addDateRange({ + ...queryParams.value, + ...query.value, + }) + ).then((res) => { + if (!!res.code && res.code == 200) { + loading.value = false; + let xdata = []; + let yvalue = []; + let ycompareValue = []; + let yqoq = []; + if (!!res.data) { + res.data.map((item) => { + xdata.push( + proxy + .dayjs(item.currentTime) + .format( + queryParams.value.timeType == "YEAR"? "MM鏈�": queryParams.value.timeType =="MONTH"? "DD鏃�": "HH鏃�" + ) + ); + yvalue.push(!!item.currentValue ? item.currentValue : 0); + ycompareValue.push(!!item.contrastValues? item.contrastValues : 0); + yqoq.push(!!item.ratio ? item.ratio : 0); + }); + console.log(xdata) + } + setTimeout(() => { + myChart1.setOption({ + color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], + grid: { + top: "45", + left: "7%", + right: "5%", + bottom: "10", + containLabel: true, + }, + tooltip: { + trigger: "axis", + axisPointer: { + type: "shadow", + }, + }, + legend: { + icon: "rect", + itemWidth: 14, + itemHeight: 10, + textStyle: { + color: + settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + }, + }, + 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: xdata, + }, + yAxis: [ + { + type: "value", + name: + "鑰�" + + queryParams.value.enername + + "閲�(" + + queryParams.value.muid + + ")", + 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, + }, + }, + { + type: "value", + name: queryParams.value.analysisType == "YOY" ? "鍚屾瘮(%)" : "鐜瘮(%)", + alignTicks: true, + nameTextStyle: { + color: + settingsStore.sideTheme == "theme-dark" + ? "#FFFFFF" + : "#222222", + fontSize: 14, + padding: [0, 0, 5, 0], + }, + axisLine: { + show: false, + }, + axisTick: { + show: false, + }, + splitLine: { + show: true, + lineStyle: { + type: "dashed", + color: + settingsStore.sideTheme == "theme-dark" + ? "#FFFFFF" + : "#222222", + }, + }, + splitArea: { + show: false, + }, + axisLabel: { + color: + settingsStore.sideTheme == "theme-dark" + ? "#FFFFFF" + : "#222222", + fontSize: 14, + }, + }, + ], + series: [ + { + name: "鏈湡鍊�", + type: "bar", + barWidth: "8", + tooltip: { + valueFormatter: function (value) { + return value + queryParams.value.muid; + }, + }, + itemStyle: { + borderRadius: [15, 15, 0, 0], + }, + data: yvalue, + markPoint: { + data: [ + { type: "max", name: "Max" }, + { type: "min", name: "Min" }, + ], + }, + }, + { + name: "鍚屾湡鍊�", + type: "bar", + barWidth: "8", + tooltip: { + valueFormatter: function (value) { + return value + queryParams.value.muid; + }, + }, + itemStyle: { + borderRadius: [15, 15, 0, 0], + }, + data: ycompareValue, + markPoint: { + data: [ + { type: "max", name: "Max" }, + { type: "min", name: "Min" }, + ], + }, + }, + { + name: queryParams.value.analysisType == "YOY" ? "鍚屾瘮" : "鐜瘮", + type: "line", + yAxisIndex: 1, + symbol: "none", // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣 + tooltip: { + valueFormatter: function (value) { + return value + "%"; + }, + }, + data: yqoq, + }, + ], + }); + }, 100); + departmentList.value = !!res.data ? res.data : []; + window.addEventListener( + "resize", + () => { + myChart1.resize(); + }, + { passive: true } + ); + } + }); + // listDepartment( + // proxy.addDateRange({ + // ...queryParams.value, + // ...query.value, + // }) + // ).then((res) => { + // if (!!res.code && res.code == 200) { + // loading.value = false; + // let seriesdata = []; + // let xdata = []; + // if (!!energyTypeList.value) { + // energyTypeList.value.map((item) => { + // seriesdata.push({ + // name: item.enername, + // type: "bar", + // barWidth: "16", + // stack: "total", + // data: [], + // }); + // }); + // } + // if (!!res.data) { + // res.data.map((dataItem) => { + // xdata.push(dataItem.nodeName) + // seriesdata.forEach((seriesdataItem) => { + // if ( + // dataItem.data.find( + // (dataItemItem) => + // dataItemItem.energyTypeName == seriesdataItem.name + // ) == undefined + // ) { + // dataItem.data.push({ + // nodeId: dataItem.nodeId, + // nodeName: dataItem.nodeName, + // energyTypeNo: null, + // energyTypeName: seriesdataItem.name, + // energyConsumption: 0, + // }); + // } + // dataItem.data.map(dataItemItem => { + // if (seriesdataItem.name == dataItemItem.energyTypeName) { + // seriesdataItem.data.push(dataItemItem.energyConsumption) + // } + // }) + // }); + // }); + // } + // setTimeout(() => { + // myChart2.setOption({ + // color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], + // grid: { + // top: "45", + // left: "17%", + // right: "5%", + // bottom: "10", + // containLabel: true, + // }, + // tooltip: { + // trigger: "axis", + // axisPointer: { + // type: "shadow", + // }, + // }, + // legend: { + // icon: "rect", + // itemWidth: 14, + // itemHeight: 10, + // right: 0, + // textStyle: { + // color: + // settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + // }, + // }, + // xAxis: { + // nameLocation: "start", + // type: "value", + // name: "鍗曚綅tce", + // 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, + // // formatter: '{value} ml' + // }, + // }, + // yAxis: { + // 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: xdata.splice(0, 6), + // }, + // series: seriesdata, + // }); + // }, 100); + // window.addEventListener("resize", () => { + // myChart2.resize(); + // },{passive: true}); + // } + // }); +} +// 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-鎼滅储 +function handleQuery() { + getList(); +} +// 鑳借�楀姣斿垎鏋�-閲嶇疆 +function resetQuery() { + proxy.resetForm("queryRef"); + handleTimeType(period.value[1].value); + queryParams.value.energyType = energyTypeList.value[0].enersno; + queryParams.value.enername = energyTypeList.value[0].enername; + queryParams.value.muid = energyTypeList.value[0].muid; + queryParams.value.analysisType = "YOY"; + handleQuery(); +} +// 鑳借�楀姣斿垎鏋�-绉戝鑳借�楀垎鏋�-瀵煎嚭 +function handleExport() { + proxy.download( + "consumptionanalysis/energyExport", + { + ...queryParams.value, + ...query.value, + }, + `${queryParams.value.nodeName}-鍘傚尯鑳借�楀垎鏋恄${new Date().getTime()}.xlsx` + ); +} +</script> +<style scoped lang="scss"> +@import "@/assets/styles/page.scss"; +</style> diff --git a/zhitan-vue/src/views/poweranalysis/perPassu/index.vue b/zhitan-vue/src/views/poweranalysis/perPassu/index.vue new file mode 100644 index 0000000..a639577 --- /dev/null +++ b/zhitan-vue/src/views/poweranalysis/perPassu/index.vue @@ -0,0 +1,594 @@ +<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 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="energyType"> + <el-select v-model="queryParams.energyType" placeholder="鑳芥簮绫诲瀷" clearable style="width: 120px"> + <el-option :label="item.enername" :value="item.enersno" v-for="item in energyTypeList" + :key="item.enersno" @click="handleEnergyType(item)" /> + </el-select> + </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="queryParams.analysisType == 'YOY' ? 'primary' : ''" @click="handleAnalysisType('YOY')"> + 鍚屾瘮 + </el-button> + <el-button :type="queryParams.analysisType == 'MOM' ? 'primary' : ''" @click="handleAnalysisType('MOM')"> + 鐜瘮 + </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=" + height: calc(100vh - 220px) !important; + max-height: calc(100vh - 220px) !important; + overflow-y: auto; + " v-loading="loading"> + + <BaseCard :title="queryParams.nodeName + '-鑳借�楀姣斿垎鏋�'"> + <div class="chart-box"> + <div id="Chart1" /> + </div> + </BaseCard> + + <BaseCard :title="queryParams.nodeName + + '-鑳借�楀姣斿垎鏋愮幆姣斿垎鏋愯〃-' + + queryParams.enername + "> + <div class="table-box"> + <el-table :data="departmentList" show-summary> + <el-table-column label="鏈湡鏃堕棿" align="center" key="currentTime" prop="currentTime" + :show-overflow-tooltip="true" /> + <el-table-column :label="'鏈湡鑰�' + + queryParams.enername + + '(' + + queryParams.muid + + ')' + " align="center" key="currentValue" prop="currentValue" :show-overflow-tooltip="true" /> + <el-table-column label="鍚屾湡鏃堕棿" align="center" key="compareTime" prop="compareTime" + :show-overflow-tooltip="true" /> + <el-table-column :label="'鍚屾湡鑰�' + + queryParams.enername + + '(' + + queryParams.muid + + ')' + " align="center" key="contrastValues" prop="contrastValues" :show-overflow-tooltip="true" /> + <el-table-column :label="(queryParams.analysisType == 'YOY' ? '鍚�' : '鐜�') + '姣�(%)' + " align="center" key="ratio" prop="ratio" :show-overflow-tooltip="true" width="200" /> + </el-table> + </div> + </BaseCard> + <!-- </el-col> + </el-row> --> + </div> + </div> + </div> + </div> +</template> + +<script setup name="department"> +import { + listRegion, + listDepartment, + queryLoopCompareList, +} from "@/api/energyAnalysis/energyAnalysis"; +import { listEnergyTypeList } from "@/api/modelConfiguration/energyType"; +import * as echarts from "echarts"; +const { proxy } = getCurrentInstance(); +const { period } = proxy.useDict("period"); +import { useRoute } from "vue-router"; +import useSettingsStore from "@/store/modules/settings"; +const settingsStore = useSettingsStore(); +watch( + () => settingsStore.sideTheme, + (val) => { + getList(); + } +); +const energyTypeList = ref(undefined); +const departmentList = ref([]); +const loading = ref(false); +const data = reactive({ + queryParams: { + nodeId: null, + timeType: null, + dataTime: null, + analysisType: "MOM", + timeCode: null, + energyType: null, + }, + query: { + modelCode: null, + }, +}); +const { queryParams, query } = toRefs(data); +/** 鑺傜偣鍗曞嚮浜嬩欢 */ +function handleNodeClick(data) { + queryParams.value.nodeId = data.id; + queryParams.value.nodeName = data.label; + handleTimeType(period.value[1].value); + listEnergyTypeList().then((res) => { + energyTypeList.value = res.data; + queryParams.value.energyType = energyTypeList.value[0].enersno; + queryParams.value.enername = energyTypeList.value[0].enername; + queryParams.value.muid = energyTypeList.value[0].muid; + handleQuery(); + }); +} +function handleTimeType(e) { + queryParams.value.timeType = e; + if(e=='MONTH'){ + queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM"); + }else if(e=='YEAR'){ + queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY"); + }else{ + queryParams.value.timeCode = proxy.dayjs(new Date()).format("YYYY-MM-DD"); + } +} +function handleEnergyType(item) { + queryParams.value.enername = item.enername; + queryParams.value.muid = item.muid; + handleQuery(); +} +function handleAnalysisType(analysisType) { + queryParams.value.analysisType = analysisType; + getList(); +} +// 鑳借�楀姣斿垎鏋�-鍒楄〃 +function getList() { + loading.value = true; + // 鍦ㄥ垵濮嬪寲涔嬪墠锛屽厛dispose鏃х殑瀹炰緥 + if (echarts.getInstanceByDom(document.getElementById("Chart1"))) { + echarts.dispose(document.getElementById("Chart1")); + } + // if (echarts.getInstanceByDom(document.getElementById("Chart2"))) { + // echarts.dispose(document.getElementById("Chart2")); + // } + const myChart1 = echarts.init(document.getElementById("Chart1")); + // const myChart2 = echarts.init(document.getElementById("Chart2")); + queryLoopCompareList( + proxy.addDateRange({ + ...queryParams.value, + ...query.value, + }) + ).then((res) => { + if (!!res.code && res.code == 200) { + loading.value = false; + let xdata = []; + let yvalue = []; + let ycompareValue = []; + let yqoq = []; + if (!!res.data) { + res.data.map((item) => { + xdata.push( + proxy + .dayjs(item.currentTime) + .format( + queryParams.value.timeType == "YEAR" + ? "MM鏈�" + : queryParams.value.timeType == "MONTH" + ? "DD鏃�" + : "HH鏃�" + ) + ); + yvalue.push(!!item.currentValue ? item.currentValue : 0); + ycompareValue.push(!!item.contrastValues ? item.contrastValues : 0); + yqoq.push(!!item.ratio ? item.ratio : 0); + }); + } + setTimeout(() => { + myChart1.setOption({ + color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], + grid: { + top: "45", + left: "7%", + right: "5%", + bottom: "10", + containLabel: true, + }, + tooltip: { + trigger: "axis", + axisPointer: { + type: "shadow", + }, + }, + legend: { + icon: "rect", + itemWidth: 14, + itemHeight: 10, + textStyle: { + color: + settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + }, + }, + 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: xdata, + }, + yAxis: [ + { + type: "value", + name: + "鑰�" + + queryParams.value.enername + + "閲�(" + + queryParams.value.muid + + ")", + 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, + }, + }, + { + type: "value", + name: queryParams.value.analysisType == "YOY" ? "鍚屾瘮(%)" : "鐜瘮(%)", + alignTicks: true, + nameTextStyle: { + color: + settingsStore.sideTheme == "theme-dark" + ? "#FFFFFF" + : "#222222", + fontSize: 14, + padding: [0, 0, 5, 0], + }, + axisLine: { + show: false, + }, + axisTick: { + show: false, + }, + splitLine: { + show: true, + lineStyle: { + type: "dashed", + color: + settingsStore.sideTheme == "theme-dark" + ? "#FFFFFF" + : "#222222", + }, + }, + splitArea: { + show: false, + }, + axisLabel: { + color: + settingsStore.sideTheme == "theme-dark" + ? "#FFFFFF" + : "#222222", + fontSize: 14, + }, + }, + ], + series: [ + { + name: "鏈湡鍊�", + type: "bar", + barWidth: "8", + tooltip: { + valueFormatter: function (value) { + return value + queryParams.value.muid; + }, + }, + itemStyle: { + borderRadius: [15, 15, 0, 0], + }, + data: yvalue, + markPoint: { + data: [ + { type: "max", name: "Max" }, + { type: "min", name: "Min" }, + ], + }, + }, + { + name: "鍚屾湡鍊�", + type: "bar", + barWidth: "8", + tooltip: { + valueFormatter: function (value) { + return value + queryParams.value.muid; + }, + }, + itemStyle: { + borderRadius: [15, 15, 0, 0], + }, + data: ycompareValue, + markPoint: { + data: [ + { type: "max", name: "Max" }, + { type: "min", name: "Min" }, + ], + }, + }, + { + name: queryParams.value.analysisType == "YOY" ? "鍚屾瘮" : "鐜瘮", + type: "line", + yAxisIndex: 1, + symbol: "none", // 璁剧疆涓� 'none' 鍘绘帀鍦嗙偣 + tooltip: { + valueFormatter: function (value) { + return value + "%"; + }, + }, + data: yqoq, + }, + ], + }); + }, 100); + departmentList.value = !!res.data ? res.data : []; + window.addEventListener( + "resize", + () => { + myChart1.resize(); + }, + { passive: true } + ); + } + }); + // listDepartment( + // proxy.addDateRange({ + // ...queryParams.value, + // ...query.value, + // }) + // ).then((res) => { + // if (!!res.code && res.code == 200) { + // loading.value = false; + // let seriesdata = []; + // let xdata = []; + // if (!!energyTypeList.value) { + // energyTypeList.value.map((item) => { + // seriesdata.push({ + // name: item.enername, + // type: "bar", + // barWidth: "16", + // stack: "total", + // data: [], + // }); + // }); + // } + // if (!!res.data) { + // res.data.map((dataItem) => { + // xdata.push(dataItem.nodeName) + // seriesdata.forEach((seriesdataItem) => { + // if ( + // dataItem.data.find( + // (dataItemItem) => + // dataItemItem.energyTypeName == seriesdataItem.name + // ) == undefined + // ) { + // dataItem.data.push({ + // nodeId: dataItem.nodeId, + // nodeName: dataItem.nodeName, + // energyTypeNo: null, + // energyTypeName: seriesdataItem.name, + // energyConsumption: 0, + // }); + // } + // dataItem.data.map(dataItemItem => { + // if (seriesdataItem.name == dataItemItem.energyTypeName) { + // seriesdataItem.data.push(dataItemItem.energyConsumption) + // } + // }) + // }); + // }); + // } + // setTimeout(() => { + // myChart2.setOption({ + // color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"], + // grid: { + // top: "45", + // left: "17%", + // right: "5%", + // bottom: "10", + // containLabel: true, + // }, + // tooltip: { + // trigger: "axis", + // axisPointer: { + // type: "shadow", + // }, + // }, + // legend: { + // icon: "rect", + // itemWidth: 14, + // itemHeight: 10, + // right: 0, + // textStyle: { + // color: + // settingsStore.sideTheme == "theme-dark" ? "#FFFFFF" : "#222222", + // }, + // }, + // xAxis: { + // nameLocation: "start", + // type: "value", + // name: "鍗曚綅tce", + // 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, + // // formatter: '{value} ml' + // }, + // }, + // yAxis: { + // 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: xdata.splice(0, 6), + // }, + // series: seriesdata, + // }); + // }, 100); + // window.addEventListener("resize", () => { + // myChart2.resize(); + // },{passive: true}); + // } + // }); +} +// 鑳借�楀姣斿垎鏋�-鎼滅储 +function handleQuery() { + getList(); +} +// 鑳借�楀姣斿垎鏋�-閲嶇疆 +function resetQuery() { + proxy.resetForm("queryRef"); + handleTimeType(period.value[1].value); + queryParams.value.energyType = energyTypeList.value[0].enersno; + queryParams.value.enername = energyTypeList.value[0].enername; + queryParams.value.muid = energyTypeList.value[0].muid; + queryParams.value.analysisType = "MOM"; + handleQuery(); +} +// 鑳借�楀姣斿垎鏋�-瀵煎嚭 +function handleExport() { + proxy.download( + "consumptionanalysis/energyExport", + { + ...queryParams.value, + ...query.value, + }, + `${queryParams.value.nodeName}-鍘傚尯鑳借�楀垎鏋恄${new Date().getTime()}.xlsx` + ); +} +</script> +<style scoped lang="scss"> +@import "@/assets/styles/page.scss"; +</style> diff --git a/zhitan-vue/vite.config.js b/zhitan-vue/vite.config.js index f1ee7d7..1357748 100644 --- a/zhitan-vue/vite.config.js +++ b/zhitan-vue/vite.config.js @@ -4,7 +4,9 @@ // https://vitejs.dev/config/ export default defineConfig(({ mode, command }) => { + mode='production' const env = loadEnv(mode, process.cwd()) + console.log(mode,'==========env') const { VITE_APP_ENV } = env return { // 閮ㄧ讲鐢熶骇鐜鍜屽紑鍙戠幆澧冧笅鐨刄RL銆� -- Gitblit v1.9.3