Merge branch 'master' of http://172.16.1.12/luoshiwen/long_IslandOcean
This commit is contained in:
commit
6e238c6984
Binary file not shown.
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
After Width: | Height: | Size: 4.8 KiB |
Binary file not shown.
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
After Width: | Height: | Size: 4.9 KiB |
Binary file not shown.
After Width: | Height: | Size: 5.2 KiB |
|
@ -74,6 +74,85 @@ const faultList = ref([
|
|||
date:'2023-11-28 16:58:02'
|
||||
},
|
||||
])
|
||||
// 开机策略
|
||||
const runTimeList = ref([
|
||||
{
|
||||
name: "休息日",
|
||||
value: false,
|
||||
},
|
||||
{
|
||||
name: "节假日",
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
name: "日常",
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
name: "全开",
|
||||
value: true,
|
||||
},
|
||||
{
|
||||
name: "全关",
|
||||
value: true,
|
||||
}
|
||||
|
||||
]);
|
||||
// 维护提醒
|
||||
const maintenanceList = ref([
|
||||
{
|
||||
name: "1#主机",
|
||||
date: '10',
|
||||
},
|
||||
{
|
||||
name: "2#主机",
|
||||
date: '03',
|
||||
},
|
||||
{
|
||||
name: "3#主机",
|
||||
date: '01',
|
||||
},
|
||||
{
|
||||
name: "4#主机",
|
||||
date: '07',
|
||||
},
|
||||
{
|
||||
name: "5#主机",
|
||||
date: '09',
|
||||
},
|
||||
{
|
||||
name: "6#主机",
|
||||
date: '10',
|
||||
},
|
||||
{
|
||||
name: "7#主机",
|
||||
date: '06',
|
||||
},
|
||||
{
|
||||
name: "8#主机",
|
||||
date: '04',
|
||||
},
|
||||
{
|
||||
name: "9#主机",
|
||||
date: '12',
|
||||
},
|
||||
{
|
||||
name: "10#主机",
|
||||
date: '11',
|
||||
},
|
||||
{
|
||||
name: "11#主机",
|
||||
date: '05',
|
||||
},
|
||||
{
|
||||
name: "12#主机",
|
||||
date: '06',
|
||||
},
|
||||
{
|
||||
name: "13#主机",
|
||||
date: '09',
|
||||
}
|
||||
])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -142,12 +221,46 @@ const faultList = ref([
|
|||
<div class="title">
|
||||
<span>开机策略</span>
|
||||
</div>
|
||||
<div id="airConditioningLoad" class="margin10 box-bg"></div>
|
||||
<div class="margin10 box-bg">
|
||||
<div class="runningState">
|
||||
<div class="tableTitle">
|
||||
<span>策略名称</span>
|
||||
<span>策略状态</span>
|
||||
<span>操作</span>
|
||||
</div>
|
||||
<div class="tableContent">
|
||||
<div class="tableBoby"
|
||||
v-for="(item, index) in runTimeList"
|
||||
:key="index"
|
||||
>
|
||||
<span class="name">{{ item.name }}</span>
|
||||
<el-switch v-model="item.value" style="left: 8px" />
|
||||
<span>编辑</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 维护提醒-->
|
||||
<div class="title margin10">
|
||||
<span>维护提醒</span>
|
||||
</div>
|
||||
<div id="reminder" class="margin10 box-bg"></div>
|
||||
<div id="reminder" class="margin10 box-bg">
|
||||
<div class="runningState">
|
||||
<div class="tableTitle" style="height: 7%">
|
||||
<span>设备名称</span>
|
||||
<span>超期</span>
|
||||
</div>
|
||||
<div class="tableContent">
|
||||
<div class="tableBoby" style="height: 7%"
|
||||
v-for="(item, index) in maintenanceList"
|
||||
:key="index"
|
||||
>
|
||||
<span class="name">{{ item.name }}</span>
|
||||
<span class="date">{{ item.date }} <span>小时</span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
@ -194,12 +307,7 @@ const faultList = ref([
|
|||
display: block;
|
||||
}
|
||||
|
||||
.num {
|
||||
color: rgba(61, 255, 244, 1);
|
||||
font-weight: 600;
|
||||
font-size: 1.1rem;
|
||||
margin-right: .2rem;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
@ -297,10 +405,100 @@ const faultList = ref([
|
|||
font-weight: 600;
|
||||
color:rgba(91, 250, 241, 1)
|
||||
}
|
||||
.num{
|
||||
color:rgba(1, 246, 139, 1);
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
.date{
|
||||
color:rgba(202, 202, 202, 1);
|
||||
font-size: .8rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//开机策略
|
||||
.tableBoby>span{
|
||||
//width: 4rem;
|
||||
text-align: center;
|
||||
flex-basis: 33%;
|
||||
display: block;
|
||||
}
|
||||
.tableBoby .date{
|
||||
font-weight: 600;
|
||||
color: rgba(61, 255, 244, 1);
|
||||
span{
|
||||
font-weight: normal;
|
||||
color: rgba(221, 255, 253, 1);
|
||||
}
|
||||
}
|
||||
:deep(.el-switch){
|
||||
//width: 4rem;
|
||||
flex-basis: 33%;
|
||||
justify-content: center;
|
||||
}
|
||||
.runningState {
|
||||
height: 98%;
|
||||
width: 100%;
|
||||
padding: 2% 2%;
|
||||
box-sizing: border-box;
|
||||
.tableTitle {
|
||||
background: url("../../assets/images/overview/runTime.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
height: 15.5%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
span{
|
||||
flex-basis: 33%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
}
|
||||
.tableContent {
|
||||
width: 100%;
|
||||
height: calc(100% - 4.5%);
|
||||
overflow: auto;
|
||||
scrollbar-width: none; /* firefox */
|
||||
-ms-overflow-style: none; /* IE 10+ */
|
||||
.tableBoby {
|
||||
background: url("../../assets/images/air-conditioning/table-item.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
height: 15.5%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
font-size: 14px;
|
||||
margin-top: .3rem;
|
||||
}
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
display: none; /* Chrome Safari */
|
||||
}
|
||||
}
|
||||
:deep(.el-switch__core) {
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
border: 1px solid rgba(223, 94, 94, 1);
|
||||
}
|
||||
|
||||
:deep(.el-switch.is-checked .el-switch__core) {
|
||||
background: transparent;
|
||||
border: 1px solid rgba(80, 233, 83, 1);
|
||||
}
|
||||
:deep(.el-switch__core .el-switch__action) {
|
||||
border-radius: 0;
|
||||
height: 13px;
|
||||
width: 13px;
|
||||
background: rgba(223, 94, 94, 1);
|
||||
}
|
||||
:deep(.el-switch.is-checked .el-switch__action) {
|
||||
border-radius: 0;
|
||||
height: 13px;
|
||||
width: 13px;
|
||||
background: rgba(80, 233, 83, 1);
|
||||
}
|
||||
</style>
|
|
@ -361,7 +361,7 @@ const drawEnergyFlow = () => {
|
|||
];
|
||||
let itemStyleSource = [];
|
||||
for (let d = 0; d < sourceData.length; d++) {
|
||||
if (sourceData[d].name == "电") {
|
||||
if (sourceData[d].name === "电") {
|
||||
sourceData[d].label = {
|
||||
position: "right",
|
||||
};
|
||||
|
@ -384,8 +384,6 @@ const drawEnergyFlow = () => {
|
|||
bottom: "4%",
|
||||
left: "6%",
|
||||
right: "5%",
|
||||
nodeWidth: '12',
|
||||
|
||||
nodeAlign:'right',
|
||||
nodeWidth: "13",
|
||||
// nodeAlign:'right',
|
||||
|
|
|
@ -1,13 +1,115 @@
|
|||
<script setup>
|
||||
|
||||
import {ref} from "vue"
|
||||
import getPath from "@/utils/getPath.js";
|
||||
// 照明监测
|
||||
const lightingNumList = ref([
|
||||
{
|
||||
name:"照明四路数量",
|
||||
num:1130,
|
||||
pic:getPath.lightTotal,
|
||||
},
|
||||
{
|
||||
name:"照明四路灭灯数量",
|
||||
num:1130,
|
||||
pic:getPath.noLightNum,
|
||||
},
|
||||
{
|
||||
name:"照明四路亮灯数量",
|
||||
num:1130,
|
||||
pic:getPath.lightingNum,
|
||||
},
|
||||
{
|
||||
name:"离线数量",
|
||||
num:1130,
|
||||
pic:getPath.offlineNum,
|
||||
}
|
||||
])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
照明
|
||||
</div>
|
||||
<div class="page m100">
|
||||
<div class="page-left-box">
|
||||
<!-- 照明监测-->
|
||||
<div class="title">
|
||||
<span>照明监测</span>
|
||||
</div>
|
||||
<div class="margin10 box-bg" id="light">
|
||||
<div class="light-item" v-for="(item,index) in lightingNumList">
|
||||
<img :src="item.pic" alt="">
|
||||
<p>
|
||||
<span class="name">{{item.name}}</span>
|
||||
<span class="num">{{item.num}}<span class="unit">个</span></span>
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 当日累计用电量-->
|
||||
<div class="title margin10">
|
||||
<span>照明回路详情</span>
|
||||
</div>
|
||||
<div class="margin10 box-bg"></div>
|
||||
<!-- 照明负荷-->
|
||||
<div class="title margin10">
|
||||
<span>照明负荷</span>
|
||||
</div>
|
||||
<div class="margin10 box-bg"></div>
|
||||
</div>
|
||||
<div class="page-right-box">
|
||||
<!-- 展馆照明 -->
|
||||
<div class="title">
|
||||
<span>展馆照明</span>
|
||||
</div>
|
||||
<div class="margin10 box-bg" id="airConditioningLoad"></div>
|
||||
<!-- 照明控制-->
|
||||
<div class="title margin10">
|
||||
<span>照明控制</span>
|
||||
</div>
|
||||
<div class="margin10 box-bg" id="exhibitionLoad"></div>
|
||||
<!-- 故障情况-->
|
||||
<div class="title margin10">
|
||||
<span>故障情况</span>
|
||||
</div>
|
||||
<div class="margin10 box-bg" id="ranking"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
//照明监测
|
||||
#light{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: space-evenly;
|
||||
//padding: 2% 10%;
|
||||
box-sizing: border-box;
|
||||
img{
|
||||
width: 3.875rem;
|
||||
height: 4.375rem;
|
||||
}
|
||||
}
|
||||
.light-item{
|
||||
display: flex;
|
||||
flex-basis: 50%;
|
||||
padding-left: 2rem;
|
||||
box-sizing: border-box;
|
||||
p{
|
||||
margin-left: .5rem;
|
||||
.name{
|
||||
margin-top: 1.3rem;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
.num {
|
||||
color: rgba(1, 246, 139, 1);
|
||||
font-weight: 700;
|
||||
font-size: 1.25rem !important;
|
||||
}
|
||||
.unit{
|
||||
margin-left: .2rem;
|
||||
}
|
||||
.name,.num{
|
||||
display: block;
|
||||
font-size: .75rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -249,23 +249,23 @@ const runTimeList = ref([
|
|||
display: none; /* Chrome Safari */
|
||||
}
|
||||
}
|
||||
::v-deep .el-switch__core {
|
||||
:deep(.el-switch__core) {
|
||||
border-radius: 0;
|
||||
background: transparent;
|
||||
border: 1px solid rgba(223, 94, 94, 1);
|
||||
}
|
||||
|
||||
::v-deep .el-switch.is-checked .el-switch__core {
|
||||
:deep(.el-switch.is-checked .el-switch__core) {
|
||||
background: transparent;
|
||||
border: 1px solid rgba(80, 233, 83, 1);
|
||||
}
|
||||
::v-deep .el-switch__core .el-switch__action {
|
||||
:deep(.el-switch__core .el-switch__action) {
|
||||
border-radius: 0;
|
||||
height: 13px;
|
||||
width: 13px;
|
||||
background: rgba(223, 94, 94, 1);
|
||||
}
|
||||
::v-deep .el-switch.is-checked .el-switch__action {
|
||||
:deep(.el-switch.is-checked .el-switch__action) {
|
||||
border-radius: 0;
|
||||
height: 13px;
|
||||
width: 13px;
|
||||
|
|
Loading…
Reference in New Issue