| | |
| | | <template> |
| | | <div>环境监测</div> |
| | | </template> |
| | | <div class="main"> |
| | | <div class="main_header"> |
| | | <div class="header_item"> |
| | | <span class="header_label">时间范围:</span> |
| | | <el-date-picker |
| | | v-model="dataTime" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | value-format="yyyy-MM-dd"> |
| | | </el-date-picker> |
| | | </div> |
| | | <div class="header_item"> |
| | | <el-button icon="el-icon-search" @click="searchEnvironMonitorList(true)">查询</el-button> |
| | | <!-- <el-button icon="el-icon-search" v-if="showButton('search')">查询</el-button> --> |
| | | </div> |
| | | </div> |
| | | <div class="main_content"> |
| | | <el-table |
| | | v-loading="loading" |
| | | :data="monitorList" |
| | | height="100%"> |
| | | <el-table-column label="序号" align="center" > |
| | | <template #default="scope"> |
| | | <div> |
| | | <span>{{(pageNum - 1) * pageSize + scope.$index + 1}}</span> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="uploadTime" label="采集时间" align="center" ></el-table-column> |
| | | <el-table-column prop="deviceName" label="设备" align="center"></el-table-column> |
| | | <el-table-column prop="pm25" label="PM2.5(微克/立方米)" width="200" align="center" ></el-table-column> |
| | | <el-table-column prop="pm10" label="PM10(微克/立方米)" width="200" align="center" ></el-table-column> |
| | | <el-table-column prop="tsp" label="TSP(微克/立方米)" width="200" align="center" ></el-table-column> |
| | | <el-table-column prop="temperature" label="温度(摄氏度)" align="center" ></el-table-column> |
| | | <el-table-column prop="humidity" label="湿度(%)" align="center" ></el-table-column> |
| | | <el-table-column prop="bigDeviceModel" label="大气压(千帕)" align="center" ></el-table-column> |
| | | <el-table-column prop="windSpeed" label="风速(米/秒)" align="center" ></el-table-column> |
| | | <el-table-column prop="windDirection" label="风向" align="center" ></el-table-column> |
| | | <el-table-column prop="noise" label="噪声(分贝)" align="center" ></el-table-column> |
| | | </el-table> |
| | | </div> |
| | | <div class="main_footer"> |
| | | |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { buttonPinia } from '../../pinia'; |
| | | export default { |
| | | data() { |
| | | return { |
| | | dataTime: '', |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | total: 0, |
| | | loading: false, |
| | | monitorList: [] |
| | | } |
| | | }, |
| | | mounted() { |
| | | this.searchEnvironMonitorList(true); |
| | | }, |
| | | methods: { |
| | | // 查询环境监测 |
| | | searchEnvironMonitorList(bol) { |
| | | if(bol) { |
| | | this.pageNum = 1; |
| | | } |
| | | this.loading = true; |
| | | this.monitorList = []; |
| | | this.$api.Green.searchEnvironMonitorList({ |
| | | strTime: this.dataTime ? this.dataTime[0] : '', |
| | | endTime: this.dataTime ? this.dataTime[1] : '', |
| | | pageNum: this.pageNum, |
| | | pageSize: this.pageSize |
| | | }).then(res => { |
| | | if(res.success) { |
| | | this.total = res.data.total; |
| | | this.monitorList = res.data.list; |
| | | } |
| | | this.loading = false; |
| | | }).catch(() => { |
| | | this.loading = false; |
| | | }) |
| | | }, |
| | | // 判断按钮权限信息 |
| | | showButton(str) { |
| | | const pinia = buttonPinia(); |
| | | return pinia.$state.buttonInfo.includes(str); |
| | | } |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | @import '@/style/layout-main.scss'; |
| | | </style> |