商城完善

packageGoods/goods/list.vue

@@ -1,6 +1,6 @@
 <template>
 	<view>
-		<u-navbar title="商品列表" :border="true" :placeholder="true" :autoBack="true" bgColor="#fff" />
+		<u-navbar :title="name" :border="true" :placeholder="true" :autoBack="true" bgColor="#fff" />
 		<!-- 固定nav -->
 		<view class="fixed-top">
 			<!-- 搜索 -->
@@ -50,6 +50,9 @@
 				<view class="goods-list-item"></view>
 			</view>
 		</view>
+		<view class="flex empty" v-if="!list.length && !loading">
+			<u-empty text="暂无商品" mode="order" />
+		</view>
 	</view>
 </template>
 
@@ -63,6 +66,9 @@
 				total: 0,
 				list: [],
 				title: '',
+				name: '商品列表',
+				tagIds: null,
+				categoryId: null,
 				choiceIndex: 1,
 				priceSort: null,
 				saleSort: null,
@@ -71,8 +77,12 @@
 		},
 		
 		onLoad(opthios) {
-			console.log(opthios);
 			this.title = opthios.title
+			if(opthios.name) {
+				this.name = opthios.name
+				this.tagIds = opthios.tagIds
+				this.categoryId = opthios.categoryId
+			}
 		},
 		
 		onShow() {
@@ -96,13 +106,14 @@
 					goodsName: this.title,
 					priceSort: this.priceSort,
 					saleSort: this.saleSort,
+					tagIds: this.tagIds,
+					categoryId: this.categoryId,
 					noToken: true
 				}
 				$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 => {
 								item.picUrl = env.filePublic + item.picUrl.split(',')[0] + '?imageView2/2/w/340'
 							})
@@ -277,4 +288,8 @@
 			}
 		}
 	}
+	
+	.empty {
+		height: 50vh;
+	}
 </style>

pages/core/index.vue

@@ -3,19 +3,14 @@
 		<!-- nav -->
 		<u-navbar leftIconSize="0" :placeholder="true" bgColor="#ffffff">
 			<view class="u-nav-slot" slot="left">
-				<text>商城</text>
+				<view class="u-nav-slot__input flex">
+					<u--input v-model="goodsTitle" placeholder="搜索商品" border="none" prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399" />
+					<view class="u-nav-slot__input__btn" @click="toGoodsList()">搜索</view>
+				</view>
 			</view>
 		</u-navbar>
 		<!-- 固定顶部搜索、分类 -->
 		<view class="fixed-top">
-			<!-- 搜索 -->
-			<view class="fixed-top-search flex">
-				<view class="fixed-top-search__input flex">
-					<u--input v-model="goodsTitle" placeholder="请输入关键词进行搜索" border="none" prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399" />
-					<view class="fixed-top-search__input__btn" @click="toGoodsList()">搜索</view>
-				</view>
-				<image src="../../static/core/core_block.png" mode="scaleToFill" @click="toGoodsCategroy"/>
-			</view>
 			<view class="fixed-top-classify">
 				<u-tabs @change="changeClassify" :scrollable="true" :list="classifyList" lineWidth="20" lineHeight="2"
 					lineColor="#FF8D0B" :activeStyle="{
@@ -33,7 +28,7 @@
 		<!-- 轮播 -->
 		<view class="core-swiper">
 			<swiper class="core-swiper-centent" circular :indicator-dots="true" :autoplay="true" :interval="3000" indicator-active-color="#fff">
-				<swiper-item class="swiper-item" v-for="(item, index) in swiperList" :key="index" @click="toCoreRange(item)">
+				<swiper-item class="swiper-item" v-for="(item, index) in swiperList" :key="index" @click="toPage(item)">
 					<image :src="item.picUrl" mode=""></image>
 				</swiper-item>
 			</swiper>
@@ -43,7 +38,7 @@
 		<view class="core-category">
 			<swiper class="core-category-swiper" :autoplay="false">
 				<swiper-item class="swiper-item" v-for="(item, index) in classifyIndex == 0 ? classifyListFilter : classifyList[classifyIndex].list" :key="index">
-					<view class="swiper-item__content" v-for="(items, indexs) in item" :key="indexs">
+					<view class="swiper-item__content" v-for="(items, indexs) in item" :key="indexs" @click="toTagGoods(items)">
 						<image :src="items.picUrl" mode="aspectFit"></image>
 						<view class="name">{{ items.name }}</view>
 					</view>
@@ -53,6 +48,7 @@
 		
 		<!-- 标签商品 -->
 		<view class="tag-goods" v-for="(item, index) in exclusiveSingle" :key="index">
