| <!DOCTYPE html> | 
| <html lang="en"> | 
| <head> | 
|     <meta charset="UTF-8"> | 
|     <meta name="viewport" content="width=device-width, target-densitydpi=high-dpi, initial-scale=1.0, user-scalable=no"/> | 
|     <title>库存明细详情</title> | 
|     <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all"> | 
|     <script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script> | 
|     <script type="text/javascript" src="../../static/layui/layui.js" charset="utf-8"></script> | 
|     <script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script> | 
|     <script type="text/javascript" src="../../static/js/cool.js" charset="utf-8"></script> | 
|     <script type="text/javascript" src="../../static/js/handlebars/handlebars-v4.5.3.js"></script> | 
|     <style> | 
|         .form-box { | 
|             padding: 15px 5px 5px 5px; | 
|             font-size: 16px; | 
|             text-align: center; | 
|         } | 
|   | 
|         .form-item { | 
|             margin-bottom: 10px; | 
|         } | 
|   | 
|         .form-box span { | 
|             display: inline-block; | 
|             text-align: right; | 
|             width: 70px; | 
|         } | 
|         .form-box input { | 
|             width: 120px; | 
|             margin-left: 10px; | 
|             padding-left: 5px; | 
|             height: 30px; | 
|             border: 1px solid #777777; | 
|             overflow:hidden; | 
|             white-space:nowrap; | 
|             text-overflow:ellipsis; | 
|         } | 
|   | 
|         .number-tool { | 
|             margin-left: 10px; | 
|             padding: 1px 0 1px 5px; | 
|             display: inline-block; | 
|             width: 120px; | 
|         } | 
|         .number-tool:after { | 
|             clear: both; | 
|             content: ""; | 
|             display: table; | 
|         } | 
|         .number-tool button { | 
|             background-color: #fff; | 
|             margin-top: 3px; | 
|             font-size: 16px; | 
|             height: 25px; | 
|             float: left; | 
|             width: 25px; | 
|             border: 1px solid #777777; | 
|         } | 
|         .number-tool input { | 
|             text-align: center; | 
|             height: 30px; | 
|             float: left; | 
|             margin: 0 5px; | 
|             width: 40px; | 
|             padding: 0; | 
|         } | 
|   | 
|         .form-button { | 
|             margin: 5px 10px 0 10px; | 
|             padding: 5px 15px; | 
|         } | 
|     </style> | 
| </head> | 
| <body> | 
| <div class="form-box"> | 
|     <div class="form-item"> | 
|         <span>库位号</span> | 
|         <input id="locNo" type="text" disabled="disabled"> | 
|     </div> | 
|     <div class="form-item"> | 
|         <span>商品编号</span> | 
|         <input id="matnr" type="text" disabled="disabled"> | 
|     </div> | 
|     <div class="form-item"> | 
|         <span>商品名称</span> | 
|         <input id="maktx" type="text" disabled="disabled"> | 
|     </div> | 
|     <div class="form-item"> | 
|         <span style="vertical-align: middle">数量</span> | 
|         <div class="number-tool" style="vertical-align: middle"> | 
|             <button onclick="reduce()">-</button> | 
|             <input id="count" type="number"> | 
| <!--            <button onclick="add()">+</button>--> | 
|         </div> | 
|     </div> | 
|     <button class="form-button" id="save" onclick="save()">保存</button> | 
|     <button class="form-button" id="remove" onclick="remove()">移除</button> | 
| </div> | 
| </body> | 
| <script> | 
|     var countDom = $('#count'); | 
|   | 
|     function save() { | 
|         console.log(countDom.val()) | 
|         if (countDom.val() < 1) { | 
|             return; | 
|         } | 
|         parent.updateTableData({ | 
|             locNo: $('#locNo').val(), | 
|             matnr: $('#matnr').val(), | 
|             maktx: $('#maktx').val(), | 
|             count: countDom.val() | 
|         }) | 
|         parent.layer.closeAll(); | 
|     } | 
|   | 
|     function remove() { | 
|         parent.removeTableData({ | 
|             locNo: $('#locNo').val(), | 
|             matnr: $('#matnr').val(), | 
|         }) | 
|         parent.layer.closeAll(); | 
|     } | 
|   | 
|     function add() { | 
|         countDom.val(Number(countDom.val()) + 1); | 
|     } | 
|     function reduce() { | 
|         if (countDom.val() <= 1) { | 
|             return; | 
|         } | 
|         countDom.val(countDom.val() - 1); | 
|     } | 
| </script> | 
| </html> |