From be771111fb2a9770a9fbf13c5d7e976bf8688b6d Mon Sep 17 00:00:00 2001 From: 陈泽平 <chenzeping> Date: 星期二, 18 五月 2021 11:08:38 +0800 Subject: [PATCH] 问题修改 --- src/components/panel/topicSearch/GasWasteSearch.vue | 200 +++++++++++-------------------------------------- 1 files changed, 45 insertions(+), 155 deletions(-) diff --git a/src/components/panel/topicSearch/GasWasteSearch.vue b/src/components/panel/topicSearch/GasWasteSearch.vue index befb262..73fc8d6 100644 --- a/src/components/panel/topicSearch/GasWasteSearch.vue +++ b/src/components/panel/topicSearch/GasWasteSearch.vue @@ -1,8 +1,6 @@ <template> <div class="sewers-search" v-if="gdVisible"> - <div class="search-title"> - 搴熸皵 - </div> + <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"> @@ -15,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" @@ -25,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" @@ -35,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" @@ -50,12 +48,14 @@ <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 >--> - <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> + <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="鏌ヨ">--> @@ -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> + <h3>{{ item.Name }}</h3> + <p>鎵�灞為儴闂細<span>{{ item.porltName }}</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,17 @@ </template> <script> -import { PipelineTypeOptions } from '@/conf/layers/LayerSewers' +import mapApi from '@/api/mapApi' +import WasteWaterIndex from '../../BaseNav/WasteWater/WasteWaterIndex' +import { pulseEffect, setPanTo } from '../../../utils/utils' -import WfsHelper from '@components/helpers/WfsHelper' -import AjaxUtils from '@utils/AjaxUtils' export default { - name: 'SewersSearch', + name: 'GasWasteSearch', + props: ['title'], data () { return { gdVisible: true, list: [], - labelList: PipelineTypeOptions[0].labelList, total: 0, inareaTypeOptions: [], enterpriseTypeOptions: [], @@ -159,18 +120,15 @@ }, // pageSize: 10, // current: 1, - isWaybillHover: true, - isRouteHover: false, levelOfRisk: [ { name: '鍏ㄩ儴', value: '1' }, { name: '姝e父', value: '2' }, { name: '瓒呮爣', value: '3' }, { name: '寮傚父', value: '4' }, - { name: '鍋滀骇', value: '4' } + { name: '鍋滀骇', value: '5' } ] } }, - props: ['title'], methods: { // 鍖哄煙绛涢�� areaType (val) { @@ -198,102 +156,34 @@ 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 + console.log(this.list) }, - 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.setView(pos, 15) + window.$layer.open({ + content: { + comp: WasteWaterIndex, // 缁勪欢 + parent: this, // 鐖剁粍浠� + data: { // 浼犻�掔殑鍙傛暟 + storagePlaceId: val + } + }, + title: '澶╂触鐭冲寲 ' + val.Name + }) + pulseEffect([val.Latitude, val.Longitude]) + setPanTo(pos, 250) } } } </script> <style lang="less" scoped> -.levelOfRisk-type{ - display: inline-block; - position: relative; - padding-right: 5px; - color:#f5f5f5; - i{ - display: block; - width: 15px; - height: 10px; - position: absolute; - top:50%; - right: -15px; - margin-top: -5px; - } -} -.el-radio.is-checked .levelOfRisk-type{color:#409EFF} -.levelOfRisk{padding-left:20px} -.levelOfRisk .el-radio{padding-bottom:6px} -.environmental-risk-list{ - border:1px solid @color; - margin-right: 10px; - margin-bottom: 15px; - position: relative; - padding-left:50px; - padding-top:3px; - padding-bottom:3px; - color: #f5f5f5; - .state{ - width: 30px; - height: 30px; - position: absolute; - top:50%; - left:10px; - margin-top: -15px; - border-radius: 50%; - box-shadow: 0 0 3px #000; - background: #0B3B6D; - } -} -/******************浠ヤ笅鍏叡閮ㄥ垎**********/ -.sewers-search{ - position: relative; - overflow: hidden; - .search-panel{ - background-color: transparent; - border: 1px solid @background-color-split; - padding: 10px; - /deep/ input { - border-radius: 0; - background-color: @background-color-split ; - border: solid 1px @color ; - color: @color-gray; - font-size: 0.01rem; - .el-select .el-input.is-focus .el-input__inner{ - border-color: @color; - } - } - /deep/ input:focus{ - border-color: @color; - } - } - .search-btn{ - - } - //location-btn{ - // - //} - .location-btn:hover,.el-input__icon:hover{ - color: @color; - cursor: pointer; - } - .el-radio { - margin-right: 8px!important; - } -} </style> -- Gitblit v1.8.0