| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>Hello MUI</title>
- <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
- <meta name="apple-mobile-web-app-capable" content="yes">
- <meta name="apple-mobile-web-app-status-bar-style" content="black">
- <link rel="stylesheet" href="css/mui.min.css">
- <link rel="stylesheet" href="css/iconfont.css" />
- <style>
- html,
- body {
- background-color: #efeff4;
- font-size: 14px;
- }
-
- .mui-views,
- .mui-view,
- .mui-pages,
- .mui-page,
- .mui-page-content {
- position: absolute;
- left: 0;
- right: 0;
- top: 0;
- bottom: 0;
- width: 100%;
- height: 100%;
- background-color: #efeff4;
- }
-
- .mui-pages {
- top: 46px;
- height: auto;
- }
-
- .mui-scroll-wrapper,
- .mui-scroll {
- background-color: #efeff4;
- }
-
- .mui-page.mui-transitioning {
- -webkit-transition: -webkit-transform 300ms ease;
- transition: transform 300ms ease;
- }
-
- .mui-page-left {
- -webkit-transform: translate3d(0, 0, 0);
- transform: translate3d(0, 0, 0);
- }
-
- .mui-ios .mui-page-left {
- -webkit-transform: translate3d(-20%, 0, 0);
- transform: translate3d(-20%, 0, 0);
- }
-
- .mui-navbar {
- position: fixed;
- right: 0;
- left: 0;
- z-index: 10;
- height: 44px;
- background-color: #f7f7f8;
- }
-
- .mui-navbar .mui-bar {
- position: absolute;
- background: transparent;
- text-align: center;
- }
-
- .mui-android .mui-navbar-inner.mui-navbar-left {
- opacity: 0;
- }
-
- .mui-ios .mui-navbar-left .mui-left,
- .mui-ios .mui-navbar-left .mui-center,
- .mui-ios .mui-navbar-left .mui-right {
- opacity: 0;
- }
-
- .mui-navbar .mui-btn-nav {
- -webkit-transition: none;
- transition: none;
- -webkit-transition-duration: .0s;
- transition-duration: .0s;
- }
-
- .mui-navbar .mui-bar .mui-title {
- display: inline-block;
- width: auto;
- }
-
- .mui-page-shadow {
- position: absolute;
- right: 100%;
- top: 0;
- width: 16px;
- height: 100%;
- z-index: -1;
- content: '';
- }
-
- .mui-page-shadow {
- background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
- background: linear-gradient(to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, .01) 50%, rgba(0, 0, 0, .2) 100%);
- }
-
- .mui-navbar-inner.mui-transitioning,
- .mui-navbar-inner .mui-transitioning {
- -webkit-transition: opacity 300ms ease, -webkit-transform 300ms ease;
- transition: opacity 300ms ease, transform 300ms ease;
- }
-
- .mui-page {
- display: none;
- }
-
- .mui-pages .mui-page {
- display: block;
- }
-
- .mui-page .mui-table-view:first-child {
- margin-top: 15px;
- }
-
- .mui-page .mui-table-view:last-child {
- margin-bottom: 30px;
- }
-
- .mui-table-view {
- margin-top: 20px;
- }
-
- .mui-table-view span.mui-pull-right {
- color: #999;
- }
-
- .mui-table-view-divider {
- background-color: #efeff4;
- font-size: 14px;
- }
-
- .mui-table-view-divider:before,
- .mui-table-view-divider:after {
- height: 0;
- }
-
- .head {
- height: 40px;
- }
-
- #head {
- line-height: 40px;
- }
-
- .head-img {
- width: 50px;
- height: 50px;
- margin-right: 10px;
- }
-
- #head-img1 {
- position: absolute;
- bottom: 10px;
- right: 40px;
- width: 40px;
- height: 40px;
- }
-
- .update {
- font-style: normal;
- color: #999999;
- margin-right: -25px;
- font-size: 15px
- }
-
- .mui-fullscreen {
- position: fixed;
- z-index: 20;
- background-color: #000;
- }
-
- .mui-ios .mui-navbar .mui-bar .mui-title {
- position: static;
- }
- /*问题反馈在setting页面单独的css*/
-
- #feedback .mui-popover {
- position: fixed;
- }
-
- #feedback .mui-table-view:last-child {
- margin-bottom: 0px;
- }
-
- #feedback .mui-table-view:first-child {
- margin-top: 0px;
- }
- /*问题反馈在setting页面单独的css==end*/
-
- .mui-bar-nav {
- background-color: #00a1cb!important;
- }
-
- p {
- font-size: 16px;
- color: #000;
- padding: 10px;
- margin-bottom: 0px;
- }
- .Img-box{
- line-height: 15px;
-
- }
- .Img{
- width: 20px;
- height: 19px;
- vertical-align: sub;
-
- }
- .size-16{
- font-size: 16px;
- }
- </style>
- <link rel="stylesheet" type="text/css" href="../css/feedback.css" />
- </head>
- <body class="mui-fullscreen">
- <!--页面主结构开始-->
- <div id="app" class="mui-views">
- <div class="mui-view">
- <div class="mui-navbar" style="display: none;">
- </div>
- <div class="mui-pages" style="top: 0;">
- </div>
- </div>
- </div>
- <!--页面主结构结束-->
- <!--单页面开始-->
- <div id="setting" class="mui-page">
- <!--页面标题栏开始-->
- <div class="mui-navbar-inner mui-bar mui-bar-nav" style="color:#fff">
- </div>
- <!--页面主内容区开始-->
- <div class="mui-page-content">
- <div class="mui-scroll-wrapper">
- <div class="mui-scroll">
- <ul class="mui-table-view mui-table-view-chevron">
- <li class="mui-table-view-cell mui-media">
- <a class="mui-navigate-right Img-box" href="#account" >
- <img class=" mui-pull-left head-img" id="head-img" src="img/personal.png">
- <div class="mui-media-body">
- <div style="margin: 8px 0;">
- <span class="size-16">蓝胖子</span> <span>领导</span>
- </div>
- <h5 class='mui-ellipsis'>我的账号:18839115206</h5>
- </div>
- </a>
- </li>
- </ul>
- <ul class="mui-table-view mui-table-view-chevron">
- <li class="mui-table-view-cell">
- <a id="Question" class="mui-navigate-right">
- <img class="Img"src="img/Wa.png" alt="" />
- 常见问题 <i class="mui-pull-right "></i></a>
- </li>
- <li class="mui-table-view-cell">
- <a id="feedback" class="mui-navigate-right">
- <img class="Img"src="img/Wb.png" alt="" />
- 问题反馈 <i class="mui-pull-right "></i></a>
- </li>
- <li class="mui-table-view-cell">
- <a href="" class="mui-navigate-right">
- <img class="Img"src="img/Wc.png" alt="" />
- 保密协议 <i class="mui-pull-right "></i></a>
- </li>
- <li class="mui-table-view-cell">
- <a href="#" id='update'>
- <img class="Img"src="img/Wd.png" alt="" />
- 版本更新 <i class="mui-pull-right update"></i></a>
- </li>
- </ul>
- <ul class="mui-table-view ">
- <li class="mui-table-view-cell">
- <a id="Question" class="mui-navigate-right">
- <img class="Img"src="img/Wa.png" alt="" />
- 设置 <i class="mui-pull-right "></i></a>
- </li>
-
- </ul>
- <ul class="mui-table-view">
- <li class="mui-table-view-cell" style="text-align: center;">
- <a id='exit'>退出</a>
- </li>
- </ul>
- </div>
- </div>
- </div>
- <input type="hidden" id="Vb" />
- <!--页面主内容区结束-->
- </div>
- <!--常见问题-->
- </body>
- <script src="js/mui.min.js "></script>
- <script src="js/zepto.js"></script>
- <script src="js/huayi.config.js"></script>
- <script src="js/mui.view.js "></script>
- <script>
- mui.init();
-
- var viewApi = mui('#app').view({
- defaultPage: '#setting'
- });
- //初始化单页的区域滚动
- mui('.mui-scroll-wrapper').scroll();
- var a = localStorage.getItem("T");
- // //检测网络连接
- mui.plusReady(function() {
- // var Code_;var NewCode_;
- // var server = huayi.config.callcenter_url + "ApplicationsRefresh/GetInfo?"; //获取升级描述文件服务器地址
- // document.addEventListener("netchange", wainshow, false);
- // plus.runtime.getProperty(plus.runtime.appid, function(wgtinfo) {
- // // $("#Vb").text(wgtinfo.version);
- //// var
- //// $('.update').text(Code_);
- // console.log("当前应用版本:"+wgtinfo.version+"---"+plus.runtime.version);
- // localStorage.setItem("Code",wgtinfo.version)//缓存保存版本号;
- // Code_= localStorage.getItem("Code");
- // console.log(Code_);
- // $('.update').text(Code_);
- //
- // Gx();
- // });
- function Gx() {
- mui.ajax(server, {
- data: {
- isNew: true,
- token: a
- },
- dataType: 'json', //服务器返回json格式数据
- type: 'post', //HTTP请求类型
- timeout: 10000, //超时时间设置为10秒;
- headers: {
- 'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8'
- },
- success: function(data) {
- if(data.state == "success") {
- NewCode_ = data.data.F_VersionCode;//缓存号
- console.log(NewCode_);
- if(Code_!= NewCode_){
- plus.nativeUI.confirm("发现新版本", function(event) {
- var tapIndex = event.index;
- if(tapIndex == 0) {
- console.log(data);
- plus.runtime.openURL(data.data.F_DownUrl);
- } else {
- mui.toast("取消更新");
- }
- }, "提示", ["立即更新", "取 消", ])
- }
- // $('.update').text(NewCode_);
- // plus.nativeUI.confirm("发现新版本", function(event) {
- // var tapIndex = event.index;
- // if(tapIndex == 0) {
- // console.log(data);
- // plus.runtime.openURL(data.data.F_DownUrl);
- // } else {
- // mui.toast("取消更新");
- // }
- // }, "提示", ["立即更新", "取 消", ]);
- } else {
- mui.toast(data.message);
- }
- },
- error: function(data) {
- //异常处理;
- console.log(data.message);
- }
- })
- }
- var backcount = 0;
- mui.back = function() {
- if(mui.os.ios) return;
- if(backcount > 0) {
- if(window.plus) plus.runtime.quit();
- return;
- };
- mui.toast('再按一次退出应用');
- backcount++;
- setTimeout(function() {
- backcount = 0;
- }, 2000);
- };
- });
- //退出
- document.getElementById('exit').addEventListener('tap', function() {
- var btnArray = [{
- title: "注销当前账号"
- }, {
- title: "直接关闭应用"
- }];
- plus.nativeUI.actionSheet({
- cancel: "取消",
- buttons: btnArray
- }, function(event) {
- var index = event.index;
- switch(index) {
- case 1:
- //注销账号
- localStorage.clear();
- plus.runtime.restart();
- break;
- case 2:
- plus.runtime.quit();
- break;
- }
- });
- }, false);
- function Clean() {
- $("#mobile").val('');
- $("#title").val('');
- $("#content").val('');
- }
-
- var view = viewApi.view;
- (function($) {
- //处理view的后退与webview后退
- var oldBack = $.back;
- $.back = function() {
- if(viewApi.canBack()) { //如果view可以后退,则执行view的后退
- viewApi.back();
- } else { //执行webview后退
- oldBack();
- }
- };
- //监听页面切换事件方案1,通过view元素监听所有页面切换事件,目前提供pageBeforeShow|pageShow|pageBeforeBack|pageBack四种事件(before事件为动画开始前触发)
- //第一个参数为事件名称,第二个参数为事件回调,其中e.detail.page为当前页面的html对象
- view.addEventListener('pageBeforeShow', function(e) {
- // console.log(e.detail.page.id + ' beforeShow');
- });
- view.addEventListener('pageShow', function(e) {
- // console.log(e.detail.page.id + ' show');
- });
- view.addEventListener('pageBeforeBack', function(e) {
- // console.log(e.detail.page.id + ' beforeBack');
- });
- view.addEventListener('pageBack', function(e) {
- // console.log(e.detail.page.id + ' back');
- });
- })(mui);
- //点击两次就退出软件
-
- $(".mui-media").on('tap',function(){
- // mui.openWindow({
- // "id": 'setting',
- // "url": 'setting.html',
- // show: {
- // aniShow: 'pop-in'
- // },
- // styles: {
- // popGesture: 'hide'
- // },
- // waiting: {
- // autoShow: false
- // }
- // //
- // });
- // plus.webview.create('setting.html', 'setting', {
- // 'titleNView': {
- // 'backgroundcolor': '#FFFFFF',
- // 'titletext': '标题栏',
- // 'titlecolor': '#FF0000'
- // }
- // });
- // var nwaiting = plus.nativeUI.showWaiting();//显示原生等待框
- webviewShow = plus.webview.create("setting.html");//后台创建webview并打开show.html
- webviewShow.addEventListener("loaded", function() { //注册新webview的载入完成事件
- // nwaiting.close(); //新webview的载入完毕后关闭等待框
- webviewShow.show("slide-in-right",300); //把新webview窗体显示出来,显示动画效果为速度300毫秒的右侧移入动画
- }, false);
- })</script>
- </html>
|