zcdsj
/
factory_web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix:能源流向更换背景图，添加测点类型图标

This commit is contained in:
shijing 2024-12-25 17:20:30 +08:00
parent 0fb47feb55
commit 047b75344b
1 changed files with 94 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

165
src/views/enm_energy/energyPicture.vue
View File

@ -7,104 +7,127 @@
<div class="pictureHeader" style="top: 35px;"> <div class="pictureHeader" style="top: 35px;">
本日数据 时间段 00:00--24:00 本日数据 时间段 00:00--24:00
</div> </div>
<div class="energyNumber energyNumberLeft" style="top: 187px;"> <div class="energyNumber energyNumberLeft" style="top: 183px;">
<!-- <img v-if="dataObj.全厂电量_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.全厂用电合计" class="iconImg" src="img/tkx_e.png">
{{ dataObj.全厂电量_电 }} kWh {{ dataObj.全厂用电合计 }}
<span v-if="dataObj.全厂用电合计">kWh</span>
</div> </div>
<div class="energyNumber energyNumberLeft2" style="top: 91px;"> <div class="energyNumber energyNumberLeft2" style="top: 84px;">
<!-- <img v-if="dataObj.电石渣配电室用电_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.电石渣配电室用电_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.电石渣配电室用电_电 }} kWh {{ dataObj.电石渣配电室用电_电 }}
<span v-if="dataObj.电石渣配电室用电_电">kWh</span>
</div> </div>
<!-- 窑头配电室用电_电 --> <!-- 窑头配电室用电_电 -->
<div class="energyNumber energyNumberLeft2" style="top: 188px;"> <div class="energyNumber energyNumberLeft2" style="top: 181px;">
<!-- <img v-if="dataObj.回转窑_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.回转窑_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.回转窑_电 }} kWh {{ dataObj.回转窑_电 }}
<span v-if="dataObj.回转窑_电">kWh</span>
</div> </div>
<div class="energyNumber energyNumberLeft2" style="top: 335px;"> <div class="energyNumber energyNumberLeft2" style="top: 331px;">
<!-- <img v-if="dataObj.水泥配电室用电_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.水泥配电室用电_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.水泥配电室用电_电 }} kWh {{ dataObj.水泥配电室用电_电 }}
<span v-if="dataObj.水泥配电室用电_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 84px;">
<!-- <img v-if="dataObj.烘干破碎机_电" class="iconImg" src="img/elec.png"> --> <div class="energyNumber" style="top: 77px;">
{{ dataObj.烘干破碎机_电 }} kWh <img v-if="dataObj.烘干破碎机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.烘干破碎机_电 }}
<span v-if="dataObj.烘干破碎机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 138px;"> <div class="energyNumber" style="top: 131px;">
<!-- <img v-if="dataObj.原料立磨主电机" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.原料立磨主电机" class="iconImg" src="img/tkx_e.png">
{{ dataObj.原料立磨主电机 }}kWh {{ dataObj.原料立磨主电机 }}
<span v-if="dataObj.原料立磨主电机">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 181px;"> <div class="energyNumber" style="top: 175px;">
<!-- <img v-if="dataObj.生粉制备_循环风机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.生粉制备_循环风机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.生粉制备_循环风机_电 }} kWh {{ dataObj.生粉制备_循环风机_电 }}
<span v-if="dataObj.生粉制备_循环风机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 225px;"> <div class="energyNumber" style="top: 219px;">
<!-- <img v-if="dataObj.生粉制备_选粉机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.生粉制备_选粉机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.生粉制备_选粉机_电 }} {{ dataObj.生粉制备_选粉机_电 }}
<span v-if="dataObj.生粉制备_选粉机_电">kWh</span> <span v-if="dataObj.生粉制备_选粉机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 275px;"> <div class="energyNumber" style="top: 269px;">
<!-- <img v-if="dataObj.高温风机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.高温风机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.高温风机_电 }} kWh {{ dataObj.高温风机_电 }}
<span v-if="dataObj.高温风机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 330px;"> <div class="energyNumber" style="top: 325px;">
<!-- <img v-if="dataObj.尾排风机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.尾排风机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.尾排风机_电 }} kWh {{ dataObj.尾排风机_电 }}
<span v-if="dataObj.尾排风机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 383px;"> <div class="energyNumber" style="top: 379px;">
<!-- <img v-if="dataObj.回转窑_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.烧成工序用电合计" class="iconImg" src="img/tkx_e.png">
{{ dataObj.回转窑_电 }} kWh {{ dataObj.烧成工序用电合计 }}
<span v-if="dataObj.烧成工序用电合计">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 433px;"> <div class="energyNumber" style="top: 430px;">
<!-- <img v-if="dataObj.原料立磨主电机" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.原料立磨主电机" class="iconImg" src="img/tkx_e.png">
{{ dataObj.原料立磨主电机}} kWh {{ dataObj.原料立磨主电机}}
<span v-if="dataObj.原料立磨主电机">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 490px;"> <div class="energyNumber" style="top: 488px;">
<!-- <img v-if="dataObj.煤磨排风机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.煤磨排风机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.煤磨排风机_电 }} kWh {{ dataObj.煤磨排风机_电 }}
<span v-if="dataObj.煤磨排风机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 539px;"> <div class="energyNumber" style="top: 538px;">
<!-- <img v-if="dataObj.窑头排风机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.窑头排风机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.窑头排风机_电 }} kWh {{ dataObj.窑头排风机_电 }}
<span v-if="dataObj.窑头排风机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 609px;"> <div class="energyNumber" style="top: 608px;">
<!-- <img v-if="dataObj.水泥磨_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.水泥磨用电合计" class="iconImg" src="img/tkx_e.png">
{{ dataObj.水泥磨_电 }} kWh {{ dataObj.水泥磨用电合计 }}
<span v-if="dataObj.水泥磨用电合计">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 665px;"> <div class="energyNumber" style="top: 665px;">
<!-- <img v-if="dataObj.辊压机动_电||dataObj.辊压机定_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.辊压机动_电||dataObj.辊压机定_电" class="iconImg" src="img/tkx_e.png">
{{ (Number(dataObj.辊压机动_电) + Number(dataObj.辊压机定_电)).toFixed(2) }} kWh {{ (Number(dataObj.辊压机动_电) + Number(dataObj.辊压机定_电)).toFixed(2) }}
<span v-if="dataObj.辊压机动_电||dataObj.辊压机定_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 720px;"> <div class="energyNumber" style="top: 721px;">
<!-- <img v-if="dataObj.系统风机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.系统风机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.系统风机_电 }} kWh {{ dataObj.系统风机_电 }}
<span v-if="dataObj.系统风机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 775px;"> <div class="energyNumber" style="top: 776px;">
<!-- <img v-if="dataObj.水泥磨_选粉机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.水泥磨_选粉机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.水泥磨_选粉机_电 }} kWh {{ dataObj.水泥磨_选粉机_电 }}
<span v-if="dataObj.水泥磨_选粉机_电">kWh</span>
</div> </div>
<div class="energyNumber" style="top: 831px;"> <div class="energyNumber" style="top: 833px;">
<!-- <img v-if="dataObj.水泥磨_循环风机_电" class="iconImg" src="img/elec.png"> --> <img v-if="dataObj.水泥磨_循环风机_电" class="iconImg" src="img/tkx_e.png">
{{ dataObj.水泥磨_循环风机_电 }} kWh {{ dataObj.水泥磨_循环风机_电 }}
<span v-if="dataObj.水泥磨_循环风机_电">kWh</span>
</div> </div>
<!-- 煤 --> <!-- 煤 -->
<div class="energyNumberLeft coalNumber" style="top: 460px;"> <div class="energyNumberLeft coalNumber" style="top: 478px;">
<!-- <img v-if="dataObj.原煤累计量" class="iconImg" src="img/coal.png"> --> <img v-if="dataObj.原煤累计量" class="iconImg" src="img/tkx_c.png">
{{ dataObj.原煤累计量 }} t {{ dataObj.原煤累计量 }}
<span v-if="dataObj.水泥磨_循环风机_电">t</span>
</div> </div>
<!-- 头煤 --> <!-- 头煤 -->
<div class="energyNumberRight coalNumber" style="top: 463px;"> <div class="energyNumberRight coalNumber" style="top: 482px;">
<!-- <img v-if="dataObj.头煤_煤" class="iconImg" src="img/coal.png"> --> <img v-if="dataObj.头煤_煤" class="iconImg" src="img/tkx_c.png">
{{ dataObj.头煤_煤 }} t {{ dataObj.头煤_煤 }}
<span v-if="dataObj.头煤_煤">t</span>
</div> </div>
<!-- 尾煤 --> <!-- 尾煤 -->
<div class="energyNumberRight coalNumber" style="top: 552px;"> <div class="energyNumberRight coalNumber" style="top: 566px;">
<!-- <img v-if="dataObj.尾煤_煤" class="iconImg" src="img/coal.png"> --> <img v-if="dataObj.尾煤_煤" class="iconImg" src="img/tkx_c.png">
{{ dataObj.尾煤_煤 }} t {{ dataObj.尾煤_煤 }}
<span v-if="dataObj.尾煤_煤">t</span>
</div> </div>
<!-- 工业水 --> <!-- 工业水 -->
<div class="energyNumberLeft waterNumber" style="top: 638px;"> <div class="energyNumberLeft waterNumber" style="top: 638px;">
<!-- <img v-if="dataObj.尾煤_煤" class="iconImg" src="img/coal.png"> --> <img v-if="dataObj.尾煤_煤" class="iconImg" src="img/tkx_w.png">
{{ dataObj.工业水 }} t {{ dataObj.工业水 }}
<span v-if="dataObj.工业水">t</span>
</div> </div>
</div> </div>
</el-main> </el-main>
@ -165,20 +188,20 @@
.energyNumber{ .energyNumber{
position: absolute; position: absolute;
right: 10px; right: 10px;
color: rgb(212, 35, 122); color: #d4237a;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
} }
.coalNumber{ .coalNumber{
position: absolute; position: absolute;
right: 10px; right: 10px;
color: rgb(223, 213, 22); color: #dfd516;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
} }
.waterNumber{ .waterNumber{
position: absolute; position: absolute;
color: rgb(43, 43, 223); color: #2b2bdf;
font-size: 14px; font-size: 14px;
font-weight: bold; font-weight: bold;
} }
@ -186,10 +209,10 @@
left: 5px; left: 5px;
} }
.energyNumberLeft2{ .energyNumberLeft2{
right: 600px; right: 611px;
} }
.energyNumberRight{ .energyNumberRight{
right: 328px; right: 333px;
} }
.pictureHeader { .pictureHeader {
position: absolute; position: absolute;