edit.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304
  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" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  9. <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
  10. <link rel="stylesheet" href="../../layuiadmin/style/admin.css" media="all">
  11. <link rel="stylesheet" type="text/css" href="../../layuiadmin/style/formSelects-v4.css"/>
  12. <link rel="stylesheet" type="text/css" href="../../layuiadmin/layui/ueditor/themes/default/css/umeditor.css"/>
  13. <script type="text/javascript" src="../../layuiadmin/layui/ueditor/third-party/jquery.min.js"></script>
  14. <script type="text/javascript" charset="utf-8" src="../../layuiadmin/layui/ueditor/umeditor.config.js"></script>
  15. <script type="text/javascript" charset="utf-8" src="../../layuiadmin/layui/ueditor/umeditor.js"></script>
  16. <script type="text/javascript" src="../../layuiadmin/layui/ueditor/lang/zh-cn/zh-cn.js"></script>
  17. <style>
  18. .xm-select-parent .xm-form-selected dl {
  19. height: 160px;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24. <div class="layui-fluid">
  25. <div class="layui-card">
  26. <div class="layui-card-body" pad15>
  27. <form class="layui-form" action="" lay-filter="component-form-element">
  28. <div class="layui-row layui-col-space10 layui-form-item">
  29. <div>
  30. <label class="layui-form-label"><font color='red' size="4">*</font>车系:</label>
  31. <div class="layui-input-block">
  32. <input id="id_series" name="series" class="layui-input" autocomplete="off" lay-verify="required"/>
  33. </div>
  34. </div>
  35. <div>
  36. <label class="layui-form-label"><font color='red' size="4">*</font>名称:</label>
  37. <div class="layui-input-block">
  38. <input type="text" name="name" lay-verify="required" placeholder="请输入名称" autocomplete="off" class="layui-input">
  39. </div>
  40. </div>
  41. <div>
  42. <label class="layui-form-label"><font color='red' size="4">*</font>定金:</label>
  43. <div class="layui-input-block">
  44. <input type="text" name="advance_pay_show" placeholder="请输入定金" lay-verify="required|numberGtZ" autocomplete="off" class="layui-input">
  45. </div>
  46. </div>
  47. <div>
  48. <label class="layui-form-label"><font color='red' size="4">*</font>顶现金额:</label>
  49. <div class="layui-input-block">
  50. <input type="text" name="equal_pay_show" placeholder="请输入顶现金额" lay-verify="required|numberGtZ" autocomplete="off" class="layui-input">
  51. </div>
  52. </div>
  53. <div>
  54. <label class="layui-form-label"><font color='red' size="4">*</font>指导价:</label>
  55. <div class="layui-input-block">
  56. <input type="text" name="price_show" lay-verify="required|numberGtZ" placeholder="请输入指导价" autocomplete="off" class="layui-input">
  57. </div>
  58. </div>
  59. <div>
  60. <label class="layui-form-label"><font color='red' size="4">*</font>本店价格:</label>
  61. <div class="layui-input-block">
  62. <input type="text" name="shop_price_show" lay-verify="required|numberGtZ" placeholder="请输入本店价格" autocomplete="off" class="layui-input">
  63. </div>
  64. </div>
  65. <div>
  66. <label class="layui-form-label">车型标签:</label>
  67. <div class="layui-input-block">
  68. <select name="tags" xm-select="manager_tags"></select>
  69. </div>
  70. </div>
  71. <div>
  72. <label class="layui-form-label">提成金额:</label>
  73. <div class="layui-input-block">
  74. <input type="text" name="commission_amount" placeholder="请输入提成金额" lay-verify="numberGeZ" autocomplete="off" class="layui-input">
  75. <div class="layui-word-aux" ><span style="color: red;">佣金=提成金额</span></div>
  76. </div>
  77. </div>
  78. <div>
  79. <label class="layui-form-label">排序:</label>
  80. <div class="layui-input-block">
  81. <input type="text" name="sort" placeholder="请输入排序" lay-verify="numberGez" autocomplete="off" class="layui-input">
  82. </div>
  83. </div>
  84. <div >
  85. <label class="layui-form-label">在用:</label>
  86. <div class="layui-input-block">
  87. <input type="checkbox" name="enabled" lay-skin="switch" lay-text="是|否" checked="" value="1">
  88. </div>
  89. </div>
  90. <div >
  91. <label class="layui-form-label">热门:</label>
  92. <div class="layui-input-block">
  93. <input id="id_checked" type="checkbox" name="is_hot" lay-skin="switch" lay-text="是|否" checked="">
  94. </div>
  95. </div>
  96. <div>
  97. <label class="layui-form-label"><font color='red' size="4">*</font>车型介绍:</label>
  98. <div class="layui-input-block">
  99. <script type="text/plain" id="myEditor"></script>
  100. </div>
  101. </div>
  102. <div>
  103. <label class="layui-form-label">备注:</label>
  104. <div class="layui-input-block">
  105. <input type="text" name="notes" placeholder="请输入备注" autocomplete="off" class="layui-input">
  106. </div>
  107. </div>
  108. <div>
  109. <label class="layui-form-label"><font color='red' size="4">*</font>车型图片:</label>
  110. <div class="layui-input-block">
  111. <button type="button" class="layui-btn-sm" id="test1">上传图片</button><br><br>
  112. <img class="layui-upload-img" id="demo1" style="max-width: 300px; max-height: 200px;">
  113. </div>
  114. </div>
  115. <button class="layui-btn" id="id_save" lay-submit lay-filter="component-form-element" style="display: none">保存</button>
  116. <button class="layui-btn" type="button" id="upload_image" style="display: none"></button>
  117. </div>
  118. </form>
  119. </div>
  120. </div>
  121. </div>
  122. <script src="../../layuiadmin/layui/layui.js"></script>
  123. <script>
  124. layui.link('../../../layuiadmin/style/autocomplete.css');
  125. layui.config({
  126. base: '../../../layuiadmin/' //静态资源所在路径
  127. }).extend({
  128. index: 'lib/index',
  129. formSelects: 'formSelects-v4',
  130. autocomplete: 'autocomplete'
  131. }).use(['index', 'form', 'utils', 'upload', 'autocomplete', 'formSelects'], function(){
  132. var $ = layui.$
  133. ,admin = layui.admin
  134. ,upload = layui.upload
  135. ,autocomplete = layui.autocomplete
  136. ,formSelects = layui.formSelects
  137. ,form = layui.form;
  138. var id = layui.view.getParameterByName('id');
  139. var series = null;
  140. if (!id || id === '') {
  141. $('#id_checked').removeAttr('checked');
  142. }
  143. var um = UM.getEditor('myEditor');
  144. um.setWidth('100%');
  145. $(".edui-body-container").css("width", "98%");
  146. autocomplete.render({
  147. elem:$('#id_series'),
  148. url:'/vehicle/series/search/',
  149. template_val:'',
  150. template_txt:'<span class=\'layui-badge layui-bg-gray\'>{{d.brand_name}} - {{d.name}}',
  151. onselect: function (resp) {
  152. $('#id_series').val(resp.brand_name + '-' + resp.name);
  153. series = resp.id;
  154. }
  155. });
  156. formSelects.value('manager_tags', []);
  157. admin.req({
  158. url: '/option/search/?type=2'
  159. ,done: function(res){
  160. var _nodes = res.data;
  161. formSelects.data('manager_tags', 'local', {
  162. arr: _nodes,
  163. tree: {
  164. //在点击节点的时候, 如果没有子级数据, 会触发此事件
  165. nextClick: function(id, item, callback){
  166. return false;
  167. },
  168. }
  169. });
  170. //formSelects.value('manager_range', manages);
  171. loadData();
  172. }
  173. });
  174. var loadData = function () {
  175. if(id){
  176. var editdata = JSON.parse(JSON.stringify(parent.layui.table.editdata)); // 框架有Bug所以这么转换
  177. form.val("component-form-element", editdata);
  178. $('#id_series').val(editdata.brand_name + '-' + editdata.series_name);
  179. series = editdata.series;
  180. formSelects.value('manager_tags', editdata.tags);
  181. um.setContent(editdata.describe);
  182. if(editdata.thumbnail_url){
  183. $('#demo1').attr('src', editdata.thumbnail_url);
  184. }
  185. }
  186. };
  187. form.render(null, 'component-form-element');
  188. var form_data = {field:{}};
  189. if (id){
  190. var url = '/vehicle/model/' +id + '/update_model/';
  191. }else{
  192. url = '/vehicle/model/';
  193. }
  194. upload.render({
  195. elem: '#test1',
  196. url: url,
  197. auto: false,
  198. field: 'image',
  199. bindAction: '#upload_image',
  200. choose: function(obj) {
  201. obj.preview(
  202. function(index, file, result) {
  203. $('#demo1').attr('src', result);
  204. }
  205. );
  206. },
  207. data:{
  208. series: function(){return form_data.field.series;},
  209. name: function(){return form_data.field.name;},
  210. price: function(){return form_data.field.price_show;},
  211. shop_price: function(){return form_data.field.shop_price_show},
  212. advance_pay: function(){return form_data.field.advance_pay_show;},
  213. equal_pay: function(){return form_data.field.equal_pay_show;},
  214. notes: function(){return form_data.field.notes;},
  215. describe: function(){return form_data.field.describe;},
  216. tags: function(){return form_data.field.tags;},
  217. commission_ratio: function(){return form_data.field.commission_amount;},
  218. sort: function(){return form_data.field.sort;},
  219. enabled: function(){
  220. if (form_data.field.enabled){
  221. return form_data.field.enabled;
  222. }else{
  223. return '0';
  224. }
  225. },
  226. is_hot: function(){
  227. if (form_data.field.is_hot){
  228. return form_data.field.is_hot;
  229. }else{
  230. return '0';
  231. }
  232. }
  233. },
  234. done: function (res) {
  235. if (res.code != 0) {
  236. layer.msg(res.msg);
  237. }else {
  238. parent.layui.onSubmitChild(res.data);
  239. }
  240. },
  241. error: function () {
  242. layer.msg('保存失败');
  243. }
  244. });
  245. form.on('submit(component-form-element)', function (data) {
  246. if (!series){
  247. layer.msg('请搜索并选择车型');
  248. return false;
  249. }
  250. //console.log('000000000000000000000000000000');
  251. //console.log(JSON.stringify(data.field));
  252. if (!id && !data.field.image) {
  253. layer.msg('车型图片是必填项',{icon: 5});
  254. return false;
  255. }
  256. var describe = UM.getEditor('myEditor').getContent();
  257. data.field['describe'] = describe;
  258. data.field['series'] = series;
  259. if (data.field.image){
  260. form_data = data;
  261. $('#upload_image').click();
  262. }else{
  263. var save_data = data.field;
  264. save_data['price'] = data.field.price_show;
  265. save_data['shop_price'] = data.field.shop_price_show;
  266. save_data['advance_pay'] = data.field.advance_pay_show;
  267. save_data['equal_pay'] = data.field.equal_pay_show;
  268. save_data['commission_ratio'] = data.field.commission_amount;
  269. admin.req({
  270. url: url
  271. ,data: data.field
  272. ,type: 'post'
  273. ,done: function(res){
  274. parent.layui.onSubmitChild(res.data);
  275. }
  276. });
  277. }
  278. return false;
  279. });
  280. parent.layui.submitChild = function () {
  281. $("#id_save").click();
  282. };
  283. });
  284. </script>
  285. </body>
  286. </html>