商城首页

pages/shop/index.vue

@@ -41,14 +41,14 @@
 				<view style="clear: both;"></view>
 			</tm-sheet> -->
 			<tm-sheet :shadow="24" class="jiaoxi xiao">
-				<tm-tabs align="center" class="qiehuan1" v-model="activeIndex" :list="list2" range-key="title" @change="changeTab"></tm-tabs>
+				<tm-tabs align="center" class="qiehuan1" v-model="activeIndex" :list="list2" range-key="title" @change="changeTab(activeIndex)"></tm-tabs>
 			</tm-sheet>
 			<tm-sheet :shadow="24" class="jiaoxi xiao" style="height:160px;">
-				<tm-dragGrid  :list="list1" :col="3" disabled="false" class="mt-40 mb-40 remen" :icon-size="160">
+				<tm-dragGrid  :list="list1" :col="3" disabled="false" class="mt-40 mb-40 remen" :icon-size="160" v-if="list1.length!=0">  
 					<template v-slot:default="{item}">
 						<view class="flex-center flex-col" @click="tiaozhuan()">
-							<tm-icons :size="160" :name="item.image" :color="item.color"></tm-icons>
-							<text class="text-size-m text-white pt-10">{{item.category_name}}</text>
+							<tm-icons :size="160" :name="item.icon" :color="item.color"></tm-icons>
+							<text class="text-size-m text-white pt-10">{{item.text}}</text>
 							<text class="text-size-m text-white pt-10">{{item.jie}}</text>
 						</view>
 					</template>
@@ -63,7 +63,7 @@
 			</view>
 		</view>
 		<view style="height:160px;" class="mt-40 jiage pt-40">
-			<tm-dragGrid :list="list4" :col="3" disabled="false" class="remen" :icon-size="160">
+			<tm-dragGrid :list="list4" :col="3" disabled="false" class="remen" :icon-size="160" v-if="list4.length!=0">
 				<template v-slot:default="{item}">
 					<view class="flex-center flex-col" @click="xiangqing">
 						<tm-icons :size="200" :name="item.icon" :color="item.color"></tm-icons>
@@ -110,36 +110,31 @@ export default {
 				// {icon:'/static/img/74.png',text:'更多'},
 			],
 			list4:[
-				{icon:'/static/img/83.png',text:'双面穿千鸟格风衣',jie:'¥ 899.00'},
-				{icon:'/static/img/84.png',text:'休闲版型风衣',jie:'¥ 899.00'},
-				{icon:'/static/img/85.png',text:'防水双面穿风衣',jie:'¥ 899.00'},
+				// {icon:'/static/img/83.png',text:'双面穿千鸟格风衣',jie:'¥ 899.00'},
+				// {icon:'/static/img/84.png',text:'休闲版型风衣',jie:'¥ 899.00'},
+				// {icon:'/static/img/85.png',text:'防水双面穿风衣',jie:'¥ 899.00'},
 			],
 			list5:[ '推荐单品'],
-			test: [{
-				img: '../../static/img/83.png',
-				title: '丝缎质感纹理风衣',
-				label: '黑色 - 6518/320',
-				price: '1299',
-				id: 3,
-				buy: 0,
-				itemId: 0
-			},{
-				img: '../../static/img/84.png',
-				title: '产品3（任选）',
-				label: '这个产品是只有几个融会',
-				price: 36.2,
-				id: 3,
-				buy: 0,
-				itemId: 0
-			},{
-				img: '../../static/img/83.png',
-				title: '产品3（任选）',
-				label: '这个产品是只有几个融会',
-				price: 36.2,
-				id: 3,
-				buy: 0,
-				itemId: 0
-			}],
+			test: [
+			// 	{
+			// 	img: '../../static/img/83.png',
+			// 	title: '丝缎质感纹理风衣',
+			// 	label: '黑色 - 6518/320',
+			// 	price: '1299',
+			// 	id: 3,
+			// 	buy: 0,
+			// 	itemId: 0
+			// },
+			// {
+			// 	img: '../../static/img/84.png',
+			// 	title: '产品3（任选）',
+			// 	label: '这个产品是只有几个融会',
+			// 	price: 36.2,
+			// 	id: 3,
+			// 	buy: 0,
+			// 	itemId: 0
+			// }
+			],
 			typeclick:1,//1加入购物车，2购物车
 			gouwuche:[],
 		};
@@ -151,7 +146,9 @@ export default {
 		this.sys = uni.getSystemInfoSync();
 		this.getSort()
 		this.getBanner()
-		this.changeTab();
+		this.changeTab(1);
+		this.getHot();
+		this.getRecommend()
 	},
 	methods: {
 		getBanner(){
@@ -202,7 +199,7 @@ export default {
 		},
 		
 		// 热门、折扣
-		changeTab(){
+		changeTab(activeIndex){
 				let that = this;
 						myRequest({
 							url: "/api/ShopGoods/thenBuckle",
@@ -213,6 +210,7 @@ export default {
 						}).then(res => {
 							console.log(res.data);
 							if (res.data.code == 200) {
+								that.list1=[];
 								res.data.data.forEach(item => {
 									that.list1.push({
 										icon: item.image,
@@ -226,8 +224,55 @@ export default {
 								})
 							}
 						})
+		},	
+		getHot(){
+			let that = this;
+					myRequest({
+						url: "/api/ShopGoods/popularGoods",
+						method: 'get',
+					}).then(res => {
+						console.log(res.data);
+						if (res.data.code == 200) {
+							res.data.data.forEach(item => {
+								that.list4.push({
+									icon: item.image,
+									text:item.goods_name,
+									// jie:item.sale_price
+								})
+							})
+						} else {
+							that.$refs.toast.show({
+								model: 'error',
+								label: res.data.msg
+							})
+						}
+					})
+		},
+		getRecommend(){
+			let that = this;
+					myRequest({
+						url: "/api/ShopGoods/recommend",
+						method: 'get',
+					}).then(res => {
+						console.log(res.data);
+						if (res.data.code == 200) {
+							res.data.data.forEach(item => {
+								that.test.push({
+									img: item.image,
+									title:item.goods_name,
+									price:item.sale_price,
+									itemId:item.id
+									// label:''
+								})
+							})
+						} else {
+							that.$refs.toast.show({
+								model: 'error',
+								label: res.data.msg
+							})
+						}
+					})
 		},
-		
 		tiaozhuan(){
 			uni.navigateTo({
 				url: "/pages/gengduo/index",