Merge remote-tracking branch 'origin/master'

psdc-ui/src/api/analyse/nhfx/nhfx.js

@@ -0,0 +1,8 @@
+import request from '@/utils/request'
+
+
+
+/** 计算环比分析*/
+export function getHuanbiFx(data) {
+    return request.post('/evaluate/analysis/linkRelativeRatio',data)
+}

psdc-ui/src/views/analyse/nhfx/index.vue

@@ -1,11 +1,17 @@
 <template>
   <div class="app-container home">
-    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
+    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleTabClick">
-      <el-tab-pane label="同比分析" name="first">
+      <el-tab-pane label="同比分析" name="同比分析">
         <el-form :inline="true" class="demo-form-inline">
-            <el-form-item label="日期："><el-date-picker v-model="dateValue1" type="date" placeholder="请选择日期" size="default"/></el-form-item>
+          <el-form-item label="耗能设备" prop="week">
-            <el-form-item><el-button type="primary" @click="lastDay"><el-icon><ArrowLeft /></el-icon>上一日</el-button></el-form-item>
+            <el-select v-model="selectDevice" placeholder="请选择" @change="handleDevChange" style="width: 240px">
-            <el-form-item><el-button type="primary" @click="nextDay">下一日<el-icon><ArrowRight /></el-icon></el-button></el-form-item>
+              <el-option label="所有" value="0" />
+              <el-option v-for="item in deviceName" :key="item.deviceId" :label="item.deviceName" :value="item.deviceId" />
+            </el-select>
+          </el-form-item>
+            <el-form-item label="日期："><el-date-picker v-model="dateValue1" format="YYYY" value-format="YYYY" type="year" placeholder="请选择日期" size="default"/></el-form-item>
+            <el-form-item><el-button type="primary" @click="lastYear"><el-icon><ArrowLeft /></el-icon>上一年</el-button></el-form-item>
+            <el-form-item><el-button type="primary" @click="nextYear">下一年<el-icon><ArrowRight /></el-icon></el-button></el-form-item>
             <el-form-item><el-button type="primary" icon="Search" @click="handleQuery1">查询</el-button></el-form-item>
         </el-form>
         <div class="chartBox">
@@ -36,7 +42,7 @@
 
 
 
-      <el-tab-pane label="环比分析" name="second">
+      <el-tab-pane label="环比分析" name="环比分析">
 <!--        @submit.native.prevent阻止默认提交事件-->
         <el-form :inline="true" class="demo-form-inline" @submit.native.prevent>
           <el-form-item class="mr0"><button class="myBtn btn1" :class="{active : activeIndex === 0}" @click="handleDaily">按日</button></el-form-item>
@@ -46,11 +52,11 @@
         </el-form>
         <div class="tableBox2">
           <el-table :data="hbfxDataTable">
-            <el-table-column label="用能设备" align="center" prop="type"/>
+            <el-table-column label="用能设备" align="center" prop="deviceName"/>
             <el-table-column :label="label1" align="center" :prop="prop1"/>
             <el-table-column :label="label2" align="center" :prop="prop2"/>
-            <el-table-column label="增加值" align="center" prop="addValue"/>
+            <el-table-column label="增加值" align="center" prop="addUp"/>
-            <el-table-column label="环比(%)" align="center" prop="relative"/>
+            <el-table-column label="环比(%)" align="center" prop="compute"/>
             <el-table-column label="操作" align="center">
               <template v-slot="scope">
                 <el-button type="primary" size="small" :icon="Histogram" @click="handleChart">图表</el-button>
@@ -70,10 +76,11 @@
               @current-change="hbfxHandleCurrentChange"/>
         </div>
         <!-- 生成图表弹出窗 -->
-        <el-dialog class="mrt" :title="title" v-model="open" width="1000px" append-to-body>
+        <el-dialog class="mrt" :title="title" v-model="open" width="1000px" append-to-body :close-on-click-modal="false" :show-close="false">
           <div class="chartBox">
             <div id="chart"></div>
           </div>
+          <el-button class="floatRight" @click=close>关闭</el-button>
         </el-dialog>
       </el-tab-pane>
 
@@ -83,25 +90,63 @@
 
 <script setup name="Index">
 import {Histogram} from '@element-plus/icons-vue'
-import {ref,reactive} from "vue";
+import {ref,reactive,onMounted,nextTick } from "vue";
+import { getHuanbiFx } from "@/api/analyse/nhfx/nhfx"
+import { getDevice } from "@/api/control/manual"
 
+onMounted(async () => {
+  await nextTick();
+  // 在这里进行el-tabs的初始化操作
+  formattedDateFun()
+  getDeviceList()
+})
+
+/** 格式化日期*/
+let year, month ,day;
+function formattedDateFun(){
+  let date = new Date()
+  year = date.getFullYear()
+  month = (date.getMonth()+1).toString().padStart(2, '0');
+  day = date.getDate().toString().padStart(2, '0');
+  dateValue2.value = `${year}-${month}-${day}`
+  // let hours = date.getHours()
+  // let minutes = date.getMinutes()
+  // let seconds = date.getSeconds()
+  // timer.value = `${hours}:${minutes}:${seconds}`
+  // console.log(dateValue2.value)
+  // console.log(timer.value)
+}
 
 /** 切换按钮操作*/
