冀北问题修改

This commit is contained in:
guanj
2025-12-08 16:28:34 +08:00
parent c779bec0cb
commit 8c41a8fc77
50 changed files with 7714 additions and 7287 deletions

View File

@@ -18,24 +18,48 @@
>
<div style="flex: 1">
<div class="title">终端统计</div>
<div style="height: 135px" class="box1">
<div class="boxDiv hexagon">
<div style="color: #fff">{{ statisticsList.allNum }}</div>
<div class="mt10 divBot">总数</div>
<div
class="box1"
:style="{
height: `calc(${prop.height} - ${headerHeight}px + ${fullscreen ? 0 : 56}px - 30px )`,
overflow: 'auto'
}"
>
<div class="statistics">
<div class="divBox div1">
<span class="iconfont icon-qiyezongshu" style="color: #57bc6e"></span>
<span class="divBox_title">终端总数</span>
<span class="divBox_num text-style" style="color: #57bc6e">
{{ statisticsList.allNum }}
</span>
</div>
<div class="divBox div2">
<span class="iconfont icon-zaiyunshebei" style="color: #67c23a"></span>
<span class="divBox_title">在运终端数</span>
<span class="divBox_num text-style" style="color: #67c23a">
{{ statisticsList.runNum }}
</span>
</div>
</div>
<div class="boxDiv hexagon hexagon1">
<div style="color: #fff">{{ statisticsList.runNum }}</div>
<div class="mt10 divBot">在运</div>
</div>
</div>
<div style="height: 135px" class="box1">
<div class="boxDiv hexagon hexagon2">
<div style="color: #fff">{{ statisticsList.checkNum }}</div>
<div class="mt10 divBot">调试</div>
</div>
<div class="boxDiv hexagon hexagon3">
<div style="color: #fff">{{ statisticsList.stopRunNum }}</div>
<div class="mt10 divBot">停运</div>
<div class="statistics">
<div class="divBox div3">
<span
class="iconfont icon-yichanglei_14feizhinengbiaozaiyunyichang"
style="color: #ffbf00"
></span>
<span class="divBox_title">调试终端数</span>
<span class="divBox_num text-style" style="color: #ffbf00">
{{ statisticsList.checkNum }}
</span>
</div>
<div class="divBox div4">
<span class="iconfont icon-tingyunshijianguanli" style="color: #f56c6c"></span>
<span class="divBox_title">停运终端数</span>
<span class="divBox_num text-style" style="color: #f56c6c">
{{ statisticsList.stopRunNum }}
</span>
</div>
</div>
</div>
</div>
@@ -65,7 +89,7 @@
<span style="width: 90px">终端总数</span>
<span style="flex: 1">完整性(%)</span>
<span style="flex: 1">在线率(%)</span>
<span style="flex: 1">合格(%)</span>
<span style="flex: 1">异常(%)</span>
</div>
<div
:style="{
@@ -205,7 +229,7 @@ const tableStore: any = new TableStore({
statisticsList.value.checkNum = totalData.value.filter(item => item.runFlag === '调试').length
statisticsList.value.stopRunNum = totalData.value.filter(item => item.runFlag === '停运').length
abnormal.value = tableStore.table.data
abnormal.value = tableStore.table.data.filter((k: any) => k.name != '上送国网' && k.name != '非上送国网')
}
})
tableStore.table.params.deptIndex = dictData.state.area[0].id
@@ -234,6 +258,7 @@ watch(
)
</script>
<style lang="scss" scoped>
@import '@/assets/font/iconfont.css';
.monitoringPoints {
display: flex;
}
@@ -344,32 +369,7 @@ watch(
color: #fff;
border-radius: 8px;
}
.box1 {
display: flex;
align-items: center;
justify-content: space-around;
.boxDiv {
// flex: 1;
display: flex;
flex-direction: column;
align-items: center;
position: relative;
margin: 0 5px;
div:nth-child(1) {
position: absolute;
font-size: 30px;
top: -10px;
font-weight: 700;
}
.divBot {
font-size: 16px;
position: absolute;
top: 20px;
}
color: #fff;
}
}
.hexagon {
position: relative;
width: 100px;
@@ -427,4 +427,44 @@ watch(
border-top: 27.5px solid #a52a2a;
}
}
.statistics {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.divBox {
width: 100%;
height: 70px;
padding: 10px;
display: flex;
margin-bottom: 10px;
.iconfont {
font-size: 40px;
margin-right: 5px;
}
.divBox_title {
font-weight: 550;
}
.divBox_num {
font-size: 20px;
font-weight: 550;
margin-left: auto;
font-family: AlimamaDongFangDaKai;
}
align-items: center;
// text-align: center;
border-radius: 5px;
}
.div1 {
background-color: #eef8f0;
}
.div2 {
background-color: #67c23a24;
}
.div3 {
background-color: #ffbf0024;
}
.div4 {
background-color: #f56c6c24;
}
}
</style>