first commit

2024-12-02 10:39:36 +08:00
commit f1f5b666b5
464 changed files with 81372 additions and 0 deletions
--- a/components/recommendVideo/recommendVideo.vue
+++ b/components/recommendVideo/recommendVideo.vue
@@ -0,0 +1,157 @@
+<template>
+	<view>
+		<view class="list flex align-center justify-center">
+			<view class="list-box">
+				<view class="list-box-title flex align-center justify-between">
+					<view class="list-box-title-name">
+						{{title}}
+					</view>
+					<view @click="clickItem('more')" class="list-box-title-more flex align-center">
+						查看更多
+						<u-icon name="arrow-right" color="#666666" size="24"></u-icon>
+					</view>
+				</view>
+				<view class="list-box-video flex justify-between">
+					<view @click="clickItem('video',item)" class="list-box-video-item" v-for="(item,index) in list"
+						:key="index">
+						<view class="list-box-video-item-img">
+							<u-image width="100%" height="100%" border-radius="24rpx" mode="aspectFill"
+								:src="item.titleImg"></u-image>
+							<view class="list-box-video-item-img-txt" v-if="item.over == 1">
+								共{{item.courseDetailsCount?item.courseDetailsCount:0}}集
+							</view>
+							<view class="list-box-video-item-img-txt" v-else>
+								更新至{{item.courseDetailsCount?item.courseDetailsCount:0}}集
+							</view>
+						</view>
+						<view class="list-box-video-item-videoTitle">
+							{{item.title}}
+						</view>
+						<view class="list-box-video-item-tips" v-if="item.courseLabel">
+							{{item.courseLabel.split(',')[0]}}
+						</view>
+					</view>
+					<view v-if="list.length==2" class="list-box-video-item" style="height: 0;"></view>
+				</view>
+
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "recommendVideo",
+		props: {
+			//视频数组
+			list: {
+				type: Array,
+				default: []
+			},
+			//模块标题
+			title: {
+				type: String,
+				default: '本周热门'
+			},
+			//模块类型
+			typeId: {
+				type: String,
+				default: ''
+			}
+		},
+		data() {
+			return {
+
+			};
+		},
+
+		methods: {
+			/**
+			 * @param {string} type 点击类型 more:更多  video:视频
+			 * @param {Object} item 参数
+			 * 点击事件
+			 */
+			clickItem(type, item) {
+				if (type == 'more') { //查看更多
+					this.$emit(type, this.typeId)
+				} else { //查看视频
+					this.$emit(type, item)
+				}
+
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.list {
+		width: 100%;
+		height: auto;
+		margin-top: 30rpx;
+
+		.list-box {
+			width: 686rpx;
+			height: 100%;
+			background-color: #ffffff;
+
+		}
+
+		.list-box-title-name {
+			color: #333333;
+			font-size: 32rpx;
+			font-weight: bold;
+		}
+
+		.list-box-title-more {
+			color: #666666;
+			font-size: 24rpx;
+			font-weight: normal;
+		}
+
+		.list-box-video {
+			width: 100%;
+			margin-top: 20rpx;
+
+			.list-box-video-item {
+				width: 220rpx;
+				height: auto;
+			}
+
+			.list-box-video-item-img {
+				width: 100%;
+				height: 280rpx;
+				position: relative;
+
+				.list-box-video-item-img-txt {
+					position: absolute;
+					bottom: 10rpx;
+					right: 10rpx;
+					color: #FFFFFF;
+					font-size: 22rpx;
+				}
+			}
+
+			.list-box-video-item-videoTitle {
+				margin-top: 18rpx;
+				width: 100%;
+				color: #333333;
+				font-size: 28rpx;
+				font-weight: 500;
+				overflow: hidden;
+				white-space: nowrap;
+				text-overflow: ellipsis;
+				-o-text-overflow: ellipsis;
+			}
+
+			.list-box-video-item-tips {
+				width: fit-content;
+				color: #666666;
+				font-size: 22rpx;
+				background-color: #F2F5FF;
+				border-radius: 6rpx;
+				margin-top: 6rpx;
+				padding: 10rpx;
+			}
+		}
+	}
+</style>