|
|
@ -14,7 +14,7 @@
|
|
|
|
>
|
|
|
|
>
|
|
|
|
</h3>
|
|
|
|
</h3>
|
|
|
|
<div class="cardContent">
|
|
|
|
<div class="cardContent">
|
|
|
|
<el-table
|
|
|
|
<!-- <el-table
|
|
|
|
ref="restauranttable"
|
|
|
|
ref="restauranttable"
|
|
|
|
:data="tableData"
|
|
|
|
:data="tableData"
|
|
|
|
class="tableHi"
|
|
|
|
class="tableHi"
|
|
|
@ -56,7 +56,34 @@
|
|
|
|
<span v-else-if="scope.row.warnLevel == 0"> 低 </span>
|
|
|
|
<span v-else-if="scope.row.warnLevel == 0"> 低 </span>
|
|
|
|
</template>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
</el-table> -->
|
|
|
|
|
|
|
|
<ul class="warntitle">
|
|
|
|
|
|
|
|
<li>报警时间</li>
|
|
|
|
|
|
|
|
<li>主设备名称</li>
|
|
|
|
|
|
|
|
<li>告警信息</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<li>当前值</li>
|
|
|
|
|
|
|
|
<li>触发条件</li>
|
|
|
|
|
|
|
|
<li>告警阈值</li>
|
|
|
|
|
|
|
|
<li>告警等级</li>
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
<div class="marquee">
|
|
|
|
|
|
|
|
<ul class="scrollUl">
|
|
|
|
|
|
|
|
<li v-for="(item, index) in tableData" :key="index">
|
|
|
|
|
|
|
|
<span>{{ item.warnTime }}</span>
|
|
|
|
|
|
|
|
<span>{{ item.zsbName }}</span>
|
|
|
|
|
|
|
|
<span>{{ item.warnDesc }}</span>
|
|
|
|
|
|
|
|
<span>{{ item.warnValue }}</span>
|
|
|
|
|
|
|
|
<span>{{ item.triggerDesc }}</span>
|
|
|
|
|
|
|
|
<span>{{ item.threshold }}</span>
|
|
|
|
|
|
|
|
<span>
|
|
|
|
|
|
|
|
<span v-if="item.warnLevel == 2">高 </span>
|
|
|
|
|
|
|
|
<span v-else-if="item.warnLevel == 1"> 中 </span>
|
|
|
|
|
|
|
|
<span v-else-if="item.warnLevel == 0"> 低 </span></span
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
</li>
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<warnDialog ref="warnRef"></warnDialog>
|
|
|
|
<warnDialog ref="warnRef"></warnDialog>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
@ -77,6 +104,8 @@ export default {
|
|
|
|
starttime: "",
|
|
|
|
starttime: "",
|
|
|
|
endtime: "",
|
|
|
|
endtime: "",
|
|
|
|
params: {},
|
|
|
|
params: {},
|
|
|
|
|
|
|
|
isMoving: true,
|
|
|
|
|
|
|
|
isDuplicated: true, // 用于判断是否添加复制的项
|
|
|
|
};
|
|
|
|
};
|
|
|
|
},
|
|
|
|
},
|
|
|
|
created() {
|
|
|
|
created() {
|
|
|
@ -98,8 +127,8 @@ export default {
|
|
|
|
lookMore() {
|
|
|
|
lookMore() {
|
|
|
|
this.params.startTime = this.starttime;
|
|
|
|
this.params.startTime = this.starttime;
|
|
|
|
this.params.endTime = this.endtime;
|
|
|
|
this.params.endTime = this.endtime;
|
|
|
|
this.params.pageSize = 1;
|
|
|
|
this.params.pageSize = 20;
|
|
|
|
this.params.pageNum = 20;
|
|
|
|
this.params.pageNum = 1;
|
|
|
|
this.$refs.warnRef.display(this.params);
|
|
|
|
this.$refs.warnRef.display(this.params);
|
|
|
|
},
|
|
|
|
},
|
|
|
|
getwarnList() {
|
|
|
|
getwarnList() {
|
|
|
@ -110,8 +139,8 @@ export default {
|
|
|
|
|
|
|
|
|
|
|
|
this.params.startTime = this.starttime;
|
|
|
|
this.params.startTime = this.starttime;
|
|
|
|
this.params.endTime = this.endtime;
|
|
|
|
this.params.endTime = this.endtime;
|
|
|
|
this.params.pageSize = 1;
|
|
|
|
this.params.pageSize = 20;
|
|
|
|
this.params.pageNum = 20;
|
|
|
|
this.params.pageNum = 1;
|
|
|
|
warningListApi(this.params)
|
|
|
|
warningListApi(this.params)
|
|
|
|
.then((res) => {
|
|
|
|
.then((res) => {
|
|
|
|
console.log(res);
|
|
|
|
console.log(res);
|
|
|
@ -128,6 +157,7 @@ export default {
|
|
|
|
<style lang="less">
|
|
|
|
<style lang="less">
|
|
|
|
.warnmessageBox {
|
|
|
|
.warnmessageBox {
|
|
|
|
padding: 0px 10px;
|
|
|
|
padding: 0px 10px;
|
|
|
|
|
|
|
|
height: 100%;
|
|
|
|
h3 {
|
|
|
|
h3 {
|
|
|
|
height: 38px;
|
|
|
|
height: 38px;
|
|
|
|
line-height: 38px;
|
|
|
|
line-height: 38px;
|
|
|
@ -164,6 +194,101 @@ export default {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.cardContent {
|
|
|
|
.cardContent {
|
|
|
|
margin-top: 10px;
|
|
|
|
margin-top: 10px;
|
|
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.warntitle {
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
line-height: 24px;
|
|
|
|
|
|
|
|
height: 24px;
|
|
|
|
|
|
|
|
border-bottom: 1px solid #eee;
|
|
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
|
|
|
li {
|
|
|
|
|
|
|
|
list-style: none;
|
|
|
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
&:first-child {
|
|
|
|
|
|
|
|
width: 12%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(2) {
|
|
|
|
|
|
|
|
width: 15%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(3) {
|
|
|
|
|
|
|
|
width: 20%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(4) {
|
|
|
|
|
|
|
|
width: 10%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(5) {
|
|
|
|
|
|
|
|
width: 8%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(6) {
|
|
|
|
|
|
|
|
width: 8%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(7) {
|
|
|
|
|
|
|
|
width: 8%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.marquee {
|
|
|
|
|
|
|
|
height: calc(100% - 80px);
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
margin-top: 2px;
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.scrollUl {
|
|
|
|
|
|
|
|
animation: 10s scrollTop linear infinite; /* 根据需要调整动画时间和速度 */
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
li {
|
|
|
|
|
|
|
|
list-style: none;
|
|
|
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
line-height: 24px;
|
|
|
|
|
|
|
|
height: 24px;
|
|
|
|
|
|
|
|
border-bottom: 1px solid #eee;
|
|
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
|
|
|
&:first-child {
|
|
|
|
|
|
|
|
width: 12%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(2) {
|
|
|
|
|
|
|
|
width: 15%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(3) {
|
|
|
|
|
|
|
|
width: 20%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(4) {
|
|
|
|
|
|
|
|
width: 10%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(5) {
|
|
|
|
|
|
|
|
width: 8%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(6) {
|
|
|
|
|
|
|
|
width: 8%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
&:nth-child(7) {
|
|
|
|
|
|
|
|
width: 8%;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@keyframes scrollTop {
|
|
|
|
|
|
|
|
0% {
|
|
|
|
|
|
|
|
-webkit-transform: translate3d(0, 0, 0);
|
|
|
|
|
|
|
|
transform: translate3d(0, 0, 0);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
100% {
|
|
|
|
|
|
|
|
-webkit-transform: translate3d(0, -100%, 0);
|
|
|
|
|
|
|
|
transform: translate3d(0, -100%, 0);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.el-table th.el-table__cell {
|
|
|
|
.el-table th.el-table__cell {
|
|
|
|
background-color: transparent;
|
|
|
|
background-color: transparent;
|
|
|
|