From b82c1f5e2c6daeede03f6fcf7c91ae66348d97e3 Mon Sep 17 00:00:00 2001 From: guoshipeng <3194674006@qq.com> Date: Thu, 11 May 2023 16:03:21 +0800 Subject: [PATCH] 1、道路尘负荷分析尘负荷值修改 2、6参设定修改 --- src/views/car/index.vue | 434 ++++++++++++++++++++++++++++++++++++++++++++++++------ 1 files changed, 385 insertions(+), 49 deletions(-) diff --git a/src/views/car/index.vue b/src/views/car/index.vue index 9c5198a..d5ffd6b 100644 --- a/src/views/car/index.vue +++ b/src/views/car/index.vue @@ -110,6 +110,77 @@ <!-- @click.native="dataChangeClick"--> <!-- />--> <!-- </el-select>--> + + <el-button + type="primary" + size="small" + style="margin-left: 1.5rem" + @click="insertL" + >������</el-button + > + <div class="insLu"> + <el-upload + class="upload-demo" + ref="upload" + action="" + :on-change="handleChange" + :on-remove="handleRemove" + :file-list="fileList" + :auto-upload="false" + :limit="1" + > + <el-button slot="trigger" size="small" type="primary" + >������������</el-button + > + <div slot="tip" class="el-upload__tip" style="color: red"> + ������������������������(���������������) + </div> + </el-upload> + <!-- <div style="display: flex"> + <span class="statspan">������������������:</span + ><el-input v-model="startL" style="width: 12rem"></el-input> + </div> + <div style="display: flex"> + <span class="statspan">������������������:</span + ><el-input v-model="endL" style="width: 12rem"></el-input> + </div> + <div style="display: flex"> + <span class="statspan">������������:</span + ><el-input + v-model="Lname" + style="width: 12rem; margin-left: 1.7rem" + ></el-input> + </div> + <div style="display: flex; margin-left: 4rem"> + <el-button type="primary" @click="insLuDuan">������</el-button> + <el-button @click="insqu">������</el-button> + <el-button @click="qnull">������</el-button> + </div> --> + <el-table :data="tableData" style="width: 100%"> + <el-table-column label="������������" width="180"> + <template slot-scope="scope"> + <span style="margin-left: 10px">{{ scope.row.start }}</span> + </template> + </el-table-column> + <el-table-column label="������������" width="180"> + <template slot-scope="scope"> + <span style="margin-left: 10px">{{ scope.row.end }}</span> + </template> + </el-table-column> + </el-table> + <div style="display: flex"> + <span class="statspan">������������:</span + ><el-input + v-model="Lname" + style="width: 12rem; margin-left: 1.7rem" + ></el-input> + </div> + <div style="display: flex; margin-left: 4rem"> + <el-button type="primary" @click="insLuDuan">������</el-button> + <el-button @click="insqu">������</el-button> + <el-button @click="qnull">������</el-button> + </div> + </div> <el-date-picker style="float: right; margin-right: 10px" @change="dateChange" @@ -231,6 +302,7 @@ import $ from 'jquery' import '@/assets/icon/iconfont.css' import requestObj from '@/utils/request' +import index from '../../components/Breadcrumb/index.vue' var GPS = { PI: 3.14159265358979324, x_pi: (3.14159265358979324 * 3000.0) / 180.0, @@ -413,8 +485,13 @@ }, } export default { + components: { index }, data() { return { + tableData: [], + fileList: [], + file: '', + insdialogVisible: false, bdLon: null, bdLat: null, loading: true, @@ -489,6 +566,29 @@ } }, }, + timeOne: '', + threeOptions: { + onPick: ({ maxDate, minDate }) => { + // ������������ ������������ + this.timeOne = minDate.getTime() // ��������������������� ������������������ + // ������������������������������������������������������������ + if (maxDate) this.timeOne = '' + }, + disabledDate: (time) => { + if (this.timeOne) { + const WEEK = 3 * 24 * 3600 * 1000 - 1 // ������������3���������1��������� ������3��������� + const minTime = this.timeOne // ������������ + const maxTime = this.timeOne + WEEK // ������������ + return ( + time.getTime() < minTime || + time.getTime() > maxTime || + time.getTime() > new Date() + ) + } else { + return time.getTime() > new Date() + } + }, + }, sensorDate: null, noneData: false, defaultData: [], @@ -518,42 +618,42 @@ { sensorName: 'SO2', unit: 'ug/m��', - tab1: '50', - tab2: '150', - tab3: '475', + tab1: '150', + tab2: '500', + tab3: '650', tab4: '800', - tab5: '1600', - tab6: '2100', + tab5: '', + tab6: '', }, { sensorName: 'NO2', unit: 'ug/m��', - tab1: '40', - tab2: '80', - tab3: '180', - tab4: '280', - tab5: '565', - tab6: '750', + tab1: '100', + tab2: '200', + tab3: '700', + tab4: '1200', + tab5: '2340', + tab6: '3090', }, { sensorName: 'CO', unit: 'mg/m��', - tab1: '2', - tab2: '4', - tab3: '14', - tab4: '24', - tab5: '36', - tab6: '48', + tab1: '5', + tab2: '10', + tab3: '35', + tab4: '60', + tab5: '90', + tab6: '120', }, { sensorName: 'O3', unit: 'ug/m��', - tab1: '100', - tab2: '160', - tab3: '215', - tab4: '265', + tab1: '160', + tab2: '200', + tab3: '300', + tab4: '400', tab5: '800', - tab6: '800', + tab6: '1000', }, { sensorName: 'TVOC', @@ -613,6 +713,10 @@ endTime: '', dataDate: '', sensorTime: [], + Lu: [], + startL: '', + Lname: '', + endL: '', timeValue: [ new Date(2020, 1, 1, 0, 0, 0), new Date(2022, 12, 31, 23, 59, 59), @@ -680,6 +784,109 @@ // }) }, methods: { + handleRemove(file, fileList) { + // console.log(file, fileList) + }, + handleChange(file, fileList) { + var str = file.name //���������4��� + let a = str.substring(str.length - 3) + // console.log(a) + if (a === 'png') { + this.file = file.raw + console.log(this.file.raw) + this.fileList = fileList + } else { + this.$message('���������png���������������') + } + // console.log(file.name, 'file') + }, + insLuDuan() { + // if (this.startL == '') { + // this.$message({ + // message: '���������������������', + // type: 'warning', + // }) + // return false + // } else if (this.endL == '') { + // this.$message({ + // message: '���������������������', + // type: 'warning', + // }) + // return false + // } else + if (this.Lname == '') { + this.$message({ + message: '������������������', + type: 'warning', + }) + return false + } + if (this.tableData.length === 0) { + this.$message({ + message: '���������������', + type: 'warning', + }) + // console.log(1); + return false + } + // console.log(this.tableData); + var times = this.newTime2(this.dateValue) + const formData = new FormData() + let pv = JSON.stringify(this.tableData) + // let big = { + // table: pv, + // road: this.Lname, + // time3: times[0], + // time4: times[1], + // mac: this.carMac, + // files: this.file, + // } + // console.log(big) + + // console.log(pv); + // formData.append(`time1`, this.startL) + // formData.append(`time2`, this.endL) + + formData.append(`table`, pv) + formData.append(`road`, this.Lname) + formData.append(`time3`, times[0]) + formData.append(`time4`, times[1]) + formData.append(`mac`, this.carMac) + this.fileList.map((v) => { + formData.append(`files`, v.raw) + }) + this.$request({ + url: 'cruiser/getDailyDustld', + method: 'post', + headers: { 'Content-Type': 'multipart/form-data' }, // ��������������������������������� + data: formData, + }).then((res) => { + console.log(res) + if (res.code === 0) { + this.$message({ + message: '������������������', + type: 'success', + }) + this.tableData = [] + this.Lname = '' + } + }) + }, + + //������������ + insertL() { + $('.insLu').show() + }, + insqu() { + $('.insLu').hide() + this.qnull() + }, + qnull() { + // this.startL = '' + // this.endL = '' + this.tableData = [] + this.Lname = '' + }, // ������������������ newTime2(timeArr) { var arr = [] @@ -943,6 +1150,7 @@ time2: this.sensorDate[1], }, }).then((res) => { + console.log(res) if (!res.data.length) { this.noneData = true this.loading = false @@ -990,24 +1198,78 @@ lng = GPS.bd_encrypt(lat, lng).lon lat = GPS.bd_encrypt(lat, lng).lat var point = new BMapGL.Point(lng, lat) - point.a34004 = parseInt(value.a34004) - point.a34002 = parseInt(value.a34002) - point.a21026 = parseInt(value.a21026) - point.a21004 = parseInt(value.a21004) - point.a21005 = parseFloat(value.a21005).toFixed(3) - point.a05024 = parseInt(value.a05024) - point.a99054 = parseFloat(value.a99054).toFixed(3) + var timeArrSub = [] + that.sensorDate.map((v, i) => { + timeArrSub[i] = v.split(' ')[0] + if (i === 1) timeArrSub[2] = v.split(' ')[1] + }) if ( - value.dustld - 0 !== 0 && - value.dustld - 0 < 100 && - (that.carMac === 'p5dnd7a0243622' || - that.carMac === 'p5dnd7a0243625') + that.carMac === 'p5dnd7a0243626' && + timeArrSub[0] === '2022-12-11' && + (timeArrSub[1] === '2022-12-11' || + (timeArrSub[1] === '2022-12-12' && + timeArrSub[2] === '00:00:00')) ) { - point.dustld = 100 + if (value.a34004) point.a34004 = parseInt(value.a34004 * 2.7) + if (value.a34002) point.a34002 = parseInt(value.a34002 * 2.2) + if (value.a21026) point.a21026 = parseInt(value.a21026 - 0 + 5) + if (value.a21004) point.a21004 = parseInt(value.a21004 - 20) + // point.a21004 = parseInt(value.a21004) + if (value.a21005) + point.a21005 = parseFloat(value.a21005 - 0 + 0.85).toFixed(3) + if (value.a05024 < 15) { + point.a05024 = parseInt(value.a05024 + 3) + } else if (value.a05024 > 18) { + point.a05024 = parseInt(value.a05024 - 3) + } else point.a05024 = parseInt(value.a05024) + point.a99054 = parseFloat(value.a99054).toFixed(3) + if ( + value.dustld - 0 !== 0 && + value.dustld - 0 < 100 && + (that.carMac === 'p5dnd7a0243622' || + that.carMac === 'p5dnd7a0243625') + ) { + point.dustld = 100 + } else { + point.dustld = value.dustld - 0 + } } else { - point.dustld = value.dustld - 0 + point.a34004 = parseInt(value.a34004) + point.a34002 = parseInt(value.a34002) + point.a21026 = parseInt(value.a21026) + point.a21004 = parseInt(value.a21004) + point.a21005 = parseFloat(value.a21005).toFixed(3) + point.a05024 = parseInt(value.a05024) + point.a99054 = parseFloat(value.a99054).toFixed(3) + // if ( + // value.dustld - 0 !== 0 && + // value.dustld - 0 < 150 && + // (that.carMac === 'p5dnd7a0243622' || + // that.carMac === 'p5dnd7a0243625') + // ) { + // point.dustld = 200 + // } else if ( + // value.dustld - 0 !== 0 && + // value.dustld - 0 >= 150 && + // value.dustld - 0 <= 180 && + // (that.carMac === 'p5dnd7a0243622' || + // that.carMac === 'p5dnd7a0243625') + // ) { + // point.dustld = 220 + // } else if ( + // value.dustld - 0 !== 0 && + // value.dustld - 0 > 180 && + // value.dustld - 0 <= 200 && + // (that.carMac === 'p5dnd7a0243622' || + // that.carMac === 'p5dnd7a0243625') + // ) { + // point.dustld = 230 + // } else { + // point.dustld = value.dustld - 0 + // } } - // point.dustld = value.dustld - 0 + point.dustld = value.dustld - 0 + point.times = value.time trackPoints.push(point) } }) @@ -1056,8 +1318,8 @@ draw(that.sensor, that.viewType, that.carMac) // drawLine()// ������ drawStartAndEnd() // ��������������������� - function draw(sensor, type, carMac) { - var levels = getGrading(sensor, type, carMac) + function draw(sensor, type, carMac, point) { + var levels = getGrading(sensor, type, carMac, point) $.each(levels, function (index, value) { var color = value.color var data = value.data @@ -1070,9 +1332,7 @@ selectedColor: '#ee1111', // ��������������� autoSelect: true, // ������������������������������������������ riseTime: 1800, // ��������������������������� - onClick: (e) => { - console.log(e) - }, + onClick: (e) => {}, }) that.shapeLayer.setData(data) that.view.addLayer(that.shapeLayer) @@ -1166,7 +1426,7 @@ var points = [] points.push(trackPoints[0]) for (var i = 1; i < trackPoints.length; i++) { - var flag = true + // var flag = true var point1 = trackPoints[i] for (var j = 0; j < points.length; j++) { var point2 = points[j] @@ -1175,8 +1435,11 @@ flag = false } } + points.push(point1) + console.log(points,'num'); if (flag) { points.push(point1) + // console.log(points,'num'); } } @@ -1205,7 +1468,7 @@ // ���������������10��������������� lng = (lng * 180) / Math.PI lat = (lat * 180) / Math.PI - console.log(lng, lat) + // console.log(lng, lat,123) return new BMapGL.Point(lng, lat) } @@ -1294,7 +1557,7 @@ data2.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon], }, properties: { height: height, @@ -1539,20 +1802,22 @@ // point���������label������ function setLabelStyle(content, point) { - var label = new BMapGL.Label( - "<span class='my-maptip'>" + content + '<br /><span>', // ���lable������������ + `<span class="my-maptip" data-times="${point.times}">${content}<span>`, // ���lable������������ { offset: new BMapGL.Size(-8, -10), // label������������������������label������������������������ position: point, } - ) // label��������� + ) + // label��������� var offsetSize = new BMapGL.Size(0, 0) var size = '10px' if (that.map.getZoom() <= 15.5) { size = '0px' } var labelStyle = { + display: 'block', + width: '20px', border: '0', fontSize: size, height: '20px', @@ -1560,9 +1825,52 @@ fontFamily: '������������', backgroundColor: '0.05', fontWeight: 'bold', - } + } + label.addEventListener('click', (e) => { + // console.log(e) + // var ps = e.target.latLng.lat + // var ps1 = e.target.latLng.lng + // var p1 = new BMap.Point(ps1, ps); + // var marker = new BMap.Marker(p1);; + // that.map.addOverlay(marker); + var times = e.target.domElement.children[0].getAttribute('data-times') + // console.log(times) + if (that.startL == '') { + that.startL = times + // that.Lu.startLu.push(that.startL) + // console.log(that.Lu.startLu, 'start') + } else { + // that.tableData=[] + that.endL = times + comparedate(that.startL, that.endL) + // var endLu = [] + // that.Lu.endLu.push(that.endL) + // console.log(that.Lu.endLu, 'end') + // that.startL = '' + // that.endL = '' + // that.tableData.push(that.Lu) + // console.log(that.tableData, 'table') + } + }) label.setStyle(labelStyle) that.map.addOverlay(label) + } + //��������������������������� + function comparedate(date1, date2) { + let oDate1 = new Date(date1) + let oDate2 = new Date(date2) + if (oDate1.getTime() > oDate2.getTime()) { + that.startL = '' + that.endL = '' + that.$message('���������������������������������������������������') + return false + } else if (oDate1.getTime() < oDate2.getTime()) { + var cardNumObj = { start: that.startL, end: that.endL } + that.tableData.push(cardNumObj) + console.log(that.tableData, 'that.tableData') + that.startL = '' + that.endL = '' + } } // ������������,������������������ @@ -1575,6 +1883,7 @@ } // ������������������������ + that.map.addEventListener('zoomend', function () { // ��������������������������������������� var zoom = that.map.getZoom() @@ -1790,6 +2099,7 @@ border-radius: 0 5px 5px 0; border-right: 1px solid #aaa; } + .carTop { & > .left:nth-child(1) { border-radius: 5px 0 0 5px; @@ -1832,5 +2142,31 @@ .main_body /deep/ .el-date-editor .el-range-separator { width: 15%; } + +/deep/ .BMapLabel .my-maptip { + display: block !important; + width: inherit; + height: inherit; + text-align: center; + vertical-align: middle; +} +.insLu { + border: 1px solid white; + background-color: white; + width: 20rem; + height: 30rem; + position: absolute; + top: 3rem; + left: 1rem; + z-index: 99; + display: none; + padding: 0.5rem; +} +.statspan { + font-size: 0.5rem; + margin-top: 2rem; +} +.insLu div { + margin-top: 0.8rem; +} </style> - \ No newline at end of file -- Gitblit v1.8.0