jifuning
/
ximeichang


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../../css/api.css">
    <!--<link rel="stylesheet" href="../../css/aui.css">-->
    <link rel="stylesheet" href="../../css/style.css">
    <link rel="stylesheet" href="../../css/projeck.css">
    <title></title>
    <style>
        .aui-searchbar{
            width: 86%;
            height: 50px;
            margin-left: 40px;
            background-color: transparent;
        }
        .aui-searchbar .aui-searchbar-btn{
            color: #fff;
        }
        #search-input::placeholder{
            color: #fff;
            font-size: 13px;
        }
        .search_ico{
            width: 16px;
            height: 16px;
            display: block;
            position: absolute;
            background: url("../../image/seacrh001.png") no-repeat;
            background-size: cover;
            top: 7px;
            left: 17px;
        }
        .backBtn{
            margin-left: 5px;
        }
        #search-input{
            font-size: 14px;
        }
        header ul li { height: 50px; line-height: 50px; text-align: center; display: none; color: #fff; position: relative;font-size: 18px;  }
        header ul li.active{ display: block; }
        #footer{  background-color: #fff; }
        #footer ul li{  padding-top: 39px; padding-bottom: 4px; background: url() no-repeat center 10px; background-size: auto 25px; text-align: center; font-size: 13px;color: #b3b3b3;}
        #footer ul li.active{ color: #009fe8; }
        #footer ul li:nth-child(1){ background-image: url(../../image/NVTabBar/ss1.png); }
        #footer ul li:nth-child(2){ background-image: url(../../image/NVTabBar/k1.png); }
        #footer ul li:nth-child(3){ background-image: url(../../image/NVTabBar/l1.png); }
        #footer ul li:nth-child(4){ background-image: url(../../image/NVTabBar/g1.png); }
        #footer ul li:nth-child(1).active{ background-image: url(../../image/NVTabBar/ss2.png); }
        #footer ul li:nth-child(2).active{ background-image: url(../../image/NVTabBar/k2.png); }
        #footer ul li:nth-child(3).active{ background-image: url(../../image/NVTabBar/l2.png); }
        #footer ul li:nth-child(4).active{ background-image: url(../../image/NVTabBar/g2.png); }
        .flex-con{
            overflow: auto
        }
    </style>
</head>
<body>
<div id="wrap" class="flex-wrap flex-vertical">
    <header class="header-login">
        <ul>
            <li class="border-b active" >
                <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
                <div class="aui-searchbar" id="search">
                    <div class="aui-searchbar-input aui-border-radius" onclick="searchInfo()">
                        <i class="search_ico"></i>
                        <form>
                            <input type="search" placeholder="搜索" id="search-input" readonly>
                        </form>
                    </div>
                </div>
            </li>
            <li class="border-b" >
              <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
              <div class="aui-searchbar" id="search">
                  <div class="aui-searchbar-input aui-border-radius" onclick="searchInfo()">
                      <i class="search_ico"></i>
                      <form>
                          <input type="search" placeholder="搜索" id="search-input" readonly>
                      </form>
                  </div>
              </div>
            </li>
            <!-- <li class="border-b" >
              <header class="header-login">
                 <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
                 <p class="api_text">历史数据</p>
              </header>
            </li>
            <li class="border-b" >
              <header class="header-login">
                 <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
                 <p class="api_text">故障记录</p>
              </header>
            </li> -->
        </ul>
    </header>
    <div id="main" class="flex-con">

    </div>
    <div id="footer" class="border-t">
        <ul class="flex-wrap" >
            <li  onclick="randomSwitchBtn( this );" class="icon iconfont flex-con active">模拟量</li>
            <li  onclick="randomSwitchBtn( this );" class="icon iconfont flex-con icon iconfont" >开关量</li>
            <!-- <li  onclick="randomSwitchBtn( this );" class="icon iconfont flex-con" >历史数据</li> -->
            <!-- <li  onclick="randomSwitchBtn( this );" class="icon iconfont flex-con" >故障记录</li> -->
        </ul>
    </div>
</div>
<script src="../../script/api.js"></script>
<!-- <script src="../../script/fastclick.min.js"></script> -->
<script src="../../script/config.js"></script>
<script>
    apiready = function(){
        $api.fixStatusBar( $api.dom('header'));
        funIniGroup();
    };
    function funIniGroup(){
        var eHeaderLis = $api.domAll('header li'),
            frames = [];
        for (var i = 0,len = eHeaderLis.length; i < len; i++) {
            frames.push({
                name: 'monitor'+i,
                url: 'monitor'+i+'.html',
                bgColor : '#f2f2f2',
                bounces:true
            })
        }
        api.openFrameGroup({
            name: 'monitorGroup',
            scrollEnabled: false,
            rect: {
                x: 0,
                y: $api.dom('header').offsetHeight,
                w: api.winWidth,
                h: $api.dom('#main').offsetHeight
            },
            index: 0,
            frames: frames,
            preload : 0
        }, function (ret, err) {

        });
    };
    // 随意切换按钮
    function randomSwitchBtn( tag ) {
        if( tag == $api.dom('#footer li.active') )return;
        var eFootLis = $api.domAll('#footer li'),
            eHeaderLis = $api.domAll('header li'),
            index = 0;
        for (var i = 0,len = eFootLis.length; i < len; i++) {
            if( tag == eFootLis[i] ){
                index = i;
            }else{
                $api.removeCls(eFootLis[i], 'active');
                $api.removeCls(eHeaderLis[i], 'active');
            }
        }
        $api.addCls( eFootLis[index], 'active');
        $api.addCls( eHeaderLis[index], 'active');
        api.setFrameGroupIndex({
            name: 'monitorGroup',
            index: index
        });
    }
    function backIndex() {
        api.closeWin();
    }
    // 搜索
    function searchInfo() {
        $event.openWin('searchWin','searchWin','','')
    }
</script>
</body>
</html>