chore(diy-article): 支持diy-article 组件关于滚动控制的参数化设置

components/diy-components/diy-article.vue

@@ -3,8 +3,14 @@
 		<view class="article-wrap" :style="warpCss">
 			<view :class="['list-wrap', value.style]" :style="warpCss">
 				<!-- 自动垂直滚动 -->
-				<swiper class="auto-scroll-swiper" vertical="true" autoplay="true" circular="true" 
-					interval="3000" duration="500" display-multiple-items="3">
+				<swiper class="auto-scroll-swiper" 
+					:style="swiperStyle"
+					:vertical="swiperConfig.vertical !== false"
+					:autoplay="swiperConfig.autoplay !== false"
+					:circular="swiperConfig.circular !== false"
+					:interval="swiperConfig.interval || 3000"
+					:duration="swiperConfig.duration || 500"
+					:display-multiple-items="swiperConfig.displayMultipleItems || 3">
 					<swiper-item v-for="(item, index) in list" :key="index" @click="toDetail(item)">
 						<view class="swiper-item-content">
 							<view :class="['item', value.ornament.type]" :style="itemCss">
@@ -41,18 +47,18 @@
 			}
 		},
 		data() {
-		return {
-			list: [],
-			loading: true,
-			skeletonConfig: {
-				gridRows: 1,
-				gridRowsGap: '40rpx',
-				headWidth: '160rpx',
-				headHeight: '160rpx',
-				textRows: 2
-			}
-		};
-	},
+			return {
+				list: [],
+				loading: true,
+				skeletonConfig: {
+					gridRows: 1,
+					gridRowsGap: '40rpx',
+					headWidth: '160rpx',
+					headHeight: '160rpx',
+					textRows: 2
+				}
+			};
+		},
 		created() {
 			this.getList();
 		},
@@ -63,6 +69,10 @@
 			}
 		},
 		computed: {
+			// 获取swiper配置，默认空对象
+			swiperConfig() {
+				return this.value?.swiperConfig || {};
+			},
 			warpCss() {
 				var obj = '';
 				obj += 'background-color:' + this.value.componentBgColor + ';';
@@ -74,6 +84,15 @@
 				}
 				return obj;
 			},
+		    // swiper容器样式
+			swiperStyle() {
+				// 从swiperConfig获取高度，默认600rpx
+				const height = this.swiperConfig.swiperHeight || 600;
+				return {
+					height: height + 'rpx',
+					width: '100%'
+				};
+			},
 			// 子项样式
 			itemCss() {
 				var obj = '';
@@ -130,21 +149,29 @@
 <style lang="scss">
 	.article-wrap {
 		.list-wrap {
-			&.style-1 {
-				.auto-scroll-swiper {
-					height: 480rpx;
-					width: 100%;
-				}
+			.auto-scroll-swiper {
+				height: 600rpx; /* 可以根据需要调整高度 */
+				width: 100%;
+				
 				.swiper-item-content {
-					width: 100%;
+					padding: 10rpx 20rpx;
 					box-sizing: border-box;
 				}
+			}
+			
+			.item {
+				margin: 0;
+				margin-bottom: 24rpx;
+			}
+			
+			.style-1 .item {
+				padding: 20rpx;
+			}
+			
+			&.style-1 {
 				.item {
 					display: flex;
-					padding: 20rpx;
-					margin-top: 24rpx;
-					height: 120rpx;
-					box-sizing: border-box;
+					margin-top: 0;
 
 					&:first-of-type {
 						margin-top: 0;