detail.js 9.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245
  1. $(function(){
  2. gobalData.token = $.cookie("token");
  3. gobalData.sm_id = $.cookie("sm_id");
  4. var searchVal=window.location.search;
  5. if(searchVal && searchVal!=''){
  6. var tag=searchVal.indexOf("id=");
  7. if(tag>=0){
  8. var idArr=searchVal.split("=");
  9. var active_id=idArr[1];
  10. preLoadingInit();
  11. getCourseDetailData(active_id);
  12. }
  13. }
  14. })
  15. function preLoadingInit(){
  16. var clientHeight=$(window).height();
  17. var loadingheight=clientHeight-100;
  18. var text='<div style="height:'+loadingheight+'px;">'
  19. +'<div class="col-sm-2">'
  20. +'<div class="sp sp-circle"></div>'
  21. +'<h5 class="preloading">努力加载中...</h5>'
  22. +'</div>'
  23. +'</div>';
  24. $("#root").html(text);
  25. }
  26. function getCourseDetailData(target){
  27. var totalURL=gobalData.link;
  28. var requestURL=totalURL.course_detail;
  29. $.ajax({
  30. url:requestURL,
  31. type:'POST',
  32. dataType:'json',
  33. data:{
  34. spec_id:target,
  35. token:gobalData.token,
  36. sm_id:gobalData.sm_id
  37. },
  38. success:function(res){
  39. if(res.code=='1'){
  40. var _data=res.data;
  41. courseDetailInit(target,_data);
  42. }
  43. }
  44. });
  45. }
  46. function courseDetailInit(target,data){
  47. $("#root").empty();
  48. var deatilBrief='';
  49. if(data.brief!=''){
  50. deatilBrief=data.brief;
  51. }else{
  52. deatilBrief='<div style="width:100%;text-align:center;font-size:14px;color:#606266;">暂无简介</div>';
  53. }
  54. //console.log(data);
  55. var text='<div style="padding-bottom:10px;border-bottom:solid #DCDFE6 1px;">'
  56. +'<div style="margin-bottom:5px;width:100%;height:160px;border:solid #EBEEF5 1px;">'
  57. +'<img src="'+data.course_img+'" alt="" style="width:100%;height:100%;"/>'
  58. +'</div>'
  59. +'<div class="courseInfoItem">课程名称:'+data.course_name+'</div>'
  60. +'<div class="courseInfoItem">责任教师:'+data.teacher_name+'</div>'
  61. +'<div class="courseInfoItem">单位机构:'+data.teacher_organization+'</div>'
  62. +'</div>'
  63. //团队
  64. +'<div style="padding-bottom:10px;border-bottom:solid #DCDFE6 1px;">'
  65. +'<div style="font-size:14px;color:#303133;padding-top:10px;">课程安排</div>'
  66. +'<div style="width:100%;font-size:14px;color:#303133;padding:10px 0px 5px 0px;">'
  67. +'<table id="companyModel" border style="width:100%;">'
  68. +'<tr style="width:100%;">'
  69. +'<td style="width:18%;text-align:center;">时间</td>'
  70. +'<td style="width:64%;text-align:center;">授课内容</td>'
  71. +'<td style="width:18%;text-align:center;">授课教师</td>'
  72. +'</tr>'
  73. +'</table>'
  74. +'</div>'
  75. +'</div>'
  76. //内容简介
  77. +'<div style="padding:10px 0px 10px 0px;border-bottom:solid #DCDFE6 1px;font-size:14px;color:#606266;">'
  78. +deatilBrief
  79. +'</div>'
  80. //章节显示
  81. +'<div id="chapterModel" style="padding-top:5px;">'
  82. //+chapterText
  83. +'<div style="clear:both;"></div>'
  84. +'</div>'
  85. +'<div style="clear:both;"></div>';
  86. $("#root").html(text);
  87. getCompanyData(target);
  88. getChapterData(target);
  89. $("#closeVideo").on("tap",function(){
  90. $("#videoModel").empty();
  91. $("#closeVideo").hide();
  92. $("#videoModelWrapper").css({
  93. height:'0px'
  94. });
  95. });
  96. }
  97. function getChapterData(target){
  98. var totalURL=gobalData.link;
  99. var requestURL=totalURL.course_chapter;
  100. $.ajax({
  101. url:requestURL,
  102. type:'POST',
  103. dataType:'json',
  104. data:{
  105. spec_id:target,
  106. page:1,
  107. limit:10000,
  108. token:gobalData.token,
  109. sm_id:gobalData.sm_id
  110. },
  111. success:function(res){
  112. if(res.code=='1'){
  113. var _data=res.data;
  114. var text='';
  115. var len=_data.length;
  116. gobalData.chapterData=_data;
  117. if(len>0){
  118. for(var i=0;i<len;i++){
  119. var num=i+1;
  120. var chapterItem=_data[i];
  121. var chapterTitle=chapterItem.zj_name;
  122. text+='<div style="width:50%;float:left;padding:5px 0px 5px 0px;">'
  123. +'<div id="chapterItem_'+chapterItem.zj_id+'" '
  124. +'onclick="handleChapterItem(chapterItem_'+chapterItem.zj_id+')"'
  125. +'style="width:96%;margin:0 auto;">'
  126. +'<div style="width:100%;height:100px;border:solid #DCDFE6 1px;">'
  127. +'<img src="'+chapterItem.zj_img+'" alt="" '
  128. +'style="width:100%;height:100px;"/>'
  129. +'</div>'
  130. +'<div style="padding-top:5px;font-size:13px;color:#606266;">'
  131. +chapterTitle
  132. +'</div>'
  133. +'</div>'
  134. +'</div>';
  135. if(num%2==0){
  136. text+='<div style="clear:both;"></div>';
  137. }
  138. if(i==len-1){
  139. $("#chapterModel").append(text);
  140. }
  141. }
  142. }else{
  143. gobalData.chapterLoading = false;
  144. text='<div style="width:100%;text-align:center;font-size:14px;color:#606266;padding-top:10px;">'
  145. +'暂无章节'
  146. +'</div>';
  147. $("#chapterModel").append(text);
  148. }
  149. }
  150. }
  151. });
  152. }
  153. function getCompanyData(target){
  154. var totalURL=gobalData.link;
  155. var requestURL=totalURL.course_company;
  156. $.ajax({
  157. url:requestURL,
  158. type:'POST',
  159. dataType:'json',
  160. data:{
  161. spec_id:target,
  162. data_type:"json",
  163. page:1,
  164. limit:10000,
  165. token:gobalData.token,
  166. sm_id:gobalData.sm_id
  167. },
  168. success:function(res){
  169. if(res.code=='1'){
  170. var _data=res.data;
  171. var len=_data.length;
  172. var text='';
  173. if(len>0){
  174. for(var i=0;i<len;i++){
  175. var item=_data[i];
  176. text+='<tr style="width:100%;font-size:13px;color:#606266;">'
  177. +'<td style="width:18%;text-align:center;">'+item.shijian+'</td>'
  178. +'<td style="width:64%;text-align:center;">'+item.shouke_content+'</td>'
  179. +'<td style="width:18%;text-align:center;">'+item.shouke_teacher+'</td>'
  180. +'</tr>';
  181. if(i==len-1){
  182. $("#companyModel").append(text);
  183. }
  184. }
  185. }else{
  186. text='<tr style="width:100%;font-size:13px;color:#606266;">'
  187. +'<td colspan=3 align="center">'
  188. +'暂无数据'
  189. +'</td>'
  190. +'</tr>';
  191. $("#companyModel").append(text);
  192. }
  193. }
  194. }
  195. });
  196. }
  197. function handleChapterItem(target){
  198. var _id=target.id;
  199. var tag=_id.indexOf("_");
  200. if(tag>=0){
  201. var _idArr=_id.split("_");
  202. var activeId=_idArr[1];
  203. var _chapterData=gobalData.chapterData;
  204. for(var i in _chapterData){
  205. var item=_chapterData[i];
  206. if(item.zj_id==activeId){
  207. //console.log(item);
  208. $("#videoModel").empty();
  209. var videoLink=item.zj_video;
  210. var _videoLink=videoLink.trim();
  211. if(_videoLink!=''){
  212. var text='<video controls="controls" controlsList="nodownload" '
  213. +'x5-video-player-type="h5" x5-video-orientation="landscape"'
  214. +'poster="'+item.zj_img+'"'
  215. +'style="width:100%;height:100%;">'
  216. +'<source src="'+_videoLink+'" type="video/mp4">'
  217. +'您的浏览器不支持Video'
  218. +'</video>';
  219. var clientHeight=$(window).height();
  220. $("#videoModelWrapper").css({
  221. height:clientHeight+'px'
  222. });
  223. $("#videoModel").append(text);
  224. $("#closeVideo").show();
  225. }else{
  226. mui.toast('此章节暂无视频',{ duration:'short', type:'div' });
  227. }
  228. }
  229. }
  230. }
  231. }