视频页面

common/styles/global/pages.scss

@@ -475,7 +475,31 @@
 	width: 100%;height: 100vh;background-color: #0ab2f0;position: relative;
 	padding-top:var(--status-bar-height);display: flex;flex-direction: column;
 	@include ezy-no-repeat-cover(bottom);background-image: url("@/static/images/exam/exam-shiti-bj.png");
-	
+	.course-video-box{
+		width: 100%;height: 400rpx!important;flex-shrink: 0;position: relative;
+		.prism-big-play-btn{top: 50%;left: 50%!important;transform: translate(-50%, -50%);
+		}
+	}
+	.course-content-border{
+		width: 100%;display: flex;flex: 1;position: relative;
+		background-color: rgba(255, 255, 255, 0.6);overflow-y: auto;
+	}
+	.course-content-box{
+		flex: 1;margin: 20rpx 20rpx 0;background-color: #fff;overflow-y: auto;
+		box-sizing: border-box;padding: 42rpx 24rpx;
+	}
+	.course-content-item{
+		width: 100%;background-color: #f7f8fa;border-radius: 8rpx;
+		display: flex;box-sizing: border-box;padding: 20rpx;margin-bottom: 24rpx;
+		}
+	.course-title{color: #088aea;font-size: 42rpx;margin-bottom: 20rpx;}
+	.course-play-btn{width: 48rpx;height: 48rpx;margin-right: 20rpx;
+		@include ezy-no-repeat-cover;background-image: url("@/static/images/course/video-play.png");
+	}
+	.course-content{
+		display: flex;flex-direction: column;color: #666;font-size: 32rpx;
+		.content-kcwz{font-size: 28rpx;margin-top: 16rpx;}
+	}
 }	
 	
 	// height:$titleBar-tabBar-page;

pages/study/lookShipin.vue

@@ -1,18 +1,26 @@
 <template>
-	<view @click="goUpPage">
-		视频播放
+	<view class="ezy-course-page">
+		<view class="icon-title-navBar-box">
+			<view @click="goUpPage" class="nav-bar-icon"></view>
+			<text class="nav-bar-title">视频播放</text>
+		</view>
+		<view ref="videoContent" id="wgy-player-test" :playAuth="playAuth" :change:playAuth="renderScript.receiveMsg"
+			:progressMarkers="progressMarkers" :change:progressMarkers="renderScript.progressMarkersMsg"
+			:seekTime="seekTime" :change:seekTime="renderScript.seekTimeFun" class="course-video-box">
+		</view>
+		<view class="course-content-border">
+			<view class="course-content-box">
+				<view class="course-title">第一节 时间的计算</view>
+				<view v-for="(item,index) in progressMarkers" :key="index" @click="markersClick(item)" class="course-content-item">
+					<view class="course-play-btn"></view>
+					<view class="course-content">
+						<text>{{item.title}}</text>
+						<text class="content-kcwz">课程位置：{{item.time}}</text>
+					</view>
+				</view>
+			</view>
+		</view>
 	</view>
-	<view ref="videoContent" id="wgy-player-test" :playAuth="playAuth" :change:playAuth="renderScript.receiveMsg"
-		:progressMarkers="progressMarkers" :change:progressMarkers="renderScript.progressMarkersMsg"
-		:seekTime="seekTime" :change:seekTime="renderScript.seekTimeFun">
-	</view>
-	<view>
-		第一节 时间的计算
-	</view>
-	<view>
-		第一单元 时、分、秒
-	</view>
-	<view v-for="(item,index) in progressMarkers" :key="index" @click="markersClick(item)">标点</view>
 </template>
 
 <script>