luoshiwen
/
long_IslandOcean
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' of http://172.16.1.12/luoshiwen/long_IslandOcean

This commit is contained in:
lixiaobang 2024-03-14 09:17:55 +08:00
parent 0d6dd4a4d7 15026f7ed5
commit 699d4d39fd
13 changed files with 503 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/ChangDaobuild/Build/build.data.unityweb
View File

Binary file not shown.

BIN
public/ChangDaobuild/Build/build.framework.js.unityweb
View File

Binary file not shown.

BIN
public/ChangDaobuild/Build/build.wasm.unityweb
View File

Binary file not shown.

9
public/ChangDaobuild/index.html
View File

@ -7,13 +7,11 @@
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
</head>
<style>
body,html{
<style>body,html{
width: 100%;
height: 100%;
overflow: hidden;
}
</style>
}</style>
<body>
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%">
<canvas id="unity-canvas" style="width: 100%;height: 100%"></canvas>
@ -105,9 +103,8 @@
}
loadingBar.style.display = "block";
var script = document.createElement("script");
var unityInstanceA
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
createUnityInstance(canvas, config, (progress) => {

50
src/api/air-conditioning.js Normal file
View File

@ -0,0 +1,50 @@
// 空调接口
import http from '@/utils/http'
// 获取概况
export function getGeneralSituation(params){
return http({
url:'/api/GetGeneralSituation',
method:'get',
params
})
}
// 获取用电情况
export function getElectricalCondition(params){
return http({
url:'/api/GetElectricalCondition',
method:'get',
params
})
}
// 获取故障情况
export function getFailureWarning(params){
return http({
url:'/api/GetFailureWarning',
method:'get',
params
})
}
// 获取开机策略
export function getBootStrategy(params){
return http({
url:'/api/GetBootStrategy',
method:'get',
params
})
}
// 获取维护提醒
export function getMaintenanceReminder(params){
return http({
url:'/api/GetMaintenanceReminder',
method:'get',
params
})
}
// 获取策略编辑
export function getPolicyEditing(params){
return http({
url:'/api/GetPolicyEditing',
method:'get',
params
})
}

10
src/api/drainage.js Normal file
View File

@ -0,0 +1,10 @@
// 排水接口
import http from '@/utils/http'
// 获取能耗总量
export function getWaterDraining(params){
return http({
url:'/api/GetWaterDraining',
method:'get',
params
})
}

50
src/api/energyEfficiency.js Normal file
View File

@ -0,0 +1,50 @@
// 能效接口
import http from '@/utils/http'
// 获取能耗总量
export function getTotalEnergy(params){
return http({
url:'/api/GetTotalEnergy',
method:'get',
params
})
}
// 获取能效对标
export function getEnergyIndexing(params){
return http({
url:'/api/GetEnergyIndexing',
method:'get',
params
})
}
// 获取能源流向
export function getEnergyFlow(params){
return http({
url:'/api/GetEnergyFlow',
method:'get',
params
})
}
// 获取各系统能耗情况
export function getSystemEnergy(params){
return http({
url:'/api/GetSystemEnergy',
method:'get',
params
})
}
// 获取复费率
export function getMultiRate(params){
return http({
url:'/api/GetMultiRate',
method:'get',
params
})
}
// 获取电费电价
export function getElectricityRate(params){
return http({
url:'/api/GetElectricityRate',
method:'get',
params
})
}

51
src/api/energyMonitoring.js Normal file
View File

@ -0,0 +1,51 @@
// 用能检测api
import http from '@/utils/http'
// 获取实时负荷
export function getRealLoad(params){
console.log(params,http);
return http({
url:'/api/GetRealLoad',
method:'get',
params
})
}
// 获取当日累计用电量
export function getDailyElectricity(params){
return http({
url:'/api/GetDailyElectricity',
method:'get',
params
})
}
// 获取负荷分类
export function getLoadClassification(params){
return http({
url:'/api/GetLoadClassification',
method:'get',
params
})
}
// 获取空调负荷
export function getAirconditioningLoad(params){
return http({
url:'/api/GetAirconditioningLoad',
method:'get',
params
})
}
// 获取展陈负荷
export function getDisplayLoad(params){
return http({
url:'/api/GetDisplayLoad',
method:'get',
params
})
}
// 获取配电室回路排名
export function getLoopRanking(params){
return http({
url:'/api/GetLoopRanking',
method:'get',
params
})
}

83
src/views/air-conditioning/index.vue
View File

@ -2,6 +2,7 @@
import {ref, reactive,onMounted} from "vue";
import getPath from "@/utils/getPath.js";
import dialogBox from './components/dialogBox.vue'
import {getGeneralSituation,getElectricalCondition,getFailureWarning,getBootStrategy,getMaintenanceReminder,getPolicyEditing} from '@/api/air-conditioning'
const systemNumList = ref([
{
name: '运行设备数量',
@ -53,7 +54,7 @@ const electricityContent = ref([
unit:"kWh",
},
{
name:'本月用电费用',
name:'本年用电费用',
value:66,
unit:"万元",
},
@ -170,8 +171,79 @@ const closeDialog = (val) =>{
const controlBtn = ref('on')
const toggleControl = (event) => {
controlBtn.value = event.srcElement.className
maintenanceReminderInterface()
}
// 获取概况数据
const generalSituationInterface = () =>{
getGeneralSituation().then(res=>{
systemNumList.value[0].num = res.data[0].Operation
systemNumList.value[1].num = res.data[0].Stop
overviewList.value[0].num = res.data[0].Area / 10000
overviewList.value[1].num = res.data[0].Amount
})
}
// 获取故障报警
const failureWarningInterface = () =>{
getFailureWarning().then(res=>{
faultList.value = res.data.map(el=>{
return {
name:el.FailureWarning,
date:el.FailureTime
}
})
})
}
// 获取用电情况数据
const electricalConditionInterface = () =>{
getElectricalCondition().then(res=>{
// 今日
electricityContent.value[0].value = res.data[0].EH
electricityContent.value[1].value = res.data[0].Electricity
// 本月
electricityContent.value[2].value = res.data[1].EH
electricityContent.value[3].value = res.data[1].Electricity
// 本年
electricityContent.value[4].value = res.data[2].EH
electricityContent.value[5].value = res.data[2].Electricity
})
}
// 开机策略
const bootStrategyInterface = () =>{
getBootStrategy().then(res=>{
runTimeList.value = res.data.map(el=>{
return {
name:el.StrategyName,
value:el.StrategyState
}
})
})
}
// 维护提醒
const maintenanceReminderInterface = () =>{
console.log(controlBtn.value);
let params = {
name: controlBtn.value === 'on' ? '已超期':'即将开始'
}
getMaintenanceReminder(params).then(res=>{
maintenanceList.value = res.data.map(el=>{
return {
name:el.DeviceName,
date:el.OverDue
}
})
})
}
onMounted(()=>{
// 概况接口
generalSituationInterface()
// 用电接口
electricalConditionInterface()
// 故障报警接口
failureWarningInterface()
// 开机策略接口
bootStrategyInterface()
// 维护提醒接口
maintenanceReminderInterface()
})
</script>
@ -231,7 +303,7 @@ onMounted(()=>{
<div class="title margin10">
<span>故障报警</span>
</div>
<div id="fault" class="margin10 box-bg">
<div id="fault" class="margin10 box-bg" >
<p v-for="s in faultList">
<span class="name">{{s.name}}</span>
<span class="date">时间：{{s.date}}</span>
@ -409,13 +481,18 @@ onMounted(()=>{
}
}
//故障
#fault::-webkit-scrollbar{
display:none;
}
#fault{
padding: 0 1rem;
overflow-y:scroll;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
align-content: space-evenly;
// align-content: space-evenly;
p{
margin:.8rem;
width: 100%;
height: 20%;
background-image: url("@/assets/images/air-conditioning/fault.png");

25
src/views/drainage/index.vue
View File

@ -1,6 +1,6 @@
<script setup>
import {ref} from "vue";
import {ref,onMounted} from "vue";
import {getWaterDraining} from '@/api/drainage'
const operationLeftList = ref([
{
name: '1号排水点',
@ -187,7 +187,26 @@ const operationRightList = ref([
]
},
])
const waterDrainingInterface = () =>{
getWaterDraining().then(res=>{
operationLeftList.value = res.data.slice(0,7).map(el=>{
return {
name:el.WaterName,
children:el.list
}
})
operationRightList.value = res.data.slice(7).map(el=>{
return {
name:el.WaterName,
children:el.list
}
})
})
}
// dom挂载
onMounted(()=>{
waterDrainingInterface()
})
</script>

148
src/views/energyEfficiency/index.vue
View File

@ -1,6 +1,7 @@
<script setup>
import { ref, onMounted } from "vue";
import * as echarts from "echarts";
import { getTotalEnergy,getEnergyIndexing,getEnergyFlow,getSystemEnergy,getMultiRate,getElectricityRate } from "@/api/energyEfficiency";
// 各系统能耗概况
const systemTab = [
{ name: "空调" },
@ -10,6 +11,7 @@ const systemTab = [
{ name: "电梯" },
];
const systemTabIndex = ref(0);
const systemTabName = ref('空调');
const systemLeftList = ref([
{
name: "今日用能峰值",
@ -78,24 +80,27 @@ const systemRightList = ref([
const totalEnergyDate = ref("month");
const toggleTotalEnergy = (event) => {
totalEnergyDate.value = event.srcElement.className;
totalEnergyInterface()
};
// 能效对标时间点击时间
const managementDate = ref("month");
const toggleManagement = (event) => {
managementDate.value = event.srcElement.className;
energyIndexingInterface()
};
// 复费率的时间点击事件
const exhibitionLoadDate = ref("month");
const toggleExhibitionLoad = (event) => {
exhibitionLoadDate.value = event.srcElement.className;
};
const selectSystemTab = (index) => {
const selectSystemTab = (item,index) => {
systemTabIndex.value = index;
systemTabName.value = item
};
// 能耗总量echarts
const drawTotalChart = () => {
const drawTotalChart = (data) => {
let myChart = echarts.init(document.getElementById("totalEnergy"));
const option = {
// backgroundColor: "#05224d",
@ -129,21 +134,22 @@ const drawTotalChart = () => {
axisTick: { show: false },
boundaryGap: true,
data: [
"11-01",
"11-02",
"11-03",
"11-04",
"11-05",
"11-07",
"11-08",
"11-09",
"11-10",
"11-11",
"11-12",
"11-13",
"11-14",
],
// data: [
// "11-01",
// "11-02",
// "11-03",
// "11-04",
// "11-05",
// "11-07",
// "11-08",
// "11-09",
// "11-10",
// "11-11",
// "11-12",
// "11-13",
// "11-14",
// ],
data:data.map(el=>{return el.time})
},
],
yAxis: [
@ -204,7 +210,8 @@ const drawTotalChart = () => {
shadowColor: "rgba(53,142,215, 0.9)", //阴影颜色
shadowBlur: 20, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
data: [100, 200, 300, 282, 283, 166, 100, 200, 300, 282, 283, 166, 283],
// data: [100, 200, 300, 282, 283, 166, 100, 200, 300, 282, 283, 166, 283],
data:data.map(el=>{return el.EH})
},
],
};
@ -215,7 +222,7 @@ const drawTotalChart = () => {
});
};
// 定额管理charts
const drawManagement = () => {
const drawManagement = (data) => {
let myChart = echarts.init(document.getElementById("management"));
const option = {
// backgroundColor: "#05224d",
@ -261,7 +268,8 @@ const drawManagement = () => {
axisTick: { show: false },
boundaryGap: true,
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
// data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
data:data.map(el=>{return el.time})
},
],
yAxis: [
@ -343,7 +351,8 @@ const drawManagement = () => {
shadowColor: "rgba(53,142,215, 0.9)", //阴影颜色
shadowBlur: 20, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
data: [5, 7, 9, 6, 2, 5, 4],
// data: [5, 7, 9, 6, 2, 5, 4],
data:data.map(el=>{return el.EnergyIndexing})
},
],
};
@ -500,7 +509,7 @@ const drawEnergyFlow = () => {
});
};
//复费率
function getExhibitionLoad() {
function getExhibitionLoad(data) {
let myChart = echarts.init(document.getElementById("exhibitionLoad"));
var option = {
tooltip: {
@ -560,7 +569,8 @@ function getExhibitionLoad() {
margin: 40,
},
},
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
// data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
data:data.map(el=>{return el.time})
},
],
yAxis: [
@ -632,7 +642,7 @@ function getExhibitionLoad() {
]),
},
},
data: [1, 2, 3, 4, 5, 6, 7],
data: data.map(el=>{return el.Needle}),
},
{
name: "峰",
@ -666,7 +676,7 @@ function getExhibitionLoad() {
]),
},
},
data: [1, 2, 3, 4, 5, 6, 7],
data: data.map(el=>{return el.Peak}),
},
{
name: "平",
@ -701,7 +711,7 @@ function getExhibitionLoad() {
barBorderRadius: 0,
},
},
data: [1, 2, 3, 4, 5, 6, 7],
data: data.map(el=>{return el.Flat}),
},
{
name: "谷",
@ -736,7 +746,7 @@ function getExhibitionLoad() {
barBorderRadius: 0,
},
},
data: [1, 2, 3, 4, 5, 6, 7],
data: data.map(el=>{return el.Grain}),
},
{
name: "深",
@ -771,7 +781,7 @@ function getExhibitionLoad() {
barBorderRadius: 0,
},
},
data: [1, 2, 3, 4, 5, 6, 7],
data: data.map(el=>{return el.Deep}),
},
],
};
@ -783,7 +793,7 @@ function getExhibitionLoad() {
}
// 电费电价
const drawElectricityPrice = () => {
const drawElectricityPrice = (data) => {
let myChart = echarts.init(document.getElementById("electricity-price"));
let option = {
tooltip: {
@ -827,7 +837,7 @@ const drawElectricityPrice = () => {
xAxis: {
type: "category",
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
data: data.map(el=>{return el.time}),
axisLine: {
show: true,
lineStyle: {
@ -930,7 +940,7 @@ const drawElectricityPrice = () => {
]),
},
},
data: [40, 35, 15, 10, 19, 24, 14],
data: data.map(el=>{return el.Electricity}),
},
{
name: "销售电价",
@ -940,7 +950,7 @@ const drawElectricityPrice = () => {
color: "rgba(1, 246, 139, 1)", // 设置折线颜色为黄色
},
symbol: "none",
data: [0.1, 0.2, 0.6, 1, 0.4, 0.8, 0.9], // 折线图的数据
data:data.map(el=>{return el.Electrovalence}), // 折线图的数据
},
],
};
@ -958,20 +968,78 @@ const defaultTime = ref([
new Date(2000, 1, 1, 0, 0, 0),
new Date(2000, 2, 1, 23, 59, 59),
]);
// dom加载
// 获取能耗总量数据
const totalEnergyInterface = () =>{
let params = {
date:totalEnergyDate.value==='month'?'月':'日'
}
getTotalEnergy(params).then(res=>{
drawTotalChart(res.data)
})
}
// 获取能效对标数据
const energyIndexingInterface = () =>{
let params = {
date:managementDate.value==='month'?'月':'年'
}
getEnergyIndexing(params).then(res=>{
drawManagement(res.data)
})
}
// 获取各系统能耗数据
const systemEnergyInterface = () =>{
let params = {
name:systemTabName.value
}
getSystemEnergy(params).then(res=>{
systemLeftList.value[0].value = res.data[0].DayPeak
systemLeftList.value[1].value = res.data[0].MonthPeak
systemRightList.value.forEach((el,i)=>{
el[0].value = res.data[0].data[i].This
el[1].value = res.data[0].data[i].Last
el[2].value = res.data[0].data[i].Year
})
})
}
// 获取复费率数据
const multiRateInterface = () =>{
let params = {
date:''
}
if(exhibitionLoadDate.value==='year'){
params.date = '年'
}else if(exhibitionLoadDate.value==='month'){
params.date = '月'
}else if(exhibitionLoadDate.value==='day'){
params.date = '日'
}
getMultiRate(params).then(res=>{
getExhibitionLoad(res.data)
})
}
// 获取电费电价数据
const electricityRateInterface = () =>{
getElectricityRate().then(res=>{
drawElectricityPrice(res.data);
})
}
// dom加载ie
onMounted(() => {
// 能耗总量
drawTotalChart();
totalEnergyInterface();
// 定额管理
drawManagement();
energyIndexingInterface();
// 能效流向
drawEnergyFlow();
// 各系统能耗概况
systemEnergyInterface()
// 电费电价
drawElectricityPrice();
// })
// drawEnergyFlow();
electricityRateInterface()
//复费率
getExhibitionLoad();
multiRateInterface()
// getExhibitionLoad();
});
</script>
@ -1044,7 +1112,7 @@ onMounted(() => {
<li
v-for="(item, index) in systemTab"
:class="index === systemTabIndex ? 'tab-select' : ''"
@click="selectSystemTab(index)"
@click="selectSystemTab(item,index)"
>
<span>{{ item.name }}</span>
</li>

156
src/views/energyMonitoring/index.vue
View File

@ -40,11 +40,12 @@
<script setup>
import { ref, onMounted } from "vue";
import * as echarts from "echarts";
import { getRealLoad,getDailyElectricity,getLoadClassification,getAirconditioningLoad,getDisplayLoad,getLoopRanking } from "@/api/energyMonitoring";
const getImageUrl = (name) => {
return new URL(name, import.meta.url).href;
};
//实时负荷
const getRealTimeLoad = () => {
const getRealTimeLoad = (data) => {
let myChart;
myChart = echarts.init(document.getElementById("realTimeLoad"));
const option = {
@ -79,7 +80,8 @@ const getRealTimeLoad = () => {
axisTick: { show: false },
boundaryGap: true,
data: ["08:00", "09:00", "10:00", "11:00", "12:00", "13:00", "14:00"],
// data: ["08:00", "09:00", "10:00", "11:00", "12:00", "13:00", "14:00"],
data: data.map(el=>{return el.time}),
},
],
yAxis: [
@ -119,7 +121,8 @@ const getRealTimeLoad = () => {
lineStyle: {
width: 2,
},
data: [90, 70, 40, 70, 80, 65, 73], // 折线图的数据
// data: [90, 70, 40, 70, 80, 65, 73], // 折线图的数据
data: data.map(el=>{return el.P}),
},
],
};
@ -130,7 +133,7 @@ const getRealTimeLoad = () => {
});
};
//当日累计用电量
const getDailyElectricityConsumption = () => {
const getDailyElectricityConsumption = (data) => {
const offsetX = 10; //bar宽
const offsetY = 5; //倾斜角度
// 绘制左侧面
@ -199,19 +202,21 @@ const getDailyElectricityConsumption = () => {
echarts.graphic.registerShape("CubeLeft", CubeLeft);
echarts.graphic.registerShape("CubeRight", CubeRight);
echarts.graphic.registerShape("CubeTop", CubeTop);
let xAxisData = [
"08:00",
"09:00",
"10:00",
"11:00",
"12:00",
"13:00",
"14:00",
"15:00",
"16:00",
"17:00",
];
let seriesData = [100, 200, 300, 400, 200, 250, 360, 250, 340, 280];
// let xAxisData = [
// "08:00",
// "09:00",
// "10:00",
// "11:00",
// "12:00",
// "13:00",
// "14:00",
// "15:00",
// "16:00",
// "17:00",
// ];
let xAxisData = data.map(el=>{return el.time})
// let seriesData = [100, 200, 300, 400, 200, 250, 360, 250, 340, 280];
let seriesData = data.map(el=>{return el.EH})
// 绿色渐变
// let colorArr = [["#12D5AF"], ["#0BC19D", "rgba(13,8,16,0)"], ["#68EFD4", "rgba(14,185,151,0)"]]
// 蓝色渐变
@ -417,7 +422,7 @@ const getDailyElectricityConsumption = () => {
};
//空调负荷
const drawAirConditioningLoad = () => {
const drawAirConditioningLoad = (data) => {
let myChart = echarts.init(document.getElementById("airConditioningLoad"));
const option = {
// backgroundColor: "#05224d",
@ -451,7 +456,8 @@ const drawAirConditioningLoad = () => {
axisTick: { show: false },
boundaryGap: true,
data: ["09:00", "11:00", "13:00", "15:00", "17:00", "19:00"],
// data: ["09:00", "11:00", "13:00", "15:00", "17:00", "19:00"],
data:data.map(el=>{return el.time})
},
],
yAxis: [
@ -510,7 +516,8 @@ const drawAirConditioningLoad = () => {
shadowColor: "rgba(53,142,215, 0.9)", //阴影颜色
shadowBlur: 20, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
data: [500, 800, 900, 1200, 1800, 1600],
// data: [500, 800, 900, 1200, 1800, 1600],
data:data.map(el=>{return el.P})
},
],
};
@ -521,7 +528,7 @@ const drawAirConditioningLoad = () => {
});
};
// 展陈负荷
const drawExhibitionLoad = () => {
const drawExhibitionLoad = (data) => {
let myChart = echarts.init(document.getElementById("exhibitionLoad"));
const option = {
// backgroundColor: "#05224d",
@ -555,7 +562,8 @@ const drawExhibitionLoad = () => {
axisTick: { show: false },
boundaryGap: true,
data: ["09:00", "11:00", "13:00", "15:00", "17:00", "19:00"],
// data: ["09:00", "11:00", "13:00", "15:00", "17:00", "19:00"],
data:data.map(el=>{return el.time})
},
],
yAxis: [
@ -614,7 +622,8 @@ const drawExhibitionLoad = () => {
shadowColor: "rgba(53,142,215, 0.9)", //阴影颜色
shadowBlur: 20, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
data: [500, 800, 900, 1200, 1800, 1600],
// data: [500, 800, 900, 1200, 1800, 1600],
data:data.map(el=>{return el.P})
},
],
};
@ -765,21 +774,29 @@ const drawRanking = () => {
});
};
//负荷分类
const getLoadClassification = () => {
var trafficWay = [
{
name: "一级",
value: 20,
},
{
name: "二级",
value: 30,
},
{
name: "三级",
value: 50,
},
];
const drawLoadClassification = (item) => {
// var trafficWay = [
// {
// name: "一级",
// value: 20,
// },
// {
// name: "二级",
// value: 30,
// },
// {
// name: "三级",
// value: 50,
// },
// ];
console.log(item[0].Amount,'xxx');
var trafficWay = item[0].list.map(el=>{
return {
name:el.type,
value:el.P
}
})
var total = 0;
for (var i = 0; i < trafficWay.length; i++) {
total += trafficWay[i].value;
@ -845,7 +862,7 @@ const getLoadClassification = () => {
color: color,
title: [
{
text: "1694",
text: item[0].Amount,
x: "47%",
y: "42%",
textAlign: "center",
@ -965,20 +982,59 @@ const getLoadClassification = () => {
myChart.resize(); // 调用 resize 函数进行自适应大小调整
});
};
//接口
// 获取实时负荷数据
const realTimeLoadInterface = () =>{
getRealLoad().then(res=>{
getRealTimeLoad(res.data)
})
}
// 获取当日累计用电量数据
const dailyElectricityInterface = () =>{
getDailyElectricity().then(res=>{
getDailyElectricityConsumption(res.data)
})
}
// 获取负荷分类数据
const loadClassificationInterface = () =>{
getLoadClassification().then(res=>{
drawLoadClassification(res.data)
})
}
// 获取空调负荷数据
const airconditioningLoadInteface = () =>{
getAirconditioningLoad().then(res=>{
drawAirConditioningLoad(res.data)
})
}
// 获取展陈负荷数据
const displayLoadInterface = () =>{
getDisplayLoad().then(res=>{
drawExhibitionLoad(res.data)
})
}
// 获取配电回路数据
const loopRankingInterface = () =>{
getLoopRanking().then(res=>{
drawRanking(res.data);
})
}
//加载完dom执行
onMounted(() => {
//实时负荷
getRealTimeLoad();
//当日累计用电量
getDailyElectricityConsumption();
// 空调负荷
drawAirConditioningLoad();
// 展陈负荷
drawExhibitionLoad();
// 实时负荷接口
realTimeLoadInterface()
//当日累计用电量接口
dailyElectricityInterface()
// 空调负荷接口
airconditioningLoadInteface();
// 展陈负荷接口
displayLoadInterface()
// drawExhibitionLoad();
// 配电回路排名
drawRanking();
//负荷分类
getLoadClassification();
loopRankingInterface()
//负荷分类接口
loadClassificationInterface()
});
</script>

22
src/views/overview/index.vue
View File

@ -34,8 +34,10 @@ onMounted(() => {
stationInterface()
// 系统用电排名接口
systemRankingInterface()
// 碳排放的接口
CarbonEmissionInterface()
//碳排放
getCarbonEmissionEcahrts();
// getCarbonEmissionEcahrts();
});
// 用电量时间切换
const powerDate = ref("year");
@ -49,6 +51,8 @@ const togglePower = (event) => {
const carbonEmissionDate = ref("month");
const toggleCarbonEmission = (event) => {
carbonEmissionDate.value = event.srcElement.className;
// 碳排放接口
CarbonEmissionInterface()
};
const drawPowerEcharts = (item) => {
let myChart = echarts.init(document.getElementById("power"));
@ -297,7 +301,7 @@ const drawRankEcharts = (data) => {
});
};
//碳排放
function getCarbonEmissionEcahrts() {
function getCarbonEmissionEcahrts(data) {
const offsetX = 10; //bar宽
const offsetY = 5; //倾斜角度
// 绘制左侧面
@ -366,8 +370,10 @@ function getCarbonEmissionEcahrts() {
echarts.graphic.registerShape("CubeLeft", CubeLeft);
echarts.graphic.registerShape("CubeRight", CubeRight);
echarts.graphic.registerShape("CubeTop", CubeTop);
let xAxisData = ["1月", "2月", "3月", "4月", "5月", "6月", "7月"];
let seriesData = [100, 200, 300, 400, 200, 250];
// let xAxisData = ["1月", "2月", "3月", "4月", "5月", "6月", "7月"];
let xAxisData = data.map(el=>{return el.time})
// let seriesData = [100, 200, 300, 400, 200, 250];
let seriesData = data.map(el=>{return el.CarbonEmission})
// 绿色渐变
// let colorArr = [["#12D5AF"], ["#0BC19D", "rgba(13,8,16,0)"], ["#68EFD4", "rgba(14,185,151,0)"]]
// 蓝色渐变
@ -612,6 +618,14 @@ const systemRankingInterface = () =>{
drawRankEcharts(res.data)
})
}
const CarbonEmissionInterface = () =>{
let params = {
date:carbonEmissionDate.value === 'month'?'月':'年'
}
getCarbonEmission(params).then(res=>{
getCarbonEmissionEcahrts(res.data)
})
}
</script>
<template>