Эх сурвалжийг харах

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

liuboyan 4 жил өмнө
parent
commit
748d52cb57

+ 5 - 1
config/api.js

@@ -1,4 +1,4 @@
-const WX_API_BASE = 'https://hubw.jihengcc.cn/'
+const WX_API_BASE = 'https://hubw.jihengcc.cn'
 
 module.exports = {
 	//  微信登录
@@ -18,4 +18,8 @@ module.exports = {
 	getSortList: WX_API_BASE + '/app/productCategory/categoryInitialization',
 	//  获取分类下商品
 	getGoodsBySort: WX_API_BASE + '/app/productCategory/selectProductCategory',
+	//  获取自助采摘、共享种植、拍卖商品列表
+	getGoodsByType: WX_API_BASE + '/app/product/homeCategoryProductPage',
+	//  获取商品详情
+	getCommonGoodDetail: WX_API_BASE + '/app/product/user/productDetail',
 }

+ 8 - 8
pages.json

@@ -57,23 +57,23 @@
 		"selectedColor": "#52A63A",
 		"list": [{
 				"pagePath": "pages/index/index",
-				"iconPath": "static/images/caizhai.png",
-				"selectedIconPath": "static/images/caizhai.png",
+				"iconPath": "static/images/icon-index.png",
+				"selectedIconPath": "static/images/icon-index-active.png",
 				"text": "首页"
 			},{
 				"pagePath": "pages/shop/index",
-				"iconPath": "static/images/caizhai.png",
-				"selectedIconPath": "static/images/caizhai.png",
+				"iconPath": "static/images/icon-shop.png",
+				"selectedIconPath": "static/images/icon-shop-active.png",
 				"text": "商城"
 			},{
 				"pagePath": "pages/cart/cart",
-				"iconPath": "static/images/caizhai.png",
-				"selectedIconPath": "static/images/caizhai.png",
+				"iconPath": "static/images/icon-cart.png",
+				"selectedIconPath": "static/images/icon-cart-active.png",
 				"text": "购物车"
 			},{
 				"pagePath": "pages/user/index",
-				"iconPath": "static/images/caizhai.png",
-				"selectedIconPath": "static/images/caizhai.png",
+				"iconPath": "static/images/icon-mine.png",
+				"selectedIconPath": "static/images/icon-mine-active.png",
 				"text": "个人"
 			}
 		]

+ 38 - 34
pages/index/index.vue

@@ -5,19 +5,19 @@
 		</view>
 		<view>
 			<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="3000" :duration="500">
-				<swiper-item>
-					<cover-image class="" v-for="(item,index) in advertList" :key="index" :src="item.imgPath"></cover-image>
+				<swiper-item v-for="(item,index) in advertList" :key="index">
+					<cover-image :src="item.imgPath"></cover-image>
 				</swiper-item>
 			</swiper>
 		</view>
 		<view class="entrance">
-			<view class="entrance-col" @click="goToGoodList(null, 1)">
+			<view class="entrance-col" @click="goToGoodList(null, 3)">
 				<view class="entrance-button caizhai">自助采摘</view>
 			</view>
-			<view class="entrance-col" @click="goToGoodList(null, 2)">
+			<view class="entrance-col" @click="goToGoodList(null, 4)">
 				<view class="entrance-button zhongzhi">共享种植</view>
 			</view>
-			<view class="entrance-col" @click="goToGoodList(null, 3)">
+			<view class="entrance-col" @click="goToGoodList(null, 2)">
 				<view class="entrance-button paimai">拍 卖</view>
 			</view>
 		</view>
@@ -49,7 +49,7 @@
 			<view class="title-text">今日特惠</view>
 			<view class="title-tip">精品特价,限量抢购</view>
 		</view>
-		<view class="content-box" style="display: flex;justify-content: space-between;">
+		<view class="content-box" style="width: calc(100% - 24px);margin-left: 12px; display: flex;justify-content: space-between;">
 			<view class="discount-col" v-for="(item,index) in discountList" :key="index" @click="goToGoodDetails(item)">
 				<cover-image class="discount-img" :src="item.imgPath"></cover-image>
 				<view class="discount-name">{{item.productName}}</view>
@@ -60,7 +60,7 @@
 				</view>
 			</view>
 		</view>
-		<view class="index-title">
+		<view class="index-title" style="margin-bottom: 4px;">
 			<view class="title-text">猜你喜欢</view>
 		</view>
 		<scroll-view class="content-box" scroll-y="true" refresher-enabled="true" :refresher-triggered="triggered"
@@ -74,6 +74,7 @@
 						<text class="sale-icon">¥</text>
 						<text class="sale-price">{{item.bizPrice}}</text>
 						<text class="price">原价:{{item.originalPrice}}</text>
+						<text class="iconfont icongengduo"></text>
 					</text>
 				</view>
 			</view>
@@ -95,7 +96,7 @@
 				goodsList: [],
 			}
 		},
