From 33f8b1658371b0bfab97f7834286d326b2e4fadc Mon Sep 17 00:00:00 2001
From: 陈泽平 <chenzeping>
Date: 星期三, 26 五月 2021 10:23:09 +0800
Subject: [PATCH] 搜索分页及返回数功能添加
---
src/components/panel/topicSearch/pipeInformationSearch.vue | 6 +
src/components/panel/topicSearch/GasWasteSearch.vue | 13 ++
src/assets/css/map/map-panel-style.less | 7 +
src/components/panel/topicSearch/sewers-select/SewersHistory.vue | 118 ++++++++++++++---------
src/components/panel/topicSearch/DischargeSearch.vue | 10 ++
src/components/panel/topicSearch/SolidWasteSearch.vue | 27 +++++
src/components/panel/topicSearch/EnvRiskSearch.vue | 6 +
src/components/panel/topicSearch/pipeChangesSearch.vue | 6 +
src/components/panel/topicSearch/WaterWasteSearch.vue | 14 ++
src/components/panel/topicSearch/enterprise-emergency/ResourcesQuery.vue | 32 ++++++
src/components/panel/topicSearch/SewersSearch.vue | 6 +
src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue | 8 +
src/components/panel/topicSearch/SoilGroundWaterSearch.vue | 6 +
13 files changed, 209 insertions(+), 50 deletions(-)
diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less
index 0afa10b..133719f 100644
--- a/src/assets/css/map/map-panel-style.less
+++ b/src/assets/css/map/map-panel-style.less
@@ -828,3 +828,10 @@
padding: 5px;
color: #f2f2f2;
}
+
+/************鎼滅储鏁版嵁鍒嗛〉鍔熻兘鎬绘暟閲忔牱寮忔坊鍔�************/
+.page_total {
+ text-align: right;
+ margin: 5px 0;
+ color: @color;
+}
\ No newline at end of file
diff --git a/src/components/panel/topicSearch/DischargeSearch.vue b/src/components/panel/topicSearch/DischargeSearch.vue
index f29036a..a1e7bc8 100644
--- a/src/components/panel/topicSearch/DischargeSearch.vue
+++ b/src/components/panel/topicSearch/DischargeSearch.vue
@@ -39,6 +39,12 @@
<el-radio v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}<i :style="'background:'+item.color"></i></span></el-radio>
</el-radio-group> -->
<!-- <el-form-item >-->
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
<el-button class="el-icon-search" @click="handleSearch"></el-button>
@@ -128,6 +134,7 @@
gdVisible: true,
list: [],
total: 0,
+ pageSize: 10,
inareaTypeOptions: [],
enterpriseTypeOptions: [],
enterpriseSubunitsTypeOptions: [],
@@ -168,6 +175,9 @@
},
props: ['title'],
methods: {
+ handlePage () {
+
+ },
flyto () {
const pos = [39.90751504898071, 116.38927817344666]
window.map.setView(pos, 15)
diff --git a/src/components/panel/topicSearch/EnvRiskSearch.vue b/src/components/panel/topicSearch/EnvRiskSearch.vue
index 5a3aaac..a452a64 100644
--- a/src/components/panel/topicSearch/EnvRiskSearch.vue
+++ b/src/components/panel/topicSearch/EnvRiskSearch.vue
@@ -37,6 +37,12 @@
<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}}<i :style="'background:'+item.color"></i></span></el-radio>
</el-radio-group>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
</el-input>
diff --git a/src/components/panel/topicSearch/GasWasteSearch.vue b/src/components/panel/topicSearch/GasWasteSearch.vue
index 5dff64a..57b7faa 100644
--- a/src/components/panel/topicSearch/GasWasteSearch.vue
+++ b/src/components/panel/topicSearch/GasWasteSearch.vue
@@ -48,6 +48,12 @@
<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="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
<!-- <el-button slot="append" icon="el-icon-search" size="mini"></el-button>-->
@@ -109,6 +115,8 @@
gdVisible: true,
list: [],
total: 0,
+ // 鍒嗛〉
+ pageSize: 10,
inareaTypeOptions: [],
enterpriseTypeOptions: [],
enterpriseSubunitsTypeOptions: [],
@@ -130,6 +138,11 @@
}
},
methods: {
+ // 椤甸潰鍒囨崲 鍒嗛〉鍔熻兘
+ handlePage (page) {
+ // this.wfsHelper.setPage(page)
+ this.handleSearch()
+ },
// 鍖哄煙绛涢��
areaType (val) {
this.pipelineTypeOptions.forEach((itm) => {
diff --git a/src/components/panel/topicSearch/SewersSearch.vue b/src/components/panel/topicSearch/SewersSearch.vue
index b77c2be..7eedeb7 100644
--- a/src/components/panel/topicSearch/SewersSearch.vue
+++ b/src/components/panel/topicSearch/SewersSearch.vue
@@ -27,6 +27,12 @@
</el-option>
</el-select>
</el-form-item>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
<el-button class="el-icon-search" @click="handleSearch"></el-button>
diff --git a/src/components/panel/topicSearch/SoilGroundWaterSearch.vue b/src/components/panel/topicSearch/SoilGroundWaterSearch.vue
index 6060961..4ab7211 100644
--- a/src/components/panel/topicSearch/SoilGroundWaterSearch.vue
+++ b/src/components/panel/topicSearch/SoilGroundWaterSearch.vue
@@ -38,6 +38,12 @@
<el-radio v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}<i :style="'background:'+item.color"></i></span></el-radio>
</el-radio-group> -->
<!-- <el-form-item >-->
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
<!-- <el-button slot="append" icon="el-icon-search" size="mini"></el-button>-->
diff --git a/src/components/panel/topicSearch/SolidWasteSearch.vue b/src/components/panel/topicSearch/SolidWasteSearch.vue
index 1948cfd..d1b639c 100644
--- a/src/components/panel/topicSearch/SolidWasteSearch.vue
+++ b/src/components/panel/topicSearch/SolidWasteSearch.vue
@@ -30,6 +30,12 @@
<span class="levelOfRisk-type">{{ item.name }}</span>
</el-radio>
</el-radio-group>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
<el-button class="el-icon-search" @click="handleSearch"></el-button>
@@ -47,6 +53,17 @@
</div>
</div>
</el-scrollbar>
+ <el-card class="footer-page" v-if="total > 10">
+ <el-pagination
+ small
+ @current-change="handlePage"
+ :page-size=pageSize
+ layout="prev, pager, next"
+ :total=total
+ class="warnPagination"
+ >
+ </el-pagination>
+ </el-card>
</div>
</template>
@@ -87,10 +104,18 @@
// 鏁版嵁鎼滅储涔嬪悗锛屽瓨鍌ㄦ暟鎹殑
items: [LayerWasteSolid],
subItems: LayerWasteSolid.layers,
- list: []
+ list: [],
+ total: 0,
+ // 鍒嗛〉
+ pageSize: 10
}
},
methods: {
+ // 椤甸潰鍒囨崲 鍒嗛〉鍔熻兘
+ handlePage (page) {
+ // this.wfsHelper.setPage(page)
+ this.handleSearch()
+ },
// select鐨刼ption鐨勬暟鎹�夋嫨
handlePipelineType (val) {
this.list = []
diff --git a/src/components/panel/topicSearch/WaterWasteSearch.vue b/src/components/panel/topicSearch/WaterWasteSearch.vue
index 5e65031..cb3343d 100644
--- a/src/components/panel/topicSearch/WaterWasteSearch.vue
+++ b/src/components/panel/topicSearch/WaterWasteSearch.vue
@@ -53,6 +53,12 @@
class="levelOfRisk-type">{{item.name}}</span></el-radio>
</el-radio-group>
<!-- <el-form-item >-->
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
<!-- <el-button slot="append" icon="el-icon-search" size="mini"></el-button>-->
@@ -114,7 +120,10 @@
return {
gdVisible: true,
list: [],
+ // 鎼滅储鍒扮殑鏁版嵁鏁伴噺
total: 0,
+ // 鍒嗛〉
+ pageSize: 10,
inareaTypeOptions: [],
enterpriseTypeOptions: [],
enterpriseSubunitsTypeOptions: [],
@@ -153,6 +162,11 @@
}
},
methods: {
+ // 椤甸潰鍒囨崲 鍒嗛〉鍔熻兘
+ handlePage (page) {
+ // this.wfsHelper.setPage(page)
+ this.handleSearch()
+ },
// 鍖哄煙绛涢��
areaType (val) {
this.pipelineTypeOptions.forEach((itm) => {
diff --git a/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue b/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue
index f8754f5..8934696 100644
--- a/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue
+++ b/src/components/panel/topicSearch/enterprise-emergency/EventQuery.vue
@@ -32,6 +32,12 @@
</el-radio>
</el-radio-group>
</el-form-item>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
<el-button class="el-icon-search" @click="handleSearch"></el-button>
@@ -102,6 +108,7 @@
return {
reportIncident: false,
list: [],
+ total: 0,
activeNum: -1,
LayerEvent: {},
LayerResources: {},
@@ -189,5 +196,4 @@
</script>
<style lang="less" scoped>
-
</style>
diff --git a/src/components/panel/topicSearch/enterprise-emergency/ResourcesQuery.vue b/src/components/panel/topicSearch/enterprise-emergency/ResourcesQuery.vue
index 5ec3213..7b269dc 100644
--- a/src/components/panel/topicSearch/enterprise-emergency/ResourcesQuery.vue
+++ b/src/components/panel/topicSearch/enterprise-emergency/ResourcesQuery.vue
@@ -34,6 +34,12 @@
</el-option>
</el-select>
</el-form-item>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
<el-button class="el-icon-search" @click="handleSearch"></el-button>
@@ -51,6 +57,17 @@
<p v-else>鍦板潃:<span>{{item.properties.adminzonename}}</span></p>
</div>
</el-scrollbar>
+ <el-card class="footer-page" v-if="total > 10">
+ <el-pagination
+ small
+ @current-change="handlePage"
+ :page-size=pageSize
+ layout="prev, pager, next"
+ :total=total
+ class="warnPagination"
+ >
+ </el-pagination>
+ </el-card>
</div>
</template>
@@ -84,6 +101,10 @@
activeNum: -1,
// 鎼滅储鍒扮殑鏁版嵁杩涜瀛樺偍鐨刲ist
list: [],
+ // 鎼滅储鍒扮殑鏁版嵁鏁伴噺
+ total: 0,
+ // 鍒嗛〉
+ pageSize: 10,
// form琛ㄥ崟缁戝畾鐨勫浘灞傛暟鎹�
items: [LayerEmergencySource, LayerSurroundings],
subItems: LayerEmergencySource.layers || LayerSurroundings.layers,
@@ -97,6 +118,11 @@
this.wfsHelper = new WfsHelper()
},
methods: {
+ // 椤甸潰鍒囨崲 鍒嗛〉鍔熻兘
+ handlePage (page) {
+ // this.wfsHelper.setPage(page)
+ this.handleSearch()
+ },
// 鎼滅储灞曠ず鍥剧墖鏍规嵁杩斿洖鍊煎睍绀�
getImgSrc (type) {
// console.log(type)
@@ -107,6 +133,7 @@
handlePipelineType (val) {
// console.log(val)
this.list = []
+ this.total = 0
for (let i = 0; i < this.items.length; i++) {
const item = this.items[i].name
if (val === item.name) {
@@ -126,10 +153,12 @@
handleDataType (val) {
// console.log(val)
this.list = []
+ this.total = 0
},
// 鐐瑰嚮鎼滅储浜嬩欢
async handleSearch () {
this.list = []
+ this.total = 0
this.wfsHelper.clearFilter()
this.wfsHelper.setTypeName(['sewer:view_emergency'])
this.wfsHelper.setMaxFeatures(100)
@@ -143,9 +172,10 @@
this.wfsHelper.addLike('name', this.form.keyword)
}
const res = await AjaxUtils.GetDataAsynByUrl(this.wfsHelper.getUrl(), {})
- // console.log(res)
+ console.log(res)
if (res instanceof Object && Object.prototype.hasOwnProperty.call(res, 'features')) {
this.list = res.features
+ this.total = res.numberReturned
}
},
// 鏌ヨ瀹氫綅鍔熻兘
diff --git a/src/components/panel/topicSearch/pipeChangesSearch.vue b/src/components/panel/topicSearch/pipeChangesSearch.vue
index e433b29..49a5311 100644
--- a/src/components/panel/topicSearch/pipeChangesSearch.vue
+++ b/src/components/panel/topicSearch/pipeChangesSearch.vue
@@ -21,6 +21,12 @@
</el-option>
</el-select>
</el-form-item>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
<el-button class="el-icon-search" @click="handleSearch"></el-button>
diff --git a/src/components/panel/topicSearch/pipeInformationSearch.vue b/src/components/panel/topicSearch/pipeInformationSearch.vue
index 19b638f..b594913 100644
--- a/src/components/panel/topicSearch/pipeInformationSearch.vue
+++ b/src/components/panel/topicSearch/pipeInformationSearch.vue
@@ -15,6 +15,12 @@
</el-option>
</el-select>
</el-form-item>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
<div class="rightButtonSearch">
<el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
<el-button class="el-icon-search" @click="handleSearch"></el-button>
diff --git a/src/components/panel/topicSearch/sewers-select/SewersHistory.vue b/src/components/panel/topicSearch/sewers-select/SewersHistory.vue
index c4abfe5..9d328f8 100644
--- a/src/components/panel/topicSearch/sewers-select/SewersHistory.vue
+++ b/src/components/panel/topicSearch/sewers-select/SewersHistory.vue
@@ -1,52 +1,69 @@
<template>
- <div class="sewers-search" v-if="judgeVisible">
- <div class="search-panel ">
- <el-form ref="form" :model="form" label-width="90px" class="search-form">
- <el-form-item v-for="(item,index) in Options" :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="(ite,index) in item.options"
- :key="index"
- :label="ite.label"
- :value="ite.value">
- </el-option>
- </el-select>
- </el-form-item>
- <div class="rightButtonSearch">
- <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
- <el-button class="el-icon-search" @click="handleSearch"></el-button>
+ <div class="sewers-search" v-if="judgeVisible">
+ <div class="search-panel ">
+ <el-form ref="form" :model="form" label-width="90px" class="search-form">
+ <el-form-item v-for="(item,index) in Options" :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="(ite,index) in item.options"
+ :key="index"
+ :label="ite.label"
+ :value="ite.value">
+ </el-option>
+ </el-select>
+ </el-form-item>
+ <div class="page_total">
+ <p>鍏辫
+ <span>{{total}}</span>
+ 鏉¤褰�
+ </p>
+ </div>
+ <div class="rightButtonSearch">
+ <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�"></el-input>
+ <el-button class="el-icon-search" @click="handleSearch"></el-button>
+ </div>
+ </el-form>
</div>
- </el-form>
+ <el-scrollbar style="height:377px">
+ <div class="environmental-risk-list hover"><!-- 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 hover"><!-- 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 hover"><!-- 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="footer-page" v-if="total > 10">
+ <el-pagination
+ small
+ @current-change="handlePage"
+ :page-size=pageSize
+ layout="prev, pager, next"
+ :total=total
+ class="warnPagination"
+ >
+ </el-pagination>
+ </el-card>
</div>
- <el-scrollbar style="height:377px">
- <div class="environmental-risk-list hover"><!-- 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 hover"><!-- 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 hover"><!-- 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>
</template>
<script>
@@ -123,10 +140,17 @@
key: 'length'
}]
}
- ]
+ ],
+ list: [],
+ total: 0,
+ // 鍒嗛〉
+ pageSize: 10
}
},
methods: {
+ handlePage () {
+
+ },
handlePipelineType (val) {
console.log(val)
},
--
Gitblit v1.8.0