cashier.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0" />
  6. <meta name="author" content="siweiyong 2602812659@qq.com"/>
  7. <title>仓库库存调拨</title>
  8. <link rel="stylesheet" href="../script/lib/miniui/themes/default/miniui.css">
  9. <link rel="stylesheet" href="../script/lib/layui/css/layui.css" />
  10. <link rel="stylesheet" href="../script/lib/cashier/common.css">
  11. <link rel="stylesheet" href="../script/lib/layui/admin/modules/plugin/formselects/formselects.css" media="all" />
  12. <script src="../script/lib/jquery/jquery.min.js"></script>
  13. <script src="../script/lib/miniui/miniui.js"></script>
  14. <script src="../script/lib/layui/layui.js"></script>
  15. <script><{Dever::script()}></script>
  16. <script src="../script/dever/core.js"></script>
  17. </head>
  18. <body style="background: #F6F7F9;">
  19. <div class="main">
  20. <form class="layui-form" lay-filter="form">
  21. <div class="layui-row">
  22. <div class="main_left layui-col-xs12 layui-col-md3">
  23. <div class="layui-row">
  24. <div class="top">
  25. <i class="layui-icon layui-icon-app"></i>商品列表
  26. </div>
  27. <div class="left_main">
  28. <input id="key" class="mini-textbox" placeholder="请输入商品名称" onenter="onKeyEnter"/>
  29. <a class="mini-button" onclick="search()">查询</a>
  30. <ul id="tree1" class="mini-tree" url="<{$url}>" showTreeIcon="true" textField="name" idField="id" expandOnLoad="true" onNodeClick="onNodeClick">
  31. </ul>
  32. </div>
  33. </div>
  34. </div>
  35. <div class="main_right layui-col-xs12 layui-col-md9">
  36. <div class="layui-row">
  37. <div class="top">
  38. <label>选择发货仓库:</label>
  39. <div class="layui-input-inline">
  40. <div><select xm-select="source_id" xm-select-skin="normal" xm-select-search="<{$search}>" xm-select-search-type="dl" xm-select-radio="" class="update_value form-control layui-input layui-select" name="source_id" id="source_id" ></select></div>
  41. </div>
  42. <div class="layui-input-inline">
  43. <button class="layui-btn layui-btn-button" type="button" style="vertical-align: middle;margin-bottom: 2px;" onclick="setstore()">确认选择</button>
  44. </div>
  45. </div>
  46. <div class="goods_list">
  47. <table class="layui-table">
  48. <thead>
  49. <tr>
  50. <th lay-data="{field:'id'}">商品编码</th>
  51. <th lay-data="{field:'name'}">商品名称</th>
  52. <th lay-data="{field:'number', edit: 'text'}">数量</th>
  53. <th lay-data="{field:'operation'}">操作</th>
  54. </tr>
  55. </thead>
  56. <tbody id="goods">
  57. </tbody>
  58. </table>
  59. </div>
  60. <div class="total ft16">
  61. 合计:【<span> 总数量:<i class="totalQuantity">0</i> </span>】
  62. </div>
  63. <table class="reading layui-table" lay-even="">
  64. <tbody>
  65. <tr>
  66. <td>选择收货仓库</td>
  67. <td colspan="3">
  68. <div class="layui-input-inline">
  69. <select xm-select="store_id" xm-select-skin="normal" xm-select-search="<{$search_store}>" xm-select-search-type="dl" xm-select-radio="" class="update_value form-control layui-input layui-select" name="store_id" id="store_id" ></select>
  70. </div>
  71. <!--
  72. <button class="card_reading layui-btn">读卡</button>
  73. <a href="#" class="registration layui-btn layui-btn-primary">会员登记</a>
  74. -->
  75. </td>
  76. </tr>
  77. <tr>
  78. <td>订单备注:</td>
  79. <td><textarea class="layui-textarea" name="info" id="info" rows="" cols="" maxlength="200" placeholder="请输入订单备注"></textarea></td>
  80. </tr>
  81. <!--
  82. <tr>
  83. <td>会员卡号:</td>
  84. <td></td>
  85. <td>会员姓名:</td>
  86. <td></td>
  87. </tr>
  88. <tr>
  89. <td>会员级别:</td>
  90. <td></td>
  91. <td>有效期:</td>
  92. <td></td>
  93. </tr>
  94. <tr>
  95. <td>可用积分:</td>
  96. <td></td>
  97. <td>可用储值:</td>
  98. <td></td>
  99. </tr>
  100. -->
  101. </tbody>
  102. </table>
  103. <div class="towbtn">
  104. <input type="button" id="settlement" value="确定调拨">
  105. </div>
  106. </div>
  107. </div>
  108. </div>
  109. </div>
  110. <div class="mask_box">
  111. <div class="mask"></div>
  112. <div class="box">
  113. <div class="box_top">结算</div>
  114. <div class="box_block box_block1">
  115. <div class="block_left"><label for="">应付金额:</label></div>
  116. <div class="block_right"><input type="text" class="layui-input" value="23131" readonly style="border: none;" /></div>
  117. </div>
  118. <div class="box_block box_block2">
  119. <div class="block_left"><input type="checkbox" name="" />优惠券:</div>
  120. <div class="block_right">
  121. <select class="layui-select" name="" id="">
  122. <option value="0">请选择</option>
  123. <option value="1">1</option>
  124. <option value="2">2</option>
  125. <option value="3">3</option>
  126. <option value="4">4</option>
  127. </select>
  128. </div>
  129. <div class="block_left">还需支付:</div>
  130. <div class="block_right"><input type="text" class="layui-input" value="32432" readonly style="border: none;" /></div>
  131. </div>
  132. <div class="box_block box_block3">
  133. <div class="block_left"><input type="radio" name="payment" /><label for="use_coupon">现金支付:</label></div>
  134. <div class="block_right">
  135. <input type="text" class="layui-input" />
  136. </div>
  137. <br style="clear: both;">
  138. <div class="block_left"><input type="radio" name="payment" /><label for="use_coupon">移动支付:</label></div>
  139. <div class="block_right">
  140. <input type="text" class="layui-input" />
  141. </div>
  142. <br style="clear: both;">
  143. <div class="block_left"><input type="radio" name="payment" /><label for="use_coupon">其他支付:</label></div>
  144. <div class="block_right">
  145. <input type="text" class="layui-input" />
  146. </div>
  147. </div>
  148. <div class="remark_mess">
  149. <div class="block_left">
  150. 备注:
  151. </div>
  152. <div class="block_right">
  153. <textarea class="layui-textarea" name="" rows="" cols="" maxlength="200" placeholder="最多输入200字符"></textarea>
  154. </div>
  155. <br style="clear: both;">
  156. <div class="block_left">
  157. 交易时间:
  158. </div>
  159. <div class="block_right">
  160. <input type="text" value="2018-11-23 08:23:43" class="layui-input" readonly style="border: none;" />
  161. </div>
  162. </div>
  163. <div class="bot">
  164. <input type="button" value="提交">
  165. <input type="text" value="取消">
  166. </div>
  167. </div>
  168. </form>
  169. </div>
  170. <script>
  171. var form;
  172. layui.config(
  173. {
  174. base: '../script/lib/layui/admin/' //静态资源所在路径
  175. ,version: true
  176. }).extend(
  177. {
  178. index: 'lib/index', //主入口模块
  179. formSelects: 'plugin/formselects/formselects'
  180. }).use(['index', 'contlist', 'table', 'form', 'formSelects','layer'], function()
  181. {
  182. var table = layui.table;
  183. form = layui.form;
  184. var formSelects = layui.formSelects;
  185. });
  186. $(function()
  187. {
  188. $("#settlement").click(function(){
  189. var url = '<{$submit}>';
  190. var source_id = '<{$source_id}>';
  191. var store_id = $('.xm-select-parent[fs_id="store_id"] span[fsw="xm-select"]').attr('value');
  192. if (!store_id) {
  193. layui.layer.alert('请选择收货仓库');
  194. return;
  195. }
  196. layui.layer.confirm('确定进行仓库调拨吗?', function() {
  197. var info = $('#info').val();
  198. var goods_string = JSON.stringify(goods);
  199. var data = {};
  200. data = {source_id:source_id, store_id:store_id, goods:goods_string, info:info};
  201. $.post(url, data, function(t) {
  202. t = JSON.parse(t);
  203. if (t.status == 1) {
  204. layui.layer.alert('仓库库存调拨下单成功', function(index){
  205. location.href = t.data;
  206. layer.close(index);
  207. });
  208. } else {
  209. layui.layer.alert(t.msg);
  210. }
  211. });
  212. });
  213. //$(".mask_box").show();
  214. })
  215. $(".bot input:nth-child(2)").click(function(){
  216. $(".mask_box").hide();
  217. })
  218. $("#goods").on("keyup", ".goods_num", function() {
  219. var num = parseFloat($(this).val());
  220. if (num < 0) {
  221. num = 1;
  222. $(this).val(1);
  223. }
  224. var id = $(this).parent().attr('value');
  225. if (num >= goods[id].total) {
  226. num = goods[id].total;
  227. $(this).val(num);
  228. }
  229. goods[id].num = num;
  230. setTotal();
  231. })
  232. })
  233. mini.parse();
  234. var tree = mini.get("tree1");
  235. function search()
  236. {
  237. var key = mini.get("key").getValue();
  238. if (key == "") {
  239. tree.clearFilter();
  240. } else {
  241. key = key.toLowerCase();
  242. tree.filter(function (node) {
  243. var name = node.name ? node.name.toLowerCase() : "";
  244. if (name.indexOf(key) != -1) {
  245. return true;
  246. }
  247. });
  248. }
  249. }
  250. function onKeyEnter(e)
  251. {
  252. search();
  253. }
  254. var goods = {};
  255. function onNodeClick()
  256. {
  257. var tree=mini.get("tree1");
  258. node=tree.getSelectedNode();
  259. if(node.end) {
  260. var key = node.id;
  261. if (!goods[key]) {
  262. goods[key] = node;
  263. goods[key].num = 1;
  264. create(node);
  265. setTotal();
  266. } else {
  267. add(key);
  268. }
  269. }
  270. }
  271. function get(key)
  272. {
  273. return $('#goods_' + key);
  274. }
  275. function create(node)
  276. {
  277. console.info(node);
  278. if (!get(node.id).length) {
  279. var addtr = '<tr class="mytr" id="goods_'+node.id+'">';
  280. addtr += '<td class="goods_id">'+node.id+'</td>';
  281. addtr += '<td class="goods_name">'+node.name+'</td>';
  282. addtr += '<td><div class="jiajian" value='+node.id+'><span class="jian" onclick="dec(\''+node.id+'\')">-</span><input type="text" value="'+node.num+'" class="goods_num"><span class="jia" onclick="add(\''+node.id+'\')">+</span></div></td>';
  283. addtr += '<td><button class="delete_btn" onclick="del(\''+node.id+'\')">删除</button></td>';
  284. addtr += '</tr>';
  285. $("#goods").append(addtr);
  286. }
  287. }
  288. function add(id)
  289. {
  290. if (goods[id].num >= goods[id].total) {
  291. return;
  292. }
  293. goods[id].num += 1;
  294. get(id).find('.goods_num').val(goods[id].num);
  295. setTotal();
  296. }
  297. function dec(id)
  298. {
  299. goods[id].num -= 1;
  300. if (goods[id].num < 1) {
  301. goods[id].num = 1;
  302. }
  303. get(id).find('.goods_num').val(goods[id].num);
  304. setTotal();
  305. }
  306. function del(id)
  307. {
  308. delete goods[id];
  309. get(id).remove();
  310. setTotal();
  311. }
  312. /*
  313. //点击 - 单价 - 可编辑
  314. $("#goods").on("click","td.danjia",function(){
  315. if(!$(this).is('.bj')){
  316. var currentPrice = $(this).html();
  317. $(this).focus();
  318. $(this).addClass('bj').html('<input type="tel" class="layui-input" value="'+$(this).text()+'" />').find('input').focus().blur();
  319. }
  320. })
  321. */
  322. function setTotal()
  323. {
  324. var num = 0;
  325. for (var i in goods) {
  326. num += goods[i].num;
  327. }
  328. $(".totalQuantity").html(num);
  329. }
  330. function setstore()
  331. {
  332. var source_id = $('.xm-select-parent[fs_id="source_id"] span[fsw="xm-select"]').attr('value');
  333. if (!source_id) {
  334. layui.layer.alert('请选择发货仓库');
  335. return;
  336. }
  337. layui.layer.confirm('确定切换发货仓库吗?切换后现在选择的商品都将清空', function() {
  338. location.href = '<{$host}>&source_id=' + source_id;
  339. });
  340. }
  341. </script>
  342. </body>
  343. </html>