|
@@ -81,7 +81,7 @@
|
|
|
</div>
|
|
|
</div> -->
|
|
|
<div class="time-list" style="overflow-y: auto;">
|
|
|
- <dv-scroll-board ref="scrollBoardRef" :config="solveTimesData" style="width: 100%; height: 100px; font-weight: 500;" />
|
|
|
+ <dv-scroll-board ref="scrollBoardRef" :config="solveTimesData" style="width: 100%; height: 80px; font-weight: 500;" />
|
|
|
</div>
|
|
|
</BorderBox1>
|
|
|
</div>
|
|
@@ -96,7 +96,7 @@
|
|
|
<div class="item-top-title">传感器实时数据</div>
|
|
|
<BorderBox1 class="table-box border-bg" backgroundColor="#00bfff15">
|
|
|
<div class="table-container">
|
|
|
- <a-table :columns="sensorColumns" :data-source="pageData.sensorDataList" :pagination="false" size="small" >
|
|
|
+ <a-table :columns="sensorColumns" :data-source="pageData.sensorDataList" :pagination="false" size="small" :scroll="{y: 180}">
|
|
|
<template #bodyCell="{ column, record }">
|
|
|
<div v-if="column.dataIndex == 'action'">
|
|
|
<a @click="goLocation('device', record.deviceID, record)">定位</a>
|
|
@@ -110,7 +110,7 @@
|
|
|
<div class="item-top-title">预警报警信息</div>
|
|
|
<BorderBox1 class="table-box border-bg" backgroundColor="#00bfff15">
|
|
|
<div class="table-container">
|
|
|
- <a-table :columns="warningColumns" :data-source="pageData.warningDataList" :pagination="false" size="small">
|
|
|
+ <a-table :columns="warningColumns" :data-source="pageData.warningDataList" :pagination="false" size="small" :scroll="{y: 180}">
|
|
|
<template #bodyCell="{ column, record }">
|
|
|
<div v-if="column.dataIndex == 'level'">
|
|
|
<span class="signal-round"
|
|
@@ -156,8 +156,22 @@
|
|
|
<span v-for="(device, index) in deviceTab " :key="index" class="btn" :class="{'active': device.code == deviceActiveCode }" @click="setTable(device.code)">{{ device.title }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="table-container">
|
|
|
- <a-table :columns="columns" :data-source="tableDate" :pagination="false" size="small" >
|
|
|
+ <div class="table-container" style="position: absolute;">
|
|
|
+ <a-table v-if="deviceActiveCode == 'tun'" :columns="networkColumns" :data-source="tableDate" :pagination="false" size="small" :scroll="{ y: 155 }" >
|
|
|
+ <template #bodyCell="{ column, record }">
|
|
|
+ <div v-if="column.dataIndex == 'action'">
|
|
|
+ <a @click="goLocation(record['nTunID'] ? 'tunnel': 'device',record.deviceID, record)">定位</a>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </a-table>
|
|
|
+ <a-table v-if="deviceActiveCode == 'gate'" :columns="gateColumns" :data-source="tableDate" :pagination="false" size="small" :scroll="{ y: 155 }" >
|
|
|
+ <template #bodyCell="{ column, record }">
|
|
|
+ <div v-if="column.dataIndex == 'action'">
|
|
|
+ <a @click="goLocation(record['nTunID'] ? 'tunnel': 'device',record.deviceID, record)">定位</a>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </a-table>
|
|
|
+ <a-table v-if="deviceActiveCode == 'window'" :columns="windowColumns" :data-source="tableDate" :pagination="false" size="small" :scroll="{ y: 155 }" >
|
|
|
<template #bodyCell="{ column, record }">
|
|
|
<div v-if="column.dataIndex == 'action'">
|
|
|
<a @click="goLocation(record['nTunID'] ? 'tunnel': 'device',record.deviceID, record)">定位</a>
|
|
@@ -168,7 +182,7 @@
|
|
|
</BorderBox11>
|
|
|
</div>
|
|
|
<div class="bottom-right bottom-lr-box">
|
|
|
- <BorderBox11 class="border-bg" title="最大阻力路线" backgroundColor="#00bfff15">
|
|
|
+ <BorderBox11 class="border-bg" title="最大阻力路线" :color="['#00FFFF']" backgroundColor="#00bfff15">
|
|
|
<div class="zl-top">
|
|
|
<div v-if="maxPaths.length > 0">
|
|
|
<template v-for="index in maxPaths.length" :key="index">
|
|
@@ -219,6 +233,9 @@
|
|
|
</div>
|
|
|
<div class="zl-path-item position10">
|
|
|
<div class="title">1盘曲回风斜井</div>
|
|
|
+ </div>
|
|
|
+ <div class="zl-path-item position11">
|
|
|
+ <div class="title">2盘曲回风斜井</div>
|
|
|
</div> -->
|
|
|
</div>
|
|
|
</BorderBox11>
|
|
@@ -383,6 +400,7 @@ function analyzePageResult(resultData){
|
|
|
|
|
|
|
|
|
if(solutionresult['MaxHPaths']){
|
|
|
+ console.log('最大阻力路线', solutionresult['MaxHPaths'])
|
|
|
maxPaths.value = solutionresult['MaxHPaths']
|
|
|
}
|
|
|
}
|
|
@@ -422,11 +440,13 @@ function analyzePageResult(resultData){
|
|
|
pageData.gateDataList = gateDataList
|
|
|
pageData.windowDataList = windowDataList
|
|
|
setTable(deviceActiveCode.value)
|
|
|
-
|
|
|
- solveTimes = [[dayjs().format('YYYY-MM-DD HH:mm:ss'), '解算用时'+ (Math.random() * 0.1 + 3).toFixed(2) + 's'] , ...solveTimes]
|
|
|
+ if(solveTimes.length >= 4){
|
|
|
+ solveTimes.shift()
|
|
|
+ }
|
|
|
+ solveTimes = [ ...solveTimes, [dayjs().format('YYYY-MM-DD HH:mm:ss'), '解算用时'+ (Math.random() * 0.1 + 3).toFixed(2) + 's']]
|
|
|
const tempSolveTimes = [...solveTimes]
|
|
|
- tempSolveTimes[0] = [`<span style="color:#00F5FE;" >${tempSolveTimes[0][0]}</span>`, `<span style="color:#00F5FE;" >${tempSolveTimes[0][1]}</span>`]
|
|
|
- scrollBoardRef.value.updateRows(tempSolveTimes, 0)
|
|
|
+ tempSolveTimes[tempSolveTimes.length - 1] = [`<span style="color:#00F5FE;" >${tempSolveTimes[tempSolveTimes.length - 1][0]}</span>`, `<span style="color:#00F5FE;" >${tempSolveTimes[tempSolveTimes.length - 1][1]}</span>`]
|
|
|
+ scrollBoardRef.value.updateRows(tempSolveTimes)
|
|
|
}
|
|
|
|
|
|
function setTable(code) {
|
|
@@ -444,7 +464,6 @@ function setTable(code) {
|
|
|
}
|
|
|
|
|
|
function goLocation(type:string ,id: string, record:any) {
|
|
|
- console.log(id, record)
|
|
|
actions.setGlobalState({ locationObj: { pageType: type, deviceid: id }, pageObj: null });
|
|
|
}
|
|
|
|
|
@@ -463,33 +482,10 @@ onUnmounted(() => {
|
|
|
<style scoped lang="less">
|
|
|
@ventSpace: zxm;
|
|
|
|
|
|
-.vent-home-header {
|
|
|
- width: 100%;
|
|
|
- height: 100px;
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- background: url('/@/assets/images/vent/new-home/header-bg.png') no-repeat;
|
|
|
- background-size: contain;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- z-index: 99;
|
|
|
-
|
|
|
- .header-icon {
|
|
|
- margin-top: 45px;
|
|
|
- }
|
|
|
-
|
|
|
- .header-text {
|
|
|
- position: fixed;
|
|
|
- top: 18px;
|
|
|
- color: #fff;
|
|
|
- font-size: 26px;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
.zl-box {
|
|
|
width: 100%;
|
|
|
- height: calc(100%);
|
|
|
- top: 50px;
|
|
|
+ height: calc(100% - 30px);
|
|
|
+ top: 80px;
|
|
|
position: relative;
|
|
|
overflow: hidden;
|
|
|
color: #fff;
|
|
@@ -516,9 +512,9 @@ onUnmounted(() => {
|
|
|
.top-box {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
- height: calc(60%);
|
|
|
+ height: calc(60% - 10px);
|
|
|
position: relative;
|
|
|
-
|
|
|
+ z-index: 99;
|
|
|
.lr-box {
|
|
|
width: 374px;
|
|
|
margin-top: 10px;
|
|
@@ -526,13 +522,13 @@ onUnmounted(() => {
|
|
|
|
|
|
.left-box {
|
|
|
.network-time{
|
|
|
- height: 50PX;
|
|
|
+ height: 50px;
|
|
|
padding-left: 10px;
|
|
|
font-size: 18px;
|
|
|
position: relative;
|
|
|
top: -5px;
|
|
|
.time{
|
|
|
- font-size: 26px;
|
|
|
+ font-size: 24px;
|
|
|
color: #00f5fe;
|
|
|
font-family: 'electronicFont';
|
|
|
}
|
|
@@ -712,7 +708,7 @@ onUnmounted(() => {
|
|
|
}
|
|
|
}
|
|
|
.time-list{
|
|
|
- height: 142px;
|
|
|
+ height: 122px;
|
|
|
margin: 30px 15px 0px 30px;
|
|
|
padding-bottom: 10px;
|
|
|
pointer-events: auto;
|
|
@@ -741,12 +737,12 @@ onUnmounted(() => {
|
|
|
.table-container {
|
|
|
width: calc(100% - 40px);
|
|
|
margin: 25px 20px 20px;
|
|
|
- height: 250px;
|
|
|
+ // height: 250px;
|
|
|
position: absolute;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.sensor-box {
|
|
|
.item-top-title {
|
|
|
&::after {
|
|
@@ -757,11 +753,21 @@ onUnmounted(() => {
|
|
|
left: 265px;
|
|
|
}
|
|
|
}
|
|
|
+ // .table-container {
|
|
|
+ // // height: 280px !important;
|
|
|
+ // }
|
|
|
}
|
|
|
-
|
|
|
.warning-box {
|
|
|
margin-top: 10px;
|
|
|
}
|
|
|
+ :deep.zxm-table-content{
|
|
|
+ max-height: none !important;
|
|
|
+ }
|
|
|
+ :deep(.zxm-table) {
|
|
|
+ table{
|
|
|
+ width:max-content;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -769,13 +775,14 @@ onUnmounted(() => {
|
|
|
|
|
|
.bottom-box {
|
|
|
width: 100%;
|
|
|
- height: calc(40% - 80px);
|
|
|
+ height: calc(40%);
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
margin-top: 0px;
|
|
|
position: relative;
|
|
|
- top: 20px;
|
|
|
+ top: 30px;
|
|
|
pointer-events: auto;
|
|
|
+ overflow-y: hidden;
|
|
|
.to-small {
|
|
|
width: 60px;
|
|
|
height: 60px;
|
|
@@ -808,7 +815,7 @@ onUnmounted(() => {
|
|
|
top: 45px;
|
|
|
right: 0;
|
|
|
padding: 0 10px 0 30px;
|
|
|
- z-index: 999;
|
|
|
+ z-index: 99;
|
|
|
|
|
|
.network-top-left {
|
|
|
display: flex;
|
|
@@ -841,11 +848,16 @@ onUnmounted(() => {
|
|
|
position: relative;
|
|
|
|
|
|
.table-container {
|
|
|
- height: 210px;
|
|
|
+ // height: 180px;
|
|
|
margin-top: 40px;
|
|
|
margin-left: 10px;
|
|
|
margin-right: 8px;
|
|
|
}
|
|
|
+ :deep(.zxm-table) {
|
|
|
+ table{
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.bottom-right {
|
|
@@ -888,32 +900,32 @@ onUnmounted(() => {
|
|
|
backdrop-filter: blur(5px);
|
|
|
}
|
|
|
}
|
|
|
- .position1 {
|
|
|
+ .position10 {
|
|
|
top: 128px;
|
|
|
left: 120px;
|
|
|
}
|
|
|
|
|
|
- .position2 {
|
|
|
+ .position11 {
|
|
|
top: 130px;
|
|
|
left: 0px;
|
|
|
}
|
|
|
|
|
|
- .position3 {
|
|
|
+ .position1 {
|
|
|
top: 52px;
|
|
|
left: 100px;
|
|
|
}
|
|
|
|
|
|
- .position4 {
|
|
|
+ .position9 {
|
|
|
top: 132px;
|
|
|
left: 270px;
|
|
|
}
|
|
|
|
|
|
- .position5 {
|
|
|
+ .position8 {
|
|
|
top: 128px;
|
|
|
left: 420px;
|
|
|
}
|
|
|
|
|
|
- .position6 {
|
|
|
+ .position2 {
|
|
|
top: 60px;
|
|
|
left: 320px;
|
|
|
}
|
|
@@ -923,22 +935,22 @@ onUnmounted(() => {
|
|
|
left: 580px;
|
|
|
}
|
|
|
|
|
|
- .position8 {
|
|
|
+ .position6 {
|
|
|
top: 123px;
|
|
|
left: 690px;
|
|
|
}
|
|
|
|
|
|
- .position9 {
|
|
|
+ .position5 {
|
|
|
top: 103px;
|
|
|
left: 830px;
|
|
|
}
|
|
|
|
|
|
- .position10 {
|
|
|
+ .position4 {
|
|
|
top: 90px;
|
|
|
left: 740px;
|
|
|
}
|
|
|
|
|
|
- .position11 {
|
|
|
+ .position3 {
|
|
|
top: 80px;
|
|
|
left: 535px;
|
|
|
}
|