Signed-off-by: liuboyan <632697560@qq.com>

图标

components/uni-search-bar/uni-search-bar.vue

@@ -83,7 +83,7 @@
 			return {
 				show: false,
 				showSync: false,
-				searchVal: ""
+				searchVal: "aaa"
 			}
 		},
 		watch: {

pages/index/index.vue

@@ -11,13 +11,13 @@
 			</swiper>
 		</view>
 		<view class="entrance">
-			<view class="entrance-col" @click="goToGoodList">
+			<view class="entrance-col" @click="goToGoodList(null, 1)">
 				<view class="entrance-button caizhai">自助采摘</view>
 			</view>
-			<view class="entrance-col">
+			<view class="entrance-col" @click="goToGoodList(null, 2)">
 				<view class="entrance-button zhongzhi">共享种植</view>
 			</view>
-			<view class="entrance-col">
+			<view class="entrance-col" @click="goToGoodList(null, 3)">
 				<view class="entrance-button paimai">拍 卖</view>
 			</view>
 		</view>
@@ -222,17 +222,15 @@
 				})
 			},
 			//  跳转商品列表
-			goToGoodList(data) {
-				switch (data) {
-					case 0:
-						uni.navigateTo({
-							url: '/pagesGood/goodList?search=' + data
-						});
-						break;
-					default:
-						uni.navigateTo({
-							url: '/pagesGood/goodList?search=' + data.value
-						});
+			goToGoodList(data, type) {
+				if (type) {
+					uni.navigateTo({
+						url: '/pagesGood/goodList?goodType=' + type
+					});
+				} else {
+					uni.navigateTo({
+						url: '/pagesGood/goodList?goodName=' + data.value + '&goodType=0'
+					});
 				}
 			},
 			//  跳转商品详情

pages/shop/index.vue

@@ -16,7 +16,7 @@
 				 :key="index" @click="checkSecondSort(item)">{{item.cateValue}}</view>
 			</scroll-view>
 			<k-scroll-view @onPullDown="handlePullDown" @onPullUp="handleLoadMore" class="goods-box">
-				<view class="goods-row" v-for="item in goodsList" @click="">
+				<view class="goods-row" v-for="item in goodsList" @click="goToGoodDetails(item)">
 					<cover-image class="goods-img" :src="item.imgPath"></cover-image>
 					<view class="goods-info">
 						<view class="goods-name">{{item.productName}}</view>
@@ -64,6 +64,11 @@
 					this.sortFirstList = res.data
 					if (res.data.length) {
 						this.checkFirstSort(res.data[0])
+					} else{
+						uni.showToast({
+							title: "获取商品分类失败",
+							icon: "none"
+						})
 					}
 				}
 			}).catch(res => {})
@@ -83,6 +88,7 @@
 				this.sortSecondCode = item.cateCode
 				this.goodsList = []
 				if (this.triggered = 'restore') {
+					this.pageIndex = 1
 					this.getGoodsList()
 				}
 			},
@@ -90,10 +96,12 @@
 			search(data) {
 				this.goodName = data.value
 				this.goodsList = []
+				this.pageIndex = 1
 				this.getGoodsList()
 			},
 			//  下拉刷新
 			handlePullDown(stopLoad) {
+				this.pageIndex = 1
 				this.goodsList = []
 				this.getGoodsList(stopLoad)
 				stopLoad ? stopLoad() : '';
@@ -101,6 +109,7 @@
 			//  懒加载
 			handleLoadMore(stopLoad) {
 				if (!this.isOver) {
+					this.pageIndex++
 					this.getGoodsList()
 				} else{
 					stopLoad ? stopLoad({ isEnd: true }) : '';
@@ -116,16 +125,21 @@
 					pageSize: 10,
 				}, 'POST').then(res => {
 					if (res.code == 0) {
-						for (let i = 0; i < 8; i++) {
-							res.data.list.push({
-								...res.data.list[0],
-								productName: res.data.list[i].productName + 1
-							})
-						}
 						this.isOver = res.data.list.length != 10
 						this.goodsList = this.goodsList.concat(res.data.list)
+					} else{
+						uni.showToast({
+							title: "获取商品列表失败",
+							icon: "none"
+						})
 					}
 				}).catch(res => {})
+			},
+			//  跳转商品详情
+			goToGoodDetails(item) {
+				uni.navigateTo({
+					url: '/pagesGood/goodDetails?goodId=' + item.productId
+				});
 			}
 		}
 	}

