From fc1c4ccc6fb29d8dbd475101047632f83b516a3d Mon Sep 17 00:00:00 2001 From: 徐旺旺 <11530253@qq.com> Date: 星期二, 06 四月 2021 18:21:09 +0800 Subject: [PATCH] 修复bug --- src/components/panel/topicSearch/WaterWasteSearch.vue | 251 ++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 251 insertions(+), 0 deletions(-) diff --git a/src/components/panel/topicSearch/WaterWasteSearch.vue b/src/components/panel/topicSearch/WaterWasteSearch.vue index e69de29..b332edf 100644 --- a/src/components/panel/topicSearch/WaterWasteSearch.vue +++ b/src/components/panel/topicSearch/WaterWasteSearch.vue @@ -0,0 +1,251 @@ +<template> + <div class="query-search" v-if="judgeVisible"> + <div class="search-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-option + v-for="item in solidWasteTypeOptions" + :key="item.value" + :label="item.label" + :value="item.value"> + </el-option> + </el-select> + </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> + <div class="rightButtonSearch"> + <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input> + <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom> + </div> + </el-form> + <el-scrollbar style="height:300px"> + <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> + <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> + <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-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> + <!-- <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> + </div> +</template> + +<script> + +import mapApi from '@/api/mapApi' + +export default { + name: 'SolidWasteSearch', + props: ['title'], + data () { + return { + levelOfRisk: [ + { name: '鍏ㄩ儴', value: '1' }, + { name: '姝e父', value: '2' }, + { name: '瓒呮爣', value: '3' }, + { name: '寮傚父', value: '4' }, + { name: '鍋滀骇', value: '5' } + ], + 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', + form: { + keyword: '杈撳叆鍏抽敭瀛�' + }, + searchDataDisplay: [], + total: 0 + } + }, + methods: { + handlePipelineType (val) { + this.solidWasteTypeOptions.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 + }, + // 鐐瑰嚮鎼滅储瀹炵幇鏁版嵁鐨勬悳绱㈠睍绀� + async handleSearch () { + // console.log(this.form.keyword) + const result = await mapApi.getWasteWater() + console.log(result) + this.searchDataDisplay = result.Result.DataInfo + this.total = result.Result.DataInfo.length + }, + 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) + } + } +} +</script> + +<style lang="less" scoped> + +</style> -- Gitblit v1.8.0