<template>
|
<!-- <title>核容测试</title> -->
|
<flex-layout>
|
<div class="table-layout filter-box-table" slot="header">
|
<div class="table-row">
|
<div class="table-cell text-right">维护区:</div>
|
<div class="table-cell">
|
<el-select v-model="formData.binf.stationName1" size="small" @change="queryList" placeholder="请选择维护区">
|
<el-option
|
v-for="item in stationName1List"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</div>
|
<!-- 机房名称 -->
|
<div class="table-cell text-right">机房名称:</div>
|
<div class="table-cell">
|
<el-select v-model="formData.binf.stationName" size="small" placeholder="请选择机房名称">
|
<el-option
|
v-for="item in stationNameList"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</div>
|
<!-- 事件类型 -->
|
<div class="table-cell text-right">机房停电类型:</div>
|
<div class="table-cell">
|
<el-select ref="selecetEvent" v-model="formData.binf.num" size="small" placeholder="请选择机房停电类型">
|
<el-option label="全部" :value="100"></el-option>
|
<el-option label="实时停电监测" :value="0"></el-option>
|
<el-option label="历史停电数据" :value="1"></el-option>
|
</el-select>
|
</div>
|
<div class="table-cell text-right">操作记录时间段:</div>
|
<div class="table-cell">
|
<el-date-picker v-model="formData.binf.BattProductDate" size="small" class="time_box" :picker-options="pickerOptions0" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"> </el-date-picker>
|
- <el-date-picker v-model="formData.binf.BattProductDate1" size="small" class="time_box" :picker-options="pickerOptions1" type="date" placeholder="选择日期" value-format="yyyy-MM-dd"> </el-date-picker>
|
</div>
|
</div>
|
</div>
|
<div class="flex-page-content">
|
<!-- 表单 -->
|
<el-table stripe size="small" :data="dataList" height="100%" class="tableCent">
|
<el-table-column prop="StationName1" align="center" label="维护区"></el-table-column>
|
<el-table-column prop="StationName" align="center" label="机房名称"></el-table-column>
|
<el-table-column prop="poweroff_starttime" align="center" label="停电开始时间"></el-table-column>
|
<el-table-column align="center" label="停电状态">
|
<template slot-scope="scope">
|
{{ scope.row.power_state == 0?"停电中":"停电恢复"}}
|
</template>
|
</el-table-column>
|
<el-table-column align="center" label="停电结束时间">
|
<template slot-scope="scope">
|
{{ scope.row.power_state == 0?"--":scope.row.poweroff_stoptime}}
|
</template>
|
</el-table-column>
|
<el-table-column prop="dev_captest_groupvol" align="center" label="停电时长">
|
<template slot-scope="scope">
|
{{ formatSeconds1((new Date(scope.row.poweroff_stoptime)-new Date(scope.row.poweroff_starttime))/1000) }}
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<!-- 底部 -->
|
<div class="flex-page-footer" slot="footer">
|
<!-- 底部分页 -->
|
<div class="el-pagination-btns">
|
<el-button type="primary" round size="mini" @click="queryList()" icon="el-icon-search">查询</el-button>
|
<el-button type="primary" round size="mini" icon="el-icon-wallet" @click="exportFile">导出</el-button>
|
<!-- <el-button type="primary" round size="mini" icon="el-icon-wallet">表格选项</el-button> -->
|
</div>
|
<el-pagination
|
class="pagess"
|
:current-page="formData.page.pageCurr"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:page-sizes="[10, 20, 30, 50, 100]"
|
:page-size="formData.page.pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="formData.page.pageAll"
|
></el-pagination>
|
</div>
|
</flex-layout>
|
</template>
|
<script>
|
import { MaintenanceArea } from '../../assets/js/dataAdmian/batteryMager.js'
|
import { devSearchs } from '../../assets/js/alarmAdmian/devicepaSetting.js'
|
import powercut from '../../assets/js/apis/dataMager/powercut.js'
|
import { formatSeconds } from "../../assets/js/tools";
|
// 引入导出表格
|
import {
|
export_json_to_excel
|
} from '../../assets/js/excel/Export2Excel.js'
|
export default {
|
data() {
|
return {
|
dataList:[],
|
stationName1List:[],
|
stationNameList:[],
|
formData:{
|
binf:{
|
stationName1:'',//维护区
|
stationName:'',//机房名称
|
num:0, //机房停电类型
|
BattProductDate:'2000-01-01',
|
BattProductDate1:new Date().format('yyyy-MM-dd')
|
},
|
page:{
|
pageCurr: 1,
|
pageSize: 10,
|
pageAll: 0,
|
}
|
},
|
pickerOptions0: {
|
disabledDate: (time) => {
|
let vm = this;
|
if (vm.formData.binf.BattProductDate1) {
|
return new Date(time.getTime()) > new Date(vm.formData.binf.BattProductDate1);
|
} else {
|
// return time.getTime() > Date.now();
|
}
|
}
|
},
|
pickerOptions1: {
|
disabledDate: (time) => {
|
return new Date(time.getTime()+24*60*60*1000) < new Date(this.formData.binf.BattProductDate);
|
}
|
},
|
|
};
|
},
|
created() {
|
let vm = this;
|
vm.queryStationName1List();
|
vm.queryStationNameList();
|
vm.queryList();
|
},
|
mounted() {},
|
methods: {
|
// 导出表格
|
exportFile() {
|
let tHeader = ['维护区','机房名称','停电开始时间','停电状态','停电结束时间','停电时长'];
|
let filterVal = ['StationName1','StationName','poweroff_starttime','power_stopState','poweroff_stoptimer','poweroff_stopLonTimer'];
|
let list = this.dataList;
|
console.log(list)
|
if(list.length>0){
|
list.map((item,index)=>{
|
if(item.power_state==0){
|
item.power_stopState="停电中";
|
item.poweroff_stoptimer="--";
|
}else{
|
item.power_stopState="停电恢复";
|
item.poweroff_stoptimer=item.poweroff_stoptime;
|
}
|
item.poweroff_stopLonTimer=this.formatSeconds1((new Date(scope.row.poweroff_stoptime)-new Date(scope.row.poweroff_starttime))/1000)
|
});
|
}
|
let excelData = this.formatJson(filterVal, list);
|
export_json_to_excel(tHeader, excelData, "机房状态查询");
|
},
|
formatJson(filterVal, jsonData) {
|
return jsonData.map(v => filterVal.map(j => v[j]));
|
},
|
formatSeconds1:formatSeconds,
|
// 展示数据数量
|
handleSizeChange(val) {
|
let vm = this;
|
vm.formData.page.pageSize = val;
|
vm.queryList();
|
},
|
// 翻页
|
handleCurrentChange(val) {
|
let vm = this;
|
vm.formData.page.pageCurr = val;
|
vm.queryList();
|
},
|
// 查询列表
|
queryList:function(){
|
let vm = this;
|
let loading = this.$layer.loading(1);
|
let data = JSON.parse(JSON.stringify(vm.formData));
|
data.binf.BattProductDate = data.binf.BattProductDate + ' 00:00:00';
|
data.binf.BattProductDate1 = data.binf.BattProductDate1 + ' 23:59:59'
|
powercut.serchStationByStationName1(data).then((res)=>{
|
// 关闭等待框
|
vm.$layer.close(loading);
|
let result = JSON.parse(res.data.result);
|
let params = [];
|
if(result.code == 1){
|
params = result.data.map((item)=>{
|
return item;
|
})
|
vm.formData.page.pageAll = params[params.length - 1].page.pageAll;
|
}else{
|
vm.formData.page.pageAll = 0;
|
}
|
vm.dataList = params;
|
// console.log(result)
|
}).catch((err)=>{
|
// 关闭等待框
|
vm.$layer.close(loading);
|
vm.$layer.msg('查询失败');
|
})
|
},
|
// 查询维护区
|
queryStationName1List:function(){
|
let vm = this;
|
MaintenanceArea().then((res)=>{
|
let result = JSON.parse(res.data.result);
|
let params = [];
|
if(result.code == 1){
|
params = result.data.map((item)=>{
|
let obj = {
|
label:item,
|
value:item
|
}
|
return obj;
|
})
|
params.unshift({
|
label:'全部 (共'+ params.length + '种)',
|
value:''
|
})
|
}else{
|
params.unshift({
|
label:'暂无管理的维护区',
|
value:''
|
})
|
}
|
vm.stationName1List = params;
|
}).catch((err)=>{
|
|
})
|
},
|
// 查询机房名称
|
queryStationNameList:function(){
|
let vm = this;
|
let data = {
|
UNote:vm.formData.binf.stationName1
|
}
|
devSearchs(data).then((res)=>{
|
let result = JSON.parse(res.data.result);
|
let params = [];
|
if(result.code == 1){
|
params = result.data.map((item)=>{
|
let obj = {
|
label:item.StationName,
|
value:item.FBSDeviceId
|
}
|
return obj;
|
})
|
params.unshift({
|
label:'全部 (共'+ params.length + '种)',
|
value:''
|
})
|
}else{
|
params.unshift({
|
label:'暂无管理的机房站点',
|
value:''
|
})
|
}
|
vm.stationNameList = params;
|
}).catch((err)=>{
|
|
})
|
}
|
|
} //methods
|
};
|
</script>
|
<style lang="less" scoped>
|
</style>
|