<template>
|
<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="filters.values.province"
|
@change="searchCity"
|
size="small" placeholder="请选择省">
|
<el-option
|
v-for="item in filters.data.province"
|
: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="filters.values.city"
|
@change="searchCounty"
|
size="small" placeholder="请选择市">
|
<el-option
|
v-for="item in filters.data.city"
|
: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="filters.values.county"
|
@change="searchHome"
|
size="small" placeholder="请选择区/县">
|
<el-option
|
v-for="item in filters.data.county"
|
: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 w360">
|
<el-select
|
v-model="filters.values.home"
|
@click="changeHome"
|
filterable
|
size="small" placeholder="请选择机房名称">
|
<el-option
|
v-for="item in filters.data.home"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</div>
|
</div>
|
</div>
|
<div class="flex-page-content">
|
<el-table stripe size="mini" header-row-class-name="header-primary" height="100%" :data="tableData">
|
<el-table-column
|
prop="StationId"
|
label="机房编号"
|
min-width="150"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="StationName1"
|
label="省"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="StationName2"
|
label="市"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="StationName5"
|
label="区县"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="StationName3"
|
label="机房名称"
|
min-width="280"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="StationName4"
|
label="设备名称"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="FBSDeviceId"
|
label="设备ID"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="FbsDeviceIp"
|
label="设备IP"
|
min-width="160"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="FbsDeviceIp_YM"
|
label="子网掩码"
|
min-width="160"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="FbsDeviceIp_WG"
|
label="网关"
|
min-width="160"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="FBSDeviceName"
|
label="协议名称"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="GroupIndexInFBSDevice"
|
label="FBS设备索引"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattGroupId"
|
label="电池组ID"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattGroupNum"
|
label="机房内电池组编号"
|
min-width="134"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattGroupName"
|
label="电池组名称"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="FloatVolLevel"
|
label="浮充电压阀值(V)"
|
min-width="130"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="OfflineVolLevel"
|
label="离线电压阀值(V)"
|
min-width="130"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattFloatCurrent"
|
label="浮充电流阀值(A)"
|
min-width="130"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="MonCount"
|
label="单体数量"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="MonCapStd"
|
label="标称容量(AH)"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="MonVolStd"
|
label="标称单体电压(V)"
|
min-width="130"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="MonResStd"
|
label="标称单体内阻(mΩ)"
|
min-width="150"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="MonSerStd"
|
label="标称单体电导"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="MonVolLowToAvg"
|
label="单体电压次低偏移量(V)"
|
min-width="168"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="Load_curr"
|
label="负载电流(A)"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="DisCurrMax"
|
label="最大核容电流(A)"
|
min-width="130"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattProducer"
|
label="电池品牌"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattModel"
|
label="电池型号"
|
min-width="120"
|
:resizable="false"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattProductDate"
|
label="电池生产日期"
|
min-width="160"
|
:resizable="false"
|
:formatter="dateSub"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
prop="BattInUseDate"
|
label="投入使用日期"
|
min-width="160"
|
:resizable="false"
|
:formatter="dateSub"
|
align="center">
|
</el-table-column>
|
<el-table-column
|
fixed="right"
|
label="操作"
|
width="250"
|
align="center">
|
<template slot-scope="scope">
|
<el-button :disabled="!isCanEdit" @click="showSelectEditDialog(scope.row)" type="primary" size="mini" v-if="editMore">编辑</el-button>
|
<el-button :disabled="!isCanEdit" @click="handleClick(scope.row)" type="primary" size="mini" v-else>编辑</el-button>
|
<el-button :disabled="!isCanEdit" type="info" @click="handleAddClick(scope.row)" size="mini">添加电池组</el-button>
|
<el-button :disabled="!isCanEdit" type="danger" size="mini" @click="confirmDelHome(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="flex-page-footer" slot="footer">
|
<div class="el-pagination-btns">
|
<el-button type="primary" @click="searchData" round size="mini" icon="el-icon-search">查询</el-button>
|
<el-button type="primary" round size="mini" icon="el-icon-wallet" @click="exportFile">导出</el-button>
|
</div>
|
<el-pagination size="mini"
|
:current-page="page.pageCurr"
|
:page-sizes="[10, 20, 30, 50, 100]"
|
:page-size="page.pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="page.pageAll"
|
@current-change="currentChange"
|
@size-change="sizeChange"></el-pagination>
|
<div class="el-pagination-btns">
|
<el-button :disabled="!isCanEdit" type="primary" @click="addHome()" round size="mini" icon="el-icon-plus">新建机房</el-button>
|
</div>
|
</div>
|
<!-- 电池信息编辑选择 -->
|
<el-dialog
|
title="电池信息编辑选择"
|
width="auto"
|
:visible.sync="selectEdit"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center">
|
<div class="padding16161616">
|
<el-button :disabled="!isCanEdit" @click="dHandleClick()" type="primary" size="mini">电池信息编辑</el-button>
|
<el-button :disabled="!isCanEdit" @click="dChangeIpClick()" type="primary" size="mini" v-if="changeIp">远程IP修改</el-button>
|
<el-button :disabled="!isCanEdit" @click="dAutographClick()" type="primary" size="mini" v-if="autograph">签名编辑</el-button>
|
</div>
|
</el-dialog>
|
|
<!-- 添加电池组 -->
|
<el-dialog
|
title="添加电池组"
|
width="800px"
|
:visible.sync="addDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false">
|
<add-group-mager
|
v-if="addDialog"
|
:batt="batt"
|
@success="addSuccess"></add-group-mager>
|
</el-dialog>
|
<!-- 编辑电池组 -->
|
<el-dialog
|
:title="editTitle"
|
width="800px"
|
:visible.sync="editDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false">
|
<edit-group-mager
|
v-if="editDialog"
|
:batt="batt"
|
@success="editSuccess"></edit-group-mager>
|
</el-dialog>
|
<!-- 签名修改 -->
|
<el-dialog
|
title="签名修改"
|
width="600px"
|
:visible.sync="autographDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false">
|
<edit-autograph :batt="batt" :visible.sync="autographDialog" v-if="autographDialog"></edit-autograph>
|
</el-dialog>
|
<!-- 远程修改ip -->
|
<el-dialog
|
title="远程修改IP"
|
width="auto"
|
:visible.sync="changeIpDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center"
|
:modal-append-to-body="false">
|
<change-ip-params
|
:batt="batt"
|
:visible.sync="changeIpDialog"
|
v-if="changeIpDialog"
|
@success="changeIpSuccess"></change-ip-params>
|
</el-dialog>
|
</flex-layout>
|
</template>
|
|
<script>
|
import AddGroupMager from '../../components/battGroupMager/AddBattGroup'
|
import EditGroupMager from '../../components/battGroupMager/EditBattGroup'
|
import {
|
searchProvince,
|
searchCity,
|
searchCounty,
|
searchStation as searchHome
|
} from '../../assets/js/api.js'
|
// 引入导出表格
|
import {
|
export_json_to_excel
|
} from '../../assets/js/excel/Export2Excel.js'
|
import {isHasPermit} from "@/assets/js/tools";
|
import faceManager from "@/assets/js/apis/faceManager/faceManager";
|
import EditAutograph from "@/components/battGroupMager/EditAutograph";
|
import ChangeIpParams from "@/pages/dataMager/dialog/ChangeIpParams";
|
export default {
|
components: {
|
ChangeIpParams,
|
EditAutograph,
|
AddGroupMager,
|
EditGroupMager,
|
},
|
data() {
|
let permits = this.$store.state.user.permits;
|
let isCanEdit = isHasPermit('batttest_data_edit_permit', permits);
|
let config = this.$CFG;
|
return {
|
isCanEdit: isCanEdit,
|
autograph: config.autograph.value,
|
selectEdit: false,
|
autographDialog: false,
|
changeIp: config.changeIp.value,
|
changeIpDialog: false,
|
batt: {},
|
loading: '',
|
filters: {
|
values: {
|
province: '',
|
city: '',
|
county: '',
|
home: '',
|
},
|
data: {
|
province: [],
|
city: [],
|
county: [],
|
home: [],
|
},
|
},
|
page: {
|
pageCurr:1,
|
pageSize:10,
|
pageAll:0,
|
},
|
tableData:[],
|
addDialog: false,
|
editDialog: false,
|
}
|
},
|
methods: {
|
addHome() {
|
this.batt = {};
|
this.addDialog = true;
|
},
|
handleAddClick(row) {
|
this.batt = row;
|
this.addDialog = true;
|
},
|
// 导出表格
|
exportFile() {
|
let tHeader = ['机房编号','省','市','区县','机房名称','设备名称','设备ID','设备IP','子网掩码','网关','协议名称','FBS设备索引','电池组ID','机房内电池组编号','电池组名称','浮充电压阀值(V)','离线电压阀值(V)','浮充电流阀值(A)','单体数量','标称容量(AH)','标称单体电压(V)','标称单体内阻(mΩ)','标称单体电导','单体电压次低偏移量(V)','负载电流(A)','最大核容电流(A)','电池品牌','电池型号','电池生产日期','投入使用日期'];
|
let filterVal = ['StationId','StationName1','StationName2','StationName5','StationName3','StationName4','FBSDeviceId','FbsDeviceIp','FbsDeviceIp_YM','FbsDeviceIp_WG','FBSDeviceName','GroupIndexInFBSDevice','BattGroupId','BattGroupNum','BattGroupName','FloatVolLevel','OfflineVolLevel','BattFloatCurrent','MonCount','MonCapStd','MonVolStd','MonResStd','MonSerStd','MonVolLowToAvg','Load_curr','DisCurrMax','BattProducer','BattModel','BattProductDate','BattInUseDate'];
|
let list = this.tableData;
|
let excelData = this.formatJson(filterVal, list);
|
export_json_to_excel(tHeader, excelData, "电池信息管理数据");
|
},
|
formatJson(filterVal, jsonData) {
|
return jsonData.map(v => filterVal.map(j => v[j]));
|
},
|
searchProvince() { // 查询省
|
this.loading = this.$layer.loading(1);
|
searchProvince().then((res)=>{
|
var rs = JSON.parse(res.data.result);
|
var data = [];
|
if(rs.code == 1) {
|
var rsData = rs.data;
|
// 遍历结果集
|
for(var i=0; i<rsData.length; i++) {
|
var _rsData = rsData[i];
|
var tmp = {
|
label: _rsData,
|
value: _rsData
|
};
|
data.push(tmp);
|
}
|
}
|
// 设置第一笔数据
|
data.unshift({
|
label: "全部（共"+data.length+"种)",
|
value: ''
|
});
|
// 设置省
|
this.filters.data.province = data;
|
// 查询市
|
this.searchCity();
|
});
|
},
|
searchCity() { // 查询市
|
// 重置值
|
this.filters.values.city="";
|
this.filters.values.county="";
|
this.filters.values.home="";
|
// 构造查询条件
|
let searchParams = {
|
StationName1: this.filters.values.province
|
};
|
// 请求后台
|
searchCity(searchParams).then((res)=>{
|
var rs = JSON.parse(res.data.result);
|
var data = [];
|
if(rs.code == 1) {
|
var rsData = rs.data;
|
// 遍历结果集
|
for(var i=0; i<rsData.length; i++) {
|
var _rsData = rsData[i];
|
var tmp = {
|
label: _rsData,
|
value: _rsData
|
};
|
data.push(tmp);
|
}
|
}
|
// 设置第一笔数据
|
data.unshift({
|
label: "全部（共"+data.length+"种)",
|
value: ''
|
});
|
// 设置市
|
this.filters.data.city = data;
|
// 查询区县
|
this.searchCounty();
|
});
|
},
|
searchCounty() {
|
// 重置值
|
this.filters.values.county="";
|
this.filters.values.home="";
|
// 构造查询条件
|
let searchParams = {
|
StationName1: this.filters.values.province,
|
StationName2: this.filters.values.city
|
};
|
// 请求后台
|
searchCounty(searchParams).then((res)=>{
|
var rs = JSON.parse(res.data.result);
|
var data = [];
|
if(rs.code == 1) {
|
var rsData = rs.data;
|
// 遍历结果集
|
for(var i=0; i<rsData.length; i++) {
|
var _rsData = rsData[i];
|
var tmp = {
|
label: _rsData,
|
value: _rsData
|
};
|
data.push(tmp);
|
}
|
}
|
// 设置第一笔数据
|
data.unshift({
|
label: "全部（共"+data.length+"种)",
|
value: ''
|
});
|
// 设置区县
|
this.filters.data.county = data;
|
// 查询机房
|
this.searchHome();
|
});
|
},
|
searchHome() {
|
// 重置分页信息
|
this.page.pageCurr = 1;
|
// 重置值
|
this.filters.values.home=""; // 构造查询条件
|
var searchParams = {
|
StationName1: this.filters.values.province,
|
StationName2: this.filters.values.city,
|
StationName5: this.filters.values.county,
|
};
|
// 未选择区县
|
if(searchParams.StationName5 == "") {
|
// 设置机房
|
this.filters.data.home = [{
|
label: "请选择区/县",
|
value: ''
|
}];
|
// 查询数据
|
this.searchData(true);
|
return;
|
}
|
|
// 请求后台
|
searchHome(searchParams).then((res)=>{
|
let rs = JSON.parse(res.data.result);
|
let data = [];
|
if(rs.code == 1) {
|
let rsData = rs.data;
|
// 遍历结果集
|
for(let i=0; i<rsData.length; i++) {
|
let _rsData = rsData[i];
|
let index = this.checkValIsIn(_rsData.StationName3, data);
|
if(index == -1) {
|
let tmp = {
|
label: _rsData.StationName3,
|
value: _rsData.StationName3
|
};
|
data.push(tmp);
|
}
|
|
}
|
}
|
// 设置第一笔数据
|
data.unshift({
|
label: "全部（共"+data.length+"种)",
|
value: ''
|
});
|
// 设置机房
|
this.filters.data.home = data;
|
|
// 查询数据
|
this.searchData(true);
|
});
|
},
|
checkValIsIn(val, arr) {
|
for(let i=0; i<arr.length; i++) {
|
if(arr[i].label == val) {
|
return i;
|
}
|
}
|
return -1;
|
},
|
changeHome: function() {
|
// 重置分页信息
|
this.page.pageCurr = 1;
|
// 查询数据
|
this.searchData();
|
},
|
searchData(noLoading) {
|
if(!noLoading) {
|
this.loading = this.$layer.loading(1);
|
}
|
let filters= this.filters.values;
|
// 构造查询条件
|
let searchParams = {
|
binf:{
|
StationName1: filters.province, // 省
|
StationName2: filters.city, // 市
|
StationName5: filters.county, // 区/县
|
StationName3: filters.home, // 站点
|
},
|
page: this.page,
|
};
|
// 请求后台
|
this.$apis.dataMager.battGroupMager.search(searchParams).then(res=>{
|
// 关闭弹出框
|
this.$layer.close(this.loading);
|
// 处理数据
|
let rs = JSON.parse(res.data.result);
|
let data = [];
|
if(rs.code == 1) {
|
data = rs.data;
|
let _data = data[data.length-1];
|
// 设置数据总数
|
this.page.pageAll = _data.num;
|
}else {
|
this.page.pageCurr = 1;
|
this.page.pageAll = 0;
|
}
|
// 设置表格数据
|
this.tableData = data;
|
|
}).catch(error=>{
|
console.log(error);
|
// 关闭弹出框
|
this.$layer.close(this.loading);
|
})
|
},
|
dateSub: function(row, column, cellValue) {
|
return cellValue.substr(0,10);
|
},
|
currentChange(value) {
|
this.page.pageCurr = value;
|
this.searchData();
|
},
|
sizeChange(value) {
|
this.page.pageCurr = 1;
|
this.page.pageSize = value;
|
this.searchData();
|
},
|
addSuccess() {
|
// 关闭弹出面板
|
this.addDialog = false
|
// 从新查询数据
|
this.searchData();
|
},
|
confirmDelHome(batt) {
|
var self = this;
|
this.$layer.confirm('确定删除'+batt.StationName3,{icon:3}, function(index) {
|
// 关闭询问框
|
self.$layer.close(index);
|
// 删除机房
|
self.delHome(batt);
|
});
|
},
|
delHome(batt) {
|
let loading = this.$layer.loading(1);
|
// 请求后台
|
this.$apis.dataMager.battGroupMager.del([batt]).then(res=>{
|
let rs = JSON.parse(res.data.result);
|
if(rs.code == 1) {
|
this.$message({
|
type: 'success',
|
message: '删除'+batt.StationName3+'成功！'
|
});
|
this.searchData();
|
}else {
|
this.$message({
|
type: 'error',
|
message: '删除'+batt.StationName3+'失败！'
|
});
|
}
|
// 关闭等待框
|
this.$layer.close(loading);
|
}).catch(error=>{
|
console.log(error);
|
// 关闭等待框
|
this.$layer.close(loading);
|
});
|
},
|
handleClick(batt) {
|
this.batt = batt;
|
this.editDialog = true;
|
},
|
showSelectEditDialog(batt) {
|
this.batt = batt;
|
this.selectEdit = true;
|
},
|
dHandleClick() {
|
this.selectEdit = false;
|
this.editDialog = true;
|
},
|
dAutographClick() {
|
this.selectEdit = false;
|
this.autographDialog = true;
|
},
|
dChangeIpClick() {
|
this.selectEdit = false;
|
this.changeIpDialog = true;
|
},
|
editSuccess() {
|
// 关闭弹出面板
|
this.editDialog = false
|
// 从新查询数据
|
this.searchData();
|
},
|
changeIpSuccess() {
|
// 关闭弹出面板
|
this.changeIpDialog = false
|
// 从新查询数据
|
this.searchData();
|
}
|
},
|
computed: {
|
editTitle() {
|
let batt = this.batt;
|
return "编辑"+batt.StationName1+'-'+batt.StationName2
|
+'-'+batt.StationName5+'-'+batt.StationName3
|
+'-'+batt.StationName4
|
},
|
editMore() {
|
return this.autograph||this.changeIp?true:false;
|
}
|
},
|
mounted() {
|
// 查询省-市-区县-机房
|
this.searchProvince();
|
},
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
