完成活动页UI

pages.json

@@ -938,6 +938,13 @@
 				"navigationBarTitleText": "热销榜单",
 				"navigationStyle": "custom"
 			}
+		},
+		{
+			"path" : "pages/index/activity/goods",
+			"style" : {
+				"navigationBarTitleText": "家居专场",
+				"navigationStyle": "custom"
+			}
 		}
     ],
 	"globalStyle": {

pages/index/activity/goods.vue

@@ -0,0 +1,86 @@
+<template>
+	<view>
+		<lf-nav title="家具专场" :showIcon="true" bgColor="transparent" :spreadOut="false"></lf-nav>
+		<view class="head">
+			<image class="img" mode="aspectFill" src="https://picsum.photos/200/300?grayscale"></image>
+		</view>
+		<view class="content">
+			<view class="card" v-for="(item, index) in 14" :key="index">
+				<image class="goods-img"></image>
+				<view class="goods-info">
+					<view class="goods-title lf-line-2">房间装饰品套装-简约风格</view>
+					<view class="goods-price">￥598</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return {
+				
+			}
+		},
+		onLoad(){
+			
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped="scoped">
+	.head{
+		width: 750rpx;
+		height: 430rpx;
+		position: relative;
+		.img{
+			width: 100%;
+			height: 100%;
+		}
+	}
+	
+	.content{
+		padding: 30rpx 32rpx;
+		display: flex;
+		flex-wrap: wrap;
+		.card{
+			width: 220rpx;
+			height: max-content;
+			background: #FFFFFF;
+			box-shadow: 0rpx 2rpx 8rpx 1rpx rgba(0, 0, 0, 0.1);
+			border-radius: 0rpx 0rpx 10rpx 10rpx;
+			display: flex;
+			flex-direction: column;
+			margin-right: 13rpx;
+			&:nth-child(3n){
+				margin-right: 0rpx;
+			}
+			&:nth-child(n+4){
+				margin-top: 13rpx;
+			}
+			.goods-img{
+				width: 220rpx;
+				height: 220rpx;
+				background-color: #EEEEEE;
+				border-radius: 10rpx 10rpx 0rpx 0rpx;
+			}
+			.goods-info{
+				padding: 15rpx;
+				.goods-title{
+					font-size: 26rpx;
+					color: #222222;
+					margin-bottom: 10rpx;
+				}
+				.goods-price{
+					font-size: 32rpx;
+					color: #222222;
+					margin-bottom: 5rpx;
+				}
+			}
+		}
+	}
+</style>

pages/index/index/index.vue

@@ -88,7 +88,7 @@
 						</view>
 					</view>
 					<!-- 活动页入口 TODO -->
-					<view class="lf-activity" v-if="item.name == 'micro_page_componet_nav' && item.value && item.value.length" @click="$msg('活动页入口')">
+					<view class="lf-activity" v-if="item.name == 'micro_page_componet_nav' && item.value && item.value.length" @click="$url('/pages/index/activity/goods')">
 						<image src="https://picsum.photos/200" mode="aspectFill"></image>
 					</view>
 					<!-- TODO 新做秒杀模块 -->