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 | 244 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 244 insertions(+), 0 deletions(-) diff --git a/src/components/panel/topicSearch/GasWasteSearch.vue b/src/components/panel/topicSearch/GasWasteSearch.vue index e69de29..039db27 100644 --- a/src/components/panel/topicSearch/GasWasteSearch.vue +++ b/src/components/panel/topicSearch/GasWasteSearch.vue @@ -0,0 +1,244 @@ +<template> + <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"> + <el-select style="width: 100%" v-model="form.areaVal" @change="areaType" :popper-class="'select-down'"> + <el-option + v-for="item in inareaTypeOptions" + :key="item.value" + :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <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" + :key="item.value" + :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <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" + :key="item.value" + :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </el-form-item> + <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" + :key="item.value" + :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </el-form-item> +<!-- <el-form-item label="椋庨櫓绾у埆" size="mini"></el-form-item>--> + <el-radio-group v-model="form.type" class="levelOfRisk"> + <el-radio v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}</span></el-radio> + </el-radio-group> + <!-- <el-form-item >--> + <div class="rightButtonSearch"> + <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"> + <!-- <el-button slot="append" icon="el-icon-search" size="mini"></el-button>--> + <!-- <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-button class="el-icon-search" @click="handleSearch"></el-button> + </div> + <!-- </el-form-item>--> + <!-- <el-form-item>--> + <!-- <input type="button" class="btn-ok" @click="handleSearch" value="鏌ヨ">--> + <!-- <input type="button" class="btn-reset" @click="handleSearch" value="閲嶇疆">--> + <!-- </el-form-item>--> + </el-form> + </div> + <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> + + </el-scrollbar> + <!-- <span class="location-btn" @click="handleLocation(item)">588</span> --> + <el-card class="footer-page" v-if="total > 10"> + <el-pagination + small + @current-change="handlePage" + :page-size=pageSize + layout="prev, pager, next" + :total=total + :current-page=current + class="warnPagination" + > + </el-pagination> + </el-card> + </div> + <!-- <div class="monitor2" v-if="hbVisible">--> + <!-- <env-protect-search></env-protect-search>--> + <!-- </div>--> + <!-- <div class="monitor2" v-if="pkVisible">--> + <!-- <discharge-search></discharge-search>--> + <!-- </div>--> +</template> + +<script> +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: 'GasWasteSearch', + data () { + return { + gdVisible: true, + list: [], + total: 0, + inareaTypeOptions: [], + enterpriseTypeOptions: [], + enterpriseSubunitsTypeOptions: [], + form: { + areaVal: '', + enterpriseVal: '', + enterpriseSubunitsVal: '', + type: '' + }, + // pageSize: 10, + // current: 1, + isWaybillHover: true, + isRouteHover: false, + levelOfRisk: [ + { name: '鍏ㄩ儴', value: '1' }, + { name: '姝e父', value: '2' }, + { name: '瓒呮爣', value: '3' }, + { name: '寮傚父', value: '4' }, + { name: '鍋滀骇', value: '5' } + ] + } + }, + props: ['title'], + methods: { + // 鍖哄煙绛涢�� + areaType (val) { + this.pipelineTypeOptions.forEach((itm) => { + if (val === itm.value) { + + } + }) + }, + // 浼佷笟绛涢�� + enterpriseType (val) { + this.dataTypeOptions.forEach((itm) => { + if (val === itm.value) { + + } + }) + }, + // 浜岀骇鍗曚綅绛涢�� + enterpriseSubunitsType (val) { + + }, + // 涓夌骇鍗曚綅绛涢�� + async handleSearch () { + const param = { + pipelineType: this.form.pipelineType, + dataType: this.form.dataType + } + // console.log(param) + const res = await mapApi.getWasteGas(param) + // console.log(res) + this.list = res.Result.DataInfo + }, + // 寮圭獥灞曠ず + async handleLocation (val) { + console.log(val) + 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 + } + } +} +</script> + +<style lang="less" scoped> + +</style> -- Gitblit v1.8.0