商户管理：修复下拉列表问题；重构代码

pages/merchant/index.vue

@@ -5,19 +5,19 @@
 				<uni-row class="demo-uni-row" :width="nvueWidth">
 					<uni-col>
 						<view class="demo-uni-col">
-							<uni-easyinput size="mini" class="uni-input" prefixIcon="search" v-model="searchVal" placeholder="请输入商户名称"></uni-easyinput>
+							<uni-easyinput size="mini" class="uni-input" prefixIcon="search" v-model="formData.name" placeholder="请输入商户名称"></uni-easyinput>
 						</view>						
 					</uni-col>
 				</uni-row>
 				<uni-row class="demo-uni-row" :width="nvueWidth">
 					<uni-col :span="8">
 						<view class="demo-uni-col">
-							<uni-data-select class="search-data-select" v-model="typeValue" :localdata="typeRange" @change="changeType">类型</uni-data-select>
+							<uni-data-select class="search-data-select" v-model="formData.type" :localdata="typeOptions" @change="changeType">类型</uni-data-select>
 						</view>
 					</uni-col>
 					<uni-col :span="8">
 						<view class="demo-uni-col">						
-							<uni-data-select class="search-data-select" v-model="communityValue" :localdata="communityRange" @change="changeCommunity">社区</uni-data-select>
+							<uni-data-select class="search-data-select" v-model="formData.community" :localdata="communityOptions" @change="changeCommunity">社区</uni-data-select>
 						</view>
 					</uni-col>
 					<uni-col :span="4">
@@ -35,7 +35,7 @@
 		</view>
 		<uni-list border class="list">
 			<uni-list-item
-				v-for="(item, index) in dataList"
+				v-for="(item, index) in resultList"
 				:key="index"
 				:ellipsis="2"
 				:title=getTitle(item)
@@ -57,100 +57,97 @@
 	export default {
 		data() {
 			return {
-				searchVal: '',
-				// more = 加载前， loading = 加载中， noMore = 没有更多
-				more: 'more',
-				dataList: [],
-				typeValue: null,
-				typeRange: [],
-				communityValue: null,
-				communityRange: [],
-				queryForm: {
-					pageNum: 1,
-					pageSize: 12,
+				typeOptions: [],
+				communityOptions: [],
+				formData: {
+					pageNum: 0,
+					pageSize: 20,
 					type: null,
 					community: null,
 					name: null,
-				}
+				},				
+				resultList: [],
+				more: 'more'			
 			}
 		},
 		onShow: function() {
 			// this.init();
 		},
-		async mounted() {			
-			this.getMerchantList();
+		// 页面生命周期中onReachBottom（页面滚动到底部的事件）
+		onReachBottom() {
+			if(this.more != 'noMore') {
+				this.more = 'more';
+				this.getMerchantList();
+			}
+		},		
+		async mounted() {
 			await this.getDicts();
+			await this.getMerchantList();			
 		},
 		methods: {
-			getTitle(merchant){
-				return merchant.name;
-			},
 			async getDicts() {
 				const resp_type = await dictApi.getDict('community_merchant_type');
 				if (resp_type.code == 200) 
-					this.typeRange = resp_type.data.map(l => ({ ...l, value: l.dictValue, text: l.dictLabel }));
+					this.typeOptions = resp_type.data.map(l => ({ ...l, value: l.dictValue, text: l.dictLabel }));
 
 				const resp_community = await dictApi.getDict('community_merchant_belongs');
 				if (resp_community.code == 200) 
-					this.communityRange = resp_community.data.map(l => ({ ...l, value: l.dictValue, text: l.dictLabel }));
-			},
-			// 列表点击函数
-			listItemBtn(e) {
-				uni.navigateTo({ url: `/pages/merchant/info?id=${e.merchantId}`})
+					this.communityOptions = resp_community.data.map(l => ({ ...l, value: l.dictValue, text: l.dictLabel }));
 			},
 			// 搜索函数
 			async getMerchantList() {
-				this.reset();
 				this.more = 'loading';
 
 				const queryParams = {};
-				for (const key in this.queryForm) {
-					if (this.queryForm[key] !== null 
-						&& this.queryForm[key] !== undefined
-						&& this.queryForm[key] !== '') {
-						queryParams[key] = this.queryForm[key];
-					}
-				}
-
+				this.getFormParams(queryParams);
 				const resp = await merchantApi.getMerchantList({...queryParams});
-				this.dataList.push(...resp.data.map(e => {return {...e}}))
-				// 根据总数 算页数  如果当前页 = 总页数就是没有数据  否则就是上拉加载
-				this.more = this.page >= Math.ceil(resp.total / this.size) ? 'noMore' : 'more';
+				this.resultList.push(...resp.rows);
+
+				this.updateMoreStatus(resp.total);
 			},
 			// 搜索函数
 			async handleSearch() {
+				this.resultList = [];				
+				this.formData.pageNum = 0;	
+				
 				await this.getMerchantList();
 			},
 			async handleReset() {
-				this.typeValue = null;
-				this.communityValue = null;
-				this.searchVal = null;
+				this.resultList = [];
 				
+				this.formData.pageNum = 0;				
+				this.formData.name = null;				
+				this.formData.type = null;
+				this.formData.community = null;
+
 				await this.getMerchantList();
 			},
-			async changeType(e) {				
-				// const resp = await shopApi.listBuildingByDistrict(e);
-				// console.log(resp);
-				console.log("e:", e);
+			async changeType(e) {
+				this.formData.type = e;
 		    },
 			async changeCommunity(e) {
-				console.log("e:", e);
+				this.formData.community = e;
 		    },
-			reset() {
-				this.dataList.length = 0;
-
-				this.queryForm.pageNum = 1;
-				this.queryForm.pageSize= 12;
-				this.queryForm.type = this.typeValue;
-				this.queryForm.community= this.communityValue;
-				this.queryForm.name = this.searchVal;
-			}
-		},
-		// 页面生命周期中onReachBottom（页面滚动到底部的事件）
-		onReachBottom() {
-			if(this.more != 'noMore') {
-				this.more = 'more';
-				this.getMerchantList();
+			// 列表点击函数
+			listItemBtn(e) {
+				uni.navigateTo({ url: `/pages/merchant/info?id=${e.merchantId}`})
+			},			
+			getTitle(merchant){
+				return merchant.name;
+			},
+			getFormParams(queryParams){
+				this.formData.pageNum += 1;
+				for (const key in this.formData) {
+					if (this.formData[key] !== null 
+						&& this.formData[key] !== undefined
+						&& this.formData[key] !== '') {
+						queryParams[key] = this.formData[key];
+					}
+				}
+			},
+			updateMoreStatus(total){
+				// 根据总数 算页数  如果当前页 = 总页数就是没有数据  否则就是上拉加载
+				this.more = this.formData.pageNum >= Math.ceil(total / this.formData.pageSize) ? 'noMore' : 'more';
 			}
 		}
 	}