This commit is contained in:
lll 2023-11-23 12:22:36 +08:00
parent b3101fbda6
commit c9830c2b2b
7 changed files with 1450 additions and 1420 deletions

4
package-lock.json generated
View File

@ -6011,7 +6011,7 @@
},
"node_modules/echarts-gl": {
"version": "2.0.9",
"resolved": "https://registry.npmmirror.com/echarts-gl/-/echarts-gl-2.0.9.tgz",
"resolved": "https://registry.npmjs.org/echarts-gl/-/echarts-gl-2.0.9.tgz",
"integrity": "sha512-oKeMdkkkpJGWOzjgZUsF41DOh6cMsyrGGXimbjK2l6Xeq/dBQu4ShG2w2Dzrs/1bD27b2pLTGSaUzouY191gzA==",
"dependencies": {
"claygl": "^1.2.1",
@ -17548,7 +17548,7 @@
},
"echarts-gl": {
"version": "2.0.9",
"resolved": "https://registry.npmmirror.com/echarts-gl/-/echarts-gl-2.0.9.tgz",
"resolved": "https://registry.npmjs.org/echarts-gl/-/echarts-gl-2.0.9.tgz",
"integrity": "sha512-oKeMdkkkpJGWOzjgZUsF41DOh6cMsyrGGXimbjK2l6Xeq/dBQu4ShG2w2Dzrs/1bD27b2pLTGSaUzouY191gzA==",
"requires": {
"claygl": "^1.2.1",

View File

@ -9,15 +9,27 @@
<p>生产工艺</p>
</div>
<div class="box1" v-else>
<img src="../assets/img/生产工艺按钮选中_hover.png" alt="" class="tabbars1" />
<img
src="../assets/img/生产工艺按钮选中_hover.png"
alt=""
class="tabbars1"
/>
<p>生产工艺</p>
</div>
<div class="box2" v-if="isShow">
<img src="../assets/img/能源监测按钮 拷贝.png" alt="" class="tabbars2" />
<img
src="../assets/img/能源监测按钮 拷贝.png"
alt=""
class="tabbars2"
/>
<p>能源监测</p>
</div>
<div class="box2" v-else>
<img src="../assets/img/能源监测按钮 _hover.png" alt="" class="tabbars2" />
<img
src="../assets/img/能源监测按钮 _hover.png"
alt=""
class="tabbars2"
/>
<p>能源监测</p>
</div>
<div class="box3" v-if="isShow">
@ -25,19 +37,35 @@
<p>负荷管理</p>
</div>
<div class="box3" v-else>
<img src="../assets/img/负荷管理按钮 拷贝_hover.png" alt="" class="tabbars3" />
<img
src="../assets/img/负荷管理按钮 拷贝_hover.png"
alt=""
class="tabbars3"
/>
<p>负荷管理</p>
</div>
<div class="box4" v-if="isShow">
<img src="../assets/img/能效管理按钮 拷贝.png" alt="" class="tabbars4" />
<img
src="../assets/img/能效管理按钮 拷贝.png"
alt=""
class="tabbars4"
/>
<p>能效管理</p>
</div>
<div class="box4" v-else>
<img src="../assets/img/能效管理按钮_hover.png" alt="" class="tabbars4" />
<img
src="../assets/img/能效管理按钮_hover.png"
alt=""
class="tabbars4"
/>
<p>能效管理</p>
</div>
<div class="box5" v-if="isShow">
<img src="../assets/img/智能运维按钮 拷贝.png" alt="" class="tabbars5" />
<img
src="../assets/img/智能运维按钮 拷贝.png"
alt=""
class="tabbars5"
/>
<p>智能运维</p>
</div>
<div class="box5" v-else>
@ -49,10 +77,14 @@
<p>碳资产管理</p>
</div>
<div class="box6" v-else>
<img src="../assets/img/碳资产管理 拷贝_hover.png" alt="" class="tabbars6" />
<img
src="../assets/img/碳资产管理 拷贝_hover.png"
alt=""
class="tabbars6"
/>
<p>碳资产管理</p>
</div>
</div> -->
</div>
</div>
</template>
@ -65,7 +97,7 @@ export default {
data() {
return {
isShow: true,
}
};
},
};
</script>
@ -99,7 +131,7 @@ export default {
font-size: 50px;
font-family: FZZhengHeiS-B-GB;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
}
@ -120,7 +152,7 @@ export default {
font-size: 50px;
font-family: FZZhengHeiS-B-GB;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
}
@ -141,7 +173,7 @@ export default {
font-size: 50px;
font-family: FZZhengHeiS-B-GB;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
}
@ -162,7 +194,7 @@ export default {
font-size: 50px;
font-family: FZZhengHeiS-B-GB;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
}
@ -183,7 +215,7 @@ export default {
font-size: 50px;
font-family: FZZhengHeiS-B-GB;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
}
@ -204,7 +236,7 @@ export default {
font-size: 50px;
font-family: FZZhengHeiS-B-GB;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
}
@ -225,7 +257,7 @@ export default {
font-size: 50px;
font-family: FZZhengHeiS-B-GB;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
}
@ -241,4 +273,5 @@ export default {
width: 100%;
height: 100%;
background-color: transparent;
}</style>
}
</style>

View File

@ -96,7 +96,7 @@
</div>
</template>
<script>
import * as echarts from 'echarts';
import * as echarts from "echarts";
import "echarts-gl";
import { getPie3D, getParametricEquation } from "../../utils/fhgl";
const color = ["#3cd6b7", "#fe9326", "#124fb7", "#383893"];
@ -106,15 +106,15 @@ export default {
return {
option: {
title: {
text: '单位:kW'
text: "单位:kW",
},
// tooltip: {
// trigger: 'axis',
// },
grid: {
left: '3%',
right: '4%',
bottom: '3%',
left: "3%",
right: "4%",
bottom: "3%",
// containLabel: true
},
// toolbox: {
@ -123,17 +123,17 @@ export default {
// }
// },
xAxis: {
type: 'category',
type: "category",
// boundaryGap: false,
data: ['0', '02:30', '03:30', '04:30', '05:30', '05:30']
data: ["0", "02:30", "03:30", "04:30", "05:30", "05:30"],
},
yAxis: {
type: 'value',
type: "value",
// boundaryGap: true,
data: ['100', '200', '300', '400', '500']
data: ["100", "200", "300", "400", "500"],
},
legend: {
data: ['可调负荷', '实时负荷'],
data: ["可调负荷", "实时负荷"],
x: "center",
y: "top",
itemGap: 200,
@ -141,39 +141,39 @@ export default {
color: "#fff",
fontSize: "28px",
},
fontSize: "28px"
fontSize: "28px",
},
series: [
{
name: '实时负荷',
type: 'line',
name: "实时负荷",
type: "line",
symbol: "circle",
symbolSize: 20,
data: [450, 120, 450, 428, 540, 100, 520],
lineStyle: {
width: 5,
color: "#3FFF5A"
color: "#3FFF5A",
},
itemStyle: {
color: "#3FFF5A"
}
color: "#3FFF5A",
},
},
{
name: '可调负荷',
type: 'line',
name: "可调负荷",
type: "line",
// stack: 'Total',
symbol: "circle",
symbolSize: 20,
data: [180, 420, 90, 470, 500, 90, 280],
lineStyle: {
width: 5,
color: "#43FFF4"
color: "#43FFF4",
},
itemStyle: {
color: "#43FFF4"
}
color: "#43FFF4",
},
]
},
],
},
optionData: [
{
@ -195,7 +195,7 @@ export default {
],
statusChart: null,
option1: {},
}
};
},
methods: {
BingTu() {
@ -242,7 +242,8 @@ export default {
// shadowOffsety: 20,
color: "#00D2FF",
},
}];
},
];
const sum = chartData.reduce((per, cur) => per + cur.value, 0);
const gap = (1 * sum) / 100;
const pieData1 = [];
@ -273,13 +274,13 @@ export default {
color: "#fff",
fontSize: 30,
fontWeight: "400",
lineHeight: 60
lineHeight: 60,
},
subtextStyle: {
color: "#fff",
fontSize: 26,
fontWeight: "400",
lineHeight: 36
lineHeight: 36,
},
textAlign: "center",
},
@ -357,7 +358,7 @@ export default {
},
],
};
var chartDom2 = document.getElementById('bingtu');
var chartDom2 = document.getElementById("bingtu");
var myChart = echarts.init(chartDom2);
option && myChart.setOption(option);
},
@ -371,7 +372,7 @@ export default {
normal: {
show: true,
color: color[index],
position: 'right',
position: "right",
// distance:-10,
offset: [0, 3],
formatter: [
@ -531,7 +532,6 @@ export default {
params.seriesName !== "mouseoutSeries" &&
params.seriesName !== "信用评价"
) {
// option.series true
isSelected =
this[optionName].series[params.seriesIndex].pieStatus.selected;
@ -598,15 +598,15 @@ export default {
this.setLabel();
},
mounted() {
var chartDom = document.getElementById('main');
var chartDom = document.getElementById("main");
var myChart = echarts.init(chartDom);
this.option && myChart.setOption(this.option);
this.$nextTick(() => {
this.BingTu();
this.initChart();
})
}
}
});
},
};
</script>
<style lang="less" scoped>
.box {
@ -615,6 +615,7 @@ export default {
padding-top: 500px;
box-sizing: border-box;
display: flex;
background-color: transparent;
justify-content: space-between;
}
@ -678,7 +679,7 @@ export default {
font-size: 54px;
font-family: Impact;
font-weight: 400;
color: #58FD64;
color: #58fd64;
// line-height: 341px;
span {
@ -688,7 +689,7 @@ export default {
margin-left: 18px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 341px;
}
}
@ -700,7 +701,7 @@ export default {
font-size: 36px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 196px;
}
}
@ -726,7 +727,7 @@ export default {
font-size: 54px;
font-family: Impact;
font-weight: 400;
color: #03FFD8;
color: #03ffd8;
// line-height: 341px;
span {
@ -736,7 +737,7 @@ export default {
font-size: 33px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
}
}
@ -747,7 +748,7 @@ export default {
font-size: 36px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 196px;
}
}
@ -774,7 +775,7 @@ export default {
text-align: center;
font-family: Impact;
font-weight: 400;
color: #36B1FF;
color: #36b1ff;
// line-height: 341px;
span {
@ -784,7 +785,7 @@ export default {
font-size: 33px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
}
}
@ -795,7 +796,7 @@ export default {
font-size: 36px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 196px;
}
}
@ -821,7 +822,7 @@ export default {
font-size: 54px;
font-family: Impact;
font-weight: 400;
color: #03FFD8;
color: #03ffd8;
// line-height: 341px;
span {
@ -831,7 +832,7 @@ export default {
margin-left: 18px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 341px;
}
}
@ -843,7 +844,7 @@ export default {
font-size: 36px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 196px;
}
}
@ -905,7 +906,7 @@ export default {
font-size: 42px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
line-height: 98px;
}
@ -915,7 +916,7 @@ export default {
font-size: 42px;
font-family: Microsoft YaHei;
font-weight: bold;
color: #40FFF1;
color: #40fff1;
line-height: 98px;
}
}
@ -972,7 +973,6 @@ export default {
font-size: 30px;
font-family: "MicrosoftYaHei";
}
}
#bingtu2 {
@ -995,7 +995,6 @@ export default {
font-family: "MicrosoftYaHei";
}
}
}
}
@ -1028,4 +1027,3 @@ export default {
}
}
</style>

