edit.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>商品编辑</title>
  6. <meta name="renderer" content="webkit">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport"
  9. content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  10. <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
  11. <link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
  12. <link rel="stylesheet" type="text/css" href="../../layuiadmin/style/formSelects-v4.css"/>
  13. </head>
  14. <body>
  15. <div class="layui-fluid">
  16. <div class="layui-row layui-col-space15">
  17. <div class="layui-col-md6">
  18. <div class="layui-card">
  19. <div class="layui-card-body">
  20. <form class="layui-form" action="" lay-filter="component-form-element">
  21. <div class="layui-form-item">
  22. <label class="layui-form-label"><font color='red' size="4">*</font>名称:</label>
  23. <div class="layui-input-block">
  24. <input type="text" name="name" lay-verify="required" placeholder="请输入名称" autocomplete="off" class="layui-input">
  25. </div>
  26. </div>
  27. <div class="layui-form-item">
  28. <div class="layui-form-item">
  29. <label class="layui-form-label"><font color='red' size="4">*</font>商品类别:</label>
  30. <div class="layui-input-block">
  31. <select id="id_category" name="category" lay-verify="required">
  32. <option value="">请选择商品类别</option>
  33. </select>
  34. </div>
  35. </div>
  36. </div>
  37. <div class="layui-form-item">
  38. <div class="layui-form-item">
  39. <label class="layui-form-label"><font color='red' size="4">*</font>价格类型:</label>
  40. <div class="layui-input-block">
  41. <select id="id_type" name="type" lay-filter="id_type">
  42. <option value="1" selected>现金商品</option>
  43. <option value="2">积分商品</option>
  44. </select>
  45. </div>
  46. </div>
  47. </div>
  48. <div class="layui-form-item" id="price_item">
  49. <label class="layui-form-label"><font color='red' size="4">*</font>销售价格:</label>
  50. <div class="layui-input-block">
  51. <input type="text" id="id_price" name="price" lay-verify="numberGtZ|required" placeholder="请输入原销售价" autocomplete="off" class="layui-input">
  52. </div>
  53. </div>
  54. <div class="layui-form-item" id="vip_price_item">
  55. <label class="layui-form-label"><font color='red' size="4">*</font>会员价格:</label>
  56. <div class="layui-input-block">
  57. <input type="text" id="id_vip_price" name="vip_price" lay-verify="numberGtZ|required" placeholder="请输入销售限价折扣" autocomplete="off" class="layui-input">
  58. </div>
  59. </div>
  60. <div class="layui-form-item" id="point_price_item" hidden>
  61. <label class="layui-form-label"><font color='red' size="4">*</font>积分价格:</label>
  62. <div class="layui-input-block">
  63. <input type="text" id="id_point_price" name="point_price" lay-verify="intGtz" placeholder="请输入销售限价折扣" autocomplete="off" class="layui-input">
  64. </div>
  65. </div>
  66. <div class="layui-form-item">
  67. <label class="layui-form-label">起始销量:</label>
  68. <div class="layui-input-block">
  69. <input type="text" name="initial_sale_count" lay-verify="intGtz|required" placeholder="请输入" value="0" class="layui-input">
  70. </div>
  71. </div>
  72. <div class="layui-form-item">
  73. <label class="layui-form-label">排序:</label>
  74. <div class="layui-input-block">
  75. <input type="text" name="sort" lay-verify="intGtz|required" placeholder="请输入排序" value="0" class="layui-input">
  76. <div class="layui-word-aux">越大越靠后。</div>
  77. </div>
  78. </div>
  79. <div class="layui-form-item">
  80. <label class="layui-form-label"><font color='red' size="4">*</font>是否上架:</label>
  81. <div class="layui-input-block">
  82. <input type="checkbox" name="status" lay-skin="switch" lay-text="是|否" checked="" value="1">
  83. </div>
  84. </div>
  85. <div class="layui-form-item">
  86. <label class="layui-form-label">备注:</label>
  87. <div class="layui-input-block">
  88. <textarea type="text" name="notes" class="layui-textarea" placeholder="请输入备注"></textarea>
  89. </div>
  90. </div>
  91. <button class="layui-btn" id="id_save" lay-submit lay-filter="component-form-element" style="display: none">保存</button>
  92. </form>
  93. </div>
  94. </div>
  95. </div>
  96. </div>
  97. </div>
  98. <script src="../../layuiadmin/layui/layui.js"></script>
  99. <script>
  100. layui.config({
  101. base: '../../../layuiadmin/' //静态资源所在路径
  102. }).extend({
  103. index: 'lib/index',
  104. formSelects: 'formSelects-v4',
  105. }).use(['index', 'form', 'utils', 'formSelects', ], function () {
  106. var $ = layui.$
  107. , admin = layui.admin
  108. , form = layui.form;
  109. form.on('select(id_type)', function(data){
  110. var val = data.value;
  111. var price = '';
  112. var vip_price = '';
  113. var point_price = '';
  114. if (editdata) {
  115. if (editdata.type === 1) {
  116. price = editdata.price;
  117. vip_price = editdata.price;
  118. } else if (editdata.type === 2) {
  119. point_price = editdata.point_price;
  120. }
  121. }
  122. if (val === '1') {
  123. $('#vip_price_item').show();
  124. $('#id_vip_price').val(vip_price);
  125. $('#id_vip_price').attr('lay-verify', 'numberGtZ|required');
  126. $('#price_item').show();
  127. $('#id_price').val(price);
  128. $('#id_price').attr('lay-verify', 'numberGtZ|required');
  129. $('#point_price_item').hide();
  130. $('#id_point_price').val('');
  131. $('#id_point_price').attr('lay-verify', 'intGtz');
  132. } else if (val === '2') {
  133. $('#point_price_item').show();
  134. $('#id_point_price').attr('lay-verify', 'intGtz|required');
  135. $('#id_point_price').val(point_price);
  136. $('#vip_price_item').hide();
  137. $('#id_vip_price').val('');
  138. $('#id_vip_price').attr('lay-verify', 'numberGeZ');
  139. $('#price_item').hide();
  140. $('#id_price').val('');
  141. $('#id_price').attr('lay-verify', 'numberGeZ');
  142. }
  143. });
  144. var id = layui.view.getParameterByName('id');
  145. admin.req({
  146. url: '/commodity/dict/',
  147. done: function (res) {
  148. var commodity_categorys = res.data.category;
  149. var category = $('#id_category');
  150. for (var i in commodity_categorys) {
  151. var pid1 = commodity_categorys[i].value;
  152. var name1 = commodity_categorys[i].name;
  153. category.append("<option value='" + pid1 + "'>" + name1 + "</option>");
  154. }
  155. form.val("component-form-element", editdata);
  156. }
  157. });
  158. form.render(null, 'component-form-element');
  159. if (id) {
  160. var editdata = JSON.parse(JSON.stringify(parent.layui.table.editdata)); // 框架有Bug所以这么转换
  161. form.val("component-form-element", editdata);
  162. if (editdata.type === 1) {
  163. $('#vip_price_item').show();
  164. $('#id_vip_price').attr('lay-verify', 'numberGtZ|required');
  165. $('#price_item').show();
  166. $('#id_price').attr('lay-verify', 'numberGtZ|required');
  167. $('#point_price_item').hide();
  168. $('#id_point_price').val('');
  169. $('#id_point_price').attr('lay-verify', 'intGtz');
  170. } else if (editdata.type === 2) {
  171. $('#point_price_item').show();
  172. $('#id_point_price').attr('lay-verify', 'intGtz|required');
  173. $('#vip_price_item').hide();
  174. $('#id_vip_price').val('');
  175. $('#id_vip_price').attr('lay-verify', 'numberGeZ');
  176. $('#price_item').hide();
  177. $('#id_price').val('');
  178. $('#id_price').attr('lay-verify', 'numberGeZ');
  179. }
  180. }
  181. var url = id ? '/commodity/' + id + '/' : '/commodity/',
  182. method = id ? 'put' : 'post';
  183. form.on('submit(component-form-element)', function (data) {
  184. if(!data.field.status){
  185. data.field.status = '0'
  186. }
  187. admin.req({
  188. url: url
  189. , data: data.field
  190. , type: method
  191. , done: function (res) {
  192. parent.layui.onSubmitChild(res);
  193. }
  194. });
  195. return false;
  196. });
  197. parent.layui.submitChild = function () {
  198. $("#id_save").click();
  199. };
  200. });
  201. </script>
  202. </body>
  203. </html>