<template>
|
<div style="padding: 20px">
|
<el-card>
|
<div style="display: flex">
|
<div class="timee" style="margin-top: 0.5rem">
|
{{ time }}
|
</div>
|
<div style="margin-left: 1.5rem">
|
<span>设备和站点:</span>
|
<el-cascader
|
v-model="newMac"
|
:options="options"
|
:props="props"
|
collapse-tags
|
clearable
|
@change="changeYz"
|
placeholder="选择设备"
|
style="width: 25rem"
|
></el-cascader>
|
</div>
|
<div style="margin-left: 1.5rem">
|
<span>选择因子:</span>
|
<el-cascader
|
v-model="value"
|
:options="newSensor"
|
:props="props"
|
collapse-tags
|
clearable
|
@change="res"
|
></el-cascader>
|
</div>
|
<div style="margin-left: 1.5rem">
|
<el-button type="primary" @click="Equisel">查询</el-button>
|
</div>
|
</div>
|
</el-card>
|
<el-table
|
:data="dateList"
|
style="margin-top: 20px"
|
border
|
max-height="800"
|
>
|
<el-table-column
|
v-for="item in columnList"
|
:prop="item"
|
:label="item"
|
width="180px"
|
:key="item"
|
>
|
</el-table-column>
|
</el-table>
|
</div>
|
</template>
|
|
<script>
|
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
|
// 例如：import《组件名称》from'《组件路径》';
|
|
export default {
|
//import 引入的组件需要注入到对象中才能使用
|
components: {},
|
props: {},
|
data() {
|
//这里存放数据
|
return {
|
time: '',
|
props: { multiple: true },
|
defaultData: [],
|
options: [],
|
newSensor:[],
|
newMac:'',
|
newMac1:[],
|
value:'',
|
value1:'',
|
columnList: [], //表头的数组
|
dateList: [],
|
}
|
},
|
// 计算属性 类似于data概念
|
computed: {},
|
// 监控data中的数据变化
|
watch: {
|
newMac(newVal, oldval) {
|
this.newMac1 = []
|
for (let i = 0; i < newVal.length; i++) {
|
// console.log(newVal[i], 111)
|
this.newMac1.push(newVal[i][1][1])
|
}
|
// 设备更新后，重新获取因子数据
|
this.getSensor()
|
console.log(this.newMac1)
|
},
|
value(n, o) {
|
this.value1 = []
|
for (let i = 0; i < n.length; i++) {
|
this.value1.push(n[i][0])
|
}
|
},
|
},
|
//方法集合
|
methods: {
|
res(res){
|
console.log(res.toString());
|
},
|
getData() {
|
this.$request({
|
url: '/monitorPoint/queryMonitorPoints',
|
method: 'get',
|
params: {
|
organizationId: this.$store.state.orgId,
|
},
|
})
|
.then((res) => {
|
this.defaultData = res.data.monitorPoints
|
for (let i = 0; i < this.defaultData.length; i++) {
|
this.options.push({
|
value: this.defaultData[i].name,
|
label: this.defaultData[i].name,
|
})
|
this.options[i].children = []
|
for (let j = 0; j < this.defaultData[i].devices.length; j++) {
|
this.options[i].children.push({
|
value: [
|
this.defaultData[i].devices[j].name,
|
this.defaultData[i].devices[j].mac,
|
],
|
label: this.defaultData[i].devices[j].name,
|
})
|
}
|
}
|
})
|
.catch((error) => {
|
console.log(error)
|
})
|
},
|
changeYz(){
|
this.getSensor();
|
},
|
getSensor() {
|
this.$request({
|
url: '/deviceInfo/getMacSensors',
|
method: 'post',
|
data: {
|
macs: this.newMac1,
|
},
|
})
|
.then((result) => {
|
console.log(result);
|
var sensor = result.data
|
for (var i in sensor) {
|
this.newSensor.push({ value: i, label: sensor[i] })
|
}
|
})
|
.catch((err) => {
|
console.log(err)
|
})
|
},
|
Equisel(){
|
this.$request({
|
url:'',
|
method:'post',
|
data:{
|
time:this.time,
|
zhan:this.newMac1,
|
sensorCode:this.value1
|
}
|
}).then((res)=>{
|
console.log(res);
|
this.tableData = res.data
|
console.log(this.tableData, 'this.tableData')
|
for (let key in this.tableData[0]) {
|
this.columnList.push(key)
|
}
|
for (let item of this.tableData) {
|
this.dateList.push(item)
|
}
|
})
|
}
|
},
|
//生命周期 - 创建完成（可以访问当前 this 实例）
|
created() {
|
this.time = this.dateTypeFormat('YYYY-mm-dd HH:MM:SS', new Date())
|
this.getData();
|
},
|
//生命周期 - 挂载完成（可以访问 DOM 元素）
|
mounted() {},
|
beforeCreate() {}, //生命周期 - 创建之前
|
beforeMount() {}, //生命周期 - 挂载之前
|
beforeUpdate() {}, //生命周期 - 更新之前
|
updated() {}, //生命周期 - 更新之后
|
beforeDestroy() {}, //生命周期 - 销毁之前
|
destroyed() {}, //生命周期 - 销毁完成
|
activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
|
}
|
</script>
|
<style scoped>
|
</style>
|