View File

@ -67,7 +67,7 @@
</div>
</template>
<script>
import * as echarts from 'echarts';
import * as echarts from "echarts";
export default {
name: "FHGL",
data() {
@ -87,12 +87,12 @@ export default {
date1: "一级",
date2: "45.00kW",
date3: "1小时",
}],
}
},
mounted() {
}
}
],
};
},
mounted() {},
};
</script>
<style lang="less" scoped>
.box {
@ -101,6 +101,7 @@ export default {
padding-top: 500px;
box-sizing: border-box;
display: flex;
background-color: transparent;
justify-content: space-between;
}
@ -216,7 +217,7 @@ export default {
font-size: 22px;
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: bold;
color: #FFFFFF;
color: #ffffff;
line-height: 20px;
}
@ -225,7 +226,7 @@ export default {
width: 186px;
height: 41px;
font-size: 42px;
color: #56F671;
color: #56f671;
line-height: 20px;
padding-right: 9px;
}
@ -250,7 +251,7 @@ export default {
margin-top: 20px;
font-size: 59px;
font-family: Impact;
color: #58FD64;
color: #58fd64;
// line-height: 322px;
}
@ -262,7 +263,6 @@ export default {
color: #fff;
font-size: 36px;
opacity: 1;
;
}
span {
@ -272,7 +272,7 @@ export default {
margin-left: 18px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
}
}
@ -297,7 +297,7 @@ export default {
margin-top: 20px;
font-size: 59px;
font-family: Impact;
color: #03FFD8;
color: #03ffd8;
// line-height: 322px;
}
@ -309,7 +309,6 @@ export default {
color: #fff;
font-size: 36px;
opacity: 1;
;
// line-height: 185px;
}
@ -320,7 +319,7 @@ export default {
margin-left: 18px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 341px;
}
}
@ -346,7 +345,7 @@ export default {
margin-top: 20px;
font-size: 59px;
font-family: Impact;
color: #36B1FF;
color: #36b1ff;
// line-height: 322px;
}
@ -358,7 +357,6 @@ export default {
color: #fff;
font-size: 36px;
opacity: 1;
;
}
span {
@ -368,7 +366,7 @@ export default {
margin-left: 18px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
}
}
@ -393,7 +391,7 @@ export default {
margin-top: 20px;
font-size: 59px;
font-family: Impact;
color: #03FFD8;
color: #03ffd8;
// line-height: 322px;
}
@ -405,7 +403,6 @@ export default {
color: #fff;
font-size: 36px;
opacity: 1;
;
// line-height: 185px;
}
@ -416,7 +413,7 @@ export default {
margin-left: 18px;
font-family: Microsoft YaHei;
font-weight: 400;
color: #FFFFFF;
color: #ffffff;
// line-height: 341px;
}
}
@ -454,4 +451,3 @@ export default {
}
}
</style>

View File

@ -220,6 +220,7 @@ export default {
height: 100%;
padding-top: 500px;
box-sizing: border-box;
background-color: transparent;
display: flex;
justify-content: space-between;
}

View File

@ -42,6 +42,7 @@ export default {
padding-top: 500px;
box-sizing: border-box;
display: flex;
background-color: transparent;
justify-content: space-between;
.left {
width: 1237px;

View File

@ -498,6 +498,7 @@ export default {
box-sizing: border-box;
display: flex;
justify-content: space-between;
background-color: transparent;
}
.left {
width: 1237px;