<template>
|
<flex-layout direction="row" style="color:#ffffff">
|
<content-Box>
|
<div slot="title">电池告警历史查询 显示与隐藏查询条件</div>
|
<div class="headrs">
|
<table class="table-head" width="100%" border="1" cellspacing="0">
|
<thead>
|
<tr>
|
<th>维护区</th>
|
<th>机房站点</th>
|
<th>蓄电池组</th>
|
<th>告警开始日期</th>
|
</tr>
|
</thead>
|
<tbody>
|
<tr>
|
<td width="300px">
|
<el-select v-model="value" placeholder="全部(共17种)" class="weihu">
|
<el-option
|
v-for="item in newsHost"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</td>
|
<td width="500px">
|
<el-select v-model="value" placeholder="全部(共70种)" class="rooms">
|
<el-option
|
v-for="item in newSite"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</td>
|
<td width="300px">
|
<el-select v-model="value" placeholder="全部(共93种)" class="dainchi">
|
<el-option
|
v-for="item in batterList"
|
:key="item.BattGroupId"
|
:label="item.BattGroupName"
|
:value="item.BattGroupId"
|
></el-option>
|
</el-select>
|
</td>
|
<td width="300px">
|
<el-date-picker
|
class="blocks"
|
v-model="valueTime"
|
type="daterange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
></el-date-picker>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
|
<!-- 选择 -->
|
<table class="condiOpt" border="1">
|
<tr class="trTitle">
|
<td>
|
<center>
|
<input type="checkbox">在线电压
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">组端电压
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">
|
充电电流
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">
|
放电电流
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">
|
一级告警
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">
|
二级告警
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">
|
上限告警
|
</center>
|
</td>
|
</tr>
|
<tr class="body">
|
<td colspan="2">
|
<center>
|
<input type="checkbox">单体电压
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">单体内阻
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">单体温度
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">三级告警
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">四级告警
|
</center>
|
</td>
|
<td>
|
<center>
|
<input type="checkbox">下限告警
|
</center>
|
</td>
|
</tr>
|
</table>
|
|
<!-- 表单 -->
|
<el-table border size="small" :data="table.datas" height="73%" class="tableCent">
|
<el-table-column
|
v-for="header in table.headers"
|
:key="header.prop"
|
:prop="header.prop"
|
:label="header.label"
|
:width="header.width"
|
align="center"
|
></el-table-column>
|
<el-table-column label="确认告警">
|
<input type="checkbox">
|
</el-table-column>
|
</el-table>
|
|
<!-- 底部分页 -->
|
<div class="paginations">
|
<ul>
|
<li>查询</li>
|
<li>导出</li>
|
<li>表格选项</li>
|
</ul>
|
<el-pagination
|
class="pagess"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:page-sizes="[2, 5, 10, 20]"
|
:page-size="100"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="20"
|
></el-pagination>
|
</div>
|
</content-Box>
|
</flex-layout>
|
</template>
|
|
<script>
|
import ContentBox from "../../components/ContentBox";
|
import {
|
historyTrye /* 维护区 */,
|
historyStation /*机房站点 */,
|
historyBattery /* 蓄电池组 */,
|
historySeroom /* 历史告警记录 */
|
} from "@/assets/js/alarmAdmian/batteryrHistoryquery.js";
|
export default {
|
components: {
|
ContentBox
|
},
|
data() {
|
return {
|
/* 日期 */
|
valueTime: "",
|
/* 维护区 */
|
newsHost: [
|
{
|
value: null,
|
label: null
|
}
|
],
|
/* 机房站点 */
|
newSite: [
|
{
|
value: null,
|
label: null
|
}
|
],
|
/*蓄电池组 */
|
batterList: [
|
{
|
value: null,
|
label: null
|
}
|
],
|
|
value: "",
|
/* 表单 */
|
table: {
|
headers: [
|
{
|
prop: "room1",
|
label: "编号",
|
width: ""
|
},
|
{
|
prop: "battery1",
|
label: "机房名称",
|
width: ""
|
},
|
{
|
prop: "tes1",
|
label: "电池组名称",
|
width: ""
|
},
|
{
|
prop: "tester1",
|
label: "告警名称",
|
width: ""
|
},
|
{
|
prop: "current1",
|
label: "单体编号",
|
width: ""
|
},
|
{
|
prop: "capacity1",
|
label: "告警值",
|
width: ""
|
},
|
{
|
prop: "monomer1",
|
label: "告警等级",
|
width: ""
|
},
|
/* {
|
prop: "number1",
|
label: "确认告警",
|
width: ""
|
}, */
|
{
|
prop: "alarm1",
|
label: "告警确认时间",
|
width: ""
|
},
|
{
|
prop: "start1",
|
label: "告警开始时间",
|
width: ""
|
},
|
{
|
prop: "end1",
|
label: "告警结束时间",
|
width: ""
|
}
|
],
|
datas: [
|
{
|
room1: 0,
|
battery1: 0,
|
tes1: 0,
|
tester1: 0,
|
current1: 0,
|
capacity1: 0,
|
monomer1: 0,
|
number1: 0,
|
vol1: 0,
|
alarm1: 0,
|
start1: 0,
|
end1: 0
|
}
|
]
|
}
|
};
|
},
|
mounted() {
|
this.hisPivot(); /* 维护区 */
|
this.sessionSite(); /* 机房站点 */
|
this.batterJque(); /* 蓄电池组 */
|
this.historyArlm(); /* 历史告警记录 */
|
},
|
methods: {
|
/* 维护区 */
|
async hisPivot() {
|
const hisTrpes = await historyTrye();
|
/* console.log('hisTrpes',hisTrpes); */
|
if (hisTrpes.data.result) {
|
const pivotList = JSON.parse(hisTrpes.data.result).data.map(item => {
|
return { label: item };
|
});
|
/* console.log(' pivotList', pivotList); */
|
const aaaa = pivotList.map((item, index) => {
|
/* 生成index */
|
item.value = index + 1;
|
return item;
|
});
|
this.newsHost = aaaa;
|
}
|
},
|
/*机房站点 */
|
async sessionSite() {
|
const siteList = await historyStation({ UNote: "" });
|
/* console.log("siteList", siteList); */
|
if (siteList.data.result) {
|
const newSitelist = JSON.parse(siteList.data.result).data.map(item => {
|
return { label: item };
|
});
|
/* console.log('newSitelist', newSitelist) */
|
const eeee = newSitelist.map((item, index) => {
|
/* 生成index */
|
item.value = index + 1;
|
return item;
|
});
|
this.newSite = eeee;
|
/* console.log('this.newSite',this.newSite); */
|
}
|
},
|
/* 蓄电池组 */
|
async batterJque() {
|
const jquerys = await historyBattery({ UNote: "", UName: "" });
|
/* console.log(jquerys); */
|
if (jquerys.data.result) {
|
this.batterList = JSON.parse(jquerys.data.result).data.map(item => {
|
item.BattGroupName = `${item.BattGroupName}-${item.MonCount}节`;
|
return item;
|
});
|
/* console.log('this.batterList',this.batterList); */
|
}
|
},
|
/* 历史告警记录 */
|
async historyArlm() {
|
const historyList = await historySeroom({
|
page: { pageCurr: 1, pageSize: 10, pageAll: 0 },
|
binf: { StationName1: "", StationName: "", BattGroupId: "0" },
|
mainf: {
|
appoint_uid: "4",
|
master_audit: "3",
|
num: "1",
|
BattGroupId: "2",
|
usr_id: "119001",
|
fault_type_id: 119002,
|
fault_level: "119003",
|
record_uid: "119004",
|
maint_type_id: "119005",
|
maint_done: "119006",
|
maint_close: "119007",
|
master_id: "0"
|
},
|
adata_H: {
|
MonNum: "0",
|
alm_id: 1,
|
alm_start_time: "2000-1-1 00:00:00",
|
alm_start_time1: "2020-09-11 23:59:59",
|
alm_signal_id: 0,
|
Record_Id: "0"
|
}
|
});
|
console.log("historyList", historyList);
|
const newHist = JSON.parse(historyList.data.result).data
|
console.log('newHist',newHist);
|
/* console.log(newHist[0].binf.BattGroupName);
|
this.table.datas[0].battery1 = newHist[4].binf.StationName9
|
*/
|
const newLists = newHist.map((item,index)=>{
|
item.index = index + 1
|
return {
|
room1:item.index,
|
battery1: item.binf.StationName,
|
tes1 :item.binf.BattGroupName,
|
tester1:item.binf.StationName8,
|
current1:item.adata_H.MonNum,
|
capacity1:item.adata_H.alm_value,
|
monomer1:item.binf.StationName9,
|
start1:item.adata_H.alm_start_time,
|
end1:item.adata_H.alm_end_time,
|
alarm1:item.adata_H.alm_confirmed_time,
|
}
|
})
|
console.log('newLists',newLists);
|
|
this.table.datas = newLists
|
|
|
},
|
handleSizeChange(val) {
|
/* console.log(`每页 ${val} 条`); */
|
},
|
handleCurrentChange(val) {
|
/* console.log(`当前页: ${val}`); */
|
}
|
}
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.headrs {
|
font-weight: 900;
|
height: 80px;
|
width: 100%;
|
position: relative;
|
.table-head {
|
color: #ffff;
|
position: absolute;
|
top: 3%;
|
border: 1px solid #ffffff;
|
thead tr {
|
height: 35px;
|
}
|
|
tbody tr {
|
height: 70%;
|
}
|
}
|
|
.weihu {
|
width: 100%;
|
}
|
|
.dainchi {
|
width: 100%;
|
}
|
|
.rooms {
|
width: 100%;
|
}
|
.blocks {
|
width: 100%;
|
}
|
}
|
|
/* 表单 */
|
.tableCent {
|
margin-top: 3px;
|
}
|
|
/* 底部 */
|
.paginations {
|
/* border: 1px solid red; */
|
width: 100%;
|
position: relative;
|
|
ul {
|
position: absolute;
|
top: 5px;
|
left: 26%;
|
}
|
ul li {
|
display: inline-block;
|
margin: 2px;
|
}
|
|
.pagess {
|
margin: 2px auto;
|
width: 30%;
|
/* border: 1px solid blue; */
|
}
|
}
|
|
/* 条件选择 */
|
.condiOpt {
|
border: 1px solid #ffffff;
|
width: 100%;
|
margin-top: 3px;
|
|
.trTitle {
|
height: 35px;
|
}
|
.body {
|
height: 35px;
|
}
|
}
|
</style>
|
