|
|
|
|
@ -0,0 +1,184 @@
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="zh-cmn-Hans">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
|
|
|
|
|
<title>WeUI</title>
|
|
|
|
|
<link rel="stylesheet" href="lib/weui/weui.min.css" />
|
|
|
|
|
<link rel="stylesheet" href="lib/weui/example.css" />
|
|
|
|
|
<style>
|
|
|
|
|
.page__bd {
|
|
|
|
|
height: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.weui-tabbar__item > span {
|
|
|
|
|
position: relative;
|
|
|
|
|
display: inline-block;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.weui-tabbar span.weui-badge {
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: -2px;
|
|
|
|
|
right: -13px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.weui-tabbar .weui-badge.weui-badge_dot {
|
|
|
|
|
top: 0;
|
|
|
|
|
right: -6px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tab {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tab.active {
|
|
|
|
|
display: block;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.page {
|
|
|
|
|
display: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.page.js_show {
|
|
|
|
|
display: block;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body ontouchstart>
|
|
|
|
|
<div class="weui-toptips weui-toptips_warn js_tooltips">错误提示</div>
|
|
|
|
|
<div class="container" id="container">
|
|
|
|
|
<div class="page tabbar js_show home">
|
|
|
|
|
<div class="page__bd">
|
|
|
|
|
<div class="weui-tab">
|
|
|
|
|
<div class="weui-navbar">
|
|
|
|
|
<div class="weui-navbar__item weui-bar__item_on">{{}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-tab__panel">
|
|
|
|
|
<div class="tab active" id="message">Page 1</div>
|
|
|
|
|
<div class="tab" id="home">Page 2</div>
|
|
|
|
|
<div class="tab" id="user">
|
|
|
|
|
<div class="weui-cells">
|
|
|
|
|
<div class="weui-cell">
|
|
|
|
|
<div class="weui-cell__bd">
|
|
|
|
|
<p>用户名</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-cell__ft">{{login.UserName}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-cell">
|
|
|
|
|
<div class="weui-cell__bd">
|
|
|
|
|
<p>昵称</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-cell__ft">{{login.NickName}}</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-cell weui-cell_access">
|
|
|
|
|
<div class="weui-cell__bd">
|
|
|
|
|
<span style="vertical-align: middle">注销</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-cell__ft"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-tabbar">
|
|
|
|
|
<a href="#message" class="weui-tabbar__item weui-bar__item_on">
|
|
|
|
|
<span>
|
|
|
|
|
<img src="./images/icon_tabbar.png" alt="" class="weui-tabbar__icon">
|
|
|
|
|
<span class="weui-badge">8</span>
|
|
|
|
|
</span>
|
|
|
|
|
<p class="weui-tabbar__label">消息</p>
|
|
|
|
|
</a>
|
|
|
|
|
<a href="#home" class="weui-tabbar__item">
|
|
|
|
|
<img src="./images/icon_tabbar.png" alt="" class="weui-tabbar__icon">
|
|
|
|
|
<p class="weui-tabbar__label">智慧教室</p>
|
|
|
|
|
</a>
|
|
|
|
|
<a href="#user" class="weui-tabbar__item">
|
|
|
|
|
<span>
|
|
|
|
|
<img src="./images/icon_tabbar.png" alt="" class="weui-tabbar__icon">
|
|
|
|
|
<span class="weui-badge weui-badge_dot"></span>
|
|
|
|
|
</span>
|
|
|
|
|
<p class="weui-tabbar__label">我的</p>
|
|
|
|
|
</a>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="page" id="login">
|
|
|
|
|
<div class="page__bd">
|
|
|
|
|
<div class="weui-navbar">
|
|
|
|
|
<div class="weui-navbar__item">登录</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="weui-tab__panel">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<script src="lib/weui/weui.min.js"></script>
|
|
|
|
|
<script src="lib/mobile.detect/mobile-detect.min.js"></script>
|
|
|
|
|
<script src="lib/lodash/lodash.min.js"></script>
|
|
|
|
|
<script src="lib/jquery/jquery.min.js"></script>
|
|
|
|
|
<script src="lib/jquery.validation/jquery.validate.min.js"></script>
|
|
|
|
|
<script src="lib/jquery.validation.unobtrusive/jquery.validate.unobtrusive.min.js"></script>
|
|
|
|
|
<script src="lib/jquery.ajax.unobtrusive/jquery.unobtrusive-ajax.min.js"></script>
|
|
|
|
|
<script src="lib/signalr/signalr.min.js"></script>
|
|
|
|
|
<script src="lib/vue/vue.min.js"></script>
|
|
|
|
|
<script src="lib/dayjs/dayjs.min.js"></script>
|
|
|
|
|
<script src="lib/URI.js/URI.min.js"></script>
|
|
|
|
|
<script>
|
|
|
|
|
$('body').on('click', '.link', function () {
|
|
|
|
|
var selector = $(this).attr('href');
|
|
|
|
|
showPage(selector);
|
|
|
|
|
return false;
|
|
|
|
|
});
|
|
|
|
|
$('body').on('click', '.weui-tabbar__item', function () {
|
|
|
|
|
var link = $(this).not('.weui-bar__item_on');
|
|
|
|
|
if (link.length) {
|
|
|
|
|
var selector = $(this).attr('href');
|
|
|
|
|
$('.tab.active').removeClass('active');
|
|
|
|
|
$(selector).addClass('active');
|
|
|
|
|
$('.weui-tabbar__item.weui-bar__item_on').removeClass('weui-bar__item_on');
|
|
|
|
|
link.addClass('weui-bar__item_on');
|
|
|
|
|
}
|
|
|
|
|
return false;
|
|
|
|
|
});
|
|
|
|
|
function showPage(selector) {
|
|
|
|
|
var page = $(selector).not('.js_show');
|
|
|
|
|
if (page.length) {
|
|
|
|
|
page.show().addClass('slideIn');
|
|
|
|
|
$('.page.js_show').removeClass('js_show');
|
|
|
|
|
page.addClass('js_show');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
<script>
|
|
|
|
|
var vm = new Vue({
|
|
|
|
|
el: '#container',
|
|
|
|
|
data: {
|
|
|
|
|
login: {
|
|
|
|
|
server: localStorage.getItem('server') || 'http://192.168.3.83:8000',
|
|
|
|
|
username: localStorage.getItem('username'),
|
|
|
|
|
password: "",
|
|
|
|
|
rememberMe: localStorage.getItem('rememberMe') || false
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted: function () {
|
|
|
|
|
console.log('vue>mounted');
|
|
|
|
|
if (this.login.rememberMe && this.login.username && this.login.server) {
|
|
|
|
|
showPage('#home');
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
//showPage('#login');
|
|
|
|
|
}
|
|
|
|
|
$('form').removeData('validator');
|
|
|
|
|
$('form').removeData('unobtrusiveValidation');
|
|
|
|
|
$.validator.unobtrusive.parse('form');
|
|
|
|
|
|
|
|
|
|
var os = new MobileDetect(navigator.userAgent).os();
|
|
|
|
|
var theme = os == "AndroidOS" ? "md" : "ios";
|
|
|
|
|
if (document.location.search.indexOf('theme=') >= 0) {
|
|
|
|
|
theme = document.location.search.split('theme=')[1].split('&')[0];
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
