From 6b7604951f61b7033cc643afe0e4ca67565a1a36 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Tue, 18 Jun 2024 15:39:41 +0800 Subject: [PATCH] fix: bug修改 --- src/layout/components/Sidebar/index.vue | 22 ++- src/views/UVA/index.vue | 317 +++++++++++++++++++++++++++++++++++++--------------- src/views/statement/index.vue | 4 3 files changed, 241 insertions(+), 102 deletions(-) diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue index cf483e9..5f9c4e2 100644 --- a/src/layout/components/Sidebar/index.vue +++ b/src/layout/components/Sidebar/index.vue @@ -1,6 +1,9 @@ <template> <div :class="{ 'has-logo': showLogo }"> - <logo v-if="showLogo" :collapse="isCollapse" /> + <logo + v-if="showLogo" + :collapse="isCollapse" + /> <!-- <div class="logo" style="display:flex;background: #0f4567;"> <img style="width: 20px; height: 30px;margin: 8px 0 11px 18px" @@ -38,7 +41,7 @@ export default { components: { SidebarItem, Logo }, - data() { + data () { return { logo: require('@/assets/images/LOGO.png'), logoDisplay: this.$store.state.logoDisplay @@ -48,14 +51,15 @@ ...mapGetters([ 'sidebar' ]), - sidebar() { + sidebar () { + console.log('������sidebar', this.$store.state.app.sidebar) return this.$store.state.app.sidebar }, - routes() { - // console.log(this.$router.options.routes) + routes () { + console.log('������routes', this.$router.options.routes) return this.$router.options.routes }, - activeMenu() { + activeMenu () { const route = this.$route const { meta, path } = route // if set path, the sidebar will highlight the path you set @@ -64,13 +68,13 @@ } return path }, - showLogo() { + showLogo () { return !this.$store.state.settings.sidebarLogo }, - variables() { + variables () { return variables }, - isCollapse() { + isCollapse () { return !this.sidebar.opened } } diff --git a/src/views/UVA/index.vue b/src/views/UVA/index.vue index 0266911..0056e63 100644 --- a/src/views/UVA/index.vue +++ b/src/views/UVA/index.vue @@ -19,30 +19,15 @@ @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"> - <div - style=" - width: 272px; - text-align: center; - height: 180px; - line-height: 140px; - font-size: 14px; - color: #5a5c60; - " - > - ��������������� - </div> - </div> --> - <!-- </el-card> --> - <div style="width: 274px; margin: 10px auto; border-radius: 8px" class="coll" > <!--accordion ���������������--> - <el-collapse v-show="shou1 === true" v-loading="loading"> + <el-collapse + v-show="shou1 === true" + v-loading="loading" + > <el-collapse-item style="text-indent: 2em; position: relative; padding-botton: 10px" > @@ -50,12 +35,11 @@ <img style="position: absolute; left: 18px" src="../../assets/images/uav/uav.png" - /> + > <span style="display: inline-block; position: absolute; left: 20px" > - ������������������������������</span - > + ������������������������������</span> </template> </el-collapse-item> </el-collapse> @@ -78,12 +62,11 @@ <img style="position: absolute; left: 18px" src="../../assets/images/uav/uav.png" - /> + > <span style="display: inline-block; position: absolute; left: 20px" > - {{ item1.name }}</span - > + {{ item1.name }}</span> </template> <el-scrollbar style="height: 200px; overflow-x: hidden"> <div @@ -138,12 +121,23 @@ <el-radio-button label="03" /> <el-radio-button label="TVOC" /> </el-radio-group> - <div v-if="selecttrue === 2" class="Duo"> + <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="tallone" + class="inputtu" + /> -- - <el-input ref="uvas" v-model="talltwo" class="inputtu" /> + <el-input + ref="uvas" + v-model="talltwo" + class="inputtu" + /> </div> <!-- <el-select v-model="Duovalue" placeholder="������������" class="slee"> <el-option @@ -155,8 +149,7 @@ </el-option> </el-select> --> <div class="spantu"> - <span>������������(���): </span - ><el-input + <span>������������(���): </span><el-input ref="uvas" v-model="uvasize" class="inputtu" @@ -164,7 +157,11 @@ placeholder="���������������" /> </div> - <el-select v-model="Duovalue" placeholder="������������" class="slee"> + <el-select + v-model="Duovalue" + placeholder="������������" + class="slee" + > <el-option v-for="item in optionsduo" :key="item.code" @@ -187,8 +184,15 @@ ></el-input> </div> --> </div> - <div v-if="selecttrue === 1" style="margin-left: 10px"> - <el-button type="primary" style="margin-top: 10px" @click="gengD"> + <div + v-if="selecttrue === 1" + style="margin-left: 10px" + > + <el-button + type="primary" + style="margin-top: 10px" + @click="gengD" + > ������������ </el-button> </div> @@ -204,8 +208,18 @@ > 6��������� </el-button> - <el-button class="gengD" @click="shou"> ������ </el-button> - <el-button type="primary" @click="selectDuo"> ������ </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"> @@ -237,11 +251,45 @@ </div> --> </div> <!-- <div v-if="noneData" class="noneData">������������������������������</div> --> - <div id="map_container" v-loading="loading1" /> + <div + id="map_container" + v-loading="loading1" + /> + <div class="dataParameter"> + <dir class="item"> + <div + v-for="(item, index) in temMergeDataList" + v-show="index < 3" + :key="index" + > + <p> {{ item.name }}:{{ item.value }}</p> + </div> + </dir> + <div + class="item1" + style="margin-left: 10px;" + > + <div + v-for="(item, index) in temMergeDataList" + v-show="index > 2" + :key="index" + > + <p> {{ item.name }}:{{ item.value }}</p> + </div> + </div> + </div> </el-main> </el-container> - <el-dialog title="6���������" :visible.sync="dialogFormVisible" width="1000px"> - <el-descriptions title="������6���" :column="3" border> + <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" @@ -249,11 +297,21 @@ > 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-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> --> @@ -269,44 +327,81 @@ > ��������������� </div> - <el-table :data="sensorTableData" border> - <el-table-column prop="sensorName" label="������" /> - <el-table-column prop="unit" label="������" /> + <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="���������������" /> + <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="���������������" /> + <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="���������������" /> + <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="���������������" /> + <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="���������������" /> + <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="���������������" /> + <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 + slot="footer" + class="dialog-footer" + > + <el-button @click="dialogFormVisible = false"> + ��� ��� + </el-button> + <el-button + type="primary" + @click="customLevel" + > + ��� ��� + </el-button> </div> </el-dialog> </div> @@ -520,7 +615,7 @@ return json[value] }, }, - data() { + data () { return { dialogFormVisible: false, chosee: 1, @@ -868,10 +963,11 @@ tab6: '50000', }, ], + temMergeDataList: [] } }, watch: { - dataTypeValue(n, o) { + dataTypeValue (n, o) { if (this.dataTypeValue === 'webSocket') { this.dateValue = [] this.historyView = false @@ -882,19 +978,19 @@ this.webSocketView = false } }, - dateValue(n, o) { + dateValue (n, o) { if (n === null) { this.dateValue = [] } }, - viewKey(n, o) { + viewKey (n, o) { // console.log(n) }, deep: true, immediate: true, }, - mounted() { + mounted () { this.$nextTick(() => { this.initStart() }) @@ -903,7 +999,7 @@ // this.getDate() // this.flyData() }, - created() { + created () { this.newTime(this.timeValue) this.newDate() this.getDate() @@ -911,11 +1007,11 @@ // this.getFlyData() }, methods: { - customLevel() { + customLevel () { this.selectDuo() this.dialogFormVisible = false }, - selectDuo() { + selectDuo () { // console.log(2115); if (this.chosee === 1) { this.$message.warning('������������������������������������') @@ -961,21 +1057,21 @@ this.initStart(this.carData) }) }, - chooseDate() { + chooseDate () { // this.$refs.datePick.focus() // ��������������������������������� this.getTimeAreaData(this.datenum) $('.coll').css('margin-top', '350px') }, - chooseDate2() { + chooseDate2 () { // this.$refs.datePick.focus() // ��������������������������������� // this.getTimeAreaData(this.datenum) $('.coll').css('margin-top', '350px') }, - chooseDate1() { + chooseDate1 () { $('.coll').css('margin-top', '10px') // this.$refs.datePick.focus() // ��������������������������������� }, - gengD() { + gengD () { // if (this.zhanK === 1) { // this.$message.warning('���������������������������������������') // return @@ -983,11 +1079,11 @@ this.selecttrue = 2 $('.numss').css({ width: '1050px' }) }, - shou() { + shou () { this.selecttrue = 1 $('.numss').css({ width: '700px' }) }, - parseTime(time, cFormat) { + parseTime (time, cFormat) { if (arguments.length === 0 || !time) { return null } @@ -1027,7 +1123,7 @@ }) return time_str }, - newTime2(timeArr) { + newTime2 (timeArr) { var arr = [] timeArr.map((v) => { var date = new Date(v) @@ -1047,11 +1143,11 @@ return arr }, // ��������������������������������������� - Rad(d) { + Rad (d) { return (d * Math.PI) / 180.0 // ��������������������������������������������������� }, // ��������������������������������������������������������������������������������������� - GetDistance(lat1, lng1, lat2, lng2) { + GetDistance (lat1, lng1, lat2, lng2) { var radLat1 = this.Rad(lat1) var radLat2 = this.Rad(lat2) var a = radLat1 - radLat2 @@ -1072,7 +1168,7 @@ return s }, // ��������������� - newDate() { + newDate () { var aData = new Date() var month = aData.getMonth() < 9 @@ -1082,7 +1178,7 @@ this.sensorDate = aData.getFullYear() + '-' + month + '-' + date }, // ��������������� - newTime(timeArr) { + newTime (timeArr) { let str = '' let str2 = '' this.sensorTime = [] @@ -1098,7 +1194,7 @@ }) }, // ������������ - dateChange(e) { + dateChange (e) { if (e === null) { this.sensorDate = [] } else { @@ -1113,7 +1209,7 @@ } }, // ��������������������������������� - getTimeAreaData(item) { + getTimeAreaData (item) { // this.asideData.uavTimeFly = [] this.loading = true this.$request({ @@ -1140,19 +1236,19 @@ }) }, // ������������������ - handleChange(val) { + handleChange (val) { // console.log(val, 222) }, // ��������������������������������������� XY ������ map.lngLatToGeodeticCoord // ������radio - selectRedio(item) { + selectRedio (item) { this.map.remove(this.textMarkers.markers) this.textMarkers.markers = [] this.map.remove(this.Layler) this.addLayers(item) }, // ��������������� - getFlyData(item, index, mac) { + 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() @@ -1201,7 +1297,7 @@ }) }, // ������������������������������������������ - getDate() { + getDate () { this.$request({ url: '/uav/queryDate', method: 'get', @@ -1230,9 +1326,29 @@ } }) }, - initStart(res) { + initDataParams (res) { + let options = {TemMergeAvg: '������������������', TemMergedHighest: '���������������������', TemMergedLowest: '���������������������', TemNotMergedAvg: '���������������������', TemNotMergedHighest: '������������������������', TemNotMergedLowest: '������������������������'} + let optionKeys = Object.keys(options) + this.temMergeDataList = optionKeys.reduce((acc, key) => { + // ���������������������������data������������ + let regex = new RegExp(key, 'i') + let matchedDataKey = Object.keys(res).find(k => regex.test(k)) + if (matchedDataKey) { + acc.push({ + name: options[key], + value: res[matchedDataKey] + }) + } + return acc + }, []) + + console.log(this.temMergeDataList) + }, + initStart (res) { + console.log('res', res) this.abc += 1 const that = this + if (res) this.initDataParams(res[0]) if (!res) { that.map = new BMapGL.Map('map_container') console.log('BMapGL', BMapGL) @@ -1392,7 +1508,7 @@ // draw(that.sensor, that.viewType, that.carMac) // drawLine()// ������(���������������������) // drawStartAndEnd() // ��������������������� - function draw(sensor, type, carMac) { + function draw (sensor, type, carMac) { var levels = getGrading(sensor, type, carMac) $.each(levels, function (index, value) { var color = value.color @@ -1420,7 +1536,7 @@ } // ��������������������������������� - function drawPolygon(sensor) { + function drawPolygon (sensor) { $.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) @@ -1450,7 +1566,7 @@ } // ��������������������� - function drawStartAndEnd() { + function drawStartAndEnd () { var startIcon = new BMapGL.Icon( require('@/assets/images/start.png'), new BMapGL.Size(48, 48) @@ -1475,7 +1591,7 @@ } // ��������������������� - function drawLine() { + function drawLine () { var data = [] var points = [] $.each(trackPoints, function (index, value) { @@ -1502,7 +1618,7 @@ } // ������������>=size���������points - function getShowPoints(size) { + function getShowPoints (size) { var points = [] points.push(trackPoints[0]) for (var i = 1; i < trackPoints.length; i++) { @@ -1526,7 +1642,7 @@ } // ��������������������������������������� - function getPoint(angle, lng, lat, distance) { + function getPoint (angle, lng, lat, distance) { var EARTH_RADIUS = 6378137 // ������������������m // ��������������������������������������� var ra = distance / EARTH_RADIUS @@ -1551,7 +1667,7 @@ return new BMapGL.Point(lng, lat) } - function getGrading(sensor, type, carMac) { + function getGrading (sensor, type, carMac) { var levels = [] var level0 = {} var level1 = {} @@ -1699,7 +1815,7 @@ levels.push(level0, level1, level2, level3, level4, level5, level6) return levels } - function getColorAndLevel(senosor, data) { + function getColorAndLevel (senosor, data) { var levelData = that.sensorTableData var colorAndLevel = {} var color @@ -1898,7 +2014,7 @@ } // point���������label������ - function setLabelStyle(content, point) { + function setLabelStyle (content, point) { var label = new BMapGL.Label( "<span class='my-maptip'>" + content + '<br /><span>', // ���lable������������ { @@ -1925,7 +2041,7 @@ } // ������������,������������������ - function showNoPoints() { + function showNoPoints () { that.map.centerAndZoom('���������', 17) setTimeout(function () { document.getElementById('cpm').style.display = 'block' @@ -1944,7 +2060,7 @@ }) // var that = this - function clickChange() { + function clickChange () { $('.carTop').on('click', () => { // console.log('���������') that.view.removeAllLayers() @@ -1974,7 +2090,7 @@ clickChange() } }, - changeCode(value) { + changeCode (value) { switch (value) { case 'PM2.5': this.sensorKey = 'a34004' @@ -2271,6 +2387,20 @@ .el-scrollbar__wrap { overflow-x: hidden; } +.dataParameter{ + background-color: rgba(192, 192, 192, 0.4); + position: absolute; + bottom: 0px; + padding: 10px; + color: #000; + font-size: 16px; + cursor: pointer; + display: flex; + .item{ + margin: 0px; + padding: 0px; + } +} </style> <style > .jlpMySelectPopper.el-picker-panel { @@ -2294,4 +2424,5 @@ z-index: 999; background-color: #f40; } + </style> diff --git a/src/views/statement/index.vue b/src/views/statement/index.vue index c89db90..07f5b02 100644 --- a/src/views/statement/index.vue +++ b/src/views/statement/index.vue @@ -31,6 +31,7 @@ <el-table :data="tableData" style="width: 100%" + max-height="600" @row-click="rowClick" > <el-table-column @@ -442,4 +443,7 @@ align-items: center; padding: 10px; } +.pagina{ + margin-top: 10px; +} </style> -- Gitblit v1.8.0