From c865ad4e70b0769d0a4bfd3ad67aed1198f7fde5 Mon Sep 17 00:00:00 2001 From: chenzeping <ChenZeping02609@163.com> Date: 星期三, 14 四月 2021 10:13:35 +0800 Subject: [PATCH] 问题修复修改 --- src/components/panel/topicSearch/GasWasteSearch.vue | 359 +++++++++++++++++++++++++++-------------------------------- 1 files changed, 162 insertions(+), 197 deletions(-) diff --git a/src/components/panel/topicSearch/GasWasteSearch.vue b/src/components/panel/topicSearch/GasWasteSearch.vue index 245b226..da7907e 100644 --- a/src/components/panel/topicSearch/GasWasteSearch.vue +++ b/src/components/panel/topicSearch/GasWasteSearch.vue @@ -1,179 +1,200 @@ <template> - <div class="solidwaste-search" v-if="judgeVisible"> - <div class="search-title"> - <span>搴熸皵</span> - <!-- <span>{{ title }}</span>--> - </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 v-for="(item,index) in solidWasteTypeOptions" :key="index" :label="item.label+'锛�'" size="mini" - class="search-panel-item"> - <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType" - :popper-class="'select-down'"> + <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 solidWasteTypeOptions" + v-for="item in inareaTypeOptions" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> </el-form-item> - <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"> - <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i> - </el-input> - <div class="search-radio"> - <el-radio v-model="radio" label="1">鍏ㄩ儴</el-radio> - <el-radio v-model="radio" label="2">姝e父</el-radio> - <el-radio v-model="radio" label="3">瓒呮爣</el-radio> - <el-radio v-model="radio" label="4">寮傚父</el-radio> - <el-radio v-model="radio" label="5">鍋滀骇</el-radio> + <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-card class="box-card" v-for="(item,index) in searchDataDisplay" :key="index"> - <div v-if="total > 3"> - {{ item.CompanyName }} - </div> - </el-card> -<!-- <el-pagination--> -<!-- small--> -<!-- layout="prev, pager, next"--> -<!-- :total=total--> -<!-- :current-page=1--> -<!-- class="warnPagination"--> -<!-- >--> -<!-- </el-pagination>--> - </div> - <!-- <el-scrollbar style="height:100%">--> - <!-- <el-card class="footer-page">--> - <!-- <ul>--> - <!-- {{ searchDataDisplay }}--> - <!-- <li v-for="(item,index) in searchDataDisplay" :key="index">--> - <!-- {{ item.CompanyName }}--> - <!-- </li>--> - <!-- </ul>--> - <!-- </el-card>--> - <!-- <el-pagination--> - <!-- small--> - <!-- @current-change="handlePage"--> - <!-- :page-size=pageSize--> - <!-- layout="prev, pager, next"--> - <!-- :total=total--> - <!-- :current-page=current--> - <!-- class="warnPagination"--> - <!-- >--> - <!-- </el-pagination>--> - <!-- </el-card>--> - <!-- </el-scrollbar>--> </div> + <el-scrollbar style="height:264px"> + <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"> + <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 WfsHelper from '@components/helpers/WfsHelper' +// import AjaxUtils from '@utils/AjaxUtils' + import mapApi from '@/api/mapApi' +// import WfsHelper from '@components/helpers/WfsHelper' export default { - name: 'SolidWasteSearch', - props: ['title'], + name: 'GasWasteSearch', data () { return { - judgeVisible: true, - solidWasteTypeOptions: [{ - value: '1', - label: '鍖哄煙', - options: [{ - value: '1', - layerName: '鍥哄簾', - key: 'pipename', - label: '鍏ㄩ儴鍥哄簾' - }], - labelList: [{ - label: '杈撻�佷粙璐�', - key: 'mediumtype' - }, { - label: '闀垮害(m)', - key: 'length' - }] - }, { - value: '2', - label: '浼佷笟鍚嶇О', - options: [{ - value: '1', - layerName: '鍥哄簾', - key: 'pipename', - label: '鍏ㄩ儴鍥哄簾' - }], - labelList: [{ - label: '杈撻�佷粙璐�', - key: 'mediumtype' - }, { - label: '闀垮害(m)', - key: 'length' - }] - }, { - value: '3', - label: '浜岀骇鍗曚綅', - options: [{ - value: '1', - layerName: '鍥哄簾', - key: 'pipename', - label: '鍏ㄩ儴鍥哄簾' - }], - labelList: [{ - label: '杈撻�佷粙璐�', - key: 'mediumtype' - }, { - label: '闀垮害(m)', - key: 'length' - }] - }, { - value: '4', - label: '浼佷笟鍚嶇О', - options: [{ - value: '1', - layerName: '鍥哄簾', - key: 'pipename', - label: '鍏ㄩ儴鍥哄簾' - }], - labelList: [{ - label: '杈撻�佷粙璐�', - key: 'mediumtype' - }, { - label: '闀垮害(m)', - key: 'length' - }] - }], - radio: '1', + gdVisible: true, + list: [], + // labelList: PipelineTypeOptions[0].labelList, + total: 0, + inareaTypeOptions: [], + enterpriseTypeOptions: [], + enterpriseSubunitsTypeOptions: [], form: { - keyword: '杈撳叆鍏抽敭瀛�' + areaVal: '', + enterpriseVal: '', + enterpriseSubunitsVal: '', + type: '' }, - searchDataDisplay: [], - total: 0 + // 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: { - handlePipelineType (val) { - this.solidWasteTypeOptions.forEach((itm) => { + // 鍖哄煙绛涢�� + areaType (val) { + this.pipelineTypeOptions.forEach((itm) => { if (val === itm.value) { - this.dataTypeOptions = itm.options - this.form.pipelineType = itm.label - this.form.labelList = itm.labelList + } }) - this.form.dataType = this.dataTypeOptions[0].label - this.form.key = this.dataTypeOptions[0].key }, - // 鐐瑰嚮鎼滅储瀹炵幇鏁版嵁鐨勬悳绱㈠睍绀� + // 浼佷笟绛涢�� + enterpriseType (val) { + this.dataTypeOptions.forEach((itm) => { + if (val === itm.value) { + + } + }) + }, + // 浜岀骇鍗曚綅绛涢�� + enterpriseSubunitsType (val) { + + }, + // 涓夌骇鍗曚綅绛涢�� async handleSearch () { - // console.log(this.form.keyword) - const result = await mapApi.getWasteGas() - console.log(result) - this.searchDataDisplay = result.Result.DataInfo - this.total = result.Result.DataInfo.length + const param = { + 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(), {}) + const res = await mapApi.getWasteGas() + console.log(res) + if (res.data instanceof Object && Object.prototype.hasOwnProperty.call(res.data, 'features')) { + this.list = res.data.features + } }, handleLocation (val) { - // console.log(val) + console.log(val) const bound = this.L.geoJSON([val], {}).getBounds() var layer = window.serviceLayerHelper.getByLayerId(val.id) layer && layer.openPopup() @@ -185,60 +206,4 @@ <style lang="less" scoped> -.solidwaste-search { - position: relative; - overflow: hidden; - background-color: #365e60; - - .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; - margin-top: 13px; - } - } - - /deep/ input:focus { - border-color: @color; - } - } - - .search-btn { - - } - - /deep/.search-radio { - margin: 6px 0; - display: flex; - flex-wrap: wrap; - //justify-content: flex-end; - //align-content: space-between; - .el-radio { - color: #ffffff!important; - line-height: 2; - .el-radio__label{ - padding-left: 0px; - } - } - } - - .location-btn:hover, .el-input__icon:hover { - color: @color; - cursor: pointer; - } - - .box-card { - margin: 15px auto; - } -} </style> -- Gitblit v1.8.0