From 15c357c5b55949a547c115d63870c735f0189ed0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A7=8B=E4=BA=8E=E5=88=9D=E8=A7=81?= <752204717@qq.com>
Date: Tue, 23 Jul 2024 11:33:35 +0800
Subject: [PATCH] 222

---
 .../commonComponents/video/index.vue          | 2544 +++++++++--------
 1 file changed, 1280 insertions(+), 1264 deletions(-)

diff --git a/pages/component/commonComponents/video/index.vue b/pages/component/commonComponents/video/index.vue
index cb2d0b4..13ee4fd 100644
--- a/pages/component/commonComponents/video/index.vue
+++ b/pages/component/commonComponents/video/index.vue
@@ -1,7 +1,7 @@
 <template>
-	<view class="container" style="background-color: #000; position: relative">
-		<u-modal :show="show" :title="title" :content='content'></u-modal>
-		<!-- <u-icon
+  <view class="container" style="background-color: #000; position: relative">
+    <u-modal :show="show" :title="title" :content="content"></u-modal>
+    <!-- <u-icon
 		@click="goBack"
 		name="arrow-left"
 		color="#3ab3ae"
@@ -10,46 +10,67 @@
 		  statusBarHeight + 2
 		}px; left: ${10}px;z-index: 999;`"
 	  ></u-icon>-->
-		<!-- <zhimi_aliplayer_view
+    <!-- <zhimi_aliplayer_view
       ref="playerView"
       style="width: 100%; height: 300px"
     ></zhimi_aliplayer_view>
     <button type="primary" @click="start()">开始</button>
     <button type="primary" @click="pause()">暂停</button> -->
-		<view style="width: 100%; height: 200px">
-			<div class="" 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"
-				:isSetFirstTime="isSetFirstTime" :isChange="isChange" :change:videoData="renderScript.receiveMsg"
-				:change:winWidth="renderScript.receiveWinWidth" :change:winHeight="renderScript.receiveWinHeight"
-				:change:firstTime="renderScript.receiveFirstTime"
-				:change:isSetFirstTime="renderScript.receiveisSetFirstTime"
-				: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">
-				直接调用renderjs中的emitData的方法,传递当前播放时长
-			</div>
+    <view style="width: 100%; height: 200px">
+      <div
+        class=""
+        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"
+        :isSetFirstTime="isSetFirstTime"
+        :isChange="isChange"
+        :change:videoData="renderScript.receiveMsg"
+        :change:winWidth="renderScript.receiveWinWidth"
+        :change:winHeight="renderScript.receiveWinHeight"
+        :change:firstTime="renderScript.receiveFirstTime"
+        :change:isSetFirstTime="renderScript.receiveisSetFirstTime"
+        :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">
+        直接调用renderjs中的emitData的方法,传递当前播放时长
+      </div>
 
-			<div @tap="renderScript.endEmitData" ref="videoContent2" v-show="false">
-				监听结束方法，记录播放时长
-			</div>
+      <div @tap="renderScript.endEmitData" ref="videoContent2" v-show="false">
+        监听结束方法，记录播放时长
+      </div>
 
-			<div @tap="renderScript.changeVideoData" ref="videoContent3" v-show="false">
-				监听切换视频方法
-			</div>
-			<div @tap="renderScript.emitSetData" ref="videoContent4" v-show="false">
-				监听切换视频方法
-			</div>
-			<div @tap="renderScript.emitopenShow" ref="videoContent5" v-show="false">
-				打开视频提示
-			</div>
-			<div class="fullScreenButton-container">
-				<div :class="`prism-fullscreen-btn ${isFullScreen ? 'fullscreen' : ''}`"
-					@tap="renderScript.changeVideoScreen"></div>
-			</div>
-		</view>
-		<!-- <view style="width: 100%; height: 200px; position: relative" v-else>
+      <div
+        @tap="renderScript.changeVideoData"
+        ref="videoContent3"
+        v-show="false"
+      >
+        监听切换视频方法
+      </div>
+      <div @tap="renderScript.emitSetData" ref="videoContent4" v-show="false">
+        监听切换视频方法
+      </div>
+      <div @tap="renderScript.emitopenShow" ref="videoContent5" v-show="false">
+        打开视频提示
+      </div>
+      <div class="fullScreenButton-container">
+        <div
+          :class="`prism-fullscreen-btn ${isFullScreen ? 'fullscreen' : ''}`"
+          @tap="renderScript.changeVideoScreen"
+        ></div>
+      </div>
+    </view>
+    <!-- <view style="width: 100%; height: 200px; position: relative" v-else>
 		<video
 		  @timeupdate="videoTimeUpdateEvent($event)"
 		  ref="videos"
@@ -64,877 +85,839 @@
 		>
 			 </video>
 	  </view> -->
-	</view>
+  </view>
 </template>
 <script>
-	import store from "@/store/index.js";
-	import $http from "@/config/requestConfig.js";
-	import {
-		mapState,
-		mapMutations
-	} from "vuex";
+import store from "@/store/index.js";
+import $http from "@/config/requestConfig.js";
+import { mapState, mapMutations } from "vuex";
 
-	// importScripts('@/static/aliplayer/aliplayer-min.js')
-	export default {
-		props: ["currentVideo", "currentVideoList"],
-		data() {
-			return {
-				show: false,
-				content: "此设备暂不支持观看当前视频，请移步到安卓手机进行学习！",
-				platform: null,
-				//当前是否是全屏模式
-				isFullScreen: false,
-				isfresh: false,
-				isChange: false,
-				isControl: true,
-				timer: null,
-				videoTitle: "",
-				videoList: [],
-				firstTime: 0,
-				options: {},
-				playAuth: "",
-				currentTime: "",
-				videoId: "",
-				videoData: {},
-				isSetFirstTime: false,
-				screenType: null,
-				videoUrl: null,
-			};
-		},
-		computed: {
-			...mapState(["videoOssList"]),
-		},
+// importScripts('@/static/aliplayer/aliplayer-min.js')
+export default {
+  props: ["currentVideo", "currentVideoList"],
+  data() {
+    return {
+      show: false,
+      content: "此设备暂不支持观看当前视频，请移步到安卓手机进行学习！",
+      platform: null,
+      //当前是否是全屏模式
+      isFullScreen: false,
+      isfresh: false,
+      isChange: false,
+      isControl: true,
+      timer: null,
+      videoTitle: "",
+      videoList: [],
+      firstTime: 0,
+      options: {},
+      playAuth: "",
+      currentTime: "",
+      videoId: "",
+      videoData: {},
+      isSetFirstTime: false,
+      screenType: null,
+      videoUrl: null,
+    };
+  },
+  computed: {
+    ...mapState(["videoOssList"]),
+  },
 
-		watch: {
-			currentVideo: {
-				immediate: true,
-				handler(newRoute) {},
-			},
-			timer(newValue) {
-				this.$emit("child-event", newValue);
-			},
-		},
+  watch: {
+    currentVideo: {
+      immediate: true,
+      handler(newRoute) {},
+    },
+    timer(newValue) {
+      this.$emit("child-event", newValue);
+    },
+  },
 
-		// //页面显示
-		mounted() {},
-		beforeDestroy() {
-			this.handleEnd();
-			console.log("是否走啦习销毁");
-			clearInterval(this.$store.state.videoTimer);
-			// this.timer = null;
-			// store.commit("setLoadingShow", null);
-			plus.screen.lockOrientation("portrait-primary");
+  // //页面显示
+  mounted() {},
+  beforeDestroy() {
+    this.handleEnd();
+    console.log("是否走啦习销毁");
+    clearInterval(this.$store.state.videoTimer);
+    // this.timer = null;
+    // store.commit("setLoadingShow", null);
+    plus.screen.lockOrientation("portrait-primary");
 
-			console.log("是否走啦习销毁定时器", this.timer);
-		},
-		async onUnload() {
-			uni.navigateTo({
-				url: "/pages/curriculum/order/curriculum/back",
-			});
-			// #ifdef APP-PLUS
-			plus.screen.lockOrientation("portrait-primary"); //锁死屏幕方向为竖屏
+    console.log("是否走啦习销毁定时器", this.timer);
+  },
+  async onUnload() {
+    uni.navigateTo({
+      url: "/pages/curriculum/order/curriculum/back",
+    });
+    // #ifdef APP-PLUS
+    plus.screen.lockOrientation("portrait-primary"); //锁死屏幕方向为竖屏
 
-			// plus.screen.lockOrientation("portrait-primary");
-			// #endif
+    // plus.screen.lockOrientation("portrait-primary");
+    // #endif
 
-			await this.setVideoTime();
-			// this.player.dispose();
-		},
+    await this.setVideoTime();
+    // this.player.dispose();
+  },
 
-		//第一次加载
-		onLoad(options) {
-			// console.log(options, "这是传参");
-			// // #ifdef APP-PLUS
-			// setTimeout(() => {
-			//   plus.screen.unlockOrientation();
-			//   plus.screen.lockOrientation("landscape-primary");
-			// }, 10);
-			// //	#endif
-			// // #ifdef APP-PLUS
-			// // plus.screen.lockOrientation("portrait-primary");
-			// // #endif
-			// if (uni.getStorageSync("videoOssList")) {
-			//   this.videoList = JSON.parse(uni.getStorageSync("videoOssList"));
-			// }
-			// console.log("this.videoList at line 53:", this.videoList);
-			// this.options = JSON.parse(options.data);
-			// this.videoId = this.options.video;
-			// this.timer = setInterval(() => {
-			//   var that = this;
-			//   if (this.currentTime) {
-			//     that.setVideoTime();
-			//   }
-			// }, 2000);
-			// this.$emit("child-event", this.timer);
-			// // this.$once("hook:beforeDestroy", () => {
-			// //   clearInterval(this.timer);
-			// // });
-		},
+  //第一次加载
+  onLoad(options) {
+    // console.log(options, "这是传参");
+    // // #ifdef APP-PLUS
+    // setTimeout(() => {
+    //   plus.screen.unlockOrientation();
+    //   plus.screen.lockOrientation("landscape-primary");
+    // }, 10);
+    // //	#endif
+    // // #ifdef APP-PLUS
+    // // plus.screen.lockOrientation("portrait-primary");
+    // // #endif
+    // if (uni.getStorageSync("videoOssList")) {
+    //   this.videoList = JSON.parse(uni.getStorageSync("videoOssList"));
+    // }
+    // console.log("this.videoList at line 53:", this.videoList);
+    // this.options = JSON.parse(options.data);
+    // this.videoId = this.options.video;
+    // this.timer = setInterval(() => {
+    //   var that = this;
+    //   if (this.currentTime) {
+    //     that.setVideoTime();
+    //   }
+    // }, 2000);
+    // this.$emit("child-event", this.timer);
+    // // this.$once("hook:beforeDestroy", () => {
+    // //   clearInterval(this.timer);
+    // // });
+  },
 
-		methods: {
-			openShow() {
-				this.show = true;
-			},
-			start() {
-				// var playerView = this.$refs.playerView;
-				this.$refs.playerView.start();
-			},
-			pause() {
-				// var playerView = ;
-				this.$refs.playerView.pause();
-			},
-			changeVideoData() {
-				this.show = false;
-				this.isChange = false;
-			},
-			async changeVideo(data) {
-				this.currentTime = "";
-				this.firstTime = 0;
-				this.isSetFirstTime = false;
-				this.isChange = false;
-				await this.init(data, true);
-			},
-			screenChange(data) {
-				console.log(
-					"status at line 这是当前的状态158:",
-					data.status,
-					data.primary
-				);
-				this.isFullScreen = !data.status;
-				this.$emit("changeScreen", this.isFullScreen);
-				// let fullScreen = e.detail.fullScreen; // 值true为进入全屏，false为退出全屏
-				// if (!fullScreen) {
-				//   //退出全屏
-				//   this.isFullScreen = false;
-				// } else {
-				//   this.isFullScreen = true;
-				// }
-			},
-			// 控制器的显示隐藏
-			controlChange(e) {
-				this.isControl = e.detail.show;
-			},
-			quitScreen() {
-				// 退出全屏
-				const ctx = this.$refs.myVideo;
-				ctx.exitFullScreen();
-			},
-			// 播放进度改变
-			videoTimeUpdateEvent(e) {
-				this.playTime = parseInt(e.detail.currentTime);
-				this.currentTime = parseInt(e.detail.currentTime);
+  methods: {
+    openShow() {
+      this.show = true;
+    },
+    start() {
+      // var playerView = this.$refs.playerView;
+      this.$refs.playerView.start();
+    },
+    pause() {
+      // var playerView = ;
+      this.$refs.playerView.pause();
+    },
+    changeVideoData() {
+      this.show = false;
+      this.isChange = false;
+    },
+    async changeVideo(data) {
+      this.currentTime = "";
+      this.firstTime = 0;
+      this.isSetFirstTime = false;
+      this.isChange = false;
+      await this.init(data, true);
+    },
+    screenChange(data) {
+      console.log(
+        "status at line 这是当前的状态158:",
+        data.status,
+        data.primary
+      );
+      this.isFullScreen = !data.status;
+      this.$emit("changeScreen", this.isFullScreen);
+      // let fullScreen = e.detail.fullScreen; // 值true为进入全屏，false为退出全屏
+      // if (!fullScreen) {
+      //   //退出全屏
+      //   this.isFullScreen = false;
+      // } else {
+      //   this.isFullScreen = true;
+      // }
+    },
+    // 控制器的显示隐藏
+    controlChange(e) {
+      this.isControl = e.detail.show;
+    },
+    quitScreen() {
+      // 退出全屏
+      const ctx = this.$refs.myVideo;
+      ctx.exitFullScreen();
+    },
+    // 播放进度改变
+    videoTimeUpdateEvent(e) {
+      this.playTime = parseInt(e.detail.currentTime);
+      this.currentTime = parseInt(e.detail.currentTime);
 
-				this.allTime = parseInt(e.detail.duration);
+      this.allTime = parseInt(e.detail.duration);
 
-				this.recordTime({
-					time: this.playTime,
-				});
-			},
-			async init(data, isChange) {
-				this.show = false;
-				this.platform = this.$platform;
-				this.isfresh = true;
-				console.log("at line 59:", "是否先走init这里", this.platform);
-				if (uni.getStorageSync("videoOssList")) {
-					this.videoList = JSON.parse(uni.getStorageSync("videoOssList"));
-				}
-				this.options = data.currentVideo;
+      this.recordTime({
+        time: this.playTime,
+      });
+    },
+    async init(data, isChange) {
+      this.show = false;
+      this.platform = this.$platform;
+      this.isfresh = true;
+      console.log("at line 59:", "是否先走init这里", this.platform);
+      if (uni.getStorageSync("videoOssList")) {
+        this.videoList = JSON.parse(uni.getStorageSync("videoOssList"));
+      }
+      this.options = data.currentVideo;
 
-				this.videoId = this.options.video;
-				console.log("这是苹果视屏id", this.videoId);
-				await this.getLive(isChange);
-				// await this.getVideo(isChange);
-				//   this.$emit("child-event", this.timer);
-			},
-			async getVideo() {
-				var data = {};
-				var that = this;
-				$http
-					.request({
-						url: `sociology/course/ttt`,
-						method: "Post", // POST、GET、PUT、DELETE，具体说明查看官方文档
-						data,
-						header: {
-							//默认 无 说明：请求头
-							"Content-Type": "application/json",
-						},
-					})
-					.then(async (res) => {
-						console.log(" 视频播放11111111111:", res);
+      this.videoId = this.options.video;
+      console.log("这是苹果视屏id", this.videoId);
+      await this.getLive(isChange);
+      // await this.getVideo(isChange);
+      //   this.$emit("child-event", this.timer);
+    },
+    async getVideo() {
+      var data = {};
+      var that = this;
+      $http
+        .request({
+          url: `sociology/course/ttt`,
+          method: "Post", // POST、GET、PUT、DELETE，具体说明查看官方文档
+          data,
+          header: {
+            //默认 无 说明：请求头
+            "Content-Type": "application/json",
+          },
+        })
+        .then(async (res) => {
+          console.log(" 视频播放11111111111:", res);
 
-						var credentials = res.result.credentials;
-						// var playerView = this.$refs.playerView;
-						// console.log('playerView at line 273:', playerView)
-						/*
+          var credentials = res.result.credentials;
+          // var playerView = this.$refs.playerView;
+          // console.log('playerView at line 273:', playerView)
+          /*
 				STS加密播放
 				
 			*/
-						that.$refs.playerView.setVidSts({
-							vid: this.videoData.video,
-							accessKeyId: credentials.accessKeyId,
-							securityToken: credentials.securityToken,
-							accessKeySecret: credentials.accessKeySecret,
-							expireTime: credentials.expireTime,
-							Region: "cn-shanghai",
-						});
-						// playerView.setLocalSource({
-						//   uri: "http://duoduovideo.oss-cn-beijing.aliyuncs.com/5f093c6fb6e90.mp4",
-						// });
+          that.$refs.playerView.setVidSts({
+            vid: this.videoData.video,
+            accessKeyId: credentials.accessKeyId,
+            securityToken: credentials.securityToken,
+            accessKeySecret: credentials.accessKeySecret,
+            expireTime: credentials.expireTime,
+            Region: "cn-shanghai",
+          });
+          // playerView.setLocalSource({
+          //   uri: "http://duoduovideo.oss-cn-beijing.aliyuncs.com/5f093c6fb6e90.mp4",
+          // });
 
-						let isFullScreen = true;
-						// fixed fullscreen play on android
-						if (plus.os.name.toLowerCase() === "android") {
-							plus.key.addEventListener("backbutton", (e) => {
-								if (isFullScreen) {
-									that.$refs.playerView.changeScreenMode(0, false);
-									isFullScreen = false;
-								} else {
-									// 这里由于安卓无法监听返回按键，这里只能通过plus监听，然后自己模拟退回
-									uni.navigateBack();
-								}
-							});
-						}
-						that.$refs.playerView.setPlayerCallBack(({
-							type,
-							data
-						}) => {
-							switch (type) {
-								case "isFullScreen":
-									isFullScreen = Boolean(data);
-									break;
-								default:
-									console.log({
-										type,
-										data,
-									});
-							}
-						});
-					});
-			},
-			async getData(data, isChange) {
-				var that = this;
-				if (!this.isSetFirstTime) {
-					var netWork = data.userCourseVideoPositionEntity ?
-						data.userCourseVideoPositionEntity.position :
-						0;
-					var list = [];
-					if (uni.getStorageSync("videoOssList")) {
-						list = JSON.parse(uni.getStorageSync("videoOssList"));
-						var index = list.findIndex((e) => e.id == data.id);
+          let isFullScreen = true;
+          // fixed fullscreen play on android
+          if (plus.os.name.toLowerCase() === "android") {
+            plus.key.addEventListener("backbutton", (e) => {
+              if (isFullScreen) {
+                that.$refs.playerView.changeScreenMode(0, false);
+                isFullScreen = false;
+              } else {
+                // 这里由于安卓无法监听返回按键，这里只能通过plus监听，然后自己模拟退回
+                uni.navigateBack();
+              }
+            });
+          }
+          that.$refs.playerView.setPlayerCallBack(({ type, data }) => {
+            switch (type) {
+              case "isFullScreen":
+                isFullScreen = Boolean(data);
+                break;
+              default:
+                console.log({
+                  type,
+                  data,
+                });
+            }
+          });
+        });
+    },
+    async getData(data, isChange) {
+      var that = this;
+      if (!this.isSetFirstTime) {
+        var netWork = data.userCourseVideoPositionEntity
+          ? data.userCourseVideoPositionEntity.position
+          : 0;
+        var list = [];
+        if (uni.getStorageSync("videoOssList")) {
+          list = JSON.parse(uni.getStorageSync("videoOssList"));
+          var index = list.findIndex((e) => e.id == data.id);
 
-						if (netWork) {
-							if (index >= 0) {
-								this.firstTime =
-									list[index].time > netWork ? list[index].time : netWork;
-							} else {
-								this.firstTime = netWork ? netWork : 0;
-							}
-						} else {
-							if (index >= 0) {
-								this.firstTime = list[index].time ? list[index].time : 0;
-							} else {
-								this.firstTime = 0;
-							}
-						}
-					} else {
-						this.firstTime = 0;
-					}
+          if (netWork) {
+            if (index >= 0) {
+              this.firstTime =
+                list[index].time > netWork ? list[index].time : netWork;
+            } else {
+              this.firstTime = netWork ? netWork : 0;
+            }
+          } else {
+            if (index >= 0) {
+              this.firstTime = list[index].time ? list[index].time : 0;
+            } else {
+              this.firstTime = 0;
+            }
+          }
+        } else {
+          this.firstTime = 0;
+        }
 
-					this.videoData = {
-						...data,
-					};
-					this.isChange = isChange ? isChange : false;
-					// this.currentTime = this.firstTime;
-					console.log(this.firstTime, "这是第一次播放时长222");
-					// await this.setVideoTime();
-					uni.setStorageSync("videoOssList", JSON.stringify(list));
+        this.videoData = {
+          ...data,
+        };
+        this.isChange = isChange ? isChange : false;
+        // this.currentTime = this.firstTime;
+        console.log(this.firstTime, "这是第一次播放时长222");
+        // await this.setVideoTime();
+        uni.setStorageSync("videoOssList", JSON.stringify(list));
 
-					// if (this.currentVideo.type == 0 || this.currentVideo.type == 2) {
-					//   await this.playVideo();
-					// }
-					console.log(this.firstTime, "这是第一次播放时长");
-					// await that.getVideo();
-				}
-				this.isSetFirstTime = true;
-			},
-			async playVideo(e) {
-				this.videoContext = uni.createVideoContext("videoId", this);
-				this.videoContext.seek(this.firstTime);
+        // if (this.currentVideo.type == 0 || this.currentVideo.type == 2) {
+        //   await this.playVideo();
+        // }
+        console.log(this.firstTime, "这是第一次播放时长");
+        // await that.getVideo();
+      }
+      this.isSetFirstTime = true;
+    },
+    async playVideo(e) {
+      this.videoContext = uni.createVideoContext("videoId", this);
+      this.videoContext.seek(this.firstTime);
 
-				//   this.videoContext.requestFullScreen();
-			},
-			recordTime(data) {
-				this.currentTime = data.time;
+      //   this.videoContext.requestFullScreen();
+    },
+    recordTime(data) {
+      this.currentTime = data.time;
 
-				var list = [];
-				if (uni.getStorageSync("videoOssList")) {
-					list = JSON.parse(uni.getStorageSync("videoOssList"));
-				}
+      var list = [];
+      if (uni.getStorageSync("videoOssList")) {
+        list = JSON.parse(uni.getStorageSync("videoOssList"));
+      }
 
-				var index = list.findIndex((e) => e.id == this.videoData.id);
-				if (list.length > 0 && index >= 0) {
-					list[index] = {
-						...this.videoData,
+      var index = list.findIndex((e) => e.id == this.videoData.id);
+      if (list.length > 0 && index >= 0) {
+        list[index] = {
+          ...this.videoData,
 
-						time: data.time,
-					};
-				} else {
-					list.push({
-						...this.videoData,
-						time: data.time,
-					});
-				}
+          time: data.time,
+        };
+      } else {
+        list.push({
+          ...this.videoData,
+          time: data.time,
+        });
+      }
 
-				uni.setStorageSync("videoOssList", JSON.stringify(list));
-			},
-			// 获取数据
-			async getLive(isChange) {
-				var that = this;
-				this.isfresh = false;
-				var data = {
-					...this.options,
-				};
+      uni.setStorageSync("videoOssList", JSON.stringify(list));
+    },
+    // 获取数据
+    async getLive(isChange) {
+      var that = this;
+      this.isfresh = false;
+      var data = {
+        ...this.options,
+      };
 
-				await $http
-					.request({
-						url: `sociology/course/checkVideo`,
-						method: "Post", // POST、GET、PUT、DELETE，具体说明查看官方文档
-						data,
-						header: {
-							//默认 无 说明：请求头
-							"Content-Type": "application/json",
-						},
-					})
-					.then(async (res) => {
-						var data = {
-							...res.video,
-						};
-						if (this.currentVideo.type == 1) {
-							var playAuth = res.video.playAuth.replace(/=/g, "");
-							console.log("这是接口获取的视屏凭证111", playAuth);
-							data = {
-								...data,
-								videoId: res.video.video,
-								playAuth: playAuth,
-							};
-							this.playAuth = playAuth;
+      await $http
+        .request({
+          url: `sociology/course/checkVideo`,
+          method: "Post", // POST、GET、PUT、DELETE，具体说明查看官方文档
+          data,
+          header: {
+            //默认 无 说明：请求头
+            "Content-Type": "application/json",
+          },
+        })
+        .then(async (res) => {
+          var data = {
+            ...res.video,
+          };
+          if (this.currentVideo.type == 1) {
+            var playAuth = res.video.playAuth.replace(/=/g, "");
+            console.log("这是接口获取的视屏凭证111", playAuth);
+            data = {
+              ...data,
+              videoId: res.video.video,
+              playAuth: playAuth,
+            };
+            this.playAuth = playAuth;
 
-							await that.getData(data, isChange);
-						} else {
-							console.log("这是接口获取的视屏凭证222", res.video, data);
-							data = {
-								...data,
-								playAuth: new Date().getTime(),
-							};
-							await that.getData(data, isChange);
-						}
-						console.log("是否获取到初始播放值", data);
+            await that.getData(data, isChange);
+          } else {
+            console.log("这是接口获取的视屏凭证222", res.video, data);
+            data = {
+              ...data,
+              playAuth: new Date().getTime(),
+            };
+            await that.getData(data, isChange);
+          }
+          console.log("是否获取到初始播放值", data);
 
-						that.$forceUpdate();
-					});
-			},
-			async handleEnd() {
-				var list = JSON.parse(JSON.stringify(uni.getStorageSync("videoOssList")));
-				var data = list.find((e) => e.id == this.videoData.id);
-				this.currentTime = data.time;
-				console.log(
-					"this.currentTime at line 这是结束的时候掉的存储视频:",
-					this.currentTime
-				);
-				clearInterval(this.$store.state.videoTimer);
-				this.timer = null;
+          that.$forceUpdate();
+        });
+    },
+    async handleEnd() {
+      var list = JSON.parse(JSON.stringify(uni.getStorageSync("videoOssList")));
+      var data = list.find((e) => e.id == this.videoData.id);
+      this.currentTime = data.time;
+      console.log(
+        "this.currentTime at line 这是结束的时候掉的存储视频:",
+        this.currentTime
+      );
+      clearInterval(this.$store.state.videoTimer);
+      this.timer = null;
 
-				await this.setVideoTime();
-			},
-			setVideoTime(time) {
-				var data = {};
-				// var list = uni.getStorageSync("videoOssList");
+      await this.setVideoTime();
+    },
+    setVideoTime(time) {
+      var data = {};
+      // var list = uni.getStorageSync("videoOssList");
 
-				// data = list.find((e) => e.id == this.videoData.id);
-				// console.log("这是再走生命周期哦", this.currentTime);
-				console.log("是否走了存储视屏," + this.videoData.id, this.currentTime);
-				var data = {
-					videoId: this.videoData.id,
-					position: this.currentTime, //秒数
-				};
+      // data = list.find((e) => e.id == this.videoData.id);
+      // console.log("这是再走生命周期哦", this.currentTime);
+      console.log("是否走了存储视屏," + this.videoData.id, this.currentTime);
+      var data = {
+        videoId: this.videoData.id,
+        position: this.currentTime, //秒数
+      };
 
-				$http
-					.request({
-						url: `sociology/course/saveCoursePosition`,
-						method: "Post", // POST、GET、PUT、DELETE，具体说明查看官方文档
-						data,
-						header: {
-							//默认 无 说明：请求头
-							"Content-Type": "application/json",
-						},
-					})
-					.then((res) => {
-						console.log("存储视屏时长接口返回信息", res);
-						this.$forceUpdate();
-					});
-			},
-			changePlayerTime(player) {
-				console.log("this.firstTime at line 106:", this.firstTime);
-				player.seek(this.firstTime);
-			},
-			goBack() {
-				uni.navigateBack({
-					delta: 1,
-				});
-			},
+      $http
+        .request({
+          url: `sociology/course/saveCoursePosition`,
+          method: "Post", // POST、GET、PUT、DELETE，具体说明查看官方文档
+          data,
+          header: {
+            //默认 无 说明：请求头
+            "Content-Type": "application/json",
+          },
+        })
+        .then((res) => {
+          console.log("存储视屏时长接口返回信息", res);
+          this.$forceUpdate();
+        });
+    },
+    changePlayerTime(player) {
+      console.log("this.firstTime at line 106:", this.firstTime);
+      player.seek(this.firstTime);
+    },
+    goBack() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
 
-			async setVideoFirtsetTime(time) {
-				this.currentTime = this.firstTime;
-				console.log("这里准备开始设置播放时间:", this.currentTime);
-				// await this.setVideoTime();
-				// setTimeout(() => {
-				// clearInterval(this.$store.state.videoTimer);
+    async setVideoFirtsetTime(time) {
+      this.currentTime = this.firstTime;
+      console.log("这里准备开始设置播放时间:", this.currentTime);
+      // await this.setVideoTime();
+      // setTimeout(() => {
+      // clearInterval(this.$store.state.videoTimer);
 
-				store.commit(
-					"setVideoTimer",
-					setInterval(async () => {
-						// if (this.currentTime) {
-						await this.setVideoTime();
-						// }
-					}, 60000)
-				);
-				// }, 5000);
-			},
-		},
+      store.commit(
+        "setVideoTimer",
+        setInterval(async () => {
+          // if (this.currentTime) {
+          await this.setVideoTime();
+          // }
+        }, 60000)
+      );
+      // }, 5000);
+    },
+  },
 
-		created() {},
-	};
+  created() {},
+};
 </script>
 
 <script module="renderScript" lang="renderjs">
-	import $ from 'jquery'
-	//  import StaticADComponent from './staticadcomponent/index.js';
+import $ from 'jquery'
+//  import StaticADComponent from './staticadcomponent/index.js';
+/**
+ * 静态广告组件
+ */
+
+
+export default {
 	/**
 	 * 静态广告组件
 	 */
 
+	components: {
+		// MyComponent
+	},
+	mounted() {
+		// 在适合的生命周期，通过script和link标签引入播放器sdk、css
+		console.log(this.options, '这是monted')
+		this.loadWebPlayerSDK()
+		// this.loadComponent()
+	},
+	data() {
+		return {
+			player: null,
+			videoTimer: null,
+			curTime: null,
+			// firstTime: null,
+			curStatus: null,
+			// currentTime:null,
+		}
+	},
 
-	export default {
-		/**
-		 * 静态广告组件
-		 */
 
-		components: {
-			// MyComponent
+	watch: {
+
+
+		curTime(val) {
+
+			if (this.curTime !== null && this.curStatus !== null) {
+				this.$refs.videoContent1.click()
+			}
+		}
+	},
+
+	methods: {
+
+		handleClick(event, ownerInstance) {
+			console.log('是否了走了点击video事件', event)
+			//             this.player.on('ready',function(){
+			//    var status=  this.player.fullscreenService.getIsFullScreen()
+			//    console.log('status at line 403:', status)
+			// console.log('触发点击事件',status))
+			//   })
+
+			// ownerInstance.callMethod('getData')
+
 		},
-		mounted() {
-			// 在适合的生命周期，通过script和link标签引入播放器sdk、css
-			console.log(this.options, '这是monted')
-			this.loadWebPlayerSDK()
-			// this.loadComponent()
+		emitData(event, ownerInstance) {
+			var that = this;
+
+			ownerInstance.callMethod('recordTime', {
+				time: that.curTime,
+				status: that.curStatus
+			})
+
 		},
-		data() {
-			return {
-				player: null,
-				videoTimer: null,
-				curTime: null,
-				// firstTime: null,
-				curStatus: null,
-				// currentTime:null,
+
+
+		async receiveFirstTime(newValue, oldValue, ownerVm, vm) {
+
+			// if (this.player) {
+			// // this.firstTime=newValue;
+			// // console.log('这是初始播放时间111', this.firstTime,this.player)
+			// //  await this.player.seek(newValue);
+			//  await this.$refs.videoContent4.click()
+
+
+
+			// }
+
+
+		},
+		async receiveisSetFirstTime(newValue, oldValue, ownerVm, vm) {
+			console.log('是否刚开始设置播放时间', newValue, this.firstTime, this.player);
+			// if (this.player) {
+			// 	// this.firstTime=newValue;
+			// 	// await this.player.seek(this.firstTime);
+
+
+
+
+			// }
+
+
+		},
+
+		emitSetData(event, ownerInstance) {
+			var that = this;
+			// this.player.seek(this.firstTime)
+			console.log('是否设置的第一次初始播放', this.firstTime, this.videoData.id);
+
+
+			ownerInstance.callMethod('setVideoFirtsetTime')
+
+		},
+		emitopenShow(event, ownerInstance) {
+			ownerInstance.callMethod('openShow')
+		},
+		changeVideoScreen(event, ownerInstance) {
+			var that = this;
+			// this.$emit('changeScreenLoading',true)
+			var status = this.player.fullscreenService.getIsFullScreen();
+
+
+
+			ownerInstance.callMethod('screenChange', {
+				status: status,
+				primary: status ? 'portrait' : 'landscape'
+			})
+
+
+			if (status) {
+
+
+
+				setTimeout(() => {
+					plus.screen.lockOrientation("portrait-primary"); //锁死屏幕方向为竖屏
+					this.player.fullscreenService.cancelFullScreen();
+					// this.$emit('changeScreenLoading',false);
+
+
+				}, 100);
+
+
+				// this.player.setPlayerSize('100%','200px');
+
+
+
+
+			} else {
+
+				//               this.player.setPlayerSize({
+				//   w:"400px",
+				//   height:'60%'
+				//  });
+				// plus.screen.unlockOrientation();
+				this.player.fullscreenService.requestFullScreen();
+				setTimeout(() => {
+					// this.$emit('changeScreenLoading',false);
+					plus.screen.lockOrientation("landscape-primary");
+
+				}, 100);
+
+
+
+
+
+
 			}
 		},
+		changeVideoData(event, ownerInstance) {
+			var that = this;
 
-
-		watch: {
-
-
-			curTime(val) {
-
-				if (this.curTime !== null && this.curStatus !== null) {
-					this.$refs.videoContent1.click()
-				}
-			}
+			ownerInstance.callMethod('changeVideoData', )
 		},
+		endEmitData(event, ownerInstance) {
+			var that = this;
 
-		methods: {
+			ownerInstance.callMethod('handleEnd', )
+		},
+		getLive() {
+			console.log('这是这只只是666666:', this.firstTime, this.videoData)
 
-			handleClick(event, ownerInstance) {
-				console.log('是否了走了点击video事件', event)
-				//             this.player.on('ready',function(){
-				//    var status=  this.player.fullscreenService.getIsFullScreen()
-				//    console.log('status at line 403:', status)
-				// console.log('触发点击事件',status))
-				//   })
+			if (this.player) {
 
-				// ownerInstance.callMethod('getData')
-
-			},
-			emitData(event, ownerInstance) {
-				var that = this;
-
-				ownerInstance.callMethod('recordTime', {
-					time: that.curTime,
-					status: that.curStatus
-				})
-
-			},
-
-
-			async receiveFirstTime(newValue, oldValue, ownerVm, vm) {
-
-				// if (this.player) {
-				// // this.firstTime=newValue;
-				// // console.log('这是初始播放时间111', this.firstTime,this.player)
-				// //  await this.player.seek(newValue);
-				//  await this.$refs.videoContent4.click()
-
-
-
-				// }
-
-
-			},
-			async receiveisSetFirstTime(newValue, oldValue, ownerVm, vm) {
-				console.log('是否刚开始设置播放时间', newValue, this.firstTime, this.player);
-				// if (this.player) {
-				// 	// this.firstTime=newValue;
-				// 	// await this.player.seek(this.firstTime);
-
-
-
-
-				// }
-
-
-			},
-
-			emitSetData(event, ownerInstance) {
-				var that = this;
-				// this.player.seek(this.firstTime)
-				console.log('是否设置的第一次初始播放', this.firstTime, this.videoData.id);
-
-
-				ownerInstance.callMethod('setVideoFirtsetTime')
-
-			},
-			emitopenShow(event, ownerInstance) {
-				ownerInstance.callMethod('openShow')
-			},
-			changeVideoScreen(event, ownerInstance) {
-				var that = this;
-				// this.$emit('changeScreenLoading',true)
-				var status = this.player.fullscreenService.getIsFullScreen();
-
-
-
-				ownerInstance.callMethod('screenChange', {
-					status: status,
-					primary: status ? 'portrait' : 'landscape'
-				})
-
-
-				if (status) {
-
-
-
-					setTimeout(() => {
-						plus.screen.lockOrientation("portrait-primary"); //锁死屏幕方向为竖屏
-						this.player.fullscreenService.cancelFullScreen();
-						// this.$emit('changeScreenLoading',false);
-
-
-					}, 100);
-
-
-					// this.player.setPlayerSize('100%','200px');
-
-
-
-
-				} else {
-
-					//               this.player.setPlayerSize({
-					//   w:"400px",
-					//   height:'60%'
-					//  });
-					// plus.screen.unlockOrientation();
-					this.player.fullscreenService.requestFullScreen();
-					setTimeout(() => {
-						// this.$emit('changeScreenLoading',false);
-						plus.screen.lockOrientation("landscape-primary");
-
-					}, 100);
+				this.player.dispose();
+				$('#url-player-test').empty();
+				this.player = null;
 
+			}
 
 
 
+			var fullScreenButtonComponent = Aliplayer.Component({
+				/**
+				 * 初始函数，在new对象时调用
+				 *
+				 * @param {string} adAddress - 广告视频地址
+				 * @param {string} toAddress - 广告链接地址
+				 */
+				init: function(status, toAddress) {
+
+					this.fullScreenStatus = status
+					// this.adAddress = adAddress;
+					// this.toAddress = toAddress;
+
+					this.$html = $('.fullScreenButton-container');
+					// this.$html.hide();
+				},
+
+				/**
+				 * 创建广告Dom元素
+				 */
+				createEl: function(el) {
 
 
+					this.$html.find('.ad').attr('src', this.adAddress);
+					var $adWrapper = this.$html.find('.ad-wrapper');
+					$adWrapper.attr('href', this.toAddress);
+					$adWrapper.click(function() {
+						// Aliplayer.util.stopPropagation();
+					});
+					// this.$html.find('.close').click(function () {
+					//   this.$html.hide();
+					// });
+					// $(el).find('.prism-controlbar').append(this.$html);
+					$(el).find('.prism-time-display').after(this.$html);
+				},
+				ready: function(player, e) {
+					// this.$html.hide()
+				},
+				/**
+				 * 隐藏广告
+				 */
+				play: function(player, e) {
+					// this.$html.show();
+				},
+				/**
+				 * 显示广告
+				 */
+				pause: function(player, e) {
+					// this.$html.show();
+				},
+				/**
+				 * 隐藏广告
+				 */
+				playing: function(player, e) {
+					this.$html.show();
+					// this.$html.hide();
+				},
+				waiting: function(player, e) {
+					// this.$html.hide()
+				},
+				timeupdate: function(player, e) {},
+				error: function(player, e) {},
+				/**
+				 * 显示广告
+				 */
+				ended: function(player, e) {
+					// this.$html.show();
 				}
-			},
-			changeVideoData(event, ownerInstance) {
-				var that = this;
+			});
 
-				ownerInstance.callMethod('changeVideoData', )
-			},
-			endEmitData(event, ownerInstance) {
-				var that = this;
-
-				ownerInstance.callMethod('handleEnd', )
-			},
-			getLive() {
-				console.log('这是这只只是666666:', this.firstTime, this.videoData)
-
-				if (this.player) {
-
-					this.player.dispose();
-					$('#url-player-test').empty();
-					this.player = null;
-
-				}
+			console.log('这是查看是否获取到hlstoken', this.videoData.mtsHlsUriToken, this.videoData)
 
 
-
-				var fullScreenButtonComponent = Aliplayer.Component({
-					/**
-					 * 初始函数，在new对象时调用
-					 *
-					 * @param {string} adAddress - 广告视频地址
-					 * @param {string} toAddress - 广告链接地址
-					 */
-					init: function(status, toAddress) {
-
-						this.fullScreenStatus = status
-						// this.adAddress = adAddress;
-						// this.toAddress = toAddress;
-
-						this.$html = $('.fullScreenButton-container');
-						// this.$html.hide();
+			var playerOptions = {
+				id: "url-player-test",
+				width: '100%', //容器的大小
+				height: '100%', //容器的大小
+				"qualitySort": "asc",
+			"format": "m3u8",
+			"mediaType": "video",
+				"cover": "",
+				"autoplay": true,
+			"isLive": false,
+			"rePlay": false,
+			"playsinline": true,
+			"controlBarVisibility": "hover",
+			"useH5Prism": true,
+				components: [
+					//  {
+					//   name: 'BulletScreenComponent',
+					//   type: AliPlayerComponent.BulletScreenComponent,
+					//   /** Descriptions of the scrolling text component parameters: text, style, bulletPosition
+					//    * text: The scrolling text
+					//    * style: The style of the scrolling text
+					//    * bulletPosition: The position of the scrolling text. Valid values: 'top', 'bottom', and 'random'. The default is 'random'.
+					//    */
+					//   args: ['http://101.201.146.165:8088/Pf-EH/statics/uploadFile/2024-05-10/b0f420c7-9178-41ad-9dd6-f59a64a6e190.png']
+					// },
+					{
+						name: 'adComponent',
+						type: fullScreenButtonComponent,
+						args: [
+							'http://101.201.146.165:8088/Pf-EH/statics/uploadFile/2024-05-10/b0f420c7-9178-41ad-9dd6-f59a64a6e190.png'
+						]
+					},
+					{
+						name: 'RateComponent',
+						type: AliPlayerComponent.RateComponent
 					},
 
-					/**
-					 * 创建广告Dom元素
-					 */
-					createEl: function(el) {
+
+					// {
+					//   name: 'RotateMirrorComponent',
+					//   type: AliPlayerComponent.RotateMirrorComponent
+					// },
 
 
-						this.$html.find('.ad').attr('src', this.adAddress);
-						var $adWrapper = this.$html.find('.ad-wrapper');
-						$adWrapper.attr('href', this.toAddress);
-						$adWrapper.click(function() {
-							// Aliplayer.util.stopPropagation();
-						});
-						// this.$html.find('.close').click(function () {
-						//   this.$html.hide();
-						// });
-						// $(el).find('.prism-controlbar').append(this.$html);
-						$(el).find('.prism-time-display').after(this.$html);
+				],
+
+				skinLayout: [{
+						name: "bigPlayButton",
+						align: "blabs",
+						x: 30,
+						y: 80
 					},
-					ready: function(player, e) {
-						// this.$html.hide()
+					{
+						name: "H5Loading",
+						align: "cc"
 					},
-					/**
-					 * 隐藏广告
-					 */
-					play: function(player, e) {
-						// this.$html.show();
+					{
+						name: "errorDisplay",
+						align: "tlabs",
+						x: 0,
+						y: 0
 					},
-					/**
-					 * 显示广告
-					 */
-					pause: function(player, e) {
-						// this.$html.show();
+					{
+						name: "infoDisplay"
 					},
-					/**
-					 * 隐藏广告
-					 */
-					playing: function(player, e) {
-						this.$html.show();
-						// this.$html.hide();
+					{
+						name: "tooltip",
+						align: "blabs",
+						x: 0,
+						y: 56
 					},
-					waiting: function(player, e) {
-						// this.$html.hide()
+					{
+						name: "thumbnail"
 					},
-					timeupdate: function(player, e) {},
-					error: function(player, e) {},
-					/**
-					 * 显示广告
-					 */
-					ended: function(player, e) {
-						// this.$html.show();
-					}
-				});
-
-				console.log('这是查看是否获取到hlstoken', this.videoData.mtsHlsUriToken, this.videoData)
-
-
-				var playerOptions = {
-					id: "url-player-test",
-					// preload: false,
-					// "vid": this.videoData
-					// 	.videoId, // 必选参数，可以通过点播控制台（路径：媒资库>音/视频）查询。示例：1e067a2831b641db90d570b6480f****。
-
-					width: '100%', //容器的大小
-					// videoWidth: '100vw', //容器的大小
-					// videoHeight: '100vh', //容器的大小
-					height: '100%', //容器的大小
-					// playsinline: true,
-					// controlBarVisibility: "click",
-					cover: "",
-					components: [
-						//  {
-						//   name: 'BulletScreenComponent',
-						//   type: AliPlayerComponent.BulletScreenComponent,
-						//   /** Descriptions of the scrolling text component parameters: text, style, bulletPosition
-						//    * text: The scrolling text
-						//    * style: The style of the scrolling text
-						//    * bulletPosition: The position of the scrolling text. Valid values: 'top', 'bottom', and 'random'. The default is 'random'.
-						//    */
-						//   args: ['http://101.201.146.165:8088/Pf-EH/statics/uploadFile/2024-05-10/b0f420c7-9178-41ad-9dd6-f59a64a6e190.png']
-						// },
-						{
-							name: 'adComponent',
-							type: fullScreenButtonComponent,
-							args: [
-								'http://101.201.146.165:8088/Pf-EH/statics/uploadFile/2024-05-10/b0f420c7-9178-41ad-9dd6-f59a64a6e190.png'
-							]
-						},
-						{
-							name: 'RateComponent',
-							type: AliPlayerComponent.RateComponent
-						},
-
-
-						// {
-						//   name: 'RotateMirrorComponent',
-						//   type: AliPlayerComponent.RotateMirrorComponent
-						// },
-
-
-					],
-
-					skinLayout: [{
-							name: "bigPlayButton",
-							align: "blabs",
-							x: 30,
-							y: 80
-						},
-						{
-							name: "H5Loading",
-							align: "cc"
-						},
-						{
-							name: "errorDisplay",
-							align: "tlabs",
-							x: 0,
-							y: 0
-						},
-						{
-							name: "infoDisplay"
-						},
-						{
-							name: "tooltip",
-							align: "blabs",
-							x: 0,
-							y: 56
-						},
-						{
-							name: "thumbnail"
-						},
-						{
-							name: "controlBar",
-							align: "blabs",
-							x: 0,
-							y: 0,
-							children: [{
-									name: "progress",
-									align: "blabs",
-									x: 0,
-									y: 44
-								},
-								{
-									name: "playButton",
-									align: "tl",
-									x: 15,
-									y: 12
-								},
-								{
-									name: "timeDisplay",
-									align: "tl",
-									x: 10,
-									y: 7
-								},
-								// {name: "fullScreenButton", align: "tr", x: 10, y: 12},
-								// {name:"subtitle", align:"tr",x:15, y:12},
-								// {
-								// 	name: "setting",
-								// 	align: "tr",
-								// 	x: 15,
-								// 	y: 12
-								// },
-								{
-									name: "prism-speed-selector",
-									align: "tr",
-									x: 15,
-									y: 12
-								},
-								{
-									name: "volume",
-									align: "tr",
-									x: 5,
-									y: 10
-								}
-							]
-						}
-					]
-
-				}
-
-				if (this.videoData.type == 1) {
-					if (this.videoData.m3u8Url == null || this
-						.videoData.m3u8Url == '') {
-						//console.log('这是私有加密的视频');
-						if (this.$platform == 'ios') {
-							this.$refs.videoContent5.click()
-						} else {
-							playerOptions = {
-								...playerOptions,
-								"playauth": this.videoData.playAuth, // 必选参数，参数值可通过调用GetVideoPlayAuth接口获取。
-								"encryptType": 1, // 必选参数，当播放私有加密流时需要设置本参数值为1。其它情况无需设置。
-								"playConfig": {
-									"EncryptType": 'AliyunVoDEncryption'
-								}
+					{
+						name: "controlBar",
+						align: "blabs",
+						x: 0,
+						y: 0,
+						children: [{
+								name: "progress",
+								align: "blabs",
+								x: 0,
+								y: 44
+							},
+							{
+								name: "playButton",
+								align: "tl",
+								x: 15,
+								y: 12
+							},
+							{
+								name: "timeDisplay",
+								align: "tl",
+								x: 10,
+								y: 7
+							},
+							// {name: "fullScreenButton", align: "tr", x: 10, y: 12},
+							// {name:"subtitle", align:"tr",x:15, y:12},
+							// {
+							// 	name: "setting",
+							// 	align: "tr",
+							// 	x: 15,
+							// 	y: 12
+							// },
+							{
+								name: "prism-speed-selector",
+								align: "tr",
+								x: 15,
+								y: 12
+							},
+							{
+								name: "volume",
+								align: "tr",
+								x: 5,
+								y: 10
 							}
-						}
-					} else if (this.videoData.m3u8Url != null || this.videoData.m3u8Url != '') {
+						]
+					}
+				]
+
+			}
+
+			if (this.videoData.type == 1) {
+				if (this.videoData.m3u8Url == null || this
+					.videoData.m3u8Url == '') {
+					//console.log('这是私有加密的视频');
+					if (this.$platform == 'ios') {
+						this.$refs.videoContent5.click()
+					} else {
 						playerOptions = {
 							...playerOptions,
-							source: this.videoData.m3u8Url,
-							playConfig: {
-								"EncryptType": 'HLSEncryption'
+							"playauth": this.videoData.playAuth, // 必选参数，参数值可通过调用GetVideoPlayAuth接口获取。
+							"encryptType": 1, // 必选参数，当播放私有加密流时需要设置本参数值为1。其它情况无需设置。
+							"playConfig": {
+								"EncryptType": 'AliyunVoDEncryption'
 							}
 						}
-						console.log('这是标准加密的视频');
 					}
-
-
-				} else {
-					playerOptions = {
-						...playerOptions,
-						source: this.videoData.videoUrl
-					}
-					console.log('这是没有加密的视频');
-				}
-
-				if (this.videoData.type == 1 && this.videoData.m3u8Url == null || this.videoData.type == 1 && this
-					.videoData.m3u8Url == '') {
-					playerOptions = {
-						...playerOptions,
-						"playauth": this.videoData.playAuth, // 必选参数，参数值可通过调用GetVideoPlayAuth接口获取。
-						"encryptType": 1, // 必选参数，当播放私有加密流时需要设置本参数值为1。其它情况无需设置。
-						"playConfig": {
-							"EncryptType": 'AliyunVoDEncryption'
-						}
-					}
-					console.log('这是私有加密的视频');
-
-				} else if (this.videoData.type == 1 && this.videoData.m3u8Url != null && this.videoData.type == 1 && this
-					.videoData.m3u8Url != '') {
+				} else if (this.videoData.m3u8Url != null || this.videoData.m3u8Url != '') {
 					playerOptions = {
 						...playerOptions,
 						source: this.videoData.m3u8Url,
@@ -944,481 +927,514 @@
 					}
 					console.log('这是标准加密的视频');
 				}
-				var player = new Aliplayer(playerOptions, function(player) {});
-				this.player = player;
-				console.log('是否拿到第一次初始值呢', this.platform, typeof this.firstTime, this.firstTime)
-				if (this.platform == 'ios') {
 
-					this.player.one('timeupdate', () => {
-						this.player.seek(this.firstTime);
-					})
 
-					player.on('canplay', function() {
-						console.log('这是ios数据缓冲初次设置播放位置判断！！！！')
-						this.player.seek(this.firstTime);
-					})
-					//   var seeked = false;
-					// player.on('loadedmetadata',function  (e) {
-					//   if(!seeked)
-					//   {
-					//     seeked = true;
-					//     this.player.seek(20);
-					//   }
-					// });
-					// player.on('waiting',function(){
-					//   console.log('这是ios数据缓冲初次设置播放位置判断！！！！')
-					//   setTimeout(()=>{
-					//      player.seek(this.firstTime)
-					//   },500)
-
-					//     })
-				} else {
-					this.player.seek(this.firstTime)
+			} else {
+				playerOptions = {
+					...playerOptions,
+					source: this.videoData.videoUrl
 				}
+				console.log('这是没有加密的视频');
+			}
 
+			if (this.videoData.type == 1 && this.videoData.m3u8Url == null || this.videoData.type == 1 && this
+				.videoData.m3u8Url == '') {
+				playerOptions = {
+					...playerOptions,
+					"playauth": this.videoData.playAuth, // 必选参数，参数值可通过调用GetVideoPlayAuth接口获取。
+					"encryptType": 1, // 必选参数，当播放私有加密流时需要设置本参数值为1。其它情况无需设置。
+					"playConfig": {
+						"EncryptType": 'AliyunVoDEncryption'
+					}
+				}
+				console.log('这是私有加密的视频');
 
+			} else if (this.videoData.type == 1 && this.videoData.m3u8Url != null && this.videoData.type == 1 && this
+				.videoData.m3u8Url != '') {
+				playerOptions = {
+					...playerOptions,
+					source: this.videoData.m3u8Url,
+					playConfig: {
+						"EncryptType": 'HLSEncryption'
+					}
+				}
+				console.log('这是标准加密的视频');
+			}
+			var player = new Aliplayer(playerOptions, function(player) {});
+			this.player = player;
+			console.log('是否拿到第一次初始值呢', this.platform, typeof this.firstTime, this.firstTime)
+			if (this.platform == 'ios') {
 
+				this.player.one('timeupdate', () => {
+					this.player.seek(this.firstTime);
+				})
 
-
-				// var seeked = false;
-				//         this.player.on('loadedmetadata',function  (e) {
+				player.on('canplay', function() {
+					console.log('这是ios数据缓冲初次设置播放位置判断！！！！')
+					this.player.seek(this.firstTime);
+				})
+				//   var seeked = false;
+				// player.on('loadedmetadata',function  (e) {
 				//   if(!seeked)
 				//   {
 				//     seeked = true;
-				//     player.seek(this.firstTime);
+				//     this.player.seek(20);
 				//   }
 				// });
-
-
-
-
-				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.fullscreenService.requestFullScreen()
-
-				})
-
-				//  this.
-
-
-				// this.$refs.videoContent.click()
-				this.player.on('ended', function() {
-					// console.log('that.curTime at line 242:', this.curTime)
-					// console.log('that.curStatus at line 210:', this.curStatus)
-					this.$refs.videoContent2.click()
-
-
-
-
-				})
-
-
-
-				// player.setRotate(90)
-
-				//全屏播放
-
-				// player.one('canplay', function() {
-				//     // console.log('canplay', this.player.tag);
-				//     player.tag.play();
-
-				// });
-
-
-
-			},
-			showPreview(e) {
-				// console.log('e at line 56:', e)
-				let conimg = e.target.dataset.nodes;
-				let imgs = conimg.match(/<img[^>]+>/g); //选择节点中的img
-				console.log('imgs at line 59:', imgs)
-				let imgList = [];
-				//遍历img标签的src里面的内容放在定义的数组imgList中
-				for (var j = 0; j < imgs.length; j++) {
-					imgs[j].replace(/<img[^>]*src=['"]([^'"]+)[^>]*>/gi, function(match, capture) {
-						imgList.push(capture)
-
-					})
-				}
-				console.log('imgList.push at line 64:', imgList)
-
-
-				//最后一步就是所有图片放在预览的方法previewImage中就可以了
-				// uni.previewImage({
-				//     current: imgList,
-				//     urls: imgList,
-				// })
-				uni.previewImage({
-					urls: imgList,
-					longPressActions: {
-						itemList: ['很抱歉，暂不支持保存图片到本地'],
-						success: function(res) {
-							// console.log(res,'+++++')
-						}
-					}
-				});
-
-			},
-
-			receiveScreenType(newValue) {
-				// console.log('newValue at line 427屏幕方向111111111111:', newValue)
-
-			},
-			async receiveIsfresh(newValue) {
-
-
-
-				console.log('是否走了刷新销毁方法:', this.player)
-				if (this.player) {
-					clearInterval(this.$store.state.videoTimer)
-					// await this.setVideoTime();
-					this.player.dispose();
-					// $('#url-player-test').empty()
-
-					// this.player.seek(newValue);
-				}
-
-
-			},
-			async receiveplatform(newValue) {
-
-
-
-
-
-
-			},
-			async receiveIsChange(newValue) {
-
-
-				// this.timer=null
-
-				if (this.isChange) {
-
-					this.checkValue()
-
-					// if (this.videoData.type == 1) {
-					// 	console.log('是否走了切换加密视频方法:', this.isChange, this.videoData)
-					// 	await this.player.replayByVidAndPlayAuth(this.videoData.video, this.videoData.playAuth)
-					//   this.$refs.videoContent.click()
-					// } else {
-					// 	console.log('是否走了切换老视频/音频方法:', this.isChange, this.videoData)
-					// await	this.player.loadByUrl(this.videoData.videoUrl)
-					// this.$refs.videoContent.click()
-					// }
-
-				}
-
-
-				// this.$refs.videoContent3.click()
-
-			},
-
-			receiveVideoList(newValue, oldValue, ownerVm, vm) {
-				// //数据变化
-
-				console.log('currentVideoListcurrentVideoListcurrentVideoList', newValue)
-
-
-
-
-
-			},
-			receiveMsg(newValue, oldValue, ownerVm, vm) {
-				//数据变化
-				// console.log('newValue', newValue)
-				// console.log('oldValue', oldValue)
-				// console.log('ownerVm', ownerVm)
-				// console.log('vm', vm)
-			},
-			receiveWinWidth(newValue, oldValue, ownerVm, vm) {
-				//数据变化
-				console.log('newValue', newValue)
-				// console.log('oldValue', oldValue)
-				// console.log('ownerVm', ownerVm)
-				// console.log('vm', vm)
-			},
-			receiveWinHeight(newValue, oldValue, ownerVm, vm) {
-				//数据变化
-				console.log('newValue', newValue)
-				// console.log('oldValue', oldValue)
-				// console.log('ownerVm', ownerVm)
-				// console.log('vm', vm)
-			},
-			checkValue() {
-				console.log(this.videoId, this.authId, this.videoData, "1111888888")
-				if ((!this.videoData.playAuth || !this.currentVideoList)) {
-					setTimeout(() => {
-						this.checkValue();
-					}, 1000);
-				} else {
-
-					console.log('这是这只只是594:', this.firstTime, this.videoData)
-					this.getLive();
-				}
-			},
-			loadWebPlayerSDK() {
-				return new Promise((resolve, reject) => {
-
-
-
-					const s_tag = document.createElement('script'); // 引入播放器js
-					s_tag.type = 'text/javascript';
-					s_tag.src = 'https://g.alicdn.com/apsara-media-box/imp-web-player/2.20.3/aliplayer-min.js';
-					s_tag.charset = 'utf-8';
-					s_tag.onload = () => {
-						const s_tag1 = document.createElement('script'); // 引入播放器js
-						s_tag1.type = 'text/javascript';
-						s_tag1.src =
-							'https://player.alicdn.com/aliplayer/presentation/js/aliplayercomponents.min.js';
-						s_tag1.charset = 'utf-8';
-						s_tag1.onload = () => {
-							this.checkValue();
-							resolve();
-
-						}
-						document.body.appendChild(s_tag1);
-
-					}
-					document.body.appendChild(s_tag);
-
-
-
-					const l_tag = document.createElement('link'); // 引入播放器css
-					l_tag.rel = 'stylesheet';
-					l_tag.href =
-						'https://g.alicdn.com/apsara-media-box/imp-web-player/2.20.3/skins/default/aliplayer-min.css';
-
-
-
-					document.body.appendChild(l_tag);
-				});
-			},
-			loadComponent() {
-				// return new Promise((resolve, reject) => {
-				//     const s_tag = document.createElement('script');
-				//     s_tag.type = 'text/javascript';
-				//     // 需要先下载组件 js 文件，放到项目 /static/ 目录下
-				//     // 下载地址：https://github.com/aliyunvideo/AliyunPlayer_Web/blob/master/customComponents/dist/aliplayer-components/aliplayercomponents-1.0.9.min.js
-				//     s_tag.src = '@/static/aliplayercomponents.js';
-				//     s_tag.charset = 'utf-8';
-				//     s_tag.onload = () => {
-				//         resolve();
-				//     }
-				//     document.body.appendChild(s_tag);
-				// });
+				// player.on('waiting',function(){
+				//   console.log('这是ios数据缓冲初次设置播放位置判断！！！！')
+				//   setTimeout(()=>{
+				//      player.seek(this.firstTime)
+				//   },500)
+
+				//     })
+			} else {
+				this.player.seek(this.firstTime)
 			}
+
+
+
+
+
+			// var seeked = false;
+			//         this.player.on('loadedmetadata',function  (e) {
+			//   if(!seeked)
+			//   {
+			//     seeked = true;
+			//     player.seek(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.fullscreenService.requestFullScreen()
+
+			})
+
+			//  this.
+
+
+			// this.$refs.videoContent.click()
+			this.player.on('ended', function() {
+				// console.log('that.curTime at line 242:', this.curTime)
+				// console.log('that.curStatus at line 210:', this.curStatus)
+				this.$refs.videoContent2.click()
+
+
+
+
+			})
+
+
+
+			// player.setRotate(90)
+
+			//全屏播放
+
+			// player.one('canplay', function() {
+			//     // console.log('canplay', this.player.tag);
+			//     player.tag.play();
+
+			// });
+
+
+
+		},
+		showPreview(e) {
+			// console.log('e at line 56:', e)
+			let conimg = e.target.dataset.nodes;
+			let imgs = conimg.match(/<img[^>]+>/g); //选择节点中的img
+			console.log('imgs at line 59:', imgs)
+			let imgList = [];
+			//遍历img标签的src里面的内容放在定义的数组imgList中
+			for (var j = 0; j < imgs.length; j++) {
+				imgs[j].replace(/<img[^>]*src=['"]([^'"]+)[^>]*>/gi, function(match, capture) {
+					imgList.push(capture)
+
+				})
+			}
+			console.log('imgList.push at line 64:', imgList)
+
+
+			//最后一步就是所有图片放在预览的方法previewImage中就可以了
+			// uni.previewImage({
+			//     current: imgList,
+			//     urls: imgList,
+			// })
+			uni.previewImage({
+				urls: imgList,
+				longPressActions: {
+					itemList: ['很抱歉，暂不支持保存图片到本地'],
+					success: function(res) {
+						// console.log(res,'+++++')
+					}
+				}
+			});
+
+		},
+
+		receiveScreenType(newValue) {
+			// console.log('newValue at line 427屏幕方向111111111111:', newValue)
+
+		},
+		async receiveIsfresh(newValue) {
+
+
+
+			console.log('是否走了刷新销毁方法:', this.player)
+			if (this.player) {
+				clearInterval(this.$store.state.videoTimer)
+				// await this.setVideoTime();
+				this.player.dispose();
+				// $('#url-player-test').empty()
+
+				// this.player.seek(newValue);
+			}
+
+
+		},
+		async receiveplatform(newValue) {
+
+
+
+
+
+
+		},
+		async receiveIsChange(newValue) {
+
+
+			// this.timer=null
+
+			if (this.isChange) {
+
+				this.checkValue()
+
+				// if (this.videoData.type == 1) {
+				// 	console.log('是否走了切换加密视频方法:', this.isChange, this.videoData)
+				// 	await this.player.replayByVidAndPlayAuth(this.videoData.video, this.videoData.playAuth)
+				//   this.$refs.videoContent.click()
+				// } else {
+				// 	console.log('是否走了切换老视频/音频方法:', this.isChange, this.videoData)
+				// await	this.player.loadByUrl(this.videoData.videoUrl)
+				// this.$refs.videoContent.click()
+				// }
+
+			}
+
+
+			// this.$refs.videoContent3.click()
+
+		},
+
+		receiveVideoList(newValue, oldValue, ownerVm, vm) {
+			// //数据变化
+
+			console.log('currentVideoListcurrentVideoListcurrentVideoList', newValue)
+
+
+
+
+
+		},
+		receiveMsg(newValue, oldValue, ownerVm, vm) {
+			//数据变化
+			// console.log('newValue', newValue)
+			// console.log('oldValue', oldValue)
+			// console.log('ownerVm', ownerVm)
+			// console.log('vm', vm)
+		},
+		receiveWinWidth(newValue, oldValue, ownerVm, vm) {
+			//数据变化
+			console.log('newValue', newValue)
+			// console.log('oldValue', oldValue)
+			// console.log('ownerVm', ownerVm)
+			// console.log('vm', vm)
+		},
+		receiveWinHeight(newValue, oldValue, ownerVm, vm) {
+			//数据变化
+			console.log('newValue', newValue)
+			// console.log('oldValue', oldValue)
+			// console.log('ownerVm', ownerVm)
+			// console.log('vm', vm)
+		},
+		checkValue() {
+			console.log(this.videoId, this.authId, this.videoData, "1111888888")
+			if ((!this.videoData.playAuth || !this.currentVideoList)) {
+				setTimeout(() => {
+					this.checkValue();
+				}, 1000);
+			} else {
+
+				console.log('这是这只只是594:', this.firstTime, this.videoData)
+				this.getLive();
+			}
+		},
+		loadWebPlayerSDK() {
+			return new Promise((resolve, reject) => {
+
+
+
+				const s_tag = document.createElement('script'); // 引入播放器js
+				s_tag.type = 'text/javascript';
+				s_tag.src = 'https://g.alicdn.com/apsara-media-box/imp-web-player/2.20.3/aliplayer-min.js';
+				s_tag.charset = 'utf-8';
+				s_tag.onload = () => {
+					const s_tag1 = document.createElement('script'); // 引入播放器js
+					s_tag1.type = 'text/javascript';
+					s_tag1.src =
+						'https://player.alicdn.com/aliplayer/presentation/js/aliplayercomponents.min.js';
+					s_tag1.charset = 'utf-8';
+					s_tag1.onload = () => {
+						this.checkValue();
+						resolve();
+
+					}
+					document.body.appendChild(s_tag1);
+
+				}
+				document.body.appendChild(s_tag);
+
+
+
+				const l_tag = document.createElement('link'); // 引入播放器css
+				l_tag.rel = 'stylesheet';
+				l_tag.href =
+					'https://g.alicdn.com/apsara-media-box/imp-web-player/2.20.3/skins/default/aliplayer-min.css';
+
+
+
+				document.body.appendChild(l_tag);
+			});
+		},
+		loadComponent() {
+			// return new Promise((resolve, reject) => {
+			//     const s_tag = document.createElement('script');
+			//     s_tag.type = 'text/javascript';
+			//     // 需要先下载组件 js 文件，放到项目 /static/ 目录下
+			//     // 下载地址：https://github.com/aliyunvideo/AliyunPlayer_Web/blob/master/customComponents/dist/aliplayer-components/aliplayercomponents-1.0.9.min.js
+			//     s_tag.src = '@/static/aliplayercomponents.js';
+			//     s_tag.charset = 'utf-8';
+			//     s_tag.onload = () => {
+			//         resolve();
+			//     }
+			//     document.body.appendChild(s_tag);
+			// });
 		}
 	}
+}
 </script>
 <style>
-	.container {
-		width: 100vw;
-		height: auto;
+.container {
+  width: 100vw;
+  height: auto;
 
-		/deep/.pause {
-			width: 60rpx !important;
-			height: 60rpx !important;
-		}
-	}
+  /deep/.pause {
+    width: 60rpx !important;
+    height: 60rpx !important;
+  }
+}
 
-	.fds {
-		background-color: blue;
-		height: 600rpx;
-		position: fixed;
-		top: 60rpx;
-	}
+.fds {
+  background-color: blue;
+  height: 600rpx;
+  position: fixed;
+  top: 60rpx;
+}
 
-	.returnBack {
-		flex-direction: row;
-		justify-content: flex-start;
-		align-items: center;
-		height: 88rpx;
-		padding-left: 20rpx;
-	}
+.returnBack {
+  flex-direction: row;
+  justify-content: flex-start;
+  align-items: center;
+  height: 88rpx;
+  padding-left: 20rpx;
+}
 
-	.txt {
-		color: #fff;
-	}
+.txt {
+  color: #fff;
+}
 
-	.right_title {
-		background: #000;
-		height: 96rpx;
-		justify-content: space-between;
-		flex-direction: row;
-		align-items: center;
-		margin-left: auto;
-	}
+.right_title {
+  background: #000;
+  height: 96rpx;
+  justify-content: space-between;
+  flex-direction: row;
+  align-items: center;
+  margin-left: auto;
+}
 
-	.return {
-		flex-direction: row;
-		align-items: center;
-		color: #fff;
-	}
+.return {
+  flex-direction: row;
+  align-items: center;
+  color: #fff;
+}
 
-	.right_handle {
-		width: 200rpx;
-		flex-direction: row;
-		justify-content: flex-end;
-		padding-right: 20rpx;
-	}
+.right_handle {
+  width: 200rpx;
+  flex-direction: row;
+  justify-content: flex-end;
+  padding-right: 20rpx;
+}
 
-	cover-view {
-		display: block;
-		line-height: 1.2;
-		overflow: hidden;
-		white-space: nowrap;
-		pointer-events: auto;
-	}
+cover-view {
+  display: block;
+  line-height: 1.2;
+  overflow: hidden;
+  white-space: nowrap;
+  pointer-events: auto;
+}
 
-	cover-view {
-		visibility: visible !important;
-	}
+cover-view {
+  visibility: visible !important;
+}
 
-	cover-image {
-		visibility: visible !important;
-	}
+cover-image {
+  visibility: visible !important;
+}
 
-	.fullScreenButton-container {
-		color: #fff;
-		float: right;
-		height: 35px;
-		margin-top: 6px;
-		margin-right: 5px;
-		display: flex;
-		align-items: center;
-		position: relative;
+.fullScreenButton-container {
+  color: #fff;
+  float: right;
+  height: 35px;
+  margin-top: 6px;
+  margin-right: 5px;
+  display: flex;
+  align-items: center;
+  position: relative;
 
-		i {
-			color: #fff;
-			display: inline-block;
-			font-size: 22px;
-			display: block;
-			margin-top: 7px;
-			cursor: pointer;
+  i {
+    color: #fff;
+    display: inline-block;
+    font-size: 22px;
+    display: block;
+    margin-top: 7px;
+    cursor: pointer;
 
-			&+i {
-				margin-left: 3px;
-			}
+    & + i {
+      margin-left: 3px;
+    }
 
-			@media (min-width: 768px) {
-				&:hover+.player-tooltip {
-					display: block;
-				}
-			}
-		}
+    @media (min-width: 768px) {
+      &:hover + .player-tooltip {
+        display: block;
+      }
+    }
+  }
 
-		.player-tooltip {
-			&.prev {
-				left: -10px;
-			}
+  .player-tooltip {
+    &.prev {
+      left: -10px;
+    }
 
-			&.list {
-				left: 5px;
-			}
+    &.list {
+      left: 5px;
+    }
 
-			&.next {
-				right: -12px;
-			}
-		}
-	}
+    &.next {
+      right: -12px;
+    }
+  }
+}
 
-	.playlist-content {
-		position: absolute;
-		right: 0;
-		width: 0px;
-		padding-bottom: 48px;
-		box-sizing: border-box;
-		height: 100%;
-		transition: all 0.38s ease-in-out;
-		overflow: hidden;
+.playlist-content {
+  position: absolute;
+  right: 0;
+  width: 0px;
+  padding-bottom: 48px;
+  box-sizing: border-box;
+  height: 100%;
+  transition: all 0.38s ease-in-out;
+  overflow: hidden;
 
-		.list {
-			background-color: #000;
-			background-color: rgba(0, 0, 0, 0.3);
-			height: 100%;
-			overflow: auto;
+  .list {
+    background-color: #000;
+    background-color: rgba(0, 0, 0, 0.3);
+    height: 100%;
+    overflow: auto;
 
-			.video-item {
-				color: #fff;
-				padding: 0px 10px;
-				line-height: 35px;
-				font-size: 14px;
-				white-space: nowrap;
-				overflow: hidden;
-				text-overflow: ellipsis;
-				cursor: pointer;
+    .video-item {
+      color: #fff;
+      padding: 0px 10px;
+      line-height: 35px;
+      font-size: 14px;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      cursor: pointer;
 
-				&.active {
-					background-color: #000;
-					color: #00ddff;
-				}
+      &.active {
+        background-color: #000;
+        color: #00ddff;
+      }
 
-				@media (min-width: 768px) {
-					&:hover {
-						background-color: #000;
-						color: #00ddff;
-					}
-				}
-			}
-		}
-	}
+      @media (min-width: 768px) {
+        &:hover {
+          background-color: #000;
+          color: #00ddff;
+        }
+      }
+    }
+  }
+}
 
-	.player-tooltip {
-		position: absolute;
-		display: none;
-		font-size: 12px;
-		color: #fff;
-		line-height: 28px;
-		letter-spacing: 0;
-		text-align: center;
-		background: #3c3c3c;
-		box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
-		height: 28px;
-		top: -48px;
-		padding: 0 5px;
-		white-space: nowrap;
-	}
+.player-tooltip {
+  position: absolute;
+  display: none;
+  font-size: 12px;
+  color: #fff;
+  line-height: 28px;
+  letter-spacing: 0;
+  text-align: center;
+  background: #3c3c3c;
+  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
+  height: 28px;
+  top: -48px;
+  padding: 0 5px;
+  white-space: nowrap;
+}
 
-	.playlist-skip-tip {
-		padding: 5px 15px;
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		z-index: 30;
-		line-height: 30px;
-		font-size: 14px;
-		border-radius: 4px;
-		background: rgba(255, 255, 255, 0.8);
-		color: #000;
-		text-align: center;
-		transform: translate(-50%, -50%);
-	}
+.playlist-skip-tip {
+  padding: 5px 15px;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  z-index: 30;
+  line-height: 30px;
+  font-size: 14px;
+  border-radius: 4px;
+  background: rgba(255, 255, 255, 0.8);
+  color: #000;
+  text-align: center;
+  transform: translate(-50%, -50%);
+}
 
-	#rotating-div {
-		width: 100vw;
-		height: 100vh;
-		background-color: #3498db;
-		transform: rotate(90deg);
-		/* 旋转90度 */
-		transform-origin: center center;
-		/* 设置旋转中心点在div中心 */
-		position: fixed;
-		/* 固定定位，全屏显示 */
-		left: 0;
-		top: 0;
-		bottom: 0;
-		right: 0;
-	}
-</style>
\ No newline at end of file
+#rotating-div {
+  width: 100vw;
+  height: 100vh;
+  background-color: #3498db;
+  transform: rotate(90deg);
+  /* 旋转90度 */
+  transform-origin: center center;
+  /* 设置旋转中心点在div中心 */
+  position: fixed;
+  /* 固定定位，全屏显示 */
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+}
+</style>