jifuning
/
xinxi_zhongxin_app


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162
							<!DOCTYPE html>
<html>
<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 name="format-detection"content="telephone=no">
    <title>index</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
    <link rel="stylesheet" href="../../css/projeck.css">
    <style media="screen">
        body{
            background: #fff;
        }
        .status_itme{
            padding: 25px;
        }
        .status_itme li{
            text-align: center;
            width: 62px;
            height: 62px;
            padding: 10px 5px;
            color: #ffffff;
            font-size: 14px;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            border-radius: 50%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            box-sizing: border-box;
        }
        .status_itme li p{
            color: #ffffff;
            font-size: 16px;
        }
        .content_item li{
            padding: 15px;
        }
        .status_title{
            justify-content: flex-start;
            -webkit-justify-content: flex-start;
            color: #284572;
            padding-bottom: 10px;
            border-bottom: 1px solid #ebeef3;
        }
        .status_title i{
            display: block;
            width: 40px;
            height: 40px;
            margin-right: 15px;
        }
        .nav_title{
            padding: 0 5px;
            background: #f3f6fa;
        }
        .nav_title li{
            text-align: center;
            font-size: 14px;
            padding: 12px 0 ;
        }
        .nav_title li:nth-child(1){
            width: 20%;
        }
        .nav_title li:nth-child(2){
            width: 60%;
        }
        .nav_title li:nth-child(3){
            width: 20%;
        }
    </style>
</head>
<body>
  <div class="api_layout" id="api_layout">
    <header class="header-login">
       <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
       <p class="api_text"></p>
    </header>
    <div class="status_itmes">
        <ul class="status_itme flex-space" id="status_itme">

        </ul>
    </div>
    <nav>
        <ul class="nav_title flex-space">
            <li>序号</li>
            <li>安装地点</li>
            <li>数值/状态</li>
        </ul>
    </nav>
  </div>
</body>
</html>
<script type="text/template" id="templateStatus">
  {{for(var i = 0;i<it.length;i++) { }}
    <li onclick="monitorDataSearch('{{=it[i].type}}')" class="{{=it[i].type}}Bg">
        <p>{{=it[i].name}}</p>
        <span id="alarmCount">{{=it[i].count}}个</span>
    </li>
  {{ } }}
</script>
<script type="text/javascript" src="../../script/api.js"></script>
<script src="../../script/doT.min.js"></script>
<script src="../../script/config.js"></script>
<script type="text/javascript">
    var title = ""
    apiready = function () {
        $api.fixStatusBar($api.dom('header') );
        $api.html($api.dom('.api_text'), api.pageParam.title);
        title = api.pageParam.title;
        var statusType = api.pageParam.statusType;
        openFrame(statusType)
    }
    // 详情
    function openFrame(type) {
      api.openFrame({
          name: 'monitorDetaile',
          url: 'monitorDetaile.html',
          rect: {
              x: 0,
              y: $api.dom('header').offsetHeight+  $api.dom('nav').offsetHeight+112,
              w: 'auto',
              h: 'auto'
          },
          pageParam: {
              title: title,
              statusType:type
          },
          bounces: true,
          bgColor: '#fff',
          vScrollBarEnabled: true,
          hScrollBarEnabled: true
      });

    }
    // 状态数
    function monitorDatas() {
        $apis.html(status_itme,'#templateStatus',JSON.parse($api.getStorage('totals')));
    }
    // 查询
    function monitorDataSearch(sType) {
      api.execScript({
        name: 'monitorDetaileWin',
        frameName:'monitorDetaile',
        script : 'monitorDataFun("'+title+'","'+sType+'");'
      })
    }
    function backIndex() {
        $api.rmStorage('totals');
        api.closeWin();
    }
    // 监听物理返回键
    function keybackFun() {
      api.addEventListener({
          name: 'keyback'
        }, function(ret, err){
          $api.rmStorage('totals');
          api.closeWin();
      });
    }
</script>