我的订单+我的

components/list/WaterFall.nvue

@@ -0,0 +1,63 @@
+<template>
+	<view class="video-list">
+		<waterfall
+			class="waterfall"
+			column-count="2"
+			column-gap="10"
+			left-gap="10"
+			right-gap="10"
+		>
+			<cell
+			class="cell"
+			:key="item.videoId"
+			v-for="item in lists">
+				<navigator
+				class="video-item"
+				hover-class="navigator-hover"
+				:url="`/pages/detail/detail?videoId=${item.videoId}&userId=${item.userId}`">
+					<image class="video-cover" :src="item.videoCover"></image>
+					<text class="video-title">{{ item.videoTitle }}</text>
+				</navigator>
+			</cell>
+		</waterfall>
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"VideoList",
+		data() {
+			return {
+				
+			};
+		},
+		props: {
+			lists: {
+				type: Array,
+				default: []
+			},
+			column: {
+				type: Number,
+				default: 1
+			}
+		}
+	}
+</script>
+
+<style lang="stylus" scoped>
+	.video-list
+		flex 1
+		.waterfall 
+			flex 1
+			.video-cover
+				width 350rpx
+				height 196rpx
+				border-radius 10rpx
+			.video-title
+				margin 20rpx 0
+				font-size 28rpx
+				color #333333
+				text-overflow ellipsis
+				lines 1
+				
+</style>