pagesGood/goodList.vue

@@ -1,8 +1,240 @@
 <template>
+	<view class="container">
+		<view class="search-box">
+			<uni-search-bar ref="searchBar" radius="5" placeholder="搜索" :defaultText="goodName" clearButton="auto" cancelButton="none"
+			 bgColor="#ffffff" @confirm="search" class="search-bar" />
+		</view>
+		<k-scroll-view @onPullDown="handlePullDown" @onPullUp="handleLoadMore" class="goods-box">
+			<view class="goods-row" v-for="item in goodsList" @click="goToGoodDetails(item)">
+				<cover-image class="goods-img" :src="item.imgPath"></cover-image>
+				<view class="goods-info">
+					<view class="goods-name">{{item.productName}}</view>
+					<view class="goods-details">{{item.details}}</view>
+					<view class="goods-number">
+						<text class="goods-icon">￥</text>
+						<text class="goods-spec">{{item.bizPrice}}/{{item.spec}}</text>
+						<text class="goods-sales">{{item.sellCount}}人付款</text>
+					</view>
+				</view>
+				<view class="goods-cart">
+					<view class="cart-button">
+						<view class="iconfont icongouwuche"></view>
+					</view>
+				</view>
+			</view>
+		</k-scroll-view>
+	</view>
 </template>
 
 <script>
+	const NET = require('@/utils/request')
+	const API = require('@/config/api')
+	export default {
+		data() {
+			return {
+				goodType: '',
+				pageIndex: 1,
+				isOver: false,
+				goodName: '',
+				goodsList: [],
+			}
+		},
+		onLoad(options) {
+			this.goodName = options.goodName ? options.goodName : ''
+			this.goodType = options.goodType
+			switch (this.goodType) {
+				case 0:
+					break;
+				default:
+			}
+			uni.setNavigationBarTitle({
+				title: this.goodType == 0 ? '商品列表' : (this.goodType == 1 ? '自助采摘' : (this.goodType == 2 ? '共享种植' : '拍卖'))
+			});
+			this.getGoodsList()
+		},
+		onReady(options) {
+			if (this.goodName) {
+				this.$refs.searchBar.show = true
+				this.$refs.searchBar.showSync = true
+				this.$refs.searchBar.searchVal = this.goodName
+			}
+		},
+		methods: {
+			//  搜索商品
+			search(data) {
+				this.goodName = data.value
+				this.goodsList = []
+				this.pageIndex = 1
+				this.getGoodsList()
+			},
+			//  下拉刷新
+			handlePullDown(stopLoad) {
+				this.pageIndex = 1
+				this.goodsList = []
+				this.getGoodsList(stopLoad)
+				stopLoad ? stopLoad() : '';
+			},
+			//  懒加载
+			handleLoadMore(stopLoad) {
+				if (!this.isOver) {
+					this.pageIndex++
+					this.getGoodsList()
+				} else {
+					stopLoad ? stopLoad({
+						isEnd: true
+					}) : '';
+				}
+			},
+			//  获取商品
+			getGoodsList(stopLoad) {
+				NET.request(API.getGoodsBySort, {
+					name: this.goodName,
+					oneId: '',
+					twoId: '',
+					pageIndex: this.pageIndex,
+					pageSize: 10,
+				}, 'POST').then(res => {
+					if (res.code == 0) {
+						this.isOver = res.data.list.length != 10
+						this.goodsList = this.goodsList.concat(res.data.list)
+					} else {
+						uni.showToast({
+							title: "获取商品列表失败",
+							icon: "none"
+						})
+					}
+				}).catch(res => {})
+			},
+			//  跳转商品详情
+			goToGoodDetails(item) {
+				uni.navigateTo({
+					url: '/pagesGood/goodDetails?goodId=' + item.productId
+				});
+			}
+		},
+	}
 </script>
 
 <style lang="less" scoped>
