288 lines
9.5 KiB
HTML
288 lines
9.5 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="en">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<title>Title</title>
|
|||
|
|
<link rel="stylesheet" href="../css/mui_min.css">
|
|||
|
|
<link href="../css/mui_picker_min.css" rel="stylesheet"/>
|
|||
|
|
<link href="../css/mui_poppicker_css" rel="stylesheet"/>
|
|||
|
|
<script src="../script/api.js"></script>
|
|||
|
|
<script src="../script/mui.min.js"></script>
|
|||
|
|
<script src="../script/mui.picker.min.js"></script>
|
|||
|
|
<script src="../script/mui.poppicker.js"></script>
|
|||
|
|
</head>
|
|||
|
|
<style>
|
|||
|
|
.head {
|
|||
|
|
height: 10vh;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
border: 1px solid #a3caef;
|
|||
|
|
}
|
|||
|
|
.content{
|
|||
|
|
height: 79vh;
|
|||
|
|
box-sizing: border-box; border: 1px solid #a3caef;
|
|||
|
|
}
|
|||
|
|
.footer{
|
|||
|
|
height: 10vh;
|
|||
|
|
box-sizing: border-box; border: 1px solid #a3caef;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*.content {*/
|
|||
|
|
/* width: 100%;*/
|
|||
|
|
/* height: 100vh;*/
|
|||
|
|
/* box-sizing: border-box;*/
|
|||
|
|
/* !* background-color: #007aff; *!*/
|
|||
|
|
/* border: 1px solid #a3caef;*/
|
|||
|
|
/*}*/
|
|||
|
|
|
|||
|
|
.form {
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
border: 1px solid #a3caef;
|
|||
|
|
margin: 10px;
|
|||
|
|
padding: 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
input {
|
|||
|
|
font-size: xx-large;
|
|||
|
|
width: 300px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
border: 1px solid #a3caef;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
button {
|
|||
|
|
border-radius: 20px;
|
|||
|
|
}
|
|||
|
|
.flex {
|
|||
|
|
/*flex 布局*/
|
|||
|
|
display: flex;
|
|||
|
|
/*实现垂直居中*/
|
|||
|
|
align-items: center;
|
|||
|
|
/*实现水平居中*/
|
|||
|
|
justify-content: center;
|
|||
|
|
text-align: justify;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
.flex1 {
|
|||
|
|
/*flex 布局*/
|
|||
|
|
display: flex;
|
|||
|
|
/*实现垂直居中*/
|
|||
|
|
align-items: center;
|
|||
|
|
/*实现水平居中*/
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
text-align: justify;
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<body>
|
|||
|
|
<div class="mui-row">
|
|||
|
|
<div class="head flex mui-row">
|
|||
|
|
<div class="mui-col-sm-3" style="display:flex;align-items: center;">
|
|||
|
|
<button class="btnc mui-btn-inline mui-btn-danger" onclick="handleBackMain()">返回</button>
|
|||
|
|
</div>
|
|||
|
|
<div class="mui-col-sm-9" style="display:flex;justify-content: flex-end;">
|
|||
|
|
<button class="btnc mui-btn-inline mui-btn-danger" onclick="closeApp()" type='button'>关闭系统</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!--中间内容开始-->
|
|||
|
|
<div class="mui-row content">
|
|||
|
|
<div class="mui-col-sm-4">
|
|||
|
|
<div class="mui-row form flex1">
|
|||
|
|
<button class="mui-btn-inline mui-btn-info" style="font-size: large;" type='button'>绑定设备</button>
|
|||
|
|
<button id='initsb' class="mui-btn-inline mui-btn-primary" style="font-size: large;" type='button'>
|
|||
|
|
请选择设备
|
|||
|
|
</button>
|
|||
|
|
<button class="mui-btn-inline mui-btn-success" style="font-size: large;" onclick="initsb()">保存
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
<div class="mui-row form flex1">
|
|||
|
|
<button class="mui-btn-inline mui-btn-info" style="font-size: large;" type='button'>默认页面</button>
|
|||
|
|
<button id='initpage' class="mui-btn-inline mui-btn-primary" style="font-size: large;" type='button'>
|
|||
|
|
请选择页面
|
|||
|
|
</button>
|
|||
|
|
<input id="indexPage" type="hidden" value="">
|
|||
|
|
<button class="mui-btn-inline mui-btn-success" style="font-size: large;" onclick="initpage()">保存
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="mui-col-sm-4">
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="footer flex mui-row">
|
|||
|
|
<div class="mui-col-sm-12 flex"style="width:100%;height:8vh;white-space: nowrap !important;overflow-x: scroll;" id="list">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<script>
|
|||
|
|
|
|||
|
|
var carListener = null;
|
|||
|
|
var pageListener = null;
|
|||
|
|
var userPicker;
|
|||
|
|
var pagePicker;
|
|||
|
|
var pickData = [];
|
|||
|
|
var btnArray = ['取消', '<b style="font-weight:900">确认</b>'];
|
|||
|
|
var pageData = []
|
|||
|
|
pageData.push({value: "index", text: "首页"})
|
|||
|
|
pageData.push({value: "index1", text: "装料页面"})
|
|||
|
|
pageData.push({value: "collection", text: "剩料收集页面"})
|
|||
|
|
pageData.push({value: "config", text: "设置页面"})
|
|||
|
|
|
|||
|
|
function init() {
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var apiready = function apiready() {
|
|||
|
|
initSbList()
|
|||
|
|
init()
|
|||
|
|
muiInitPage()
|
|||
|
|
var indexPage = api.getPrefs({
|
|||
|
|
sync: true,
|
|||
|
|
key: 'initpage'
|
|||
|
|
});
|
|||
|
|
if (indexPage) {
|
|||
|
|
pageData.forEach(p => {
|
|||
|
|
if (indexPage === p.value) {
|
|||
|
|
document.getElementById('initpage').innerHTML = p.text
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//返回主页
|
|||
|
|
function handleBackMain() {
|
|||
|
|
api.closeWin();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function closeApp() {
|
|||
|
|
mui.confirm('确认关闭TMR饲喂系统？', '提示', btnArray, function (e) {
|
|||
|
|
if (e.index == 0) {
|
|||
|
|
} else {
|
|||
|
|
api.closeWidget({
|
|||
|
|
id: api.appId, //应用ID
|
|||
|
|
retData: {name: 'closeWidget'},
|
|||
|
|
silent: true
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 初始化设备查询
|
|||
|
|
function initSbList() {
|
|||
|
|
pickData = [];
|
|||
|
|
api.ajax({
|
|||
|
|
url: 'https://tmr.nxcyx.com/api/app/tmr/sbList?sourceCow=' + api.getPrefs({sync: true, key: 'sourceCow'}),
|
|||
|
|
method: 'get',
|
|||
|
|
timeout: 5
|
|||
|
|
}, function (ret, err) {
|
|||
|
|
if (ret) {
|
|||
|
|
var initsb = api.getPrefs({
|
|||
|
|
sync: true,
|
|||
|
|
key: 'initsb'
|
|||
|
|
});
|
|||
|
|
ret.data.forEach(function (e) {
|
|||
|
|
if (initsb === e.name) {
|
|||
|
|
var json = {value: e.sbId, text: e.name};
|
|||
|
|
pickData.push(json);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
ret.data.forEach(function (e) {
|
|||
|
|
if (initsb !== e.name) {
|
|||
|
|
var json = {value: e.sbId, text: e.name};
|
|||
|
|
pickData.push(json);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
document.getElementById('initsb').innerHTML = pickData[0].text;
|
|||
|
|
muiInit();
|
|||
|
|
} else {
|
|||
|
|
mui.alert("sbList:" + err.msg);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 初始化设备下拉
|
|||
|
|
function muiInit() {
|
|||
|
|
(function ($, doc) {
|
|||
|
|
$.init();
|
|||
|
|
$.ready(function () {
|
|||
|
|
/**
|
|||
|
|
* 获取对象属性的值
|
|||
|
|
* 主要用于过滤三级联动中，可能出现的最低级的数据不存在的情况，实际开发中需要注意这一点；
|
|||
|
|
* @param {Object} obj 对象
|
|||
|
|
* @param {String} param 属性名
|
|||
|
|
*/
|
|||
|
|
var _getParam = function _getParam(obj, param) {
|
|||
|
|
return obj[param] || '';
|
|||
|
|
};
|
|||
|
|
if (userPicker) {
|
|||
|
|
} else {
|
|||
|
|
userPicker = new $.PopPicker();
|
|||
|
|
var showUserPickerButton = doc.getElementById('initsb');
|
|||
|
|
carListener = null;
|
|||
|
|
carListener = showUserPickerButton.addEventListener('tap', function (event) {
|
|||
|
|
userPicker.show(function (items) {
|
|||
|
|
console.log('设备切换');
|
|||
|
|
showUserPickerButton.innerHTML = items[0].text;
|
|||
|
|
});
|
|||
|
|
}, false);
|
|||
|
|
}
|
|||
|
|
userPicker.setData(pickData);
|
|||
|
|
});
|
|||
|
|
})(mui, document);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function muiInitPage() {
|
|||
|
|
(function ($, doc) {
|
|||
|
|
$.init();
|
|||
|
|
$.ready(function () {
|
|||
|
|
/**
|
|||
|
|
* 获取对象属性的值
|
|||
|
|
* 主要用于过滤三级联动中，可能出现的最低级的数据不存在的情况，实际开发中需要注意这一点；
|
|||
|
|
* @param {Object} obj 对象
|
|||
|
|
* @param {String} param 属性名
|
|||
|
|
*/
|
|||
|
|
var _getParam = function _getParam(obj, param) {
|
|||
|
|
return obj[param] || '';
|
|||
|
|
};
|
|||
|
|
if (pagePicker) {
|
|||
|
|
} else {
|
|||
|
|
pagePicker = new $.PopPicker();
|
|||
|
|
var showPagePickerButton = doc.getElementById('initpage');
|
|||
|
|
pageListener = null;
|
|||
|
|
pageListener = showPagePickerButton.addEventListener('tap', function (event) {
|
|||
|
|
pagePicker.show(function (items) {
|
|||
|
|
console.log('设备切换');
|
|||
|
|
document.getElementById('indexPage').value = items[0].value;
|
|||
|
|
showPagePickerButton.innerHTML = items[0].text;
|
|||
|
|
});
|
|||
|
|
}, false);
|
|||
|
|
}
|
|||
|
|
pagePicker.setData(pageData);
|
|||
|
|
});
|
|||
|
|
})(mui, document);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initsb() {
|
|||
|
|
// var value = document.getElementById('initsb').value;
|
|||
|
|
var value = document.getElementById('initsb').innerHTML
|
|||
|
|
if (value) {
|
|||
|
|
api.setPrefs({
|
|||
|
|
key: 'initsb',
|
|||
|
|
value: value
|
|||
|
|
});
|
|||
|
|
mui.alert('绑定设备"' + value + '"成功');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function initpage() {
|
|||
|
|
var value = document.getElementById('indexPage').value;
|
|||
|
|
if (value) {
|
|||
|
|
api.setPrefs({
|
|||
|
|
key: 'initpage',
|
|||
|
|
value: value
|
|||
|
|
});
|
|||
|
|
var name = document.getElementById('initpage').innerHTML;
|
|||
|
|
mui.alert('默认页面"' + name + '"设置成功');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|