-const activeName = ref('first')
+const activeName = ref('同比分析')
 
 /** ----------同比分析----------*/
 /** 过滤查询*/
-const dateValue1 = ref(new Date())
+//渲染设备列表
-function lastDay(){
+const selectDevice = ref()
-  const current = dateValue1.value;
+const deviceName = ref([])
-  const previous = new Date(current.getFullYear(), current.getMonth(), current.getDate() - 1);
+function getDeviceList(){
-  dateValue1.value = previous;
+  getDevice().then((res)=>{
+    deviceName.value = res.data
+    console.log(deviceName.value)
+  })
 }
-function nextDay(){
+
-  const current = dateValue1.value;
+//切换年份处理
-  const next = new Date(current.getFullYear(), current.getMonth(), current.getDate() + 1);
+const dateValue1 = ref(new Date().getFullYear().toString());
-  dateValue1.value = next;
+//上一年
+function lastYear(){
+  const year = parseInt(dateValue1.value);
+  dateValue1.value = (year - 1).toString();
+  console.log('上一年',dateValue1.value)
 }
+//下一年
+function nextYear(){
+  const year = parseInt(dateValue1.value);
+  dateValue1.value = (year + 1).toString();
+  console.log('下一年',dateValue1.value)
+}
+//查询
 function handleQuery1(){}
 
 /** 数据表格处理*/
@@ -129,39 +174,60 @@ const tbfxHandleCurrentChange = (val) => {
 
 
 /** ----------环比分析----------*/
+/** 点击环比分析*/
+function handleTabClick(e){
+  console.log(e.paneName)
+  if(e.paneName == '环比分析'){
+    handleDaily()
+  }
+
+}
+
 /** 过滤查询*/
 const activeIndex = ref(0)
 const dateValue2 = ref()
 const dateType = ref('date')
 const format = ref('YYYY-MM-DD')
 const valueFormat = ref('YYYY-MM-DD')
+const timeType = ref(1)
+//按日
 function handleDaily(){
   activeIndex.value = 0;
-  prop1.value = 'toDay'
+  prop1.value = 'thisMonthTotal'
   label1.value = '当日用电/kWh'
-  prop2.value = 'lastDay'
+  prop2.value = 'lastMonthTotal'
   label2.value = '上日用电/kWh';
   dateType.value = 'date'
   format.value = 'YYYY-MM-DD'
   valueFormat.value = 'YYYY-MM-DD'
+  timeType.value = 1
+  dateValue2.value = `${year}-${month}-${day}`
+  console.log(dateValue2.value)
+  getHuanbiFxFun()
 }
+//按月
 function handleMonthly(){
   activeIndex.value = 1;
-  prop1.value = 'toMonth'
+  prop1.value = 'thisMonthTotal'
   label1.value = '当月用电/kWh'
-  prop2.value = 'lastMonth'
+  prop2.value = 'lastMonthTotal'
   label2.value = '上月用电/kWh';
   dateType.value = 'month'
   format.value = 'YYYY-MM'
   valueFormat.value = 'YYYY-MM'
+  timeType.value = 2
+  dateValue2.value = `${year}-${month}`
+  console.log(dateValue2.value)
+  getHuanbiFxFun()
+}
+//查询
+function handleQuery2(){
+  getHuanbiFxFun()
 }
-function handleQuery2(){}
 
 /** 数据表格处理*/
 //内容
-const hbfxDataTable = reactive([
+const hbfxDataTable = ref([])
-  {month:'01月', currentPeriod: '1265', theSameTerm:'3254', yearOnYear:'30', totalYearOnYear:'32'}
-])
 const prop1 = ref('toDay')
 const label1 = ref('当日用电/kWh')
 const prop2 = ref('lastDay')
@@ -177,14 +243,31 @@ const hbfxHandleSizeChange = (val) => {
 const hbfxHandleCurrentChange = (val) => {
   console.log(`${val}`)
 }
+//获取环比分析表格数据
+function getHuanbiFxFun(){
+  getHuanbiFx({
+    "timeType":timeType.value,
+    "datetime":dateValue2.value
+  }).then((res)=>{
+    if(res.code == 200){
+      hbfxDataTable.value = res.data
+    }
+  })
+}
 
 /** 生成图表按鈕操作*/
 const title = ref()
 const open = ref(false)
 function handleChart(){
   open.value = true;
-  console.log('图表按钮')
+
+
 };
+//关闭弹框按钮
+function close(){
+  open.value = false;
+}
+
 
 
 
@@ -244,7 +327,9 @@ function handleChart(){
   background-color: #409EFF !important;
   color: #fff !important;
 }
-
+.floatRight{
+  margin-left: 90%;
+}
 
 
 ::v-deep .el-tabs__item{

psdc-ui/src/views/analyse/nhtj/index.vue

@@ -11,19 +11,11 @@
           <el-form-item label="耗能设备" prop="week">
             <el-select v-model="filterForm.dev" placeholder="请选择" @change="handleDevChange" style="width: 240px">
               <el-option label="所有" value="0" />
-              <el-option label="电磁锅炉" value="1" />
+              <el-option v-for="item in deviceName" :key="item.deviceId" :label="item.deviceName" :value="item.deviceId" />
-              <el-option label="蓄热锅炉" value="2" />
-              <el-option label="风机盘管" value="3" />
-              <el-option label="空气源热泵" value="4" />
-              <el-option label="发热电缆" value="5" />
-              <el-option label="水泵" value="6" />
-              <el-option label="沙盘" value="7" />
             </el-select>
           </el-form-item>
           <el-form-item label="时段" style="width: 308px;">
-            <el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange"
+            <el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
-                            range-separator="-" start-placeholder="开始日期"
-                            end-placeholder="结束日期"></el-date-picker>
           </el-form-item>
           <el-form-item>
             <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
@@ -67,7 +59,7 @@
 
 
     <!-- 生成图表弹出窗 -->
-    <el-dialog class="mrt" :title="title" v-model="open" width="1000px" append-to-body>
+    <el-dialog class="mrt" :title="title" v-model="open" width="1000px" append-to-body :close-on-click-modal="false" :show-close="false">
       <div class="chartBox">
         <div id="chart"></div>
       </div>
@@ -81,12 +73,14 @@
 import {Delete,Histogram} from '@element-plus/icons-vue'
 import {ref, reactive, onMounted, watch,onBeforeUnmount} from "vue";
 import {getTable} from '@/api/analyse/nhtj/nhtj'
+import { getDevice } from "@/api/control/manual"
 import * as echarts from "echarts";
 
 /** 页面加载时*/
 onMounted(()=>{
   formattedDateFun();
   getTableFun();
+  getDeviceList()
 })
 
 
@@ -109,14 +103,29 @@ function formattedDateFun(){
 
 
 /** 筛选处理 */
+//渲染设备列表
+const deviceName = ref([])
+function getDeviceList(){
+  getDevice().then((res)=>{
+    deviceName.value = res.data
+  })
+}
+
 const dateRange = ref([]);
 const startDate = ref()
 const endDate = ref()
 const data = reactive({
   filterForm: {
-    dev: '',
+    dev: '0',
   }
 });
+//拿到耗能设备的devid
+const checkDevId = ref();
+function handleDevChange(devid){
+  console.log('点击的devid：',devid)
+  checkDevId.value = devid
+}
+
 //监听日期选择
 const wacthSelectDate = watch(()=> dateRange.value,(val) =>{
   console.log(val[0])
@@ -130,10 +139,15 @@ function handleQuery(){
 }
 //重置按钮
 function resetQuery(){
-  dateRange.value = []
+  dateRange.value = [];
+  currentPage.value = 1
+  pageSize.value = 10
+  data.filterForm.dev = '0'
+  checkDevId.value = null
   getTable({
+    "deviceId":null,
     "timeType":activeIndex.value,
-    "startTime":'2023-01-01',
+    "startTime":null,
     "endTime":YYYYMMDD.value,
     "pageNum": 1,
     "pageSize": 10
@@ -181,16 +195,11 @@ const small = ref(false)
 const background = ref(false)
 const disabled = ref(false)
 const total = ref()
-//拿到下拉条的devid
+
-let checkDevId;
-function handleDevChange(devid){
-  console.log(devid)
-  checkDevId = devid
-}
 //获取表格数据
 function getTableFun(){
   getTable({
-    "deviceId":checkDevId,
+    "deviceId":checkDevId.value,
     "timeType":activeIndex.value,
     "startTime":startDate.value,
     "endTime":endDate.value,
@@ -216,8 +225,10 @@ const handleCurrentChange = (val) => {
 const title = ref()
 const open = ref(false)
 const chartDataArr = ref([])
+const showDevName = ref()
 function handleChart(scope){
   open.value = true;
+  showDevName.value = scope.row.deviceName
   delete scope.row.dayDate
   delete scope.row.dayId
   delete scope.row.deviceId
@@ -240,7 +251,7 @@ function eleBarChartFun(){
   const option = {
     title: {},
     legend: {
-      data: ["用电量"],
+      data: [`用电量（${showDevName.value}）`],
       // selectedMode: 'single',
       textStyle: {
         color: "#333"
@@ -304,7 +315,7 @@ function eleBarChartFun(){
     },
     series: [
       {
-        name: "用电量",
+        name: `用电量（${showDevName.value}）`,
         type: "bar",
         data: chartDataArr.value,
         itemStyle:{
@@ -422,9 +433,9 @@ function handleMonth() {
 
 
 /** 页面销毁时*/
-onBeforeUnmount(() => {
+// onBeforeUnmount(() => {
-  myChart.dispose(); // 销毁实例，防止内存泄漏
+//   myChart.dispose(); // 销毁实例，防止内存泄漏
-});
+// });