detail.vue 53 KB

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