From 213cf17a4b48b4cf6333726975eb25ef70568200 Mon Sep 17 00:00:00 2001
From: guoshipeng <3194674006@qq.com>
Date: Fri, 18 Aug 2023 15:08:28 +0800
Subject: [PATCH] fix:监测站数据显示修改,无人机基本值修改
---
src/views/reportForm/sensor.vue | 337 +++++++++++++++++
src/views/main/index.vue | 2
src/views/reportForm/index.vue | 338 +----------------
src/views/reportForm/sensorday.vue | 367 +++++++++++++++++++
src/components/Form/HourPicker3.vue | 72 +++
src/views/UVA/index.vue | 3
6 files changed, 806 insertions(+), 313 deletions(-)
diff --git a/src/components/Form/HourPicker3.vue b/src/components/Form/HourPicker3.vue
new file mode 100644
index 0000000..1064c28
--- /dev/null
+++ b/src/components/Form/HourPicker3.vue
@@ -0,0 +1,72 @@
+<template>
+ <!-- <el-date-picker
+ v-model="value1"
+ type="date"
+ placeholder="������������"
+ value-format="yyyy-MM-dd"
+ /> -->
+ <el-date-picker
+ v-model="value1"
+ type="daterange"
+ range-separator="���"
+ start-placeholder="������������"
+ value-format="yyyy-MM-dd"
+ end-placeholder="������������"
+ :picker-options="pickerOptions"
+ >
+ </el-date-picker>
+</template>
+
+<script>
+// ���������������������������������������������������������js������������������js���json������������������������������
+// ���������import������������������from'������������������';
+
+export default {
+ // import ���������������������������������������������������
+ components: {},
+ props: {
+ // value1: String
+ },
+ data() {
+ // ������������������
+ return {
+ // newValue1: ''
+ value1: '',
+ pickerOptions: {
+ disabledDate: (time) => {
+ return time.getTime() > new Date()
+ },
+ },
+ }
+ },
+ // ������������ ���������data������
+ computed: {},
+ // ������data������������������
+ watch: {
+ value1(nv, ov) {
+ // this.newValue1 = nv
+ this.sendPicker()
+ },
+ },
+ // ������������ - ��������������������������������� this ���������
+ created() {},
+ // ������������ - ��������������������������� DOM ���������
+ mounted() {},
+
+ beforeCreate() {}, // ������������ - ������������
+ beforeMount() {}, // ������������ - ������������
+ beforeUpdate() {}, // ������������ - ������������
+ updated() {}, // ������������ - ������������
+ beforeDestroy() {}, // ������������ - ������������
+ destroyed() {}, // ������������ - ������������
+ activated() {},
+ // ������������
+ methods: {
+ sendPicker() {
+ this.$emit('sendPickerChild', this.value1)
+ },
+ }, // ���������������keep-alive������������������������������������
+}
+</script>
+<style scoped>
+</style>
diff --git a/src/views/UVA/index.vue b/src/views/UVA/index.vue
index 3e672d1..382c68c 100644
--- a/src/views/UVA/index.vue
+++ b/src/views/UVA/index.vue
@@ -775,7 +775,7 @@
endTime: '',
dataDate: '',
sensorTime: [],
- uvasize: 50,
+ uvasize: 20,
timeValue: [
new Date(2020, 1, 1, 0, 0, 0),
new Date(2022, 12, 31, 23, 59, 59),
@@ -2252,7 +2252,6 @@
.BMap_cpyCtrl {
display: none;
}
-
.anchorBL {
display: none;
}
diff --git a/src/views/main/index.vue b/src/views/main/index.vue
index c694ae5..2d54e4c 100644
--- a/src/views/main/index.vue
+++ b/src/views/main/index.vue
@@ -353,7 +353,7 @@
getData() {
this.monitorPointIds = []
this.$request({
- url: '/monitorPoint/queryMonitorPoints',
+ url: '/monitorPoint/queryMonitorPointsState',
method: 'get',
params: {
organizationId: this.organizationId,
diff --git a/src/views/reportForm/index.vue b/src/views/reportForm/index.vue
index c4c3266..3087730 100644
--- a/src/views/reportForm/index.vue
+++ b/src/views/reportForm/index.vue
@@ -1,326 +1,44 @@
<template>
- <div style="width: 100%">
- <div>
- <div class="topSelect">
- <el-cascader
- v-model="newMac"
- :options="options"
- :props="props"
- collapse-tags
- clearable
- placeholder="������������"
- style="width: 21rem"
- />
- <div>
- <el-radio-group v-model="select1" style="margin-left: 20px">
- <el-radio-button label="���������" />
- <el-radio-button label="������" />
- <el-radio-button label="������" />
- <el-radio-button label="������" />
- <el-radio-button label="���������" />
- </el-radio-group>
- </div>
- <component
- :is="dataType"
- style="padding-left: 0; margin-left: 30px"
- @sendPickerChild="showPickerChild"
- class="select11"
- />
- <el-date-picker
- v-if="dateDisplay"
- v-model="newData"
- style="width: 400px; margin-left: 10px"
- type="daterange"
- range-separator="���"
- start-placeholder="������������"
- end-placeholder="������������"
- value-format="yyyy-MM-dd HH"
- />
- <el-button
- type="primary"
- @click="getReportForm()"
- style="margin-left: 10px"
- >������</el-button
- >
- <el-button type="primary" @click="exportExcel()">������������</el-button>
- </div>
- </div>
- <div class="topTitle">
- <el-table
- id="exportTab"
- :default-sort="{ prop: 'rank', order: 'ascending' }"
- :data="tableData"
- border
- style="width: 100%"
- max-height="800"
- :stripe="true"
- @sort-change="changeTableSort"
- >
- <el-table-column prop="rank" label="������" />
- <el-table-column prop="deviceName" label="������" width="180" />
- <el-table-column prop="responsibleUnit" label="������������" width="180" />
- <el-table-column prop="time" label="������" width="180" />
- <el-table-column prop="aqi" label="AQI" sortable />
- <el-table-column
- prop="comIndex"
- label="������������"
- width="130"
- sortable
- />
- <el-table-column prop="a34004" label="PM2.5" sortable />
- <el-table-column prop="a34002" label="PM10" sortable />
- <el-table-column prop="a21026" label="SO2" sortable />
- <el-table-column prop="a21004" label="NO2" sortable />
- <el-table-column prop="a21005" label="CO" sortable />
- <el-table-column prop="a05024" label="O3_8H" sortable />
- <el-table-column prop="a99054" label="TVOC" sortable />
- </el-table>
- </div>
- </div>
+ <el-tabs
+ v-model="activeName"
+ type="card"
+ @tab-click="handleClick"
+ style="height: 100%"
+ >
+ <el-tab-pane name="first" label="������������������">
+ <keep-alive>
+ <sensor />
+ </keep-alive>
+ </el-tab-pane>
+ <el-tab-pane label="���������������������" name="second">
+ <keep-alive>
+ <sensorday />
+ </keep-alive>
+ </el-tab-pane>
+ </el-tabs>
</template>
<script>
-// ���������������������������������������������������������js������������������js���json������������������������������
-// ���������import������������������from'������������������';
-import FileSaver from 'file-saver'
-import XLSX from 'xlsx'
-import DatePicker from '@/components/Form/DatePicker'
-import MouthPicker from '@/components/Form/MouthPicker'
-import HourPicker from '@/components/Form/HourPicker'
-import HourPicker1 from '@/components/Form/HourPicker1'
-import CustomPicker from '@/components/Form/CustomPicker'
-import CustomPicker1 from '@/components/Form/CustomPicker1'
-import TimePicker1 from '@/components/Form/TimePicker1'
-import weekPicker from '@/components/Form/weekPicker'
-
+import sensor from '@/views/reportForm/sensor'
+import sensorday from '@/views/reportForm/sensorday'
export default {
- // import ���������������������������������������������������
components: {
- DatePicker,
- MouthPicker,
- HourPicker,
- CustomPicker,
- CustomPicker1,
- TimePicker1,
- HourPicker1,
- weekPicker,
+ sensor,
+ sensorday,
},
- props: {},
data() {
- // ������������������
return {
- newData: [],
- props: { multiple: true },
- newMac: '',
- newMac1: [],
- options: [],
- select1: '���������',
- dataType: 'HourPicker1',
- unit: '0',
- radio1: '',
- value: '',
- value1: '',
- reportType: 0,
- monitorPointId: 0,
- tableData: [],
- dateDisplay: false,
- newKey: 0,
- timearr: null,
- // pickerOptions1: {
- // disabledDate(time) {
- // console.log(time)
- // const curDate = this.value1[0] ? this.value1[0] : (new Date()).getTime()// ���������������������
- // const seven = 7 * 24 * 60 * 60 * 1000 // ������7��������� 7��� * 24������ * 60������ * 60��� * 1000 = 7���������������
- // const sevenDays = curDate + seven// ������������������������������������������
- // return time.getTime() < Date.now() + 8.64e7 || time.getTime() > sevenDays + 8.64e7// 8.64e7 ������������������������������������������������������������������
- // }
- // }
+ activeName: 'first',
}
},
- // ������������ ���������data������
- computed: {},
- // ������data������������������
- watch: {
- select1(nv, ov) {
- if (nv === '������') {
- this.dataType = 'HourPicker'
- this.unit = 1
- } else if (nv === '������') {
- this.dataType = 'DatePicker'
- this.unit = 3
- } else if (nv === '������') {
- this.dataType = 'weekPicker'
- this.unit = 2
- } else if (nv === '���������') {
- this.dataType = 'HourPicker1'
- this.unit = 0
- }
- if (nv === '���������') {
- this.newData = []
- this.dateDisplay = true
- this.unit = null
- this.dataType = ''
- } else {
- this.dateDisplay = false
- }
- },
- 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 ���������
- created() {
- this.getData()
- },
- // ������������ - ��������������������������� DOM ���������
- mounted() {},
- beforeCreate() {}, // ������������ - ������������
- beforeMount() {}, // ������������ - ������������
- beforeUpdate() {}, // ������������ - ������������
- updated() {}, // ������������ - ������������
- beforeDestroy() {}, // ������������ - ������������
- destroyed() {}, // ������������ - ������������
- activated() {},
- // ������������
+ created() {},
methods: {
- showPickerChild(data) {
- this.newData = data
+ handleClick(tab, event) {
+ // console.log(tab, event)
},
- // ������������rank������(���������������������������������������������������������������)
- changeTableSort() {
- var sortTableData = this.$refs.mytable.tableData
- // console.log(this.$refs.mytable.tableData, 111)
- for (let i = 0; i < sortTableData.length; i++) {
- sortTableData[i].rank = i + 1
- }
- },
-
- // ������������
- exportExcel() {
- /* generate workbook object from table */
- var xlsxParam = { raw: true } // ���������������������������������������������������
- var wb = XLSX.utils.table_to_book(
- document.querySelector('#exportTab'),
- xlsxParam
- )
-
- /* get binary string as output */
- var wbout = XLSX.write(wb, {
- bookType: 'xlsx',
- bookSST: true,
- type: 'array',
- })
- try {
- FileSaver.saveAs(
- new Blob([wbout], { type: 'application/octet-stream' }),
- '���������������.xlsx'
- )
- } catch (e) {
- if (typeof console !== 'undefined') {
- console.log(e, wbout)
- }
- }
- return wbout
- },
- // ������������������
- getData() {
- this.$request({
- url: '/monitorPoint/queryMonitorPoints',
- method: 'get',
- params: {
- organizationId: this.$store.state.orgId,
- },
- })
- .then((res) => {
- // console.log('������index������������������������')
- // console.log(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)
- })
- },
- // ������������������
- getReportForm() {
- this.$request({
- url: '/dataDisplay/monitorPointDataDisplay',
- method: 'post',
- data: {
- macs: this.newMac1,
- reportType: this.unit,
- // monitorPointId: this.monitorPointId,
- // reportType: key === 4 ? null : key,
- startTime: this.unit === 2 ? this.newData : this.newData[0],
- endTime: this.unit === 2 ? null : this.newData[1],
- // times: this.newData instanceof Array ? this.newData : [this.newData],
- },
- })
- .then((res) => {
- console.log(res)
- if (res.code !== 0) {
- return
- }
- var tempData = res.data
- for (let i = 0; i < tempData.length; i++) {
- tempData[i].rank = i + 1
- }
- this.tableData = tempData
- // for (let i = 0; i < res.data.data.length; i++) {
- // this.tableData.push({ ranking: this.defaultData[i].rank, name: this.defaultData[i].name, responsibleUnit: this.defaultData[i].responsibleUnit, time: this.defaultData[i].time, AQI: this.defaultData[i].AQI, compositeIndex: this.defaultData[i].compositeIndex, PM2_5: this.defaultData[i].PM2_5, PM10: this.defaultData[i].PM10, SO2: this.defaultData[i].SO2, NO2: this.defaultData[i].NO2, CO: this.defaultData[i].CO, O3: this.defaultData[i].O3 })
- // }
- })
- .catch((err) => {
- console.log(err)
- })
- },
- }, // ���������������keep-alive������������������������������������
+ },
}
</script>
-<style scoped lang="scss">
-.topSelect {
- display: flex;
- margin-bottom: 20px;
- padding: 20px 15px 0 15px;
- // display: flex;
- // justify-content: space-between;
- // span:first-child {
- // flex: 1;
- // }
- // div:last-child{
- // width: 300px;
- // line-height: 40px;
- // padding-left: 6px;
- // }
-}
-.topTitle {
- display: flex;
- justify-content: space-between;
- margin-bottom: 20px;
- padding: 0 15px;
-}
-.select11 {
- width: 20% !important;
-}
+
+<style scoped>
</style>
diff --git a/src/views/reportForm/sensor.vue b/src/views/reportForm/sensor.vue
new file mode 100644
index 0000000..92afa2e
--- /dev/null
+++ b/src/views/reportForm/sensor.vue
@@ -0,0 +1,337 @@
+<template>
+ <div style="width: 100%">
+ <div>
+ <div class="topSelect">
+ <el-cascader
+ v-model="newMac"
+ :options="options"
+ :props="props"
+ collapse-tags
+ clearable
+ placeholder="������������"
+ style="width: 21rem"
+ />
+ <div>
+ <el-radio-group v-model="select1" style="margin-left: 20px">
+ <el-radio-button label="���������" />
+ <el-radio-button label="������" />
+ <el-radio-button label="������" />
+ <el-radio-button label="������" />
+ <el-radio-button label="���������" />
+ </el-radio-group>
+ </div>
+ <component
+ :is="dataType"
+ style="padding-left: 0; margin-left: 30px"
+ @sendPickerChild="showPickerChild"
+ class="select11"
+ />
+ <el-date-picker
+ v-if="dateDisplay"
+ v-model="newData"
+ style="width: 400px; margin-left: 10px"
+ type="daterange"
+ range-separator="���"
+ start-placeholder="������������"
+ end-placeholder="������������"
+ value-format="yyyy-MM-dd HH"
+ />
+ <el-button
+ type="primary"
+ @click="getReportForm()"
+ style="margin-left: 10px"
+ >������</el-button
+ >
+ <el-button type="primary" @click="exportExcel()">������������</el-button>
+ </div>
+ </div>
+ <div class="topTitle">
+ <el-table
+ id="exportTab"
+ :default-sort="{ prop: 'rank', order: 'ascending' }"
+ :data="tableData"
+ border
+ style="width: 100%"
+ max-height="800"
+ :stripe="true"
+ @sort-change="changeTableSort"
+ >
+ <el-table-column prop="rank" label="������" align="center" />
+ <el-table-column
+ prop="deviceName"
+ label="������"
+ width="180"
+ align="center"
+ />
+ <el-table-column
+ prop="responsibleUnit"
+ 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="comIndex"
+ label="������������"
+ width="130"
+ 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>
+</template>
+
+<script>
+// ���������������������������������������������������������js������������������js���json������������������������������
+// ���������import������������������from'������������������';
+import FileSaver from 'file-saver'
+import XLSX from 'xlsx'
+import DatePicker from '@/components/Form/DatePicker'
+import MouthPicker from '@/components/Form/MouthPicker'
+import HourPicker from '@/components/Form/HourPicker'
+import HourPicker1 from '@/components/Form/HourPicker1'
+import CustomPicker from '@/components/Form/CustomPicker'
+import CustomPicker1 from '@/components/Form/CustomPicker1'
+import TimePicker1 from '@/components/Form/TimePicker1'
+import weekPicker from '@/components/Form/weekPicker'
+
+export default {
+ // import ���������������������������������������������������
+ components: {
+ DatePicker,
+ MouthPicker,
+ HourPicker,
+ CustomPicker,
+ CustomPicker1,
+ TimePicker1,
+ HourPicker1,
+ weekPicker,
+ },
+ props: {},
+ data() {
+ // ������������������
+ return {
+ newData: [],
+ props: { multiple: true },
+ newMac: '',
+ newMac1: [],
+ options: [],
+ select1: '���������',
+ dataType: 'HourPicker1',
+ unit: '0',
+ radio1: '',
+ value: '',
+ value1: '',
+ reportType: 0,
+ monitorPointId: 0,
+ tableData: [],
+ dateDisplay: false,
+ newKey: 0,
+ timearr: null,
+ // pickerOptions1: {
+ // disabledDate(time) {
+ // console.log(time)
+ // const curDate = this.value1[0] ? this.value1[0] : (new Date()).getTime()// ���������������������
+ // const seven = 7 * 24 * 60 * 60 * 1000 // ������7��������� 7��� * 24������ * 60������ * 60��� * 1000 = 7���������������
+ // const sevenDays = curDate + seven// ������������������������������������������
+ // return time.getTime() < Date.now() + 8.64e7 || time.getTime() > sevenDays + 8.64e7// 8.64e7 ������������������������������������������������������������������
+ // }
+ // }
+ }
+ },
+ // ������������ ���������data������
+ computed: {},
+ // ������data������������������
+ watch: {
+ select1(nv, ov) {
+ if (nv === '������') {
+ this.dataType = 'HourPicker'
+ this.unit = 1
+ } else if (nv === '������') {
+ this.dataType = 'DatePicker'
+ this.unit = 3
+ } else if (nv === '������') {
+ this.dataType = 'weekPicker'
+ this.unit = 2
+ } else if (nv === '���������') {
+ this.dataType = 'HourPicker1'
+ this.unit = 0
+ }
+ if (nv === '���������') {
+ this.newData = []
+ this.dateDisplay = true
+ this.unit = null
+ this.dataType = ''
+ } else {
+ this.dateDisplay = false
+ }
+ },
+ 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 ���������
+ created() {
+ this.getData()
+ },
+ // ������������ - ��������������������������� DOM ���������
+ mounted() {},
+ beforeCreate() {}, // ������������ - ������������
+ beforeMount() {}, // ������������ - ������������
+ beforeUpdate() {}, // ������������ - ������������
+ updated() {}, // ������������ - ������������
+ beforeDestroy() {}, // ������������ - ������������
+ destroyed() {}, // ������������ - ������������
+ activated() {},
+ // ������������
+ methods: {
+ showPickerChild(data) {
+ this.newData = data
+ },
+ // ������������rank������(���������������������������������������������������������������)
+ changeTableSort() {
+ var sortTableData = this.$refs.mytable.tableData
+ // console.log(this.$refs.mytable.tableData, 111)
+ for (let i = 0; i < sortTableData.length; i++) {
+ sortTableData[i].rank = i + 1
+ }
+ },
+
+ // ������������
+ exportExcel() {
+ /* generate workbook object from table */
+ var xlsxParam = { raw: true } // ���������������������������������������������������
+ var wb = XLSX.utils.table_to_book(
+ document.querySelector('#exportTab'),
+ xlsxParam
+ )
+
+ /* get binary string as output */
+ var wbout = XLSX.write(wb, {
+ bookType: 'xlsx',
+ bookSST: true,
+ type: 'array',
+ })
+ try {
+ FileSaver.saveAs(
+ new Blob([wbout], { type: 'application/octet-stream' }),
+ '���������������.xlsx'
+ )
+ } catch (e) {
+ if (typeof console !== 'undefined') {
+ console.log(e, wbout)
+ }
+ }
+ return wbout
+ },
+ // ������������������
+ getData() {
+ this.$request({
+ url: '/monitorPoint/queryMonitorPoints',
+ method: 'get',
+ params: {
+ organizationId: this.$store.state.orgId,
+ },
+ })
+ .then((res) => {
+ // console.log('������index������������������������')
+ // console.log(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)
+ })
+ },
+ // ������������������
+ getReportForm() {
+ this.$request({
+ url: '/dataDisplay/monitorPointDataDisplay',
+ method: 'post',
+ data: {
+ macs: this.newMac1,
+ reportType: this.unit,
+ // monitorPointId: this.monitorPointId,
+ // reportType: key === 4 ? null : key,
+ startTime: this.unit === 2 ? this.newData : this.newData[0],
+ endTime: this.unit === 2 ? null : this.newData[1],
+ // times: this.newData instanceof Array ? this.newData : [this.newData],
+ },
+ })
+ .then((res) => {
+ console.log(res)
+ if (res.code !== 0) {
+ return
+ }
+ var tempData = res.data
+ for (let i = 0; i < tempData.length; i++) {
+ tempData[i].rank = i + 1
+ }
+ this.tableData = tempData
+ // for (let i = 0; i < res.data.data.length; i++) {
+ // this.tableData.push({ ranking: this.defaultData[i].rank, name: this.defaultData[i].name, responsibleUnit: this.defaultData[i].responsibleUnit, time: this.defaultData[i].time, AQI: this.defaultData[i].AQI, compositeIndex: this.defaultData[i].compositeIndex, PM2_5: this.defaultData[i].PM2_5, PM10: this.defaultData[i].PM10, SO2: this.defaultData[i].SO2, NO2: this.defaultData[i].NO2, CO: this.defaultData[i].CO, O3: this.defaultData[i].O3 })
+ // }
+ })
+ .catch((err) => {
+ console.log(err)
+ })
+ },
+ }, // ���������������keep-alive������������������������������������
+}
+</script>
+<style scoped lang="scss">
+.topSelect {
+ display: flex;
+ margin-bottom: 20px;
+ padding: 20px 15px 0 15px;
+ // display: flex;
+ // justify-content: space-between;
+ // span:first-child {
+ // flex: 1;
+ // }
+ // div:last-child{
+ // width: 300px;
+ // line-height: 40px;
+ // padding-left: 6px;
+ // }
+}
+.topTitle {
+ display: flex;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ padding: 0 15px;
+}
+.select11 {
+ width: 20% !important;
+}
+</style>
diff --git a/src/views/reportForm/sensorday.vue b/src/views/reportForm/sensorday.vue
new file mode 100644
index 0000000..2d339b4
--- /dev/null
+++ b/src/views/reportForm/sensorday.vue
@@ -0,0 +1,367 @@
+<template>
+ <div style="width: 100%">
+ <div>
+ <div class="topSelect">
+ <el-cascader
+ v-model="newMac"
+ :options="options"
+ :props="props"
+ collapse-tags
+ clearable
+ placeholder="������������"
+ style="width: 21rem"
+ />
+ <div>
+ <el-radio-group v-model="select1" style="margin-left: 20px">
+ <el-radio-button label="������" />
+ <el-radio-button label="������" />
+ <el-radio-button label="������" />
+ <el-radio-button label="���������" />
+ </el-radio-group>
+ </div>
+ <component
+ :is="dataType"
+ style="padding-left: 0; margin-left: 30px"
+ @sendPickerChild="showPickerChild"
+ class="select11"
+ />
+ <el-date-picker
+ v-if="dateDisplay"
+ v-model="newData"
+ style="width: 400px; margin-left: 10px"
+ type="daterange"
+ range-separator="���"
+ start-placeholder="������������"
+ end-placeholder="������������"
+ value-format="yyyy-MM-dd HH"
+ />
+ <el-button
+ type="primary"
+ @click="getReportForm()"
+ style="margin-left: 10px"
+ >������</el-button
+ >
+ <el-button type="primary" @click="exportExcel()">������������</el-button>
+ </div>
+ </div>
+ <div class="topTitle">
+ <el-table
+ :data="tableData"
+ id="exportTabs"
+ max-height="730"
+ @sort-change="changeTableSort"
+ style="width: 100%"
+ >
+ <el-table-column
+ prop="name"
+ label="������������"
+ width="240"
+ align="center"
+ >
+ </el-table-column>
+ <el-table-column label="������������" align="center">
+ <el-table-column
+ prop="composite"
+ label="������"
+ width="180"
+ align="center"
+ >
+ </el-table-column>
+ <el-table-column
+ label="������"
+ width="180"
+ align="center"
+ prop="compositeNum"
+ sortable
+ >
+ </el-table-column>
+ </el-table-column>
+ <el-table-column label="PM2.5" align="center">
+ <el-table-column prop="pm25" label="������" width="180" align="center">
+ </el-table-column>
+ <el-table-column
+ label="������"
+ width="180"
+ align="center"
+ prop="pm25Num"
+ sortable
+ >
+ </el-table-column>
+ </el-table-column>
+ <el-table-column label="������" align="center">
+ <el-table-column prop="o3" label="������" width="180" align="center">
+ </el-table-column>
+ <el-table-column
+ label="������"
+ width="180"
+ align="center"
+ prop="o3Num"
+ sortable
+ >
+ </el-table-column>
+ </el-table-column>
+ <el-table-column label="TVOC" align="center">
+ <el-table-column prop="tovc" label="������" width="180" align="center">
+ </el-table-column>
+ <el-table-column
+ label="������"
+ width="180"
+ align="center"
+ prop="tovcnum"
+ sortable
+ >
+ </el-table-column>
+ </el-table-column>
+ </el-table>
+ </div>
+ </div>
+</template>
+
+<script>
+// ���������������������������������������������������������js������������������js���json������������������������������
+// ���������import������������������from'������������������';
+import FileSaver from 'file-saver'
+import XLSX from 'xlsx'
+import DatePicker from '@/components/Form/DatePicker'
+import MouthPicker from '@/components/Form/MouthPicker'
+import HourPicker from '@/components/Form/HourPicker3'
+import HourPicker1 from '@/components/Form/HourPicker1'
+import CustomPicker from '@/components/Form/CustomPicker'
+import CustomPicker1 from '@/components/Form/CustomPicker1'
+import TimePicker1 from '@/components/Form/TimePicker1'
+import weekPicker from '@/components/Form/weekPicker'
+
+export default {
+ // import ���������������������������������������������������
+ components: {
+ DatePicker,
+ MouthPicker,
+ HourPicker,
+ CustomPicker,
+ CustomPicker1,
+ TimePicker1,
+ HourPicker1,
+ weekPicker,
+ },
+ props: {},
+ data() {
+ // ������������������
+ return {
+ newData: [],
+ props: { multiple: true },
+ newMac: '',
+ newMac1: [],
+ options: [],
+ select1: '������',
+ dataType: 'HourPicker',
+ unit: '1',
+ radio1: '',
+ value: '',
+ value1: '',
+ reportType: 0,
+ monitorPointId: 0,
+ tableData: [],
+ dateDisplay: false,
+ newKey: 0,
+ timearr: null,
+ // pickerOptions1: {
+ // disabledDate(time) {
+ // console.log(time)
+ // const curDate = this.value1[0] ? this.value1[0] : (new Date()).getTime()// ���������������������
+ // const seven = 7 * 24 * 60 * 60 * 1000 // ������7��������� 7��� * 24������ * 60������ * 60��� * 1000 = 7���������������
+ // const sevenDays = curDate + seven// ������������������������������������������
+ // return time.getTime() < Date.now() + 8.64e7 || time.getTime() > sevenDays + 8.64e7// 8.64e7 ������������������������������������������������������������������
+ // }
+ // }
+ }
+ },
+ // ������������ ���������data������
+ computed: {},
+ // ������data������������������
+ watch: {
+ select1(nv, ov) {
+ if (nv === '������') {
+ this.dataType = 'HourPicker'
+ this.unit = 1
+ } else if (nv === '������') {
+ this.dataType = 'DatePicker'
+ this.unit = 3
+ } else if (nv === '������') {
+ this.dataType = 'weekPicker'
+ this.unit = 2
+ }
+ if (nv === '���������') {
+ this.newData = []
+ this.dateDisplay = true
+ this.unit = 4
+ this.dataType = ''
+ } else {
+ this.dateDisplay = false
+ }
+ },
+ 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 ���������
+ created() {
+ this.getData()
+ },
+ // ������������ - ��������������������������� DOM ���������
+ mounted() {},
+ beforeCreate() {}, // ������������ - ������������
+ beforeMount() {}, // ������������ - ������������
+ beforeUpdate() {}, // ������������ - ������������
+ updated() {}, // ������������ - ������������
+ beforeDestroy() {}, // ������������ - ������������
+ destroyed() {}, // ������������ - ������������
+ activated() {},
+ // ������������
+ methods: {
+ showPickerChild(data) {
+ this.newData = data
+ },
+ // ������������rank������(���������������������������������������������������������������)
+ changeTableSort() {
+ var sortTableData = this.$refs.mytable.tableData
+ // console.log(this.$refs.mytable.tableData, 111)
+ for (let i = 0; i < sortTableData.length; i++) {
+ sortTableData[i].rank = i + 1
+ }
+ },
+
+ // ������������
+ exportExcel() {
+ /* generate workbook object from table */
+ var xlsxParam = { raw: true } // ���������������������������������������������������
+ var wb = XLSX.utils.table_to_book(
+ document.querySelector('#exportTabs'),
+ xlsxParam
+ )
+
+ /* get binary string as output */
+ var wbout = XLSX.write(wb, {
+ bookType: 'xlsx',
+ bookSST: true,
+ type: 'array',
+ })
+ try {
+ FileSaver.saveAs(
+ new Blob([wbout], { type: 'application/octet-stream' }),
+ '���������������������.xlsx'
+ )
+ } catch (e) {
+ if (typeof console !== 'undefined') {
+ console.log(e, wbout)
+ }
+ }
+ return wbout
+ },
+ // ������������������
+ getData() {
+ this.$request({
+ url: '/monitorPoint/queryMonitorPoints',
+ method: 'get',
+ params: {
+ organizationId: this.$store.state.orgId,
+ },
+ })
+ .then((res) => {
+ // console.log('������index������������������������')
+ // console.log(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)
+ })
+ },
+ // ������������������
+ getReportForm() {
+ console.log(this.newData)
+ this.$request({
+ // url: '/monitorPoint/listMonitoring',
+ url: '/monitorPoint/listMonitoring',
+ method: 'post',
+ data: {
+ mac: this.newMac1,
+ reportType: this.unit,
+ // monitorPointId: this.monitorPointId,
+ // reportType: key === 4 ? null : key,
+ startTime: this.unit === 2 ? this.newData : this.newData[0],
+ endTime: this.unit === 2 ? this.newData : this.newData[1],
+ // times: this.newData instanceof Array ? this.newData : [this.newData],
+ },
+ })
+ .then((res) => {
+ console.log(res)
+ this.tableData = res.data
+ // if (res.code !== 0) {
+ // return
+ // }
+ // var tempData = res.data
+ // for (let i = 0; i < tempData.length; i++) {
+ // tempData[i].rank = i + 1
+ // }
+ // this.tableData = tempData
+ // for (let i = 0; i < res.data.data.length; i++) {
+ // this.tableData.push({ ranking: this.defaultData[i].rank, name: this.defaultData[i].name, responsibleUnit: this.defaultData[i].responsibleUnit, time: this.defaultData[i].time, AQI: this.defaultData[i].AQI, compositeIndex: this.defaultData[i].compositeIndex, PM2_5: this.defaultData[i].PM2_5, PM10: this.defaultData[i].PM10, SO2: this.defaultData[i].SO2, NO2: this.defaultData[i].NO2, CO: this.defaultData[i].CO, O3: this.defaultData[i].O3 })
+ // }
+ })
+ .catch((err) => {
+ console.log(err)
+ })
+ },
+ }, // ���������������keep-alive������������������������������������
+}
+</script>
+<style scoped lang="scss">
+.topSelect {
+ display: flex;
+ margin-bottom: 20px;
+ padding: 20px 15px 0 15px;
+ // display: flex;
+ // justify-content: space-between;
+ // span:first-child {
+ // flex: 1;
+ // }
+ // div:last-child{
+ // width: 300px;
+ // line-height: 40px;
+ // padding-left: 6px;
+ // }
+}
+.topTitle {
+ display: flex;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ padding: 0 15px;
+}
+.select11 {
+ width: 20% !important;
+}
+/deep/.el-table thead.is-group th {
+ background-color: white;
+}
+</style>
--
Gitblit v1.8.0