TMRAppBle/html/config.html

709 lines
27 KiB
HTML
Raw Normal View History

<!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%;
}
.save{
display: flex;
/*实现垂直居中*/
align-items: center;
/*实现水平居中*/
justify-content: flex-end;
text-align: justify;
}
.btnc:active {
animation: clickAnimation 0.2s ease forwards;
}
@keyframes clickAnimation {
0% { transform: scale(1); } /* 起始状态为原大小 */
100% { transform: scale(0.95); } /* 结束状态为稍微收缩的大小 */
}
</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-6">
<div class="mui-row form">
<div class="mui-col-xs-8" style="display:flex;justify-content: flex-start;">
<text class="flex1" style="font-size: x-large;margin-left:15px;font-weight: 900;">绑定设备:</text>
<button id='initsb' class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;">请选择</button>
</div>
<div class="mui-col-xs-4" style="display:flex;justify-content: flex-end;">
<!-- <button class="save mui-btn-inline mui-btn-primary" style="font-size: large;" onclick="initsb()">保存</button>-->
</div>
</div>
<div class="mui-row form">
<div class="mui-col-xs-8" style="display:flex;justify-content: flex-start;">
<text class="flex1" style="font-size: x-large;margin-left:15px;font-weight: 900;">默认页面:</text>
<button id='initpage' class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;" >请选择</button>
<input id="indexPage" type="hidden" value="">
</div>
<div class="mui-col-xs-4" style="display:flex;justify-content: flex-end;">
<!-- <button class="save mui-btn-inline mui-btn-primary" style="font-size: large;" onclick="initpage()">保存</button>-->
</div>
</div>
<div class="mui-row form">
<div class="mui-col-xs-8" style="display:flex;justify-content: flex-start;">
<text class="flex1" style="font-size: x-large;margin-left:15px;font-weight: 900;">装料校准:</text>
<button id='fixbeforeload' class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;" >请选择</button>
<input id="isfix" type="hidden" value="">
</div>
<div class="mui-col-xs-4" style="display:flex;justify-content: flex-end;">
<!-- <button class="save mui-btn-inline mui-btn-primary" style="font-size: large;" onclick="fixbeforeload()">保存</button>-->
</div>
</div>
2024-01-02 10:31:23 +08:00
</div>
<div class="mui-col-sm-6">
<div class="mui-row form">
<div class="mui-col-xs-8" style="display:flex;justify-content: flex-start;">
<text class="flex1" style="font-size: x-large;margin-left:15px;font-weight: 900;">自动跳转:</text>
<button id='jump' class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;" >请选择</button>
<input id="isJump" type="hidden" value="">
</div>
<div class="mui-col-xs-4" style="display:flex;justify-content: flex-end;">
</div>
</div>
<div class="mui-row form">
<div class="mui-col-xs-8" style="display:flex;justify-content: flex-start;">
<text class="flex1" style="font-size: x-large;margin-left:15px;font-weight: 900;">跳转时长:</text>
<button id='weightSize' class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;" >请选择</button>
</div>
<div class="mui-col-xs-4" style="display:flex;justify-content: flex-end;">
<!-- <button class="save mui-btn-inline mui-btn-primary" style="font-size: large;" onclick="weightSizeSave()">保存</button>-->
</div>
</div>
<div class="mui-row form">
<div class="mui-col-xs-8" style="display:flex;justify-content: flex-start;">
<text class="flex1" style="font-size: x-large;margin-left:15px;font-weight: 900;">称LED比</text>
<button id='btl' class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;" >请选择</button>
</div>
<div class="mui-col-xs-4" style="display:flex;justify-content: flex-end;">
<!-- <button class="save mui-btn-inline mui-btn-primary" style="font-size: large;" onclick="weightSizeSave()">保存</button>-->
</div>
</div>
<div class="mui-row form">
<div class="mui-col-xs-8" style="display:flex;justify-content: flex-start;">
<text class="flex1" style="font-size: x-large;margin-left:15px;font-weight: 900;">稳定阈值:</text>
<button id='threshold' class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;" >请选择</button>
</div>
<div class="mui-col-xs-4" style="display:flex;justify-content: flex-end;">
<!-- <button class="save mui-btn-inline mui-btn-primary" style="font-size: large;" onclick="weightSizeSave()">保存</button>-->
</div>
</div>
<!-- <button class="flex1 mui-btn-inline mui-btn-info" style="font-size: large;color: seagreen !important;" onclick="downloadApp()">下载文件</button>-->
</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 fixListener = null;
2024-01-02 10:31:23 +08:00
var jumpListener = null;
var weiListener = null;
var btlListener = null;
var thresholdListener = null;
var userPicker;
var pagePicker;
var fixPicker;
2024-01-02 10:31:23 +08:00
var jumpPicker;
var weiPicker;
var btlPicker;
var thresholdPicker;
var pickData = [];
var btnArray = ['取消', '<b style="font-weight:900">确认</b>'];
var pageData = []
var fixData = []
2024-01-02 10:31:23 +08:00
var jumpData = []
var weiData = []
var btlData = []
var thresholdData = []
fixData.push({value: 0, text: "需要"})
fixData.push({value: 1, text: "不需要"})
2024-01-02 10:31:23 +08:00
jumpData.push({value: 0, text: "自动跳转"})
jumpData.push({value: 1, text: "不自动跳转"})
pageData.push({value: "index", text: "首页"})
pageData.push({value: "index1", text: "装料页面"})
pageData.push({value: "collection", text: "剩料收集页面"})
pageData.push({value: "config", text: "设置页面"})
pageData.push({value: "chanche", text: "铲车页面"})
thresholdData.push({value: "5", text: "5"})
thresholdData.push({value: "10", text: "10"})
thresholdData.push({value: "20", text: "20"})
thresholdData.push({value: "30", text: "30"})
thresholdData.push({value: "40", text: "40"})
thresholdData.push({value: "50", text: "50"})
thresholdData.push({value: "60", text: "60"})
thresholdData.push({value: "70", text: "70"})
thresholdData.push({value: "80", text: "80"})
weiData.push({value: "1", text: "1"})
weiData.push({value: "2", text: "2"})
weiData.push({value: "3", text: "3"})
weiData.push({value: "4", text: "4"})
weiData.push({value: "5", text: "5"})
weiData.push({value: "6", text: "6"})
weiData.push({value: "7", text: "7"})
weiData.push({value: "8", text: "8"})
weiData.push({value: "9", text: "9"})
weiData.push({value: "10", text: "10"})
btlData.push({value: "1", text: "1"})
btlData.push({value: "2", text: "2"})
btlData.push({value: "3", text: "3"})
btlData.push({value: "4", text: "4"})
btlData.push({value: "5", text: "5"})
btlData.push({value: "6", text: "6"})
btlData.push({value: "7", text: "7"})
btlData.push({value: "8", text: "8"})
btlData.push({value: "9", text: "9"})
btlData.push({value: "10", text: "10"})
var apiready = function apiready() {
initSbList()
}
function downloadApp(){
var mam = api.require('mam');
mam.checkUpdate(function(ret, err) {
if (ret) {
console.log(JSON.stringify(ret))
}
})
// api.download({
// url: 'https://tmr.nxcyx.com/apk/TMRv2.0.5.apk',
// savePath: 'fs://TMRv2.0.6.apk',
// report: true,
// cache: true,
// allowResume: true
// }, function(ret, err) {
// console.log(JSON.stringify(ret))
// if (ret.state == 1) {
// //下载成功
// } else {
// console.log(JSON.stringify(err))
// }
// });
}
//返回主页
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'}),
// url: 'http://192.168.0.107:8081/api/sbList?sourceCow=' + api.getPrefs({sync: true, key: 'sourceCow'}),
method: 'get',
timeout: 5
}, function (ret, err) {
if (ret) {
api.showProgress({
title: '初始化中...',
modal: true
});
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();
muiInitPage()
muiInitFix()
2024-01-02 10:31:23 +08:00
muiInitJump()
muiInitWeightSize()
muiInitBtl()
muiInitThe()
var indexPage = api.getPrefs({
sync: true,
key: 'initpage'
});
if (indexPage) {
pageData.forEach(p => {
if (indexPage === p.value) {
document.getElementById('initpage').innerHTML = p.text
}
})
}
var requireFix = api.getPrefs({
sync: true,
key: 'fixbeforeload'
});
if (requireFix) {
fixData.forEach(p => {
if (requireFix == p.value) {
document.getElementById('fixbeforeload').innerHTML = p.text
}
})
}
2024-01-02 10:31:23 +08:00
var requireJump = api.getPrefs({
sync: true,
key: 'jump'
});
if (requireJump) {
jumpData.forEach(p => {
if (requireJump == p.value) {
document.getElementById('jump').innerHTML = p.text
}
})
}
var weightSize = api.getPrefs({
sync: true,
key: 'weightSize'
});
if (weightSize) {
weiData.forEach(p => {
if (weightSize === p.value) {
console.log(requireFix === p.value)
document.getElementById('weightSize').innerHTML = p.text
}
})
}
var btl = api.getPrefs({
sync: true,
key: 'btl'
});
if (btl) {
btlData.forEach(p => {
if (btl === p.value) {
document.getElementById('btl').innerHTML = p.text
}
})
}
var threshold = api.getPrefs({
sync: true,
key: 'threshold'
});
if (threshold) {
thresholdData.forEach(p => {
if (threshold === p.value) {
document.getElementById('threshold').innerHTML = p.text
}
})
}
setTimeout(function () {
api.hideProgress();
}, 1000);
} 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;
if (items[0].text){
initsb()
}
});
}, 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) {
document.getElementById('indexPage').value = items[0].value;
showPagePickerButton.innerHTML = items[0].text;
if (items[0].text){
initpage()
}
});
}, false);
}
pagePicker.setData(pageData);
});
})(mui, document);
}
function muiInitFix() {
(function ($, doc) {
$.init();
$.ready(function () {
/**
* 获取对象属性的值
* 主要用于过滤三级联动中,可能出现的最低级的数据不存在的情况,实际开发中需要注意这一点;
* @param {Object} obj 对象
* @param {String} param 属性名
*/
var _getParam = function _getParam(obj, param) {
return obj[param] || '';
};
if (fixPicker) {
} else {
fixPicker = new $.PopPicker();
var showFixPickerButton = doc.getElementById('fixbeforeload');
fixListener = null;
fixListener = showFixPickerButton.addEventListener('tap', function (event) {
fixPicker.show(function (items) {
document.getElementById('isfix').value = items[0].value;
showFixPickerButton.innerHTML = items[0].text;
if (items[0].text){
fixbeforeload()
}
});
}, false);
}
fixPicker.setData(fixData);
});
})(mui, document);
}
2024-01-02 10:31:23 +08:00
function muiInitJump() {
(function ($, doc) {
$.init();
$.ready(function () {
var _getParam = function _getParam(obj, param) {
return obj[param] || '';
};
if (jumpPicker) {
} else {
jumpPicker = new $.PopPicker();
var showJumpPickerButton = doc.getElementById('jump');
jumpListener = null;
jumpListener = showJumpPickerButton.addEventListener('tap', function (event) {
jumpPicker.show(function (items) {
document.getElementById('isJump').value = items[0].value;
showJumpPickerButton.innerHTML = items[0].text;
if (items[0].text){
jump()
}
});
}, false);
}
jumpPicker.setData(jumpData);
});
})(mui, document);
}
function muiInitWeightSize() {
(function ($, doc) {
$.init();
$.ready(function () {
/**
* 获取对象属性的值
* 主要用于过滤三级联动中,可能出现的最低级的数据不存在的情况,实际开发中需要注意这一点;
* @param {Object} obj 对象
* @param {String} param 属性名
*/
var _getParam = function _getParam(obj, param) {
return obj[param] || '';
};
if (weiPicker) {
} else {
weiPicker = new $.PopPicker();
var showWeiPickerButton = doc.getElementById('weightSize');
weiListener = null;
weiListener = showWeiPickerButton.addEventListener('tap', function (event) {
weiPicker.show(function (items) {
showWeiPickerButton.innerHTML = items[0].text;
if (items[0].text){
weightSizeSave()
}
});
}, false);
}
weiPicker.setData(weiData);
});
})(mui, document);
}
function muiInitBtl() {
(function ($, doc) {
$.init();
$.ready(function () {
var _getParam = function _getParam(obj, param) {
return obj[param] || '';
};
if (btlPicker) {
} else {
btlPicker = new $.PopPicker();
var showBtlPickerButton = doc.getElementById('btl');
btlListener = null;
btlListener = showBtlPickerButton.addEventListener('tap', function (event) {
btlPicker.show(function (items) {
showBtlPickerButton.innerHTML = items[0].text;
if (items[0].text){
btlSave()
}
});
}, false);
}
btlPicker.setData(btlData);
});
})(mui, document);
}
function muiInitThe() {
(function ($, doc) {
$.init();
$.ready(function () {
var _getParam = function _getParam(obj, param) {
return obj[param] || '';
};
if (thresholdPicker) {
} else {
thresholdPicker = new $.PopPicker();
var showThePickerButton = doc.getElementById('threshold');
thresholdListener = null;
thresholdListener = showThePickerButton.addEventListener('tap', function (event) {
thresholdPicker.show(function (items) {
showThePickerButton.innerHTML = items[0].text;
if (items[0].text){
thresholdSave()
}
});
}, false);
}
thresholdPicker.setData(thresholdData);
});
})(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 + '"设置成功');
}
}
function weightSizeSave(){
var value = document.getElementById('weightSize').innerHTML;
if (value) {
api.setPrefs({
key: 'weightSize',
value: value
});
mui.alert('自动跳转时长"' + value + '"秒设置成功');
}
}
function btlSave(){
var value = document.getElementById('btl').innerHTML;
if (value) {
api.setPrefs({
key: 'btl',
value: value
});
mui.alert('称LED接收发送比"' + value + '"设置成功');
}
}
function thresholdSave(){
var value = document.getElementById('threshold').innerHTML;
if (value) {
api.setPrefs({
key: 'threshold',
value: value
});
mui.alert('稳定阈值"' + value + '"kg设置成功');
}
}
function fixbeforeload(){
var value = document.getElementById('isfix').value;
if (value) {
api.setPrefs({
key: 'fixbeforeload',
value: value
});
var name = document.getElementById('fixbeforeload').innerHTML;
mui.alert('装料前校准"' + name + '"设置成功');
}
}
2024-01-02 10:31:23 +08:00
function jump(){
var value = document.getElementById('isJump').value;
if (value) {
console.log(value)
api.setPrefs({
key: 'jump',
value: value
});
var name = document.getElementById('jump').innerHTML;
mui.alert(name + '"设置成功');
}
}
</script>
</body>
</html>