From 836c8c17007532540a503197a433f5d8c9a0f198 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Sun, 08 Oct 2023 17:34:36 +0800 Subject: [PATCH] fix:接口修改 --- src/views/UVA/index.vue | 888 +++++++++++++++++++++++++++++++++++++++------------------- 1 files changed, 598 insertions(+), 290 deletions(-) diff --git a/src/views/UVA/index.vue b/src/views/UVA/index.vue index d9f8bc1..dc2c246 100644 --- a/src/views/UVA/index.vue +++ b/src/views/UVA/index.vue @@ -3,21 +3,22 @@ <el-container style="height: 100%"> <el-aside width="300px" - style="background-color: rgb(238, 241, 246); overflow-y: hidden" + style="background-color: rgb(238, 241, 246); overflow: hidden" > <div style="width: 274px; margin: 13px auto"> <el-date-picker + ref="datePick" + v-model="datenum" :picker-options="pickerOptions" placeholder="������������" popper-class="jlpMySelectPopper" - ref="datePick" - v-model="datenum" - @change="chooseDate" value-format="yyyy-MM-dd" - > - </el-date-picker> + style="width: 280px" + @change="chooseDate" + @blur="chooseDate1" + @focus="chooseDate2" + /> </div> - <!-- <el-card class="box-card" style="width: 274px; margin: 13px auto"> --> <!-- <div v-else style="height: 180px; width: 274px; overflow-x: hidden"> @@ -36,38 +37,63 @@ </div> --> <!-- </el-card> --> - <div style="width: 274px; margin: 350px auto; border-radius: 8px"> + <div + style="width: 274px; margin: 10px auto; border-radius: 8px" + class="coll" + > <!--accordion ���������������--> <el-collapse - v-model="asideData.activeNames" + v-show="shou1 === true" + v-loading="loading" accordion style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)" - @change="handleChange" - ref="collapse" > <el-collapse-item - v-for="(item1, index) in asideData.uavTimeFly" - :key="index" - :name="index" - style="text-indent: 2em; position: relative" + style="text-indent: 2em; position: relative; padding-botton: 10px" > <template slot="title"> <img style="position: absolute; left: 18px" src="../../assets/images/uav/uav.png" - /> + > <span style="display: inline-block; position: absolute; left: 20px" > - {{ item1.name }}</span + ������������������������������</span> + </template> + </el-collapse-item> + </el-collapse> + <el-collapse + v-show="shou1 === false" + ref="collapse" + v-model="asideData.activeNames" + v-loading="loading" + accordion + style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)" + @change="handleChange" + > + <el-collapse-item + v-for="(item1, index) in asideData.uavTimeFly" + :key="index" + :name="index" + style="text-indent: 2em; position: relative; padding-botton: 10px" + > + <template slot="title"> + <img + style="position: absolute; left: 18px" + src="../../assets/images/uav/uav.png" > + <span + style="display: inline-block; position: absolute; left: 20px" + > + {{ item1.name }}</span> </template> <el-scrollbar style="height: 200px; overflow-x: hidden"> <div v-for="(item, index) in item1.timeSlot" :key="index" class="per-date_area" - :class="{ activeArea: asideData.activeAreaKey === index }" + :class="{ activeArea: asideData.activeKey === index }" @click="getFlyData(item, index, item1.mac)" > <div style="width: 100%; margin: 0 auto"> @@ -78,6 +104,7 @@ <span>{{ item.endTime.substr(11, item.startTime.length) }}</span> + <span> ({{ item.total }}���) </span> </div> </div> </el-scrollbar> @@ -100,36 +127,98 @@ > <div class="numss"> <el-radio-group + v-if="selecttrue === 1" v-model="radioSeven" size="medium" + style="margin-top: 10px; margin-left: 10px" @change="changeCode" > - <el-radio-button label="PM2.5"></el-radio-button> - <el-radio-button label="PM10"></el-radio-button> - <el-radio-button label="SO2"></el-radio-button> - <el-radio-button label="NO2"></el-radio-button> - <el-radio-button label="CO"></el-radio-button> - <el-radio-button label="03"></el-radio-button> - <el-radio-button label="TVOC"></el-radio-button> + <el-radio-button label="PM2.5" /> + <el-radio-button label="PM10" /> + <el-radio-button label="SO2" /> + <el-radio-button label="NO2" /> + <el-radio-button label="CO" /> + <el-radio-button label="03" /> + <el-radio-button label="TVOC" /> </el-radio-group> - <!-- <el-input - placeholder="���������������" - v-model="uvasize" - class="inputNum" - clearable - > - </el-input> --> - <div v-if="selecttrue === 1" style="margin-left: 10px"> - <el-button type="primary" @click="gengD" class="gengD" - >������������</el-button - > + <div v-if="selecttrue === 2" class="Duo"> + <div class="spantuu"> + <span>���������������������������(���): </span> + <el-input + ref="uvas" + v-model="tallone" + class="inputtu" + /> + -- + <el-input + ref="uvas" + v-model="talltwo" + class="inputtu" + /> + </div> + <!-- <el-select v-model="Duovalue" placeholder="������������" class="slee"> + <el-option + v-for="item in optionsduo" + :key="item.code" + :label="item.name" + :value="item.name" + > + </el-option> + </el-select> --> + <div class="spantu"> + <span>������������(���): </span><el-input + ref="uvas" + v-model="uvasize" + class="inputtu" + clearable + placeholder="���������������" + /> + </div> + <el-select v-model="Duovalue" placeholder="������������" class="slee"> + <el-option + v-for="item in optionsduo" + :key="item.code" + :label="item.name" + :value="item.name" + /> + </el-select> + <!-- <div class="spantuu"> + <span>���������������������������(���): </span> + <el-input + class="inputtu" + v-model="tallone" + ref="uvas" + ></el-input> + -- + <el-input + class="inputtu" + v-model="talltwo" + ref="uvas" + ></el-input> + </div> --> </div> - <div v-if="selecttrue === 2" style="margin-left: 10px"> + <div v-if="selecttrue === 1" style="margin-left: 10px"> + <el-button + type="primary" + style="margin-top: 10px" + @click="gengD" + >������������</el-button> + </div> + <div + v-if="selecttrue === 2" + style="margin-left: 10px; margin-top: 10px" + > + <el-button + size="medium" + type="primary" + icon="el-icon-setting" + @click="dialogFormVisible = true" + >6���������</el-button> <el-button class="gengD" @click="shou">������</el-button> <el-button type="primary" @click="selectDuo">������</el-button> </div> </div> - <div class="Duo" v-if="selecttrue === 2"> + <!-- <div class="Duo" v-if="selecttrue === 2"> <el-select v-model="Duovalue" placeholder="������������" class="slee"> <el-option v-for="item in optionsduo" @@ -140,7 +229,7 @@ </el-option> </el-select> <div class="spantu"> - <span>������������(���):</span + <span>������������(���): </span ><el-input class="inputtu" v-model="uvasize" @@ -150,17 +239,84 @@ ></el-input> </div> <div class="spantuu"> - <span>���������������������������(���):</span> - <el-input class="inputtu" v-model="tallone" ref="uvas"></el-input - >- + <span>���������������������������(���): </span> + <el-input class="inputtu" v-model="tallone" ref="uvas"></el-input> + -- <el-input class="inputtu" v-model="talltwo" ref="uvas"></el-input> </div> - </div> + </div> --> </div> - <div v-if="noneData" class="noneData">������������������������������</div> - <div id="map_container" v-loading="loading" /> + <!-- <div v-if="noneData" class="noneData">������������������������������</div> --> + <div id="map_container" v-loading="loading1" /> </el-main> </el-container> + <el-dialog title="6���������" :visible.sync="dialogFormVisible" width="1000px"> + <el-descriptions title="������6���" :column="3" border> + <el-descriptions-item + label="PM2.5 | ug/m��" + label-class-name="my-label" + content-class-name="my-content" + >22</el-descriptions-item> + <el-descriptions-item label="PM10 | ug/m��">34</el-descriptions-item> + <el-descriptions-item label="SO2 | ug/m��">4</el-descriptions-item> + <el-descriptions-item label="NO2 | ug/m��">16</el-descriptions-item> + <el-descriptions-item label="CO | mg/m��">0.5</el-descriptions-item> + <el-descriptions-item label="O3 | ug/m��">149</el-descriptions-item> + </el-descriptions> + <!-- <el-descriptions title="���������������" border> + </el-descriptions> --> + <div + style=" + font-size: 16px; + font-weight: 700; + margin: 10px 0 20px 0; + font-size: 16px; + font-weight: 700; + color: #303133; + " + > + ��������������� + </div> + <el-table :data="sensorTableData" border> + <el-table-column prop="sensorName" label="������" /> + <el-table-column prop="unit" label="������" /> + <el-table-column label="������"> + <template slot-scope="scope"> + <el-input v-model="scope.row.tab1" placeholder="���������������" /> + <!-- <span v-show="!scope.row.show">{{ scope.row.tab1 }}</span> --> + </template> + </el-table-column> + <el-table-column label="������"> + <template slot-scope="scope"> + <el-input v-model="scope.row.tab2" placeholder="���������������" /> + </template> + </el-table-column> + <el-table-column label="������"> + <template slot-scope="scope"> + <el-input v-model="scope.row.tab3" placeholder="���������������" /> + </template> + </el-table-column> + <el-table-column label="������"> + <template slot-scope="scope"> + <el-input v-model="scope.row.tab4" placeholder="���������������" /> + </template> + </el-table-column> + <el-table-column label="������"> + <template slot-scope="scope"> + <el-input v-model="scope.row.tab5" placeholder="���������������" /> + </template> + </el-table-column> + <el-table-column label="������"> + <template slot-scope="scope"> + <el-input v-model="scope.row.tab6" placeholder="���������������" /> + </template> + </el-table-column> + </el-table> + <div slot="footer" class="dialog-footer"> + <el-button @click="dialogFormVisible = false">��� ���</el-button> + <el-button type="primary" @click="customLevel">��� ���</el-button> + </div> + </el-dialog> </div> </template> @@ -173,7 +329,7 @@ var GPS = { PI: 3.14159265358979324, x_pi: (3.14159265358979324 * 3000.0) / 180.0, - delta: function (lat, lon) { + delta: function(lat, lon) { var a = 6378245.0 // a: ������������������������������������������������������������������ var ee = 0.00669342162296594323 // ee: ��������������������� var dLat = this.transformLat(lon - 105.0, lat - 35.0) @@ -188,7 +344,7 @@ }, // WGS-84 to GCJ-02 - gcj_encrypt: function (wgsLat, wgsLon) { + gcj_encrypt: function(wgsLat, wgsLon) { if (this.outOfChina(wgsLat, wgsLon)) { return { lat: wgsLat, lon: wgsLon } } @@ -197,7 +353,7 @@ return { lat: wgsLat + d.lat, lon: wgsLon + d.lon } }, // GCJ-02 to WGS-84 - gcj_decrypt: function (gcjLat, gcjLon) { + gcj_decrypt: function(gcjLat, gcjLon) { if (this.outOfChina(gcjLat, gcjLon)) { return { lat: gcjLat, lon: gcjLon } } @@ -206,7 +362,7 @@ return { lat: gcjLat - d.lat, lon: gcjLon - d.lon } }, // GCJ-02 to WGS-84 exactly - gcj_decrypt_exact: function (gcjLat, gcjLon) { + gcj_decrypt_exact: function(gcjLat, gcjLon) { var initDelta = 0.01 var threshold = 0.000000001 var dLat = initDelta @@ -238,7 +394,7 @@ return { lat: wgsLat, lon: wgsLon } }, // GCJ-02 to BD-09 - bd_encrypt: function (gcjLat, gcjLon) { + bd_encrypt: function(gcjLat, gcjLon) { var x = gcjLon var y = gcjLat var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * this.x_pi) @@ -248,7 +404,7 @@ return { lat: this.bdLat, lon: this.bdLon } }, // BD-09 to GCJ-02 - bd_decrypt: function (bdLat, bdLon) { + bd_decrypt: function(bdLat, bdLon) { var x = bdLon - 0.0065 var y = bdLat - 0.006 var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * this.x_pi) @@ -259,7 +415,7 @@ }, // WGS-84 to Web mercator // mercatorLat -> y mercatorLon -> x - mercator_encrypt: function (wgsLat, wgsLon) { + mercator_encrypt: function(wgsLat, wgsLon) { var x = (wgsLon * 20037508.34) / 180.0 var y = Math.log(Math.tan(((90.0 + wgsLat) * this.PI) / 360.0)) / @@ -269,7 +425,7 @@ }, // Web mercator to WGS-84 // mercatorLat -> y mercatorLon -> x - mercator_decrypt: function (mercatorLat, mercatorLon) { + mercator_decrypt: function(mercatorLat, mercatorLon) { var x = (mercatorLon / 20037508.34) * 180.0 var y = (mercatorLat / 20037508.34) * 180.0 y = @@ -278,7 +434,7 @@ return { lat: y, lon: x } }, // two point's distance - distance: function (latA, lonA, latB, lonB) { + distance: function(latA, lonA, latB, lonB) { var earthR = 6371000.0 var x = Math.cos((latA * this.PI) / 180.0) * @@ -293,7 +449,7 @@ var distance = alpha * earthR return distance }, - outOfChina: function (lat, lon) { + outOfChina: function(lat, lon) { if (lon < 72.004 || lon > 137.8347) { return true } @@ -302,7 +458,7 @@ } return false }, - transformLat: function (x, y) { + transformLat: function(x, y) { var ret = -100.0 + 2.0 * x + @@ -326,7 +482,7 @@ 3.0 return ret }, - transformLon: function (x, y) { + transformLon: function(x, y) { var ret = 300.0 + x + @@ -349,39 +505,44 @@ 2.0) / 3.0 return ret - }, + } } export default { filters: { - sensorFilter: function (value) { + sensorFilter: function(value) { if (!value) return '' return json[value] - }, + } }, data() { return { + dialogFormVisible: false, + chosee: 1, + shou1: true, + zhanK1: 1, zhanK: 1, Duovalue: '', - datenum: '', + datenum: new Date(), + // orderTime:[Date('2020-06-19'),Date('2021-06-19')] selecttrue: 1, pickerOptions: { cellClassName: (time) => { - let timeDate = moment(time.getTime()).format('yyyy-MM-DD') + const timeDate = moment(time.getTime()).format('yyyy-MM-DD') if (this.timeNums.includes(timeDate)) { return 'dateArrClass' // ������������������������������������������ } - }, + } }, tallone: 0, - talltwo: 500, + talltwo: 120, // ��������������� asideData: { dates: [], // ������date������ activeNames: [0], uavTimeFly: [], // ��������������������������������������������� - activeKey: 0, - activeAreaKey: 0, + activeKey: -1, + activeAreaKey: 0 }, load: 1, value: [], @@ -393,7 +554,7 @@ { code: 'a21004', name: 'NO2' }, { code: 'a21005', name: 'CO' }, { code: 'a05024', name: 'O3' }, - { code: 'a99054', name: 'TVOC' }, + { code: 'a99054', name: 'TVOC' } ], valuetime: '2023-01-01', defautRadio: { code: 'a34004', name: 'PM2.5' }, @@ -409,6 +570,7 @@ bdLon: null, bdLat: null, loading: false, + loading1: false, snesorParams: [ 'PM2.5', 'PM10', @@ -417,7 +579,7 @@ 'CO', 'O3', 'TVOC', - '���������', + '���������' ], changeColor: 0, changeColor1: 0, @@ -449,13 +611,12 @@ } else { return time.getTime() > new Date() } - }, + } }, sensorDate: null, noneData: true, defaultData: [], carMac: null, - dialogFormVisible: false, optionsduo: [ { code: 'a34004', name: 'PM2.5' }, { code: 'a34002', name: 'PM10' }, @@ -466,16 +627,16 @@ { code: 'a99054', name: 'TVOC' }, { code: 'a01006', - name: '������', + name: '������' }, { code: 'a01001', - name: '������', + name: '������' }, { code: 'a01002', - name: '������', - }, + name: '������' + } ], sensorTableData: [ { @@ -486,7 +647,7 @@ tab3: '115', tab4: '150', tab5: '250', - tab6: '350', + tab6: '350' }, { sensorName: 'PM10', @@ -496,7 +657,7 @@ tab3: '250', tab4: '350', tab5: '420', - tab6: '500', + tab6: '500' }, { sensorName: 'SO2', @@ -506,7 +667,7 @@ tab3: '475', tab4: '800', tab5: '1600', - tab6: '2100', + tab6: '2100' }, { sensorName: 'NO2', @@ -516,7 +677,7 @@ tab3: '180', tab4: '280', tab5: '565', - tab6: '750', + tab6: '750' }, { sensorName: 'CO', @@ -526,7 +687,7 @@ tab3: '14', tab4: '24', tab5: '36', - tab6: '48', + tab6: '48' }, { sensorName: 'O3', @@ -536,7 +697,7 @@ tab3: '300', tab4: '400', tab5: '800', - tab6: '1000', + tab6: '1000' }, { sensorName: 'TVOC', @@ -546,7 +707,7 @@ tab3: '0.5', tab4: '0.7', tab5: '0.9', - tab6: '1', + tab6: '1' }, { sensorName: '���������', @@ -556,21 +717,21 @@ tab3: '1000', tab4: '10000', tab5: '20000', - tab6: '50000', + tab6: '50000' }, { sensorName: '������', - unit: 'hpa', + unit: 'hpa' }, { sensorName: '������', - unit: '%', + unit: '%' }, { sensorName: '������', - unit: '���', - }, + unit: '���' + } ], carWs: null, map: null, @@ -590,12 +751,12 @@ dataTypeList: [ { value: 'history', - label: '������������', + label: '������������' }, { value: 'webSocket', - label: '������������', - }, + label: '������������' + } ], dataTypeValue: 'history', historyView: true, @@ -609,20 +770,97 @@ endTime: '', dataDate: '', sensorTime: [], - uvasize: 50, + uvasize: 20, timeValue: [ new Date(2020, 1, 1, 0, 0, 0), - new Date(2022, 12, 31, 23, 59, 59), + new Date(2022, 12, 31, 23, 59, 59) ], timeNums: [], batchs: '', macs: '', + sensorTableData: [ + { + sensorName: 'PM2.5', + unit: 'ug/m��', + tab1: '35', + tab2: '75', + tab3: '115', + tab4: '150', + tab5: '250', + tab6: '350' + }, + { + sensorName: 'PM10', + unit: 'ug/m��', + tab1: '50', + tab2: '150', + tab3: '250', + tab4: '350', + tab5: '420', + tab6: '500' + }, + { + sensorName: 'SO2', + unit: 'ug/m��', + tab1: '150', + tab2: '500', + tab3: '650', + tab4: '800', + tab5: '', + tab6: '' + }, + { + sensorName: 'NO2', + unit: 'ug/m��', + tab1: '100', + tab2: '200', + tab3: '700', + tab4: '1200', + tab5: '2340', + tab6: '3090' + }, + { + sensorName: 'CO', + unit: 'mg/m��', + tab1: '5', + tab2: '10', + tab3: '35', + tab4: '60', + tab5: '90', + tab6: '120' + }, + { + sensorName: 'O3', + unit: 'ug/m��', + tab1: '160', + tab2: '200', + tab3: '300', + tab4: '400', + tab5: '800', + tab6: '1000' + }, + { + sensorName: 'TVOC', + unit: 'mg/m��', + tab1: '0.1', + tab2: '0.3', + tab3: '0.5', + tab4: '0.7', + tab5: '0.9', + tab6: '1' + }, + { + sensorName: '���������', + unit: 'ug/m��', + tab1: '300', + tab2: '500', + tab3: '1000', + tab4: '10000', + tab5: '20000', + tab6: '50000' + } + ] } - }, - mounted() { - this.$refs.datePick.focus() - // this.getDate() - // this.flyData() }, watch: { dataTypeValue(n, o) { @@ -645,36 +883,58 @@ // console.log(n) }, deep: true, - immediate: true, + immediate: true + }, + + mounted() { + this.initStart() + // this.$refs.datePick.focus() + // this.getDate() + // this.flyData() }, created() { this.newTime(this.timeValue) this.newDate() this.getDate() + + // this.getFlyData() }, methods: { + customLevel() { + this.selectDuo() + this.dialogFormVisible = false + }, selectDuo() { + // console.log(2115); + if (this.chosee === 1) { + this.$message.warning('������������������������������������') + return + } else { + // console.log('132123'); + this.loading1 = true + } if (this.view) { this.view.removeAllLayers() this.map.clearOverlays() } this.$request({ // url: '/uav/queryDataByBatch', - url: '/uav/test', + url: '/uav/getUav', + // url: '/uav/test', method: 'post', data: { batch: this.batchs, uvasize: this.uvasize, - height: 0, mac: this.macs, + height1: this.tallone, + height2: this.talltwo // batch: '2023-06-16 16:21:21', - }, + } }).then((res) => { - console.log(res) + // console.log(res) this.carData = [] if (res.data === 'null') { this.noneData = true - this.loading = false return } for (var i = 0; i < res.data.length; i++) { @@ -688,30 +948,33 @@ } this.changeCode(this.Duovalue) this.initStart(this.carData) - if (res.data.vos.length) { - this.initStart(this.carData) - } }) }, chooseDate() { - this.$refs.datePick.focus() // ��������������������������������� + // this.$refs.datePick.focus() // ��������������������������������� this.getTimeAreaData(this.datenum) + $('.coll').css('margin-top', '350px') }, - // chooseDate1() { - // this.$refs.datePick.focus() // ��������������������������������� - // this.$refs.uvas.focus() - // }, + chooseDate2() { + // this.$refs.datePick.focus() // ��������������������������������� + // this.getTimeAreaData(this.datenum) + $('.coll').css('margin-top', '350px') + }, + chooseDate1() { + $('.coll').css('margin-top', '10px') + // this.$refs.datePick.focus() // ��������������������������������� + }, gengD() { - if (this.zhanK === 1) { - this.$message.warning('���������������������������������������') - return - } + // if (this.zhanK === 1) { + // this.$message.warning('���������������������������������������') + // return + // } this.selecttrue = 2 - $('.dds').css({ height: '150px' }) + $('.numss').css({ width: '1050px' }) }, shou() { this.selecttrue = 1 - $('.dds').css({ height: '100px' }) + $('.numss').css({ width: '700px' }) }, parseTime(time, cFormat) { if (arguments.length === 0 || !time) { @@ -742,7 +1005,7 @@ h: date.getHours(), i: date.getMinutes(), s: date.getSeconds(), - a: date.getDay(), + a: date.getDay() } const time_str = format.replace(/{([ymdhisa])+}/g, (result, key) => { const value = formatObj[key] @@ -772,12 +1035,6 @@ }) return arr }, - // ��������������������������������� - changeCarData(e) { - this.carMac = e - this.getStart() - }, - // ��������������������������� // ��������������������������������������� Rad(d) { return (d * Math.PI) / 180.0 // ��������������������������������������������������� @@ -842,27 +1099,30 @@ } this.dataType = 'history' // this.map = null - this.getStart() } }, // ��������������������������������� getTimeAreaData(item) { + // this.asideData.uavTimeFly = [] + this.loading = true this.$request({ url: 'uav/queryTimeSlot', method: 'get', params: { organizationId: this.$store.state.orgId, - date: item, - }, + date: item + } }).then((res) => { - this.asideData = [] - console.log(res.data.vos, 'res.data.vos') - if (res.data.vos.length === 0) { + // console.log(res, 'res.data.vos') + if (res.code === -47) { this.noneData = true - this.loading = false + // this.asideData.uavTimeFly=res.message + this.shou1 = true } else { + this.shou1 = false this.asideData.uavTimeFly = res.data.vos } + this.loading = false // if (res.code === 0) { // this.asideData.uavTimeFly = res.data.vos // } @@ -882,6 +1142,16 @@ }, // ��������������� getFlyData(item, index, mac) { + // for (var i = 0; i < this.xie.date.length; i++) { + // this.xie.date[i].flyLat = this.xie.date[i].flyLat + ' ��'.toString() + // this.xie.date[i].flyLon = this.xie.date[i].flyLon + ' ��'.toString() + // this.xie.date[i].a34004 = this.xie.date[i].a34004 + // this.carData.push(this.xie.date[i]) + // } + // this.initStart(this.carData) + this.loading1 = true + this.asideData.activeKey = index + this.chosee = 2 this.batchs = item.batch this.macs = mac this.noneData = false @@ -891,21 +1161,22 @@ } this.$request({ // url: '/uav/queryDataByBatch', - url: '/uav/test', + // url: '/uav/test', + url: '/uav/getUav', method: 'post', data: { batch: item.batch, uvasize: this.uvasize, - height: 0, - mac: mac, + height1: this.tallone, + height2: this.talltwo, + mac: mac // batch: '2023-06-16 16:21:21', - }, + } }).then((res) => { - console.log(res) + // console.log(res) this.carData = [] if (res.data === 'null') { this.noneData = true - this.loading = false return } for (var i = 0; i < res.data.length; i++) { @@ -924,35 +1195,81 @@ url: '/uav/queryDate', method: 'get', params: { - organizationId: this.$store.state.orgId, - }, + organizationId: this.$store.state.orgId + } }).then((res) => { this.asideData.dates = JSON.parse(JSON.stringify(res.data.datesStr)) this.timeNums = this.asideData.dates if (this.asideData.dates.length > 0) { - this.getTimeAreaData(this.asideData.dates[0], 0) - this.datenum = this.asideData.dates[0] - setTimeout(() => { - if (this.asideData.uavTimeFly[0].timeSlot) { - console.log( - this.asideData.uavTimeFly[0].timeSlot, - 'this.asideData.uavTimeFly[0].timeSlot' - ) - // console.log( - // this.asideData.uavTimeFly[0].timeSlot, - // 'this.asideData.uavTimeFly[0].timeSlot[0]' - // ) - this.getFlyData(this.asideData.uavTimeFly[0].timeSlot[0], 0, mac) - } - }, 500) + this.getTimeAreaData(this.datenum, 0) + // this.datenum = this.asideData.dates[0] + // setTimeout(() => { + // if (this.asideData.uavTimeFly[0].timeSlot) { + // console.log( + // this.asideData.uavTimeFly[0].timeSlot, + // 'this.asideData.uavTimeFly[0].timeSlot' + // ) + // // console.log( + // // this.asideData.uavTimeFly[0].timeSlot, + // // 'this.asideData.uavTimeFly[0].timeSlot[0]' + // // ) + // this.getFlyData(this.asideData.uavTimeFly[0].timeSlot[0], 0, mac) + // } + // }, 500) } }) }, initStart(res) { - console.log(res, 'res') this.abc += 1 const that = this if (!res) { + that.map = new window.window.BMapGL.Map('map_container') + that.map.enableScrollWheelZoom(true) // ������������������������������������������������������s + that.map.setMapType(BMAP_EARTH_MAP) // ��������������������������������� + that.map.setDisplayOptions({ + street: false // ������������������������������������������������������������ + }) + that.map.setHeading(0) // ������������������ + if (that.viewKey === '2D') { + that.map.setTilt(0) // ������������ + } else { + that.map.setTilt(52) + } + that.map.setMapStyleV2({ + styleJson: [ + { + featureType: 'road', + elementType: 'all', + stylers: { + color: '#ffffff', + visibility: 'off' + } + }, + { + featureType: 'building', + elementType: 'all', + stylers: { + visibility: 'off' + } + }, + { + featureType: 'poilabel', + elementType: 'all', + stylers: { + visibility: 'off' + } + }, + { + featureType: 'manmade', + elementType: 'all', + stylers: { + visibility: 'off' + } + } + ] + }) + showNoPoints() + this.loading1 = false return } if (this.dataType === 'history') { @@ -964,7 +1281,6 @@ // console.log('������snesor������������') // console.log(this.responseJSON) var trackPoints = [] - this.loading = false if (this.responseJSON.length > 0) { this.noneData = false $.each(this.responseJSON, (item, value) => { @@ -980,11 +1296,13 @@ if (lng < 70 || lng > 150 || lat > 60 || lat < 20) { return true } - lng = GPS.gcj_encrypt(lat, lng).lon - lat = GPS.gcj_encrypt(lat, lng).lat - lng = GPS.bd_encrypt(lat, lng).lon - lat = GPS.bd_encrypt(lat, lng).lat - var point = new BMapGL.Point(lng, lat) + // lng = GPS.gcj_encrypt(lat, lng).lon + // lat = GPS.gcj_encrypt(lat, lng).lat + // lng = GPS.bd_encrypt(lat, lng).lon + // lat = GPS.bd_encrypt(lat, lng).lat + // lng = GPS.bd_decrypt(lat, lng).lon + // lat = GPS.bd_decrypt(lat, lng).lat + var point = new window.BMapGL.Point(lng, lat) point.a34004 = parseInt(value.a34004) point.a34002 = parseInt(value.a34002) point.a21026 = parseInt(value.a21026) @@ -1003,56 +1321,23 @@ that.viewType = this.viewKey that.size = this.uvasize that.distance = that.size / 2 / Math.sin((1 * Math.PI) / 4) - console.log(that.distance, 'that.distance') // ��������������������������������� - if (!that.showPoints) { - that.map = new BMapGL.Map('map_container') - } - that.map.enableScrollWheelZoom(true) // ������������������������������������������������������ - that.map.setMapType(BMAP_EARTH_MAP) // ��������������������������������� - that.map.setDisplayOptions({ - street: false, // ������������������������������������������������������������ - }) - that.map.setHeading(20) // ������������������ - if (that.viewKey === '2D') { - that.map.setTilt(0) // ������������ - } else { - that.map.setTilt(52) - } + // if (!that.showPoints) { + // console.log(111) + // that.map = new window.BMapGL.Map('map_container') + // } + // that.map.enableScrollWheelZoom(true) // ������������������������������������������������������s + // that.map.setMapType(BMAP_EARTH_MAP) // ��������������������������������� + // that.map.setDisplayOptions({ + // street: false, // ������������������������������������������������������������ + // }) + // that.map.setHeading(20) // ������������������ + // if (that.viewKey === '2D') { + // that.map.setTilt(0) // ������������ + // } else { + // that.map.setTilt(52) + // } // ������������������v3.0������������������������ - that.map.setMapStyleV2({ - styleJson: [ - { - featureType: 'road', - elementType: 'all', - stylers: { - color: '#ffffff', - visibility: 'off', - }, - }, - { - featureType: 'building', - elementType: 'all', - stylers: { - visibility: 'off', - }, - }, - { - featureType: 'poilabel', - elementType: 'all', - stylers: { - visibility: 'off', - }, - }, - { - featureType: 'manmade', - elementType: 'all', - stylers: { - visibility: 'off', - }, - }, - ], - }) // that.map.setDisplayOptions({ // // ������������������ @@ -1060,7 +1345,7 @@ // building: true, // ������������������ // poiText: false, // ������poi������ // }) - // that.map.addControl(new BMapGL.NavigationControl3D()) // ������3d������ + // that.map.addControl(new window.BMapGL.NavigationControl3D()) // ������3d������ if (this.responseJSON.length === 0) { showNoPoints() } @@ -1071,20 +1356,21 @@ // console.log(that.mapZoom, 'that.mapZoom') that.centerPoint = that.viewport.center if (that.firstPlayFlag) { - console.log(that.mapZoom, that.centerPoint, '1') that.map.centerAndZoom(that.centerPoint, that.mapZoom) that.view = new mapvgl.View({ - map: that.map, + map: that.map }) that.firstPlayFlag = false + that.loading1 = false } else { - console.log(that.mapZoom, that.centerPoint, '2') this.view.removeAllLayers() this.map.clearOverlays() that.map.centerAndZoom(that.centerPoint, that.mapZoom) that.view = new mapvgl.View({ - map: that.map, + map: that.map }) + that.loading1 = false + // that.map.centerAndZoom(that.centerPoint, 18) } } @@ -1094,7 +1380,7 @@ // drawStartAndEnd() // ��������������������� function draw(sensor, type, carMac) { var levels = getGrading(sensor, type, carMac) - $.each(levels, function (index, value) { + $.each(levels, function(index, value) { var color = value.color var data = value.data if (data.length > 0) { @@ -1105,7 +1391,7 @@ selectedIndex: -1, // ��������� selectedColor: '#ee1111', // ��������������� autoSelect: true, // ������������������������������������������ - riseTime: 1800, // ��������������������������� + riseTime: 1800 // ��������������������������� }) that.shapeLayer.setData(data) that.view.addLayer(that.shapeLayer) @@ -1113,7 +1399,7 @@ }) that.map.setDefaultCursor('default') if (type === '2D') { - $.each(that.showPoints, function (item, point) { + $.each(that.showPoints, function(item, point) { setLabelStyle(point[sensor], point) }) } @@ -1121,26 +1407,26 @@ // ��������������������������������� function drawPolygon(sensor) { - $.each(that.showPoints, function (item, point) { + $.each(that.showPoints, function(item, point) { var sw = getPoint(225, point.lng, point.lat, that.distance) var ne = getPoint(45, point.lng, point.lat, that.distance) var data = point[sensor] // ������������������������������������ var color = getColorAndLevel(sensor, data).color - var polygon = new BMapGL.Polygon( + var polygon = new window.BMapGL.Polygon( [ - new BMapGL.Point(sw.lng, sw.lat), // ��������� - new BMapGL.Point(ne.lng, sw.lat), // ��������� - new BMapGL.Point(ne.lng, ne.lat), // ��������� - new BMapGL.Point(sw.lng, ne.lat), // ��������� + new window.BMapGL.Point(sw.lng, sw.lat), // ��������� + new window.BMapGL.Point(ne.lng, sw.lat), // ��������� + new window.BMapGL.Point(ne.lng, ne.lat), // ��������� + new window.BMapGL.Point(sw.lng, ne.lat) // ��������� ], { - strokeWeight: 0.1, //������������������,������������������ + strokeWeight: 0.1, // ������������������,������������������ // strokeOpacity: 0.0, //������������������ - fillColor: color, //��������������������� - fillOpacity: 0.8, //������������������������0~1������ - strokeColor: 'black', //������������������ - strokeStyle: 'solid', //������������������solid���dashed��� + fillColor: color, // ��������������������� + fillOpacity: 0.8, // ������������������������0~1������ + strokeColor: 'black', // ������������������ + strokeStyle: 'solid' // ������������������solid���dashed��� } ) that.map.addOverlay(polygon) @@ -1151,24 +1437,24 @@ // ��������������������� function drawStartAndEnd() { - var startIcon = new BMapGL.Icon( + var startIcon = new window.BMapGL.Icon( require('@/assets/images/start.png'), - new BMapGL.Size(48, 48) + new window.BMapGL.Size(48, 48) ) - var startMark = new BMapGL.Marker(that.showPoints[0], { + var startMark = new window.BMapGL.Marker(that.showPoints[0], { icon: startIcon, - offset: new BMapGL.Size(0, -20), + offset: new window.BMapGL.Size(0, -20) }) that.map.addOverlay(startMark) - var endIcon = new BMapGL.Icon( + var endIcon = new window.BMapGL.Icon( require('@/assets/images/end.png'), - new BMapGL.Size(48, 48) + new window.BMapGL.Size(48, 48) ) - var endMark = new BMapGL.Marker( + var endMark = new window.BMapGL.Marker( that.showPoints[that.showPoints.length - 1], { icon: endIcon, - offset: new BMapGL.Size(0, -20), + offset: new window.BMapGL.Size(0, -20) } ) that.map.addOverlay(endMark) @@ -1178,7 +1464,7 @@ function drawLine() { var data = [] var points = [] - $.each(trackPoints, function (index, value) { + $.each(trackPoints, function(index, value) { var point = [] point.push(value['lng'], value['lat']) points.push(point) @@ -1186,8 +1472,8 @@ data.push({ geometry: { type: '"LineString"', - coordinates: [points], - }, + coordinates: [points] + } }) var lineLayer = new mapvgl.LineLayer({ color: 'red', @@ -1195,7 +1481,7 @@ animation: true, duration: 10, // ������������2s trailLength: 0.1, // ������������������������0.4 - interval: 0.3, // ���������������������������������0.2 + interval: 0.3 // ���������������������������������0.2 }) that.view.addLayer(lineLayer) lineLayer.setData(data) @@ -1216,6 +1502,7 @@ } } points.push(point1) + // console.log(points, 'image.png') // if (flag) { // points.push(point1) // console.log(points, 'points') @@ -1247,7 +1534,7 @@ lng = (lng * 180) / Math.PI lat = (lat * 180) / Math.PI // console.log(lng, lat) - return new BMapGL.Point(lng, lat) + return new window.BMapGL.Point(lng, lat) } function getGrading(sensor, type, carMac) { @@ -1276,7 +1563,7 @@ level5.color = '#99004c' level6.color = '#7e0023' - $.each(that.showPoints, function (index, value) { + $.each(that.showPoints, function(index, value) { var sw = getPoint(225, value.lng, value.lat, that.distance) var ne = getPoint(45, value.lng, value.lat, 30) var polygon = [] @@ -1313,77 +1600,77 @@ data0.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 1: data1.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 2: data2.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 3: data3.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 4: data4.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 5: data5.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break case 6: data6.push({ geometry: { type: 'Polygon', - coordinates: [polygon], + coordinates: [polygon] }, properties: { - height: height, - }, + height: height + } }) break } @@ -1598,14 +1885,14 @@ // point���������label������ function setLabelStyle(content, point) { - var label = new BMapGL.Label( + var label = new window.BMapGL.Label( "<span class='my-maptip'>" + content + '<br /><span>', // ���lable������������ { - offset: new BMapGL.Size(-8, -10), // label������������������������label������������������������ - position: point, + offset: new window.BMapGL.Size(-8, -10), // label������������������������label������������������������ + position: point } // label��������� ) - var offsetSize = new BMapGL.Size(0, 0) + var offsetSize = new window.BMapGL.Size(0, 0) var size = '10px' if (that.map.getZoom() <= 15.5) { size = '0px' @@ -1617,7 +1904,7 @@ lineHeight: '20px', fontFamily: '������������', backgroundColor: '0.05', - fontWeight: 'bold', + fontWeight: 'bold' } label.setStyle(labelStyle) that.map.addOverlay(label) @@ -1626,14 +1913,14 @@ // ������������,������������������ function showNoPoints() { that.map.centerAndZoom('���������', 17) - setTimeout(function () { + setTimeout(function() { document.getElementById('cpm').style.display = 'block' document.getElementById('data').style.display = 'none' }, 250) } // ������������������������ - that.map.addEventListener('zoomend', function () { + that.map.addEventListener('zoomend', function() { // ��������������������������������������� var zoom = that.map.getZoom() $('span.my-maptip').parent()[zoom <= 15.5 ? 'hide' : 'show']() @@ -1710,17 +1997,8 @@ break } this.initStart(this.carData) - }, - changeCode1(index) { - this.changeColor1 = index - if (index === 0) { - this.viewKey = '2D' - } else { - this.viewKey = '3D' - } - this.getStart() - }, - }, + } + } } </script> @@ -1816,6 +2094,7 @@ } .activeArea { background-color: #f5f7fa; + color: rgb(36, 36, 36); } /*������������*/ .textShow { @@ -1843,6 +2122,12 @@ .per-text-data:nth-last-child(1) { padding-bottom: 8px; } +.el-collapse { + border-top: 1px solid #ebeef5; + border-bottom: 1px solid #ebeef5; + width: 280px; +} + /deep/.el-scrollbar__wrap { overflow-x: hidden; //overflow-y: hidden; @@ -1907,19 +2192,21 @@ background-color: #f40; } .numss { - width: 750px; + width: 700px; background-color: white; - padding: 10px; margin-top: 17px; display: flex; + height: 60px; } /deep/.el-select { width: 8% !important; } .Duo { - height: 70px; display: flex; overflow: hidden; + background-color: white; + width: 750px; + padding-left: 10px; } .spantu { width: 190px; @@ -1928,20 +2215,24 @@ // background-color: white; // height: 40px; display: flex; - margin-left: 20px; - line-height: 70px; + margin-left: 10px; + line-height: 60px; font-weight: 5px; - + color: #696b6f; .inputtu { - width: 35%; + width: 40%; + margin-left: 5px; } } .slee { - line-height: 70px; + line-height: 60px; + width: 100px; + margin-left: 25px; } .spantuu { width: 400px; - line-height: 70px; + line-height: 60px; + color: #696b6f; .inputtu { width: 20%; } @@ -1953,4 +2244,21 @@ .jlpMySelectPopper.el-date-picker table { width: 88%; } -</style> \ No newline at end of file +.BMap_cpyCtrl { + display: none; +} +.anchorBL { + display: none; +} +.el-collapse-item__arrow.is-active { + -webkit-transform: rotate(90deg); + transform: rotate(90deg); + position: absolute; + top: -3px; + right: -3px; +} +/* ������������������������ x ��������������� */ +.el-scrollbar__wrap { + overflow-x: hidden; +} +</style> -- Gitblit v1.8.0