You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
337 lines
10 KiB
337 lines
10 KiB
<script>
|
|
|
|
import {selectCollectHistoryDetailList, selectCollectHistoryList} from "../../../api/cdc/collect";
|
|
|
|
const tableId = "2000004"
|
|
const table1 = tableId + "Table1"
|
|
const tableName = "数据预警历史"
|
|
export default {
|
|
name: "collectRecord",
|
|
props:{
|
|
height:{
|
|
type:Number,
|
|
default:700
|
|
},
|
|
component:{
|
|
type:Boolean,
|
|
default:false
|
|
}
|
|
},
|
|
data(){
|
|
return{
|
|
// 遮罩层
|
|
loading: true,
|
|
// 设备信息表格数据
|
|
infoList: [],
|
|
// 弹出层标题
|
|
title: tableName,
|
|
// 是否显示弹出层
|
|
open: false,
|
|
// 查询参数
|
|
queryParams: {
|
|
deviceNo: '',
|
|
deviceDesc: null,
|
|
deviceType: "",
|
|
collectType: "",
|
|
startDate: "",
|
|
endDate: "",
|
|
},
|
|
form:{
|
|
|
|
},
|
|
collectHistoryColumns:[
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: tableId,
|
|
serialNumber: `${table1}CollectType`,
|
|
tableId: table1,
|
|
tableName: tableName,
|
|
columnProp: 'collectType',
|
|
headerAlign: 'center',
|
|
align: 'center',
|
|
columnLabel: '预警类型',
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: '',
|
|
columnWidth: 100
|
|
},
|
|
{
|
|
userId: this.$store.state.user.name,
|
|
functionId: tableId,
|
|
serialNumber: `${table1}CreateTime`,
|
|
tableId: table1,
|
|
tableName: tableName,
|
|
columnProp: 'createTime',
|
|
headerAlign: 'center',
|
|
align: 'center',
|
|
columnLabel: '预警时间',
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: '',
|
|
columnWidth: 120
|
|
},{
|
|
userId: this.$store.state.user.name,
|
|
functionId: tableId,
|
|
serialNumber: `${table1}DeviceNo`,
|
|
tableId: table1,
|
|
tableName: tableName,
|
|
columnProp: 'deviceNo',
|
|
headerAlign: 'center',
|
|
align: 'left',
|
|
columnLabel: '设备号',
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: '',
|
|
columnWidth: 100
|
|
},{
|
|
userId: this.$store.state.user.name,
|
|
functionId: tableId,
|
|
serialNumber: `${table1}DeviceDesc`,
|
|
tableId: table1,
|
|
tableName: tableName,
|
|
columnProp: 'deviceDesc',
|
|
headerAlign: 'center',
|
|
align: 'left',
|
|
columnLabel: '设备描述',
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: '',
|
|
columnWidth: 120
|
|
},{
|
|
userId: this.$store.state.user.name,
|
|
functionId: tableId,
|
|
serialNumber: `${table1}CollectId`,
|
|
tableId: table1,
|
|
tableName: tableName,
|
|
columnProp: 'collectId',
|
|
headerAlign: 'center',
|
|
align: 'left',
|
|
columnLabel: '数据标识ID',
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: '',
|
|
columnWidth: 100
|
|
},{
|
|
userId: this.$store.state.user.name,
|
|
functionId: tableId,
|
|
serialNumber: `${table1}CollectDesc`,
|
|
tableId: table1,
|
|
tableName: tableName,
|
|
columnProp: 'collectDesc',
|
|
headerAlign: 'center',
|
|
align: 'left',
|
|
columnLabel: '数据标识描述',
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: '',
|
|
columnWidth: 120
|
|
},{
|
|
userId: this.$store.state.user.name,
|
|
functionId: tableId,
|
|
serialNumber: `${table1}ItemValue`,
|
|
tableId: table1,
|
|
tableName: tableName,
|
|
columnProp: 'itemValue',
|
|
headerAlign: 'center',
|
|
align: 'right',
|
|
columnLabel: '数据实测值',
|
|
columnHidden: false,
|
|
columnImage: false,
|
|
columnSortable: false,
|
|
sortLv: 0,
|
|
status: true,
|
|
fixed: '',
|
|
columnWidth: 120
|
|
},
|
|
],
|
|
detailList:[],
|
|
}
|
|
},
|
|
methods:{
|
|
handleQuery(){
|
|
let params = {
|
|
...this.queryParams,
|
|
site:this.$store.state.user.site,
|
|
}
|
|
this.loading = true
|
|
this.infoList = []
|
|
selectCollectHistoryList(params).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
this.infoList = data.rows
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
this.loading = false
|
|
}).catch(error=>{
|
|
this.loading = false
|
|
this.$message.error(error)
|
|
})
|
|
},
|
|
handleDetail(row){
|
|
this.form = {...row}
|
|
let params = {
|
|
...row,
|
|
collectHistoryId: row.itemNo,
|
|
}
|
|
this.detailList = [];
|
|
selectCollectHistoryDetailList(params).then(({data})=>{
|
|
if (data && data.code === 0){
|
|
this.open = true
|
|
this.detailList = data.rows
|
|
}else {
|
|
this.$message.warning(data.msg)
|
|
}
|
|
}).catch((error)=>{
|
|
this.$message.error(error)
|
|
})
|
|
},
|
|
},
|
|
watch:{
|
|
"queryParams.deviceNo"(newVal, oldVal){
|
|
this.queryParams.deviceNo = newVal.toUpperCase()
|
|
}
|
|
},
|
|
created() {
|
|
this.handleQuery();
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="app-container">
|
|
<el-form :model="queryParams" label-position="top" ref="queryForm" :inline="true" label-width="68px">
|
|
<el-form-item label="设备类型" prop="deviceType">
|
|
<el-select v-model="queryParams.deviceType" placeholder="请选择设备类型" >
|
|
<el-option label="全部" value=""/>
|
|
<el-option label="涂布机器-大线" value="涂布机器-大线"/>
|
|
<el-option label="涂布机器-小线" value="涂布机器-小线"/>
|
|
<el-option label="涂布机器-浓度-大线" value="涂布机器-浓度-大线"/>
|
|
<el-option label="涂布机器-浓度-小线" value="涂布机器-浓度-小线"/>
|
|
<el-option label="配胶间设备" value="配胶间设备"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="设备号" prop="deviceNo">
|
|
<el-input
|
|
v-model="queryParams.deviceNo"
|
|
placeholder=" "
|
|
clearable
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="设备描述" prop="deviceDesc">
|
|
<el-input
|
|
v-model="queryParams.deviceDesc"
|
|
style="width: 200px"
|
|
placeholder=" "
|
|
clearable
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="采集日期" prop="startDate">
|
|
<el-date-picker
|
|
type="date"
|
|
style="width: 100%"
|
|
value-format="yyyy-MM-dd"
|
|
v-model="queryParams.startDate"
|
|
placeholder=" "
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label=" ">
|
|
<i class="el-icon-right"></i>
|
|
</el-form-item>
|
|
<el-form-item label=" " prop="endDate">
|
|
<el-date-picker
|
|
type="date"
|
|
style="width: 100%"
|
|
v-model="queryParams.endDate"
|
|
value-format="yyyy-MM-dd"
|
|
placeholder=" "
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item label="预警类型" prop="endDate">
|
|
<el-select v-model="queryParams.collectType" placeholder=" ">
|
|
<el-option label="全部" value=""/>
|
|
<el-option label="手机短信" value="手机短信"/>
|
|
<el-option label="邮箱" value="邮箱"/>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label=" ">
|
|
<el-button type="primary" @click="handleQuery" plain>查询</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-table v-loading="loading" border :data="infoList" :height="height">
|
|
<el-table-column
|
|
v-for="(item,index) in collectHistoryColumns" :key="index"
|
|
:sortable="item.columnSortable"
|
|
:prop="item.columnProp"
|
|
:header-align="item.headerAlign"
|
|
:show-overflow-tooltip="item.showOverflowTooltip"
|
|
:align="item.align"
|
|
:fixed="item.fixed === ''?false:item.fixed"
|
|
:min-width="item.columnWidth"
|
|
:label="item.columnLabel">
|
|
<template slot-scope="scope">
|
|
<span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
|
|
<span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" width="100" align="center">
|
|
<template slot-scope="scope">
|
|
<el-link @click="handleDetail(scope.row)">人员</el-link>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<el-dialog :title="title+'-人员'" v-drag :visible.sync="open" width="600px">
|
|
<el-form :model="form" label-position="top" ref="form">
|
|
<el-row :gutter="10">
|
|
<el-col :span="5">
|
|
<el-form-item label="数据标识ID">
|
|
<el-input v-model="form.collectId" disabled></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="9">
|
|
<el-form-item label="数据标识描述">
|
|
<el-input v-model="form.collectDesc" disabled></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="5">
|
|
<el-form-item label="上限值">
|
|
<el-input-number :controls="false" v-model="form.maxValue" disabled></el-input-number>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="5">
|
|
<el-form-item label="下限值">
|
|
<el-input-number :controls="false" v-model="form.minValue" disabled></el-input-number>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<el-table :data="detailList" border :height="300">
|
|
<el-table-column label="人员" min-width="100" header-align="center" align="left" prop="username"></el-table-column>
|
|
<el-table-column label="邮件/手机号" min-width="200" header-align="center" align="left" prop="itemValue"></el-table-column>
|
|
<el-table-column label="类型" min-width="100" header-align="center" align="left" prop="collectType"></el-table-column>
|
|
</el-table>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|