alarm_frm.html 5.86 KB
<!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">
      <title>所有报警_frm</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/alarm/alarm.css"/>
      <link rel="stylesheet" type="text/css" href="../../css/style.css"/>
      <style>
          html,
          body{
            background-color: #F4F6F9;
          }
      </style>
  </head>
  <body>
    <div class="search-view-inline">
        <div class="select-list aui-ellipsis-1" tapmode id="select-imei" onclick="selectImei();">
            <span class="choose-device-title">请选择设备</span>
            <i></i>
        </div>
        <label style="background-color:rgba(240,245,255,1);"></label>
        <div class="select-list aui-ellipsis-1" tapmode id="select-status" onclick="selectStatus();">
            <span class="choose-device-title">报警类型</span>
            <i></i>
        </div>
    </div>
    <div class="alarm-panel" id="alarm_panel" tapmode onclick="closeSelectType();">
      <!-- <div class="list-panel">
        <div class="info-panel">
          <div class="aui-row top-14">
            <div class="aui-col-3">
              <div class="number-id">01</div>
            </div>
            <div class="aui-col-21">
              <span class="device-imei">设备ID:1657465464634125</span>
            </div>
          </div>
          <div class="list-line"></div>
        </div>
        <p class="warning-item-content alarms-style">
          <em class="ararm-btn">过载报警</em>
          <em class="ararm-btn">IGBT驱动异常</em>
          <em class="ararm-btn">产品内部超温</em>
          <em class="ararm-btn">过载报警</em>
        </p>
        <div class="list-footer">
          <span class="update-time">更新时间:2019-07-15 12:32:16</span>
        </div>
      </div> -->
    </div>
  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
  <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript">
      var page = 1,
        limit = 10,
        selected_imei = '',
        selected_status = '',
        nextDataFlag = true
        sequence = 0;
      var userId;
      var token;
      apiready = function(){
        api.parseTapmode();
        token = $api.getStorage('userToken');
        userId = $api.getStorage('userID');
        /**上拉加载 */
        api.addEventListener({
            name: 'scrolltobottom',
            extra: {
                threshold: 0
            }
        }, function(ret, err) {
            page += 1;
            getAlarmList();
            // console.log(JSON.stringify(ret));
        });
        /** 下拉刷新 */
        api.setRefreshHeaderInfo({
            loadingImg:'',
            bgColor: '#5B7FF8',
            textColor: '#000',
            textDown: '下拉刷新...',
            textUp: '松开刷新...'
        }, function(ret, err) {
          page = 1;
          selected_imei = '';
          selected_status = '';
          nextDataFlag = true;
          sequence = 0;
          $api.html($api.dom($api.byId("select-imei"), 'span'), "请选择设备");
          $api.html($api.dom($api.byId("select-status"), 'span'), "报警类型");
          //---移除dom中的所有元素
          var allDom = $api.domAll('.list-panel');
          for (var i = 0; i < allDom.length; i++) {
            $api.remove(allDom[i]);
          }
          getAlarmList();
          api.refreshHeaderLoadDone();
        });

        getAlarmList();
      };

      function getAlarmList() {

        api.ajax({
          url: HOST + '/iot_api/v1/app/get_warning_list?page=' + page + '&limit=' + limit + '&imei=' + selected_imei + '&status=' + selected_status + '&user_id=' + userId,
          method: 'GET',
          headers: {
            'Content-Type': 'application/json;charset=utf-8',
            'token': token
          },
        }, function(ret, err) {
          if (ret.code == 0) {
            if (!ret.data.next) {
              api.toast({msg: '暂无更多数据!',duration: 2000,location: 'bottom'});
              return;
            }else {
              var warningList = ret.data.rows;
              for (var i = 0; i < warningList.length; i++) {
                sequence += 1;
                var warningDomHtml =  addWarningListHtml(warningList[i],sequence);
                $api.append($api.byId("alarm_panel"), warningDomHtml);
              }
            }
          }else {
            api.toast({msg: '网络错误',duration: 2000,location: 'bottom'});
          }
        });
      }

      function selectImei() {
        api.openFrame({
            name: 'alarmImeiSelect_frm',
            url: './alarmImeiSelect_frm.html',
            rect: {
                x: 0,
                y: api.winHeight-204,
                w: api.winWidth,
                h: 204
            },
            pageParam: {
                selected: selected_imei
            },
            bounces: false,
            bgColor: '#FFFFFF',
        });

      }

      function selectStatus() {
        api.openFrame({
            name: 'alarmTypeSelect_frm',
            url: './alarmTypeSelect_frm.html',
            rect: {
                x: 0,
                y: api.winHeight-262,
                w: api.winWidth,
                h: 262
            },
            pageParam: {
                selected: selected_status,
            },
            bounces: false,
            bgColor: '#FFFFFF',
        });

      }

      function closeSelectType() {
        api.closeFrame({
            name: 'alarmTypeSelect_frm'
        });

      }
  </script>
  </html>