1
0

class_edit.html 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. {extend name="public/layout" /} {block name="title"}新增讲师{/block} {block name="body"}
  2. <link rel="stylesheet" href="__STATIC__/css/csspc.css">
  3. <style type="text/css">
  4. html {
  5. background: #fff;
  6. min-width: 600px;
  7. }
  8. .addlistli .layui-form-label{width:160px;}
  9. .addlistli .layui-input-inline{width:520px;}
  10. .addlistli .layui-form-select{width: 100%;}
  11. </style>
  12. <body>
  13. <form class="layui-form" lay-filter="layuiadmin-app-form-list" id="layuiadmin-app-form-list">
  14. <div class="layui-form-item mdt20 addlistli">
  15. <label class="layui-form-label"><i style="color:red;">*&nbsp;</i>讲师名称 :</label>
  16. <div class="layui-input-inline">
  17. <input type="text" name="name" lay-verify="required" value="{$data.name}" placeholder="请输入讲师名称" autocomplete="off" class="layui-input">
  18. </div>
  19. </div>
  20. <div class="layui-form-item mdt20 addlistli">
  21. <label class="layui-form-label"><i style="color:red;">*&nbsp;</i>讲师所属企业 :</label>
  22. <div class="layui-input-inline">
  23. <select class="width100_" name="lecturer_company_id" id="label" lay-verify="required" lay-filter="type" lay-search>
  24. <option value=0>请选择讲师所属企业</option>
  25. {volist name="type" id='v'}
  26. <option value="{$v.id}" {if condition="$data.lecturer_company_id eq $v.id"}selected{/if}>{$v.name}</option>
  27. {/volist}
  28. </select>
  29. </div>
  30. </div>
  31. <div class="layui-form-item mdt20 addlistli">
  32. <label class="layui-form-label"><i style="color:red;">*&nbsp;</i>主讲类型 :</label>
  33. <div class="layui-input-inline">
  34. <input type="text" name="speaker_type" lay-verify="required" value="{$data.speaker_type}" placeholder="营销学、客服培训" autocomplete="off" class="layui-input">
  35. </div>
  36. </div>
  37. <div class="layui-form-item mdt20 addlistli">
  38. <label class="layui-form-label"><i style="color:red;">*&nbsp;</i>职位 :</label>
  39. <div class="layui-input-inline">
  40. <input type="text" name="position" lay-verify="required" value="{$data.position}" placeholder="首席讲师" autocomplete="off" class="layui-input">
  41. </div>
  42. </div>
  43. <div class="layui-form-item mdt20 addlistli">
  44. <label class="layui-form-label"><span style="color: red;">*</span>形象照 :</label>
  45. <div class="layui-input-inline" id="upload-drag0">
  46. {if condition="$data.photo"}
  47. <img src="{$data.photo}" width="383px" height="114px">
  48. {else /}
  49. <div class="layui-upload-drag">
  50. <i class="layui-icon">&#xe681;</i>
  51. <p>选择形象照图片</p>
  52. </div>
  53. {/if}
  54. </div>
  55. <div class="clear"></div>
  56. <div class="mdl130 mdt10">
  57. <i style="color: #FF5722;">* </i>建议上传图片宽高比例3:4,图片大小不超过1M
  58. </div>
  59. </div>
  60. <div class="layui-form-item mdt20 addlistli">
  61. <label class="layui-form-label"><span style="color: red;">*</span>宣传海报 :</label>
  62. <div class="layui-input-inline" id="upload-drag1">
  63. {if condition="$data.poster"}
  64. <img src="{$data.poster}" width="383px" height="114px">
  65. {else /}
  66. <div class="layui-upload-drag">
  67. <i class="layui-icon">&#xe681;</i>
  68. <p>选择宣传海报图片</p>
  69. </div>
  70. {/if}
  71. </div>
  72. <div class="clear"></div>
  73. <div class="mdl130 mdt10">
  74. <i style="color: #FF5722;">* </i>建议上传图片宽高比例5:3,图片大小不超过1M
  75. </div>
  76. </div>
  77. <div class="layui-form-item mdt20 addlistli">
  78. <label class="layui-form-label"><i style="color:red;">*&nbsp;</i>简介 :</label>
  79. <div class="layui-col-md6 layui-col-xs6 layui-col-sm6 width75_">
  80. <textarea name="introduce" id="content" autocomplete="off" class="width100_ pdtb15 pdlr15" style="height: 200px;border: 1px solid #e6e6e6 !important;">{$data.introduce}</textarea>
  81. </div>
  82. </div>
  83. <div class="layui-form-item mdt50 mdb30 addlistli">
  84. <input type="button" lay-submit class="layui-btn layui-btn-normal width20_ wright mdr06_" lay-filter="activity-submit" id="live_submit" value="确认添加">
  85. </div>
  86. <input type="hidden" name="id" value="{$data.id}">
  87. </form>
  88. </body>
  89. {/block} {block name="js"}
  90. <script>
  91. layui.config({
  92. base: '__LAYUI__/',
  93. urlbase: '/sys'
  94. }).extend({
  95. index: 'lib/index' //主入口模块
  96. }).use(['index', 'form', 'upload'], function () {
  97. var form = layui.form,
  98. upload = layui.upload,
  99. $ = layui.jquery;
  100. form.render();
  101. /* 监听提交 */
  102. form.on('submit(activity-submit)', function (obj) {
  103. var index = parent.layer.getFrameIndex(window.name);
  104. var formData = new FormData(obj.form);
  105. var photo = '';
  106. var poster = '';
  107. formData.forEach((value, key) => {
  108. if (key == 'photo') {
  109. if(value.name){
  110. photo = value;
  111. }else{
  112. formData.set("photo", '{$data.photo}');
  113. }
  114. }
  115. if (key == 'poster') {
  116. if(value.name){
  117. poster = value;
  118. }else{
  119. formData.set("poster", '{$data.poster}');
  120. }
  121. }
  122. })
  123. if (photo.name == '') {
  124. layer.msg('请选择讲师形象照', {
  125. anim: 6
  126. , time: 2000
  127. });
  128. return false;
  129. }
  130. if (poster.name == '') {
  131. layer.msg('请选择宣传海报', {
  132. anim: 6
  133. , time: 2000
  134. });
  135. return false;
  136. }
  137. // 单击之后提交按钮不可选,防止重复提交
  138. $.ajax({
  139. url: '{:url("lecturer/classEditSave")}',
  140. type: 'post',
  141. data: formData,
  142. dataType: 'json',
  143. processData: false,
  144. contentType: false,
  145. success: function (res) {
  146. if (res.code === 0) {
  147. var DISABLED = 'layui-btn-disabled';
  148. var target = '#activity-submit';
  149. $(target).addClass(DISABLED);
  150. $(target).attr('disabled', 'disabled');
  151. layer.msg(res.msg, {
  152. anim: 0
  153. , time: 2000
  154. }, function () {
  155. parent.layui.table.reload('company-activity'); //重载表格
  156. parent.layer.close(index); //再执行关闭
  157. });
  158. } else {
  159. layer.msg(res.msg, {
  160. anim: 6
  161. , time: 2000
  162. });
  163. }
  164. }
  165. });
  166. return false;
  167. });
  168. //拖拽上传
  169. upload.render({
  170. elem: '#upload-drag0',
  171. accept: 'image',
  172. exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
  173. auto: false,
  174. field: 'photo',
  175. size: 1 * 1024,
  176. choose: function (obj) {
  177. obj.preview(function (index, file, result) {
  178. $('#upload-drag0').html('<img src="' + result + '" style="width:355px !important;height:160px !important;">');
  179. });
  180. }
  181. });
  182. //拖拽上传
  183. upload.render({
  184. elem: '#upload-drag1',
  185. accept: 'image',
  186. exts: 'jpg|png|bmp|jpeg|JPG|PNG|BMP|JPEG',
  187. auto: false,
  188. field: 'poster',
  189. size: 1 * 1024,
  190. choose: function (obj) {
  191. obj.preview(function (index, file, result) {
  192. $('#upload-drag1').html('<img src="' + result + '" style="width: 355px !important;height:160px !important;">');
  193. });
  194. }
  195. });
  196. });
  197. </script>
  198. {/block}