对接后台接口

common/js/globalData.js

@@ -1,5 +1,6 @@
 export default {
 	deptId: 101,
+	from: 'customer',
 	initPageNum: 1,
 	initPageSize: 5
 }

common/js/request.js

@@ -6,9 +6,17 @@ export default {
 		uni.addInterceptor('request', {
 			invoke(args) {
 				// request 触发前拼接 url 
-				// args.url = 'https://www.opsoul.com' + args.url;
+				args.url = 'https://www.opsoul.com' + args.url;
 				// args.url = 'http://192.168.2.3:80' + args.url;
-				args.url = 'http://127.0.0.1:80' + args.url;
+				// args.url = 'http://127.0.0.1:80' + args.url;
+				if (args.data) {
+					args.data.deptId = globalData.deptId;
+					args.data.from = globalData.from;
+				}
+				if (args.header) {
+					args.header.deptId = globalData.deptId;
+					args.header.from = globalData.from;
+				}
 				// console.log("停止触发");
 				// return false;
 			},
@@ -62,13 +70,7 @@ export default {
 		})
 	},
 	async login() {
-		// 从缓存中获取登录信息
+		let userInfo = await wx.getUserProfile({
-		let userInfo = uni.getStorageSync('userProfile');
-		if (userInfo) {
-			return true;
-		}
-		
-		userInfo = await wx.getUserProfile({
 			desc: '用于小程序登录'
 		});
 		console.log("从微信获取基本用户信息：" + userInfo);
@@ -110,7 +112,7 @@ export default {
 		console.log("通过后台服务获取用户信息：" + userInfo);
 		if (!userInfo || userInfo.customerId == null || userInfo.customerId == undefined) {
 			uni.showToast({
-				icon: 'error',
+				icon: 'none',
 				title: '微信用户信息获取失败，请退出小程序重试'
 			})
 			return false;
@@ -225,5 +227,26 @@ export default {
 			data: params
 		})
 		return res[1].data;
+	},
+	async listByStep(params = {goodsCategoryId : null}) {
+		let res = await uni.request({
+			url: '/goods/deptcategory/listByStep',
+			method: 'POST',
+			data: params
+		})
+		return res[1].data;
+	},
+	async uploadFile(filePath) {
+		let res = await uni.uploadFile({
+			url: this.address + '/tool/qiniu/upload',
+			filePath: filePath,
+			name: 'uploadFile'
+		})
+		let resStr = res[1].data;
+		let resObj = {};
+		if (resStr != null && resStr.length > 0) {
+			resObj = JSON.parse(resStr);
 		}
+		return resObj;
+	},
 }

pages/index/home.vue

@@ -13,12 +13,16 @@
 		<view class="cu-bar search bg-white">
 			<view class="search-form round">
 				<text class="cuIcon-search"></text>
-				<input @confirm="searchGoods" :adjust-position="true" type="text"
+				<input @confirm="searchGoods" :adjust-position="true" type="text" placeholder="输入搜索内容"
-					placeholder="输入搜索内容" confirm-type="search"></input>
+					confirm-type="search"></input>
 			</view>
+			<!-- 区域筛选picker -->
 			<view class="action">
-				<text>广州</text>
+				<picker :mode="'multiSelector'" @change="regionChange"
+					@columnchange="regionColChange" :value="areaMultiIndex" :range-key="'areaName'" :range="areaList">
+					<text>{{searchInfo.area && searchInfo.area.length ? searchInfo.area[2].areaName : areaList[2][0].areaName}}</text>
 					<text class="cuIcon-location"></text>
+				</picker>
 			</view>
 		</view>
 		<view class="margin-lr-sm margin-bottom-with-bar">
@@ -42,7 +46,8 @@
 			</view>
 			<!-- 热门细类 -->
 			<view class="cu-list grid no-border hot-sub-category" :class="['col-5']">
-				<view class="cu-item" v-for="(item,index) in subCategories" :key="index" v-if="index < 5" @click="searchGoods(item)">
+				<view class="cu-item" v-for="(item,index) in subCategories" :key="index" v-if="index < 5"
+					@click="searchGoods(item)">
 					<view class="hot-sub-category-icon" :class="['cuIcon-' + item.cuIcon,'text-' + item.color]">
 						<view class="cu-tag badge" v-if="item.badge!=0">
 							<block v-if="item.badge!=1">{{item.badge}}</block>
@@ -67,8 +72,8 @@
 			<vertical-goods-card ref="discountGoodsCard" :goodsInfos="discountGoods.goodsInfos"
 				:title="discountGoods.title"></vertical-goods-card>
 			<!-- 热门服务 -->
-			<vertical-goods-card ref="hotGoodsCard" :goodsInfos="hotGoods.goodsInfos"
+			<vertical-goods-card ref="hotGoodsCard" :goodsInfos="hotGoods.goodsInfos" :title="hotGoods.title">
-				:title="hotGoods.title"></vertical-goods-card>
+			</vertical-goods-card>
 		</view>
 		<!-- 强制要求用户授权登录的弹窗 -->
 		<view class="cu-modal" :class="isAuthWxLoginModal?'show':''">
@@ -102,7 +107,10 @@
 				hotGoods: {},
 				discountGoods: {},
 				InputBottom: 0,
-				isAuthWxLoginModal: false
+				isAuthWxLoginModal: false,
+				searchInfo: {},
+				areaList: [],
+				areaMultiIndex: [0, 0, 0],
 			}
 		},
 		mounted() {
@@ -121,6 +129,7 @@
 				if (this.isAuthWxLoginModal) {
 					return;
 				}
+				this.loadRegionList();
 				this.swiperList = await this.$api.data('swiperList');
 				this.categories = await this.$api.data('categories');
 				this.subCategories = await this.$api.data('subCategories');
@@ -134,6 +143,66 @@
 			offBindEvent() {
 				uni.$off('index_showProductDetail');
 			},
+			async loadRegionList() {
+				let regionList = await this.$request.areaListByStep();
+				regionList = regionList.data;
+				let subRegionList = [];
+				let subSubRegionList = [];
+				if (regionList && regionList.length > 0) {
+					subRegionList = await this.$request.areaListByStep({
+						parentCode: regionList[0].areaCode
+					});
+					subRegionList = subRegionList.data;
+				}
+				if (subRegionList && subRegionList.length > 0) {
+					subSubRegionList = await this.$request.areaListByStep({
+						parentCode: subRegionList[0].areaCode
+					});
+					subSubRegionList = subSubRegionList.data;
+				}
+				this.areaList.push(regionList);
+				this.areaList.push(subRegionList);
+				this.areaList.push(subSubRegionList);
+			},
+			regionChange(e) {
+				this.areaMultiIndex = e.detail.value;
+				let chosenArea = [];
+				for (let i = 0; i < this.areaList.length; i++) {
+					chosenArea.push(this.areaList[i][this.areaMultiIndex[i]]);
+				}
+				this.searchInfo.area = chosenArea;
+			},
+			async regionColChange(e) {
+				let colObj = e.detail;
+				if (colObj.column == 0) {
+					// 通过一级查二级
+					let subAreaList = await this.$request.areaListByStep({
+						parentCode: this.areaList[0][colObj.value].areaCode
+					});
+					subAreaList = subAreaList.data;
+					let subSubAreaList = [];
+					if (subAreaList.length) {
+						subSubAreaList = await this.$request.areaListByStep({
+							parentCode: subAreaList[0].areaCode
+						});
+						subSubAreaList = subSubAreaList.data;
+					}
+					this.areaList.pop();
+					this.areaList.pop();
+					this.areaList.push(subAreaList);
+					this.areaList.push(subSubAreaList);
+					this.areaMultiIndex = [colObj.value, 0, 0];
+				} else if (colObj.column == 1) {
+					// 通过二级查三级
+					let subAreaList = await this.$request.areaListByStep({
+						parentCode: this.regionList[0][colObj.value].areaCode
+					});
+					subAreaList = subAreaList.data;
+					this.areaList.pop();
+					this.areaList.push(subAreaList);
+					this.areaMultiIndex = [this.areaMultiIndex[0], colObj.value, 0];
+				}
+			},
 			async tabSelect(e) {
 				this.tabCur = e.currentTarget.dataset.id;
 				// 获取大类信息

pages/product/filtered-products.vue

@@ -19,23 +19,32 @@
 				<view class="cu-item" v-for="(item,index) in taskConditions" v-if="item.type !== 1" :key="index"
 					@tap="tabSelect" :data-id="index">
 					<!-- 区域筛选picker -->
-					<picker v-if="item.code === 'area'" :mode="'multiSelector'" @change="regionChange"
+					<picker v-if="item.code === 'area'" :mode="'multiSelector'" @change="regionChange" @columnchange="regionColChange"
-						:value="areaMultiIndex" :range-key="'name'" :range="areaList">
+						:value="areaMultiIndex" :range-key="'areaName'" :range="areaList">
-						{{item.title}}
+						<view class="flex justify-start">
+							<view class="text-cut search-nav-item-text">
+								{{taskConditions[0].value && taskConditions[0].value.length ? taskConditions[0].value[2].areaName : item.title}}
+							</view>
 							<text class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
+						</view>
 					</picker>
 					<!-- 品类筛选picker -->
 					<picker v-else-if="item.code === 'category'" :mode="'multiSelector'" @change="categoryChange"
-						:value="categoryMultiIndex" :range-key="'name'" :range="categoryList">
+						@columnchange="categoryColChange" :value="categoryMultiIndex" :range-key="'goodsCategoryName'"
-						{{item.title}}
+						:range="categoryList">
+						<view class="flex justify-start">
+							<view class="text-cut search-nav-item-text">
+								{{taskConditions[1].value && taskConditions[1].value.length ? taskConditions[1].value[2].goodsCategoryName : item.title}}
+							</view>
 							<text class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
+						</view>
 					</picker>
-					<text v-else>
+					<view v-else class="flex justify-start">
-						{{item.title}}
+						<view class="search-nav-item-text">{{item.title}}</view>
 						<text v-if="item.type === 0" class="text-lg"><text
 								:class="item.value === 0 ? 'cuIcon-triangleupfill' : 'cuIcon-triangledownfill'"></text></text>
 						<text v-else class="text-lg"><text class="cuIcon-triangledownfill"></text></text>
-					</text>
+					</view>
 				</view>
 				<view class="cu-item" v-else>
 					<button class="cu-btn bg-grey round shadow-blur">{{item.title}}</button>
@@ -50,7 +59,7 @@
 			</view>
 		</view>
 		<view class="margin-bottom-lg">
-			<view v-if="hasMoreData" class="text-center bg-main-color light padding-tb-sm" @click="loadData">
+			<view v-if="hasMoreData" class="text-center bg-main-color light padding-tb-sm" @click="loadProductData">
 				<text class="margin-right-xs">查看更多</text>
 				<text class="text-bold cuIcon-unfold"></text>
 			</view>
@@ -113,6 +122,23 @@
 			this.loadData(params);
 		},
 		methods: {
+			loadData(params) {
+				this.loadCategoryList();
+				this.loadRegionList();
+				this.loadProductData(params);
+			},
+			async loadProductData(params) {
+				params.pageNum = this.pageNum;
+				params.pageSize = this.pageSize;
+				this.loadMoreStatus = 'loading bg-main-color light';
+				this.hasMoreData = false;
+				try {
+					await this.loadProductPage(params);
+					this.loadMoreStatus = this.hasMoreData ? '' : 'over bg-grey';
+				} catch (e) {
+					this.loadMoreStatus = 'erro bg-red'
+				}
+			},
 			async loadProductPage(params) {
 				// let shopInfo = await this.$api.data('shopInfo');
 				// this.productList = shopInfo.productList;
@@ -126,17 +152,43 @@
 				this.productList = this.productList.concat(res[1].data.rows);
 				this.pageNum++;
 			},
-			async loadData(params) {
+			async loadCategoryList(idArr) {
-				params.pageNum = this.pageNum;
+				let typeList = await this.$request.listByStep();
-				params.pageSize = this.pageSize;
+				typeList = typeList.data;
-				this.loadMoreStatus = 'loading bg-main-color light';
+				let col1Id = idArr ? idArr[0] : typeList[0].goodsCategoryId;
-				this.hasMoreData = false;
+				let subTypeList = await this.$request.listByStep({
-				try {
+					goodsCategoryId: col1Id
-					await this.loadProductPage(params);
+				});
-					this.loadMoreStatus = this.hasMoreData ? '' : 'over bg-grey';
+				subTypeList = subTypeList.data;
-				} catch (e) {
+				let col2Id = idArr ? idArr[1] : subTypeList[0].goodsCategoryId;
-					this.loadMoreStatus = 'erro bg-red'
+				let subSubTypeList = await this.$request.listByStep({
+					goodsCategoryId: col2Id
+				});
+				subSubTypeList = subSubTypeList.data;
+				this.categoryList.push(typeList);
+				this.categoryList.push(subTypeList);
+				this.categoryList.push(subSubTypeList);
+			},
+			async loadRegionList() {
+				let regionList = await this.$request.areaListByStep();
+				regionList = regionList.data;
+				let subRegionList = [];
+				let subSubRegionList = [];
+				if (regionList && regionList.length > 0) {
+					subRegionList = await this.$request.areaListByStep({
+						parentCode: regionList[0].areaCode
+					});
+					subRegionList = subRegionList.data;
 				}
+				if (subRegionList && subRegionList.length > 0) {
+					subSubRegionList = await this.$request.areaListByStep({
+						parentCode: subRegionList[0].areaCode
+					});
+					subSubRegionList = subSubRegionList.data;
+				}
+				this.areaList.push(regionList);
+				this.areaList.push(subRegionList);
+				this.areaList.push(subSubRegionList);
 			},
 			searchGoods(e) {
 				console.log("搜索" + e.detail.value)
@@ -163,22 +215,86 @@
 			regionChange(e) {
 				this.areaMultiIndex = e.detail.value;
 				let chosenArea = [];
-				for(let i = 0; i < this.areaList.length; i++) {
+				for (let i = 0; i < this.areaList.length; i++) {
 					chosenArea.push(this.areaList[i][this.areaMultiIndex[i]]);
 				}
 				this.taskConditions[this.tabCur].value = chosenArea;
 			},
-			categoryChange(e) {
+			async regionColChange(e) {
+				let colObj = e.detail;
+				if (colObj.column == 0) {
+					// 通过一级查二级
+					let subAreaList = await this.$request.areaListByStep({parentCode: this.areaList[0][colObj.value].areaCode});
+					subAreaList = subAreaList.data;
+					let subSubAreaList = [];
+					if (subAreaList.length) {
+						subSubAreaList = await this.$request.areaListByStep({parentCode: subAreaList[0].areaCode});
+						subSubAreaList = subSubAreaList.data;
+					}
+					this.areaList.pop();
+					this.areaList.pop();
+					this.areaList.push(subAreaList);
+					this.areaList.push(subSubAreaList);
+					this.areaMultiIndex = [colObj.value, 0, 0];
+				} else if (colObj.column == 1) {
+					// 通过二级查三级
+					let subAreaList = await this.$request.areaListByStep({parentCode: this.regionList[0][colObj.value].areaCode});
+					subAreaList = subAreaList.data;
+					this.areaList.pop();
+					this.areaList.push(subAreaList);
+					this.areaMultiIndex = [this.areaMultiIndex[0], colObj.value, 0];
+				}
+			},
+			async categoryChange(e) {
 				this.categoryMultiIndex = e.detail.value;
 				let chosenCategory = [];
-				for(let i = 0; i < this.categoryList.length; i++) {
+				for (let i = 0; i < this.categoryList.length; i++) {
 					chosenCategory.push(this.categoryList[i][this.categoryMultiIndex[i]]);
 				}
 				this.taskConditions[this.tabCur].value = chosenCategory;
+			},
+			async categoryColChange(e) {
+				let colObj = e.detail;
+				if (colObj.column == 0) {
+					// 通过一级查询二级
+					let subTypeList = await this.$request.listByStep({
+						goodsCategoryId: this.categoryList[0][colObj.value].goodsCategoryId
+					});
+					subTypeList = subTypeList.data;
+					let subSubTypeList = await this.$request.listByStep({
+						goodsCategoryId: subTypeList[0].goodsCategoryId
+					});
+					subSubTypeList = subSubTypeList.data;
+					this.categoryList.pop();
+					this.categoryList.pop();
+					this.categoryList.push(subTypeList);
+					this.categoryList.push(subSubTypeList);
+					this.categoryMultiIndex = [colObj.value, 0, 0];
+				} else if (colObj.column == 1) {
+					// 通过二级查三级
+					let subSubTypeList = await this.$request.listByStep({
+						goodsCategoryId: this.categoryList[1][colObj.value].goodsCategoryId
+					});
+					subSubTypeList = subSubTypeList.data;
+					this.categoryList.pop();
+					this.categoryList.push(subSubTypeList);
+					this.categoryMultiIndex = [this.categoryMultiIndex[0], colObj.value, 0];
 				}
 			},
+		},
 	}
 </script>
 
-<style>
+<style scoped>
+	.search-nav-item-text {
+		width: 100rpx;
+	}
+
+	.nav .cu-item {
+		height: 90rpx;
+		display: inline-block;
+		line-height: 90rpx;
+		margin: 0;
+		padding: 0 10rpx;
+	}
 </style>