form.html 6.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. <div class="layui-fluid">
  2. <div class="layui-row layui-col-space15">
  3. <div class="layui-col-md12">
  4. <div class="layui-card">
  5. <div class="layui-card-header">活动信息</div>
  6. <div class="layui-card-body" pad15>
  7. <div class="layui-form layui-form-pane" lay-filter="LAY-activity-form">
  8. <input type="hidden" name="id" value="{$info.id}">
  9. <div class="layui-form-item">
  10. <label class="layui-form-label"><span style="color:#f90c05;">*</span>标题</label>
  11. <div class="layui-input-block">
  12. <input type="text" name="title" value="{$info.title}" lay-verify="required" placeholder="请输入标题" autocomplete="off"
  13. class="layui-input">
  14. </div>
  15. </div>
  16. <div class="layui-form-item">
  17. <label class="layui-form-label">主图</label>
  18. <div class="layui-input-block">
  19. <div class="layui-upload">
  20. <button type="button" class="layui-btn attachment-upload-images" data-input="main_image" data-amount="1">上传图片</button>
  21. <div class="layui-inline layui-word-aux"> 尺寸建议:560px*300px</div>
  22. <div class="layui-upload-list echo-attachment-image-list" id="main_image">
  23. {notempty name="info.main_image"}
  24. <div>
  25. <input type="hidden" name="main_image" value="{$info.main_image}">
  26. <img src="{$info.main_image}">
  27. <button type="button" class="attachmentdel layui-btn layui-btn-primary layui-btn-xs layui-btn-fluid">删除</button>
  28. </div>
  29. {/notempty}
  30. </div>
  31. </div>
  32. </div>
  33. </div>
  34. <div class="layui-form-item">
  35. <label class="layui-form-label"><span style="color:#f90c05;">*</span>内容</label>
  36. <div class="layui-input-block">
  37. <textarea class="layui-textarea" name="content" id="content" placeholder="请输入详情" style="display: none"
  38. lay-verify="editcontent">
  39. {$info.content}
  40. </textarea>
  41. </div>
  42. </div>
  43. <div class="layui-form-item">
  44. <label class="layui-form-label"><span style="color:#f90c05;">*</span>活动地点</label>
  45. <div class="layui-input-block">
  46. <input type="text" name="address" value="{$info.address}" lay-verify="required" placeholder="请输入活动地点" autocomplete="off"
  47. class="layui-input">
  48. </div>
  49. </div>
  50. <div class="layui-form-item">
  51. <label class="layui-form-label"><span style="color:#f90c05;">*</span>开始时间</label>
  52. <div class="layui-input-block">
  53. <input type="text" name="start_time" id="start_time" value="{$info.start_time}" lay-verify="required"
  54. placeholder="请选择活动开始时间" autocomplete="off" class="layui-input">
  55. </div>
  56. </div>
  57. <div class="layui-form-item">
  58. <label class="layui-form-label"><span style="color:#f90c05;">*</span>排序</label>
  59. <div class="layui-input-block">
  60. <input type="text" name="priority" value="{$info.priority|default=255}" lay-verify="required" placeholder="请输入排序值(倒序,值越大越靠前)"
  61. autocomplete="off" class="layui-input">
  62. <div class="layui-form-mid layui-word-aux">倒序,值越大越靠前</div>
  63. </div>
  64. </div>
  65. <div class="layui-form-item" pane>
  66. <label class="layui-form-label">状态</label>
  67. <div class="layui-input-block">
  68. <input type="checkbox" lay-filter="switch" name="status" {eq name="info.status|default=1" value="1" }checked{/eq}
  69. lay-skin="switch" lay-text="显示|隐藏" value="1" />
  70. </div>
  71. </div>
  72. <div class="layui-form-item">
  73. <div class="layui-input-block">
  74. <input type="button" lay-submit lay-filter="LAY-activity-form-submit" value="确认提交" class="layui-btn">
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. </div>
  80. </div>
  81. </div>
  82. </div>
  83. <script>
  84. layui.config({
  85. base: '/static/echoui/' //静态资源所在路径
  86. }).extend({
  87. index: 'lib/index' //主入口模块
  88. }).use(['index', 'form', 'set','layedit','laydate', 'upload'], function() {
  89. var $ = layui.$,
  90. setter = layui.setter,
  91. admin = layui.admin,
  92. form = layui.form,
  93. layedit = layui.layedit,
  94. laydate = layui.laydate,
  95. upload = layui.upload;
  96. form.render();
  97. var details = layedit.build('content', {
  98. uploadImage: { url: setter.baseAdminUrl + 'attachment/tplfieldimage', type: 'post' }
  99. });
  100. form.verify({
  101. editcontent: function(value) {
  102. layedit.sync(details);
  103. }
  104. });
  105. laydate.render({
  106. elem: '#start_time',
  107. type: 'datetime'
  108. });
  109. form.on('submit(LAY-activity-form-submit)', function(obj) {
  110. var index = parent.layer.getFrameIndex(window.name);
  111. admin.req({
  112. url: setter.baseAdminUrl + 'activity/edit',
  113. data: obj.field,
  114. done: function(res) {
  115. layer.msg("提交成功", {
  116. icon: 1
  117. });
  118. parent.layui.table.reload('LAY-activity-index-table'); //重载表格
  119. parent.layer.close(index);
  120. }
  121. });
  122. });
  123. $('.echo-attachment-image-list').on('click', '.attachmentdel', function() {
  124. $(this).parent().remove();
  125. });
  126. upload.render({
  127. elem: '.attachment-upload-images',
  128. url: setter.baseAdminUrl + 'attachment/tplfieldimage',
  129. accept: 'images',
  130. exits: 'jpg|png|jpeg',
  131. acceptMime: 'image/*',
  132. size: 2048,
  133. number: 1,
  134. method: 'post',
  135. before: function(obj) {
  136. var item = this.item;
  137. upload_input = $(item).data('input');
  138. upload_amount = $(item).data('amount');
  139. layer.load();
  140. },
  141. done: function(res, index, upload) {
  142. layer.closeAll('loading');
  143. var html = "";
  144. if (upload_amount == 1) {
  145. html += '<div> <input type="hidden" name="' + upload_input + '" value="' + res.data.src + '"> ';
  146. html += '<img src="' + res.data.src + '"><button type="button" class="attachmentdel layui-btn layui-btn-primary layui-btn-xs layui-btn-fluid">删除</button></div>';
  147. $("#" + upload_input).html(html);
  148. } else {
  149. html += '<div> <input type="hidden" name="' + upload_input + '[]" value="' + res.data.src + '"> ';
  150. html += '<img src="' + res.data.src +
  151. '"> <button type="button" class="attachmentdel layui-btn layui-btn-primary layui-btn-xs layui-btn-fluid">删除</button></div>';
  152. $("#" + upload_input).append(html);
  153. }
  154. },
  155. error: function(index, upload) {
  156. layer.closeAll('loading');
  157. }
  158. });
  159. });
  160. </script>