<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-date-picker v-model="battinuse_time" size="small" class="time_box" :picker-options="pickerOptions0" type="date"
|
placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
|
- <el-date-picker v-model="battinuse_time1" size="small" class="time_box" :picker-options="pickerOptions1" type="date"
|
placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
|
</div>
|
<div class="table-cell text-right">报废日期: </div>
|
<div class="table-cell">
|
<el-date-picker v-model="battscrap_time" size="small" class="time_box" :picker-options="pickerOptions0" type="date"
|
placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
|
- <el-date-picker v-model="battscrap_time1" size="small" class="time_box" :picker-options="pickerOptions1" type="date"
|
placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
|
</div>
|
<div class="table-cell text-right">品牌: </div>
|
<div class="table-cell">
|
<el-select v-model="batt_Producer"
|
:filterable="true"
|
size="small"
|
>
|
<el-option
|
label="全部"
|
value=""
|
></el-option>
|
<el-option
|
v-for="item in battProducerList"
|
:key="item"
|
:label="item"
|
:value="item"
|
></el-option>
|
</el-select>
|
</div>
|
<div class="table-cell text-right">型号: </div>
|
<div class="table-cell">
|
<el-input
|
v-model="BattModel"
|
size="small"
|
placeholder="请输入型号"
|
></el-input>
|
</div>
|
</div>
|
</div>
|
<div class="flex-page-content">
|
<el-table stripe size="mini" header-row-class-name="header-primary" height="100%" :data="table.data">
|
<el-table-column
|
v-for="header in table.header"
|
:key="header.prop"
|
:prop="header.prop"
|
:label="header.label"
|
:min-width="header.minWidth"
|
:resizable="false"
|
align="center">
|
</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 type="primary" @click="addDialog = true" round size="mini" icon="el-icon-plus">新增</el-button>
|
</div>
|
</div>
|
<!-- 添加 -->
|
<el-dialog
|
title="添加报废电池组"
|
width="800px"
|
:visible.sync="addDialog"
|
:close-on-click-modal="false"
|
top="0"
|
class="dialog-center bg-white"
|
:modal-append-to-body="false">
|
<div class="dialog_content">
|
<el-form
|
size="mini"
|
ref="addForm"
|
:model="params"
|
:rules="rules"
|
label-position="top"
|
class="params-dialog">
|
<el-row :gutter="layout.gutter">
|
<el-col :span="layout.span">
|
<el-form-item
|
label="维护区"
|
prop="areaCode"
|
>
|
<el-select
|
v-model="params.areaCode"
|
@change="areaChanged"
|
size="small"
|
>
|
<el-option
|
v-for="(item, idx) in areaList"
|
:key="'area_' + idx"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="layout.span">
|
<el-form-item
|
label="机房站点"
|
prop="house"
|
>
|
<el-select
|
v-model="params.house"
|
@change="houseChanged"
|
size="small"
|
>
|
<el-option
|
v-for="(item, idx) in houseList"
|
:key="'house_' + idx"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="layout.span">
|
<el-form-item
|
label="蓄电池组"
|
prop="batts"
|
>
|
<el-select
|
v-model="params.batts"
|
size="small"
|
@change="battsChanged"
|
>
|
<el-option
|
v-for="(item, idx) in battsList"
|
:key="'batts_' + idx"
|
:label="item.label"
|
:value="item.value"
|
></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :span="layout.span">
|
<el-form-item
|
label="报废日期"
|
prop="battscrap_date"
|
>
|
<el-date-picker
|
v-model="params.battscrap_date"
|
size="small"
|
type="date"
|
placeholder="选择日期"
|
value-format="yyyy-MM-dd"></el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row :gutter="layout.gutter">
|
<el-col
|
:span="24"
|
>
|
<el-form-item
|
label="所属机房"
|
>
|
<el-input
|
v-model="params.stationName"
|
class="read-only"
|
readonly
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col
|
:span="8"
|
>
|
<el-form-item
|
label="电池组品牌"
|
>
|
<el-input
|
v-model="params.battProducer"
|
class="read-only"
|
readonly
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col
|
:span="8"
|
>
|
<el-form-item
|
label="电池组型号"
|
>
|
<el-input
|
v-model="params.battModel"
|
class="read-only"
|
readonly
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col
|
:span="8"
|
>
|
<el-form-item
|
label="投用日期"
|
>
|
<el-input
|
class="read-only"
|
v-model="params.battinuse_date"
|
readonly
|
></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</div>
|
<div class="" slot="footer">
|
<el-button type="primary" @click="add" size="mini">添加</el-button>
|
<el-button type="warning" @click="addDialog = false" size="mini">取消</el-button>
|
</div>
|
</el-dialog>
|
</flex-layout>
|
</template>
|
|
<script>
|
import {
|
testVal
|
} from "@/assets/js/tools";
|
// 引入导出表格
|
import {
|
export_json_to_excel
|
} from '../../assets/js/excel/Export2Excel.js';
|
|
import {
|
deviceTypes,
|
deviceSeions,
|
serchBattgroupidInGroup,
|
serchLow
|
} from "@/assets/js/reportStatistics/eleAnalyse"
|
|
import Timeout from '@/assets/js/tools/Timeout';
|
let rules = {
|
// 单体节数
|
MonCount: {
|
pattern: /^[0-9]{1,3}$/,
|
regVal: true,
|
min: 1,
|
max: 240,
|
msg: '取值范围1~240'
|
}
|
};
|
let today = new Date(Date.now()).format('yyyy-MM-dd');
|
export default {
|
name: "scrapBattery",
|
data () {
|
let defaultDay = "2000-01-01";
|
return {
|
battscrap_time: defaultDay,
|
battscrap_time1: today,
|
battinuse_time: defaultDay,
|
battinuse_time1: today,
|
BattModel: '',
|
batt_Producer: '',
|
timer: new Timeout(),
|
addDialog: false,
|
table: {
|
header: [
|
{
|
prop: 'battProducer',
|
label: '电池品牌',
|
minWidth: 200
|
}
|
,{
|
prop: 'BattModel',
|
label: '电池型号',
|
minWidth: 200
|
}
|
,{
|
prop: 'battinuse_date',
|
label: '投用日期',
|
minWidth: 200
|
}
|
,{
|
prop: 'battscrap_date',
|
label: '报废日期',
|
minWidth: 200
|
}
|
,{
|
prop: 'stationName',
|
label: '原所属机房',
|
minWidth: 600
|
}
|
],
|
data: []
|
},
|
page: {
|
pageCurr: 1,
|
pageSize: 10,
|
pageAll: 0
|
},
|
pickerOptions0: {
|
disabledDate: (time) => {
|
if (this.time_end) {
|
return new Date(time.getTime()) > new Date(this.time_end);
|
}
|
},
|
},
|
pickerOptions1: {
|
disabledDate: (time) => {
|
return (
|
new Date(time.getTime() + 24 * 60 * 60 * 1000) <
|
new Date(this.time_start)
|
);
|
},
|
},
|
params: {
|
areaCode: '',
|
house: '',
|
batts: '',
|
battscrap_date: today,
|
battinuse_date: '',
|
battModel: '',
|
battProducer: '',
|
stationName: '',
|
battGroupName: ''
|
},
|
battProducerList: [],
|
layout: {
|
gutter: 16,
|
span: 12
|
},
|
rules: {
|
batts: [
|
{ required: true, message: '请选择电池组', trigger: ['blur', 'change'] }
|
],
|
battscrap_date: [
|
{ required: true, message: '请选择报废日期', trigger: ['change', 'blur'] }
|
]
|
},
|
areaList: [],
|
houseList: [],
|
battsList: []
|
}
|
},
|
methods: {
|
currentChange (value) {
|
this.page.pageCurr = value;
|
this.searchData();
|
},
|
sizeChange (value) {
|
this.page.pageCurr = 1;
|
this.page.pageSize = value;
|
this.searchData();
|
},
|
// 导出表格
|
exportFile() {
|
let tHeader = [];
|
let filterVal = [];
|
let list = this.table.data;
|
this.table.header.map((item) => {
|
tHeader.push(item.label);
|
filterVal.push(item.prop);
|
});
|
let excelData = this.formatJson(filterVal, list);
|
export_json_to_excel(tHeader, excelData, "备件电池信息管理数据");
|
},
|
formatJson(filterVal, jsonData) {
|
return jsonData.map((v) => filterVal.map((j) => v[j]));
|
},
|
searchData () {
|
// battinuse_time，battinuse_time1 ，battProducer，BattModel
|
let param = {
|
battscrap_time: this.battscrap_time,
|
battscrap_time1: this.battscrap_time1,
|
battinuse_time: this.battinuse_time,
|
battinuse_time1: this.battinuse_time1,
|
battProducer: this.batt_Producer,
|
BattModel: this.BattModel,
|
page: {
|
pageCurr: this.page.pageCurr,
|
pageSize: this.page.pageSize
|
}
|
};
|
this.$apis.dataMager.scrapBatts.getList(param).then((res) => {
|
res = JSON.parse(res.data.result);
|
// console.log('list', res);
|
let list = [];
|
if (res.code) {
|
list = res.data;
|
this.page.pageAll = list[list.length - 1].page.pageAll;
|
} else if (this.page.pageCurr > 1) {
|
this.currentChange(1);
|
return;
|
}
|
list.forEach((v) => {
|
v['battinuse_date'] = new Date(v.battinuse_time).format('yyyy-MM-dd');
|
v['battscrap_date'] = new Date(v.battscrap_time).format('yyyy-MM-dd');
|
});
|
this.table.data = list;
|
}).catch((err) => {
|
console.error(err);
|
});
|
},
|
add () {
|
this.$refs.addForm.validate((valid) => {
|
if (valid) {
|
let params = {
|
battProducer: this.params.battProducer,
|
BattModel: this.params.battModel,
|
battscrap_time: this.params.battscrap_date,
|
battinuse_time: this.params.battinuse_date,
|
stationName: this.params.stationName,
|
battGroupName: this.params.battGroupName
|
};
|
this.$apis.dataMager.scrapBatts.add(params).then((res) => {
|
res = JSON.parse(res.data.result);
|
// console.log(res);
|
if (res.code) {
|
this.addDialog = false;
|
}
|
this.$layer.msg(res.msg);
|
}).catch((err) => {
|
console.error(err);
|
});
|
} else {
|
this.$layer.msg('存在校验未通过的数据！');
|
}
|
});
|
},
|
searchBattProducer() {
|
// 查询后台
|
this.$apis.dataMager.battGroupMager.searchBattProducer().then(res => {
|
let rs = JSON.parse(res.data.result);
|
let data = [];
|
if (rs.code == 1) {
|
data = rs.data.map(item => {
|
return item.BattProducer
|
});
|
}
|
this.battProducerList = data;
|
// console.log(data, 'batt');
|
}).catch(error => {
|
console.log(error);
|
});
|
}
|
// 获取维护区列表
|
,getDeviceTypes () {
|
deviceTypes().then((res) => {
|
res = JSON.parse(res.data.result);
|
// console.log(res, 'res');
|
if (res.code) {
|
let arr = res.data.map((v) => {
|
return {
|
label: v,
|
value: v
|
}
|
});
|
// console.log(arr, 'list');
|
arr.unshift({
|
label: `全部共${res.data.length}种`,
|
value: ''
|
});
|
this.areaList = arr;
|
}
|
}).catch((err) => {
|
console.error(err);
|
});
|
}
|
// 获取机房列表
|
,getHouseList () {
|
deviceSeions({
|
UNote: this.params.areaCode
|
}).then((res) => {
|
res = JSON.parse(res.data.result);
|
if (res.code) {
|
let arr = res.data.map((v) => {
|
return {
|
label: v.StationName,
|
value: v.StationName
|
}
|
});
|
arr.unshift({
|
label: `全部共${res.data.length}种`,
|
value: ''
|
});
|
this.houseList = arr;
|
this.getBattList();
|
}
|
}).catch((err) => {
|
console.error(err);
|
});
|
}
|
// 获取电池组列表
|
,getBattList () {
|
serchBattgroupidInGroup({
|
UNote: this.params.areaCode,
|
UName: this.params.house
|
}).then((res) => {
|
res = JSON.parse(res.data.result);
|
if (res.code) {
|
let arr = res.data.map((v) => {
|
return {
|
label: v.BattGroupName + '_' + v.MonCount,
|
value: v.BattGroupId
|
}
|
});
|
arr.unshift({
|
label: `全部共${res.data.length}种`,
|
value: ""
|
});
|
this.battsList = arr;
|
}
|
}).catch((err) => {
|
console.error(err);
|
});
|
}
|
// 获取电池组信息
|
,getBattsInfo (id) {
|
this.$apis.dataMager.battGroupMager.getBattGroupInfo(id).then((res) => {
|
res = JSON.parse(res.data.result);
|
if (res.code) {
|
// console.log(res.data[0], 'info');
|
let data = res.data[0];
|
this.params.stationName = data.StationName;
|
this.params.battinuse_date = data.BattInUseDate;
|
this.params.battModel = data.BattModel;
|
this.params.battProducer = data.BattProducer;
|
this.params.battGroupName = data.BattGroupName;
|
}
|
}).catch((err) => {
|
console.error(err);
|
});
|
}
|
,reset () {
|
this.params.battinuse_date = '';
|
this.params.stationName = '';
|
this.params.battProducer = '';
|
this.params.battModel = '';
|
this.params.battGroupName = '';
|
}
|
,areaChanged () {
|
this.params.house = '';
|
this.params.batts = '';
|
this.getHouseList();
|
this.reset();
|
}
|
,houseChanged () {
|
this.battsList = [];
|
this.params.batts = '';
|
this.getBattList();
|
this.reset();
|
}
|
,battsChanged (id) {
|
// console.log(id, 'battid');
|
this.reset();
|
this.getBattsInfo(id);
|
}
|
|
},
|
mounted () {
|
this.timer.start(() => {
|
this.searchData();
|
this.timer.open();
|
}, 1000);
|
// 查询维护区列表
|
this.getDeviceTypes();
|
this.getHouseList();
|
this.searchBattProducer();
|
},
|
beforeDestroy () {
|
this.timer.stop();
|
}
|
}
|
</script>
|
|
<style scoped>
|
.time_box {
|
width: 48.6%;
|
}
|
.dialog_content {
|
padding: 4px 10px;
|
}
|
.read-only >>> input {
|
cursor: not-allowed;
|
}
|
.bg-white >>> .el-dialog {
|
background: #fff;
|
}
|
</style>
|
