123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
- <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
- <title>APP</title>
- <link rel="stylesheet" type="text/css" href="./css/api.css" />
- <!--<link rel="stylesheet" type="text/css" href="./css/aui.css" />-->
- <link rel="stylesheet" type="text/css" href="./css/aui-win.css" />
- <link rel="stylesheet" type="text/css" href="./css/iconfont.css" />
- <style type="text/css">
- body, html {
- width: 100%;
- height: 100%;
- }
- .aui-nav .aui-bar-tab {
- background: #fff;
- }
- .aui-bar {
- text-align: center;
- height: 3.3rem;
- }
- #footer {
- border-top: 1px solid #ddd;
- }
- .btn-icon {
- width: 1.2rem;
- margin: 0 auto;
- margin-bottom: 3px;
- }
- .aui-bar-tab .aui-bar-tab-item {
- padding: 10px 0;
- box-sizing: border-box;
- }
- .aui-bar1 {
- position: relative;
- top: 0;
- right: 0;
- left: 0;
- z-index: 10;
- width: 100%;
- min-height: 2.25rem;
- font-size: 0.9rem;
- text-align: center;
- display: table;
- }
- /*底部切换栏*/
- .aui-bar-tab1 {
- position: fixed;
- top: auto;
- bottom: 0;
- table-layout: fixed;
- background-color: #ffffff;
- color: #757575;
- }
- .aui-bar-tab1 .aui-bar-tab-item {
- display: table-cell;
- position: relative;
- width: 1%;
- height: 2.5rem;
- text-align: center;
- vertical-align: middle;
- padding: 5px 0;
- }
- .aui-bar-tab-label {
- font-size: 0.8rem;
- margin-top: -5px;
- }
- .myBg {
- background: linear-gradient(45deg, #005fa3, #00a0ea) !important;
- }
- </style>
- </head>
- <body>
- <header class="aui-bar aui-bar-nav" id="aui-header">
- <!--<div class="aui-title" id="aui-title">
- 赛轮商城门店端
- </div>-->
- </header>
- <footer class="aui-bar1 aui-bar-tab1" id="footer">
- <div class="aui-bar-tab-item aui-active" tapmode onclick="randomSwitchBtn(0,'main')">
- <img src="./luntai/img/images/tabar_home_active.png" id="index1" class="btn-icon"/>
- <div class="aui-bar-tab-label">
- 首页
- </div>
- </div>
- <!--<div class="aui-bar-tab-item aui-active" tapmode onclick="randomSwitchBtn(1,'find')">
- <img src="./luntai/img/images/faxian.png" id="index1" class="btn-icon"/>
- <div class="aui-bar-tab-label">
- 发现
- </div>
- </div>
- <div class="aui-bar-tab-item aui-active" tapmode onclick="randomSwitchBtn(2,'msg')">
- <img src="./luntai/img/images/xiaoxi.png" id="index1" class="btn-icon"/>
- <div class="aui-bar-tab-label">
- 消息
- </div>
- </div>-->
- <div class="aui-bar-tab-item" tapmode onclick="randomSwitchBtn(3,'may')">
- <img src="./luntai/img/images/wode.png" id="index2" class="btn-icon"/>
- <div class="aui-bar-tab-label">
- 我的
- </div>
- </div>
- </footer>
- </body>
- <script type="text/javascript" src="./script/api.js"></script>
- <script type="text/javascript" src="./script/aui-tab.js" ></script>
- <script type="text/javascript">
- apiready = function() {
- // $api.clearStorage();
- var header = $api.byId('aui-header');
- $api.fixStatusBar(header);
- var headerPos = $api.offset(header);
- var body_h = $api.offset($api.dom('body')).h;
- var footer_h = $api.offset($api.byId('footer')).h;
- var loginid = $api.getStorage("kunnr");
- // openFrameGroup(headerPos, body_h, footer_h);
- if (loginid == "" || typeof loginid == 'undefined') {
- /// 登录页面
- setTimeout(function() {
- openLogin(headerPos, body_h, footer_h);
- }, 200);
- } else {
- openFrameGroup(headerPos, body_h, footer_h);
- }
- /// 打开页面组
- api.addEventListener({
- name : 'openFrameGroup'
- }, function(ret, err) {
- //coding...
- openFrameGroup(headerPos, body_h, footer_h);
- setTimeout(function() {
- api.closeWin({
- name : 'login',
- animation : {
- type : "push", //动画类型(详见动画类型常量)
- subType : "from_right", //动画子类型(详见动画子类型常量)
- duration : 300
- }
- });
- }, 1200);
- });
- var tab = new auiTab({
- element : document.getElementById("footer"),
- }, function(ret) {
- if (ret.index == 1) {
- $api.attr($api.byId('index1'), 'src', './luntai/img/images/tabar_home_active.png');
- $api.attr($api.byId('index2'), 'src', './luntai/img/images/wode.png');
- } else {
- $api.attr($api.byId('index1'), 'src', './luntai/img/images/tabar_home_inactive.png');
- $api.attr($api.byId('index2'), 'src', './luntai/img/images/wode_active.png');
- }
- api.setFrameGroupIndex({
- name : 'indexGroup',
- index : (ret.index - 1),
- });
- });
- };
- // 打开登陆页面
- function openLogin(headerPos, body_h, footer_h) {
- api.openWin({
- name : 'login',
- url : './luntai/login.html',
- rect : {
- x : 0,
- y : 0,
- w : 'auto',
- h : body_h - footer_h - headerPos.h
- },
- animation : {
- type : "none", //动画类型(详见动画类型常量)
- subType : "from_right", //动画子类型(详见动画子类型常量)
- duration : 200 //动画过渡时间,默认300毫秒
- }
- });
- }
- // 打开页面组
- function openFrameGroup(headerPos, body_h, footer_h) {
- api.openFrameGroup({
- name : 'indexGroup',
- scrollEnabled : false,
- rect : {
- x : 0,
- y : 0,
- w : 'auto',
- h : body_h - footer_h
- },
- index : 0,
- frames : [{
- name : 'main',
- url : 'luntai/index.html',
- vScrollBarEnabled : false,
- hScrollBarEnabled : false,
- bounces : false,
- },{
- name : 'my',
- url : 'luntai/meber.html',
- vScrollBarEnabled : false,
- hScrollBarEnabled : false,
- bounces : false
- }],
- }, function(ret, err) {
- if(ret.index == 1){
- $api.addCls($api.byId('aui-header'),'myBg');
- }else{
- $api.removeCls($api.byId('aui-header'),'myBg');
- }
- });
- }
- </script>
- </html>
|