<template>
|
<div>
|
<div style="width: 100%; overflow-x: scroll">
|
<el-table
|
border
|
stripe
|
ref="multipleTable"
|
:header-cell-style="{
|
background: '#F5F5F5',
|
'font-weight': '650',
|
'line-height': '45px'
|
}"
|
:data="tableData"
|
:row-class-name="tableRowClassName"
|
>
|
<el-table-column label="序号" type="index" width="60px">
|
</el-table-column>
|
<el-table-column
|
prop="acquit_at_str"
|
label="采集时间"
|
min-width="150px"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="fan_status_str"
|
label="风机状态"
|
min-width="120px"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="hydrocarbon_conc"
|
label="风机电流（A）"
|
min-width="120px"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="filter_status"
|
label="净化器状态"
|
min-width="95px"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="emissions_conc"
|
label="油烟浓度(mg/m³)"
|
min-width="180px"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="granule_conc"
|
label="颗粒物浓度(mg/m³)"
|
min-width="180px"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="hydrocarbon_conc"
|
label="非甲烷总烃浓度(mg/m³)"
|
min-width="190px"
|
>
|
</el-table-column>
|
<el-table-column prop="status" label="设备状态" width="120px">
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="tools">
|
<div class="pagination">
|
<el-pagination
|
background
|
@prev-click="handlePrev"
|
@next-click="handleNext"
|
:current-page="currentPage"
|
layout="prev, pager, next"
|
:total="totalNum"
|
:page-size="pageSize"
|
@current-change="changeCurrentPage"
|
>
|
</el-pagination>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import statisticsApi from "@/api/smoke/statistics";
|
export default {
|
data() {
|
return {
|
currentPage: 1,
|
pageSize: 20,
|
totalNum: 0,
|
tableData: []
|
}
|
},
|
created() {
|
this.getRealTimeList();
|
},
|
methods: {
|
getRealTimeList() {
|
let param = {
|
field: "intimeData",
|
localeId: this.inTimeData.Lid
|
}
|
statisticsApi.getDocument(param).then(jsonStr => {
|
const res = JSON.parse(jsonStr)
|
let list = res.Data.content
|
list.forEach(o => {
|
o.acquit_at_str = this.dateFormat(
|
"YYYY-mm-dd HH:MM:SS",
|
new Date(o.acquit_at * 1000)
|
);
|
o.fan_status_str = o.fan_status == '1' ? '开' : '关'
|
o.status = '达标'
|
});
|
this.tableData = list
|
this.totalNum = res.Data.total
|
})
|
|
},
|
// 设置表格斑马纹
|
tableRowClassName({ row, rowIndex }) {
|
if ((rowIndex + 1) % 2 === 0) {
|
return "warning-row";
|
} else {
|
return "success-row";
|
}
|
},
|
// 当前页改变触发事件
|
changeCurrentPage(page) {
|
this.currentPage = page;
|
this.getRealTimeList();
|
},
|
// 上一页点击事件
|
handlePrev(page) {
|
this.currentPage = page;
|
this.getRealTimeList();
|
},
|
// 下一页点击事件
|
handleNext(page) {
|
this.currentPage = page;
|
this.getRealTimeList();
|
},
|
dateFormat(fmt, date) {
|
let ret;
|
const opt = {
|
"Y+": date.getFullYear().toString(), // 年
|
"m+": (date.getMonth() + 1).toString(), // 月
|
"d+": date.getDate().toString(), // 日
|
"H+": date.getHours().toString(), // 时
|
"M+": date.getMinutes().toString(), // 分
|
"S+": date.getSeconds().toString(), // 秒
|
// 有其他格式化字符需求可以继续添加，必须转化成字符串
|
};
|
for (let k in opt) {
|
ret = new RegExp("(" + k + ")").exec(fmt);
|
if (ret) {
|
fmt = fmt.replace(
|
ret[1],
|
ret[1].length == 1 ? opt[k] : opt[k].padStart(ret[1].length, "0")
|
);
|
}
|
}
|
return fmt;
|
},
|
},
|
props: ['inTimeData']
|
}
|
</script>
|
|
<style>
|
</style>
|
