644 lines
22 KiB
HTML
644 lines
22 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
||
<title>Document</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/index.js"></script>
|
||
<script src="../script/ble.js"></script>
|
||
<script src="../script/electric.js"></script>
|
||
<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>
|
||
<script src="../script/echarts.js"></script>
|
||
|
||
</head>
|
||
|
||
<style>
|
||
body{
|
||
/*background-color: rgba(255, 255, 255, 0.96);*/
|
||
}
|
||
.head{
|
||
/*background-color: chartreuse;*/
|
||
height: 10vh;
|
||
box-sizing: border-box; border: 1px solid #a3caef;
|
||
}
|
||
.content{
|
||
height: 80vh;
|
||
box-sizing: border-box; border: 1px solid #a3caef;
|
||
}
|
||
.centerLeft{
|
||
/*background-color: #2ac845;*/
|
||
height: 80vh;
|
||
box-sizing: border-box; border: 1px solid #a3caef;
|
||
overflow: auto;
|
||
}
|
||
.centerRight{
|
||
/*background-color: #007aff;*/
|
||
height: 80vh;
|
||
box-sizing: border-box; border: 1px solid #a3caef;
|
||
}
|
||
.footer{
|
||
/*background-color: chocolate;*/
|
||
height: 10vh;
|
||
box-sizing: border-box; border: 1px solid #a3caef;
|
||
}
|
||
.flex{
|
||
/*flex 布局*/
|
||
display: flex;
|
||
/*实现垂直居中*/
|
||
align-items: center;
|
||
/*实现水平居中*/
|
||
justify-content: flex-start;
|
||
text-align: justify;
|
||
width:100%;
|
||
margin:0 auto;
|
||
}
|
||
.flex2{
|
||
/*flex 布局*/
|
||
display: flex;
|
||
/*实现垂直居中*/
|
||
align-items: center;
|
||
/*实现水平居中*/
|
||
justify-content: flex-end;
|
||
text-align: justify;
|
||
width:100%;
|
||
height: 10vh;
|
||
margin:0 auto;
|
||
}
|
||
.btnc {
|
||
margin-left: 15px;
|
||
/* margin-right: 15px; */
|
||
font-size: x-large;
|
||
font-weight: 900;
|
||
border-radius: 20px;
|
||
}
|
||
.echarts_item {
|
||
width: 50%;
|
||
/*background-color: #007aff;*/
|
||
height: 68vh;
|
||
}
|
||
.trains {
|
||
background-color: #407ae6
|
||
}
|
||
.dis {
|
||
display: none;
|
||
font-size: 25px;
|
||
}
|
||
|
||
/*toast信息提示*/
|
||
.mui-toast-container {
|
||
bottom: 50% !important;
|
||
}
|
||
|
||
.mui-toast-message {
|
||
/* background: url(/app/themes/default/images/toast.png) no-repeat center 10px #407ae6;
|
||
opacity: 1; */
|
||
font-size: x-large;
|
||
/* color: #fff;
|
||
*/
|
||
width: 100%;
|
||
padding: 20px 10px 20px 10px;
|
||
}
|
||
|
||
.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-xs-6" style="display:flex;align-items: center;">
|
||
<button class="btnc mui-btn-inline mui-btn-danger" onclick="handleBackMain()">返回</button>
|
||
<button id='showUserPicker' class="btnc mui-btn-inline mui-btn-primary" type='button'>请选择设备</button>
|
||
<text id='batchName' style="font-size: x-large;margin-left:15px;font-weight: 900;"></text>
|
||
<button class="btnc mui-btn-inline mui-btn-primary" type='button' onclick="refreshDayPlan()">更新计划</button>
|
||
</div>
|
||
<div class="mui-col-xs-6" style="display:flex;justify-content: flex-end;">
|
||
|
||
<button class="btnc mui-btn-inline mui-btn-danger" onclick="closeApp()" type='button'>关闭系统</button>
|
||
<button id="driveName" class="btnc mui-btn-info" type="button" onclick="handleBackSys()">机车手</button>
|
||
<button id='wifiDom' class="btnc mui-btn-inline mui-btn-info"
|
||
style="color: seagreen !important;" type='button' onclick="rescan()"></button>
|
||
<button id='showBlePicker' class="btnc mui-btn-inline mui-btn-primary dis" type='button'>连接蓝牙</button>
|
||
</div>
|
||
</div>
|
||
<!--中间内容开始-->
|
||
<div class="mui-row content">
|
||
<!--中间左边开始-->
|
||
<div class="mui-col-xs-3 centerLeft">
|
||
<ul class="mui-table-view" id="train"
|
||
style="text-align: left;line-height: 60px;font-size: xx-large;font-weight: 900;">
|
||
</ul>
|
||
</div>
|
||
<!--中间右边开始-->
|
||
<div class="mui-col-xs-9 centerRight mui-row">
|
||
<div class="mui-scroll-wrapper mui-col-sm-12 "
|
||
style="width:100%;height:5vh;white-space: nowrap !important;overflow-x: scroll;" id="feedList">
|
||
</div>
|
||
<div class="mui-row mui-col-sm-12" >
|
||
<div id="echarts_main_one" class="mui-col-sm-6 echarts_item"></div>
|
||
<div id="echarts_main_two" class="mui-col-sm-6 echarts_item"></div>
|
||
<div class="mui-col-sm-12 flex2">
|
||
<button class="btnc mui-btn-success" style="font-size: xx-large;" type="button" id="fix" onclick="weightFix()">校准计划</button>
|
||
<text id='nowFeed' style="font-size:x-large;font-weight: 900;margin-left:10px; "></text>
|
||
<text id='feedNum' style="font-size: x-large;font-weight: 900;"></text>
|
||
<!-- <button class="btnc mui-btn-success" id="startLoad" style="font-size: xx-large;width: 20%;;"
|
||
onclick="startLoad()">开始装料</button> -->
|
||
<button class="btnc mui-btn-success dis" id="submitData" style="font-size: xx-large;"
|
||
onclick="submitData()">上传</button>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!--尾部信息开始-->
|
||
<div class="footer flex mui-row">
|
||
<div class="mui-col-xs-2" >
|
||
<text id="text" style="margin-left: 20px;font-weight: 900;font-size: x-large;" onclick="updateApp()"></text>
|
||
</div>
|
||
<div class="mui-col-xs-9" id="timeList" >
|
||
|
||
</div>
|
||
<div class="mui-col-xs-1" >
|
||
<text id="isfix" style="margin-left: 20px;font-weight: 900;font-size: x-large;" ><font style="color:red;font-size: x-large;">未校准</font></text>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script type="text/javascript">
|
||
'use strict';
|
||
|
||
//默认自动跳转速度
|
||
let weightSize = 3;
|
||
//默认称Led比
|
||
let shujubao = 1;
|
||
let threshold = 20;
|
||
let weightBeforefix = '1';
|
||
let autoJump = '1';
|
||
|
||
//车次，蓝牙点击监听事件
|
||
let carListener = null;
|
||
let bleListener = null;
|
||
let userPicker;
|
||
let blePicker;
|
||
let pickData = [];
|
||
let bleData = [];
|
||
|
||
let btnArray = ['取消', '<b style="font-weight:900">确认</b>'];
|
||
// 初始化echarts Dom
|
||
let weightChartDom = document.getElementById('echarts_main_two');
|
||
let weightMyChart = echarts.init(weightChartDom);
|
||
let feedChartDom = document.getElementById('echarts_main_one');
|
||
let feedMyChart = echarts.init(feedChartDom);
|
||
let _outerRadius = 215;
|
||
let _innerRadius = 185;
|
||
let _pointerInnerRadius = 120;
|
||
let _insidePanelRadius = 180;
|
||
|
||
let fontsize = 80;
|
||
//车次饲料列表
|
||
let feedList = [];
|
||
let feedIndex = 0;
|
||
|
||
let driverName = '';
|
||
let sbId = null;
|
||
let feedName = '';
|
||
let remark = '手动上传';
|
||
let templetType = '';
|
||
let classCode = 1;
|
||
let trainNumber = 1;
|
||
let minutes = 0;
|
||
let templateName = '';
|
||
|
||
//车次列表
|
||
let trainArr = [];
|
||
let trainIndex = 0;
|
||
//班次名称
|
||
let batchName = '';
|
||
// 装料状态还是卸料状态 true装料
|
||
let load = true;
|
||
// 装料前总重量
|
||
let beforeWeight = 0;
|
||
// 计划车次总重量
|
||
let _weightSum = 0;
|
||
let weightDataFilter;
|
||
weightDataFilter = new WeightDataFilter(100, 20);
|
||
var wendinSize = [];
|
||
|
||
// 计划重量
|
||
let _planSum = 0;
|
||
//实时总重量
|
||
let nowWeight = 0;
|
||
//差值装料重量
|
||
let _feedNum = 0;
|
||
//允许误差
|
||
let allow = 0;
|
||
//装第一个饲料
|
||
let first = true;
|
||
//结果上传，车内总重量上传，语音播报等定时任务
|
||
let resultInterval = null;
|
||
let totalInterval = null;
|
||
let textInterval = null;
|
||
//echarts类型 多/少
|
||
let echartsType = '';
|
||
//LED字符卡模块
|
||
let zfk;
|
||
//蓝牙模块
|
||
let ble;
|
||
//本地数据库模块
|
||
let db;
|
||
//数字样式
|
||
let UNICODE_CHARS = {
|
||
1: "①",
|
||
2: "②",
|
||
3: "③",
|
||
4: "④",
|
||
5: "⑤",
|
||
6: "⑥",
|
||
7: "⑦",
|
||
8: "⑧",
|
||
9: "⑨",
|
||
10: "⑩",
|
||
11: "⑪",
|
||
12: "⑫",
|
||
13: "⑬",
|
||
14: "⑭",
|
||
15: "⑮",
|
||
16: "⑯",
|
||
17: "⑰",
|
||
18: "⑱",
|
||
19: "⑲",
|
||
20: "⑳",
|
||
21: "㉑",
|
||
22: "㉒",
|
||
23: "㉓",
|
||
24: "㉔",
|
||
25: "㉕",
|
||
26: "㉖",
|
||
27: "㉗",
|
||
28: "㉘",
|
||
29: "㉙",
|
||
30: "㉚"
|
||
};
|
||
var apiready = function apiready() {
|
||
// 获取db连接
|
||
db = api.require('db');
|
||
db.openDatabase({
|
||
name: 'test',
|
||
path: 'fs://Database/cqjiouzai.db'
|
||
}, function (ret, err) {
|
||
if (ret.status) {
|
||
initFeedResult();
|
||
} else {
|
||
console.log(JSON.stringify(err))
|
||
}
|
||
});
|
||
|
||
clearInterval(resultInterval);
|
||
clearInterval(totalInterval);
|
||
clearInterval(textInterval);
|
||
|
||
ble = api.require('ble');
|
||
zfk = api.require("moduleDemo");
|
||
|
||
//获取自动跳转速度
|
||
var size = api.getPrefs({sync: true, key: 'weightSize'})
|
||
if (size && !isNaN(size)) {
|
||
weightSize = Number(size)
|
||
}
|
||
//获取是否需要校准
|
||
var fixbeforeload = api.getPrefs({sync: true, key: 'fixbeforeload'});
|
||
if (fixbeforeload) {
|
||
weightBeforefix = fixbeforeload;
|
||
}
|
||
//获取是否开启自动跳转
|
||
var jump = api.getPrefs({sync: true, key: 'jump'});
|
||
if (jump) {
|
||
autoJump = jump;
|
||
}
|
||
//获取称LED比
|
||
var btl = api.getPrefs({sync: true, key: 'btl'})
|
||
if (btl && !isNaN(btl)) {
|
||
shujubao = Number(btl)
|
||
}
|
||
var threshold = api.getPrefs({sync: true, key: 'threshold'})
|
||
if (threshold && !isNaN(threshold)) {
|
||
threshold = Number(threshold)
|
||
}
|
||
//初始化页面数据
|
||
initPage();
|
||
//定时上传任务
|
||
resultInterval = setInterval(function () {
|
||
select(db, 'SELECT * FROM t_tmr_result', function (ret, err) {
|
||
if (!ret.status) {
|
||
console.log(JSON.stringify(err))
|
||
}
|
||
var data = ret.data
|
||
if (data.length > 0) {
|
||
var d = data[0]
|
||
var r = JSON.parse(d.text);
|
||
api.ajax({
|
||
url: 'https://tmr.nxcyx.com/api/app/tmr/resultUpload',
|
||
headers: {
|
||
'Content-Type': 'application/json;charset=utf-8' //建议key使用首字母大写的形式，如 User-Agent
|
||
},
|
||
method: 'post',
|
||
data: {
|
||
body: r
|
||
}
|
||
}, function (ret, err) {
|
||
if (ret.code === 200) {
|
||
//上传成功后删除
|
||
execute(db, "delete from t_tmr_result where id = '" + d.id + "'", function (ret, err) {
|
||
if (!ret.status) {
|
||
console.log(JSON.stringify(err))
|
||
}
|
||
})
|
||
} else {
|
||
console.log(r.name + '上传失败')
|
||
addNotice(4, 'red', 'submitData,' + err.msg);
|
||
}
|
||
});
|
||
// data.forEach(d => {
|
||
//
|
||
// })
|
||
}
|
||
})
|
||
}, 3000);
|
||
};
|
||
|
||
// 初始化页面
|
||
function initPage() {
|
||
mui.toast('初始化页面',{duration:1500,type:'div'});
|
||
initUserSb();
|
||
}
|
||
|
||
//创饲喂结果表
|
||
function initFeedResult() {
|
||
select(db, 'SELECT * FROM t_tmr_result', function(ret, err) {
|
||
if (ret.status === false || err.status === false) {
|
||
execute(db, 'CREATE TABLE t_tmr_result(id varchar(50),text varchar(2000))', function(ret, err) {
|
||
if (ret.status === true) {
|
||
console.log('创建饲喂结果表成功');
|
||
}else {
|
||
console.log(JSON.stringify(err))
|
||
}
|
||
});
|
||
console.log('饲喂结果表不存在');
|
||
} else {
|
||
console.log('饲喂结果表已存在');
|
||
}
|
||
});
|
||
select(db, 'SELECT * FROM t_ble_msg', function(ret, err) {
|
||
if (ret.status === false || err.status === false) {
|
||
execute(db, 'CREATE TABLE t_ble_msg(id INTEGER,text varchar(100))', function(ret, err) {
|
||
if (ret.status === true) {
|
||
console.log('创建蓝牙队列表成功');
|
||
}else {
|
||
console.log(JSON.stringify(err))
|
||
}
|
||
});
|
||
console.log('蓝牙队列表不存在');
|
||
} else {
|
||
console.log('蓝牙队列表已存在');
|
||
var sql = "delete from t_ble_msg";
|
||
execute(db, sql, function (ret, err) {
|
||
if (!ret.status) {
|
||
console.log(JSON.stringify(err))
|
||
}else{
|
||
console.log('删除成功')
|
||
}
|
||
})
|
||
}
|
||
});
|
||
}
|
||
|
||
// 初始化设备下拉
|
||
function bleInit(){
|
||
(function ($, doc) {
|
||
var showBlePickerButton = doc.getElementById('showBlePicker');
|
||
$.init();
|
||
$.ready(function () {
|
||
/**
|
||
* 获取对象属性的值
|
||
* 主要用于过滤三级联动中，可能出现的最低级的数据不存在的情况，实际开发中需要注意这一点；
|
||
* @param {Object} obj 对象
|
||
* @param {String} param 属性名
|
||
*/
|
||
var _getParam = function _getParam(obj, param) {
|
||
return obj[param] || '';
|
||
};
|
||
if (blePicker) {
|
||
} else {
|
||
blePicker = new $.PopPicker();
|
||
bleListener = null;
|
||
showBlePickerButton.addEventListener('tap', function (event) {
|
||
blePicker.show(function (items) {
|
||
console.log('蓝牙'+JSON.stringify(items[0]));
|
||
showBlePickerButton.innerHTML = items[0].text;
|
||
uuid = items[0].value
|
||
//自动连接
|
||
connect({peripheralUUID: uuid});
|
||
});
|
||
}, false);
|
||
}
|
||
blePicker.setData(bleData);
|
||
});
|
||
})(mui, document);
|
||
}
|
||
|
||
//班次点击事件
|
||
function handleClassClickH(obj, batch) {
|
||
mui.confirm('确定切换到其他班次？', '当前'+batchName, btnArray, function (e) {
|
||
if (e.index === 0) {
|
||
// return false
|
||
} else {
|
||
handleClassClick(obj, batch)
|
||
}
|
||
})
|
||
}
|
||
|
||
//班次点击事件
|
||
function handleClassClick(obj, batch) {
|
||
weightDataFilter.dataBuffer = []
|
||
wendinSize = []
|
||
mui.toast('切换班次',{duration:1500,type:'div'});
|
||
document.getElementById('batchName').innerHTML = '';
|
||
document.getElementById('nowFeed').innerHTML = '';
|
||
document.getElementById('feedNum').innerHTML = '';
|
||
//获取所有班次改为未选中
|
||
var doms = document.getElementsByClassName('classes');
|
||
if (doms.length > 0) {
|
||
for (var i = 0; i < doms.length; i++) {
|
||
doms[i].setAttribute("class", 'btnc classes mui-btn-inline');
|
||
}
|
||
}
|
||
//选中当前班次
|
||
obj.setAttribute("class", 'btnc classes mui-btn-inline mui-btn-primary');
|
||
var param = {
|
||
classCode: batch,
|
||
sbId: sbId,
|
||
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
|
||
dateOf: getDateStr(new Date())
|
||
};
|
||
//查询当前班次车次
|
||
initTrain(param);
|
||
}
|
||
|
||
function handleCarClickH(obj, classCode, trainNumber){
|
||
mui.confirm('确定切换到其他车次？', '当前'+batchName, btnArray, function (e) {
|
||
if (e.index === 0) {
|
||
// return false
|
||
} else {
|
||
mui.toast('切换车次', {duration: 1500, type: 'div'});
|
||
handleCarClick(obj, classCode, trainNumber)
|
||
}
|
||
})
|
||
}
|
||
//左侧车次点击事件
|
||
function handleCarClick(obj, classCode, trainNumber) {
|
||
weightDataFilter.dataBuffer = []
|
||
wendinSize = []
|
||
trainIndex = Number(trainNumber) - 1;
|
||
//获取所有车次未选中
|
||
var doms = document.getElementsByClassName('trains');
|
||
if (doms.length > 0) {
|
||
for (var i = 0; i < doms.length; i++) {
|
||
doms[i].setAttribute("class", 'mui-table-view-cell');
|
||
}
|
||
}
|
||
//选中当前车次
|
||
obj.setAttribute("class", 'mui-table-view-cell trains');
|
||
var param = {
|
||
classCode: classCode,
|
||
sbId: sbId,
|
||
trainNumber: trainNumber,
|
||
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
|
||
dateOf: getDateStr(new Date())
|
||
};
|
||
//查询车次饲料圈舍
|
||
initOne(param);
|
||
}
|
||
|
||
// 获取用户信息，并刷新页面数据
|
||
function initUserSb() {
|
||
let loginUser = api.getPrefs({sync: true, key: 'loginUser'});
|
||
let obj = JSON.parse(loginUser);
|
||
driverName = obj.nickName;
|
||
document.getElementById('driveName').innerHTML = '用户:' + obj.nickName;
|
||
document.getElementById('train').innerHTML = '';
|
||
document.getElementById('timeList').innerHTML = '';
|
||
document.getElementById('feedList').innerHTML = '';
|
||
initSbList();
|
||
}
|
||
// 更新获取最新配方
|
||
function refreshDayPlan() {
|
||
mui.confirm('确认更新计划么？', '提示', btnArray, function (e) {
|
||
if (e.index === 0) {} else {
|
||
weightDataFilter.dataBuffer = []
|
||
wendinSize = []
|
||
var param = {
|
||
sourceCow: api.getPrefs({ sync: true, key: 'sourceCow' }),
|
||
dateOf: getDateStr(new Date())
|
||
};
|
||
api.ajax({
|
||
url: 'https://tmr.nxcyx.com/api/app/tmr/planDayInit',
|
||
// url: 'http://192.168.0.107:8081/api/planDayInit',
|
||
headers: {
|
||
'Content-Type': 'application/json;charset=utf-8' //建议key使用首字母大写的形式，如 User-Agent
|
||
},
|
||
method: 'post',
|
||
data: {
|
||
body: param
|
||
}
|
||
}, function (ret, err) {
|
||
if (ret) {
|
||
mui.toast("计划更新成功");
|
||
initUserSb();
|
||
} else {
|
||
mui.toast("计划更新失败"+JSON.stringify(err));
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
//退出登录
|
||
function handleBackSys() {
|
||
mui.confirm('退出当前登录用户？', JSON.parse(api.getPrefs({ sync: true, key: 'loginUser' })).name + '(' + driverName + ')', btnArray, function (e) {
|
||
if (e.index === 0) {} else {
|
||
//跳转到login.stml
|
||
// api.closeWin();
|
||
api.removePrefs({
|
||
key: 'token'
|
||
});
|
||
api.removePrefs({
|
||
key: 'loginUser'
|
||
});
|
||
api.removePrefs({
|
||
key: 'sourceCow'
|
||
});
|
||
api.clearCache(function () {
|
||
console.log("清除完成");
|
||
});
|
||
//跳转登录页
|
||
api.openWin({
|
||
name: 'login',
|
||
reload:true,
|
||
url:'../pages/login.stml'
|
||
})
|
||
}
|
||
});
|
||
}
|
||
|
||
// 获取当前日期字符串
|
||
function getDateStr(date) {
|
||
let seperator1 = "-";
|
||
// var seperator2 = ":";
|
||
var month = date.getMonth() + 1;
|
||
var strDate = date.getDate();
|
||
if (month >= 1 && month <= 9) {
|
||
month = "0" + month;
|
||
}
|
||
if (strDate >= 0 && strDate <= 9) {
|
||
strDate = "0" + strDate;
|
||
}
|
||
return date.getFullYear() + seperator1 + month + seperator1 + strDate;
|
||
}
|
||
|
||
//获取字符长度
|
||
String.prototype.getByteLen = function () {
|
||
var len = 0;
|
||
for (var i = 0; i < this.length; i++) {
|
||
this.charCodeAt(i) < 256 ? len += 1 : len += 2;
|
||
}
|
||
return len;
|
||
};
|
||
|
||
//合并数组
|
||
function _toConsumableArray(arr) {
|
||
if (Array.isArray(arr)) {
|
||
for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) {
|
||
arr2[i] = arr[i];
|
||
}
|
||
return arr2;
|
||
} else {
|
||
return Array.from(arr);
|
||
}
|
||
}
|
||
|
||
</script>
|
||
|
||
|
||
</body>
|
||
</html> |