detail.vue 53 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048
  1. <template>
  2. <view class="polyv_detail">
  3. <uni-nav-bar v-if="isShowBar" left-icon="back" :statusBar="true" fixed="true"
  4. :title="detail.courseName || '课程详情'" @clickLeft="clickLeft"></uni-nav-bar>
  5. <view id="top">
  6. <view class="video_box" v-if="!playVid">
  7. <image :src="$method.splitImgHost(goodsData.coverUrl)" mode="widthFix"
  8. style="width: 100%; height: 421rpx">
  9. </image>
  10. </view>
  11. <view v-else-if="playSource == 1">
  12. <my-player ref="player" :playVid="playVid" :autoplay="autoplay" :allowSeek="isAllowSeek"
  13. :playbackRate="playbackRate" :videoCurrentTime="videoCurrentTime || 0" @playing="playing"
  14. @pause="pause" @ended="ended" @loadedmetadata="loadedmetadata" @timeupdate="timeupdate"
  15. @playerError="playerError" @studyLog="studyLog"></my-player>
  16. </view>
  17. <view v-else>
  18. <my-player2 ref="player2" :playFileId="playVid" :autoplay="autoplay" :progressControl="isAllowSeek"
  19. :playbackRate="playbackRate" :currentTime="videoCurrentTime || 0" @playing="playing" @pause="pause"
  20. @ended="ended" @loadedmetadata="loadedmetadata" @timeupdate="timeupdate" @playerError="playerError"
  21. @studyLog="studyLog"></my-player2>
  22. </view>
  23. <view class="course_name">
  24. <view class="course_titles">
  25. <view class="video_t1" :class="{ one: !goodsData.buyNote }">{{
  26. detail.courseName
  27. }}</view>
  28. <view class="notice_wrap" v-if="goodsData.buyNote">
  29. <view class="video_t1_t" @click="studyNotice"> 学员须知 </view>
  30. </view>
  31. <view class="toggle_course" v-if="goodsTeacher.length > 1" @click="changeCourses()">
  32. <image class="img" src="/pages3/static/imgs/toggle.png" mode="widthFix"></image>
  33. <view class="toggle_name">切换课程</view>
  34. <view class="numbers">共{{ goodsTeacher.length }}门</view>
  35. </view>
  36. </view>
  37. </view>
  38. <u-line color="#D6D6DB" />
  39. <view>
  40. <view>
  41. <u-tabs :item-width="itemWidth()" :list="list" font-size="32" bar-width="24" :current="current"
  42. @change="change" active-color="#007AFF"></u-tabs>
  43. </view>
  44. </view>
  45. <u-line color="#D6D6DB" />
  46. </view>
  47. <view class="box" :class="{ first_ml: current == 0 }">
  48. <scroll-view class="box_in" scroll-y="true">
  49. <!--目录 -->
  50. <view v-show="current == 0">
  51. <view class="top__header" v-if="livingItem" @click="goLive(livingItem)">
  52. <image class="img" src="/pages3/static/imgs/live.png" mode="widthFix"></image>
  53. <view class="note">正在直播中</view>
  54. <view class="title">{{ livingItem.sectionName }}</view>
  55. </view>
  56. <course-tree v-if="sectionItem.id || sectionItem.sectionId" :sectionMaxNum="goodsData.sectionMaxNum"
  57. :isRebuild="false" :isBuy="true" @isHaverebuild="isHaverebuild = true"></course-tree>
  58. </view>
  59. <!--讲义 -->
  60. <view v-if="current == 1">
  61. <handouts-box :handoutsId="goodsData.handoutsId"></handouts-box>
  62. </view>
  63. <!--笔记 -->
  64. <view v-if="current == 2">
  65. <note-Box @jumpNote="jumpNote"></note-Box>
  66. </view>
  67. <!--答疑 -->
  68. <view v-if="current == 3">
  69. <answer-box :userId="userInfo ? userInfo.userId : 0"></answer-box>
  70. </view>
  71. <!--重修目录 -->
  72. <view v-if="current == 4">
  73. <course-tree v-if="sectionItem.id || sectionItem.sectionId" :sectionMaxNum="goodsData.sectionMaxNum"
  74. :isRebuild="true" :isBuy="true"></course-tree>
  75. </view>
  76. </scroll-view>
  77. </view>
  78. <u-popup v-model="noticeShow" class="notice_modal" mode="center" border-radius="28" width="650rpx"
  79. height="622rpx" :mask-close-able="false">
  80. <view class="content">
  81. <view class="title">学员须知</view>
  82. <scroll-view scroll-y="true">
  83. <view class="text" v-html="
  84. goodsData.buyNote && goodsData.buyNote.replace(/\n|\r\n/g, '<br>')
  85. ">
  86. </view>
  87. </scroll-view>
  88. <view class="had_read" :class="{ gray: CountTo > 0 }" @click="noticeConfirm()">
  89. <text v-if="CountTo > 0">请阅读学员须知,{{ " " + CountTo + "s" }}后可关闭</text>
  90. <text v-else>我已阅读学员须知</text>
  91. </view>
  92. </view>
  93. </u-popup>
  94. <!-- 倒计时提交 -->
  95. <u-popup v-model="noticeShow1" class="notice_modal" mode="center" border-radius="28" width="650rpx"
  96. height="262rpx" :mask-close-able="false">
  97. <view class="content">
  98. <view class="title">提示</view>
  99. <view class="had_read">
  100. <text v-if="CountTo1 >= 0">视频学习时长不达标,请等待</text>
  101. <text v-if="CountTo1 >= 0">{{ " " + CountTo1 + "s" }}</text>
  102. </view>
  103. </view>
  104. </u-popup>
  105. <u-modal v-model="showMark" title="提示" @confirm="markConfirm" @cancel="toBack" confirm-text="复制学习网址"
  106. :show-cancel-button="true" cancel-text="关闭">
  107. <view class="slot-content">
  108. <view>您的学习账号已经开通,请按照步骤操作,进行学习。</view>
  109. <view>1.复制学习地址:{{ markContent }}</view>
  110. <view>2.在【浏览器中】打开复制的学习网址</view>
  111. <view>3.打开学习网址后,选择【个人用户】进行登录</view>
  112. <view>(1)账号:您个人的身份证号码</view>
  113. <view>(2)密码:身份证号码,再加111111</view>
  114. </view>
  115. </u-modal>
  116. <!-- 切换课程弹窗 -->
  117. <u-popup v-model="toggleCourseShow" mode="bottom" border-radius="40" :mask-close-able="false">
  118. <view class="popup_box">
  119. <view class="check_head">
  120. <view class="headers">
  121. <view class="grade">切换课程</view>
  122. <u-icon name="close" color="#9C9C9C" size="40" @click="closePop()"></u-icon>
  123. </view>
  124. <view class="coruse_num">共{{ goodsTeacher.length }}门</view>
  125. <view class="menuSel">
  126. <scroll-view class="sub_sliper" scroll-x="true">
  127. <view v-for="(item, index) in subList" :key="index"
  128. style="margin-right: 50rpx; display: inline-block">
  129. <view class="r_t1" :class="{ nactive: subIndex == index }" @click="cMenu(item, index)">
  130. {{ item.subjectName }}
  131. </view>
  132. </view>
  133. </scroll-view>
  134. </view>
  135. </view>
  136. <view class="check_con">
  137. <scroll-view scroll-y="true" style="height: 700rpx">
  138. <view v-for="(courseItem, gTindex) in goodsTeacher" :key="gTindex">
  139. <view v-for="(item, index) in courseItem.courseList" :key="index" v-show="
  140. item.subjectId === newActiveSubjectId || !newActiveSubjectId
  141. ">
  142. <view class="course_items" v-if="item.show && item.show == 1">
  143. <view class="course_lefts">
  144. <view class="course_title">
  145. {{ item.courseName }}
  146. </view>
  147. <view v-if="courseItem.teaList && courseItem.teaList.length > 0"
  148. class="teacher_names">
  149. <view v-for="(tea, tindex) in courseItem.teaList" :key="tindex"
  150. class="names">{{ tea.aliasName }}
  151. </view>
  152. </view>
  153. <view class="course_pros">
  154. 学习进度
  155. <text>
  156. {{ item.stuAllNum + item.recordNum }}/{{
  157. item.secAllNum + item.examNum
  158. }}</text>
  159. </view>
  160. </view>
  161. <view class="course_rights" @click="jump(item, gTindex, 'jump')">
  162. <view class="cicles">
  163. <u-icon name="arrow-right" color="#498AFE" size="20"></u-icon>
  164. </view>
  165. <view class="intoStudy">进入学习</view>
  166. </view>
  167. </view>
  168. </view>
  169. </view>
  170. </scroll-view>
  171. </view>
  172. </view>
  173. </u-popup>
  174. <!-- 摄像头 -->
  175. <Popup-camera @submitPhoto="submitPhoto" :visible.sync="showCamera" ref="camera" />
  176. </view>
  177. </template>
  178. <script>
  179. import handoutsBox from "@/components/course/handoutsBox.vue";
  180. import courseTree from "@/components/course/courseTree.vue";
  181. import PopupCamera from "../../components/popup/camera.vue";
  182. import myPlayer from "@/components/myPlayer/polyvPlayer.vue";
  183. import myPlayer2 from "@/components/myPlayer2/tcPlayer.vue";
  184. import noteBox from "@/components/course/noteBox.vue";
  185. import answerBox from "@/components/course/answerBox.vue";
  186. import {
  187. mapGetters,
  188. mapMutations
  189. } from "vuex";
  190. import {
  191. lockAction
  192. } from "../../utils/lock";
  193. import {
  194. debounce,
  195. throttle,
  196. reload
  197. } from "../../utils/common";
  198. export default {
  199. components: {
  200. handoutsBox,
  201. myPlayer,
  202. myPlayer2,
  203. noteBox,
  204. answerBox,
  205. courseTree,
  206. PopupCamera,
  207. },
  208. data() {
  209. return {
  210. markContent: "http://admin.zhujianpeixun.com/",
  211. showMark: false,
  212. lockTimer: null,
  213. orderGoodsId: 0,
  214. noticeShow: false,
  215. showSet: false,
  216. courseId: 0,
  217. current: 0,
  218. playSource: 1,
  219. vid: "",
  220. goodsId: 0,
  221. goodsData: {},
  222. showCamera: false,
  223. goodsPlayConfig: null,
  224. autoplay: false,
  225. isAllowSeek: "no",
  226. playbackRate: [1.0],
  227. timer: null,
  228. goodsPhotographConfig: null,
  229. playTime: 0, // 播放时刻
  230. avatarUrl: "",
  231. ossAvatarUrl: "",
  232. gradeId: 0,
  233. chapterId: 0,
  234. moduleId: 0,
  235. videoCurrentTime: 0,
  236. photoIndex: 0,
  237. photoNum: 0,
  238. photoList: [], //拍照的时间点
  239. photoConfig: false, //是否配置好拍照次数
  240. photoHistoryList: [], //已拍照历史的下标点
  241. sectionItem: {},
  242. isShowBar: true,
  243. isRebuild: false, //视频是否从重修目录点击
  244. livingItem: "",
  245. option: null,
  246. toggleCourseShow: false, // 切换课程弹窗
  247. courseList: [], // 课程列表
  248. subList: [],
  249. subIndex: 0,
  250. goodsTeacher: [],
  251. teacherList: [],
  252. teacherIndex: 0,
  253. newActiveSubjectId: "", //当前选中ID
  254. compareFaceData: 0, // 拍照匹配相似度
  255. prendreAutoCarme: false, // 是否发起授权相机
  256. CountTo: 0, // 倒计时
  257. CountTo1: 0,
  258. menuAllList: [],
  259. curPlayIndex: 0, // 正在播放的节的下标
  260. faceUrl: "",
  261. erJianErZao: false,
  262. jjShiGongYuan: false,
  263. pauseTime: 0,
  264. pauseTimer: null,
  265. isReach: false,
  266. noticeShow1: false,
  267. refPlv: null,
  268. isCache: false,
  269. isHaverebuild: false,
  270. isPlaying: false,
  271. beforeHideIsPlaying: false,
  272. isLeave: false,
  273. text: "",
  274. throttleFn: throttle(this.postStudyRecord, 15000)
  275. };
  276. },
  277. computed: {
  278. ...mapGetters(["userInfo", "other"]),
  279. playSecIsLearn() {
  280. if (!this.playVid) {
  281. return false;
  282. }
  283. return this.sectionItem.learning != 1;
  284. },
  285. orderNum() {
  286. return this.goodsData.goodsLearningOrder;
  287. },
  288. list() {
  289. let list = [{
  290. name: "目录",
  291. },
  292. {
  293. name: "讲义",
  294. },
  295. {
  296. name: "笔记",
  297. },
  298. {
  299. name: "答疑",
  300. },
  301. ];
  302. if (this.isHaverebuild) {
  303. list.push({
  304. name: "重修目录"
  305. });
  306. }
  307. return list;
  308. },
  309. params: function() {
  310. return (keys = ["orderGoodsId", "goodsId", "courseId"]) => {
  311. let params = {};
  312. for (const key of keys) {
  313. params[key] = this[key];
  314. }
  315. return params;
  316. };
  317. },
  318. detail() {
  319. if (!this.courseId || !this.courseList.length) {
  320. return {};
  321. }
  322. return this.courseList.find((e) => e.courseId == this.courseId);
  323. },
  324. sectionId() {
  325. return this.sectionItem.sectionId || this.sectionItem.id;
  326. },
  327. playVid() {
  328. return this.sectionItem.recordingUrl;
  329. },
  330. isPlayRebuild() {
  331. return this.sectionItem.rebuild != 1;
  332. },
  333. },
  334. async onLoad(option) {
  335. // #ifdef H5
  336. console.error(this.$method.myBrowser(), '浏览器')
  337. if (this.$method.myBrowser() == 'UC') {
  338. uni.showModal({
  339. title: "提示",
  340. content: "请使用其他浏览器进行学习",
  341. showCancel: false,
  342. complete: () => {
  343. uni.switchTab({
  344. url: "/pages/learn/index",
  345. });
  346. }
  347. })
  348. return
  349. }
  350. // #endif
  351. // 针对腾讯商品并且是webview重载后的对URl参数的处理
  352. if (option.obj) {
  353. this.isShowBar = false;
  354. console.log("检测option.obj", option)
  355. console.log("解析后的option.obj", JSON.parse(decodeURIComponent(option.obj)))
  356. option = JSON.parse(decodeURIComponent(option.obj));
  357. }
  358. // 请求商品类型并判断是否是小程序环境
  359. await this.orderGetViewSign(option)
  360. if (option.isOther) {
  361. this.showMark = true;
  362. return;
  363. }
  364. this.option = option;
  365. let {
  366. skipPort,
  367. id,
  368. goodsId,
  369. orderGoodsId,
  370. gradeId,
  371. informId
  372. } = option;
  373. this.orderGoodsId = Number(orderGoodsId) || "";
  374. this.courseId = Number(id) || "";
  375. this.goodsId = Number(goodsId);
  376. this.gradeId = Number(gradeId);
  377. this.isLeave = false;
  378. uni.addInterceptor("navigateTo", {
  379. success: (e) => {
  380. this.isLeave = true;
  381. this.isCache = true;
  382. },
  383. });
  384. if (skipPort) {
  385. await this.$method.skipLogin(skipPort);
  386. }
  387. if (this.$method.isGoLogin()) {
  388. return;
  389. }
  390. if (!this.lockTimer) {
  391. lockAction();
  392. this.lockTimer = setInterval(lockAction, 10000);
  393. }
  394. this.saveLoaclCheckClass()
  395. // 公众号模板消息的数据埋点
  396. informId && this.clickOfficial(informId);
  397. this.init();
  398. },
  399. async onShow() {
  400. if (!this.$method.isLogin()) {
  401. return;
  402. }
  403. if (this.isCache) {
  404. console.log("返回刷新数据");
  405. this.isCache = false;
  406. this.sectionItem = {};
  407. this.beforeHideIsPlaying = false;
  408. reload(this.option);
  409. return;
  410. }
  411. if (this.beforeHideIsPlaying) {
  412. console.log("显示重新播放");
  413. if (this.text) {
  414. this.refPlv.playPause();
  415. return;
  416. }
  417. this.refPlv.resumeVideo();
  418. }
  419. },
  420. onUnload() {
  421. console.log("onUnload");
  422. if (this.isPlaying) {
  423. this.postStudyRecord();
  424. }
  425. this.refPlv = null;
  426. uni.$off();
  427. this.clearPauseTimer();
  428. uni.removeInterceptor("navigateTo");
  429. if (this.lockTimer) {
  430. clearInterval(this.lockTimer);
  431. this.$api.lockDelLock({
  432. action: "jxjy",
  433. uuid: this.$method.getUuid(),
  434. }).then(res => {
  435. console.log("删除登录", res)
  436. });
  437. }
  438. },
  439. onHide() {
  440. console.log('隐藏页面')
  441. this.beforeHideIsPlaying = this.isPlaying;
  442. if (this.isPlaying) {
  443. this.refPlv.playPause();
  444. }
  445. },
  446. mounted() {},
  447. methods: {
  448. ...mapMutations(["updateChapterOpen", "updateLiveLast"]),
  449. orderGetViewSign(option) {
  450. return new Promise(resolve => {
  451. this.$api.orderGetViewSign(Number(option.orderGoodsId)).then((res) => {
  452. this.playSource = res.data.data.viewSign;
  453. if (this.playSource == 2) {
  454. // #ifdef MP-WEIXIN
  455. this.$api
  456. .courseSkipPort()
  457. .then((res2) => {
  458. console.log("详情页请求的域名", res2.data.data.domain, res2.data.data
  459. .skipPort)
  460. let obj = {
  461. skipPort: res2.data.data.skipPort,
  462. ...option
  463. }
  464. let webViewUrl = encodeURIComponent(
  465. res2.data.data.domain +
  466. '/pages3/polyv/detail?obj=' +
  467. JSON.stringify(obj))
  468. uni.redirectTo({
  469. url: `/pages5/webview/detaillink?url=${webViewUrl}`
  470. })
  471. })
  472. return;
  473. // #endif
  474. }
  475. resolve()
  476. })
  477. })
  478. },
  479. // 进行学习后,保存标识,用于检查是否二建15天提示弹窗弹出
  480. saveLoaclCheckClass() {
  481. let ary = uni.getStorageSync("loaclCheckClass") || []
  482. let userFindIndex = ary.findIndex(i => i.userId == this.userInfo.userId)
  483. if (userFindIndex !== -1) {
  484. if (!ary[userFindIndex].orderGoodsIds.includes(this.orderGoodsId)) {
  485. ary[userFindIndex].orderGoodsIds.push(this.orderGoodsId)
  486. }
  487. } else {
  488. ary.push({
  489. userId: this.userInfo.userId,
  490. orderGoodsIds: [this.orderGoodsId]
  491. })
  492. }
  493. uni.setStorageSync("loaclCheckClass", ary)
  494. },
  495. async init() {
  496. if (this.playSource == 2) {
  497. this.isAllowSeek = false;
  498. } else {
  499. // #ifdef MP-WEIXIN
  500. this.isAllowSeek = "no";
  501. // #endif
  502. // #ifdef H5
  503. this.isAllowSeek = "on";
  504. // #endif
  505. }
  506. console.log("进入:", this.playSource, this.isAllowSeek)
  507. this.photoList = [];
  508. this.courseList = [];
  509. this.photoConfig = false;
  510. await this.isCanLearn();
  511. this.courseCourseList();
  512. },
  513. // 七大员是否能进入学习
  514. async qCheckIsCanLearn() {
  515. let res = await this.$api.qCheckIsCanLearn(this.orderGoodsId);
  516. if (res.data.code !== 200) {
  517. uni.showModal({
  518. showCancel: false,
  519. title: "提示",
  520. content: res.data.msg,
  521. success: (resultst) => {
  522. uni.navigateBack();
  523. },
  524. });
  525. return Promise.reject();
  526. }
  527. let res1 = await this.$api.syncSevenPublicClass({
  528. orderGoodsId: this.orderGoodsId,
  529. });
  530. if (res1.data.code !== 200) {
  531. uni.showModal({
  532. showCancel: false,
  533. title: "提示",
  534. content: "无法进入学习!",
  535. success: (resultst) => {
  536. uni.navigateBack();
  537. },
  538. });
  539. return Promise.reject();
  540. }
  541. },
  542. // 新增微信公众号模板消息点击数据
  543. clickOfficial(informId) {
  544. this.$http({
  545. url: "/data/click",
  546. method: "post",
  547. data: {
  548. informId
  549. },
  550. });
  551. },
  552. // 点击课程目录
  553. cMenu(item, index) {
  554. this.subIndex = index;
  555. this.newActiveSubjectId = item.subjectId;
  556. },
  557. courseCourseList() {
  558. this.$api
  559. .courseCourseList({
  560. pageNum: 1,
  561. pageSize: 200,
  562. ...this.params(["goodsId", "orderGoodsId", "gradeId"]),
  563. })
  564. .then((res) => {
  565. if (res.data.code == 200) {
  566. this.courseList = res.data.rows;
  567. if (res.data.total > 1) {
  568. // 科目
  569. this.subList = [{
  570. subjectId: 0,
  571. subjectName: "所有"
  572. }];
  573. this.courseList.forEach((item) => {
  574. if (!this.subList.find((e) => e.subjectId == item.subjectId)) {
  575. this.subList.push(item);
  576. }
  577. });
  578. this.getUserWatchLast();
  579. } else {
  580. this.originOnShow();
  581. this.originMounted();
  582. }
  583. }
  584. });
  585. },
  586. // 查询用户最后一次看的录播的信息
  587. getUserWatchLast() {
  588. this.$http({
  589. url: "/study/record/getUserWatchLast",
  590. method: "get",
  591. data: {
  592. orderGoodsId: this.orderGoodsId,
  593. },
  594. }).then((res) => {
  595. if (res.data.code == 200 && res.data.data) {
  596. this.courseId = res.data.data.courseId;
  597. }
  598. if (!this.courseId) {
  599. this.courseId = this.courseList[0].courseId;
  600. }
  601. this.originOnShow();
  602. this.originMounted();
  603. //获取商品双师资模板
  604. this.getCourseTeacher(this.courseList);
  605. });
  606. },
  607. getCourseTeacher(rows) {
  608. this.goodsTeacher = [];
  609. //获取商品双师资模板
  610. this.$api
  611. .courseTeacherList({
  612. goodsId: this.goodsId,
  613. })
  614. .then((res1) => {
  615. if (res1.data.data && res1.data.data.length > 0) {
  616. //课程老师模板
  617. let teacherTel = res1.data.data;
  618. //商品课程
  619. let courses = rows;
  620. teacherTel.forEach((tea) => {
  621. let dataList = [];
  622. let teacherList = [];
  623. courses.forEach((item) => {
  624. let data = tea.courseList.filter(
  625. (x) => x.courseId == item.courseId
  626. );
  627. if (data && data.length > 0) {
  628. dataList.push(item);
  629. teacherList = tea.courseList;
  630. }
  631. });
  632. let result = {
  633. teaList: teacherList,
  634. courseList: dataList,
  635. };
  636. this.goodsTeacher.push(result);
  637. });
  638. if (this.goodsTeacher && this.goodsTeacher.length > 0) {
  639. let courseIds = [];
  640. this.goodsTeacher.forEach((item) => {
  641. item.courseList.forEach((course) => {
  642. courseIds.push(course.courseId);
  643. });
  644. });
  645. if (courseIds.length > 0) {
  646. courses.forEach((item) => {
  647. if (!courseIds.includes(item.courseId)) {
  648. let data = {
  649. teaList: [],
  650. courseList: [],
  651. };
  652. data.courseList.push(item);
  653. this.goodsTeacher.push(data);
  654. }
  655. });
  656. }
  657. this.goodsTeacher.forEach((item) => {
  658. if (item.courseList && item.courseList.length > 0) {
  659. item.courseList[0].show = 1;
  660. }
  661. });
  662. }
  663. } else {
  664. //没有双师资模板
  665. rows.forEach((item) => {
  666. item.show = 1;
  667. let data = {
  668. teaList: [],
  669. courseList: [],
  670. };
  671. data.courseList.push(item);
  672. this.goodsTeacher.push(data);
  673. });
  674. }
  675. this.goodsTeacher.forEach((item) => {
  676. if (item.courseList.some((x) => x.courseId == this.courseId)) {
  677. this.teacherList = item.teaList;
  678. }
  679. });
  680. });
  681. },
  682. erJianErZaoPauseTip() {
  683. if (this.playSecIsLearn && this.erJianErZao && !this.isLeave) {
  684. if (this.pauseTimer) {
  685. return;
  686. }
  687. this.pauseTime = Date.now();
  688. this.pauseTimer = setInterval(() => {
  689. console.log("暂停时间", Date.now() - this.pauseTime, this.pauseTime);
  690. if (Date.now() - this.pauseTime > 5 * 60 * 1000) {
  691. // 5 * 60 * 1000
  692. this.refPlv.exitFullScreen();
  693. this.text = "暂停";
  694. if (this.showCamera) {
  695. this.text = "拍照停留";
  696. this.closeCamera();
  697. }
  698. uni.showModal({
  699. title: "提示",
  700. showCancel: false,
  701. content: `检测${this.text}时间过长,刷新当前页面`,
  702. cancelText: "取消",
  703. confirmText: "确定",
  704. success: (res) => {
  705. this.text = "";
  706. reload(this.option);
  707. // #ifdef MP-WEIXIN
  708. this.sectionItem = {};
  709. // #endif
  710. },
  711. });
  712. this.clearPauseTimer();
  713. }
  714. }, 5000);
  715. }
  716. },
  717. // 原来onshow里面的内容
  718. async originOnShow() {
  719. await this.studyRecordMenuAllList();
  720. // 消息过来 定位某个节
  721. if (this.option.noteSecond) {
  722. this.jumpNote({
  723. sectionType: 1,
  724. ...this.option,
  725. });
  726. return;
  727. }
  728. this.studyRecordQueryLiveLast();
  729. },
  730. // 原来的mouted内容
  731. originMounted() {
  732. uni.$on(
  733. "getSection",
  734. debounce((item) => {
  735. if (this.playSource == 2) {
  736. if (!this.refPlv && this.playVid) {
  737. this.refPlv = this.$refs.player2;
  738. }
  739. } else {
  740. if (!this.refPlv && this.playVid) {
  741. this.refPlv = this.$refs.player;
  742. }
  743. }
  744. if (this.isPlaying) {
  745. this.refPlv.playPause();
  746. }
  747. this.photoConfig = false;
  748. this.photoList = [];
  749. this.moduleId = item.moduleId || 0;
  750. this.chapterId = item.chapterId || 0;
  751. this.sectionItem = item;
  752. this.playVideo(item);
  753. this.postStudyRecord(0);
  754. })
  755. );
  756. uni.$on("isRebuild", (item) => {
  757. this.isRebuild = item;
  758. });
  759. this.updateChapterOpen(true);
  760. },
  761. clearPauseTimer() {
  762. if (this.pauseTimer) {
  763. this.pauseTime = 0;
  764. clearInterval(this.pauseTimer);
  765. this.pauseTimer = null;
  766. }
  767. },
  768. changeCourses() {
  769. this.toggleCourseShow = true;
  770. },
  771. closePop() {
  772. this.toggleCourseShow = false;
  773. },
  774. async activeFunc(item, index) {
  775. this.teacherIndex = index;
  776. let findResult = "";
  777. this.goodsTeacher.forEach((citem, index) => {
  778. citem.courseList.forEach((e, e_index) => {
  779. if (e.courseId == item.courseId) {
  780. findResult = e;
  781. }
  782. });
  783. });
  784. this.jump(findResult, 1);
  785. },
  786. // 进入学习
  787. async jump(item, index, type) {
  788. if (this.courseId === item.courseId) {
  789. this.toggleCourseShow = false;
  790. return;
  791. }
  792. if (this.orderNum == 2 && index != 0) {
  793. let prevItem = this.courseList[index - 1];
  794. if (
  795. prevItem.stuAllNum + prevItem.recordNum <
  796. prevItem.secAllNum + prevItem.examNum
  797. ) {
  798. uni.showToast({
  799. icon: "none",
  800. title: "请按顺序学完上一课再学习这一课",
  801. });
  802. return;
  803. }
  804. }
  805. // 打回 需重修
  806. if (item.rebuild === 0) {
  807. this.$navTo.togo("/pages2/learn/details", {
  808. id: item.courseId,
  809. ...this.params(["goodsId", "orderGoodsId", "gradeId"]),
  810. });
  811. return;
  812. }
  813. if (type) {
  814. this.teacherIndex = 0;
  815. this.goodsTeacher.forEach((citem) => {
  816. if (citem.courseList.some((x) => x.courseId == item.courseId)) {
  817. this.teacherList = citem.teaList;
  818. }
  819. });
  820. }
  821. this.sectionItem = {};
  822. this.toggleCourseShow = false;
  823. this.courseId = item.courseId;
  824. this.originOnShow();
  825. },
  826. clickLeft() {
  827. uni.switchTab({
  828. url: "/pages/learn/index",
  829. });
  830. },
  831. toBack(delta = 1) {
  832. uni.navigateBack({
  833. delta,
  834. });
  835. },
  836. markConfirm() {
  837. uni.setClipboardData({
  838. data: this.markContent,
  839. success: () => {
  840. setTimeout(this.toBack, 1000);
  841. },
  842. });
  843. },
  844. noticeConfirm() {
  845. if (this.CountTo <= 0) {
  846. this.noticeShow = false;
  847. if (this.autoplay) {
  848. this.refPlv && this.refPlv.resumeVideo();
  849. }
  850. this.$api.baseHandoutTip({
  851. orderGoodsId: this.orderGoodsId,
  852. });
  853. }
  854. },
  855. baseHandoutTipList() {
  856. this.$api
  857. .baseHandoutTipList({
  858. orderGoodsId: this.orderGoodsId,
  859. })
  860. .then((res) => {
  861. if (res.data.rows.length == 0) {
  862. this.noticeShow = true;
  863. this.CountTo = 30;
  864. var timer = setInterval(() => {
  865. this.CountTo--;
  866. if (this.CountTo < 0) {
  867. clearInterval(timer);
  868. }
  869. }, 1000);
  870. }
  871. });
  872. },
  873. /**
  874. * 获取上次观看的直播
  875. */
  876. studyRecordGetLastLive() {
  877. this.$api
  878. .studyRecordGetLastLive({
  879. orderGoodsId: this.orderGoodsId,
  880. courseId: this.courseId,
  881. })
  882. .then((res) => {
  883. this.updateLiveLast(res.data.data);
  884. });
  885. },
  886. async initPlayVideo(sectionItem) {
  887. this.moduleId = sectionItem.moduleId || 0;
  888. this.chapterId = sectionItem.chapterId || 0;
  889. this.sectionItem = sectionItem;
  890. if (sectionItem.sectionType == 1) {
  891. //录播
  892. this.playVideo(sectionItem);
  893. } else if (sectionItem.sectionType == 2) {
  894. //直播
  895. this.studyRecordGetLastLive();
  896. } else if (sectionItem.sectionType == 3) {
  897. //回放
  898. this.playVideo(sectionItem);
  899. } else if (sectionItem.doType == 2) {
  900. uni.showModal({
  901. title: "温馨提示",
  902. content: "当前节视频已学完,是否进入考试?",
  903. success: (res) => {
  904. if (res.confirm) {
  905. this.toQuestionBank(sectionItem);
  906. }
  907. },
  908. });
  909. return;
  910. }
  911. },
  912. async submitPhoto(url, compareFaceData) {
  913. this.ossAvatarUrl = url;
  914. this.compareFaceData = compareFaceData;
  915. this.postCoursePhotoRecord()
  916. .then(async (res) => {
  917. console.log("showCamera1", this.showCamera)
  918. this.photoHistoryList[this.photoIndex] = true;
  919. await this.postStudyRecord();
  920. this.closeCamera();
  921. if (this.isReach) {
  922. console.log("showCamera2", this.showCamera)
  923. await this.postStudyRecord(1);
  924. this.nextSection();
  925. console.log("showCamera3", this.showCamera)
  926. return;
  927. }
  928. console.log("showCamera4", this.showCamera)
  929. this.refPlv.resumeVideo();
  930. })
  931. .catch((err) => {
  932. uni.showToast({
  933. title: "上传接口报错,请重新拍照上传" + err,
  934. icon: "none",
  935. });
  936. this.$refs["camera"].reTake();
  937. });
  938. },
  939. toQuestionBank(sectionItem) {
  940. // type 1模块 2章 3节 4章卷 5模块卷
  941. uni.navigateTo({
  942. url: "/pages2/class/questionBank?courseId=" +
  943. this.courseId +
  944. "&gradeId=" +
  945. this.gradeId +
  946. "&isFromVideo=1&id=" +
  947. sectionItem.id +
  948. "&goodsid=" +
  949. this.goodsId +
  950. "&moduleId=" +
  951. (sectionItem.moduleId || 0) +
  952. "&chapterId=" +
  953. (sectionItem.chapterId || 0) +
  954. "&orderGoodsId=" +
  955. this.orderGoodsId +
  956. "&type=" +
  957. (sectionItem.type == 4 ? 1 : 3) +
  958. "&learning=" +
  959. sectionItem.studyStatus +
  960. "&isBackVideo=" +
  961. 1,
  962. });
  963. },
  964. studyRecordQueryLiveLast() {
  965. this.$api
  966. .studyRecordQueryLiveLast({
  967. gradeId: this.gradeId,
  968. orderGoodsId: this.orderGoodsId,
  969. courseId: this.courseId,
  970. })
  971. .then((res) => {
  972. let {
  973. data
  974. } = res.data;
  975. if (data && data.endTime > parseInt(new Date().getTime() / 1000)) {
  976. uni.showModal({
  977. showCancel: false,
  978. title: "提示",
  979. content: "当前无法学习," + this.$method.timestampToTime(data.endTime, false) +
  980. "过后可继续学习",
  981. success: (resultst) => {
  982. uni.navigateBack();
  983. },
  984. });
  985. return
  986. }
  987. if (!data.sectionId) {
  988. data = this.menuAllList[0];
  989. }
  990. if (data.learning == 1 && this.orderNum == 2) {
  991. let next = this.menuAllList.find((e) => e.studyStatus != 1);
  992. next && (data = next);
  993. }
  994. this.initPlayVideo(data);
  995. });
  996. },
  997. async goLive(item) {
  998. let moduleId = item.moduleId || 0;
  999. let chapterId = item.chapterId || 0;
  1000. let sectionId = item.sectionId || item.menuId;
  1001. let uuid = new Date().valueOf() + "";
  1002. if (!this.userInfo) {
  1003. await this.$store.dispatch('getUserInfo')
  1004. }
  1005. // buyCourse 是否购买课程:1是 0否
  1006. let encode = encodeURIComponent(
  1007. this.other.hostLive +
  1008. "/pages/live/index?token=" +
  1009. uni.getStorageSync("token") +
  1010. "&userInfo=" +
  1011. JSON.stringify(this.userInfo) +
  1012. "&channelId=" +
  1013. item.liveUrl +
  1014. "&gradeId=" +
  1015. this.gradeId +
  1016. "&courseId=" +
  1017. this.courseId +
  1018. "&goodsId=" +
  1019. this.goodsId +
  1020. "&orderGoodsId=" +
  1021. this.orderGoodsId +
  1022. "&sectionId=" +
  1023. sectionId +
  1024. "&chapterId=" +
  1025. chapterId +
  1026. "&moduleId=" +
  1027. moduleId +
  1028. "&buyCourse=1" +
  1029. "&ident=" +
  1030. uuid
  1031. );
  1032. uni.navigateTo({
  1033. url: `/pages5/webview/index?url=` + encode,
  1034. });
  1035. },
  1036. studyRecordMenuAllList() {
  1037. // study/record/menuAllList
  1038. return this.$api
  1039. .studMenuAllList({
  1040. courseId: this.courseId,
  1041. ...this.params(["goodsId", "orderGoodsId", "gradeId"]),
  1042. })
  1043. .then((res) => {
  1044. let nowTime = Number(new Date().getTime() / 1000).toFixed(0);
  1045. if (res.data.data) {
  1046. this.menuAllList = res.data.data.filter(
  1047. (e) => e.doType != 1 || (e.doType == 2 && e.studyStatus == 1)
  1048. );
  1049. this.livingItem = res.data.data.find(
  1050. (item) =>
  1051. item.liveStartTime <= nowTime && item.liveEndTime > nowTime
  1052. );
  1053. }
  1054. return Promise.resolve();
  1055. });
  1056. },
  1057. async getbaseprofiletplists() {
  1058. let {
  1059. data: {
  1060. code,
  1061. rows
  1062. },
  1063. } = await this.$api.getbaseprofiletplists({
  1064. goodsId: this.goodsId,
  1065. orderGoodsId: this.orderGoodsId,
  1066. });
  1067. if (code === 200 && rows.length && rows[0].keyValue) {
  1068. let baseRes = await this.$api.getbaseprofiletpId(this.goodsId);
  1069. if (baseRes.data.code === 200 && baseRes.data.data) {
  1070. let {
  1071. data: {
  1072. code,
  1073. data
  1074. },
  1075. } = await this.$api.getbaseprofiletpgetInfo({
  1076. goodsId: this.goodsId,
  1077. orderGoodsId: this.orderGoodsId,
  1078. });
  1079. if (
  1080. code === 200 &&
  1081. (!data || (data.status === 3 && data.changeStatus === 1))
  1082. ) {
  1083. uni.showModal({
  1084. content: !data ?
  1085. "请前往填写资料" : "资料审核不通过,请前往重新填写",
  1086. cancelText: "返回",
  1087. success: (resultst) => {
  1088. if (resultst.confirm) {
  1089. this.$navTo.togo("/pages2/verify/input", {
  1090. id: this.goodsId,
  1091. orderGoodsId: this.orderGoodsId,
  1092. });
  1093. }
  1094. if (resultst.cancel) {
  1095. uni.navigateBack();
  1096. }
  1097. },
  1098. });
  1099. return Promise.reject();
  1100. } else if (data.status === 1 && JSON.parse(rows[0].keyValue2)[0] && false) {
  1101. let {
  1102. data: {
  1103. code,
  1104. data
  1105. },
  1106. } = await this.$api.getbaseprofileStampgetInfo({
  1107. goodsId: this.goodsId,
  1108. orderGoodsId: this.orderGoodsId,
  1109. });
  1110. if (
  1111. code === 200 &&
  1112. (!data || (data.status === 3 && data.changeStatus === 1))
  1113. ) {
  1114. uni.showModal({
  1115. content: !data ?
  1116. "请前往填写盖章资料" : "资料盖章审核不通过,请前往重新填写",
  1117. cancelText: "返回",
  1118. success: (resultst) => {
  1119. if (resultst.confirm) {
  1120. this.$navTo.togo("/pages2/verify/input2", {
  1121. id: this.goodsId,
  1122. orderGoodsId: this.orderGoodsId,
  1123. });
  1124. }
  1125. if (resultst.cancel) {
  1126. uni.navigateBack();
  1127. }
  1128. },
  1129. });
  1130. return Promise.reject();
  1131. }
  1132. } else if (data.status !== 1 && baseRes.data.data.checkStatus == 1) {
  1133. uni.showModal({
  1134. content: "资料正在审核中,暂无法学习,请耐心等待!如需加急审核,请联系客服人员",
  1135. cancelText: "返回",
  1136. success: (resultst) => {
  1137. if (resultst.confirm) {
  1138. uni.switchTab({
  1139. url: '/pages/learn/index'
  1140. });
  1141. }
  1142. if (resultst.cancel) {
  1143. uni.switchTab({
  1144. url: '/pages/learn/index'
  1145. });
  1146. }
  1147. },
  1148. });
  1149. return Promise.reject();
  1150. }
  1151. }
  1152. }
  1153. return Promise.resolve();
  1154. },
  1155. async isCanLearn() {
  1156. await this.qCheckIsCanLearn();
  1157. await this.getGradeInfo();
  1158. await this.getGoodsDetail();
  1159. },
  1160. /**
  1161. * 计算tabs宽度
  1162. */
  1163. itemWidth() {
  1164. return 100 / this.list.length + "%";
  1165. },
  1166. loadedmetadata(event) {
  1167. if (this.playSource == 2) {
  1168. this.refPlv = this.$refs.player2;
  1169. } else {
  1170. this.refPlv = this.$refs.player;
  1171. }
  1172. },
  1173. getPhotoLastRecord() {
  1174. let {
  1175. chapterId,
  1176. sectionId,
  1177. moduleId
  1178. } = this.sectionItem;
  1179. let data = {
  1180. ...this.params(),
  1181. sectionId: sectionId || 0,
  1182. gradeId: this.gradeId,
  1183. chapterId: chapterId || 0,
  1184. moduleId: moduleId || 0,
  1185. };
  1186. this.$api.getPhotoLastRecord(data).then((res) => {
  1187. if (res.data.code == 200) {
  1188. //清空历史数据
  1189. this.photoHistoryList = [];
  1190. this.photoList = [];
  1191. for (let i = 0; i < res.data.data.length; i++) {
  1192. //-2存储随机拍照数组
  1193. if (res.data.data[i].photoIndex == -2) {
  1194. this.photoList =
  1195. res.data.data[i].timeInterval &&
  1196. res.data.data[i].timeInterval.split(",");
  1197. } else {
  1198. this.photoHistoryList.push(res.data.data[i].photoIndex);
  1199. }
  1200. }
  1201. }
  1202. });
  1203. },
  1204. //postTime 只提交随机时间
  1205. postCoursePhotoRecord(postTime = false) {
  1206. return new Promise((resolve, reject) => {
  1207. let data = {
  1208. ...this.params(["orderGoodsId", "goodsId", "courseId", "gradeId"]),
  1209. photo: this.ossAvatarUrl,
  1210. sectionId: this.sectionId,
  1211. photoTime: this.playTime || 0,
  1212. photoIndex: postTime ? -2 : this.photoIndex, //从0算起,-2只提交随机时间
  1213. photoNum: this.photoNum,
  1214. chapterId: this.chapterId,
  1215. moduleId: this.moduleId,
  1216. timeInterval: postTime ? this.photoList.join(",") : "",
  1217. };
  1218. this.$api
  1219. .coursePhotoRecord(data)
  1220. .then((res) => {
  1221. if (res.data.code == 200) {
  1222. resolve();
  1223. } else {
  1224. reject();
  1225. }
  1226. })
  1227. .catch((err) => {
  1228. reject();
  1229. });
  1230. });
  1231. },
  1232. randomNum(minNum, maxNum) {
  1233. switch (arguments.length) {
  1234. case 1:
  1235. return parseInt(Math.random() * minNum + 1, 10);
  1236. break;
  1237. case 2:
  1238. return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
  1239. break;
  1240. default:
  1241. return 0;
  1242. break;
  1243. }
  1244. },
  1245. //配置随机拍照时间
  1246. configPhoto(duration) {
  1247. if ((this.photoConfig && this.photoList.length) || !this.isPlaying) {
  1248. return;
  1249. }
  1250. let totalVideoTime = this.refPlv.getDuration();
  1251. this.photoConfig = true;
  1252. if (this.erJianErZao) {
  1253. this.photoList = this.randomConfig(totalVideoTime, duration);
  1254. console.log(this.photoList, "this.photoList");
  1255. return;
  1256. }
  1257. //没有历史拍照间隔数据
  1258. if (!this.photoList || this.photoList.length == 0) {
  1259. // 46 * 60
  1260. this.photoList = this.commonConfig(
  1261. totalVideoTime,
  1262. this.jjShiGongYuan ? totalVideoTime < 2760 ? (46 * 60) - 1 : (45 * 60) - 1 : undefined
  1263. );
  1264. this.postCoursePhotoRecord(true); //提交随机拍照时间数组
  1265. }
  1266. console.log(this.photoList, "this.photoList");
  1267. },
  1268. // 二建随机拍摄时间
  1269. randomConfig(totalVideoTime, duration) {
  1270. this.photoHistoryList = [];
  1271. let photoList = [duration];
  1272. let pre = duration;
  1273. if (totalVideoTime > 300) {
  1274. while (pre <= totalVideoTime) {
  1275. pre += this.randomNum(780, 900);
  1276. pre <= totalVideoTime && photoList.push(pre);
  1277. }
  1278. if (totalVideoTime - 300 > photoList.slice(-1)[0]) {
  1279. photoList.push(this.randomNum(totalVideoTime - 180, totalVideoTime));
  1280. }
  1281. }
  1282. return photoList;
  1283. },
  1284. // 随机前后五分钟
  1285. commonConfig(totalVideoTime, fixS) {
  1286. let photoList = [];
  1287. // 固定间隔时间取
  1288. if (fixS) {
  1289. let num = Math.ceil(totalVideoTime / fixS);
  1290. if (num == 1) {
  1291. photoList.push(parseInt(totalVideoTime / 2));
  1292. } else {
  1293. for (let i = 0; i < num; i++) {
  1294. photoList.push(parseInt((totalVideoTime / (num + 1)) * (i + 1)));
  1295. }
  1296. }
  1297. this.photoNum = num;
  1298. } else {
  1299. photoList = [0];
  1300. if (this.photoNum == 3) {
  1301. if (totalVideoTime >= 900) {
  1302. //大于15分钟
  1303. let centerTime = Math.floor(totalVideoTime / 2); //获取中间时间
  1304. let centerMinTime = centerTime - 300; //前后5分钟
  1305. let centerMaxTime = centerTime + 300;
  1306. let centerTakeTime = this.randomNum(centerMinTime, centerMaxTime);
  1307. photoList.push(centerTakeTime); //中间拍一张
  1308. let endMaxTime = totalVideoTime - 60;
  1309. let endMinTime = totalVideoTime - 300;
  1310. let endTakeTime = this.randomNum(endMinTime, endMaxTime);
  1311. photoList.push(endTakeTime); //最后拍一张
  1312. } else {
  1313. //小于15分钟
  1314. let centerTime = this.randomNum(
  1315. (1 / 3) * totalVideoTime,
  1316. (2 / 3) * totalVideoTime
  1317. );
  1318. photoList.push(centerTime);
  1319. let endTakeTime = this.randomNum(
  1320. (2 / 3) * totalVideoTime,
  1321. totalVideoTime
  1322. );
  1323. photoList.push(endTakeTime);
  1324. }
  1325. }
  1326. }
  1327. return photoList;
  1328. },
  1329. studyNotice() {
  1330. this.noticeShow = true;
  1331. },
  1332. //正常播放视频
  1333. async playVideo(item) {
  1334. let {
  1335. learning,
  1336. videoCurrentTime,
  1337. recordingUrl
  1338. } = item;
  1339. this.videoCurrentTime =
  1340. videoCurrentTime || (await this.getRecordLast(item));
  1341. // 往前播3秒
  1342. if (this.videoCurrentTime > 3) {
  1343. this.videoCurrentTime -= 3;
  1344. }
  1345. this.sectionItem = item;
  1346. // 查找拍照历史
  1347. if ((this.photoNum > 0 || this.jjShiGongYuan || this.erJianErZao) && learning != 1) {
  1348. await this.getPhotoLastRecord();
  1349. }
  1350. if (this.refPlv) {
  1351. if (this.playSource == 2) {
  1352. this.refPlv.changeFileId({
  1353. fileId: recordingUrl,
  1354. currentTime: this.videoCurrentTime,
  1355. });
  1356. } else {
  1357. this.refPlv.changeVid({
  1358. vid: recordingUrl,
  1359. videoCurrentTime: this.videoCurrentTime,
  1360. });
  1361. }
  1362. }
  1363. },
  1364. getRecordLast(sectionItem) {
  1365. let {
  1366. chapterId,
  1367. sectionId,
  1368. courseId,
  1369. moduleId
  1370. } = sectionItem;
  1371. return new Promise((resolve) => {
  1372. let data = {
  1373. ...this.params(),
  1374. gradeId: this.gradeId || this.gradeId == 0 ? Number(this.gradeId) : null,
  1375. sectionId: sectionId || 0,
  1376. chapterId: chapterId || 0,
  1377. moduleId: moduleId || 0,
  1378. };
  1379. this.$api.recordLast(data).then((res) => {
  1380. resolve(res.data.data.videoCurrentTime);
  1381. });
  1382. });
  1383. },
  1384. jumpNote(item) {
  1385. this.$u.toast("即将跳到笔记位置");
  1386. if (this.sectionId != item.sectionId) {
  1387. this.initPlayVideo({
  1388. sectionType: 1,
  1389. ...item,
  1390. videoCurrentTime: Number(item.noteSecond),
  1391. });
  1392. } else {
  1393. this.refPlv.seekVideo(item.noteSecond);
  1394. }
  1395. },
  1396. getGradeInfo() {
  1397. // 即刻 1 待定2 日期3
  1398. return this.$api.goodsGradeInfo(this.gradeId).then((res) => {
  1399. if (res.data.code == 200) {
  1400. let {
  1401. data
  1402. } = res.data;
  1403. if (
  1404. data.learningStatus == 2 ||
  1405. (data.learningStatus == 3 &&
  1406. Number(data.learningTimeStart) > Number(new Date() / 1000))
  1407. ) {
  1408. uni.showModal({
  1409. showCancel: false,
  1410. confirmText: "确定",
  1411. content: "当前课程正在申请中,正式开班后方可进行学习,请耐心等候!",
  1412. success: function(resultst) {
  1413. uni.navigateBack();
  1414. },
  1415. });
  1416. return Promise.reject();
  1417. }
  1418. }
  1419. });
  1420. },
  1421. postStudyRecord(status = 0, sectionId = this.sectionId) {
  1422. if (!this.refPlv && this.playVid) {
  1423. return;
  1424. }
  1425. let currentTime = this.refPlv.playCurrentTime();
  1426. let PlayDuration = this.refPlv.playVideoTime();
  1427. if (currentTime < 10 && !this.ossAvatarUrl) {
  1428. if (status == 0) return;
  1429. currentTime = this.playTime;
  1430. }
  1431. let self = this;
  1432. let fromPlat = 1;
  1433. // #ifdef H5
  1434. fromPlat = 3;
  1435. // #endif
  1436. let data = {
  1437. ...this.params([
  1438. "orderGoodsId",
  1439. "goodsId",
  1440. "courseId",
  1441. "erJianErZao",
  1442. "gradeId",
  1443. ]),
  1444. fromPlat, //来源平台 1小程序 2网站
  1445. photo: self.ossAvatarUrl,
  1446. sectionId: sectionId || 0,
  1447. studyDuration: parseInt(PlayDuration),
  1448. chapterId: this.chapterId || 0,
  1449. moduleId: this.moduleId || 0,
  1450. videoCurrentTime: parseInt(currentTime),
  1451. };
  1452. if (this.ossAvatarUrl) {
  1453. data.similarity = this.compareFaceData; // 相似度
  1454. }
  1455. if (status > 0) {
  1456. data.status = status;
  1457. }
  1458. console.log(data, "记录参数");
  1459. return new Promise((resolve, reject) => {
  1460. this.$api
  1461. .studyRecord(data)
  1462. .then((res) => {
  1463. console.log(res, "记录返回");
  1464. let {
  1465. code,
  1466. msg
  1467. } = res.data;
  1468. if (code == 200) {
  1469. if (status > 0) {
  1470. // 刷新数据
  1471. uni.$emit("playEnd");
  1472. this.studyRecordMenuAllList();
  1473. }
  1474. self.ossAvatarUrl = "";
  1475. } else if (code == 600) {
  1476. uni.showModal({
  1477. showCancel: false,
  1478. title: "提示",
  1479. content: msg,
  1480. success: (resultst) => {
  1481. uni.navigateBack();
  1482. },
  1483. });
  1484. this.closeCamera();
  1485. return
  1486. } else if (code == 558) {
  1487. this.CountTo1 = msg.split(",")[1];
  1488. this.noticeShow1 = true;
  1489. var timer = setInterval(() => {
  1490. this.CountTo1--;
  1491. if (this.CountTo1 < 0) {
  1492. this.noticeShow1 = false;
  1493. clearInterval(timer);
  1494. this.postStudyRecord(1).then(this.nextSection);
  1495. }
  1496. }, 1000);
  1497. this.closeCamera();
  1498. return
  1499. } else {
  1500. uni.showToast({
  1501. icon: "none",
  1502. title: res.data.msg,
  1503. duration: 2000,
  1504. });
  1505. if (code == 559) {
  1506. this.isReach = true;
  1507. this.openCamera()
  1508. }
  1509. return
  1510. }
  1511. resolve();
  1512. })
  1513. .catch((err) => {
  1514. this.studyRecordMenuAllList();
  1515. });
  1516. });
  1517. },
  1518. timeEvent(time) {
  1519. console.log(this.refPlv.getDuration(), 'getDurationgetDuration')
  1520. this.clearPauseTimer();
  1521. if (this.playSecIsLearn && (this.erJianErZao || this.jjShiGongYuan || this.photoNum > 0)) {
  1522. this.configPhoto(time);
  1523. this.isReach = false;
  1524. const index = this.photoList.findIndex((e) => e < time && e > time - 8);
  1525. if (index != -1 && !this.photoHistoryList[index] && this.photoHistoryList[index] != 0) {
  1526. this.photoIndex = index;
  1527. // 拍照
  1528. this.openCamera();
  1529. }
  1530. }
  1531. },
  1532. // 新增用户视频学习日志
  1533. studyLog() {
  1534. this.$http({
  1535. url: "/user/study/log",
  1536. method: "post",
  1537. data: {
  1538. ...this.params(),
  1539. moduleId: this.moduleId || 0,
  1540. chapterId: this.chapterId || 0,
  1541. sectionId: this.sectionId || 0,
  1542. fromPlat: 1, //来源平台 1小程序 2PC网站
  1543. goodsType: 1, // 商品类型 1视频2题库 3补考 4前培 5虚拟赠送题库 6直播
  1544. },
  1545. }).then((res) => {});
  1546. },
  1547. timeupdate(time) {
  1548. // console.log("🚀 ~ file: detail.vue:1498 ~ timeupdate ~ time:");
  1549. if (this.noticeShow) {
  1550. this.refPlv.playPause();
  1551. return;
  1552. }
  1553. this.playTime = time;
  1554. this.throttleFn();
  1555. this.timeEvent(time);
  1556. },
  1557. playing() {
  1558. //特殊设备跳过拍照停止学习
  1559. if (this.showCamera) {
  1560. this.refPlv.playPause();
  1561. this.refPlv.exitFullScreen();
  1562. return;
  1563. }
  1564. this.isPlaying = true;
  1565. this.clearPauseTimer();
  1566. },
  1567. openCamera() {
  1568. if (this.showCamera) return;
  1569. this.showCamera = true;
  1570. this.refPlv.playPause();
  1571. this.refPlv.exitFullScreen();
  1572. },
  1573. closeCamera() {
  1574. console.log("关闭")
  1575. this.showCamera = false;
  1576. },
  1577. pause() {
  1578. console.log("视频暂停");
  1579. this.isPlaying = false;
  1580. this.erJianErZaoPauseTip();
  1581. },
  1582. async ended() {
  1583. console.log("视频播放完毕");
  1584. this.isPlaying = false;
  1585. uni.showToast({
  1586. icon: "none",
  1587. title: "播放完毕",
  1588. });
  1589. this.clearPauseTimer();
  1590. await this.postStudyRecord(1);
  1591. this.nextSection();
  1592. },
  1593. playerError() {
  1594. console.log("播放错误");
  1595. },
  1596. //播放下一节
  1597. nextSection() {
  1598. console.log("播放下一节");
  1599. if (!this.menuAllList.length) {
  1600. return;
  1601. }
  1602. this.curPlayIndex = this.menuAllList.findIndex((item) => {
  1603. let i_sectionId = item.sectionId || 0;
  1604. let i_chapterId = item.chapterId || 0;
  1605. let i_moduleId = item.moduleId || 0;
  1606. return (
  1607. i_sectionId == this.sectionId &&
  1608. i_chapterId == this.chapterId &&
  1609. i_moduleId == this.moduleId
  1610. );
  1611. });
  1612. let data = this.menuAllList[this.curPlayIndex + 1];
  1613. data.learning = data.learning || data.studyStatus
  1614. if (!data) {
  1615. //第二个弹窗
  1616. uni.showModal({
  1617. title: "温馨提示",
  1618. content: "恭喜您课程学习全部完成,教务会在1-3个工作日内完成学习初审,请耐心等待。",
  1619. showCancel: !this.erJianErZao,
  1620. success: (res) => {
  1621. if (res.confirm) {
  1622. uni.switchTab({
  1623. url: "/pages/learn/index",
  1624. });
  1625. }
  1626. },
  1627. });
  1628. } else {
  1629. if (data.doType == 2) {
  1630. if (data.studyStatus == 1) {
  1631. uni.showToast({
  1632. title: "试卷已合格!",
  1633. duration: 2000,
  1634. icon: "none",
  1635. });
  1636. return;
  1637. }
  1638. uni.showModal({
  1639. title: "温馨提示",
  1640. content: "当前节视频已学完,是否进入考试?",
  1641. success: (res) => {
  1642. if (res.confirm) {
  1643. this.toQuestionBank(data);
  1644. }
  1645. },
  1646. });
  1647. return;
  1648. }
  1649. uni.showModal({
  1650. title: "温馨提示",
  1651. content: "当前节视频已学完,继续学习下一节?",
  1652. success: async (res) => {
  1653. if (res.confirm) {
  1654. this.moduleId = data.moduleId;
  1655. this.chapterId = data.chapterId;
  1656. this.sectionId = data.sectionId;
  1657. if (data.sectionType == 1) {
  1658. //录播
  1659. this.photoConfig = false;
  1660. this.sectionItem = data;
  1661. this.playVideo(data);
  1662. } else if (data.sectionType == 2) {
  1663. //直播
  1664. this.studyRecordGetLastLive();
  1665. } else if (data.sectionType == 3) {
  1666. //回放
  1667. this.sectionItem = data;
  1668. this.playVideo(data);
  1669. }
  1670. this.updateChapterOpen(true);
  1671. }
  1672. },
  1673. });
  1674. }
  1675. },
  1676. async userConfirmInfoDetail() {
  1677. let info = await this.$api.userConfirmInfoDetail({
  1678. orderGoodsId: this.orderGoodsId,
  1679. });
  1680. if (!info.data.data || info.data.data.pushInfo !== 1) {
  1681. uni.showModal({
  1682. showCancel: false,
  1683. title: "提示",
  1684. content: "开通信息推送不成功,无法进入学习!",
  1685. success: (resultst) => {
  1686. uni.navigateBack();
  1687. },
  1688. });
  1689. return Promise.reject();
  1690. }
  1691. },
  1692. checkFinishRequiredCourse() {
  1693. return this.$api
  1694. .checkFinishRequiredCourse({
  1695. businessId: this.goodsData.businessId,
  1696. goodsId: this.goodsId,
  1697. })
  1698. .then((res) => {
  1699. if (res.data.code == 200) {
  1700. if (res.data.data > 0) {
  1701. uni.showModal({
  1702. showCancel: false,
  1703. confirmText: "确定",
  1704. content: "该业务层次下有未学完的商品,无法学习新商品!",
  1705. success: function(resultst) {
  1706. uni.navigateBack();
  1707. },
  1708. });
  1709. return Promise.reject();
  1710. }
  1711. return Promise.resolve();
  1712. } else {
  1713. uni.showModal({
  1714. showCancel: false,
  1715. confirmText: "确定",
  1716. content: res.data.msg,
  1717. success: function(resultst) {
  1718. uni.navigateBack();
  1719. },
  1720. });
  1721. return Promise.reject();
  1722. }
  1723. })
  1724. },
  1725. async getGoodsDetail() {
  1726. let {
  1727. data
  1728. } = await this.$api.goodsDetail(this.goodsId);
  1729. this.goodsData = data.data;
  1730. if (data.data.firstChoiceStatus) {
  1731. uni.redirectTo({
  1732. url: `/pages3/polyv/preference?courseId=${this.courseId}&goodsId=${data.data.goodsId}&orderGoodsId=${this.orderGoodsId}&gradeId=${data.data.gradeId}&minClassHour=${data.data.minClassHour || 0}`,
  1733. });
  1734. return
  1735. }
  1736. await this.getbaseprofiletplists();
  1737. this.erJianErZao = this.goodsData.erJianErZao;
  1738. this.jjShiGongYuan = this.goodsData.jjShiGongYuan;
  1739. if (this.erJianErZao || this.jjShiGongYuan) {
  1740. await this.userConfirmInfoDetail();
  1741. }
  1742. if (this.erJianErZao) {
  1743. await this.checkFinishRequiredCourse()
  1744. }
  1745. this.goodsData.buyNote && this.baseHandoutTipList();
  1746. !this.gradeId && (this.gradeId = this.goodsData.gradeId);
  1747. if (this.goodsData.goodsPlayConfig) {
  1748. this.goodsPlayConfig = JSON.parse(this.goodsData.goodsPlayConfig);
  1749. if (this.goodsPlayConfig.autoPlay > 0) {
  1750. this.autoplay = true;
  1751. }
  1752. if (this.goodsPlayConfig.drag > 0 && !this.erJianErZao) {
  1753. if (this.playSource == 2) {
  1754. this.isAllowSeek = true;
  1755. } else {
  1756. // #ifdef MP-WEIXIN
  1757. this.isAllowSeek = "yes";
  1758. // #endif
  1759. // #ifdef H5
  1760. this.isAllowSeek = "off";
  1761. // #endif
  1762. }
  1763. }
  1764. if (this.goodsPlayConfig.speed > 0) {
  1765. this.playbackRate = [0.5, 0.8, 1.0, 1.25, 1.5, 2.0];
  1766. }
  1767. }
  1768. if (this.goodsData.goodsPhotographConfig) {
  1769. this.goodsPhotographConfig = JSON.parse(
  1770. this.goodsData.goodsPhotographConfig
  1771. );
  1772. if (this.goodsPhotographConfig.photoNum > 0) {
  1773. this.photoNum = this.goodsPhotographConfig.photoNum;
  1774. }
  1775. }
  1776. },
  1777. change(index) {
  1778. this.current = index;
  1779. },
  1780. paramsFn(
  1781. keys = ["orderGoodsId", "goodsId", "courseId", "gradeId", "sectionItem"]
  1782. ) {
  1783. return this.params(keys);
  1784. },
  1785. },
  1786. provide() {
  1787. return {
  1788. paramsFn: this.paramsFn,
  1789. };
  1790. },
  1791. };
  1792. </script>
  1793. <style lang="scss" scope>
  1794. @import "./css/detail.scss";
  1795. .top {
  1796. &__header {
  1797. position: relative;
  1798. width: 100%;
  1799. height: 150rpx;
  1800. padding: 24rpx 150rpx 24rpx 24rpx;
  1801. .img {
  1802. position: absolute;
  1803. left: 0;
  1804. top: 0;
  1805. width: 100%;
  1806. }
  1807. .note {
  1808. position: relative;
  1809. z-index: 10;
  1810. font-size: 24rpx;
  1811. font-family: PingFang SC;
  1812. font-weight: bold;
  1813. color: #efdbff;
  1814. }
  1815. .title {
  1816. position: relative;
  1817. z-index: 10;
  1818. font-size: 26rpx;
  1819. font-family: PingFang SC;
  1820. font-weight: bold;
  1821. color: #ffffff;
  1822. }
  1823. }
  1824. }
  1825. #top {
  1826. position: relative;
  1827. z-index: 99;
  1828. }
  1829. .polyv_detail {
  1830. display: flex;
  1831. flex-direction: column;
  1832. height: 100vh;
  1833. position: relative;
  1834. top: 0;
  1835. left: 0;
  1836. .pops {
  1837. position: absolute;
  1838. top: 0;
  1839. left: 0;
  1840. background: #ccc;
  1841. opacity: 0.5;
  1842. width: 100%;
  1843. height: 300rpx;
  1844. z-index: 9999;
  1845. }
  1846. .box {
  1847. flex: 1;
  1848. overflow: hidden;
  1849. margin: 16rpx 16rpx 100rpx 16rpx;
  1850. .box_in {
  1851. height: 100%;
  1852. }
  1853. }
  1854. .first_ml {
  1855. margin: 16rpx 16rpx 16rpx 16rpx;
  1856. }
  1857. }
  1858. .title {
  1859. font-size: 24rpx;
  1860. color: #999999;
  1861. }
  1862. page {
  1863. background: #eaeef1;
  1864. }
  1865. .ts {
  1866. font-size: 24rpx;
  1867. color: #999;
  1868. margin: 14rpx 0rpx;
  1869. padding-right: 29rpx;
  1870. padding-left: 34rpx;
  1871. }
  1872. .content {
  1873. padding: 24rpx;
  1874. text-align: left;
  1875. }
  1876. .sc_t {
  1877. font-size: 22rpx;
  1878. color: #000000;
  1879. }
  1880. .sc {
  1881. width: 29rpx;
  1882. height: 29rpx;
  1883. }
  1884. .buy {
  1885. width: 138rpx;
  1886. height: 48rpx;
  1887. line-height: 48rpx;
  1888. background: #32467b;
  1889. border-radius: 10rpx;
  1890. color: #ffffff;
  1891. font-size: 28rpx;
  1892. text-align: center;
  1893. vertical-align: middle;
  1894. position: absolute;
  1895. right: 30rpx;
  1896. }
  1897. .video_body {
  1898. padding-bottom: 96rpx;
  1899. }
  1900. .tj_box {
  1901. width: 50%;
  1902. display: inline-block;
  1903. text-align: center;
  1904. margin: 10rpx 0;
  1905. }
  1906. .t2 {
  1907. font-size: 24rpx;
  1908. font-family: PingFang SC;
  1909. color: #666666;
  1910. line-height: 36rpx;
  1911. margin: 15rpx;
  1912. }
  1913. .r_t2 {
  1914. width: 201rpx;
  1915. height: 49rpx;
  1916. background: rgba(22, 119, 255, 0.05);
  1917. border: 1rpx solid #32467b;
  1918. border-radius: 16rpx;
  1919. color: #666666;
  1920. font-size: 23rpx;
  1921. text-align: center;
  1922. display: flex;
  1923. align-items: center;
  1924. padding: 5rpx;
  1925. }
  1926. .scroll_box {
  1927. width: 100%;
  1928. height: 60rpx;
  1929. background: #ffffff;
  1930. box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
  1931. white-space: nowrap;
  1932. overflow: hidden;
  1933. margin: 15rpx 0;
  1934. }
  1935. .r_sliper {
  1936. padding: 0 20rpx;
  1937. }
  1938. .top_line {
  1939. width: 6rpx;
  1940. height: 22rpx;
  1941. background: #32467b;
  1942. margin-right: 10rpx;
  1943. }
  1944. .video_t2 {
  1945. font-size: 24rpx;
  1946. font-family: PingFang SC;
  1947. font-weight: 500;
  1948. color: #666666;
  1949. }
  1950. .video_play {
  1951. position: absolute;
  1952. width: 95rpx;
  1953. height: 95rpx;
  1954. top: 0;
  1955. left: 0;
  1956. right: 0;
  1957. bottom: 0;
  1958. margin: auto;
  1959. }
  1960. .video_box {
  1961. position: relative;
  1962. }
  1963. .slot-content {
  1964. padding: 0 20rpx;
  1965. }
  1966. .notice_modal {
  1967. .content {
  1968. width: 100%;
  1969. height: 100%;
  1970. padding: 56rpx 56rpx 56rpx 64rpx;
  1971. .title {
  1972. color: #222;
  1973. line-height: 40rpx;
  1974. font-size: 36rpx;
  1975. text-align: center;
  1976. font-weight: bold;
  1977. margin-bottom: 24rpx;
  1978. }
  1979. .text {
  1980. height: 340rpx;
  1981. line-height: 40rpx;
  1982. text-indent: 2em;
  1983. font-size: 32rpx;
  1984. color: #222;
  1985. }
  1986. .had_read {
  1987. width: 100%;
  1988. height: 88rpx;
  1989. line-height: 88rpx;
  1990. text-align: center;
  1991. background: #3577e8;
  1992. border-radius: 240rpx;
  1993. font-size: 32rpx;
  1994. font-weight: 500;
  1995. color: #fff;
  1996. margin-top: 20rpx;
  1997. &.gray {
  1998. background: #bbbec5;
  1999. }
  2000. }
  2001. }
  2002. }
  2003. </style>