<!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>
|
<script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script>
|
<style>
|
* {
|
font-size: 12px;
|
}
|
html {
|
background-color: #fff;
|
}
|
|
.mat-msg {
|
overflow-y: scroll;
|
margin-top: 10px;
|
height: 115px;
|
background-color: #fff;
|
border-radius: 5px;
|
border: 1px solid #c2c2c2;
|
}
|
#mat-msg-table {
|
font-size: 12px;
|
border-collapse: collapse;
|
margin: 0 auto;
|
text-align: center;
|
}
|
#tthead {
|
padding-top: 4px;
|
background-color: #ececec;
|
height: 18px;
|
}
|
#tthead span {
|
border-right: 1px solid #b3b3b3;
|
float: left;
|
width: 24%;
|
}
|
#ttbody {
|
padding-top: 4px;
|
}
|
#ttbody div {
|
content: "";
|
clear: both;
|
display: table;
|
}
|
#ttbody span {
|
border-right: 1px solid #b3b3b3;
|
float: left;
|
width: 22%;
|
overflow:hidden;
|
white-space:nowrap;
|
text-overflow:ellipsis;
|
}
|
|
#btn-con {
|
padding-left: 10px;
|
position: absolute;
|
bottom: 10px;
|
width: 100%;
|
}
|
#btn-con button {
|
display: inline-block;
|
vertical-align: middle;
|
}
|
#tips {
|
font-size: 12px;
|
margin-top: 2px;
|
margin-left: 10px;
|
display: inline-block;
|
vertical-align: middle;
|
width: 90px;
|
overflow:hidden;
|
white-space:nowrap;
|
text-overflow:ellipsis;
|
}
|
|
/* 详情 */
|
.form-box {
|
margin-top: 10px;
|
padding: 15px 0 10px 0;
|
text-align: center;
|
border: 1px solid #BBBBBB;
|
}
|
|
.form-item {
|
margin-bottom: 5px;
|
}
|
.form-box span {
|
}
|
.form-box input {
|
overflow:hidden;
|
white-space:nowrap;
|
text-overflow:ellipsis;
|
}
|
.form-count button {
|
width: 25px;
|
height: 20px;
|
}
|
.form-count input {
|
margin: 0 7px;
|
width: 40px;
|
}
|
.form-btn-con {
|
margin-top: 10px;
|
}
|
.form-btn-con button {
|
padding: 4px 0;
|
height: 25px;
|
margin: 0 15px;
|
}
|
</style>
|
</head>
|
<body>
|
<button onclick="help()" style="padding: 0 3px; position: absolute; top: 0%; right: 0%">?</button>
|
<div>
|
<span>条码</span>
|
<input type="text" id="code">
|
</div>
|
<div>
|
<span>物料</span>
|
<input type="text" id="matNo" onkeyup="find(this)" autocomplete="off">
|
<button onclick="find()">查询</button>
|
</div>
|
|
<div class="mat-msg" id="mat-msg-id">
|
<div id="mat-msg-table">
|
<div id="tthead">
|
<span>编码</span>
|
<span>名称</span>
|
<span>单位</span>
|
<span>数量</span>
|
</div>
|
<div id="ttbody">
|
</div>
|
</div>
|
</div>
|
|
<div id="btn-con">
|
<button style="margin-right: 20px" onclick="reset()">重置</button>
|
<button id="comb" onclick="comb()">组托</button>
|
<span id="tips"></span>
|
</div>
|
|
<!-- 详情 -->
|
<div class="form-box" id="mat-detail">
|
<div class="form-item form-count">
|
<span style="margin-right: 10px">数量</span>
|
<button onclick="reduce()">-</button><input id="count" type="number" style="text-align: center"><button onclick="add()">+</button>
|
</div>
|
<div class="form-item">
|
<span>名称</span>
|
<input id="matName" type="text" disabled="disabled" style="background-color: #ececec;color: #000">
|
</div>
|
<div class="form-item">
|
<span>单位</span>
|
<input id="str1" type="text" disabled="disabled" style="background-color: #ececec;color: #000; text-align: center;">
|
</div>
|
<div class="form-item form-btn-con">
|
<button id="confirm" onclick="confirm()">提取</button>
|
<button id="cancel" onclick="cancel()" style="background-color: #fff">取消</button>
|
</div>
|
</div>
|
|
|
</body>
|
<script>
|
|
var matMsgTableBlankRows = 0; // 空白行数
|
var matData = []; // 表格数据
|
var code = document.getElementById("code")
|
var matNo = document.getElementById("matNo")
|
var matMsg = document.getElementById("mat-msg-id");
|
var matMsgTable = document.getElementById("mat-msg-table");
|
var tthead = document.getElementById("tthead");
|
var ttbody = document.getElementById("ttbody");
|
var btnCon = document.getElementById("btn-con");
|
var tipDom = document.getElementById("tips");
|
var combBtn = document.getElementById("comb");
|
|
var matDetail = document.getElementById("mat-detail");
|
var matName = document.getElementById("matName");
|
var str1 = document.getElementById("str1");
|
var count = document.getElementById("count");
|
var confirmBtn = document.getElementById("confirm");
|
|
matDetail.style.display = 'none';
|
var initMatCount = 1;
|
window.onload = function(){matMsg.focus();}
|
|
// 查询物流
|
function find(el) {
|
httpRequest({
|
httpUrl: baseUrl + "/matCode/auth",
|
type: 'post',
|
headers: [{token: getCookie('token')}],
|
data: {
|
id: matNo.value
|
},
|
}, function (res) {
|
if (res.code === 200) {
|
if (res.data != null) {
|
// 样式
|
matMsg.style.display = 'none';
|
btnCon.style.display = 'none';
|
matDetail.style.display = 'block';
|
// 填充数据
|
matName.value = res.data.matName;
|
str1.value = res.data.str1;
|
|
// count.focus();
|
count.value = initMatCount;
|
confirmBtn.focus();
|
} else {
|
matMsg.style.display = 'block';
|
btnCon.style.display = 'block';
|
matDetail.style.display = 'none';
|
}
|
} else if (res.code === 403) {
|
window.location.href = baseUrl + "/pda/ce";
|
} else {
|
tips(res.msg, true)
|
}
|
})
|
}
|
|
// 组托
|
function comb() {
|
var barcode = code.value;
|
if (isEmpty(barcode)) {
|
tips("请输入托盘条码", true);
|
// document.getElementById("code").focus();
|
return;
|
}
|
if (barcode.length !== 8) {
|
tips("条码必须为8位", true);
|
// document.getElementById("code").focus();
|
return;
|
}
|
if (matData.length === 0) {
|
tips("请提取物料", true);
|
return;
|
}
|
httpRequest({
|
httpUrl: baseUrl+"/mobile/comb/auth",
|
type: 'post',
|
headers: [
|
{token: getCookie('token')}
|
,{'Content-type':'application/json;charset=UTF-8',}
|
],
|
data: JSON.stringify({
|
barcode: barcode,
|
combMats: matData
|
}) ,
|
}, function (res) {
|
if (res.code === 200) {
|
reset();
|
tips("组托成功")
|
} else if (res.code === 403) {
|
window.location.href = baseUrl + "/pda/ce";
|
} else {
|
tips(res.msg, true)
|
}
|
})
|
}
|
|
// initCrnMsgTable();
|
function initCrnMsgTable(row) {
|
var line;
|
if (row === undefined){
|
var one = 15;
|
var total = matMsg.offsetHeight;
|
var count = total / one;
|
count = parseInt(count) - 1;
|
matMsgTableBlankRows = count;
|
line = count;
|
} else {
|
line = row;
|
}
|
var html = "";
|
for (var i = 0; i < line; i ++){
|
html += " <div>\n" +
|
" <span></span>\n" +
|
" <span></span>\n" +
|
" <span></span>\n" +
|
" <span></span>\n" +
|
" </div>\n";
|
}
|
ttbody.innerHTML = html;
|
}
|
|
// 添加表格数据
|
function addTableData(data) {
|
if (isEmpty(data.matName)){
|
tips("提取失败");
|
return;
|
}
|
var toPush = true;
|
for (var j=0;j<matData.length;j++){
|
if (data.matNo === matData[j].matNo) {
|
matData[j].count = Number(matData[j].count) + Number(data.count);
|
toPush = false;
|
}
|
}
|
if (toPush) {
|
matData.push(data);
|
}
|
var html = "";
|
for (var i=0;i<matData.length;i++) {
|
html += " <div class='table-data'>\n" +
|
" <span>" + matData[i].matNo + "</span>\n" +
|
" <span>" + matData[i].matName + "</span>\n" +
|
" <span>" + matData[i].str1 + "</span>\n" +
|
" <span>" + matData[i].count + "</span>\n" +
|
" </div>\n";
|
}
|
|
ttbody.innerHTML = html;
|
}
|
|
// 重置
|
function reset() {
|
code.value = "";
|
matNo.value = "";
|
cancel();
|
while(ttbody.hasChildNodes()) {
|
ttbody.removeChild(ttbody.firstChild);
|
|
}
|
}
|
|
/**
|
* 提示信息
|
* @param msg 提示内容
|
* @param warn true:红色字体
|
*/
|
function tips(msg, warn) {
|
tipDom.innerText = msg;
|
if (warn) {
|
tipDom.style.color = "red";
|
} else {
|
tipDom.style.color = "#000";
|
}
|
}
|
|
/**
|
* 详情
|
*/
|
// 提取
|
function confirm() {
|
addTableData({
|
matNo: matNo.value,
|
matName: matName.value,
|
str1: str1.value,
|
count: count.value
|
})
|
cancel();
|
tips("提取成功");
|
}
|
// 取消
|
function cancel() {
|
matNo.value = "";
|
matName.value = "";
|
str1.value = "";
|
count.value = initMatCount;
|
matMsg.style.display = 'block';
|
btnCon.style.display = 'block';
|
matDetail.style.display = 'none';
|
tips("");
|
}
|
|
function add() {
|
count.value = Number(count.value) + 1;
|
}
|
function reduce() {
|
if (count.value <= initMatCount) {
|
return;
|
}
|
count.value = count.value - 1;
|
}
|
|
//获取 cookie
|
function getCookie(objName){//获取指定名称的cookie的值
|
//多个cookie 保存的时候是以 ;空格 分开的
|
var arrStr = document.cookie.split("; ");
|
for (var i = 0; i < arrStr.length; i++) {
|
var temp = arrStr[i].split("=");
|
if (temp[0] === objName){
|
return decodeURIComponent(temp[1]);
|
}else{
|
return "";
|
}
|
|
}
|
}
|
|
function httpRequest(paramObj,fun,errFun) {
|
var xmlhttp = null;
|
/*创建XMLHttpRequest对象,
|
*老版本的 Internet Explorer(IE5 和 IE6)使用 ActiveX 对象:new ActiveXObject("Microsoft.XMLHTTP")
|
* */
|
if(window.XMLHttpRequest) {
|
xmlhttp = new XMLHttpRequest();
|
}else if(window.ActiveXObject) {
|
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
|
}
|
/*判断是否支持请求*/
|
if(xmlhttp == null) {
|
alert('你的浏览器不支持XMLHttp');
|
return;
|
}
|
/*请求方式,并且转换为大写*/
|
var httpType = (paramObj.type || 'GET').toUpperCase();
|
/*数据类型*/
|
var dataType = paramObj.dataType || 'json';
|
/*请求接口*/
|
var httpUrl = paramObj.httpUrl || '';
|
/*是否异步请求*/
|
var async = paramObj.async || true;
|
/*请求头参数*/
|
var headerData = paramObj.headers || [];
|
/*请求参数--post请求参数格式为:foo=bar&lorem=ipsum*/
|
var paramData = paramObj.data || [];
|
var requestData = '';
|
for(var name in paramData) {
|
requestData += name + '='+ paramData[name] + '&';
|
}
|
requestData = requestData === '' ? '' : requestData.substring(0,requestData.length - 1);
|
/*请求接收*/
|
xmlhttp.onreadystatechange = function() {
|
if(xmlhttp.readyState === 4 && xmlhttp.status === 200) {
|
/*成功回调函数*/
|
fun(JSON.parse(xmlhttp.responseText));
|
}else{
|
/*失败回调函数*/
|
errFun;
|
}
|
}
|
|
/*接口连接,先判断连接类型是post还是get*/
|
if(httpType === 'GET') {
|
xmlhttp.open("GET",httpUrl,async);
|
xmlhttp.send(null);
|
}else if(httpType === 'POST'){
|
xmlhttp.open("POST",httpUrl,async);
|
//发送合适的请求头信息
|
var defaultContentType = true;
|
for (var i=0;i<headerData.length;i++) {
|
for(var key in headerData[i]) {
|
if (key === "Content-type") {
|
defaultContentType = false;
|
}
|
xmlhttp.setRequestHeader(key, headerData[i][key]);
|
}
|
}
|
if (defaultContentType) {
|
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
|
}
|
xmlhttp.send(defaultContentType?requestData:paramData);
|
}
|
}
|
|
document.onkeyup = function (e) {
|
if (window.event)//如果window.event对象存在,就以此事件对象为准
|
e = window.event;
|
var key = e.charCode || e.keyCode;
|
if (key === 112) {
|
code.focus();
|
} else if (key === 113) {
|
matNo.focus();
|
} else if (key === 114) {
|
combBtn.focus();
|
} else if (key === 13) {
|
confirmBtn.focus();
|
}
|
}
|
|
document.onkeydown = function (e) {
|
if (window.event)//如果window.event对象存在,就以此事件对象为准
|
e = window.event;
|
var key = e.charCode || e.keyCode;
|
if (key === 114) {
|
comb()
|
}
|
}
|
|
function help() {
|
window.alert("① 按F1输入条码\n" +
|
"② 按F2输入商品编号,按ENTER查询,选择数量后提取\n" +
|
"③ 按F3开始组托\n" +
|
"其它:按F5刷新页面");
|
}
|
</script>
|
</html>
|