factory_web/src/views/bigScreen/enpComponents/envirmonitor.vue

73 lines
3.4 KiB
Vue

<template>
<el-container>
<el-header class="panel_title">
<div class="left-panel">
空气质量监测微站
</div>
<div class="right-panel">
<div class="backMap" @click="backtoMap">
切换地图
<el-icon>
<Switch />
</el-icon>
</div>
</div>
</el-header>
<el-main class="nopadding">
<el-container>
<el-header class="searchWrap">
<div class="left-panel"></div>
<div class="right-panel">
<el-select v-model="query.mgroup" placeholder="全部工序" @change="handleQuery" clearable>
<el-option v-for="item in processOptions" :key="item" :label="item" :value="item"></el-option>
</el-select>
<el-input :input-style="searchInputStyle" style="width:7vw;margin:0 5px" v-model="query.search"
placeholder="设备名称/设备编号"></el-input>
<el-button type="primary" icon="el-icon-search" @click="handleQuery"></el-button>
</div>
</el-header>
<el-main>
<scTable :apiObj="apiObj" size="large" :params="params" :query="query">
<el-table-column type="index" width="50" />
<el-table-column prop="number" label="设备编号"></el-table-column>
<el-table-column prop="level" label="设备名称"></el-table-column>
<el-table-column prop="type" label="设备类型"></el-table-column>
<el-table-column prop="mgroup_name" label="所属工序"></el-table-column>
<el-table-column prop="running_state" label="运行状态"></el-table-column>
<el-table-column label="PM2.5" align="center">
<el-table-column prop="mgroup" label="实测值"></el-table-column>
<el-table-column prop="mgroup" label="预警值"></el-table-column>
</el-table-column>
<el-table-column prop="mgroup" label="PM10" align="center">
<el-table-column prop="mgroup" label="实测值"></el-table-column>
<el-table-column prop="mgroup" label="预警值"></el-table-column>
</el-table-column>
<el-table-column prop="level" label="湿度"></el-table-column>
<el-table-column prop="mgroup" label="温度"></el-table-column>
<el-table-column prop="eqpment" label="大气压"></el-table-column>
<el-table-column prop="mgroup" label="风向"></el-table-column>
</scTable>
</el-main>
</el-container>
</el-main>
</el-container>
</template>
<script>
export default {
data() {
return {
params: {},
query: {},
apiObj: null,
processOptions: [],
}
},
methods: {
handleQuery() {
this.$refs.table.queryData(this.query);
},
timeHandleQuery() { },
carHandleQuery() { },
}
}
</script>