hwj_system
/
scmy
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/master'

Browse Source
master
魔神煜修罗皇 2 years ago
parent 4727db76b1 e925784190
commit 89ed1c3a0c
3 changed files with 165 additions and 61 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 8
      psdc-ui/src/api/analyse/nhfx/nhfx.js
  2. 147
      psdc-ui/src/views/analyse/nhfx/index.vue
  3. 71
      psdc-ui/src/views/analyse/nhtj/index.vue

8
psdc-ui/src/api/analyse/nhfx/nhfx.js
Unescape View File

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

147
psdc-ui/src/views/analyse/nhfx/index.vue
Unescape View File

@ -1,11 +1,17 @@
<template>
<div class="app-container home">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane label="同比分析" name="first">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleTabClick">
<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><el-button type="primary" @click="lastDay"><el-icon><ArrowLeft /></el-icon>上一日</el-button></el-form-item>
<el-form-item><el-button type="primary" @click="nextDay">下一日<el-icon><ArrowRight /></el-icon></el-button></el-form-item>
<el-form-item label="耗能设备" prop="week">
<el-select v-model="selectDevice" placeholder="请选择" @change="handleDevChange" style="width: 240px">
<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="relative"/>
<el-table-column label="增加值" align="center" prop="addUp"/>
<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 current = dateValue1.value;
const previous = new Date(current.getFullYear(), current.getMonth(), current.getDate() - 1);
dateValue1.value = previous;
//渲染设备列表
const selectDevice = ref()
const deviceName = ref([])
function getDeviceList(){
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);
dateValue1.value = next;
//切换年份处理
const dateValue1 = ref(new Date().getFullYear().toString());
//上一年
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([
{month:'01月', currentPeriod: '1265', theSameTerm:'3254', yearOnYear:'30', totalYearOnYear:'32'}
])
const hbfxDataTable = ref([])
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{

71
psdc-ui/src/views/analyse/nhtj/index.vue
Unescape View File

@ -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 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-option v-for="item in deviceName" :key="item.deviceId" :label="item.deviceName" :value="item.deviceId" />
</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"
range-separator="-" start-placeholder="开始日期"
end-placeholder="结束日期"></el-date-picker>
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" 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,12 +225,14 @@ const handleCurrentChange = (val) => {
const title = ref()
const open = ref(false)
const chartDataArr = ref([])
const showDevName = ref()
function handleChart(scope){
open.value = true;
delete scope.row.dayDate
delete scope.row.dayId
delete scope.row.deviceId
delete scope.row.deviceName
showDevName.value = scope.row.deviceName
delete scope.row.dayDate
delete scope.row.dayId
delete scope.row.deviceId
delete scope.row.deviceName
for(let i in scope.row){
chartDataArr.value.push(scope.row[i])
}
@ -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(() => {
myChart.dispose(); // 销毁实例，防止内存泄漏
});
// onBeforeUnmount(() => {
// myChart.dispose(); // 销毁实例，防止内存泄漏
// });

Write Preview
Loading…
Cancel
Save