| | |
| | | style="width: 21rem"
|
| | | />
|
| | | <div>
|
| | | <el-radio-group v-model="select1" style="margin-left: 20px">
|
| | | <el-radio-group
|
| | | v-model="select1"
|
| | | style="margin-left: 20px"
|
| | | >
|
| | | <el-radio-button label="小时报" />
|
| | | <el-radio-button label="日报" />
|
| | | <el-radio-button label="周报" />
|
| | |
| | | <component
|
| | | :is="dataType"
|
| | | style="padding-left: 0; margin-left: 30px"
|
| | | @sendPickerChild="showPickerChild"
|
| | | class="select11"
|
| | | @sendPickerChild="showPickerChild"
|
| | | />
|
| | | <el-date-picker
|
| | | v-if="dateDisplay"
|
| | |
| | | />
|
| | | <el-button
|
| | | type="primary"
|
| | | @click="getReportForm()"
|
| | | style="margin-left: 10px"
|
| | | >查询</el-button
|
| | | @click="getReportForm()"
|
| | | >
|
| | | <el-button type="primary" @click="exportExcel()">报表导出</el-button>
|
| | | 查询
|
| | | </el-button>
|
| | | <el-button
|
| | | type="primary"
|
| | | @click="exportExcel()"
|
| | | >
|
| | | 报表导出
|
| | | </el-button>
|
| | | </div>
|
| | | </div>
|
| | | <div class="topTitle">
|
| | |
| | | :stripe="true"
|
| | | @sort-change="changeTableSort"
|
| | | >
|
| | | <el-table-column prop="rank" label="排名" align="center" />
|
| | | <el-table-column
|
| | | prop="rank"
|
| | | label="排名"
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="deviceName"
|
| | | label="设备"
|
| | |
| | | width="180"
|
| | | align="center"
|
| | | />
|
| | | <el-table-column prop="time" label="时间" width="180" align="center" />
|
| | | <el-table-column prop="aqi" label="AQI" sortable align="center" />
|
| | | <el-table-column
|
| | | prop="time"
|
| | | label="时间"
|
| | | width="180"
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="aqi"
|
| | | label="AQI"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="comIndex"
|
| | | label="综合指数"
|
| | |
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column prop="a34004" label="PM2.5" sortable align="center" />
|
| | | <el-table-column prop="a34002" label="PM10" sortable align="center" />
|
| | | <el-table-column prop="a21026" label="SO2" sortable align="center" />
|
| | | <el-table-column prop="a21004" label="NO2" sortable align="center" />
|
| | | <el-table-column prop="a21005" label="CO" sortable align="center" />
|
| | | <el-table-column prop="a05024" label="O3_8H" sortable align="center" />
|
| | | <el-table-column prop="a99054" label="TVOC" sortable align="center" />
|
| | | <el-table-column
|
| | | prop="a34004"
|
| | | label="PM2.5"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="a34002"
|
| | | label="PM10"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="a21026"
|
| | | label="SO2"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="a21004"
|
| | | label="NO2"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="a21005"
|
| | | label="CO"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="a05024"
|
| | | label="O3_8H"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | <el-table-column
|
| | | prop="a99054"
|
| | | label="TVOC"
|
| | | sortable
|
| | | align="center"
|
| | | />
|
| | | </el-table>
|
| | | </div>
|
| | | </div>
|
| | |
| | | weekPicker,
|
| | | },
|
| | | props: {},
|
| | | data() {
|
| | | data () {
|
| | | // 这里存放数据
|
| | | return {
|
| | | newData: [],
|
| | |
| | | computed: {},
|
| | | // 监控data中的数据变化
|
| | | watch: {
|
| | | select1(nv, ov) {
|
| | | select1 (nv, ov) {
|
| | | if (nv === '日报') {
|
| | | this.dataType = 'HourPicker'
|
| | | this.unit = 1
|
| | |
| | | this.dateDisplay = false
|
| | | }
|
| | | },
|
| | | newMac(newVal, oldval) {
|
| | | newMac (newVal, oldval) {
|
| | | this.newMac1 = []
|
| | | for (let i = 0; i < newVal.length; i++) {
|
| | | // console.log(newVal[i], 111)
|
| | |
| | | },
|
| | |
|
| | | // 生命周期 - 创建完成(可以访问当前 this 实例)
|
| | | created() {
|
| | | created () {
|
| | | this.getData()
|
| | | },
|
| | | // 生命周期 - 挂载完成(可以访问 DOM 元素)
|
| | | mounted() {},
|
| | | beforeCreate() {}, // 生命周期 - 创建之前
|
| | | beforeMount() {}, // 生命周期 - 挂载之前
|
| | | beforeUpdate() {}, // 生命周期 - 更新之前
|
| | | updated() {}, // 生命周期 - 更新之后
|
| | | beforeDestroy() {}, // 生命周期 - 销毁之前
|
| | | destroyed() {}, // 生命周期 - 销毁完成
|
| | | activated() {},
|
| | | mounted () {},
|
| | | beforeCreate () {}, // 生命周期 - 创建之前
|
| | | beforeMount () {}, // 生命周期 - 挂载之前
|
| | | beforeUpdate () {}, // 生命周期 - 更新之前
|
| | | updated () {}, // 生命周期 - 更新之后
|
| | | beforeDestroy () {}, // 生命周期 - 销毁之前
|
| | | destroyed () {}, // 生命周期 - 销毁完成
|
| | | activated () {},
|
| | | // 方法集合
|
| | | methods: {
|
| | | showPickerChild(data) {
|
| | | showPickerChild (data) {
|
| | | this.newData = data
|
| | | },
|
| | | // 重新添加rank排名(当表格的排序条件发生变化的时候会触发该事件)
|
| | | changeTableSort() {
|
| | | changeTableSort () {
|
| | | var sortTableData = this.$refs.mytable.tableData
|
| | | // console.log(this.$refs.mytable.tableData, 111)
|
| | | for (let i = 0; i < sortTableData.length; i++) {
|
| | |
| | | },
|
| | |
|
| | | // 导出报表
|
| | | exportExcel() {
|
| | | exportExcel () {
|
| | | /* generate workbook object from table */
|
| | | var xlsxParam = { raw: true } // 导出的内容只做解析,不进行格式转换
|
| | | var wb = XLSX.utils.table_to_book(
|
| | |
| | | return wbout
|
| | | },
|
| | | // 请求站点信息
|
| | | getData() {
|
| | | getData () {
|
| | | this.$request({
|
| | | url: '/monitorPoint/queryMonitorPoints',
|
| | | method: 'get',
|
| | |
| | | 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,
|
| | | })
|
| | | if (this.defaultData[i].devices) {
|
| | | 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,
|
| | | })
|
| | | }
|
| | | }
|
| | | }
|
| | | })
|
| | |
| | | })
|
| | | },
|
| | | // 请求报表数据
|
| | | getReportForm() {
|
| | | getReportForm () {
|
| | | this.$request({
|
| | | url: '/dataDisplay/monitorPointDataDisplay',
|
| | | method: 'post',
|