视频组件 规范

components/commentsList.vue

@@ -1,15 +1,15 @@
 <template>
 	<view class="">
-		<view class="box">
+		<view class="box" v-if="sayList && sayList.length > 0">	
 			<view class="firstLeve flexbox leve" v-for="(item, index) in sayList" :key="index" style="flex-wrap: wrap;">
-				<view class="imgbox" :style="getBackGround(item.user.avatar)">
+				<view v-if="item.user && item.user != null && item.user != 'null'" class="imgbox" :style="getBackGround(item.user.avatar)">
 					<view class="img">
 						<!-- <image :src="item.user.avatar" mode="aspectFit" style="width: 80rpx; height: 80rpx;"></image> -->
 					
 					</view>
 				</view>
 				<view class="contentBox contentBoxfirstLeve">
-					<view class="name">
+					<view class="name" v-if="item.user && item.user != null && item.user != 'null'">
 						{{item.user.name == '' ? '暂无昵称': item.user.name}}
 					</view>
 					<view class="content" v-if="item.content != ''">

config/requestConfig.js

@@ -85,10 +85,12 @@ $http.getAliToken = function(callback) {
 //请求开始拦截器
 $http.requestStart = function(options) {
 	// console.log("请求开始", options);
-	if (options.load && options.data.loadAnimate != 'none') {
+	// if (options.load && options.data.loadAnimate != 'none') {
-		//打开加载动画
+	// 	//打开加载动画
-		store.commit("setLoadingShow", true);
+	// 	store.commit("setLoadingShow", true);
-	}
+	// }
+	// delete(options.loadAnimate)	
+	// console.log('options',options);
 	// 图片、视频上传大小限制
 	if (options.method == "FILE") {
 		// 文件最大字节: options.maxSize 可以在调用方法的时候加入参数

manifest.json

@@ -12,8 +12,8 @@
             "src" : "图片路径"
         }
     ],
-    "versionName" : "1.0.11",
+    "versionName" : "1.0.12",
-    "versionCode" : 1011,
+    "versionCode" : 1012,
     "app-plus" : {
         "nvueCompiler" : "weex",
         "compatible" : {

pages/component/commonComponents/video/index.vue

@@ -1,9 +1,7 @@
 <template>
 	<view class="container" style="background-color: #000; position: relative">		
 		<view style="width: 100%; height: 200px">
-			<view v-if="show" style="height: 100%;display: flex;align-items:center;justify-content:center;color: #fff;font-size: 38rpx;text-align: center;">
+			<view v-if="show" style="height: 100%;display: flex;align-items:center;justify-content:center;color: #fff;font-size: 38rpx;text-align: center;">{{errorTxt}}</view>
-							此设备暂不支持观看当前视频<br/>请移步到安卓手机进行学习！
-			</view>
 			<div class="" v-else style="background-color: #000" ref="videoContent" @tap="renderScript.handleClick"
 				id="url-player-test" :videoData="videoData" :winWidth="winWidth" :winHeight="winHeight"
 				:currentVideoList="currentVideoList" :firstTime="firstTime" :isfresh="isfresh" :platform="platform"
@@ -14,21 +12,21 @@
 				:change:isfresh="renderScript.receiveIsfresh" :change:platform="renderScript.receiveplatform"
 				:change:isChange="renderScript.receiveIsChange"
 				:change:currentVideoList="renderScript.receiveVideoList"></div>
-			<div @tap="renderScript.emitData" ref="videoContent1" v-show="false">
+			<div @tap="renderScript.emitData" ref="videoContent1" v-show="false" class="videoContent1">
 				直接调用renderjs中的emitData的方法,传递当前播放时长
 			</div>
 
-			<div @tap="renderScript.endEmitData" ref="videoContent2" v-show="false">
+			<div @tap="renderScript.endEmitData" ref="videoContent2" v-show="false" class="videoContent2">
 				监听结束方法，记录播放时长
 			</div>
 
-			<div @tap="renderScript.changeVideoData" ref="videoContent3" v-show="false">
+			<div @tap="renderScript.changeVideoData" ref="videoContent3" v-show="false" class="videoContent3">
 				监听切换视频方法
 			</div>
-			<div @tap="renderScript.emitSetData" ref="videoContent4" v-show="false">
+			<div @tap="renderScript.emitSetData" ref="videoContent4" v-show="false" class="videoContent4">
 				监听切换视频方法
 			</div>
-			<div @tap="renderScript.emitopenShow" ref="videoContent5" v-show="false">
+			<div @tap="renderScript.emitopenShow" ref="videoContent5" v-show="false" class="videoContent5">
 				打开视频提示
 			</div>
 			<div class="fullScreenButton-container">
@@ -50,8 +48,7 @@
 		props: ["currentVideo", "currentVideoList","videoTitle"],
 		data() {
 			return {
-				show: false,
+				show: false,				
-				content: "此设备暂不支持观看当前视频，请移步到安卓手机进行学习！",
 				platform: null,
 				//当前是否是全屏模式
 				isFullScreen: false,
@@ -70,6 +67,7 @@
 				isSetFirstTime: false,
 				screenType: null,
 				videoUrl: null,
+				errorTxt:'此设备暂不支持观看当前视频请移步到安卓手机进行学习！'
 			};
 		},
 		computed: {
@@ -91,10 +89,9 @@
 		beforeDestroy() {
 			this.handleEnd();
 			console.log("是否走啦习销毁");
-			clearInterval(this.$store.state.videoTimer);			
+			// clearInterval(this.$store.state.videoTimer);			
 			plus.screen.lockOrientation("portrait-primary");
-
+			// console.log("是否走啦习销毁定时器", this.timer);
-			console.log("是否走啦习销毁定时器", this.timer);
 		},
 		async onUnload() {
 			uni.navigateTo({
@@ -113,7 +110,8 @@
 		},
 
 		methods: {
-			openShow() {
+			openShow(data) {
+				data.msg ? this.errorTxt = data.msg : '此设备暂不支持观看当前视频请移步到安卓手机进行学习'
 				this.show = true;
 			},
 			start() {				
@@ -211,7 +209,7 @@
 			},
 			// 存储本地播放时间
 			recordTime(data) {
-				// console.log('recordTime',data.time);
+				 console.log('recordTime',data.time);
 				this.currentTime = data.time;
 
 				var list = [];
@@ -252,8 +250,7 @@
 						},
 					})
 					.then(async (res) => {
-						if (this.$platform == 'ios') {
+						if (this.$platform == 'ios') {							
-							console.log('不符合播放条件');
 							if (this.currentVideo.type == 1 && res.video.m3u8Url == null || this.currentVideo.type == 1 && res.video.m3u8Url == '') {
 								// 只存在私有加密
 								this.show = true
@@ -272,9 +269,7 @@
 						}
 						var data = {
 							...res.video,
-						};
+						};						
-						// console.log("/checkjieguo", data);
-						// return
 						if (this.currentVideo.type == 1) {
 							var playAuth = res.video.playAuth.replace(/=/g, "");
 							// console.log("这是接口获取的视屏凭证111", playAuth);
@@ -309,17 +304,19 @@
 					this.currentTime
 				);
 				await this.setVideoTime();
-				clearInterval(this.$store.state.videoTimer);
+				// clearInterval(this.$store.state.videoTimer);
-				this.timer = null;
+				// this.timer = null;
 			},
 			// 存储时长到线上
 			setVideoTime(time) {
 				var data = {};				
-				console.log("是否走了存储视屏," + this.videoData.id, this.currentTime);
+				console.log("是否走了存储视屏," + this.videoData.id, time,this.currentTime);
+				let _time = null
+				time ?  _time = time : _time = this.currentTime
 				var data = {
 					videoId: this.videoData.id,
-					position: this.currentTime, //秒数
+					position: _time, //秒数
-					loadAnimate: 'none',
+					// loadAnimate: 'none',
 				};
 
 				$http
@@ -335,30 +332,20 @@
 					.then((res) => {
 						console.log("存储视屏时长接口返回信息", res);
 						this.$forceUpdate();
+					}).catch(e => {
+						console.log("存储进度报错", e);
 					});
-			},
+			},			
-			// changePlayerTime(player) {
-			// 	console.log("this.firstTime at line 106:", this.firstTime);
-			// 	player.seek(this.firstTime);
-			// },
 			goBack() {
 				uni.navigateBack({
 					delta: 1,
 				});
 			},
 			// 设置初始播放时间 并开启定时器
-			async setVideoFirtsetTime(time) {
+			async setVideoFirtsetTime(data) {				
 				this.currentTime = this.firstTime;
-				console.log("这里准备开始设置播放时间:", this.currentTime);				
+				console.log("setVideoFirtsetTime播放时间:", data.time);
-				store.commit(
+				await this.setVideoTime(data.time);				
-					"setVideoTimer",
-					setInterval(async () => {
-						// if (this.currentTime) {
-						await this.setVideoTime();
-						// }
-					}, 60000)
-				);
-				// }, 5000);
 			},
 		},
 
@@ -368,6 +355,10 @@
 
 <script module="renderScript" lang="renderjs">
 	var videoData = null
+	var _seconds = 0
+	var curStatus = null
+	var diff = 0
+	
 	import $ from 'jquery'	
 	export default {		
 		components: {
@@ -382,19 +373,18 @@
 			return {
 				player: null,
 				videoTimer: null,
-				curTime: null,
+				// curTime: null,
 				// firstTime: null,
-				curStatus: null,
+				// curStatus: null,
 				// currentTime:null,
 			}
 		},
 		watch: {
-			curTime(val) {
+			// curTime(val) {
-
+			// 	if (this.curTime !== null && this.curStatus !== null) {
-				if (this.curTime !== null && this.curStatus !== null) {
+			// 		this.$refs.videoContent1.click()
-					this.$refs.videoContent1.click()
+			// 	}
-				}
+			// }
-			}
 		},
 		methods: {
 			handleClick(event, ownerInstance) {
@@ -402,47 +392,57 @@
 			},
 			emitData(event, ownerInstance) {
 				var that = this;
-
 				ownerInstance.callMethod('recordTime', {
-					time: that.curTime,
+					time: _seconds,
-					status: that.curStatus
+					status: curStatus
 				})
 
 			},
-			async receiveFirstTime(newValue, oldValue, ownerVm, vm) {				
+			async receiveFirstTime(newValue, oldValue, ownerVm, vm) {
+				
 			},
 			async receiveisSetFirstTime(newValue, oldValue, ownerVm, vm) {
 				console.log('是否刚开始设置播放时间', newValue, this.firstTime, this.player);
 			},
 			emitSetData(event, ownerInstance) {
-				var that = this;
+				// var that = this;				
-				// this.player.seek(this.firstTime)
+				ownerInstance.callMethod('setVideoFirtsetTime',{
-				console.log('是否设置的第一次初始播放', this.firstTime, this.videoData.id);
+					time: _seconds,					
-				ownerInstance.callMethod('setVideoFirtsetTime')
+				})
-
 			},
 			emitopenShow(event, ownerInstance) {
-				ownerInstance.callMethod('openShow')
+				ownerInstance.callMethod('openShow',{msg:'播放出错啦！'})
 			},
+			// 全屏切换事件
 			changeVideoScreen(event, ownerInstance) {
 				var that = this;
 				// this.$emit('changeScreenLoading',true)
 				var status = this.player.fullscreenService.getIsFullScreen();
-				ownerInstance.callMethod('screenChange', {
+				console.log('this.$platform--------',this.platform);
-					status: status,
+				if (this.platform != 'ios') {	// 改变按钮形态				
-					primary: status ? 'portrait' : 'landscape'
+					ownerInstance.callMethod('screenChange', {
-				})
+						status: status,
+						primary: status ? 'portrait' : 'landscape'
+					})
+				}
 				if (status) {
+					if (this.platform != 'ios') {
+						console.log('恢复竖版');					
 					setTimeout(() => {
 						plus.screen.lockOrientation("portrait-primary"); //锁死屏幕方向为竖屏
 						this.player.fullscreenService.cancelFullScreen();
 					}, 100);
+					}
 				} else {
 					this.player.fullscreenService.requestFullScreen();
-					setTimeout(() => {				
+					if (this.platform != 'ios') {
-						plus.screen.lockOrientation("landscape-primary");
+						setTimeout(() => {
-
+							plus.screen.lockOrientation("landscape-primary");						
-					}, 100);
+						}, 100);
+					}else{
+						console.log('不要旋转, 使用原生全屏');
+					}
+					
 				}
 			},
 			changeVideoData(event, ownerInstance) {
@@ -461,7 +461,7 @@
 					$('#url-player-test').empty();
 					this.player = null;
 				}
-				var fullScreenButtonComponent = Aliplayer.Component({
+				var fullScreenButtonComponent = Aliplayer.Component({					
 					/**
 					 * 初始函数，在new对象时调用
 					 *
@@ -506,11 +506,10 @@
 					 * 隐藏广告
 					 */
 					playing: function(player, e) {
-						this.$html.show();
+						this.$html.show();						
 						// this.$html.hide();
 					},
-					waiting: function(player, e) {
+					waiting: function(player, e) {						
-						
 						// this.$html.hide()
 					},
 					timeupdate: function(player, e) {},
@@ -658,15 +657,6 @@
 				this.player = player;
 				console.log('是否拿到第一次初始值呢', this.platform, typeof this.firstTime, this.firstTime)		
 				
-				clearInterval(this.videoTimer);
-
-				this.videoTimer = null;
-				this.videoTimer = setInterval(() => {
-					var that = this;
-					that.curTime = parseInt(this.player.getCurrentTime());
-					that.curStatus = this.player.getStatus()
-				}, 1000);
-				this.$refs.videoContent4.click()
 				player.on('ready', function() {
 				})
 				player.one('canplay', function() {
@@ -677,8 +667,30 @@
 				this.player.on('playing', function() {
 					console.log('正在播放')
 				})
-				this.player.on('ended', function() {					
+				this.player.on('timeupdate', function() {
-					this.$refs.videoContent2.click()
+					let that = this
+					var _time = parseInt(player.getCurrentTime())
+					curStatus = player.getStatus()
+					// console.log('timeupdatetimeupdate...',curStatus);
+					if(_seconds != _time){
+						_seconds = _time
+						 diff ++
+						 if(diff % 60 === 0){
+						 	console.log('符合---------');
+						 	$('.videoContent4').click()
+						 	diff = 0
+						 }							
+						$('.videoContent1').click()	  
+					}
+				})				
+				this.player.on('ended', function() {
+					console.log('播放完毕');					
+					$('.videoContent2').click()
+				})
+				
+				this.player.on('error', function() {
+					console.log('播放出错')
+					$('.videoContent5').click()
 				})
 			},
 			showPreview(e) {
@@ -713,12 +725,13 @@
 
 				console.log('是否走了刷新销毁方法:', this.player)
 				if (this.player) {
-					clearInterval(this.$store.state.videoTimer)
+					// clearInterval(this.$store.state.videoTimer)
 					// await this.setVideoTime();
 					this.player.dispose();				
 				}
 			},
 			async receiveplatform(newValue) {
+				
 			},
 			async receiveIsChange(newValue) {
 				if (this.isChange) {
@@ -743,6 +756,7 @@
 				//数据变化
 				console.log('newValue', newValue)				
 			},
+			// 检测是否传入播放参数
 			checkValue() {
 				console.log(this.videoId, this.authId, this.videoData, "1111888888")
 				if ((!this.videoData.playAuth || !this.currentVideoList)) {
@@ -780,8 +794,7 @@
 					document.body.appendChild(l_tag);
 				});
 			},
-			loadComponent() {				
+			
-			}
 		}
 	}
 </script>

pages/course/chapterDetail.vue

@@ -453,33 +453,6 @@ export default {
       }
 
       console.log("data at line 380111111111111111111:", data.type);
-
-      // var mynavData = JSON.stringify(data); // 这里转换成 字符串
-
-      // if (data.type == 0 || data.type == 2) {
-      //   //1 mp4 2 mp3
-      //   uni.navigateTo({
-      //     url: `/pages/curriculum/order/curriculum/videoDetail?data=${mynavData}`,
-      //   });
-      // } else if (data.type == 1) {
-      //   //视频云点播
-      //   uni.navigateTo({
-      //     url: `/pages/curriculum/order/curriculum/videoDetailOss?data=${mynavData}`,
-      //   });
-      // }
-
-      //   else if (data.type == 2) {
-      //     //mp3
-      //     this.isOpenMp3 = true;
-      //     this.$nextTick(() => {
-      //       this.$refs.mp3Detail.init({ data: mynavData });
-      //     });
-      //   }
-
-      //   uni.navigateTo({
-      //     // url: '../bookShop/commodityDetail?id=' + item.id
-      //     url: `/pages/curriculum/order/curriculum/detail?navTitle=${v.title}&title=${v.title}&oid=${v.oid}`,
-      //   });
     },
     hancleModalCancel() {
       this.show = false;
@@ -497,13 +470,7 @@ export default {
           customerOid: uni.getStorageSync("customerOid"),
           ...this.taiHuClassInfo,
         },
-      };
+      };      
-      // $mars.progressBegin('申请中...');
-      // $mars.post(customerType, 'applyRelearn', data, function (ret) {
-      //     api.hideProgress();
-
-      //     fnLoadDataGrid();
-      // });
     },
 
     //课程详情

pages/course/chapterDetailAndorid.vue

@@ -27,15 +27,6 @@
           <view style="height: 200px" v-else></view>
         </view>
 
-        <!-- <common-sticky
-        style=""
-        itemStyle="width:auto; height: 80rpx;font-size:20rpx;color:#fff"
-        :list="ordersTabs"
-        label="name"
-        :currentCateIndex="currentCateIndex"
-        @handleselectCate="ordersTabCLi"
-      ></common-sticky> -->
-
         <scroll-view
           :style="`height:calc(100% - 200px - 40rpx) ;`"
           scroll-y="true"
@@ -90,141 +81,7 @@
         <p class="aui-text-danger" style="text-align: center">
           本课程版权归天津众妙之门科技有限公司所有，翻版必究!
         </p>
-
+        
-        <!-- <view class="small_class_teaching_box" v-if="medicalCasesList.length > 0">
-        <view class="small_class_teaching_top">
-          <view class="small_class_teaching_top_left">
-            <image
-              src="@/static/icon/course_ic.png"
-              mode="aspectFil"
-              class="icon1"
-            ></image>
-            <text>相关医案</text>
-          </view>
-        </view>
-        <view class="small_class_teaching_content"> </view>
-      </view>
-      <view
-        class="small_class_teaching_box related_courses_box"
-        v-if="relatedCoursesList.length > 0"
-      >
-        <view class="small_class_teaching_top">
-          <view class="small_class_teaching_top_left">
-            <image
-              src="@/static/icon/course_ic.png"
-              mode="aspectFil"
-              class="icon1"
-            ></image>
-            <text>相关课程</text>
-          </view>
-        </view>
-        <view class="small_class_teaching_content">
-          <common-curriculum-list
-            imgUrl="url"
-            :isCondition="true"
-            :dataList="relatedCoursesList"
-            @hancleClick="goCourseDescription"
-            label="title"
-          >
-            <template slot="labelSlot" slot-scope="slotProps">
-              <view class="related_courses_name hidden1">{{
-                slotProps.row.title
-              }}</view>
-
-             </template>
-
-            <template slot="rightSlot" slot-scope="slotProps">
-         
-              <text class="aui-text-danger">
-                ￥{{ slotProps.row.courseFee }}</text
-              >
-
-              <view> </view>
-            </template>
-          </common-curriculum-list>
-        </view>
-      </view>
-
-      <view
-        class="small_class_teaching_box correlation_box"
-        v-for="(v, i) in correlationiList"
-      >
-        <view class="small_class_teaching_top">
-          <view class="small_class_teaching_top_left">
-            <template v-if="v.iconType == 'uni'">
-              <uni-icons
-                :type="v.icon"
-                :color="v.color ? v.color : '#71d5a1'"
-                :size="v.iconSize"
-                style="display: inline-block; margin-right: 10rpx"
-              ></uni-icons>
-            </template>
-
-            <template v-else>
-              <u-icon
-                :name="v.icon"
-                :color="v.color ? v.color : '#71d5a1'"
-                :size="v.iconSize"
-                style="display: inline-block; margin-right: 10rpx"
-              ></u-icon>
-            </template>
-            <text
-              :style="`color:${v.color ? v.color : '#71d5a1'}`"
-              class="title"
-              >{{ v.name }}</text
-            >
-          </view>
-          <view class="small_class_teaching_top_right"
-            ><text
-              :style="`color:#b0b0b0`"
-              class="more"
-              @click="handleClickMore(v, i, true)"
-              v-show="!v.isOpen"
-              v-if="v.type != 'dashang'"
-              >查看全部</text
-            >
-          </view>
-        </view>
-        <view
-          :class="`small_class_teaching_content dianzan_box ${
-            v.isOpen ? '' : 'hidden5'
-          }`"
-          v-if="v.type == 'dianzan'"
-        >
-          {{ praise }}
-        </view>
-        <view
-          :class="`small_class_teaching_content dianzan_box ${
-            v.isOpen ? '' : 'hidden5'
-          }`"
-          v-if="v.type == 'pinglun'"
-        >
-          <view v-for="(item, index) in commentLst">
-            <text>{{ item.name }}:</text>
-            <text>{{ item.content }}</text>
-          </view>
-        </view>
-        <view
-          :class="`small_class_teaching_content dianzan_box dashang_box ${
-            v.isOpen ? '' : 'hidden5'
-          }`"
-          v-if="v.type == 'dashang'"
-        >
-          <rich-text :nodes="reward"></rich-text>
-        </view>
-        <view
-          @click="handleClickMore(v, i, false)"
-          class="close"
-          v-show="v.isOpen"
-          >收起
-          <u-icon
-            name="arrow-up"
-            color="#b0b0b0"
-            size="18"
-            style="display: inline-block; margin-left: 10rpx"
-          ></u-icon>
-        </view>
-      </view> -->
       </view>
     </template>
 
@@ -239,17 +96,7 @@
       "
       v-show="screenLoading"
     >
-    </view>
+    </view>   
-    <!-- <u-modal
-      :show="show"
-      :title="modalInfo.title"
-      :content="modalInfo.content"
-      showCancelButton
-      @confirm="hancleModalConfirm"
-      @cancel="hancleModalCancel"
-    ></u-modal> -->
-
-    <!-- <z-navigation></z-navigation> -->
   </view>
 </template>