商城修改

pages/core/index.vue

@@ -76,6 +76,29 @@
 			</view>
 		</view>
 		
+		<!-- 商品列表 -->
+		<view class="core-goods">
+			<view class="core-goods-list flex">
+				<view class="core-goods-list-item flex" v-for="(item, index) in list" :key="index" @click="toGoodsDetail(item)">
+					<view class="image-wrap flex">
+						<image :src="item.picUrl" mode="aspectFit"></image>
+					</view>
+					<view class="content">
+						<view class="content-title ells-one">{{ item.title }}</view>
+						<view class="content-coin flex">
+							<view class="content-coin__left flex">
+								<image src="../../static/public/goods_coin.png" mode=""></image>
+								<view class="num">×{{ item.exchangePrice }}</view>
+							</view>
+							<view class="content-coin__right" v-if="item.originPrice">原价：{{ item.originPrice }}</view>
+						</view>
+						<view class="content-price">￥{{ $numberFormat(item.value) }}</view>
+					</view>
+				</view>
+				<view class="core-goods-list-item"></view>
+			</view>
+		</view>
+		
 		<custom-tab-bar :activeValue="'core'" />
 	</view>
 </template>
@@ -106,14 +129,18 @@
 			};
 		},
 		onLoad() {
-			// this.pageList()
-			// this.getSwiper()
-			// this.getListIficationBox()
+			this.pageList()
 			this.getExclusive()
 			this.getClassify()
 			this.getSwiper()
 		},
 		methods: {
+			pageList() {
+				this.pageNum = 1
+				this.total = 0
+				this.list = []
+				this.getList()
+			},
 			
 			// 获取分类
 			getClassify() {
@@ -161,48 +188,9 @@
 						this.classifyList.unshift({ name: '全部' })
 						
 					}
-					
-					console.log(this.classifyList);
-					console.log(this.classifyListFilter);
 				})
 			},
 			
-			// 切换分类
-			changeClassify(e) {
-				console.log(e);
-				this.classifyIndex = e.index
-				console.log(this.classifyIndex);
-			},
-			
-			changeIndicatorDots(e) {
-				this.indicatorDots = true
-			},
-
-			changeAutoplay(e) {
-				this.autoplay = true
-			},
-
-			intervalChange(e) {
-				this.interval = e.target.value
-			},
-
-			durationChange(e) {
-				this.duration = e.target.value
-			},
-
-			// 跳转点击事件
-			toCoreRange(type, data, name) {
-				if (type == "link") {
-					uni.navigateTo({
-						url: `/packageOperate/webview/index?url=${ data }`,
-					})
-				} else {
-					uni.navigateTo({
-						url: `/packageGoods/core/index?type=${ type }&data=${ data }&name=${ name }`,
-					})
-				}
-			},
-
 			//轮播图
 			getSwiper() {
 				$http.post(`/api/v1/mp/user/exchange/banner/list`, {
@@ -211,32 +199,17 @@
 				}).then(res => {
 					res.data.forEach(item => item.picUrl = env.filePublic + item.picUrl.split(',')[0])
 					this.swiperList = res.data
-					console.log(this.swiperList);
 				})
 			},
-
-			// 分类列表
-			getListIficationBox() {
-				$http.post(`/api/v1/mp/user/exchange/category/list`, {
-					noToken: true
-				}).then(res => {
-					console.log(res);
-					res.data.forEach(item => {
-						let picUrlArr = item.picUrl.split(',')
-						item.picUrl = env.filePublic + picUrlArr[0] + '?imageView2/2/w/340'
-					})
-					this.goods = this.goods.concat(res.data)
-				})
-			},
-
-			// 秒杀
+			
+			// 标签商品
 			async getExclusive() {
 				let resData = await $http.post(`/api/v1/mp/user/exchange/activity/list`, {
 					noToken: true
 				})
 				let goodsList = []
 				for (let item of resData.data) {
-
+			
 					let resDatas = await $http.post(`/api/v1/mp/user/exchange/goods/list?pageNum=1&pageSize=4`, {
 						noToken: true,
 						tagIds: item.tagId
@@ -253,11 +226,9 @@
 					})
 				})
 				this.exclusiveSingle = goodsList
-				console.log(this.exclusiveSingle);
 			},
