form.html 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. {extend name="layout:home" /}
  2. {block name="container"}
  3. <form class="layui-form" method="post" enctype="multipart/form-data" >
  4. <div class="layui-tab layui-tab-card">
  5. {include file="layout/admin_items" /}
  6. <div class="layui-tab-content page-tab-content">
  7. <div class="layui-tab-item layui-show ">
  8. <div class="layui-collapse">
  9. <div class="layui-colla-item">
  10. <h2 class="layui-colla-title">基本设置</h2>
  11. <div class="layui-colla-content layui-show">
  12. <div class="layui-form-item">
  13. <label class="layui-form-label">标题</label>
  14. <div class="layui-input-inline">
  15. <input type="text" class="layui-input field-name" name="product_title" id="product_title" value="{$product.product_title|default=''}" lay-verify="product_title" autocomplete="off" placeholder="{$Think.lang.ds_please_enter}标题" required />
  16. </div>
  17. </div>
  18. <div class="layui-form-item">
  19. <label class="layui-form-label">副标题</label>
  20. <div class="layui-input-inline">
  21. <input type="text" class="layui-input field-name" name="product_ctitle" id="product_ctitle" value="{$product.product_ctitle|default=''}" lay-verify="product_ctitle" autocomplete="off" placeholder="{$Think.lang.ds_please_enter}副标题" required />
  22. </div>
  23. </div>
  24. <div class="layui-form-item">
  25. <label class="layui-form-label">关键字</label>
  26. <div class="layui-input-inline">
  27. <input type="text" class="layui-input field-name" name="product_keywords" id="product_keywords" value="{$product.product_keywords|default=''}" lay-verify="product_keywords" autocomplete="off" placeholder="{$Think.lang.ds_please_enter}关键字" required />
  28. </div>
  29. </div>
  30. <div class="layui-form-item">
  31. <label class="layui-form-label">状态</label>
  32. <div class="layui-input-inline">
  33. <input type="checkbox" name="product_status" lay-skin="switch" lay-text="{$Think.lang.ds_yes}|{$Think.lang.ds_no}" value="1" {if condition="$product.product_status eq '1'"}checked{/if}>
  34. </div>
  35. </div>
  36. <div class="layui-form-item">
  37. <label class="layui-form-label">是否跳转</label>
  38. <div class="layui-input-inline">
  39. <input type="checkbox" name="product_isjump" lay-skin="switch" lay-text="{$Think.lang.ds_yes}|{$Think.lang.ds_no}" value="1" {if condition="$product.product_isjump eq '1'"}checked{/if}>
  40. </div>
  41. </div>
  42. </div>
  43. </div>
  44. <div class="layui-colla-item">
  45. <h2 class="layui-colla-title">详情内容</h2>
  46. <div class="layui-colla-content">
  47. <div class="layui-form-item">
  48. <label class="layui-form-label">{$Think.lang.product_content}</label>
  49. <div class="layui-input-block">
  50. {:build_editor(['name'=>'product_content','content'=>isset($product.product_content)?$product.product_content:''])}
  51. <textarea name="product_content" id="product_content" style="min-height:400px;"></textarea>
  52. </div>
  53. </div>
  54. <!-- <button type="button" class="layui-btn" id="upload_productpic"><i class="layui-icon"></i>{$Think.lang.ds_uploading_files}</button> -->
  55. <div class="selected_pic clearfix">
  56. <ul>
  57. {foreach name="pic_list" id="productpic"}
  58. <li id="{$productpic.pic_id}">
  59. <img src="{:get_product_img($productpic['pic_cover'])}"/>
  60. <i class="delect layui-icon" title="{$Think.lang.ds_insert_editor}" onclick="insert_editor('{:get_product_img($productpic['pic_cover'])}')">&#xe654;</i>
  61. <i class="insert layui-icon" title="{$Think.lang.ds_delete_picture}" onclick="del_productpic({$productpic.pic_id})">&#xe640;</i>
  62. </li>
  63. {/foreach}
  64. </ul>
  65. </div>
  66. </div>
  67. </div>
  68. </div>
  69. <div class="layui-form-item mt20">
  70. <div class="layui-input-inline">
  71. <input type="submit" class="layui-btn layui-btn-normal" lay-submit value="{:lang('ds_submit')}" />
  72. </div>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. </form>
  78. <script>
  79. layui.use('form', function () {
  80. var form = layui.form;
  81. });
  82. layui.use('element', function () {
  83. var element = layui.element;
  84. });
  85. layui.use('laydate', function(){
  86. var laydate = layui.laydate;
  87. laydate.render({
  88. elem: '#product_addtime'
  89. });
  90. });
  91. /**
  92. * 图片异步上传
  93. */
  94. layui.use('upload', function () {
  95. var $ = layui.jquery, upload = layui.upload;
  96. //指定允许上传的文件类型
  97. upload.render({
  98. elem: '#upload_productpic'
  99. , url: "{:url('pic/upload',['pic_type_id'=>$Request.param.product_id,'pic_type'=>$product_pic_type.pic_type])}"
  100. , accept: 'file' //普通文件
  101. , done: function (res) {
  102. add_uploadedfile(res);
  103. // console.log(res)
  104. }
  105. });
  106. });
  107. function add_uploadedfile(file_data)
  108. {
  109. var newImg = '<li id="' + file_data.file_id + '"><img src="' + file_data.file_url + '"/><i class="delect layui-icon" title="插入编辑器" onclick="insert_editor(\''+file_data.file_url+'\')">&#xe654;</i><i class="insert layui-icon" title="删除图片" onclick="del_productpic(' + file_data.file_id + ')">&#xe640;</i></li>'
  110. $('.selected_pic ul').prepend(newImg);
  111. }
  112. /**
  113. * 插入编辑器
  114. */
  115. function insert_editor(file_path){
  116. ue.execCommand('insertimage', {src:file_path});
  117. }
  118. function del_productpic(file_id)
  119. {
  120. layer.open({
  121. content: '{$Think.lang.ds_confirm_cancel}',
  122. yes: function(index, layero){
  123. $.getJSON("{:url('pic/del')}",{file_id: + file_id,pic_type:'product'}, function(result){
  124. if(result){
  125. $('#' + file_id).remove();
  126. layer.msg('{$Think.lang.del_succ}');
  127. layer.close(index);
  128. return;
  129. }else{
  130. layer.msg('{$Think.lang.del_fail}');
  131. layer.close(index);
  132. return;
  133. }
  134. });
  135. }
  136. });
  137. }
  138. </script>
  139. {/block}