slideform.html 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  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-set-slideform-edit">
  8. <input type="hidden" name="id" value="{$slide.id}">
  9. <input type="hidden" name="pagetab" value="woman">
  10. <div class="layui-form-item">
  11. <label class="layui-form-label">标题</label>
  12. <div class="layui-input-block">
  13. <input type="text" name="title" value="{$slide.title}" lay-verify="required" placeholder="请输入标题" autocomplete="off"
  14. class="layui-input">
  15. </div>
  16. </div>
  17. <div class="layui-form-item">
  18. <label class="layui-form-label">标图</label>
  19. <div class="layui-input-block">
  20. <div class="layui-upload">
  21. <button type="button" class="layui-btn attachment-upload-images" data-input="tilpic" data-amount="1">上传图片</button>
  22. <div class="layui-inline layui-word-aux"> 最佳尺寸:750px*280px </div>
  23. <div class="layui-upload-list echo-attachment-image-list" id="tilpic">
  24. {notempty name="slide.tilpic"}
  25. <div>
  26. <input type="hidden" name="tilpic" value="{$slide.tilpic}">
  27. <img src="{$slide.tilpic}">
  28. </div>
  29. {/notempty}
  30. </div>
  31. </div>
  32. </div>
  33. </div>
  34. <div class="layui-form-item" pane>
  35. <label class="layui-form-label">链接类型</label>
  36. <div class="layui-input-block">
  37. <input type="radio" name="stype" value="1" title="系统链接" {eq name="slide.stype|default=1" value="1" }checked{/eq} />
  38. <input type="radio" name="stype" value="2" title="网络链接" {eq name="slide.stype" value="2" }checked{/eq} />
  39. </div>
  40. </div>
  41. <div class="layui-form-item">
  42. <label class="layui-form-label">跳转链接</label>
  43. <div class="layui-input-block">
  44. <input type="text" name="tilurl" value="{$slide.tilurl}" lay-verify="required" placeholder="请输入跳转链接"
  45. autocomplete="off" class="layui-input">
  46. <div class="layui-form-mid layui-word-aux">
  47. <b>系统链接:</b>通过系统各栏目复制的链接,以“/pages/”开头;
  48. <b>网络链接:</b>普通的url链接,以“http://”或“https://”开头。
  49. </div>
  50. </div>
  51. </div>
  52. <div class="layui-form-item">
  53. <label class="layui-form-label">排序</label>
  54. <div class="layui-input-block">
  55. <input type="text" name="priority" value="{$slide.priority|default=0}" lay-verify="required" placeholder="请输入排序值(倒序,值越大越靠前)"
  56. autocomplete="off" class="layui-input">
  57. <div class="layui-form-mid layui-word-aux">倒序,值越大越靠前</div>
  58. </div>
  59. </div>
  60. <div class="layui-form-item">
  61. <div class="layui-input-block">
  62. <input type="button" lay-submit lay-filter="LAY-set-slideform-edit-submit" value="确认提交" class="layui-btn">
  63. </div>
  64. </div>
  65. </div>
  66. </div>
  67. </div>
  68. </div>
  69. </div>
  70. </div>
  71. <script>
  72. layui.config({
  73. base: '/static/echoui/' //静态资源所在路径
  74. }).extend({
  75. index: 'lib/index' //主入口模块
  76. }).use(['index', 'form', 'set', 'upload'], function() {
  77. var $ = layui.$,
  78. setter = layui.setter,
  79. admin = layui.admin,
  80. form = layui.form,
  81. upload = layui.upload;
  82. form.render();
  83. form.on('submit(LAY-set-slideform-edit-submit)', function(obj) {
  84. var index = parent.layer.getFrameIndex(window.name);
  85. admin.req({
  86. url: setter.baseAdminUrl + 'slide/editslide',
  87. data: obj.field,
  88. done: function(res) {
  89. layer.msg("提交成功", { icon: 1 });
  90. parent.layui.table.reload('LAY-set-slidelist-table'); //重载表格
  91. parent.layer.close(index);
  92. }
  93. });
  94. });
  95. $('.echo-attachment-image-list').on('click', '.attachmentdel', function() {
  96. $(this).parent().remove();
  97. });
  98. upload.render({
  99. elem: '.attachment-upload-images',
  100. url: setter.baseAdminUrl + 'attachment/tplfieldimage',
  101. accept: 'images',
  102. exits: 'jpg|png|jpeg',
  103. acceptMime: 'image/*',
  104. size: 2048,
  105. number: 1,
  106. method: 'post',
  107. before: function(obj) {
  108. var item = this.item;
  109. upload_input = $(item).data('input');
  110. upload_amount = $(item).data('amount');
  111. layer.load();
  112. },
  113. done: function(res, index, upload) {
  114. layer.closeAll('loading');
  115. var html = "";
  116. if (upload_amount == 1) {
  117. html += '<div> <input type="hidden" name="' + upload_input + '" value="' + res.data.src + '"> ';
  118. html += '<img src="' + res.data.src + '"></div>';
  119. $("#" + upload_input).html(html);
  120. } else {
  121. html += '<div> <input type="hidden" name="' + upload_input + '[]" value="' + res.data.src + '"> ';
  122. html += '<img src="' + res.data.src +
  123. '"> <button type="button" class="attachmentdel layui-btn layui-btn-primary layui-btn-xs layui-btn-fluid">删除</button></div>';
  124. $("#" + upload_input).append(html);
  125. }
  126. },
  127. error: function(index, upload) {
  128. layer.closeAll('loading');
  129. }
  130. });
  131. });
  132. </script>