2022-12-14 18:31:34 +08:00

153 lines
5.1 KiB
Vue

<template>
<!-- 历史数据 -->
<div class="fullHeight">
<!-- <vue-scroll> -->
<div class="searchBox whiteBlock">
<el-form
:inline="true"
:model="formInline"
class="demo-form-inline"
size="medium"
>
<el-form-item :label="$t('message.deviceManage.date')">
<el-date-picker
v-model="time"
type="daterange"
:range-separator="$t('message.deviceManage.to')"
:start-placeholder="$t('message.deviceManage.startDate')"
value-format="yyyy-MM-dd"
:end-placeholder="$t('message.deviceManage.endDate')"
>
</el-date-picker>
</el-form-item>
<el-form-item :label="$t('message.deviceManage.facility')">
<el-select
v-model="formInline.devSn"
:placeholder="$t('message.deviceManage.placeholder_select')+$t('message.deviceManage.facility')"
size="small"
>
<el-option :label="$t('message.deviceManage.all')" value=""> </el-option>
<el-option
v-if="options.length > 0"
v-for="item in options"
:key="item.value"
:label="item.devName"
:value="item.devSn"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="onSubmit">{{$t('message.deviceManage.query')}}</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<el-table :data="tableData" class="tables">
<el-table-column prop="devName" :label="$t('message.deviceManage.devName')"> </el-table-column>
<el-table-column prop="voltageA" :label="$t('message.deviceManage.voltageA')"> </el-table-column>
<el-table-column prop="voltageB" :label="$t('message.deviceManage.voltageB')"> </el-table-column>
<el-table-column prop="voltageC" :label="$t('message.deviceManage.voltageC')"> </el-table-column>
<el-table-column prop="cableTemperatureA" :label="$t('message.deviceManage.cableTemperatureA')"> </el-table-column>
<el-table-column prop="cableTemperatureB" :label="$t('message.deviceManage.cableTemperatureB')"> </el-table-column>
<el-table-column prop="cableTemperatureC" :label="$t('message.deviceManage.cableTemperatureC')"> </el-table-column>
<el-table-column prop="phaseCurrentA" :label="$t('message.deviceManage.phaseCurrentA')"> </el-table-column>
<el-table-column prop="phaseCurrentB" :label="$t('message.deviceManage.phaseCurrentB')"> </el-table-column>
<el-table-column prop="phaseCurrentC" :label="$t('message.deviceManage.phaseCurrentC')"> </el-table-column>
<el-table-column prop="ambientTemperature" :label="$t('message.deviceManage.ambientTemperature')"> </el-table-column>
<el-table-column prop="electricLeakage" :label="$t('message.deviceManage.electricLeakage')"> </el-table-column>
<el-table-column prop="uploadTime" :label="$t('message.deviceManage.uploadTime')" width="180"> </el-table-column>
</el-table>
<el-pagination
class="pagerBox"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(total)"
background
></el-pagination>
</div>
<!-- </vue-scroll> -->
</div>
</template>
<script>
import {
getDevListApi,
getHistoryApi,
} from "@/assets/js/api/electricBox";
export default {
name: "historyData",
data() {
return {
projectSn: "",
options: [],
time: [],
formInline: {
endTime: "",
startTime: "",
devSn: "",
},
tableData: [
],
pageNo: 1,
pageSize: 10,
total: 0,
};
},
created() {
this.projectSn = this.$store.state.projectSn;
this.getDevListData();
this.onSubmit();
},
methods: {
//获取设备下拉列表
getDevListData() {
let data = {
projectSn: this.projectSn,
};
getDevListApi(data).then((res) => {
if (res.code == 200) {
this.options = res.result;
}
});
},
//查询列表
onSubmit() {
if (!this.time||this.time.length == 0) {
this.formInline.endTime = "";
this.formInline.startTime = "";
} else {
this.formInline.startTime = this.time[0];
this.formInline.endTime = this.time[1];
}
let data = this.formInline;
data.projectSn = this.projectSn;
data.pageNo = this.pageNo;
data.pageSize = this.pageSize;
getHistoryApi(data).then(res=>{
if(res.code==200){
this.total = res.result.total;
this.tableData = res.result.records;
}
})
},
handleSizeChange(value) {
this.pageSize=value;
this.onSubmit();
},
handleCurrentChange(value) {
this.pageNo = value;
this.onSubmit();
},
},
};
</script>
<style lang="less" scoped>
</style>