editor.php 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. <div class="row content-nav">
  2. <div class="col-xs-12">
  3. <ul>
  4. <li><a href="javascript:;"><i></i>&nbsp;数据管理</a></li>
  5. <li><a href="javascript:;">编辑数据</a></li>
  6. </ul>
  7. </div>
  8. </div>
  9. <section class="content clearfix">
  10. <div class="layui-editor-box">
  11. <form action="" class="layui-form layui-form-pane">
  12. <div class="layui-tab layui-tab-brief layui-tab-bg layui-tab-content-box">
  13. <ul class="layui-tab-title">
  14. <li class="layui-this">基本信息</li>
  15. </ul>
  16. <div class="layui-tab-content">
  17. <div class="layui-tab-item layui-show">
  18. <div class="layui-form-item">
  19. <label class="layui-form-label">名称</label>
  20. <div class="layui-input-block">
  21. <input type="text" name="name" value="{$data.name|default=''}" lay-reqtext="请填写名称" lay-verify="required" placeholder="请输入名称" autocomplete="off" class="layui-input">
  22. </div>
  23. </div>
  24. <div class="layui-form-item">
  25. <label class="layui-form-label">标识</label>
  26. <div class="layui-input-block">
  27. <input type="text" name="sign" value="{$data.sign|default=''}" lay-reqtext="请填写标识" lay-verify="required" placeholder="请输入标识" autocomplete="off" class="layui-input">
  28. </div>
  29. </div>
  30. <div class="layui-form-item">
  31. <button id="add-table-btn" type="button" class="layui-btn layui-bg-light-blue">添加</button>
  32. </div>
  33. <div>
  34. <table class="layui-table">
  35. <colgroup>
  36. <col width="150">
  37. <col>
  38. <col>
  39. <col width="150">
  40. <col width="160">
  41. </colgroup>
  42. <thead>
  43. <tr>
  44. <th style="text-align:center">图片</th>
  45. <th style="text-align:center">名称</th>
  46. <th style="text-align:center">地址</th>
  47. <th style="text-align:center">类型</th>
  48. <th style="text-align:center">操作</th>
  49. </tr>
  50. </thead>
  51. <tbody>
  52. {if !empty($marketing)}
  53. {volist name="marketing" id="item"}
  54. <tr>
  55. <td>
  56. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm link-upload-btn">
  57. <i class="layui-icon layui-icon-upload"></i>
  58. </button>
  59. <div class="link-upload-image-box">
  60. <input type="hidden" name="marketing[id][]" value="{$item.id}">
  61. <input type="hidden" name="marketing[photo][]" value="{$item.photo}">
  62. <img class="layui-upload-img" src="{$item.photo|default='/static/images/default.jpg'}" style="max-width: 60px; max-height: 60px;" alt="">
  63. </div>
  64. </td>
  65. <td>
  66. <input type="text" name="marketing[name][]" value="{$item.name}" placeholder="请输入名称" autocomplete="off" class="layui-input">
  67. </td>
  68. <td>
  69. <input type="text" name="marketing[url][]" value="{$item.url}" placeholder="请输入地址" autocomplete="off" class="layui-input">
  70. </td>
  71. <td>
  72. <select name="marketing[target][]">
  73. <option value="0" {if $item.target == 0}selected{/if}>新窗口</option>
  74. <option value="1" {if $item.target == 1}selected{/if}>本窗口</option>
  75. </select>
  76. </td>
  77. <td>
  78. <div class="layui-btn-group">
  79. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-button-up"><i class="layui-icon layui-icon-up"></i></button>
  80. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-button-down"><i class="layui-icon layui-icon-down"></i></button>
  81. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-button-remove"><i class="layui-icon layui-icon-delete"></i></button>
  82. </div>
  83. </td>
  84. </tr>
  85. {/volist}
  86. {/if}
  87. </tbody>
  88. </table>
  89. </div>
  90. <div class="layui-form-item">
  91. <label class="layui-form-label">状态</label>
  92. <div class="layui-input-block">
  93. <input type="radio" name="status" title="开启" value="0" {if empty($data.status) || $data.status==0}checked="checked"{/if}>
  94. <input type="radio" name="status" title="关闭" value="1" {if isset($data.status) && $data.status==1}checked="checked"{/if}>
  95. </div>
  96. </div>
  97. </div>
  98. </div>
  99. <div class="layui-form-item">
  100. <div class="layui-input-block">
  101. <input name="id" type="hidden" value="{$data.id|default='0'}">
  102. <button class="layui-btn layui-bg-light-blue" lay-filter="layui-submit-filter" lay-submit="">立即提交</button>
  103. <button class="layui-btn layui-btn-primary" type="reset">重置</button>
  104. </div>
  105. </div>
  106. </div>
  107. </form>
  108. </div>
  109. </section>
  110. <div id="template-box" style="display: none;">
  111. <table>
  112. <tr>
  113. <td>
  114. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm link-upload-btn">
  115. <i class="layui-icon layui-icon-upload"></i>
  116. </button>
  117. <div class="link-upload-image-box">
  118. <input type="hidden" name="marketing[id][]" value="0">
  119. <input type="hidden" name="marketing[photo][]">
  120. <img class="layui-upload-img" src="/static/images/default.jpg" style="max-width: 60px; max-height: 60px;" alt="">
  121. </div>
  122. </td>
  123. <td>
  124. <input type="text" name="marketing[name][]" placeholder="请输入名称" autocomplete="off" class="layui-input">
  125. </td>
  126. <td>
  127. <input type="text" name="marketing[url][]" placeholder="请输入地址" autocomplete="off" class="layui-input">
  128. </td>
  129. <td>
  130. <select name="marketing[target][]">
  131. <option value="0">新窗口</option>
  132. <option value="1">本窗口</option>
  133. </select>
  134. </td>
  135. <td>
  136. <div class="layui-btn-group">
  137. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-button-up"><i class="layui-icon layui-icon-up"></i></button>
  138. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-button-down"><i class="layui-icon layui-icon-down"></i></button>
  139. <button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-button-remove"><i class="layui-icon layui-icon-delete"></i></button>
  140. </div>
  141. </td>
  142. </tr>
  143. </table>
  144. </div>
  145. <script type="text/javascript">
  146. function photo(array){
  147. var pt = $(".link-upload-btn.active").parent();
  148. $(".link-upload-image-box input",pt).val(array[0]);
  149. $(".link-upload-image-box img",pt).attr("src",array[0]);
  150. layui.layer.closeAll();
  151. }
  152. layui.use(["form", "element",'layer','upload'], function () {
  153. var form = layui.form;
  154. var layer = layui.layer;
  155. var upload = layui.upload;
  156. $(document).on("click",".link-upload-btn",function (){
  157. $(".link-upload-btn").removeClass("active");
  158. $(this).addClass("active");
  159. layer.open({
  160. type: 2,
  161. title: '图库列表',
  162. shadeClose: true,
  163. shade: 0.3,
  164. area: ['1100px', '600px'],
  165. content: '{:createUrl("common.material/index",["type"=>"image","callback"=>"photo","module"=>"marketing","method"=>""])}'
  166. });
  167. });
  168. $("#add-table-btn").on("click",function (){
  169. var tr = $("#template-box tr:first").clone();
  170. $(".layui-table tbody").append(tr);
  171. form.render('select');
  172. });
  173. if($(".layui-table tbody tr").length == 0){
  174. $("#add-table-btn").trigger("click");
  175. }
  176. $(document).on("click",".layui-button-remove",function (){
  177. if($(".layui-table tbody tr").length > 1){
  178. $(this).parent().parent().parent().remove();
  179. }
  180. return false;
  181. });
  182. $(document).on("click", ".layui-button-down", function() {
  183. var current_tr = $(this).parent().parent().parent();
  184. current_tr.insertAfter(current_tr.next());
  185. });
  186. $(document).on("click", ".layui-button-up", function() {
  187. var current_tr = $(this).parent().parent().parent();
  188. if (current_tr.prev().html() != null) {
  189. current_tr.insertBefore(current_tr.prev());
  190. }
  191. });
  192. form.on('submit(layui-submit-filter)', function (data) {
  193. var index = layer.load(1, { shade: [0.2,'#fff'] });
  194. $.post('{:createUrl("editor")}', data.field, function (result) {
  195. layer.close(index);
  196. if(result.code){
  197. layer.msg(result.msg, {
  198. time: 0
  199. ,btn: ['继续发布', '返回列表']
  200. ,yes: function(index){
  201. window.location.href = '{:createUrl("editor")}';
  202. }
  203. ,btn2: function (index, layero){
  204. window.location.href = '{:createUrl("index")}';
  205. }
  206. });
  207. }else{
  208. layer.msg(result.msg,{ icon :2 });
  209. }
  210. }, "json");
  211. return false;
  212. });
  213. });
  214. </script>