From 19cf5b237b0e2bf489c0fe0f8929bf992fae5f8f Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Mon, 17 Jun 2024 15:48:14 +0800 Subject: [PATCH] fix: bug修改 --- src/views/Listdata/index.vue | 272 ++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 222 insertions(+), 50 deletions(-) diff --git a/src/views/Listdata/index.vue b/src/views/Listdata/index.vue index ae35e81..e253099 100644 --- a/src/views/Listdata/index.vue +++ b/src/views/Listdata/index.vue @@ -12,7 +12,7 @@ style="width: 21rem" /> <!-- <div> --> - <el-select + <!-- <el-select v-model="value" placeholder="������������" style="margin-left: 20px" @@ -23,39 +23,91 @@ :label="item.label" :value="item.value" /> - </el-select> - <el-date-picker - v-model="timevalue" - type="datetimerange" - range-separator="���" - value-format="yyyy-MM-dd HH" - start-placeholder="������������" - :picker-options="pickerOptions" - end-placeholder="������������" - style="margin-left: 1rem" - > - </el-date-picker> + </el-select> --> + <div style="margin-left: 1.5rem"> + <el-cascader + v-model="value" + :options="newSensor" + :props="props" + collapse-tags + clearable + /> + </div> + <div> + <el-select + v-model="select1" + placeholder="���������" + style="margin-left: 1.5rem; width: 15rem" + > + <el-option + v-for="item in options1" + :key="item.value" + :label="item.label" + :value="item.value" + /> + </el-select> + </div> + <component + :is="dataType" + style="padding-left: 0; margin-left: 20px; width: 160px" + class="select11" + @sendPickerChild="showPickerChild" + /> - <el-button type="primary" @click="toExcel()" style="margin-left: 20px" + <!-- <el-button type="primary" @click="toExcel()" style="margin-left: 20px" >������</el-button + > --> + <!-- <el-dropdown @command="handleCommand"> + <el-button type="primary" @click="toExcel()" style="margin-left: 20px" + >������<i class="el-icon-arrow-down el-icon--right"></i + ></el-button> + <el-dropdown-menu slot="dropdown"> + <el-dropdown-item command="expNew">������(���)</el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> --> + <el-dropdown + split-button + type="primary" + style="margin-left: 20px" + @click="toExcel()" + @command="handleCommand" > - <el-button @click="exportMon">������</el-button> + ������ + <el-dropdown-menu slot="dropdown"> + <el-dropdown-item command="expNew"> + ������(���) + </el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> + <el-button + style="margin-left: 10px" + @click="exportMon" + > + ������ + </el-button> </div> <el-table - :data="dateList" id="exportTab" + :data="dateList" style="margin-top: 20px" border max-height="800" > <el-table-column v-for="item in columnList" + :key="item" :prop="item" :label="item" width="180px" - :key="item" + /> + <!-- <el-table-column + v-for="item in columnList" + :prop="item.props" + :label="item.label" + width="180px" + :key="item.label" > - </el-table-column> + </el-table-column> --> </el-table> </div> </template> @@ -66,8 +118,24 @@ import FileSaver from 'file-saver' import XLSX2 from 'xlsx-style' 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' export default { - data() { + components: { + DatePicker, + MouthPicker, + HourPicker, + CustomPicker, + CustomPicker1, + TimePicker1, + HourPicker1, + }, + data () { // ������������������ return { props: { multiple: true }, @@ -76,9 +144,26 @@ newMac: '', newMac1: [], newSensor: [] /* ������������ */, - columnList: [], //��������������� + columnList: [], // ��������������� dateList: [], timevalue: [], + select1: '������', + dataType: 'HourPicker', + unit: 'day', + options1: [ + { + label: '���������', + value: '���������', + }, + { + label: '������', + value: '������', + }, + { + label: '������', + value: '������', + }, + ], pickerOptions: { disabledDate: (time) => { return time.getTime() > new Date() @@ -90,8 +175,26 @@ computed: {}, // ������data������������������ watch: { + select1 (nv, ov) { + if (nv === '������') { + this.dataType = 'HourPicker' + this.unit = 'day' + } else if (nv === '������') { + this.dataType = 'DatePicker' + this.unit = 'month' + } else if (nv === '������') { + this.dataType = 'MouthPicker' + this.unit = 'month' + } else if (nv === '���������') { + this.dataType = 'HourPicker1' + this.unit = 'hours' + } else { + this.dataType = 'CustomPicker' + this.unit = 'hours' + } + }, // ��������������������������� - newMac(newVal, oldval) { + newMac (newVal, oldval) { this.newMac1 = [] for (let i = 0; i < newVal.length; i++) { // console.log(newVal[i], 111) @@ -103,23 +206,73 @@ // ������dataType��������������� }, // ������������ - ��������������������������������� this ��������� - created() { + created () { this.getData() }, // ������������ - ��������������������������� DOM ��������� // mounted() { // // }, - beforeCreate() {}, // ������������ - ������������ - beforeMount() {}, // ������������ - ������������ - beforeUpdate() {}, // ������������ - ������������ - updated() {}, // ������������ - ������������ - beforeDestroy() {}, // ������������ - ������������ - destroyed() {}, // ������������ - ������������ - activated() {}, + beforeCreate () {}, // ������������ - ������������ + beforeMount () {}, // ������������ - ������������ + beforeUpdate () {}, // ������������ - ������������ + updated () {}, // ������������ - ������������ + beforeDestroy () {}, // ������������ - ������������ + destroyed () {}, // ������������ - ������������ + activated () {}, // ������������ methods: { - getData() { + handleCommand (command) { + if (this.newMac1 == '') { + this.$message.warning('���������������') + return + } + if (this.value == '') { + this.$message.warning('���������������') + return + } + this.dateList = [] + this.columnList = [] + this.$request({ + url: 'monitorPoint/exlOut', + method: 'post', + data: { + macs: this.newMac1, + sensors: this.value.toString(), + // startTime: this.timevalue[0], + // endTime: this.timevalue[1], + type: this.unit, + times: this.newData instanceof Array ? this.newData : [this.newData], + }, + responseType: 'blob', + }).then((res) => { + console.log('������������', res) + this.getOutExcel('������������������.xlsx', res) + }) + }, + getOutExcel (fileName, res) { + let blob = new Blob([res], { type: 'application/x-xls' }) + if (window.navigator.msSaveOrOpenBlob) { + // ������ IE & EDGE + navigator.msSaveBlob(blob, fileName) + } else { + var link = document.createElement('a') + // ������������������������URL������ + const url = window.URL || window.webkitURL || window.moxURL + // ������������������ + link.href = url.createObjectURL(blob) + // ������������������ + link.download = fileName + // ������������������ + link.click() + // ������������������������ + url.revokeObjectURL(link.href) + } + }, + showPickerChild (data) { + this.newData = data + }, + getData () { this.$request({ url: '/monitorPoint/queryMonitorPoints', method: 'get', @@ -137,14 +290,16 @@ 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, + }) + } } } }) @@ -153,7 +308,8 @@ }) }, // ��������������������������������� - getSensor() { + getSensor () { + this.newSensor = [] this.$request({ url: '/deviceInfo/getMacSensors', method: 'post', @@ -173,8 +329,7 @@ console.log(err) }) }, - exportMon() { - console.log(this.timevalue) + exportMon () { if (this.newMac1 == '') { this.$message.warning('���������������') return @@ -183,7 +338,6 @@ this.$message.warning('���������������') return } - this.dateList = [] this.columnList = [] this.$request({ @@ -192,22 +346,40 @@ data: { macs: this.newMac1, sensors: this.value.toString(), - startTime: this.timevalue[0], - endTime: this.timevalue[1], + // startTime: this.timevalue[0], + // endTime: this.timevalue[1], + type: this.unit, + times: this.newData instanceof Array ? this.newData : [this.newData], }, }).then((res) => { - console.log(res, 11) + // console.log(res, 11) 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.tableData = res.data + // for (let key in this.tableData[0]) { + // let prop = key + // if (String(key).indexOf('.') > -1) { + // prop = key.replace(/\./g, '') + // } + // this.columnList.push({ label: key, props: prop }) + // } + // for (let item of this.tableData) { + // for (let key in this.tableData[0]) { + // if (String(key).indexOf('.') > -1) { + // let newKey = key.replace(/\./g, '') + // item[newKey] = item[key] + // } + // } + // this.dateList.push(item) + // } }) }, - toExcel() { + toExcel () { let wb = XLSX.utils.table_to_book(document.querySelector('#exportTab'), { sheet: '���������', }) @@ -225,9 +397,9 @@ } return ws }, - setExlStyle(data) { + setExlStyle (data) { let borderAll = { - //��������������������� + // ��������������������� top: { style: 'thin', }, @@ -247,7 +419,7 @@ data[key].s = { border: borderAll, alignment: { - horizontal: 'center', //������������������ + horizontal: 'center', // ������������������ vertical: 'center', }, font: { -- Gitblit v1.8.0