feat: 主页的接口对接

pages/module/OneFeelMK001.vue

@@ -1,54 +1,59 @@
 <template>
 	<view class="container">
-		<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
-				:duration="duration">
-				<swiper-item>
-					<view class="swiper-item uni-bg-red">A</view>
-				</swiper-item>
-				<swiper-item>
-					<view class="swiper-item uni-bg-green">B</view>
-				</swiper-item>
-				<swiper-item>
-					<view class="swiper-item uni-bg-blue">C</view>
-				</swiper-item>
-			</swiper>
+		<swiper class="swiper" circular 
+		:indicator-dots="activityList.length > 1" 
+		indicator-color="#FFFFFF"
+		indicator-active-color="#00A6FF"
+		:autoplay="autoplay" 
+		:interval="interval"	
+		:duration="duration">
+			<swiper-item v-for="item in activityList" :key="item.id">
+				<view class="swiper-item">
+					<image :src="item.activityCover" mode="aspectFill"></image>
+				</view>
+			</swiper-item>		
+		</swiper>
 		
 	</view>
 </template>
 
-<script>
+<script setup>
+	import { ref } from 'vue'
+
+	const autoplay = ref(true)
+	const interval = ref(3000)
+	const duration = ref(500)
+
+	const props = defineProps({
+	  activityList: {
+	    type: Array,
+	    default: []
+	  }
+	})
+
 </script>
 
 <style scoped lang="scss">
 	.container {
+		margin-bottom: 6px;
+		
 		.uni-margin-wrap {
-			width: 690rpx;
 			width: 100%;
 		}
 		.swiper {
-			height: 300rpx;
+			height: 120px;
 			border-radius: 8px;
 		}
 		.swiper-item {
 			display: block;
-			height: 300rpx;
-			line-height: 300rpx;
+			height: 120px;
+			line-height: 120px;
 			text-align: center;
 		}
-		
-		.uni-bg-red {
-			background-color: red;
-		}
-		
-		.uni-bg-green {
-			background-color: green;
-		}
-		
-		.uni-bg-blue {
-			background-color: blue;
-		}
-
-		
-		
+		.swiper-item image {
+			width: 100%;
+			height: 100%;
+			border-radius: 8px;
+		}		
 	}
 </style>

pages/module/OneFeelMK002.vue

@@ -1,19 +1,29 @@
 <template>
 	<view class="container">
 		<view class="mk-title">
-			<text class="title">避世放松 能量调节</text>
+			<text class="title"> {{ recommendTheme.themeName }}</text>
 		    <image class="wave" src="@/static/wave_icon.png" mode="widthFix"/>
 		</view>
 		<view class="container-scroll">
-			<view class="mk-card-item" v-for="(item, index) in 8" :key="index">
-				<image src="/static/test/mk_img_1.png"></image>
-				<text>#森系环境 #出工人必备-{{item}}</text>
+			<view class="mk-card-item" v-for="(item, index) in recommendTheme.recommendPostsList" :key="index">
+				<image :src="item.coverPhoto" mode="widthFix"></image>
+				<text>{{ item.topic }}</text>
 			</view>
 		</view>
 	</view>
 </template>
 
 <script setup>
+	
+	
+
+defineProps({
+	recommendTheme: {
+		type: Object,
+		default: {}
+	}
+})
+
 </script>
 
 <style lang="scss" scoped>
@@ -53,6 +63,7 @@
 			.mk-card-item {
 				display: flex;
 				flex-direction: column;
+				align-items: start;
 				width: 188px;
 				height: 154px;
 				background-color: #ffffff;