course_edit.html 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658
  1. {extend name="public/layout"/} {block name="title"}课件修改{/block} {block name="body"}
  2. <style type="text/css">
  3. html,
  4. body {
  5. display: block;
  6. min-width: 100%;
  7. background-color: #fff;
  8. }
  9. .layui-fluid {
  10. display: block;
  11. border-radius: 5px;
  12. background-color: #ffffff;
  13. padding: 15px 30px;
  14. }
  15. .layui-tab {
  16. padding: 15px;
  17. height: 100%;
  18. }
  19. #addtype {
  20. margin-top: 0px;
  21. }
  22. .layui-input-inline.input-longer-inline {
  23. width: 290px;
  24. }
  25. .layui-form-item .layui-input-inline {
  26. width: auto;
  27. }
  28. .layui-titlebox{
  29. position: relative;
  30. left: 0;
  31. height: 40px;
  32. white-space: nowrap;
  33. font-size: 0;
  34. border-bottom-width: 1px;
  35. border-bottom-style: solid;
  36. transition: all .2s;
  37. -webkit-transition: all .2s;
  38. border-color: #e6e6e6;
  39. color: #666;
  40. background-color: #f2f2f2;
  41. }
  42. .layui-titlebox li {
  43. display: inline-block;
  44. vertical-align: middle;
  45. font-size: 14px;
  46. transition: all .2s;
  47. -webkit-transition: all .2s;
  48. position: relative;
  49. line-height: 40px;
  50. width: 50%;
  51. text-align: center;
  52. cursor: pointer;
  53. box-sizing: border-box;
  54. }
  55. .layui-titlebox li:hover {
  56. color: #249EFB;
  57. }
  58. .layui-titlebox .layui-this:hover {
  59. color: #fff;
  60. }
  61. .layui-titlebox .layui-this {
  62. color: #000;
  63. border-bottom-color: transparent;
  64. background-color: #249EFB;
  65. color: #FFFFFF;
  66. }
  67. .layui-titlebox .layui-this:after {
  68. position: absolute;
  69. left: 0;
  70. top: 0;
  71. content: '';
  72. width: 100%;
  73. height: 41px;
  74. border-width: 1px;
  75. border-style: solid;
  76. border-color: #e6e6e6;
  77. border-bottom-color: #fff;
  78. border-radius: 2px 2px 0 0;
  79. box-sizing: border-box;
  80. pointer-events: none;
  81. }
  82. .cancel,.cancel:hover {
  83. background-color: #fff;
  84. color: #249EFB;
  85. border: 1px solid #249EFB;
  86. }
  87. .layui-btn-primary,.layui-btn-primary:hover {
  88. color: #fff;
  89. background-color: #249EFB;
  90. border: none;
  91. }
  92. .layui-icon-add-circle::before {
  93. font-size: 30px;
  94. }
  95. .layui-border-btn,.layui-border-btn:hover {
  96. border: 1px solid #249EFB;
  97. background-color: #fff;
  98. color: #249EFB;
  99. }
  100. .layui-tab-content {
  101. padding-top: 20px;
  102. }
  103. .plr20{
  104. padding: 0px 20px;
  105. }
  106. .layui-form-radio>i {
  107. font-size: 18px;
  108. }
  109. .uploadbtnhide{
  110. display: none;
  111. }
  112. .uploadbtnshow{
  113. display: inline-block;
  114. }
  115. .isimgupload{width:190px !important;height: 114px;overflow: hidden;}
  116. .imageDivs{position: absolute;top:0;left:0;width:100%;height: 100%;background: rgba(230,230,230,.5);display: none;}
  117. .imageDivs i{display: block;width:18px;height: 18px;position: absolute;top:0;left:0;bottom:0;right: 0;margin:auto;}
  118. .layui-upload-drag{padding:14px 65px !important;}
  119. .layui-upload-drag i{font-size: 58px !important;}
  120. .layui-table img{max-width: 100% !important;}
  121. </style>
  122. <div class="layui-fluid">
  123. <div class="layui-table">
  124. <ul class="layui-titlebox">
  125. <li id="tab-item-1" class="layui-this">基础信息</li>
  126. <li id="tab-item-2">完成课件</li>
  127. </ul>
  128. <form class="layui-form">
  129. <div class="layui-tab-content">
  130. <div class="layui-tab-item layui-show">
  131. <div class="layui-form-item">
  132. <label for="title" class="layui-form-label"><i style="color:red;">*</i>课件名称:</label>
  133. <div class="layui-input-block">
  134. <input name="title" id="title" style="max-width: 500px;" class="layui-input" required placeholder="请输入课件名称" value="{$data.title}">
  135. </div>
  136. </div>
  137. <div class="layui-form-item" style="display: flex;align-items: center;">
  138. <label for="type" class="layui-form-label"><i style="color:red;">*</i>课件场景:</label>
  139. <div class="layui-input-inline">
  140. <select id="type" name="type_id">
  141. <option value="">请选择类型</option>
  142. {volist name="type" id="vo"}
  143. <option value="{$vo.id}" {if condition="$type_id eq $vo.id"}selected{/if}>{$vo.type}</option>
  144. {/volist}
  145. </select>
  146. </div>
  147. <!-- <i class="layui-icon layui-icon-add-circle adding" id="addtype"></i> -->
  148. </div>
  149. <div class="layui-form-item">
  150. <label class="layui-form-label"><i style="color:red;">*</i>课件分类:</label>
  151. <div class="layui-input-block">
  152. <input type="radio" name="type" value="video" title="视频课程" lay-filter="type" {eq name="$data.type" value="video"}checked{/eq}/>
  153. <input type="radio" name="type" value="image" title="图文课程" lay-filter="type" {eq name="$data.type" value="image"}checked{/eq}/>
  154. <input type="radio" name="type" value="audio" title="音频课程" lay-filter="type" {eq name="$data.type" value="audio"}checked{/eq}/>
  155. <input type="radio" name="type" value="pdf" title="pdf课程" lay-filter="type" {eq name="$data.type" value="pdf"}checked{/eq}/>
  156. </div>
  157. </div>
  158. <div class="layui-form-item videoImage layui-hide">
  159. <label class="layui-form-label">视频封面图</label>
  160. <div class="isimgupload layui-input-inline" style="position:relative;">
  161. <div class="" id="upload-drag12">
  162. {if condition="$data.video_img neq ''"}
  163. <img class="fmimages" src="{$data.video_img}" style="height: 100%;width:100%;">
  164. {else/}
  165. <div class="layui-upload-drag">
  166. <i class="layui-icon">&#xe681;</i>
  167. <p>上传图片</p>
  168. </div>
  169. {/if}
  170. </div>
  171. <div class="imageDivs"><i class="layui-icon layui-icon-delete" prop="del"></i></div>
  172. <input type="hidden" name="video_img" id="video_img" value="{$old_video_img}" />
  173. </div>
  174. </div>
  175. <div class="layui-form-item videoTips layui-hide">
  176. <label class="layui-form-label"></label>
  177. <div><i style="color:red;margin-right:5px;">*</i>建议上传图片宽高比例5:3,图片大小不超过1M</div>
  178. </div>
  179. <div class="layui-form-item layui-hide">
  180. <label class="layui-form-label">视频</label>
  181. <div class="layui-input-inline" style="width: 290px;">
  182. <input type="radio" name="myradio" value="random_name" checked=true/> 上传文件名字是随机文件名, 后缀保留
  183. </div>
  184. </div>
  185. <div class="layui-form-item video layui-hide">
  186. <label class="layui-form-label"><i style="color:red;">*</i>上传</label>
  187. <div class="layui-input-inline" style="width: 290px;display: block;" id="container">
  188. <a class="trainuploadbtn layui-btn btn layui-border-btn uploadbtnhide {eq name='$data.type' value='video'}uploadbtnshow{/eq}" id="selectfiles" href="javascript:void(0);">选择视频</a>
  189. <a class="trainuploadbtn layui-btn btn layui-border-btn uploadbtnhide {eq name='$data.type' value='audio'}uploadbtnshow{/eq}" id="selectfiles2" href="javascript:void(0);">选择音频</a>
  190. <a class="trainuploadbtn layui-btn btn layui-border-btn uploadbtnhide {eq name='$data.type' value='pdf'}uploadbtnshow{/eq}" id="selectfiles3" href="javascript:void(0);">选择pdf</a>
  191. <a class="layui-btn btn layui-border-btn" id="postfiles" href="javascript:void(0);">开始上传</a>
  192. <a class="layui-btn btn layui-border-btn" style="display:none;" id="postfiles1" href="javascript:void(0);">开始上传</a>
  193. <a class="layui-btn btn layui-border-btn" style="display:none;" id="postfiles2" href="javascript:void(0);">开始上传</a>
  194. <a class="layui-btn btn layui-border-btn" style="display:none;" id="postfiles3" href="javascript:void(0);">开始上传</a>
  195. <div id="ossfile"></div>
  196. {eq name='$data.type' value='video'}
  197. <video src="{$data.file}" id="trainfilediv" width="320" height="240" controls="controls" style="margin-top: 20px;background-color: #000;"></video>
  198. {/eq}
  199. {eq name='$data.type' value='audio'}
  200. <audio src="{$data.file}" id="trainfilediv" width="320" height="240" controls="controls" style="margin-top: 20px;"></audio>
  201. {/eq}
  202. {eq name='$data.type' value='pdf'}
  203. <iframe src="{$data.file}" id="trainfilediv" width="320" height="240" controls="controls" style="margin-top: 20px;"></iframe>
  204. {/eq}
  205. <div id="symbshowed"></div>
  206. <!--报错信息返回展示-->
  207. <pre id="console"></pre>
  208. <input type="hidden" value="{$old_file}" id="fileuri">
  209. <!--上传到OSS哪个文件下,在这里定义-->
  210. <input type="hidden" value="Trainimage" id="category_name">
  211. <input type="hidden" value="Trainvideo" id="category_name1">
  212. <input type="hidden" value="Trainaudio" id="category_name2">
  213. <input type="hidden" value="Trainpdf" id="category_name3">
  214. </div>
  215. </div>
  216. <div class="layui-form-item videolimit layui-hide">
  217. <label class="layui-form-label"></label>
  218. <div><i style="color:red;margin-right:5px;">*</i><span id="limitVA">上传视频大小不超过280M</span></div>
  219. </div>
  220. <div class="layui-form-item images layui-hide">
  221. <label class="layui-form-label"><i style="color:red;">*</i>上传图片</label>
  222. <div class="layui-input-inline" id="upload-drag">
  223. {if condition="$data.type eq 'image'"}
  224. <img src="{$data.file}" style="height: 100%;width:100%;">
  225. <!-- <input type="hidden" name="file_image" id="file_image" value="{$old_file}" /> -->
  226. {else/}
  227. <div class="layui-upload-drag">
  228. <i class="layui-icon">&#xe681;</i>
  229. <p>上传图片</p>
  230. </div>
  231. {/if}
  232. </div>
  233. </div>
  234. <div class="layui-form-item images layui-hide">
  235. <label class="layui-form-label"></label>
  236. <div><i style="color:red;margin-right:5px;">*</i>建议上传图片宽高比例5:3,图片大小不超过1M</div>
  237. </div>
  238. <div class="layui-form-item">
  239. <label for="content" class="layui-form-label"><i id="contentrequire" style="color:red;">*</i>内容:</label>
  240. <div class="layui-input-block">
  241. <!-- <textarea name="content" id="content" cols="50" rows="20" required>{$data.content}</textarea> -->
  242. <textarea id='content' name='content' cols="50" rows="20" required style="height: 350px;">{$data.content}</textarea >
  243. </div>
  244. </div>
  245. <input type="hidden" name="id" id="id" value="{$data.id}" />
  246. <div class="layui-form-item" style="text-align: center;margin-top: 80px;">
  247. <!-- <button type="button" class="layui-btn plr20 nexTrain">下一步</button> -->
  248. <input class="layui-btn layui-btn-primary plr20" type="button" lay-submit lay-filter="Add" id="Add" value="保存">
  249. <button type="button" class="layui-btn plr20 cancel">取消</button>
  250. </div>
  251. </div>
  252. <div class="layui-tab-item">
  253. <div class="layui-form-item">
  254. 学习时长限制
  255. </div>
  256. <div class="layui-form-item">
  257. <input type="radio" name="time_check" title="开启" value="1" {gt name="$data.study_time" value="0"}checked{/gt}>
  258. <input type="radio" name="time_check" title="关闭" value="0" {eq name="$data.study_time" value="0"}checked{/eq}>
  259. </div>
  260. <div class="layui-form-item">
  261. <div class="layui-form-mid layui-word-aux">当员工在页面学习</div>
  262. <div class="layui-input-inline">
  263. <input name="study_time" class="layui-input" {gt name="$data.study_time" value="0"}value="{$data.study_time}"{/gt} autocomplete="off" onkeyup="value=value.replace(/\D|^0/g,'')">
  264. </div>
  265. <div class="layui-form-mid layui-word-aux">分钟后,课件学习完毕。</div>
  266. </div>
  267. <div class="layui-form-item">
  268. 评论字数限制
  269. </div>
  270. <div class="layui-form-item">
  271. <input type="radio" name="word_check" title="开启" value="1" {gt name="$data.comment_word_num" value="0"}checked{/gt}>
  272. <input type="radio" name="word_check" title="关闭" value="0" {eq name="$data.comment_word_num" value="0"}checked{/eq}>
  273. </div>
  274. <div class="layui-form-item">
  275. <div class="layui-form-mid layui-word-aux">当员工评论内容大于</div>
  276. <div class="layui-input-inline">
  277. <input name="comment_word_num" class="layui-input" {gt name="$data.comment_word_num" value="0"}value="{$data.comment_word_num}"{/gt} autocomplete="off" onkeyup="value=value.replace(/\D|^0/g,'')">
  278. </div>
  279. <div class="layui-form-mid layui-word-aux">字后,课件学习完毕。</div>
  280. </div>
  281. <div class="layui-form-item" style="text-align: center;margin-top: 80px;">
  282. <!-- <button type="button" class="layui-btn plr20 lasTrain" >上一步</button> -->
  283. <input class="layui-btn layui-btn-primary plr20" type="button" lay-submit lay-filter="Add" id="Add" value="保存">
  284. <button type="button" class="layui-btn plr20 cancel">取消</button>
  285. </div>
  286. </div>
  287. </div>
  288. </form>
  289. </div>
  290. </div>
  291. {/block} {block name="js"}
  292. <!-- 配置文件 -->
  293. <script type="text/javascript" src="__STATIC__/ueditor/dist/utf8-php/ueditor.config.js"></script>
  294. <!-- 编辑器源码文件 -->
  295. <script type="text/javascript" src="__STATIC__/ueditor/dist/utf8-php/ueditor.all.js"></script>
  296. <!-- 实例化编辑器 -->
  297. <script type="text/javascript">
  298. var ue = UE.getEditor('content');
  299. </script>
  300. <script type="text/javascript" src="__STATIC__/js/plupload/js/plupload.full.min.js"></script>
  301. <script type="text/javascript" src="__STATIC__/js/plupload/ossupload.js"></script>
  302. <script>
  303. layui.config({
  304. base: '__LAYUI__/',
  305. urlbase: '/sys'
  306. }).extend({
  307. index: 'lib/index'
  308. }).use(['index', 'table', 'layedit', 'element', 'upload'], function() {
  309. var $ = layui.$,
  310. table = layui.table,
  311. element = layui.element,
  312. form = layui.form,
  313. upload = layui.upload,
  314. layedit = layui.layedit;
  315. //默认
  316. var initial = "{$data.type}";
  317. if (initial == 'video') {
  318. $('.video').removeClass('layui-hide');
  319. $('.videoImage').removeClass('layui-hide');
  320. $('.videolimit').removeClass('layui-hide');
  321. $('.videoTips').removeClass('layui-hide');
  322. $('.images').addClass('layui-hide');
  323. $('.tipsds').addClass('layui-hide')
  324. $('#selectfiles').html('选择视频');
  325. $('#limitVA').html('上传视频大小不超过280M');
  326. }else if (initial == 'image') {
  327. $('.images').removeClass('layui-hide');
  328. $('.tipsds').removeClass('layui-hide');
  329. $('.video').addClass('layui-hide');
  330. $('.videoImage').addClass('layui-hide');
  331. $('.videoTips').addClass('layui-hide');
  332. $('.videolimit').addClass('layui-hide');
  333. }else if (initial == 'audio') {
  334. $('.video').removeClass('layui-hide');
  335. $('.videolimit').removeClass('layui-hide');
  336. $('.images').addClass('layui-hide');
  337. $('.tipsds').addClass('layui-hide');
  338. $('.videoImage').addClass('layui-hide');
  339. $('.videoTips').addClass('layui-hide');
  340. $('#selectfiles').html('选择音频');
  341. $('#limitVA').html('上传音频大小不超过280M');
  342. }else if (initial == 'pdf') {
  343. $('.video').removeClass('layui-hide');
  344. $('.videolimit').removeClass('layui-hide');
  345. $('.images').addClass('layui-hide');
  346. $('.tipsds').addClass('layui-hide');
  347. $('.videoImage').addClass('layui-hide');
  348. $('.videoTips').addClass('layui-hide');
  349. $('#selectfiles').html('选择pdf');
  350. $('#limitVA').html('上传pdf文件大小不超过280M');
  351. $('#contentrequire').addClass('layui-hide');
  352. }
  353. $('#tab-item-1').click(function(){
  354. $('.layui-titlebox li').removeClass('layui-this');
  355. $($('.layui-titlebox li')[0]).addClass('layui-this');
  356. $('.layui-tab-content .layui-tab-item').removeClass('layui-show');
  357. $($('.layui-tab-content .layui-tab-item')[0]).addClass('layui-show');
  358. })
  359. $('#tab-item-2').click(function(){
  360. $('.layui-titlebox li').removeClass('layui-this');
  361. $($('.layui-titlebox li')[1]).addClass('layui-this');
  362. $('.layui-tab-content .layui-tab-item').removeClass('layui-show');
  363. $($('.layui-tab-content .layui-tab-item')[1]).addClass('layui-show');
  364. })
  365. $('.nexTrain').click(function(){
  366. $('.layui-titlebox li').removeClass('layui-this');
  367. $($('.layui-titlebox li')[1]).addClass('layui-this');
  368. $('.layui-tab-content .layui-tab-item').removeClass('layui-show');
  369. $($('.layui-tab-content .layui-tab-item')[1]).addClass('layui-show');
  370. })
  371. $('.lasTrain').click(function(){
  372. $('.layui-titlebox li').removeClass('layui-this');
  373. $($('.layui-titlebox li')[0]).addClass('layui-this');
  374. $('.layui-tab-content .layui-tab-item').removeClass('layui-show');
  375. $($('.layui-tab-content .layui-tab-item')[0]).addClass('layui-show');
  376. })
  377. $('.cancel').click(function(){
  378. var index = parent.layer.getFrameIndex(window.name);
  379. parent.layer.close(index);
  380. })
  381. function size(value){
  382. var value = value.replace(/[^\d]/g,'');
  383. if(''!=value){
  384. value = parseInt(value);
  385. }
  386. return value;
  387. }
  388. // layedit.set({
  389. // //暴露layupload参数设置接口 --详细查看layupload参数说明
  390. // uploadImage: {
  391. // url: '{:url("train/fileupload")}',
  392. // accept: 'image',
  393. // acceptMime: 'image/*',
  394. // exts: 'jpg|png|gif|bmp|jpeg',
  395. // size: '10240'
  396. // },
  397. // calldel: {
  398. // url: '{:url("train/filedelete")}'
  399. // },
  400. // devmode: true,
  401. // codeConfig: {
  402. // hide: true, //是否显示编码语言选择框
  403. // default: 'javascript' //hide为true时的默认语言格式
  404. // },
  405. // tool: [
  406. // 'html', 'code', 'strong', 'italic', 'underline', 'del', 'addhr', '|', 'fontFomatt', 'colorpicker', 'face'
  407. // , '|', 'left', 'center', 'right', '|', 'link', 'unlink', 'image_alt', 'video', 'anchors','image'
  408. // , '|', 'fullScreen'
  409. // ],
  410. // height: '80%'
  411. // });
  412. // var ieditor = layedit.build('content');
  413. form.on('submit(Add)', function (data) {
  414. let title = $('#title')[0].value;
  415. if (title.length>16) {
  416. layer.msg('课件名称限制十六个汉字以内');
  417. return false;
  418. }
  419. var ret = /^[ ]+$/;
  420. if (ret.test(title)) {
  421. layer.msg('课件名称不能为空');
  422. return false;
  423. }
  424. var index = parent.layer.getFrameIndex(window.name);
  425. var formData = new FormData(data.form);
  426. var type = $("input[name='type']:checked").val();
  427. if (type == 'audio') {
  428. formData.append('file_audio',$('#fileuri').val());
  429. } else if(type == 'video') {
  430. formData.append('file_video',$('#fileuri').val());
  431. } else if(type == 'pdf') {
  432. formData.append('file_pdf',$('#fileuri').val());
  433. }
  434. ue.ready(function () {
  435. formData.append('content', ue.getContent());
  436. });
  437. //formData.set('content', layedit.getContent(ieditor));
  438. var textarea = ue.getContent();
  439. var check = textarea.replace(/&nbsp;/gi, "");
  440. if (!check && type != 'pdf') {
  441. layer.msg('内容必填');
  442. return false;
  443. }
  444. var load = layer.load(1, {shade: [0.5, '#fff']})
  445. $.ajax({
  446. url: '{:url("train/courseEditSave")}',
  447. data: formData,
  448. type: 'post',
  449. dataType: 'json',
  450. processData: false,
  451. contentType: false,
  452. success: function (res) {
  453. if (res.code == 0) {
  454. layer.msg(res.msg, {
  455. icon: 1,
  456. time: 1000
  457. },function(){
  458. parent.layui.table.reload('datalist');
  459. parent.layer.close(index);
  460. });
  461. } else {
  462. layer.close(load);
  463. layer.msg(res.msg);
  464. }
  465. }
  466. });
  467. });
  468. //课件场景添加
  469. $('#addtype').click(function() {
  470. layer.prompt({
  471. formType: 0,
  472. value: '',
  473. title: ['请输入场景', 'color:#333333;background-color:#D8E6F1;'],
  474. area: ['800px', '350px']
  475. }, function(value, index, elem) {
  476. if (value.length>16) {
  477. layer.msg('场景名称限制十六个汉字以内');
  478. return false;
  479. }
  480. $.ajax({
  481. url: '{:url("train/add_train_type")}',
  482. data: {
  483. type: value
  484. },
  485. type: 'post',
  486. success: function(res) {
  487. $('#type').append('<option value="' + res.data.id + '">' + value + '</option>');
  488. form.render();
  489. layer.msg(res.msg, {
  490. anim: 0
  491. }, function() {
  492. layer.close(index); //再执行关闭
  493. });
  494. }
  495. });
  496. });
  497. });
  498. form.on('radio(type)', function(data) {
  499. // $('#fileuri').val('');//切换后清空地址
  500. // $('#ossfile').children().remove();//切换后清空地址
  501. $('#contentrequire').removeClass('layui-hide');
  502. if(data.value == 'video' || data.value=='audio') {
  503. $('.video').removeClass('layui-hide');
  504. $('.images').addClass('layui-hide');
  505. if (data.value=='video') {
  506. $('.videoTips').removeClass('layui-hide')
  507. $('.videoImage').removeClass('layui-hide')
  508. $('.videolimit').removeClass('layui-hide');
  509. $('#selectfiles').html('选择视频');
  510. $('#container video').show();
  511. $('#container audio').hide();
  512. $('#container iframe').hide();
  513. $('#limitVA').html('上传视频大小不超过280M');
  514. // $('#category_name').val('Trainvideo');
  515. $('.trainuploadbtn')[0].style.display="inline-block";
  516. $('.trainuploadbtn')[1].style.display = "none";
  517. $('.trainuploadbtn')[2].style.display = "none";
  518. $("#postfiles").show();
  519. $("#postfiles1").hide();
  520. $("#postfiles2").hide();
  521. $("#postfiles3").hide();
  522. } else {
  523. $('.videoTips').addClass('layui-hide')
  524. $('.videoImage').addClass('layui-hide')
  525. $('.videolimit').removeClass('layui-hide');
  526. $('#selectfiles').html('选择音频');
  527. $('#container video').hide();
  528. $('#container audio').show();
  529. $('#container iframe').hide();
  530. $('#limitVA').html('上传音频大小不超过280M');
  531. $('.trainuploadbtn')[0].style.display = "none";
  532. $('.trainuploadbtn')[1].style.display = "inline-block";
  533. $('.trainuploadbtn')[2].style.display = "none";
  534. $("#postfiles").hide();
  535. $("#postfiles1").hide();
  536. $("#postfiles2").show();
  537. $("#postfiles3").hide();
  538. }
  539. } else if (data.value=='pdf') {
  540. $('.video').removeClass('layui-hide');
  541. $('.videolimit').removeClass('layui-hide');
  542. $('.images').addClass('layui-hide');
  543. $('.tipsds').addClass('layui-hide');
  544. $('.videoImage').addClass('layui-hide');
  545. $('.videoTips').addClass('layui-hide');
  546. $('#selectfiles').html('选择pdf');
  547. $('#container video').hide();
  548. $('#container audio').hide();
  549. $('#container iframe').show();
  550. $('#limitVA').html('上传pdf文件大小不超过280M');
  551. $('#contentrequire').addClass('layui-hide');
  552. $('.trainuploadbtn')[0].style.display = "none";
  553. $('.trainuploadbtn')[1].style.display = "none";
  554. $('.trainuploadbtn')[2].style.display = "inline-block";
  555. $("#postfiles").hide();
  556. $("#postfiles1").hide();
  557. $("#postfiles2").hide();
  558. $("#postfiles3").show();
  559. } else {
  560. $('.videoTips').addClass('layui-hide')
  561. $('.videoImage').addClass('layui-hide')
  562. $('.images').removeClass('layui-hide');
  563. $('.video').addClass('layui-hide');
  564. $('.videolimit').addClass('layui-hide');
  565. $('.trainuploadbtn')[0].style.display = "none";
  566. $('.trainuploadbtn')[1].style.display = "none";
  567. $('.trainuploadbtn')[2].style.display = "none";
  568. $("#postfiles").hide();
  569. $("#postfiles1").show();
  570. $("#postfiles2").hide();
  571. $("#postfiles3").hide();
  572. }
  573. //如果展示
  574. if (data.value == initial) {
  575. // $('#fileuri').val("{$old_file}");
  576. }
  577. });
  578. //点击开始上传把之前的清空
  579. $('#postfiles').click(function(){
  580. // $('#container video').hide();
  581. // $('#container audio').hide();
  582. // $('#container iframe').hide();
  583. })
  584. //拖拽上传
  585. upload.render({
  586. elem: '#upload-drag',
  587. accept: 'image',
  588. exts: 'png|jpg|jpeg',
  589. auto: false,
  590. field: 'file_image',
  591. size: 3 * 1024,
  592. choose: function(obj) {
  593. obj.preview(function(index, file, result) {
  594. $('#upload-drag').html('<img src="' + result + '" style="height: 100%;width:100%;">');
  595. });
  596. }
  597. });
  598. //拖拽上传
  599. upload.render({
  600. elem: '#upload-drag12',
  601. accept: 'image',
  602. exts: 'png|jpg|jpeg',
  603. auto: false,
  604. field: 'video_img',
  605. size: 3 * 1024,
  606. choose: function(obj) {
  607. obj.preview(function(index, file, result) {
  608. $('#upload-drag12').html('<img class="fmimages" src="' + result + '" style="width:100%;">');
  609. });
  610. }
  611. });
  612. $('.isimgupload').hover(function(){
  613. if($("#upload-drag12:has(img.fmimages)").length>0){
  614. $('.imageDivs').show();
  615. }
  616. },function(){
  617. $('.imageDivs').hide();
  618. })
  619. $('.imageDivs').on('click', function(e) {
  620. var that = this;
  621. layer.confirm('确定删除该图片么?',{title: ['信息', 'color:#333333;background-color:#D8E6F1;'],}, function(index) {
  622. var imgDiv = $('#upload-drag12').find('img');
  623. imgDiv.remove();
  624. $('#video_img').val('');
  625. $('#upload-drag12').html('<div class="layui-upload-drag"><i class="layui-icon">&#xe681;</i><p>上传图片</p></div>');
  626. layer.close(index);
  627. });
  628. });
  629. });
  630. </script>
  631. {/block}