sale_order_edit.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334
  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. <style type="text/css">
  12. .table-overlay .layui-table-view,
  13. .table-overlay .layui-table-header,
  14. .table-overlay .layui-table-box,
  15. .table-overlay .layui-table-body{overflow: visible;}
  16. .table-overlay .layui-table-cell{height: auto; overflow: visible;}
  17. </style>
  18. </head>
  19. <body>
  20. <div class="layui-fluid">
  21. <div class="layui-card">
  22. <div class="layui-card-body" pad15>
  23. <div class="layui-row layui-col-space15">
  24. <div class="layui-col-md12">
  25. <form class="layui-form" action="" lay-filter="component-form-element">
  26. <div class="layui-row layui-col-space10 layui-form-item">
  27. <div class="layui-col-md12">
  28. <label class="layui-form-label"><font color='red' size="4">*</font>客户:</label>
  29. <div class="layui-input-block">
  30. <div class="layui-col-xs12 layui-col-sm5">
  31. <input id='id_customer' type="text" autocomplete="off" lay-verify="required" class="layui-input"/>
  32. </div>
  33. <div class="layui-col-xs12 layui-col-sm7" style="line-height: 37px;">
  34. <button id="btn_add" class="layui-btn layui-btn-warm" type="button" data-permission="customer.add_customer"><i class="layui-icon layui-icon-add-circle"></i>新建</button>
  35. <label id="id_customer_name" style="margin-left: 10px;">姓名</label>
  36. <label id="id_customer_tel" style="margin-left: 10px;">电话</label>
  37. <input id="customer_id" type="hidden" name="customer">
  38. </div>
  39. <div style="clear: both;"></div>
  40. </div>
  41. </div>
  42. <div class="layui-col-md12">
  43. <label class="layui-form-label">备注:</label>
  44. <div class="layui-input-block">
  45. <div class="layui-col-sm8">
  46. <input id="id_notes" type="text" autocomplete="off" name="notes" class="layui-input">
  47. </div>
  48. </div>
  49. </div>
  50. </div>
  51. <fieldset class="layui-elem-field layui-field-title">
  52. <legend>产品明细&nbsp;&nbsp;<button type="button" id="part-btn-add" class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon"></i></button></legend>
  53. </fieldset>
  54. <div class="table-overlay">
  55. <table id="part_dataTable" lay-filter="part_dataTable" class="layui-hide"></table>
  56. </div>
  57. <button id="submit_btn" lay-submit lay-filter="component-form-element" style="display: none">保存</button>
  58. </form>
  59. </div>
  60. </div>
  61. </div>
  62. </div>
  63. </div>
  64. <script src="../../layuiadmin/layui/layui.js"></script>
  65. <script>
  66. var customer_id=null;
  67. var _options = [];
  68. layui.link('../../../layuiadmin/style/autocomplete.css');
  69. layui.config({
  70. base: '../../../layuiadmin/' //静态资源所在路径
  71. }).extend({
  72. index: 'lib/index',
  73. autocomplete: 'autocomplete'
  74. }).use(['index', 'form', 'autocomplete', 'table', 'utils'], function(){
  75. var $ = layui.$
  76. ,admin = layui.admin
  77. ,element = layui.element
  78. ,form = layui.form
  79. ,table = layui.table
  80. ,utils = layui.utils
  81. ,autocomplete = layui.autocomplete;
  82. var id = layui.view.getParameterByName('id');
  83. admin.req({
  84. url: '/foundation/search_options/?type=4',
  85. done: function(res){
  86. _options = res.data;
  87. }
  88. });
  89. autocomplete.render({
  90. elem:$('#id_customer'),
  91. url:'/customer/customer/select/',
  92. template_val:'{{d.name}}-{{d.mobile}}',
  93. template_txt:'{{d.name}} <span class=\'layui-badge layui-bg-gray\'>{{d.mobile}}</span>',
  94. onselect: function (resp) {
  95. fillData(resp);
  96. }
  97. });
  98. function fillData(data){
  99. $('#id_customer_name').html('姓名:' + data.name);
  100. $('#id_customer_tel').html('电话:' + data.mobile);
  101. $('#id_customer').val(data.name + '-' + data.mobile);
  102. customer_id = data.id;
  103. }
  104. var part_layTableId = "part_layTable";
  105. var part_tableIns = table.render({
  106. elem: '#part_dataTable',
  107. id: part_layTableId,
  108. data: [],
  109. page: false,
  110. limit: 1000,
  111. loading: true,
  112. even: true, //不开启隔行背景
  113. cols: [[
  114. {title: '序号', type: 'numbers'},
  115. {field: 'name', title: '产品名称', width: 150},
  116. {field: 'model', title: '产品代码', width: 150},
  117. {field: 'unit', title: '单位', width: 80},
  118. {field: 'count', title: '数量', width: 100, templet: function (d){
  119. return '<input id="count'+d.id+'" type="text" value="'+d.count+'" lay-verify="required|numberGtZ" autocomplete="off" class="layui-input">';
  120. }},
  121. {field: 'price', title: '单价', width: 100, templet: function (d){
  122. return '<input id="price'+d.id+'" type="text" value="'+d.price+'" lay-verify="required|numberGeZ" autocomplete="off" class="layui-input">';
  123. }},
  124. {field: 'option_type', title: '质量要求', width: 120, templet: function (d) {
  125. var options = utils.renderSelectOptions(_options, {
  126. valueField: "id",
  127. textField: "name",
  128. selectedValue: d.option_type
  129. });
  130. return '<select id="option_type'+d.id+'" lay-filter="type_select"><option value="">请选择</option>' + options + '</select>';
  131. }
  132. },
  133. {field: 'id', title: '操作',minWidth:120, templet: function(d){
  134. return '<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del" lay-id="'+ d.id +'">删除</a>';
  135. }}
  136. ]],
  137. });
  138. table.on('tool(part_dataTable)', function (obj) {
  139. var data = obj.data, event = obj.event, tr = obj.tr; //获得当前行 tr 的DOM对象;
  140. switch(event){
  141. case "del":
  142. obj.del();
  143. layer.msg('删除成功', {icon: 6});
  144. break;
  145. }
  146. });
  147. var getItemsData = function () {
  148. var rows = table.cache[part_layTableId];
  149. var items = [];
  150. for(var k in rows){
  151. if (rows[k] == false) {
  152. continue;
  153. }
  154. var option_type = $('#option_type'+rows[k].id).val();
  155. var count = $('#count'+rows[k].id).val();
  156. var price = $('#price'+rows[k].id).val();
  157. var item = {
  158. id:rows[k].id,
  159. goods:rows[k].id,
  160. name:rows[k].name,
  161. model:rows[k].model,
  162. count:count,
  163. price:price,
  164. quality_request:option_type
  165. };
  166. items.push(item);
  167. }
  168. return items
  169. };
  170. form.on('submit(component-form-element)', function(data){
  171. var items = getItemsData();
  172. if(items.length == 0){
  173. layer.msg('请添加产品!', {icon: 5});
  174. return false;
  175. }
  176. if (!customer_id){
  177. layer.msg('请添加客户!', {icon: 5});
  178. return false;
  179. }
  180. var order_data = {'customer': customer_id, 'notes': $('#id_notes').val()};
  181. data.field.order_data = order_data;
  182. data.field.items = items;
  183. admin.req({
  184. url: '/order/sale_order/save/?id='+id
  185. ,data: JSON.stringify(data.field)
  186. ,type: 'post'
  187. ,done: function(res){
  188. customer_id = null;
  189. parent.layui.onSubmitChild();
  190. }
  191. });
  192. return false;
  193. });
  194. $('#part-btn-add').on('click', function () {
  195. layer.open({
  196. type: 2,
  197. title: '添加成品',
  198. shadeClose: false,
  199. area: ['90%', '98%'],
  200. btn: ['保存', '取消'],
  201. yes: function (index, dom) {
  202. layui.onSubmitChild = function (data) {
  203. var oldData = getItemsData();
  204. if (data.length > 0) {
  205. layer.msg('添加成功!', {icon: 6});
  206. } else {
  207. layer.msg('请先选择记录!');
  208. }
  209. for (var i in data) {
  210. var is_exit = false;
  211. for (var m in oldData) {
  212. if (oldData[m].id == data[i].id) {
  213. is_exit = true;
  214. break;
  215. }
  216. }
  217. if (is_exit) {
  218. continue;
  219. }
  220. var newRow = {
  221. id: data[i].id,
  222. name: data[i].name,
  223. model: data[i].model,
  224. unit: data[i].unit,
  225. price: data[i].retail_price,
  226. count: 1.00,
  227. warehouse_place: data[i].warehouse_place,
  228. option_type: ''
  229. };
  230. oldData.push(newRow);
  231. }
  232. part_tableIns.reload({
  233. data: oldData
  234. });
  235. };
  236. layui.submitChild();
  237. },
  238. btn2: function (index, layero) {
  239. layer.close(index);
  240. },
  241. content: '../goods/search_goods_item.html'
  242. });
  243. });
  244. $('#btn_add').on('click', function(){
  245. layer.open({
  246. type: 2,
  247. title: '添加客户',
  248. shadeClose: false,
  249. area: ['95%', '95%'],
  250. btn: ['保存', '取消'],
  251. yes: function(index, dom){
  252. layui.onSubmitChild = function (data) {
  253. layer.close(index);
  254. fillData(data)
  255. };
  256. layui.submitChild();
  257. },
  258. btn2: function(index, layero){
  259. layer.close(index);//关闭当前按钮
  260. },
  261. content:'../customer/customer_edit.html?add=true'
  262. });
  263. });
  264. if (id) {
  265. admin.req({
  266. url: '/order/sale_order/detail/?id='+id,
  267. done: function(res){
  268. var data = res.data.items_data;
  269. var oldData = [];
  270. for (var i in data) {
  271. var item = data[i];
  272. var newRow = {
  273. id: item.goods_id,
  274. name: item.name,
  275. model:item.model,
  276. unit:item.unit,
  277. price: item.price,
  278. count: item.count,
  279. warehouse_place: '',
  280. option_type: item.quality_request,
  281. part_data:item
  282. }
  283. oldData.push(newRow);
  284. }
  285. part_tableIns.reload({
  286. data: oldData
  287. });
  288. var orderData = JSON.parse(JSON.stringify(parent.layui.table.editdata));
  289. fillData({
  290. name:orderData.customer_name,
  291. mobile:orderData.customer_tel,
  292. id:orderData.customer
  293. });
  294. }
  295. });
  296. }
  297. parent.layui.submitChild = function () {
  298. $("#submit_btn").click();
  299. };
  300. });
  301. </script>
  302. </body>
  303. </html>