| New file |
| | |
|---|
| | | <!DOCTYPE html> |
|---|
| | | <html lang="en"> |
|---|
| | | <head> |
|---|
| | | <meta charset="utf-8"> |
|---|
| | | <title></title> |
|---|
| | | <meta name="renderer" content="webkit"> |
|---|
| | | <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
|---|
| | | <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> |
|---|
| | | <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all"> |
|---|
| | | <link rel="stylesheet" href="../../static/css/cool.css" media="all"> |
|---|
| | | <link rel="stylesheet" href="../../static/css/common.css" media="all"> |
|---|
| | | <style> |
|---|
| | | body { |
|---|
| | | padding: 0 20px; |
|---|
| | | } |
|---|
| | | .layui-table-box { |
|---|
| | | border-right: 1px solid #9F9F9F; |
|---|
| | | border-left: 1px solid #9F9F9F; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | |
|---|
| | | <!-- 搜索栏 --> |
|---|
| | | <fieldset class="layui-elem-field site-demo-button" style="margin: 20px;"> |
|---|
| | | <legend>搜索栏</legend> |
|---|
| | | <div id="search-box" class="layui-form layui-card-header"> |
|---|
| | | <div class="layui-inline"> |
|---|
| | | <label class="layui-form-label">物料编码：</label> |
|---|
| | | <div class="layui-input-inline"> |
|---|
| | | <input class="layui-input" type="text" name="mat_no" placeholder="请输入" autocomplete="off"> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <!-- 待添加 --> |
|---|
| | | <div id="data-search-btn" class="layui-btn-container layui-form-item" style="display: inline-block"> |
|---|
| | | <button id="search" class="layui-btn layui-btn-primary layui-btn-radius" lay-submit lay-filter="search">搜索</button> |
|---|
| | | <button id="reset" class="layui-btn layui-btn-primary layui-btn-radius" lay-submit lay-filter="reset">重置</button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </fieldset> |
|---|
| | | |
|---|
| | | <script type="text/html" id="toolbar"> |
|---|
| | | <div class="layui-btn-container"> |
|---|
| | | <button class="layui-btn" id="btn-confirm" lay-event="confirm" style="">提取</button> |
|---|
| | | </div> |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | |
|---|
| | | <div class="layui-form"> |
|---|
| | | <table class="layui-hide" id="matCode" lay-filter="matCode"></table> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <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> |
|---|
| | | <script type="text/javascript" src="../../static/js/pakStore/pakStore.js" charset="utf-8"></script> |
|---|
| | | |
|---|
| | | </body> |
|---|
| | | <script> |
|---|
| | | var matCodeData = []; |
|---|
| | | var pageCurr; |
|---|
| | | layui.use(['table','laydate', 'form'], function() { |
|---|
| | | var table = layui.table; |
|---|
| | | var $ = layui.jquery; |
|---|
| | | var form = layui.form; |
|---|
| | | // 物料查询数据表 |
|---|
| | | matQueryTable = table.render({ |
|---|
| | | elem: '#matCode', |
|---|
| | | headers: {token: localStorage.getItem('token')}, |
|---|
| | | url: baseUrl + '/matCode/list/auth', |
|---|
| | | page: true, |
|---|
| | | limit: 10, |
|---|
| | | limits: [10, 30,50,100], |
|---|
| | | even: true, |
|---|
| | | cellMinWidth: 50, |
|---|
| | | toolbar: '#toolbar', |
|---|
| | | cols: [[ |
|---|
| | | {type: 'checkbox', fixed: 'left'}, |
|---|
| | | {field: 'matNo', align: 'center', title: '物料编码'}, |
|---|
| | | {field: 'barcode', align: 'center', title: '条码'}, |
|---|
| | | {field: 'matName', align: 'center', title: '物料名称'}, |
|---|
| | | {field: 'str1', align: 'center', title: '物料单位'}, |
|---|
| | | {field: 'str2', align: 'center', title: '物料规格'}, |
|---|
| | | {field: 'count', title: '数量', align: 'center', edit:'text', width: 100} |
|---|
| | | ]], |
|---|
| | | request: { |
|---|
| | | pageName: 'curr', |
|---|
| | | pageSize: 'limit' |
|---|
| | | }, |
|---|
| | | parseData: function (res) { |
|---|
| | | return { |
|---|
| | | 'code': res.code, |
|---|
| | | 'msg': res.msg, |
|---|
| | | 'count': res.data.total, |
|---|
| | | 'data': res.data.records |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | response: { |
|---|
| | | statusCode: 200 |
|---|
| | | }, |
|---|
| | | done: function (res, curr, count) { |
|---|
| | | if (res.code === 403) { |
|---|
| | | top.location.href = baseUrl + "/"; |
|---|
| | | } |
|---|
| | | setMatCodeData(res.data); |
|---|
| | | $('td[data-field=count] div').html("1"); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | // 页面修改 |
|---|
| | | table.on('edit(matCode)', function (obj) { |
|---|
| | | updateMatCodeData(obj.data.matNo, Number(obj.value)); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | // 监听排序事件 |
|---|
| | | table.on('sort(matCode)', function (obj) { |
|---|
| | | var searchData = {}; |
|---|
| | | $.each($('#search-box [name]').serializeArray(), function() { |
|---|
| | | searchData[this.name] = this.value; |
|---|
| | | }); |
|---|
| | | searchData['orderByField'] = obj.field; |
|---|
| | | searchData['orderByType'] = obj.type; |
|---|
| | | tableIns.reload({ |
|---|
| | | where: searchData, |
|---|
| | | page: { |
|---|
| | | curr: 1 |
|---|
| | | }, |
|---|
| | | done: function (res, curr, count) { |
|---|
| | | if (res.code === 403) { |
|---|
| | | top.location.href = baseUrl+"/"; |
|---|
| | | } |
|---|
| | | pageCurr=curr; |
|---|
| | | limit(); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | // 监听头工具栏事件 |
|---|
| | | table.on('toolbar(matCode)', function (obj) { |
|---|
| | | var checkStatus = table.checkStatus(obj.config.id); |
|---|
| | | switch(obj.event) { |
|---|
| | | case 'confirm': |
|---|
| | | console.log(checkStatus); |
|---|
| | | break; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | // 搜索栏搜索事件 |
|---|
| | | form.on('submit(search)', function (data) { |
|---|
| | | pageCurr = 1; |
|---|
| | | tableReload(false); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | // 搜索栏重置事件 |
|---|
| | | form.on('submit(reset)', function (data) { |
|---|
| | | pageCurr = 1; |
|---|
| | | clearFormVal($('#search-box')); |
|---|
| | | tableReload(); |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | |
|---|
| | | function setMatCodeData(data, matNo, count) { |
|---|
| | | matCodeData = data; |
|---|
| | | } |
|---|
| | | |
|---|
| | | function updateMatCodeData(matNo, count) { |
|---|
| | | for (var i=0;i<matCodeData.length;i++){ |
|---|
| | | if (matCodeData[i][matNo] === matNo){ |
|---|
| | | matCodeData[i][count] = count; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | console.log(matCodeData); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function tableReload(child) { |
|---|
| | | var searchData = {}; |
|---|
| | | $.each($('#search-box [name]').serializeArray(), function() { |
|---|
| | | searchData[this.name] = this.value; |
|---|
| | | }); |
|---|
| | | matQueryTable.reload({ |
|---|
| | | where: searchData, |
|---|
| | | page: { |
|---|
| | | curr: pageCurr |
|---|
| | | }, |
|---|
| | | done: function (res, curr, count) { |
|---|
| | | if (res.code === 403) { |
|---|
| | | top.location.href = baseUrl+"/"; |
|---|
| | | } |
|---|
| | | setMatCodeData(res.data); |
|---|
| | | $('td[data-field=count] div').html("1"); |
|---|
| | | pageCurr=curr; |
|---|
| | | if (res.data.length === 0 && count !== 0) { |
|---|
| | | tableIns.reload({ |
|---|
| | | where: searchData, |
|---|
| | | page: { |
|---|
| | | curr: pageCurr-1 |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | pageCurr -= 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function clearFormVal(el) { |
|---|
| | | $(':input', el) |
|---|
| | | .val('') |
|---|
| | | .removeAttr('checked') |
|---|
| | | .removeAttr('selected'); |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | </html> |
|---|
| | | |
|---|
