From cb4ce544a38a4720b88946949b3258705d5ae2da Mon Sep 17 00:00:00 2001 From: chenzeping <ChenZeping02609@163.com> Date: 星期五, 02 四月 2021 17:07:37 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/panel/topicSearch/SolidWasteSearch.vue | 218 ++++++++++++++++++++++++++++++------------------------ 1 files changed, 120 insertions(+), 98 deletions(-) diff --git a/src/components/panel/topicSearch/SolidWasteSearch.vue b/src/components/panel/topicSearch/SolidWasteSearch.vue index c672fb9..b283cb1 100644 --- a/src/components/panel/topicSearch/SolidWasteSearch.vue +++ b/src/components/panel/topicSearch/SolidWasteSearch.vue @@ -18,52 +18,83 @@ </el-option> </el-select> </el-form-item> - <div class="search-radio"> + <!-- <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> + </div> --> + <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-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> </el-form> - <div> - <el-card class="box-card" v-for="(item,index) in searchDataDisplay" :key="index"> - <div v-if="total > 3"> - {{ item.CompanyName }} + <el-scrollbar style="height:500px"> + <div class="environmental-risk-list"> + <i class="state"></i> + <div> + <h3>###鐐煎寲閮�</h3> + <p>鎵�灞為儴闂細<span>鐐煎寲閮�</span></p> + <p>椋庨櫓绾у埆锛�<span>涓夌骇</span></p> </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>--> + </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> + <!-- <el-card class="box-card"--> + <!-- v-for="(item,index) in searchDataDisplay"--> + <!-- :key="index">--> + <!-- <div>--> + <!-- {{ item.CompanyName }}--> + <!-- </div>--> <!-- </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:100%">--> + <!-- </el-scrollbar>--> </div> </template> @@ -76,6 +107,11 @@ props: ['title'], data () { return { + levelOfRisk: [ + { name: '鍏ㄩ儴', value: '1' }, + { name: '姝e父', value: '2' }, + { name: '棰勮', value: '3' } + ], judgeVisible: true, solidWasteTypeOptions: [{ value: '1', @@ -144,89 +180,75 @@ }], radio: '1', form: { - keyword: '鍥哄簾闈㈡澘鏁版嵁鏌ヨ' + keyword: '鍥哄簾闈㈡澘鏁版嵁鏌ヨ', + // 鏁版嵁鐨勪紶閫� + transferData: '' }, - searchDataDisplay: [], - total: 0 + searchDataDisplay: [] } }, 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 + // console.log(val) + this.solidWasteTypeOptions.forEach(item => { + // console.log(item.value) + if (val === item.value) { + // console.log('鏁版嵁閫夋嫨鐩稿悓') + // 鎺ユ敹鏁版嵁 鐢ㄤ簬涔嬪悗鎺ュ彛鏁版嵁鐨勮皟鐢� + // this.form.transferData = item.value + this.handleSearch(item.value) } }) - this.form.dataType = this.dataTypeOptions[0].label - this.form.key = this.dataTypeOptions[0].key }, // 鐐瑰嚮鎼滅储瀹炵幇鏁版嵁鐨勬悳绱㈠睍绀� - async handleSearch () { + async handleSearch (data) { // console.log(this.form.keyword) - const result = await mapApi.getSolidWasteSurveyDetail() - console.log(result) + const result = await mapApi.getSolidWasteSurveyDetail(data) + // 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> +.el-radio.is-checked .levelOfRisk-type { + color: #409EFF +} -.solidwaste-search { +.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; - overflow: hidden; + padding-left: 50px; + padding-top: 3px; + padding-bottom: 3px; + color: #f5f5f5; - .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 { - - } - - .search-radio { - margin: 15px auto; - display: flex; - align-items: center; - justify-content: space-around; - } - - .location-btn:hover, .el-input__icon:hover { - color: @color; - cursor: pointer; - } - - .box-card { - margin: 15px auto; + .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; } } + +.el-input { + margin: 15px auto; +} + </style> -- Gitblit v1.8.0