<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="utf-8">
|
<meta name="viewport" id="viewportMeta" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
|
<title>首页</title>
|
<link href="css/mui.min.css" rel="stylesheet" />
|
<script>
|
var initViewport = function(height){
|
var metaEl = document.querySelector("#viewportMeta");
|
var content = "height=" + height + ",width=device-width,initial-scale=1.0,user-scalable=no";
|
metaEl.setAttribute('name', 'viewport');
|
metaEl.setAttribute('content', content);
|
}
|
var realHeight = window.innerWidth > window.innerHeight ? window.innerWidth : window.innerHeight
|
initViewport(realHeight);
|
</script>
|
<style>
|
.login_body{
|
height: 100vh;
|
width: 100vw;
|
padding: 10vh 10vw 0 10vw;
|
background: #245ca7;
|
color: #fff;
|
}
|
.logo{
|
text-align: center;
|
height: 18vh;
|
}
|
.logo img{
|
height: 10vh;
|
margin: auto;
|
}
|
.logo p{
|
margin-top: 2vh;
|
font-size: 5vh;
|
color: #FFFFFF;
|
}
|
.form{
|
margin-top: 4vh;
|
/* height: 40vh; */
|
}
|
.form input{
|
padding: 2vh 0 2vh 12vw;
|
height: 6vh;
|
font-size: 2.4vh;
|
color: #333;
|
border-radius: 6px;
|
border: 0px;
|
}
|
.form .yhm input{
|
background: url(./images/ico_yhm.png) no-repeat 2vw center #fff;
|
background-size: 3.2vh auto;
|
margin-bottom: 2vh;
|
}
|
.form .mm input{
|
background: url(./images/ico_mm.png) no-repeat 2vw center #fff;
|
background-size: 3.2vh auto;
|
margin-bottom: 1vh;
|
}
|
.form input:focus,input:hover{
|
box-shadow: none!important;
|
border-bottom: unset;
|
}
|
.mui-input-row .mui-input-password~.mui-icon-eye{
|
font-size: 3.2vh;
|
top: 1.4vh;
|
}
|
.form button{
|
width: 100%;
|
margin-top: 3vh;
|
height: 7vh;
|
color: #245ca7;
|
padding: 1.5vh 0;
|
font-size: 3vh;
|
font-weight: 700;
|
border-radius: 6px;
|
margin-bottom: 2vh;
|
}
|
.form button:hover{
|
margin-top: 3vh;
|
height: 7vh;
|
}
|
|
</style>
|
</head>
|
<body>
|
<div class="mui-content">
|
<!--主体-->
|
<div class="login_body">
|
<!--logo-->
|
<div class="logo">
|
<img src="./images/logo.png">
|
<p>智慧粮库电子货位卡系统</p>
|
</div>
|
<!--表单-->
|
<div class="form">
|
<div class="yhm">
|
<input id="url" type="text" value="http://124.71.187.17:8111/dzhwk/index" class="form-control" placeholder="请输入路径">
|
</div>
|
<div class="yhm">
|
<input id="sid" type="text" class="form-control" placeholder="请输入设备序列号">
|
</div>
|
<button onclick="login()">确 定</button>
|
</div>
|
</div>
|
</div>
|
</body>
|
<script src="./js/mui.min.js"></script>
|
<script src="./js/jquery.min.js"></script>
|
<script type="text/javascript" charset="utf-8">
|
mui.init();
|
|
// 先设置 APP 全局全屏（隐藏状态栏）
|
plus.navigator.setFullscreen(true);
|
|
mui.plusReady(function() {
|
|
var user = JSON.parse(localStorage.getItem('user'));
|
console.log(JSON.stringify(user));
|
if (user) {
|
if (user.url) {
|
$("#url").val(user.url);
|
}else{
|
$("#url").val("http://124.71.187.17:8111/dzhwk/index");
|
}
|
if (user.sid) {
|
$("#sid").val(user.sid);
|
}
|
}else{
|
$("#url").val("http://124.71.187.17:8111/dzhwk/index");
|
}
|
});
|
|
//登陆
|
function login() {
|
|
//验证路径
|
var url = mui("#url")[0].value;
|
if (url == '') {
|
mui.alert("请输入路径！", '提示', ["确定"], function() {}, "div");
|
return;
|
}
|
//验证SID
|
var sid = mui("#sid")[0].value;
|
if (sid == '') {
|
mui.alert("请输入设备序列号！", '提示', ["确定"], function() {}, "div");
|
return;
|
}
|
var regInfo = {
|
"url": url,
|
"sid": sid
|
};
|
localStorage.setItem('user', JSON.stringify(regInfo));
|
var URL = url + "?sid=" + sid;
|
// var wv = plus.webview.create(URL);
|
// wv.show();
|
// 1. 全屏创建 Webview
|
var wv = plus.webview.create(
|
URL,
|
'targetWebview', // 唯一id
|
{
|
top: '0px', // 顶边距0
|
bottom: '0px', // 底边距0
|
left: '0px', // 左边距0
|
right: '0px', // 右边距0
|
width: '100%',
|
height: '100%',
|
scrollIndicator: 'none', // 隐藏滚动条（可选）
|
hardwareAccelerated: true // 开启硬件加速（Android）
|
}
|
);
|
|
// 2. 显示 Webview
|
wv.show();
|
|
// 3. 可选：Webview 加载完成后再强制网页全屏
|
wv.addEventListener('loaded', function() {
|
// 注入JS让网页自身占满视口
|
wv.evalJS(`
|
document.documentElement.style.width = '100%';
|
document.documentElement.style.height = '100%';
|
document.body.style.width = '100%';
|
document.body.style.height = '100%';
|
document.body.style.margin = '0';
|
document.body.style.padding = '0';
|
document.body.style.overflow = 'hidden';
|
`);
|
});
|
}
|
</script>
|
</html>
|
