提交

src/pages/questionBank/videoDetail.vue

@@ -2,12 +2,18 @@
 	<view>
 		<sunny-video style="width: 100%" videoHeight="422rpx" ref="sunny-video" title="测试视频" src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/%E7%AC%AC1%E8%AE%B2%EF%BC%88uni-app%E4%BA%A7%E5%93%81%E4%BB%8B%E7%BB%8D%EF%BC%89-%20DCloud%E5%AE%98%E6%96%B9%E8%A7%86%E9%A2%91%E6%95%99%E7%A8%8B@20200317.mp4" @timeupdate="timeupdate" />
 		<view class="p14 bc-fff">
+		<u-scroll-list :indicator="false" v-if="videoType=='test'">
+			<view class="flex ai-c jc-sb mt15">
+				<view class="tab_iem mr15" :class="videoIndex===item.value?'checked_tab':''" v-for="(item,index) of testList" :key="index" @tap="checkTest(item.value)">{{item.label}}</view>
+			</view>
+			</u-scroll-list>
 			<view class="flex ai-c jc-sb mt10 wp100">
 				<text class="fs18 fw600 cor-000">C1捷达-基础操作视频讲解</text>
-				<view class="flex" @tap="popupShow=true">
+				<view class="flex" @tap="popupShow=true" v-if="videoType!='test'">
 					<text class="fs14 cor-666">更多</text>
 					<u-icon color="#666" name="arrow-right" size="18"></u-icon>
 				</view>
+				<view v-else class="fs14 cor-666">共9条路线</view>
 			</view>
 			<view>
 			</view>
@@ -53,6 +59,30 @@
 	export default{
 		data(){
 			return{
+				videoIndex:0,
+				testList:[{
+				label:"八一考场",
+				value:0,
+			},{
+				label:"富凯考场",
+				value:1
+			},{
+				label:"新亚考场",
+				value:2
+			},{
+				label:"庐江考场",
+				value:3
+			},{
+				label:"富凯考场",
+				value:4
+			},{
+				label:"新亚考场",
+				value:5
+			},{
+				label:"庐江考场",
+				value:6
+			}],
+				videoType:'',
 				popupShow:false,
 				nowVideo:0,
 				videoList:[{
@@ -82,7 +112,15 @@
 				}]
 			}
 		},
+		onLoad(op){
+			if(op.type){
+				this.videoType=op.type
+			}
+		},
 		methods:{
+			checkTest(val){
+				this.videoIndex=val
+			},
 			checkVideo(val){
 				this.nowVideo=val
 			}
@@ -130,4 +168,17 @@
 		background: #00B74F;
 		border-radius: 8rpx;
 	}
+	.tab_iem{
+		width: 145rpx;
+		height: 56rpx;
+		line-height: 56rpx;
+		text-align: center;
+		background: #F5F5F5;
+		border-radius: 10rpx;
+		color:#333
+		}
+	.checked_tab{
+		background: linear-gradient(90deg, #11DF20 0%, #01B74F 100%);
+		color:#fff
+	}
 </style>