-		onLoad(options) {
+		onLoad() {
 			// this.appLoginWx()
 			NET.request(API.getAdvert, {}, 'GET').then(res => {
 				if (res.code == 0) {
@@ -223,15 +224,9 @@
 			},
 			//  跳转商品列表
 			goToGoodList(data, type) {
-				if (type) {
-					uni.navigateTo({
-						url: '/pagesGood/goodList?goodType=' + type
-					});
-				} else {
-					uni.navigateTo({
-						url: '/pagesGood/goodList?goodName=' + data.value + '&goodType=0'
-					});
-				}
+				uni.navigateTo({
+					url: '/pagesGood/goodList?goodType=' + (type ? type : (1 + '&goodName=' + data.value))
+				});
 			},
 			//  跳转商品详情
 			goToGoodDetails(item) {
@@ -246,7 +241,7 @@
 <style lang="less" scoped>
 	.container {
 		background-size: 128px 124px;
-		background-position: center;
+		background-position: center 510px;
 		background-repeat: no-repeat;
 		background-image: url(@/static/images/indexBg.png);
 
@@ -318,19 +313,20 @@
 			width: calc(100% - 24px);
 			border-left: 1px solid #6CA63A;
 			padding: 2px 0 2px 5px;
-			margin: 15px 12px 8px 12px;
+			margin: 15px 12px 10px 12px;
 
 			.title-text {
-				height: 16px;
-				line-height: 16px;
+				height: 20px;
+				margin-bottom: 2px;
+				line-height: 20px;
 				font-size: 15px;
 				font-family: PingFang SC;
 				color: #6CA63A;
 			}
 
 			.title-tip {
-				height: 12px;
-				line-height: 12px;
+				height: 14px;
+				line-height: 14px;
 				font-size: 12px;
 				font-family: PingFang SC;
 				color: #666666;
@@ -338,8 +334,7 @@
 		}
 
 		.content-box {
-			width: calc(100% - 24px);
-			margin: 0 12px;
+			width: 100%;
 
 			.discount-col {
 				width: calc(50% - 6px);
@@ -351,7 +346,7 @@
 
 				.discount-img {
 					height: 170px;
-					object-fit: co;
+					object-fit: cover;
 				}
 
 				.discount-name {
@@ -359,7 +354,6 @@
 					margin: 7px 6px 10px 6px;
 					font-size: 12px;
 					font-family: PingFang SC;
-					font-weight: 400;
 					color: #343434;
 					line-height: 14px;
 				}
@@ -394,10 +388,11 @@
 			}
 
 			.goods-row {
+				width: calc(100% - 24px);
 				height: 104px;
-				margin-bottom: 12px;
+				margin: 6px 0 12px 12px;
 				background: #FFFFFF;
-				box-shadow: 0px 2px 19px 0px rgba(0, 0, 0, 0.09);
+				box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.09);
 				border-radius: 5px;
 				overflow: hidden;
 				display: flex;
@@ -410,15 +405,15 @@
 
 				.goods-info {
 					width: calc(100% - 104px);
-					padding: 10px 10px 10px 16px;
+					padding: 10px 10px 10px 12px;
 					box-sizing: border-box;
 
 					.goods-name {
-						height: 30px;
+						height: 36px;
 						font-size: 15px;
 						font-family: PingFang SC;
 						color: #333333;
-						line-height: 15px;
+						line-height: 18px;
 						overflow: hidden;
 						text-overflow: ellipsis;
 						display: -webkit-box;
@@ -433,7 +428,7 @@
 						font-family: PingFang SC;
 						color: #666666;
 						line-height: 16px;
-						margin: 8px 0;
+						margin: 6px 0 4px 0;
 					}
 
 					.goods-price {
@@ -444,10 +439,11 @@
 						.sale-icon {
 							font-size: 12px;
 							color: #6CA63A;
+							margin-left: -2px;
 						}
 
 						.sale-price {
-							font-size: 24px;
+							font-size: 22px;
 							color: #6CA63A;
 							margin-right: 6px;
 						}
@@ -457,12 +453,20 @@
 							text-decoration: line-through;
 							color: #A67954;
 						}
+						.iconfont{
+							float: right;
+							color: #999999;
+							font-size: 32px;
+							line-height: 28px;
+						}
 					}
 				}
 			}
 		}
 
 		.video-box {
+			width: calc(100% - 24px);
+			margin-left: 12px;
 			box-sizing: border-box;
 			background: #FFFFFF;
 			box-shadow: 1px 2px 19px 0px rgba(0, 0, 0, 0.09);

+ 20 - 3
pages/shop/index.vue

@@ -20,15 +20,15 @@
 					<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-details">{{item.productDescribe}}</view>
 						<view class="goods-number">
 							<text class="goods-icon">¥</text>
-							<text class="goods-spec">{{item.bizPrice}}/{{item.spec}}</text>
+							<text class="goods-spec">{{item.bizPrice}}/{{item.unit}}</text>
 							<text class="goods-sales">{{item.sellCount}}人付款</text>
 						</view>
 					</view>
 					<view class="goods-cart">
-						<view class="cart-button">
+						<view class="cart-button" @click.stop="addCart(item)">
 							<view class="iconfont icongouwuche"></view>
 						</view>
 					</view>
@@ -135,6 +135,20 @@
 					}
 				}).catch(res => {})
 			},
+			//  添加购物车
+			addCart(item) {
+				uni.showModal({
+					title: '提示',
+					content: '是否将该商品添加至购物车',
+					success: (res) => {
+						if (res.confirm) {
+							console.log('用户点击确定');
+						} else if (res.cancel) {
+							console.log('取消');
+						}
+					}
+				});
+			},
 			//  跳转商品详情
 			goToGoodDetails(item) {
 				uni.navigateTo({
@@ -254,9 +268,12 @@
 					.goods-info {
 						width: calc(100% - 108px);
 						height: 84px;
+						box-sizing: border-box;
+						padding-left: 6px;
 						float: left;
 
 						.goods-name {
+							width: calc(100% + 24px);
 							height: 18px;
 							font-size: 15px;
 							font-family: PingFang SC;

+ 123 - 1
pagesGood/goodDetails.vue

@@ -1,8 +1,130 @@
 <template>
+	<view class="container">
+		<swiper class="swiper" :indicator-dots="true" indicator-color="#9A9A9A" indicator-active-color="#52A63A" :autoplay="true"
+		 :interval="3000" :duration="500">
+			<swiper-item v-for="(item,index) in goodData.imgs" :key="index">{{index}}
+				<!-- <cover-image :src="item.imgPath"></cover-image> -->
+			</swiper-item>
+		</swiper>
+		<view class="good-info">
+			<text class="good-price">
+				<text class="sale-icon">¥</text>
+				<text class="sale-price">{{goodData.bizPrice}}</text>
+				<text class="price">原价:{{goodData.originalPrice}}</text>
+				<text class="seller-count">{{goodData.sellCount}}人付款</text>
+			</text>
+			<view class="good-name">{{goodData.productName}}</view>
+			<view class="good-detail">{{goodData.productDescribe}}</view>
+		</view>
+		<view class="good-info">
+	</view>
+	</view>
 </template>
 
 <script>
+	const NET = require('@/utils/request')
+	const API = require('@/config/api')
+	export default {
+		data() {
+			return {
+				goodId: '',
+				goodData: {
+					bizPrice: '',
+					originalPrice: '',
+					sellCount: '',
+					productName: '',
+					productDescribe: '',
+					imgs: [],
+				},
+				goodsList: [],
+			}
+		},
+		onLoad(options) {
+			this.goodId = options.goodId ? options.goodId : ''
+			this.getGoodsList()
+		},
+		onReady() {
+			if (this.goodId) {
+				NET.request(API.getCommonGoodDetail + '/' + this.goodId, {}, 'GET').then(res => {
+					if (res.code == 0) {
+						this.goodData = res.data
+					} else {
+						uni.showToast({
+							title: "获取商品详情失败",
+							icon: "none"
+						})
+					}
+				}).catch(res => {})
+			}
+		},
+		methods: {
+			getGoodsList() {},
+		},
+	}
 </script>
 
-<style>
+<style lang="less" scoped>
+	.container {
+		background-color: #f7f7f7;
+
+		.swiper {
+			height: 375px;
+
+			/deep/.uni-swiper-dot-active {
+				width: 16px !important;
+				border-radius: 8px;
+			}
+		}
+
+		.good-info {
+			box-sizing: border-box;
+			padding: 22px 16px;
+			background-color: #FFFFFF;
+
+			.good-price {
+				height: 26px;
+				line-height: 26px;
+				font-family: PingFang SC;
+
+				.sale-icon {
+					font-size: 16px;
+					color: #52A63A;
+					margin-left: -2px;
+				}
+
+				.sale-price {
+					font-size: 24px;
+					color: #52A63A;
+				}
+
+				.price {
+					font-size: 12px;
+					text-decoration: line-through;
+					color: #A67A54;
+				}
+
+				.seller-count {
+					float: right;
+					font-size: 12px;
+					color: #666666;
+				}
+			}
+
+			.good-name {
+				line-height: 20px;
+				font-size: 16px;
+				color: #343434;
+				font-family: PingFang SC;
+				margin: 10px 0;
+			}
+
+			.good-detail {
+				line-height: 14px;
+				font-size: 12px;
+				
+color: #666666;
+				font-family: PingFang SC;
+			}
+		}
+	}
 </style>

+ 39 - 13
pagesGood/goodList.vue

@@ -9,17 +9,20 @@
 				<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-details">{{item.productDescribe}}</view>
 					<view class="goods-number">
 						<text class="goods-icon">¥</text>
-						<text class="goods-spec">{{item.bizPrice}}/{{item.spec}}</text>
+						<text class="goods-spec">{{item.bizPrice}}/{{item.unit}}</text>
 						<text class="goods-sales">{{item.sellCount}}人付款</text>
 					</view>
 				</view>
 				<view class="goods-cart">
-					<view class="cart-button">
+					<view class="cart-button" v-if="goodType == 1 || goodType == 3" @click.stop="addCart(item)">
 						<view class="iconfont icongouwuche"></view>
 					</view>
+					<view class="more-button" v-else>
+						<view class="iconfont icongengduo"></view>
+					</view>
 				</view>
 			</view>
 		</k-scroll-view>
@@ -42,17 +45,12 @@
 		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 ? '共享种植' : '拍卖'))
+				title: this.goodType == 1 ? '商品列表' : (this.goodType == 3 ? '自助采摘' : (this.goodType == 4 ? '共享种植' : '拍卖'))
 			});
 			this.getGoodsList()
 		},
-		onReady(options) {
+		onReady() {
 			if (this.goodName) {
 				this.$refs.searchBar.show = true
 				this.$refs.searchBar.showSync = true
@@ -87,10 +85,9 @@
 			},
 			//  获取商品
 			getGoodsList(stopLoad) {
-				NET.request(API.getGoodsBySort, {
+				NET.request(API.getGoodsByType, {
 					name: this.goodName,
-					oneId: '',
-					twoId: '',
+					productType: this.goodType,
 					pageIndex: this.pageIndex,
 					pageSize: 10,
 				}, 'POST').then(res => {
@@ -105,6 +102,20 @@
 					}
 				}).catch(res => {})
 			},
+			//  添加购物车
+			addCart(item) {
+				uni.showModal({
+					title: '提示',
+					content: '是否将该商品添加至购物车',
+					success: (res) => {
+						if (res.confirm) {
+							console.log('用户点击确定');
+						} else if (res.cancel) {
+							console.log('取消');
+						}
+					}
+				});
+			},
 			//  跳转商品详情
 			goToGoodDetails(item) {
 				uni.navigateTo({
@@ -163,9 +174,12 @@
 				.goods-info {
 					width: calc(100% - 108px);
 					height: 84px;
+					box-sizing: border-box;
+					padding-left: 6px;
 					float: left;
 
 					.goods-name {
+						width: calc(100% + 24px);
 						height: 18px;
 						font-size: 15px;
 						font-family: PingFang SC;
@@ -233,6 +247,18 @@
 							line-height: 24px;
 						}
 					}
+
+					.more-button {
+						width: 24px;
+						height: 20px;
+						margin-top: 64px;
+
+						.iconfont {
+							color: #999999;
+							font-size: 32px;
+							line-height: 20px;
+						}
+					}
 				}
 			}
 		}

+ 6 - 6
static/iconfont.css

@@ -1,11 +1,11 @@
 @font-face {
   font-family: 'iconfont';  /* project id 2119167 */
-  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');
+  src: url('https://at.alicdn.com/t/font_2119167_9qu98tlqs5.eot');
+  src: url('https://at.alicdn.com/t/font_2119167_9qu98tlqs5.eot?#iefix') format('embedded-opentype'),
+  url('https://at.alicdn.com/t/font_2119167_9qu98tlqs5.woff2') format('woff2'),
+  url('https://at.alicdn.com/t/font_2119167_9qu98tlqs5.woff') format('woff'),
+  url('https://at.alicdn.com/t/font_2119167_9qu98tlqs5.ttf') format('truetype'),
+  url('https://at.alicdn.com/t/font_2119167_9qu98tlqs5.svg#iconfont') format('svg');
 }
 
 .iconfont {

BIN
static/images/icon-cart-active.png


BIN
static/images/icon-cart.png


BIN
static/images/icon-index-active.png


BIN
static/images/icon-index.png


BIN
static/images/icon-mine-active.png


BIN
static/images/icon-mine.png


BIN
static/images/icon-shop-active.png


BIN
static/images/icon-shop.png