From 355b21bf4c5023a677e1f0347636518972da32a7 Mon Sep 17 00:00:00 2001 From: guoshipeng <3194674006@qq.com> Date: Fri, 28 Jul 2023 16:01:43 +0800 Subject: [PATCH] fix --- src/views/UVA/index.vue | 304 +++++++++++++++++++++++++++++++++----------------- 1 files changed, 199 insertions(+), 105 deletions(-) diff --git a/src/views/UVA/index.vue b/src/views/UVA/index.vue index d9f8bc1..045d9bc 100644 --- a/src/views/UVA/index.vue +++ b/src/views/UVA/index.vue @@ -3,7 +3,7 @@ <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 @@ -13,11 +13,13 @@ ref="datePick" v-model="datenum" @change="chooseDate" + @blur="chooseDate1" + @focus="chooseDate" value-format="yyyy-MM-dd" + style="width: 280px" > </el-date-picker> </div> - <!-- <el-card class="box-card" style="width: 274px; margin: 13px auto"> --> <!-- <div v-else style="height: 180px; width: 274px; overflow-x: hidden"> @@ -36,20 +38,45 @@ </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 + accordion + style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)" + v-show="shou1 === true" + > + <el-collapse-item + 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" + > + ������������������������������</span + > + </template> + </el-collapse-item> + </el-collapse> <el-collapse v-model="asideData.activeNames" accordion style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)" @change="handleChange" ref="collapse" + v-show="shou1 === false" > <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 @@ -67,7 +94,7 @@ 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 +105,7 @@ <span>{{ item.endTime.substr(11, item.startTime.length) }}</span> + <span> ({{ item.total }}���) </span> </div> </div> </el-scrollbar> @@ -140,7 +168,7 @@ </el-option> </el-select> <div class="spantu"> - <span>������������(���):</span + <span>������������(���): </span ><el-input class="inputtu" v-model="uvasize" @@ -150,14 +178,14 @@ ></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 v-if="noneData" class="noneData">������������������������������</div> + <!-- <div v-if="noneData" class="noneData">������������������������������</div> --> <div id="map_container" v-loading="loading" /> </el-main> </el-container> @@ -360,9 +388,13 @@ }, data() { return { + 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) => { @@ -380,7 +412,7 @@ dates: [], // ������date������ activeNames: [0], uavTimeFly: [], // ��������������������������������������������� - activeKey: 0, + activeKey: -1, activeAreaKey: 0, }, load: 1, @@ -619,8 +651,10 @@ macs: '', } }, + mounted() { - this.$refs.datePick.focus() + this.initStart() + // this.$refs.datePick.focus() // this.getDate() // this.flyData() }, @@ -651,9 +685,15 @@ this.newTime(this.timeValue) this.newDate() this.getDate() + + // this.getFlyData() }, methods: { selectDuo() { + if (this.chosee === 1) { + this.$message.warning('������������������������������������') + return + } if (this.view) { this.view.removeAllLayers() this.map.clearOverlays() @@ -670,7 +710,7 @@ // batch: '2023-06-16 16:21:21', }, }).then((res) => { - console.log(res) + // console.log(res) this.carData = [] if (res.data === 'null') { this.noneData = true @@ -688,30 +728,30 @@ } 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() - // }, + 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' }) + $('.dds').css({ height: '170px' }) + $('.numss').css({ width: '750px' }) }, shou() { this.selecttrue = 1 $('.dds').css({ height: '100px' }) + $('.numss').css({ width: '690px' }) }, parseTime(time, cFormat) { if (arguments.length === 0 || !time) { @@ -855,12 +895,14 @@ 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 } // if (res.code === 0) { @@ -882,6 +924,15 @@ }, // ��������������� 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.asideData.activeKey = index + this.chosee = 2 this.batchs = item.batch this.macs = mac this.noneData = false @@ -901,7 +952,7 @@ // batch: '2023-06-16 16:21:21', }, }).then((res) => { - console.log(res) + // console.log(res) this.carData = [] if (res.data === 'null') { this.noneData = true @@ -930,29 +981,76 @@ 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) { + console.log(1) + that.map = new 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() + return } if (this.dataType === 'history') { @@ -1003,56 +1101,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 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({ // // ������������������ @@ -1071,14 +1136,12 @@ // 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, }) that.firstPlayFlag = false } else { - console.log(that.mapZoom, that.centerPoint, '2') this.view.removeAllLayers() this.map.clearOverlays() that.map.centerAndZoom(that.centerPoint, that.mapZoom) @@ -1816,6 +1879,7 @@ } .activeArea { background-color: #f5f7fa; + color: rgb(36, 36, 36); } /*������������*/ .textShow { @@ -1843,6 +1907,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,7 +1977,7 @@ background-color: #f40; } .numss { - width: 750px; + width: 690px; background-color: white; padding: 10px; margin-top: 17px; @@ -1917,9 +1987,13 @@ width: 8% !important; } .Duo { - height: 70px; + height: 60px; display: flex; overflow: hidden; + background-color: white; + width: 750px; + padding-left: 10px; + margin-top: 17px; } .spantu { width: 190px; @@ -1928,20 +2002,22 @@ // background-color: white; // height: 40px; display: flex; - margin-left: 20px; - line-height: 70px; + margin-left: 25px; + line-height: 60px; font-weight: 5px; - .inputtu { - width: 35%; + width: 40%; + margin-left: 5px; } } .slee { - line-height: 70px; + line-height: 60px; + width: 100px; } .spantuu { + margin-left: 25px; width: 400px; - line-height: 70px; + line-height: 60px; .inputtu { width: 20%; } @@ -1953,4 +2029,22 @@ .jlpMySelectPopper.el-date-picker table { width: 88%; } +.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> \ No newline at end of file -- Gitblit v1.8.0