Compare commits

..

No commits in common. "94065f36b2b1abec4b78c42341c8d2f743c27ea8" and "5895cf78cab0c0c005e8965a39b2a49902db39cb" have entirely different histories.

1 changed files with 23 additions and 52 deletions

View File

@ -22,7 +22,8 @@
<script src="../../api/commonRequest.js"></script> <script src="../../api/commonRequest.js"></script>
<style> <style>
html { html {
width: 100%;height: 90%;margin-top: 3%;color: #009B94 width: 100%;
height: 100%;
} }
@ -31,9 +32,9 @@
background-color: #008781; background-color: #008781;
} }
/*.shadow { .shadow {
background-color: #FFFFFF; background-color: #FFFFFF;
}*/ }
.layui-laydate { .layui-laydate {
background-color: #009B94; background-color: #009B94;
@ -98,7 +99,7 @@
} }
</script> </script>
</head> </head>
<body style="width: 100%;height: 100%;color: #FFFFFF"> <body style="width: 100%;height: 90%;margin-top: 4%;color: #009B94">
<div class="max-w-[1440px] mx-auto px-4"> <div class="max-w-[1440px] mx-auto px-4">
<div class="flex items-center justify-between mb-4"> <div class="flex items-center justify-between mb-4">
<form class="layui-form" style="color: #009B94" action=""> <form class="layui-form" style="color: #009B94" action="">
@ -120,20 +121,20 @@
</form> </form>
</div> </div>
<div class="grid grid-cols-2 gap-4 mb-2"> <div class="grid grid-cols-2 gap-6 mb-8">
<div class="bg-[#002628] border border-[#004446] p-4 rounded-lg shadow"> <div class=" p-6 rounded-lg shadow">
<h3 class="text-lg font-bold mb-1">能耗趋势分析</h3> <h3 class="text-lg font-bold mb-4">能耗趋势分析</h3>
<div id="trendChart" style="height: 280px;"></div> <div id="trendChart" style="height: 300px;"></div>
</div> </div>
<div class="bg-[#002628] border border-[#004446] p-4 rounded-lg shadow"> <div class=" p-6 rounded-lg shadow">
<h3 class="text-lg font-bold mb-1">设备能耗占比</h3> <h3 class="text-lg font-bold mb-4">设备能耗占比</h3>
<div id="deviceChart" style="height: 280px;"></div> <div id="deviceChart" style="height: 300px;"></div>
</div> </div>
</div> </div>
<div class="grid grid-cols-2 gap-4 mb-2"> <div class="grid grid-cols-2 gap-6 mb-8">
<div class="bg-[#002628] border border-[#004446] p-4 rounded-lg shadow"> <div class=" p-6 rounded-lg shadow">
<h3 class="text-lg font-bold mb-2">节能减排措施落实情况</h3> <h3 class="text-lg font-bold mb-4">节能减排措施落实情况</h3>
<div class="space-y-4"> <div class="space-y-4">
<div> <div>
<div class="flex justify-between mb-1"> <div class="flex justify-between mb-1">
@ -164,10 +165,10 @@
</div> </div>
</div> </div>
</div> </div>
<div class="bg-[#002628] p-4 rounded-lg shadow border border-[#004446]"> <div class="p-6 rounded-lg shadow">
<h3 class="text-lg font-bold mb-2">能耗异常分析</h3> <h3 class="text-lg font-bold mb-4">能耗异常分析</h3>
<div id="alarm-container" class="space-y-4" <div id="alarm-container" class="space-y-4"
style="height: 280px; overflow-y: auto;"></div> style="overflow-x: auto; max-height: 130px; overflow-y: auto;"></div>
</div> </div>
</div> </div>
@ -346,14 +347,8 @@
tooltip: { tooltip: {
trigger: 'axis' trigger: 'axis'
}, },
textStyle: {
color: '#FFFFFF'
},
legend: { legend: {
data: ['能源消耗量', '节能减排量'], data: ['能源消耗量', '节能减排量']
textStyle: {
color: '#FFFFFF'
}
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
@ -372,27 +367,13 @@
series: [{ series: [{
name: '能源消耗量', name: '能源消耗量',
type: 'line', type: 'line',
data: consumptionKwh, data: consumptionKwh
label: {
show: true,
position: 'top',
color: '#FFFFFF',
fontSize: 12,
formatter: '{c}'
}
}, { }, {
name: '节能减排量', name: '节能减排量',
type: 'line', type: 'line',
yAxisIndex: 1, yAxisIndex: 1,
data: renewableUsedKwh, data: renewableUsedKwh
label: { }]
show: true,
position: 'top',
color: '#FFFFFF',
fontSize: 12,
formatter: '{c}'
}
},]
}); });
} }
@ -411,9 +392,6 @@
type: 'shadow' type: 'shadow'
} }
}, },
textStyle: {
color: '#FFFFFF'
},
xAxis: { xAxis: {
type: 'value' type: 'value'
}, },
@ -425,14 +403,7 @@
type: 'bar', type: 'bar',
data: consumptionKwh, data: consumptionKwh,
itemStyle: { itemStyle: {
color: '#00C6BE' color: '#22c55e'
},
label: {
show: true, // 开启显示
position: 'right', // 数值显示在柱状图右侧(柱子尾部)
color: '#FFFFFF', // 设置字体颜色,根据背景可调整
fontSize: 12,
formatter: '{c}' // 显示对应的数值
} }
}] }]
}); });