品类推荐

apis/interfaces/store.js

@@ -21,7 +21,15 @@ const goods = (id) => {
 	})
 }
 
+// 套餐列表
+const meals = (id) => {
+	return request({
+		url: 'mall/meals/' + id
+	})
+}
+
 export {
 	mall,
-	goods
+	goods,
+	meals
 }

pages.json

@@ -17,7 +17,7 @@
 		"path": "pages/store/index",
 		"name": "Store",
 		"style": {
-			"navigationBarTitleText": "健康生活",
+			"navigationBarTitleText": "健康生活",
 			"enablePullDownRefresh": true,
 			"app-plus": {
 				"titleNView": {
@@ -38,22 +38,22 @@
 		"name": "User",
 		"style": {
 			"navigationBarTitleText": "我的",
-			"navigationBarTextStyle":"white",
-			"app-plus": {
-				"titleNView": {
-					"backgroundImage": "linear-gradient(to right, #34ce98, #22aa98)",
-					"type": "transparent"
-				}
+			"navigationBarTextStyle": "white",
+			"app-plus": {
+				"titleNView": {
+					"backgroundImage": "linear-gradient(to right, #34ce98, #22aa98)",
+					"type": "transparent"
+				}
 			}
 		}
 	}, {
 		"path": "pages/auth/auth",
 		"name": "Auth",
 		"style": {
-			"navigationBarTitleText": "登录",
-			"navigationStyle":"custom",
-			"app-plus":{
-				"animationType":"slide-in-bottom"
+			"navigationBarTitleText": "登录",
+			"navigationStyle": "custom",
+			"app-plus": {
+				"animationType": "slide-in-bottom"
 			}
 		}
 	}, {
@@ -75,7 +75,7 @@
 		"style": {
 			"navigationBarTitleText": "确认订单",
 			"enablePullDownRefresh": false
-		}
+		}
 	}, {
 		"path": "pages/order/index",
 		"name": "Order",
@@ -105,11 +105,20 @@
 			"enablePullDownRefresh": false
 		}
 	}, {
-		"path": "pages/pay/pay",
+		"path": "pages/pay/pay",
+		"name": "Pay",
 		"style": {
 			"navigationBarTitleText": "收银台",
 			"navigationBarBackgroundColor": "#FFFFFF"
 		}
+	}, {
+		"path": "pages/store/list",
+		"name": "StoreList",
+		"style": {
+			"navigationBarTitleText": "列表",
+			"navigationBarBackgroundColor": "#FFFFFF",
+			"enablePullDownRefresh": true
+		}
 	}],
 	"tabBar": {
 		"borderStyle": "white",

pages/store/index.vue

@@ -39,16 +39,13 @@
 		</view>
 		<!-- 推荐品类 -->
 		<view class="card-box">
-			<view class="card-box-item" style="backgrond: #fef2ae">
-				<view class="card-title">宝贝爱吃</view>
-				<view class="card-subtitle">精选食谱 三餐美味</view>
-				<image class="card-cover" src="@/static/store/store_icon_00.png" mode="aspectFill"></image>
-			</view>
-			<view class="card-box-item" style="backgrond: #c9ead9">
-				<view class="card-title">轻卡小食</view>
-				<view class="card-subtitle">火热商品 一目了然</view>
-				<image class="card-cover" src="@/static/store/store_icon_01.png" mode="aspectFill"></image>
-			</view>
+			<block v-for="(item, index) in meals" :key="index">
+				<view class="card-box-item" :style="{'backgrond': item.color}" @click="$Router.push({name: 'StoreList', params: {id: item.meal_id}})">
+					<view class="card-title">{{item.title}}</view>
+					<view class="card-subtitle">{{item.subtitle}}</view>
+					<image class="card-cover" :src="item.cover" mode="aspectFill"></image>
+				</view>
+			</block>
 		</view>
 		<!-- goods -->
 		<view class="goods-box">
@@ -71,7 +68,8 @@
 				banners		: [],
 				goodTabs	: [],
 				newGood 	: [],
-				goodsArr	: []
+				goodsArr	: [],
+				meals		: []
 			};
 		},
 		mounted(){
@@ -80,11 +78,15 @@
 		methods:{
 			getMall(){
 				mall().then(res => {
-					this.banners = res.banners
-					this.goodsArr = res.goods
-					this.newGood = res.news
-					this.goodTabs = res.categories
+					console.log(res)
+					this.banners 	= res.banners
+					this.goodsArr 	= res.goods
+					this.newGood 	= res.news
+					this.goodTabs 	= res.categories
+					this.meals	  	= res.meals
 					uni.stopPullDownRefresh()
+				}).catch(err => {
+					console.log(err)
 				})
 			}
 		},

pages/store/list.vue

@@ -0,0 +1,32 @@
+<template>
+	<view>
+		<oct-goods
+			:lists="goodsArr"
+			color="#e6576b"
+			@onGoods="$Router.push({ name: 'StoreGoods', params: {id: $event.goods_id}})"
+		/>
+	</view>
+</template>
+
+<script>
+	import { meals } from "@/apis/interfaces/store"
+	export default {
+		data() {
+			return {
+				goodsArr: []
+			};
+		},
+		mounted(){
+			meals(this.$Route.query.id).then(res => {
+				uni.setNavigationBarTitle({
+					title: res.title
+				})
+				this.goodsArr = res.items
+			})
+		}
+	}
+</script>
+
+<style lang="scss">
+
+</style>