+	page {
+		width: 100%;
+		height: 100%;
+	}
+
+	.container {
+		width: 100%;
+		height: 100%;
+		background-color: #f7f7f7;
+
+		.search-box {
+			width: 100%;
+			height: 58px;
+			box-sizing: border-box;
+			padding: 2px 12px 1px 12px;
+
+			/deep/.uni-searchbar {
+				background-color: #f7f7f7;
+			}
+		}
+
+		.goods-box {
+			width: 100%;
+			height: calc(100% - 58px) !important;
+			padding: 6px 0 0px 0;
+			box-sizing: border-box;
+			overflow-y: auto;
+
+			.goods-row {
+				width: calc(100% - 24px);
+				height: 104px;
+				padding: 11px 11px 11px 7px;
+				box-sizing: border-box;
+				margin: 4px 0 12px 12px;
+				background: #FFFFFF;
+				box-shadow: 0px 1px 5px 0px rgba(102, 102, 102, 0.43);
+				border-radius: 15px;
+
+				.goods-img {
+					width: 84px;
+					height: 84px;
+					float: left;
+				}
+
+				.goods-info {
+					width: calc(100% - 108px);
+					height: 84px;
+					float: left;
+
+					.goods-name {
+						height: 18px;
+						font-size: 15px;
+						font-family: PingFang SC;
+						color: #333333;
+						line-height: 18px;
+						white-space: nowrap;
+						text-overflow: ellipsis;
+						overflow: hidden;
+					}
+
+					.goods-details {
+						height: 28px;
+						font-size: 12px;
+						font-family: PingFang SC;
+						color: #999999;
+						line-height: 14px;
+						overflow: hidden;
+						text-overflow: ellipsis;
+						display: -webkit-box;
+						-webkit-line-clamp: 2;
+						-webkit-box-orient: vertical;
+						word-wrap: break-word;
+						margin: 4px 0 12px 0;
+					}
+
+					.goods-number {
+						height: 16px;
+						font-family: PingFang SC;
+						line-height: 16px;
+
+						.goods-icon {
+							font-size: 12px;
+							color: #52A63A;
+						}
+
+						.goods-spec {
+							font-size: 15px;
+							color: #52A63A;
+							margin-right: 15px;
+						}
+
+						.goods-sales {
+							font-size: 12px;
+							color: #999999;
+						}
+					}
+				}
+
+				.goods-cart {
+					width: 24px;
+					height: 84px;
+					float: left;
+
+					.cart-button {
+						width: 24px;
+						height: 24px;
+						margin-top: 30px;
+						background-color: #52A63A;
+						border-radius: 50%;
+						text-align: center;
+
+						.iconfont {
+							color: #FFFFFF;
+							font-size: 18px;
+							line-height: 24px;
+						}
+					}
+				}
+			}
+		}
+	}
 </style>

static/iconfont.css

@@ -1,12 +1,13 @@
 @font-face {
   font-family: 'iconfont';  /* project id 2119167 */
-  src: url('https://at.alicdn.com/t/font_2119167_yyvtw5fd2t.eot');
-  src: url('https://at.alicdn.com/t/font_2119167_yyvtw5fd2t.eot?#iefix') format('embedded-opentype'),
-  url('https://at.alicdn.com/t/font_2119167_yyvtw5fd2t.woff2') format('woff2'),
-  url('https://at.alicdn.com/t/font_2119167_yyvtw5fd2t.woff') format('woff'),
-  url('https://at.alicdn.com/t/font_2119167_yyvtw5fd2t.ttf') format('truetype'),
-  url('https://at.alicdn.com/t/font_2119167_yyvtw5fd2t.svg#iconfont') format('svg');
+  src: url('https://at.alicdn.com/t/font_2119167_fy0fsvgr7bn.eot');
+  src: url('https://at.alicdn.com/t/font_2119167_fy0fsvgr7bn.eot?#iefix') format('embedded-opentype'),
+  url('https://at.alicdn.com/t/font_2119167_fy0fsvgr7bn.woff2') format('woff2'),
+  url('https://at.alicdn.com/t/font_2119167_fy0fsvgr7bn.woff') format('woff'),
+  url('https://at.alicdn.com/t/font_2119167_fy0fsvgr7bn.ttf') format('truetype'),
+  url('https://at.alicdn.com/t/font_2119167_fy0fsvgr7bn.svg#iconfont') format('svg');
 }
+
 .iconfont {
   font-family: "iconfont" !important;
   font-size: 16px;
@@ -15,6 +16,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.iconshangjia-shanghu:before {
+  content: "\e648";
+}
+
+.iconguanyu:before {
+  content: "\e647";
+}
+
 .iconfeigouxuan:before {
   content: "\e646";
 }