-
-
-			//精选商品部分
+			
+			// 商品列表
 			getList() {
 				uni.showLoading({
 					title: '加载中'
@@ -268,17 +239,16 @@
 					...this.coinNum,
 					noToken: true
 				}
-				$http.post(
-					`/api/v1/mp/user/exchange/goods/list?pageNum=${this.pageNum}&pageSize=20&orderByColumn=${this.orderByColumn}&isAsc=${this.isAsc}`,
-					data).then(
+				$http.post(`/api/v1/mp/user/exchange/goods/list?pageNum=${this.pageNum}&pageSize=20`,data).then(
 					res => {
 						uni.hideLoading();
 						if (res.code == 0) {
+							console.log("res: ",res);
 							res.rows.forEach(item => {
 								let picUrlArr = item.picUrl.split(',')
 								item.picUrl = env.filePublic + picUrlArr[0] + '?imageView2/2/w/340'
 							})
-
+			
 							this.total = res.total
 							this.list = this.list.concat(res.rows)
 						}
@@ -286,87 +256,33 @@
 					uni.hideLoading();
 				})
 			},
-
-			pageList() {
-				this.pageNum = 1
-				this.total = 0
-				this.list = []
-				this.getList()
-			},
-
-			pageListTwo() {
-				this.pageNum = 1
-				this.total = 0
-				this.list = []
-				this.getList()
-			},
-
-			openSelect() {
-				if (this.coinShow == false) {
-					this.coinShow = true
-					this.ascShow = false
-
-					uni.createSelectorQuery().select(".core-cla").boundingClientRect((res) => {
-						uni.createSelectorQuery().select(".screen-coin-select-text-two").boundingClientRect((
-							data) => {
-							uni.pageScrollTo({
-								duration: 0,
-								scrollTop: -res.top + data.top + 350,
-							})
-						}).exec()
-					}).exec()
-				} else {
-					this.coinShow = false
-				}
+			
+			// 切换分类
+			changeClassify(e) {
+				console.log(e);
+				this.classifyIndex = e.index
+				console.log(this.classifyIndex);
 			},
 
-			//排序切换
-			ascSelect() {
-				if (this.ascShow == false) {
-					this.ascShow = true
-					this.coinShow = false
-
-					uni.createSelectorQuery().select(".core-cla").boundingClientRect((res) => {
-						uni.createSelectorQuery().select(".screen-coin-select-text").boundingClientRect((data) => {
-							uni.pageScrollTo({
-								duration: 0, //过渡时间必须为0，uniapp bug，否则运行到手机会报错
-								scrollTop: -res.top + data.top,
-							})
-						}).exec()
-					}).exec()
-
+			// 跳转点击事件
+			toCoreRange(type, data, name) {
+				if (type == "link") {
+					uni.navigateTo({
+						url: `/packageOperate/webview/index?url=${ data }`,
+					})
 				} else {
-					this.ascShow = false
+					uni.navigateTo({
+						url: `/packageGoods/core/index?type=${ type }&data=${ data }&name=${ name }`,
+					})
 				}
 			},
 
-			selectCoin(item, index) {
-				this.actionIndex = index
-				this.actionInfo = this.coinList[this.actionIndex]
-				this.coinShow = false
-				this.coinNum.startPrice = item.min
-				this.coinNum.endPrice = item.max
-				this.pageList()
-			},
-
-			selectCoinTwo(item, index) {
-				this.ascListIndex = index
-				this.ascListsingle = this.ascList[this.ascListIndex]
-				this.ascShow = false
-
-				if (item.data == '') {
-					this.orderByColumn = ''
-					this.isAsc = ''
-				} else {
-					this.isAsc = item.data
-					this.orderByColumn = 'exchangePrice'
-				}
-
-				this.pageListTwo()
+			toGoodsDetail(item) {
+				uni.navigateTo({
+					url: `/packageGoods/goods/detail?id=${ item.goodsId }`
+				})
 			},
 		},
-
-		//精选商品
 		onReachBottom() {
 			// 判断是否有数据
 			if (this.total > this.pageNum * 20) {
@@ -577,6 +493,82 @@
 		}
 	}
 	
+	// 商品列表
+	.core-goods {
+		padding: 0 34rpx;
+		
+		&-list {
+			width: 100%;
+			justify-content: space-between;
+			flex-wrap: wrap;
+			
+			&-item {
+				flex-direction: column;
+				justify-content: flex-start;
+				width: 48%;
+				// height: 520rpx;
+				padding-bottom: 36rpx;
+				background: #FFFFFF;
+				box-shadow: 0px 0px 3px 0px rgba(100, 100, 100, 0.1);
+				border-radius: 16rpx;
+				margin-bottom: 30rpx;
+				
+				.image-wrap {
+					width: 100%;
+					height: 320rpx;
+					margin-bottom: 18rpx;
+					
+					image {
+						width: 100%;
+						height: 100%;
+					}
+				}
+				
+				.content {
+					width: 100%;
+					padding: 0 22rpx;
+					
+					&-title {
+						height: 28rpx;
+						font-size: 28rpx;
+						line-height: 28rpx;
+						font-weight: bold;
+						margin-bottom: 40rpx;
+					}
+					
+					&-coin {
+						height: 30rpx;
+						font-size: 24rpx;
+						justify-content: flex-start;
+						margin-bottom: 34rpx;
+						
+						&__left {
+							margin-right: 24rpx;
+							
+							image {
+								width: 34rpx;
+								height: 30rpx;
+							}
+						}
+						
+						&__right {
+							color: #666666;
+							text-decoration: line-through;
+						}
+					}
+					
+					&-price {
+						font-size: 24rpx;
+						color: #666666;
+					}
+				}
+			}
+			
+			&-item:last-child {
+				box-shadow: none;
+			}
+		}
+	}
 </style>
 <style lang="scss" scoped>
 	.u-nav-slot {