代码提交_1_20
This commit is contained in:
parent
a2dd943797
commit
a2112b7b55
|
|
@ -1,145 +1,151 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en-us">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Unity WebGL Player | CD</title>
|
||||
<link rel="shortcut icon" href="TemplateData/favicon.ico">
|
||||
<link rel="stylesheet" href="TemplateData/style.css">
|
||||
</head>
|
||||
<style>body,html{
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>Unity WebGL Player | CD</title>
|
||||
<link rel="shortcut icon" href="TemplateData/favicon.ico">
|
||||
<link rel="stylesheet" href="TemplateData/style.css">
|
||||
</head>
|
||||
<style>
|
||||
body,
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}</style>
|
||||
<body>
|
||||
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%">
|
||||
<canvas id="unity-canvas" style="width: 100%;height: 100%"></canvas>
|
||||
<div id="unity-loading-bar">
|
||||
<div id="unity-logo"></div>
|
||||
<div id="unity-progress-bar-empty">
|
||||
<div id="unity-progress-bar-full"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="unity-warning"> </div>
|
||||
<div id="unity-footer">
|
||||
<div id="unity-webgl-logo"></div>
|
||||
<div id="unity-fullscreen-button"></div>
|
||||
<div id="unity-build-title">CD</div>
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div id="unity-container" class="unity-desktop" style="width: 100%;height: 100%">
|
||||
<canvas id="unity-canvas" style="width: 100%;height: 100%"></canvas>
|
||||
<div id="unity-loading-bar">
|
||||
<div id="unity-logo"></div>
|
||||
<div id="unity-progress-bar-empty">
|
||||
<div id="unity-progress-bar-full"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var container = document.querySelector("#unity-container");
|
||||
var canvas = document.querySelector("#unity-canvas");
|
||||
var loadingBar = document.querySelector("#unity-loading-bar");
|
||||
var progressBarFull = document.querySelector("#unity-progress-bar-full");
|
||||
var fullscreenButton = document.querySelector("#unity-fullscreen-button");
|
||||
var warningBanner = document.querySelector("#unity-warning");
|
||||
|
||||
// Shows a temporary message banner/ribbon for a few seconds, or
|
||||
// a permanent error message on top of the canvas if type=='error'.
|
||||
// If type=='warning', a yellow highlight color is used.
|
||||
// Modify or remove this function to customize the visually presented
|
||||
// way that non-critical warnings and error messages are presented to the
|
||||
// user.
|
||||
function unityShowBanner(msg, type) {
|
||||
function updateBannerVisibility() {
|
||||
warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
|
||||
}
|
||||
var div = document.createElement('div');
|
||||
div.innerHTML = msg;
|
||||
warningBanner.appendChild(div);
|
||||
if (type == 'error') div.style = 'background: red; padding: 10px;';
|
||||
else {
|
||||
if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
|
||||
setTimeout(function() {
|
||||
warningBanner.removeChild(div);
|
||||
updateBannerVisibility();
|
||||
}, 5000);
|
||||
}
|
||||
updateBannerVisibility();
|
||||
<div id="unity-warning"> </div>
|
||||
<div id="unity-footer">
|
||||
<div id="unity-webgl-logo"></div>
|
||||
<div id="unity-fullscreen-button"></div>
|
||||
<div id="unity-build-title">CD</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var container = document.querySelector("#unity-container");
|
||||
var canvas = document.querySelector("#unity-canvas");
|
||||
var loadingBar = document.querySelector("#unity-loading-bar");
|
||||
var progressBarFull = document.querySelector("#unity-progress-bar-full");
|
||||
var fullscreenButton = document.querySelector("#unity-fullscreen-button");
|
||||
var warningBanner = document.querySelector("#unity-warning");
|
||||
|
||||
// Shows a temporary message banner/ribbon for a few seconds, or
|
||||
// a permanent error message on top of the canvas if type=='error'.
|
||||
// If type=='warning', a yellow highlight color is used.
|
||||
// Modify or remove this function to customize the visually presented
|
||||
// way that non-critical warnings and error messages are presented to the
|
||||
// user.
|
||||
function unityShowBanner(msg, type) {
|
||||
function updateBannerVisibility() {
|
||||
warningBanner.style.display = warningBanner.children.length ? 'block' : 'none';
|
||||
}
|
||||
|
||||
var buildUrl = "Build";
|
||||
var loaderUrl = buildUrl + "/build.loader.js";
|
||||
var config = {
|
||||
dataUrl: buildUrl + "/build.data.unityweb",
|
||||
frameworkUrl: buildUrl + "/build.framework.js.unityweb",
|
||||
codeUrl: buildUrl + "/build.wasm.unityweb",
|
||||
streamingAssetsUrl: "StreamingAssets",
|
||||
companyName: "DefaultCompany",
|
||||
productName: "CD",
|
||||
productVersion: "0.1",
|
||||
showBanner: unityShowBanner,
|
||||
};
|
||||
|
||||
// By default Unity keeps WebGL canvas render target size matched with
|
||||
// the DOM size of the canvas element (scaled by window.devicePixelRatio)
|
||||
// Set this to false if you want to decouple this synchronization from
|
||||
// happening inside the engine, and you would instead like to size up
|
||||
// the canvas DOM size and WebGL render target sizes yourself.
|
||||
// config.matchWebGLToCanvasSize = false;
|
||||
|
||||
if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
|
||||
// Mobile device style: fill the whole browser client area with the game canvas:
|
||||
|
||||
var meta = document.createElement('meta');
|
||||
meta.name = 'viewport';
|
||||
meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
|
||||
document.getElementsByTagName('head')[0].appendChild(meta);
|
||||
container.className = "unity-mobile";
|
||||
canvas.className = "unity-mobile";
|
||||
|
||||
// To lower canvas resolution on mobile devices to gain some
|
||||
// performance, uncomment the following line:
|
||||
// config.devicePixelRatio = 1;
|
||||
|
||||
unityShowBanner('WebGL builds are not supported on mobile devices.');
|
||||
} else {
|
||||
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
|
||||
|
||||
canvas.style.width = "1920px";
|
||||
canvas.style.height = "1080px";
|
||||
var div = document.createElement('div');
|
||||
div.innerHTML = msg;
|
||||
warningBanner.appendChild(div);
|
||||
if (type == 'error') div.style = 'background: red; padding: 10px;';
|
||||
else {
|
||||
if (type == 'warning') div.style = 'background: yellow; padding: 10px;';
|
||||
setTimeout(function () {
|
||||
warningBanner.removeChild(div);
|
||||
updateBannerVisibility();
|
||||
}, 5000);
|
||||
}
|
||||
updateBannerVisibility();
|
||||
}
|
||||
|
||||
loadingBar.style.display = "block";
|
||||
var buildUrl = "Build";
|
||||
var loaderUrl = buildUrl + "/build.loader.js";
|
||||
var config = {
|
||||
dataUrl: buildUrl + "/build.data.unityweb",
|
||||
frameworkUrl: buildUrl + "/build.framework.js.unityweb",
|
||||
codeUrl: buildUrl + "/build.wasm.unityweb",
|
||||
streamingAssetsUrl: "StreamingAssets",
|
||||
companyName: "DefaultCompany",
|
||||
productName: "CD",
|
||||
productVersion: "0.1",
|
||||
showBanner: unityShowBanner,
|
||||
};
|
||||
|
||||
var script = document.createElement("script");
|
||||
var unityInstanceA
|
||||
script.src = loaderUrl;
|
||||
script.onload = () => {
|
||||
createUnityInstance(canvas, config, (progress) => {
|
||||
progressBarFull.style.width = 100 * progress + "%";
|
||||
}).then((unityInstance) => {
|
||||
unityInstanceA = unityInstance
|
||||
loadingBar.style.display = "none";
|
||||
fullscreenButton.onclick = () => {
|
||||
unityInstance.SetFullscreen(1);
|
||||
};
|
||||
}).catch((message) => {
|
||||
alert(message);
|
||||
});
|
||||
};
|
||||
document.body.appendChild(script);
|
||||
// unity交互
|
||||
function unity3D(val){
|
||||
// OpenWebPanel()
|
||||
unityInstanceA.SendMessage("App", "SetState", val + '')
|
||||
}
|
||||
// 打开web弹窗
|
||||
function OnButtonClick(val){
|
||||
console.log(val)
|
||||
let name = "控制箱名称"
|
||||
window.parent.openBox(val)
|
||||
}
|
||||
// 关闭照明
|
||||
function closeLight(){
|
||||
unityInstanceA.SendMessage("照明tip", "HideUnityPanel",'')
|
||||
}
|
||||
// 关闭策略
|
||||
function closeStrategy(){
|
||||
unityInstanceA.SendMessage("空调tip", "HideUnityPanel",'')
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
// By default Unity keeps WebGL canvas render target size matched with
|
||||
// the DOM size of the canvas element (scaled by window.devicePixelRatio)
|
||||
// Set this to false if you want to decouple this synchronization from
|
||||
// happening inside the engine, and you would instead like to size up
|
||||
// the canvas DOM size and WebGL render target sizes yourself.
|
||||
// config.matchWebGLToCanvasSize = false;
|
||||
|
||||
if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) {
|
||||
// Mobile device style: fill the whole browser client area with the game canvas:
|
||||
|
||||
var meta = document.createElement('meta');
|
||||
meta.name = 'viewport';
|
||||
meta.content = 'width=device-width, height=device-height, initial-scale=1.0, user-scalable=no, shrink-to-fit=yes';
|
||||
document.getElementsByTagName('head')[0].appendChild(meta);
|
||||
container.className = "unity-mobile";
|
||||
canvas.className = "unity-mobile";
|
||||
|
||||
// To lower canvas resolution on mobile devices to gain some
|
||||
// performance, uncomment the following line:
|
||||
// config.devicePixelRatio = 1;
|
||||
|
||||
unityShowBanner('WebGL builds are not supported on mobile devices.');
|
||||
} else {
|
||||
// Desktop style: Render the game canvas in a window that can be maximized to fullscreen:
|
||||
|
||||
canvas.style.width = "1920px";
|
||||
canvas.style.height = "1080px";
|
||||
}
|
||||
|
||||
loadingBar.style.display = "block";
|
||||
|
||||
var script = document.createElement("script");
|
||||
var unityInstanceA = null
|
||||
script.src = loaderUrl;
|
||||
script.onload = () => {
|
||||
createUnityInstance(canvas, config, (progress) => {
|
||||
progressBarFull.style.width = 100 * progress + "%";
|
||||
}).then((unityInstance) => {
|
||||
unityInstanceA = unityInstance
|
||||
loadingBar.style.display = "none";
|
||||
fullscreenButton.onclick = () => {
|
||||
unityInstance.SetFullscreen(1);
|
||||
};
|
||||
}).catch((message) => {
|
||||
alert(message);
|
||||
});
|
||||
};
|
||||
document.body.appendChild(script);
|
||||
// unity交互
|
||||
function unity3D(val) {
|
||||
// OpenWebPanel()
|
||||
unityInstanceA.SendMessage("App", "SetState", val + '')
|
||||
}
|
||||
// 打开web弹窗
|
||||
function OnButtonClick(val) {
|
||||
console.log(val)
|
||||
let name = "控制箱名称"
|
||||
window.parent.openBox(val)
|
||||
}
|
||||
// 关闭照明
|
||||
function closeLight() {
|
||||
unityInstanceA.SendMessage("照明tip", "HideUnityPanel", '')
|
||||
}
|
||||
// 关闭策略
|
||||
function closeStrategy() {
|
||||
unityInstanceA.SendMessage("空调tip", "HideUnityPanel", '')
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Binary file not shown.
|
|
@ -18,4 +18,10 @@
|
|||
src: url('./D-DIN-Bold.otf');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "D-DINEXP-BOLD";
|
||||
src: url('./D-DINEXP-BOLD.TTF');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
|
@ -115,7 +115,7 @@ const closeUnity = () => {
|
|||
|
||||
const heart = ref("4");
|
||||
function getHeart(val) {
|
||||
console.log(val, "室外温度");
|
||||
// console.log(val, "室外温度");
|
||||
heart.value = val;
|
||||
}
|
||||
onMounted(() => {});
|
||||
|
|
|
|||
|
|
@ -174,13 +174,13 @@ const openDialog = (item) => {
|
|||
id.value = item.StrategyId;
|
||||
};
|
||||
const closeDialog = (val) => {
|
||||
console.log(val, "xxxxxxxxxx");
|
||||
// console.log(val, "xxxxxxxxxx");
|
||||
let params = {
|
||||
id: id.value,
|
||||
name: dialogName.value,
|
||||
value: deviceList.value === "" ? null : deviceList.value,
|
||||
};
|
||||
console.log(deviceList.value, "参数", params);
|
||||
// console.log(deviceList.value, "参数", params);
|
||||
getPolicyEditing(params).then((res) => {
|
||||
if (res.code === 200) {
|
||||
ElMessage({
|
||||
|
|
@ -199,7 +199,7 @@ const closeDialog = (val) => {
|
|||
const deviceList = ref("");
|
||||
// 获取设备数组
|
||||
const getDevice = (data) => {
|
||||
console.log(data);
|
||||
// console.log(data);
|
||||
// 获取设备
|
||||
deviceList.value = data.join(",");
|
||||
};
|
||||
|
|
@ -299,7 +299,7 @@ const bootStrategyInterface = () => {
|
|||
};
|
||||
// 维护提醒
|
||||
const maintenanceReminderInterface = () => {
|
||||
console.log(controlBtn.value);
|
||||
// console.log(controlBtn.value);
|
||||
// let params = {
|
||||
// name: controlBtn.value === "on" ? "已超期" : "即将开始",
|
||||
// };
|
||||
|
|
|
|||
|
|
@ -25,10 +25,7 @@
|
|||
justify-content: space-evenly;
|
||||
"
|
||||
>
|
||||
<div
|
||||
v-for="(item, index) in overviewList"
|
||||
:class="'overview-item' + index"
|
||||
>
|
||||
<div v-for="(item, index) in overviewList" :class="'overview-item' + index">
|
||||
<span class="">{{ item.name }}</span>
|
||||
<p class="overviewValue">
|
||||
<span class="value">{{ item.num }}</span>
|
||||
|
|
@ -112,17 +109,17 @@ const overviewList = ref([
|
|||
{
|
||||
name: "总排放量",
|
||||
num: 83,
|
||||
unit: "万tCO₂",
|
||||
unit: "tCO₂",
|
||||
},
|
||||
{
|
||||
name: "碳抵消量",
|
||||
num: 83,
|
||||
unit: "万tCO₂",
|
||||
unit: "tCO₂",
|
||||
},
|
||||
{
|
||||
name: "碳减排量",
|
||||
num: 83,
|
||||
unit: "万tCO₂",
|
||||
unit: "tCO₂",
|
||||
},
|
||||
]);
|
||||
//总览切换时间
|
||||
|
|
@ -155,7 +152,9 @@ function exportExcel() {
|
|||
var elink = document.createElement("a");
|
||||
elink.download = "碳排放统计报表.docx";
|
||||
elink.style.display = "none";
|
||||
var blob = new Blob([debug], { type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document" });
|
||||
var blob = new Blob([debug], {
|
||||
type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
|
||||
});
|
||||
elink.href = URL.createObjectURL(blob);
|
||||
document.body.appendChild(elink);
|
||||
elink.click();
|
||||
|
|
@ -168,6 +167,31 @@ function exportExcel() {
|
|||
}
|
||||
//碳趋势图表
|
||||
function getCarbonTrends(params) {
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024 && trendActiveDate.value == 0) {
|
||||
if (params[0] !== undefined) {
|
||||
params[0].EH = 297.6332967;
|
||||
}
|
||||
if (params[1] !== undefined) {
|
||||
params[1].EH = 266.7401457;
|
||||
}
|
||||
if (params[2] !== undefined) {
|
||||
params[2].EH = 172.0960092;
|
||||
}
|
||||
if (params[3] !== undefined) {
|
||||
params[3].EH = 70.7325981;
|
||||
}
|
||||
if (params[4] !== undefined) {
|
||||
params[4].EH = 40.83348;
|
||||
}
|
||||
if (params[5] !== undefined) {
|
||||
params[5].EH = 43.1728506;
|
||||
}
|
||||
if (params[6] !== undefined) {
|
||||
params[6].EH = 165.8512242;
|
||||
}
|
||||
}
|
||||
// console.log(params,'碳排放趋势');
|
||||
let xData = [];
|
||||
let yData = [];
|
||||
params.forEach((item) => {
|
||||
|
|
@ -208,6 +232,7 @@ function getCarbonTrends(params) {
|
|||
},
|
||||
axisLabel: {
|
||||
//坐标轴刻度标签的相关设置
|
||||
interval: 2,
|
||||
textStyle: {
|
||||
color: "#DDFFFD",
|
||||
margin: 40,
|
||||
|
|
@ -222,7 +247,7 @@ function getCarbonTrends(params) {
|
|||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
name: "单位:万tCO₂",
|
||||
name: "单位:tCO₂",
|
||||
nameTextStyle: {
|
||||
color: "#DDFFFD",
|
||||
// align: "right",
|
||||
|
|
@ -252,9 +277,11 @@ function getCarbonTrends(params) {
|
|||
name: "碳排放量",
|
||||
type: "line",
|
||||
smooth: true, //是否平滑曲线显示
|
||||
// symbol:'circle', // 默认是空心圆（中间是白色的），改成实心圆
|
||||
symbolSize: 0,
|
||||
|
||||
symbol:'circle', // 默认是空心圆（中间是白色的），改成实心圆
|
||||
// symbolSize: 0,
|
||||
itemStyle: {
|
||||
color: "rgba(91, 250, 241, 1)",
|
||||
},
|
||||
lineStyle: {
|
||||
color: "#5BFAF1", // 线条颜色
|
||||
},
|
||||
|
|
@ -288,11 +315,36 @@ function getCarbonTrends(params) {
|
|||
}
|
||||
//碳排放强度
|
||||
const getCarbonIntensityChat = (params) => {
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024) {
|
||||
if (params[0] !== undefined) {
|
||||
params[0].CarbonIntensity = 11.44303332;
|
||||
}
|
||||
if (params[1] !== undefined) {
|
||||
params[1].CarbonIntensity = 10.25529203;
|
||||
}
|
||||
if (params[2] !== undefined) {
|
||||
params[2].CarbonIntensity = 6.616532457;
|
||||
}
|
||||
if (params[3] !== undefined) {
|
||||
params[3].CarbonIntensity = 2.719438604;
|
||||
}
|
||||
if (params[4] !== undefined) {
|
||||
params[4].CarbonIntensity = 1.569914648;
|
||||
}
|
||||
if (params[5] !== undefined) {
|
||||
params[5].CarbonIntensity = 1.659855848;
|
||||
}
|
||||
if (params[6] !== undefined) {
|
||||
params[6].CarbonIntensity = 6.376440761;
|
||||
}
|
||||
}
|
||||
// console.log(params, "碳排放强度");
|
||||
let xData = [];
|
||||
let yData = [];
|
||||
params.forEach((item) => {
|
||||
xData.push(item.time);
|
||||
yData.push(parseInt(item.CarbonIntensity));
|
||||
yData.push(item.CarbonIntensity);
|
||||
});
|
||||
const offsetX = 10; //bar宽
|
||||
const offsetY = 5; //倾斜角度
|
||||
|
|
@ -440,7 +492,7 @@ const getCarbonIntensityChat = (params) => {
|
|||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
name: "单位:万tCO₂/m²",
|
||||
name: "单位:kgCO₂/m²",
|
||||
nameTextStyle: {
|
||||
color: "#DDFFFD",
|
||||
padding: [0, 0, 0, 27],
|
||||
|
|
@ -469,8 +521,9 @@ const getCarbonIntensityChat = (params) => {
|
|||
fontSize: 12,
|
||||
color: "#DDFFFD",
|
||||
formatter: function (params) {
|
||||
console.log(params, "定额");
|
||||
if (params === Math.max(...seriesData) / 2) {
|
||||
// console.log(params, "定额");
|
||||
// if (params === Math.max(...seriesData) / 2) {
|
||||
if (params == 5.1) {
|
||||
return "{a|" + params + "}";
|
||||
} else {
|
||||
return params;
|
||||
|
|
@ -587,20 +640,23 @@ const getCarbonIntensityChat = (params) => {
|
|||
color: "transparent",
|
||||
},
|
||||
tooltip: {},
|
||||
// data: [0, 7, 9, 6, 2, 5, 4, 15],
|
||||
data: seriesData,
|
||||
markLine: {
|
||||
symbol: "none",
|
||||
data: [
|
||||
{
|
||||
yAxis: Math.max(...seriesData) / 2 + "",
|
||||
// yAxis: Math.max(...seriesData) / 2 + "",
|
||||
yAxis: 5.1,
|
||||
lineStyle: {
|
||||
color: "rgba(255, 221, 0, 1)",
|
||||
type: "dashed",
|
||||
width: 1,
|
||||
},
|
||||
label: {
|
||||
show: false,
|
||||
show: true,
|
||||
position: "end",
|
||||
color: "rgba(255, 221, 0, 1)",
|
||||
},
|
||||
},
|
||||
],
|
||||
|
|
@ -624,7 +680,7 @@ const getCarbonEmissionStatistics = (params) => {
|
|||
xData.push(item.name);
|
||||
yData.push(item.CarbonEmission);
|
||||
});
|
||||
console.log(total);
|
||||
// console.log(total);
|
||||
// let myChart = echarts.init(
|
||||
// document.getElementById("carbonEmissionStatistics")
|
||||
// );
|
||||
|
|
@ -653,7 +709,7 @@ const getCarbonEmissionStatistics = (params) => {
|
|||
params[0].seriesName +
|
||||
"" +
|
||||
Number(params[0].value.toFixed(2)).toLocaleString() +
|
||||
" 万tCO₂<br/>"
|
||||
" tCO₂<br/>"
|
||||
);
|
||||
},
|
||||
},
|
||||
|
|
@ -699,7 +755,7 @@ const getCarbonEmissionStatistics = (params) => {
|
|||
inside: true,
|
||||
textStyle: {},
|
||||
formatter: function (value) {
|
||||
return "{a|" + value.toLocaleString() + "}" + "{b|万tCO₂}";
|
||||
return "{a|" + value.toLocaleString() + "}" + "{b|tCO₂}";
|
||||
},
|
||||
rich: {
|
||||
a: {
|
||||
|
|
@ -782,17 +838,13 @@ const color = [
|
|||
"rgba(0, 140, 255, 1)",
|
||||
// "rgba(1, 225, 242, 1)",
|
||||
];
|
||||
const color1 = [
|
||||
"rgba(0, 140, 255, 1)",
|
||||
"rgba(1, 225, 242, 1)",
|
||||
"rgba(27, 255, 118, 1)",
|
||||
];
|
||||
const color1 = ["rgba(0, 140, 255, 1)", "rgba(1, 225, 242, 1)", "rgba(27, 255, 118, 1)"];
|
||||
const setLabel = () => {
|
||||
optionData.value.forEach((item, index) => {
|
||||
item.itemStyle = {
|
||||
color: color[index],
|
||||
};
|
||||
console.log(color[index]);
|
||||
// console.log(color[index]);
|
||||
item.label = {
|
||||
normal: {
|
||||
show: true,
|
||||
|
|
@ -802,10 +854,14 @@ const setLabel = () => {
|
|||
// distance:-10,
|
||||
offset: [0, 3],
|
||||
formatter: [
|
||||
"{d|{d}%}",
|
||||
"{d|0%}",
|
||||
// '{c|{c}}{b|台}',
|
||||
"{b|{b}}",
|
||||
].join("\n"), // 用\n来换行
|
||||
// formatter: function (params) {
|
||||
// // 这里返回的是固定的0，你也可以根据实际需求修改
|
||||
// return "{d|0}";
|
||||
// },
|
||||
rich: {
|
||||
b: {
|
||||
lineHeight: 30,
|
||||
|
|
@ -889,27 +945,27 @@ const drawEnergyFlow = (params) => {
|
|||
{
|
||||
name: "碳",
|
||||
nameValue: params[0].Amount,
|
||||
valueUnit: "万tCO₂",
|
||||
valueUnit: "tCO₂",
|
||||
},
|
||||
{
|
||||
name: "空调",
|
||||
nameValue: params[0].data[0].AirConditioner,
|
||||
valueUnit: "万tCO₂",
|
||||
valueUnit: "tCO₂",
|
||||
},
|
||||
{
|
||||
name: "照明",
|
||||
nameValue: params[0].data[0].Lighting,
|
||||
valueUnit: "万tCO₂",
|
||||
valueUnit: "tCO₂",
|
||||
},
|
||||
{
|
||||
name: "电梯",
|
||||
nameValue: params[0].data[0].Elevator,
|
||||
valueUnit: "万tCO₂",
|
||||
valueUnit: "tCO₂",
|
||||
},
|
||||
{
|
||||
name: "其他",
|
||||
nameValue: params[0].data[0].Other,
|
||||
valueUnit: "万tCO₂",
|
||||
valueUnit: "tCO₂",
|
||||
},
|
||||
];
|
||||
let sangjiColor = [
|
||||
|
|
@ -1087,7 +1143,7 @@ function carboEmissionTrends() {
|
|||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
//碳趋势图表
|
||||
getCarbonTrends(res.data.slice(-10));
|
||||
getCarbonTrends(res.data);
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
|
|
@ -1129,7 +1185,7 @@ function neutralization(params) {
|
|||
getCarbonNeutral()
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
console.log(res.data, "碳中和数据");
|
||||
// console.log(res.data, "碳中和数据");
|
||||
optionData.value = Object.keys(res.data).map((item, index) => {
|
||||
return {
|
||||
name: res.data[index].name,
|
||||
|
|
@ -1200,8 +1256,7 @@ onMounted(() => {
|
|||
padding-right: 1.3rem;
|
||||
width: 24.125rem;
|
||||
height: 27%;
|
||||
background: url("@/assets/images/carbonEmission/carbonOffsettingAmount.png")
|
||||
no-repeat;
|
||||
background: url("@/assets/images/carbonEmission/carbonOffsettingAmount.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -1213,8 +1268,7 @@ onMounted(() => {
|
|||
padding-right: 1.3rem;
|
||||
width: 24.125rem;
|
||||
height: 27%;
|
||||
background: url("@/assets/images/carbonEmission/carbonEmissionReduction.png")
|
||||
no-repeat;
|
||||
background: url("@/assets/images/carbonEmission/carbonEmissionReduction.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -1251,8 +1305,7 @@ onMounted(() => {
|
|||
.carbonNeutralityBg {
|
||||
width: 68.7%;
|
||||
height: 50.5%;
|
||||
background: url("@/assets/images/carbonEmission/carbonNeutralityBg.png")
|
||||
no-repeat;
|
||||
background: url("@/assets/images/carbonEmission/carbonNeutralityBg.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
|
|
|
|||
|
|
@ -189,7 +189,7 @@ const operationRightList = ref([
|
|||
])
|
||||
const waterDrainingInterface = () =>{
|
||||
getWaterDraining().then(res=>{
|
||||
console.log(res,'排水数据');
|
||||
// console.log(res,'排水数据');
|
||||
operationLeftList.value = res.data.slice(0,7).map(el=>{
|
||||
return {
|
||||
name:el.WaterName,
|
||||
|
|
|
|||
|
|
@ -38,12 +38,12 @@ const systemRightList = ref([
|
|||
{
|
||||
name: "今日",
|
||||
value: "3122",
|
||||
unit: "kgce",
|
||||
unit: "tce",
|
||||
},
|
||||
{
|
||||
name: "昨日",
|
||||
value: "9400",
|
||||
unit: "kgce",
|
||||
unit: "tce",
|
||||
},
|
||||
{
|
||||
name: "同比",
|
||||
|
|
@ -55,12 +55,12 @@ const systemRightList = ref([
|
|||
{
|
||||
name: "本月",
|
||||
value: "3122",
|
||||
unit: "kgce",
|
||||
unit: "tce",
|
||||
},
|
||||
{
|
||||
name: "上月",
|
||||
value: "9400",
|
||||
unit: "kgce",
|
||||
unit: "tce",
|
||||
},
|
||||
{
|
||||
name: "同比",
|
||||
|
|
@ -72,12 +72,12 @@ const systemRightList = ref([
|
|||
{
|
||||
name: "今年",
|
||||
value: "3122",
|
||||
unit: "kgce",
|
||||
unit: "tce",
|
||||
},
|
||||
{
|
||||
name: "去年",
|
||||
value: "9400",
|
||||
unit: "kgce",
|
||||
unit: "tce",
|
||||
},
|
||||
{
|
||||
name: "同比",
|
||||
|
|
@ -89,21 +89,21 @@ const systemRightList = ref([
|
|||
|
||||
// 能耗总量时间点击事件
|
||||
const totalEnergyDate = ref("month");
|
||||
const toggleTotalEnergy = (event) => {
|
||||
totalEnergyDate.value = event.srcElement.className;
|
||||
const toggleTotalEnergy = (data) => {
|
||||
totalEnergyDate.value = data;
|
||||
totalEnergyInterface();
|
||||
};
|
||||
// 能效对标时间点击时间
|
||||
const managementDate = ref("month");
|
||||
|
||||
const toggleManagement = (event) => {
|
||||
managementDate.value = event.srcElement.className;
|
||||
const toggleManagement = (data) => {
|
||||
managementDate.value = data;
|
||||
energyIndexingInterface();
|
||||
};
|
||||
// 复费率的时间点击事件
|
||||
const exhibitionLoadDate = ref("month");
|
||||
const toggleExhibitionLoad = (event) => {
|
||||
exhibitionLoadDate.value = event.srcElement.className;
|
||||
const toggleExhibitionLoad = (data) => {
|
||||
exhibitionLoadDate.value = data;
|
||||
multiRateInterface();
|
||||
};
|
||||
const selectSystemTab = (item, index) => {
|
||||
|
|
@ -116,6 +116,32 @@ const selectSystemTab = (item, index) => {
|
|||
const drawTotalChart = (data) => {
|
||||
let dom = document.getElementById("totalEnergy");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024 && totalEnergyDate.value == "month") {
|
||||
if (data[0] !== undefined) {
|
||||
data[0].EH = 64.1401581;
|
||||
}
|
||||
if (data[1] !== undefined) {
|
||||
data[1].EH = 57.4826651;
|
||||
}
|
||||
if (data[2] !== undefined) {
|
||||
data[2].EH = 37.0867956;
|
||||
}
|
||||
if (data[3] !== undefined) {
|
||||
data[3].EH = 15.2429183;
|
||||
}
|
||||
if (data[4] !== undefined) {
|
||||
data[4].EH = 8.79964;
|
||||
}
|
||||
if (data[5] !== undefined) {
|
||||
data[5].EH = 9.3037758;
|
||||
}
|
||||
if (data[6] !== undefined) {
|
||||
data[6].EH = 35.7410406;
|
||||
}
|
||||
}
|
||||
// console.log(data, "能耗总量");
|
||||
|
||||
let myChart;
|
||||
myChart = echarts.init(dom);
|
||||
|
||||
|
|
@ -149,6 +175,7 @@ const drawTotalChart = (data) => {
|
|||
},
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 2,
|
||||
//坐标轴刻度标签的相关设置
|
||||
textStyle: {
|
||||
color: "#DDFFFD",
|
||||
|
|
@ -181,7 +208,7 @@ const drawTotalChart = (data) => {
|
|||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
name: "单位:kgce",
|
||||
name: "单位:tce",
|
||||
// padding:[0,10,0,0],
|
||||
nameTextStyle: {
|
||||
color: "#DDFFFD",
|
||||
|
|
@ -264,20 +291,46 @@ const drawTotalChart = (data) => {
|
|||
};
|
||||
// 定额管理charts
|
||||
const drawManagement = (data) => {
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024 && managementDate.value == "month") {
|
||||
if (data[0] !== undefined) {
|
||||
data[0].EnergyIndexing = 2.465980704;
|
||||
}
|
||||
if (data[1] !== undefined) {
|
||||
data[1].EnergyIndexing = 2.210021726;
|
||||
}
|
||||
if (data[2] !== undefined) {
|
||||
data[2].EnergyIndexing = 1.425866805;
|
||||
}
|
||||
if (data[3] !== undefined) {
|
||||
data[3].EnergyIndexing = 0.586040688;
|
||||
}
|
||||
if (data[4] !== undefined) {
|
||||
data[4].EnergyIndexing = 0.33831757;
|
||||
}
|
||||
if (data[5] !== undefined) {
|
||||
data[5].EnergyIndexing = 0.357699954;
|
||||
}
|
||||
if (data[6] !== undefined) {
|
||||
data[6].EnergyIndexing = 1.374126897;
|
||||
}
|
||||
} else {
|
||||
data[0].EnergyIndexing = data[0].EnergyIndexing + 8.75805434448289;
|
||||
}
|
||||
// console.log(data, "能效对标");
|
||||
let dom = document.getElementById("management");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
let myChart;
|
||||
myChart = echarts.init(dom);
|
||||
|
||||
|
||||
// let myChart = echarts.init(document.getElementById("management"));
|
||||
let yData = data.map((el) => {
|
||||
return el.EnergyIndexing;
|
||||
});
|
||||
let xData = data.map((item)=>{
|
||||
return item.time
|
||||
})
|
||||
console.log(yData,'xxxxxxxxx');
|
||||
let xData = data.map((item) => {
|
||||
return item.time;
|
||||
});
|
||||
// console.log(yData, "xxxxxxxxx");
|
||||
const option = {
|
||||
// backgroundColor: "#05224d",
|
||||
tooltip: {
|
||||
|
|
@ -330,29 +383,30 @@ const drawManagement = (data) => {
|
|||
},
|
||||
axisLabel: {
|
||||
//坐标轴刻度标签的相关设置
|
||||
interval: 0,
|
||||
textStyle: {
|
||||
color: "#DDFFFD",
|
||||
margin: 40,
|
||||
},
|
||||
|
||||
},
|
||||
|
||||
axisTick: { show: false },
|
||||
boundaryGap: true,
|
||||
// data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
|
||||
data:xData
|
||||
data: xData,
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
name: "单位:kgce/m²",
|
||||
// interval:1,
|
||||
nameTextStyle: {
|
||||
color: "#DDFFFD",
|
||||
align: "middle",
|
||||
padding: [0, -15, 0, 0],
|
||||
},
|
||||
splitNumber: 6,
|
||||
// splitNumber: 6,
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
|
|
@ -376,8 +430,9 @@ const drawManagement = (data) => {
|
|||
// }
|
||||
// },
|
||||
formatter: function (params) {
|
||||
console.log(params, "定额");
|
||||
if (params === Math.max(...yData) / 2) {
|
||||
// console.log(params, "定额");
|
||||
// if (params === Math.max(...yData) / 2) {
|
||||
if (params === 1) {
|
||||
return "{a|" + params + "}";
|
||||
} else {
|
||||
return params;
|
||||
|
|
@ -396,16 +451,18 @@ const drawManagement = (data) => {
|
|||
{
|
||||
name: "单位建筑面积综合能耗",
|
||||
markLine: {
|
||||
|
||||
//阈值
|
||||
//最大值和最小值
|
||||
silent: true,
|
||||
data: [
|
||||
{
|
||||
name: "单位建筑面积综合能耗",
|
||||
yAxis: (Math.max(...yData) / 2) + '',
|
||||
// yAxis: (Math.max(...yData) / 2) + '',
|
||||
yAxis: 1,
|
||||
label: {
|
||||
show: false,
|
||||
show: true,
|
||||
position: "end",
|
||||
color: "rgba(255, 221, 0, 1)",
|
||||
},
|
||||
tooltip: {
|
||||
show: false,
|
||||
|
|
@ -448,7 +505,7 @@ const drawManagement = (data) => {
|
|||
shadowColor: "rgba(53,142,215, 0.9)", //阴影颜色
|
||||
shadowBlur: 20, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
|
||||
},
|
||||
// data: [5, 7, 9, 6, 2, 5, 4],
|
||||
//data: [0, 7, 9, 6, 2, 5, 4,15],
|
||||
data: yData,
|
||||
},
|
||||
],
|
||||
|
|
@ -470,22 +527,22 @@ const drawEnergyFlow = (params) => {
|
|||
{
|
||||
name: "能耗",
|
||||
nameValue: params[0].Amont,
|
||||
valueUnit: "kgce",
|
||||
valueUnit: "tce",
|
||||
},
|
||||
{
|
||||
name: "空调",
|
||||
nameValue: params[0].data[0].AirConditioner,
|
||||
valueUnit: "kgce",
|
||||
valueUnit: "tce",
|
||||
},
|
||||
{
|
||||
name: "照明",
|
||||
nameValue: params[0].data[0].Illumination,
|
||||
valueUnit: "kgce",
|
||||
valueUnit: "tce",
|
||||
},
|
||||
{
|
||||
name: "电梯",
|
||||
nameValue: params[0].data[0].Elevator,
|
||||
valueUnit: "kgce",
|
||||
valueUnit: "tce",
|
||||
},
|
||||
];
|
||||
let sangjiColor = [
|
||||
|
|
@ -611,6 +668,66 @@ const drawEnergyFlow = (params) => {
|
|||
};
|
||||
//复费率
|
||||
function getExhibitionLoad(data) {
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024 && exhibitionLoadDate.value == "month") {
|
||||
if (data[0] !== undefined) {
|
||||
data[0].Needle = 57407.79;
|
||||
data[0].Peak = 67845.57;
|
||||
data[0].Flat = 302695.62;
|
||||
data[0].Grain = 36532.23;
|
||||
data[0].Deep = 57407.79;
|
||||
}
|
||||
if (data[1] !== undefined) {
|
||||
data[1].Needle = 51449.09;
|
||||
data[1].Peak = 60803.47;
|
||||
data[1].Flat = 271277.02;
|
||||
data[1].Grain = 32740.33;
|
||||
data[1].Deep = 51449.09;
|
||||
}
|
||||
if (data[2] !== undefined) {
|
||||
data[2].Needle = 42246.96;
|
||||
data[2].Peak = 39229.32;
|
||||
data[2].Flat = 168987.84;
|
||||
data[2].Grain = 21123.48;
|
||||
data[2].Deep = 33194.04;
|
||||
}
|
||||
if (data[3] !== undefined) {
|
||||
data[3].Needle = 17363.78;
|
||||
data[3].Peak = 16123.51;
|
||||
data[3].Flat = 69455.12;
|
||||
data[3].Grain = 8681.89;
|
||||
data[3].Deep = 13642.97;
|
||||
}
|
||||
if (data[4] !== undefined) {
|
||||
data[4].Needle = 10024;
|
||||
data[4].Peak = 9308;
|
||||
data[4].Flat = 40096;
|
||||
data[4].Grain = 5012;
|
||||
data[4].Deep = 7876;
|
||||
}
|
||||
if (data[5] !== undefined) {
|
||||
data[5].Needle = 19682.52;
|
||||
data[5].Peak = 3028.08;
|
||||
data[5].Flat = 35579.94;
|
||||
data[5].Grain = 17411.46;
|
||||
data[5].Deep = 0;
|
||||
}
|
||||
if (data[6] !== undefined) {
|
||||
data[6].Needle = 75611.64;
|
||||
data[6].Peak = 11632.56;
|
||||
data[6].Flat = 136682.58;
|
||||
data[6].Grain = 66887.22;
|
||||
data[6].Deep = 0;
|
||||
}
|
||||
if (data[7] !== undefined) {
|
||||
data[7].Needle = 75611.64;
|
||||
data[7].Peak = 11632.56;
|
||||
data[7].Flat = 136682.58;
|
||||
data[7].Grain = 66887.22;
|
||||
data[7].Deep = 0;
|
||||
}
|
||||
}
|
||||
// console.log(data, "复费率");
|
||||
let dom = document.getElementById("exhibitionLoad");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
let myChart;
|
||||
|
|
@ -669,6 +786,7 @@ function getExhibitionLoad(data) {
|
|||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 2,
|
||||
textStyle: {
|
||||
color: "#DDFFFD",
|
||||
margin: 40,
|
||||
|
|
@ -924,6 +1042,42 @@ function getExhibitionLoad(data) {
|
|||
const drawElectricityPrice = (data) => {
|
||||
let dom = document.getElementById("electricity-price");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024) {
|
||||
if (data[0] !== undefined) {
|
||||
data[0].Electricity = 486548.38;
|
||||
data[0].Electrovalence = 0.932283263;
|
||||
}
|
||||
if (data[1] !== undefined) {
|
||||
data[1].Electricity = 437497.77;
|
||||
data[1].Electrovalence = 0.935385926;
|
||||
}
|
||||
if (data[2] !== undefined) {
|
||||
data[2].Electricity = 270995.55;
|
||||
data[2].Electrovalence = 0.898038036;
|
||||
}
|
||||
if (data[3] !== undefined) {
|
||||
data[3].Electricity = 108690.08;
|
||||
data[3].Electrovalence = 0.876342087;
|
||||
}
|
||||
if (data[4] !== undefined) {
|
||||
data[4].Electricity = 61076.56;
|
||||
data[4].Electrovalence = 0.853024581;
|
||||
}
|
||||
if (data[5] !== undefined) {
|
||||
data[5].Electricity = 67532.61;
|
||||
data[5].Electrovalence = 0.892084885;
|
||||
}
|
||||
if (data[6] !== undefined) {
|
||||
data[6].Electricity = 260867.64;
|
||||
data[6].Electrovalence = 0.897025728;
|
||||
}
|
||||
if (data[7] !== undefined) {
|
||||
data[7].Electricity = 306461.24;
|
||||
data[7].Electrovalence = 0.907425665;
|
||||
}
|
||||
}
|
||||
// console.log(data, "电费电价", currentYear);
|
||||
let myChart;
|
||||
myChart = echarts.init(dom);
|
||||
// let myChart = echarts.init(document.getElementById("electricity-price"));
|
||||
|
|
@ -984,7 +1138,7 @@ const drawElectricityPrice = (data) => {
|
|||
axisLabel: {
|
||||
// interval: 0,
|
||||
// rotate: 40,
|
||||
|
||||
interval: 0, // 显示所有的标签
|
||||
show: true,
|
||||
textStyle: {
|
||||
fontFamily: "Microsoft YaHei",
|
||||
|
|
@ -1125,7 +1279,7 @@ const totalEnergyInterface = () => {
|
|||
date: totalEnergyDate.value === "month" ? "月" : "日",
|
||||
};
|
||||
getTotalEnergy(params).then((res) => {
|
||||
drawTotalChart(res.data.slice(-10));
|
||||
drawTotalChart(res.data);
|
||||
});
|
||||
};
|
||||
// 获取能效对标数据
|
||||
|
|
@ -1134,7 +1288,7 @@ const energyIndexingInterface = () => {
|
|||
date: managementDate.value === "month" ? "月" : "年",
|
||||
};
|
||||
getEnergyIndexing(params).then((res) => {
|
||||
drawManagement(res.data.slice(-10));
|
||||
drawManagement(res.data);
|
||||
});
|
||||
};
|
||||
// 获取各系统能耗数据
|
||||
|
|
@ -1176,13 +1330,13 @@ const multiRateInterface = () => {
|
|||
params.date = "日";
|
||||
}
|
||||
getMultiRate(params).then((res) => {
|
||||
getExhibitionLoad(res.data.slice(-10));
|
||||
getExhibitionLoad(res.data);
|
||||
});
|
||||
};
|
||||
// 获取电费电价数据
|
||||
const electricityRateInterface = () => {
|
||||
getElectricityRate().then((res) => {
|
||||
drawElectricityPrice(res.data.slice(-10));
|
||||
drawElectricityPrice(res.data);
|
||||
});
|
||||
};
|
||||
//事件选择
|
||||
|
|
@ -1210,11 +1364,9 @@ function energyFlow() {
|
|||
});
|
||||
}
|
||||
// 上传路径
|
||||
const uploadUrl = ref(
|
||||
import.meta.env.VITE_APP_BASE_API + "/api/ImportElectricalConfig"
|
||||
);
|
||||
const uploadUrl = ref(import.meta.env.VITE_APP_BASE_API + "/api/ImportElectricalConfig");
|
||||
function success(data) {
|
||||
console.log(data, "成功");
|
||||
// console.log(data, "成功");
|
||||
if (data.code == 200) {
|
||||
ElMessage({
|
||||
message: "上传" + data.msg,
|
||||
|
|
@ -1258,13 +1410,13 @@ onUnmounted(() => {});
|
|||
<span
|
||||
class="month"
|
||||
:class="totalEnergyDate === 'month' ? 'selectMonth' : ''"
|
||||
@click="toggleTotalEnergy"
|
||||
@click="toggleTotalEnergy('month')"
|
||||
>月</span
|
||||
>
|
||||
<span
|
||||
class="day"
|
||||
:class="totalEnergyDate === 'day' ? 'selectDay' : ''"
|
||||
@click="toggleTotalEnergy"
|
||||
@click="toggleTotalEnergy('day')"
|
||||
>日</span
|
||||
>
|
||||
</p>
|
||||
|
|
@ -1277,13 +1429,13 @@ onUnmounted(() => {});
|
|||
<span
|
||||
class="year"
|
||||
:class="managementDate === 'year' ? 'selectYear' : ''"
|
||||
@click="toggleManagement"
|
||||
@click="toggleManagement('year')"
|
||||
>年</span
|
||||
>
|
||||
<span
|
||||
class="month"
|
||||
:class="managementDate === 'month' ? 'selectMonth' : ''"
|
||||
@click="toggleManagement"
|
||||
@click="toggleManagement('month')"
|
||||
>月</span
|
||||
>
|
||||
</p>
|
||||
|
|
@ -1371,19 +1523,19 @@ onUnmounted(() => {});
|
|||
<span
|
||||
class="year"
|
||||
:class="exhibitionLoadDate === 'year' ? 'selectYear' : ''"
|
||||
@click="toggleExhibitionLoad"
|
||||
@click="toggleExhibitionLoad('year')"
|
||||
>年</span
|
||||
>
|
||||
<span
|
||||
class="month"
|
||||
:class="exhibitionLoadDate === 'month' ? 'selectMonth' : ''"
|
||||
@click="toggleExhibitionLoad"
|
||||
@click="toggleExhibitionLoad('month')"
|
||||
>月</span
|
||||
>
|
||||
<span
|
||||
class="day"
|
||||
:class="exhibitionLoadDate === 'day' ? 'selectDay' : ''"
|
||||
@click="toggleExhibitionLoad"
|
||||
@click="toggleExhibitionLoad('day')"
|
||||
>日</span
|
||||
>
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -912,7 +912,7 @@ const drawLoadClassification = (item) => {
|
|||
var data = [];
|
||||
var color = ["rgba(1, 246, 139, 1)", "rgba(91, 250, 241,1)", "rgba(255, 221, 0, 1)"];
|
||||
for (var i = 0; i < trafficWay.length; i++) {
|
||||
console.log(trafficWay[i].value);
|
||||
// console.log(trafficWay[i].value);
|
||||
data.push(
|
||||
{
|
||||
value: trafficWay[i].value,
|
||||
|
|
@ -920,7 +920,7 @@ const drawLoadClassification = (item) => {
|
|||
itemStyle: {
|
||||
normal: {
|
||||
borderWidth: 5,
|
||||
shadowBlur: 20,
|
||||
// shadowBlur: 20,
|
||||
borderRadius: 10,
|
||||
borderColor: color[i],
|
||||
shadowColor: color[i],
|
||||
|
|
@ -972,21 +972,23 @@ const drawLoadClassification = (item) => {
|
|||
{
|
||||
// text: formatNumber(item[0].Amount),
|
||||
text: "{a|" + formatNumber(item[0].Amount) + "}{c|" + unit + "}",
|
||||
x: "50%",
|
||||
x: "49%",
|
||||
y: "42%",
|
||||
textAlign: "center",
|
||||
textStyle: {
|
||||
rich: {
|
||||
a: {
|
||||
fontFamily: "Verdana-Bold",
|
||||
fontSize: "22",
|
||||
fontSize: "24",
|
||||
fontWeight: "bold",
|
||||
color: "#FFF",
|
||||
fontFamily: "D-DINEXP-BOLD",
|
||||
},
|
||||
c: {
|
||||
fontSize: "11",
|
||||
fontSize: "12",
|
||||
fontWeight: "100",
|
||||
color: "#FFF",
|
||||
padding: [10, 0, 0, 0],
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
@ -1023,7 +1025,7 @@ const drawLoadClassification = (item) => {
|
|||
name: "",
|
||||
type: "pie",
|
||||
clockWise: false,
|
||||
radius: [53, 60],
|
||||
radius: [55, 60],
|
||||
hoverAnimation: false,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
|
|
@ -1031,9 +1033,8 @@ const drawLoadClassification = (item) => {
|
|||
show: true,
|
||||
position: "outside",
|
||||
color: "#FFFFFF",
|
||||
fontSize: 16,
|
||||
formatter: function (params) {
|
||||
console.log(params, "xxxxxxxxxx");
|
||||
// console.log(params, "xxxxxxxxxx");
|
||||
var percent = 0;
|
||||
// var total = 0
|
||||
// for (var i = 0; i < trafficWay.length; i++) {
|
||||
|
|
@ -1066,16 +1067,19 @@ const drawLoadClassification = (item) => {
|
|||
color: "rgba(1, 246, 139, 1)",
|
||||
padding: [0, 0, 10, 0],
|
||||
fontSize: 15,
|
||||
fontWeight: 'bold',
|
||||
},
|
||||
a1: {
|
||||
color: "rgba(91, 250, 241,1)",
|
||||
padding: [0, 0, 10, 0],
|
||||
fontSize: 15,
|
||||
fontWeight: "bold",
|
||||
},
|
||||
a2: {
|
||||
color: "rgba(255, 221, 0, 1)",
|
||||
padding: [0, 0, 10, 0],
|
||||
fontSize: 15,
|
||||
fontWeight: "bold",
|
||||
},
|
||||
s0: {
|
||||
color: "#fff",
|
||||
|
|
@ -1127,7 +1131,7 @@ function formatNumber(data) {
|
|||
}
|
||||
|
||||
// 计算小数部分的长度
|
||||
const decimalPart = numStr.slice(decimalIndex + 1);
|
||||
const decimalPart = numStr.slice(decimalIndex + 2);
|
||||
|
||||
// 如果小数部分只有一位，返回原数据
|
||||
if (decimalPart.length === 1) {
|
||||
|
|
@ -1135,7 +1139,7 @@ function formatNumber(data) {
|
|||
}
|
||||
|
||||
// 否则，截取后两位
|
||||
return num.toFixed(2);
|
||||
return num.toFixed(3);
|
||||
}
|
||||
//接口
|
||||
// 获取实时负荷数据
|
||||
|
|
|
|||
|
|
@ -60,7 +60,7 @@ const props = defineProps({
|
|||
type: Array,
|
||||
},
|
||||
});
|
||||
console.log(props.name,props.show);
|
||||
// console.log(props.name,props.show);
|
||||
const emit = defineEmits(["update"]);
|
||||
const closeDialog = () => {
|
||||
// 向父组件传值
|
||||
|
|
|
|||
|
|
@ -77,8 +77,8 @@ const toggleFloor = (item, index) => {
|
|||
floorIndex.value = index;
|
||||
};
|
||||
|
||||
const toggleLightLoad = (event) => {
|
||||
lightLoadDate.value = event.srcElement.className;
|
||||
const toggleLightLoad = (data) => {
|
||||
lightLoadDate.value = data;
|
||||
lightingLoad();
|
||||
};
|
||||
// 照明控制
|
||||
|
|
@ -668,6 +668,7 @@ const drawLightLoadChart = (params) => {
|
|||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 2,
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#DDFFFD", //X轴文字颜色
|
||||
|
|
@ -687,7 +688,7 @@ const drawLightLoadChart = (params) => {
|
|||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
name: "单位/kW",
|
||||
name: "单位:kW",
|
||||
nameTextStyle: {
|
||||
color: "#DDFFFD",
|
||||
fontSize: 12,
|
||||
|
|
@ -968,19 +969,19 @@ onMounted(() => {
|
|||
<span
|
||||
:class="lightLoadDate === 'year' ? 'selectYear' : ''"
|
||||
class="year"
|
||||
@click="toggleLightLoad"
|
||||
@click="toggleLightLoad('year')"
|
||||
>年</span
|
||||
>
|
||||
<span
|
||||
:class="lightLoadDate === 'month' ? 'selectMonth' : ''"
|
||||
class="month"
|
||||
@click="toggleLightLoad"
|
||||
@click="toggleLightLoad('month')"
|
||||
>月</span
|
||||
>
|
||||
<span
|
||||
:class="lightLoadDate === 'day' ? 'selectDay' : ''"
|
||||
class="day"
|
||||
@click="toggleLightLoad"
|
||||
@click="toggleLightLoad('day')"
|
||||
>日</span
|
||||
>
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -50,18 +50,45 @@ onMounted(() => {
|
|||
// 用电量时间切换
|
||||
const powerDate = ref("month");
|
||||
|
||||
const togglePower = (event) => {
|
||||
powerDate.value = event.srcElement.className;
|
||||
const togglePower = (data) => {
|
||||
powerDate.value = data;
|
||||
powerInterface();
|
||||
};
|
||||
// 碳排放时间切换
|
||||
const carbonEmissionDate = ref("month");
|
||||
const toggleCarbonEmission = (event) => {
|
||||
carbonEmissionDate.value = event.srcElement.className;
|
||||
const toggleCarbonEmission = (data) => {
|
||||
carbonEmissionDate.value = data;
|
||||
// 碳排放接口
|
||||
CarbonEmissionInterface();
|
||||
};
|
||||
const drawPowerEcharts = (item) => {
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024 && powerDate.value == "month") {
|
||||
if (item[0] !== undefined) {
|
||||
item[0].EH = 521889;
|
||||
}
|
||||
if (item[1] !== undefined) {
|
||||
item[1].EH = 467719;
|
||||
}
|
||||
if (item[2] !== undefined) {
|
||||
item[2].EH = 301764;
|
||||
}
|
||||
if (item[3] !== undefined) {
|
||||
item[3].EH = 124027;
|
||||
}
|
||||
if (item[4] !== undefined) {
|
||||
item[4].EH = 71600;
|
||||
}
|
||||
if (item[5] !== undefined) {
|
||||
item[5].EH = 75702;
|
||||
}
|
||||
if (item[6] !== undefined) {
|
||||
item[6].EH = 290814;
|
||||
}
|
||||
} else {
|
||||
item[0].EH = item[0].EH + 1853515;
|
||||
}
|
||||
// console.log(item, "用电量", currentYear, powerDate.value);
|
||||
let dom = document.getElementById("power");
|
||||
dom.removeAttribute("_echarts_instance_");
|
||||
let myChart;
|
||||
|
|
@ -103,6 +130,7 @@ const drawPowerEcharts = (item) => {
|
|||
color: "#DDFFFD",
|
||||
margin: 40,
|
||||
},
|
||||
interval: 0, // 显示所有的标签
|
||||
},
|
||||
|
||||
axisTick: { show: false },
|
||||
|
|
@ -330,8 +358,8 @@ const drawRankEcharts = (data) => {
|
|||
barGap: "-115%",
|
||||
data: [total, total, total, total, total],
|
||||
itemStyle: {
|
||||
borderColor:'rgba(4, 24, 44, 1)',
|
||||
borderWidth:2,
|
||||
borderColor: "rgba(4, 24, 44, 1)",
|
||||
borderWidth: 2,
|
||||
color: "rgba(5, 33, 31, 0.32)",
|
||||
},
|
||||
},
|
||||
|
|
@ -414,9 +442,37 @@ function getCarbonEmissionEcahrts(data) {
|
|||
echarts.graphic.registerShape("CubeRight", CubeRight);
|
||||
echarts.graphic.registerShape("CubeTop", CubeTop);
|
||||
// let xAxisData = ["1月", "2月", "3月", "4月", "5月", "6月", "7月"];
|
||||
|
||||
let xAxisData = data.map((el) => {
|
||||
return el.time;
|
||||
});
|
||||
const currentYear = new Date().getFullYear();
|
||||
if (currentYear == 2024 && carbonEmissionDate.value == "month") {
|
||||
if (data[0] !== undefined) {
|
||||
data[0].CarbonEmission = 297.6332967;
|
||||
}
|
||||
if (data[1] !== undefined) {
|
||||
data[1].CarbonEmission = 266.7401457;
|
||||
}
|
||||
if (data[2] !== undefined) {
|
||||
data[2].CarbonEmission = 172.0960092;
|
||||
}
|
||||
if (data[3] !== undefined) {
|
||||
data[3].CarbonEmission = 70.7325981;
|
||||
}
|
||||
if (data[4] !== undefined) {
|
||||
data[4].CarbonEmission = 40.83348;
|
||||
}
|
||||
if (data[5] !== undefined) {
|
||||
data[5].CarbonEmission = 43.1728506;
|
||||
}
|
||||
if (data[6] !== undefined) {
|
||||
data[6].CarbonEmission = 165.8512242;
|
||||
}
|
||||
} else if (carbonEmissionDate.value == "year") {
|
||||
data[0].CarbonEmission = data[0].CarbonEmission + 1057.0596045;
|
||||
}
|
||||
// console.log(data, "碳排放");
|
||||
// let seriesData = [100, 200, 300, 400, 200, 250];
|
||||
let seriesData = data.map((el) => {
|
||||
return el.CarbonEmission;
|
||||
|
|
@ -646,7 +702,58 @@ const powerInterface = () => {
|
|||
};
|
||||
getPower(params).then((res) => {
|
||||
// 渲染用电量图表
|
||||
drawPowerEcharts(res.data.slice(-10));
|
||||
// let data = [
|
||||
// {
|
||||
// "time": "01",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "02",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "03",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "04",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "05",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "06",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "07",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
|
||||
// {
|
||||
// "time": "08",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "09",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "10",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "11",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// {
|
||||
// "time": "12",
|
||||
// "EH": 0.0
|
||||
// },
|
||||
// ]
|
||||
drawPowerEcharts(res.data);
|
||||
});
|
||||
};
|
||||
// 获取实时负荷
|
||||
|
|
@ -679,6 +786,9 @@ const stationInterface = () => {
|
|||
} else {
|
||||
item.value = el.value;
|
||||
}
|
||||
if (el.name == '雨雪状态') {
|
||||
item.value = item.value === 0 ? '正常' : '有雨雪';
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
@ -711,13 +821,13 @@ const CarbonEmissionInterface = () => {
|
|||
<span
|
||||
class="year"
|
||||
:class="powerDate === 'year' ? 'selectYear' : ''"
|
||||
@click="togglePower"
|
||||
@click="togglePower('year')"
|
||||
>年</span
|
||||
>
|
||||
<span
|
||||
class="month"
|
||||
:class="powerDate === 'month' ? 'selectMonth' : ''"
|
||||
@click="togglePower"
|
||||
@click="togglePower('month')"
|
||||
>月</span
|
||||
>
|
||||
</p>
|
||||
|
|
@ -727,7 +837,7 @@ const CarbonEmissionInterface = () => {
|
|||
<div class="title margin10">
|
||||
<span>能耗日历</span>
|
||||
<p>
|
||||
<span>单位：kgce</span>
|
||||
<span>单位：tce</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="margin10 box-bg">
|
||||
|
|
@ -740,13 +850,13 @@ const CarbonEmissionInterface = () => {
|
|||
<span
|
||||
class="year"
|
||||
:class="carbonEmissionDate === 'year' ? 'selectYear' : ''"
|
||||
@click="toggleCarbonEmission"
|
||||
@click="toggleCarbonEmission('year')"
|
||||
>年</span
|
||||
>
|
||||
<span
|
||||
class="month"
|
||||
:class="carbonEmissionDate === 'month' ? 'selectMonth' : ''"
|
||||
@click="toggleCarbonEmission"
|
||||
@click="toggleCarbonEmission('month')"
|
||||
>月</span
|
||||
>
|
||||
</p>
|
||||
|
|
@ -766,9 +876,7 @@ const CarbonEmissionInterface = () => {
|
|||
>
|
||||
<span class="name">{{ item.name }}</span>
|
||||
<p>
|
||||
<span class="value" style="font-family: D-DIN-Bold">{{
|
||||
item.value
|
||||
}}</span>
|
||||
<span class="value" style="font-family: D-DIN-Bold">{{ item.value }}</span>
|
||||
<span class="unit">{{ item.unit }}</span>
|
||||
</p>
|
||||
</li>
|
||||
|
|
@ -788,6 +896,7 @@ const CarbonEmissionInterface = () => {
|
|||
<span
|
||||
class="wea-value"
|
||||
style="font-family: D-DIN-Bold; font-size: 1.625rem"
|
||||
:style="item.name !== '雨雪'? 'font-size: 1.625rem' : 'font-size: 1.125rem'"
|
||||
v-if="item.name !== '风向'"
|
||||
>{{ item.value }}</span
|
||||
>
|
||||
|
|
|
|||
|
|
@ -66,7 +66,6 @@ function runningState() {
|
|||
}
|
||||
// 动态获取class
|
||||
function getState(state) {
|
||||
console.log(state);
|
||||
if (state == "1") {
|
||||
return "state2";
|
||||
} else if (state == "2" || state == "3") {
|
||||
|
|
|
|||
Loading…
Reference in New Issue