+			<image class="tag-goods-imgBg" src="../../static/core/core_bg.png" mode=""></image>
 			<view class="tag-goods-content">
 				<view class="tag-goods-content-nav flex">
 					<view class="tag-goods-content-nav__left flex">
@@ -60,14 +56,14 @@
 						<view class="title">{{ item.name }}</view>
 						<image src="../../static/core/core_tag.png" mode=""></image>
 					</view>
-					<view class="tag-goods-content-nav__right flex">
+					<view class="tag-goods-content-nav__right flex" @click="toTagGoods(item)">
 						<view class="title">更多</view>
 						<image src="../../static/core/core_right.png" mode=""></image>
 					</view>
 				</view>
 				
 				<view class="tag-goods-content-list">
-					<view class="tag-goods-content-list-item flex" v-for="(items, indexs) in item.data" :key="indexs">
+					<view class="tag-goods-content-list-item flex" v-for="(items, indexs) in item.data" :key="indexs" @click="toGoodsDetail(items)">
 						<view class="image flex">
 							<image :src="items.picUrl" mode="aspectFit"></image>
 						</view>
@@ -245,7 +241,6 @@
 					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'
@@ -261,23 +256,20 @@
 			
 			// 切换分类
 			changeClassify(e) {
-				console.log(e);
 				this.classifyIndex = e.index
-				console.log(this.classifyIndex);
 			},
 
 			// 跳转点击事件
-			toCoreRange(item) {
-				console.log(item);
-				// if (type == "link") {
-				// 	uni.navigateTo({
-				// 		url: `/packageOperate/webview/index?url=${ data }`,
-				// 	})
-				// } else {
-				// 	uni.navigateTo({
-				// 		url: `/packageGoods/core/index?type=${ type }&data=${ data }&name=${ name }`,
-				// 	})
-				// }
+			toPage(item) {
+				if (item.type == "link") {
+					uni.navigateTo({
+						url: `/packageOperate/webview/index?url=${ item.linkUrl }`,
+					})
+				} else if (item.type == "tag") {
+					uni.navigateTo({
+						url: `/packageGoods/goods/list?name=${ item.name }&tagIds=${ item.goodsTags ? item.goodsTags : '' }`
+					})
+				}
 			},
 
 			// 商品详情
@@ -289,15 +281,16 @@
 			
 			// 商品列表
 			toGoodsList() {
-				console.log(this.goodsTitle);
 				uni.navigateTo({
 					url: `/packageGoods/goods/list?title=${ this.goodsTitle }`
 				})
 			},
 			
-			// 商品分类
-			toGoodsCategroy() {
-				
+			// 商品标签
+			toTagGoods(item) {
+				uni.navigateTo({
+					url: `/packageGoods/goods/list?name=${ item.name }&tagIds=${ item.tagId ? item.tagId : '' }&categoryId=${ item.categoryId ? item.categoryId : '' }`
+				})
 			},
 		},
 		onReachBottom() {
@@ -326,7 +319,36 @@
 		background-color: #fff;
 		
 		&-none {
-			height: 240rpx;
+			height: 100rpx;
+		}
+	}
+	
+	// 搜索
+	.u-nav-slot {
+		text {
+			font-size: 32rpx;
+		}
+		
+		&__input {
+			position: relative;
+			height: 70rpx;
+			width: 518rpx;
+			padding-left: 30rpx;
+			background: #F4F5F6;
+			border-radius: 35rpx;
+			
+			&__btn {
+				z-index: 200;
+				width: 140rpx;
+				height: 70rpx;
+				line-height: 70rpx;
+				font-size: 30rpx;
+				text-align: center;
+				font-weight: bold;
+				color: #fff;
+				background-color: #FF8D0B;
+				border-radius: 35rpx;
+			}
 		}
 	}
 	
@@ -433,13 +455,24 @@
 	
 	// 标签商品
 	.tag-goods {
-		border-top: 2px solid #191919;
-		border-bottom: 2px solid #191919;
-		padding: 4rpx 0;
+		display: flex;
+		align-items: center;
+		position: relative;
 		margin-bottom: 34rpx;
+		height: 400rpx;
+		
+		&-imgBg {
+			position: absolute;
+			top: 0;
+			width: 100vw;
+			height: 400rpx;
+		}
 		
 		&-content {
-			background-color: #191919;
+			width: 100vw;
+			position: absolute;
+			top: 0;
+			z-index: 5;
 			padding: 26rpx 32rpx;
 			
 			&-nav {
@@ -588,9 +621,5 @@
 	}
 </style>
 <style lang="scss" scoped>
-	.u-nav-slot {
-		text {
-			font-size: 32rpx;
-		}
-	}
+	
 </style>