From e5f105b1acb3c63df8aac97ce1c67ad070c0de2d Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期四, 15 四月 2021 11:03:21 +0800 Subject: [PATCH] 废气图标 --- src/components/panel/topicSearch/GasWasteSearch.vue | 158 +++++++++++++++++++++++++++++----------------------- 1 files changed, 89 insertions(+), 69 deletions(-) diff --git a/src/components/panel/topicSearch/GasWasteSearch.vue b/src/components/panel/topicSearch/GasWasteSearch.vue index 90166ea..039db27 100644 --- a/src/components/panel/topicSearch/GasWasteSearch.vue +++ b/src/components/panel/topicSearch/GasWasteSearch.vue @@ -1,6 +1,6 @@ <template> - <div class="query-search" v-if="gdVisible"> - <div class="search-title">{{title}}</div> + <div class="sewers-search" v-if="gdVisible"> + <div class="panel-title">{{title}}</div> <div class="search-panel "> <el-form ref="form" :model="form" label-width="90px" class="search-form"> <el-form-item label="鍖哄煙锛�" size="mini" class="search-panel-item"> @@ -13,7 +13,7 @@ </el-option> </el-select> </el-form-item> - <el-form-item label="浼佷笟鍚嶇О" size="mini"> + <el-form-item label="浼佷笟鍚嶇О锛�" size="mini"> <el-select style="width: 100%" v-model="form.enterpriseVal" @change="enterpriseType" :popper-class="'select-down'"> <el-option v-for="item in enterpriseTypeOptions" @@ -23,7 +23,7 @@ </el-option> </el-select> </el-form-item> - <el-form-item label="浜岀骇鍗曚綅" size="mini"> + <el-form-item label="浜岀骇鍗曚綅锛�" size="mini"> <el-select style="width: 100%" v-model="form.enterpriseSubunitsVal" @change="enterpriseSubunitsType" :popper-class="'select-down'"> <el-option v-for="item in enterpriseSubunitsTypeOptions" @@ -33,7 +33,7 @@ </el-option> </el-select> </el-form-item> - <el-form-item label="涓夌骇鍗曚綅" size="mini"> + <el-form-item label="涓夌骇鍗曚綅锛�" size="mini"> <el-select style="width: 100%" v-model="form.enterpriseSubunitsVal" @change="enterpriseSubunitsType" :popper-class="'select-down'"> <el-option v-for="item in enterpriseSubunitsTypeOptions" @@ -54,7 +54,7 @@ <!-- <i slot="prefix" class="el-input__icon el-icon-search"></i>--> <!-- <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i> --> </el-input> - <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom> + <el-button class="el-icon-search" @click="handleSearch"></el-button> </div> <!-- </el-form-item>--> <!-- <el-form-item>--> @@ -63,55 +63,16 @@ <!-- </el-form-item>--> </el-form> </div> - <el-scrollbar style="height:300px"> - <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> - <i class="state"></i> + <el-scrollbar style="height:264px"> + <div class="environmental-risk-list" v-for="(item,index) in list" :key="index" @click="handleLocation(item)"><!-- --> + <img src="../../../../public/assets/images/map/exhaust/fq_green2.png" alt="" class="state"/> <div> <h3>###鐐煎寲閮�</h3> <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p> <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p> </div> </div> - <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> - <i class="state"></i> - <div> - <h3>###鐐煎寲閮�</h3> - <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p> - <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p> - </div> - </div> - <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> - <i class="state"></i> - <div> - <h3>###鐐煎寲閮�</h3> - <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p> - <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p> - </div> - </div> - <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> - <i class="state"></i> - <div> - <h3>###鐐煎寲閮�</h3> - <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p> - <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p> - </div> - </div> - <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> - <i class="state"></i> - <div> - <h3>###鐐煎寲閮�</h3> - <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p> - <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p> - </div> - </div> - <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" --> - <i class="state"></i> - <div> - <h3>###鐐煎寲閮�</h3> - <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p> - <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p> - </div> - </div> + </el-scrollbar> <!-- <span class="location-btn" @click="handleLocation(item)">588</span> --> <el-card class="footer-page" v-if="total > 10"> @@ -136,17 +97,15 @@ </template> <script> -import { PipelineTypeOptions } from '@/conf/layers/LayerSewers' - -import WfsHelper from '@components/helpers/WfsHelper' -import AjaxUtils from '@utils/AjaxUtils' +import mapApi from '@/api/mapApi' +import publicBounced from '@/components/BaseNav/PublicBounced/PublicBounced'// import WfsHelper from '@components/helpers/WfsHelper' +import ImagGreen from '../../../../public/assets/images/map/exhaust/fq_green2.png' export default { - name: 'SewersSearch', + name: 'GasWasteSearch', data () { return { gdVisible: true, list: [], - labelList: PipelineTypeOptions[0].labelList, total: 0, inareaTypeOptions: [], enterpriseTypeOptions: [], @@ -198,22 +157,83 @@ pipelineType: this.form.pipelineType, dataType: this.form.dataType } - console.log(param) - var wfsHelper = new WfsHelper() - wfsHelper.addTypeName(this.form.query.layerName) - wfsHelper.addLike(this.form.query.key, this.form.keyword) - // const _this = this - const res = await AjaxUtils.GetDataAsynByUrl(wfsHelper.getUrl(), {}) - if (res.data instanceof Object && Object.prototype.hasOwnProperty.call(res.data, 'features')) { - this.list = res.data.features - } + // console.log(param) + const res = await mapApi.getWasteGas(param) + // console.log(res) + this.list = res.Result.DataInfo }, - handleLocation (val) { + // 寮圭獥灞曠ず + async handleLocation (val) { console.log(val) - const bound = this.L.geoJSON([val], {}).getBounds() - var layer = window.serviceLayerHelper.getByLayerId(val.id) - layer && layer.openPopup() - this.$store.state.map.map.flyToBounds(bound) + const pos = [val.Latitude, val.Longitude] + window.map.flyTo(pos, 13) + const positionX = val.Latitude + const positionY = val.Longitude + + // 瀹氫箟绫诲瀷 鐢ㄦ潵鍖哄垎鏁版嵁鐨勪笉鍚� 1.鎺ュ彛鎺ュ彛鏁版嵁鏉ヨ繘琛屾暟鎹殑鍒ゆ柇 2.鏍规嵁鏁版嵁绫诲瀷鐨勪笉鍚岋紝杩涜涓嶅悓绫诲瀷鐨勫浘鐗囨樉绀� + const ContrLevel = val.ContrLevel + var iconUrl = this.differentTypes(ContrLevel) + + const marker = this.L.marker([positionX, positionY], { + // totransferData: this.searchDataDisplay[i], + icon: this.L.icon({ + iconUrl: iconUrl, + iconSize: [30, 30], + iconAnchor: [15, 15] + }) + }) + this.layer.addLayer(marker) + const t1 = setTimeout(async () => { + const dataValue = { + StoragePlaceId: val.StoragePlaceId + } + // 寮规鏍囬 + const title = val.Name + console.log(title) + // 鍩烘湰淇℃伅 tabs + const result = await mapApi.getWasteGas(dataValue) + const GasOnlinedata = { + onLineMonEmissPointId: '23', + monItemId: '28,31', + beginTime: '2020-04-06 15:13:20', + endTime: '2020-04-07 15:13:20', + dataType: '1' + } + const GasManualData = { + companyId: '3900100145', + labMonPointId: '219', + beginTime: '2020-04-06 15:13:20', + endTime: ' 2020-04-07 15:13:20' + } + const ManualData = await mapApi.getWasteGasManualData(GasManualData) + const Mondata = await mapApi.getWasteGasMonData(GasOnlinedata) + // 缁戝畾寮规瀹炰緥 + this.instance && this.instance.closePopup() + const PublicBounced = window.Vue.extend(publicBounced) + this.instance = new PublicBounced().$mount() + document.body.appendChild(this.instance.$el) + // document.body.removeChild(instance.$el) + // 閫氳繃鏂规硶 鍚戠粦瀹氬脊妗嗕紶閫掓暟鎹� + this.instance.setGasData(title, result.Result.DataInfo, Mondata.Result.DataInfo, ManualData.Result.DataInfo, 'feiqi') + // this.setPanTo(pos, 250) + }, 1000) + console.log(t1) + }, + // 涓嶅悓绫诲瀷鍥剧墖鍔犺浇 + differentTypes (ContrLevel) { + var effectOfChange + /* + if (ContrLevel === 1) { + effectOfChange = ImgBlue + } else if (ContrLevel === 2) { + */ + effectOfChange = ImagGreen + // } else if (ContrLevel === 3) { + // effectOfChange = ImagBright + // } else { + // effectOfChange = ImgGray + // } + return effectOfChange } } } -- Gitblit v1.8.0