protect_action_win.html 8.11 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">
      <meta name="referrer" content="no-referrer">
      <title>保护动作_win</title>
      <link rel="stylesheet" type="text/css" href="http://iot.uccc.cc:9090/app/css/api.css"/>
      <link rel="stylesheet" type="text/css" href="http://iot.uccc.cc:9090/app/css/aui.css"/>
      <link rel="stylesheet" type="text/css" href="http://iot.uccc.cc:9090/app/css/style.css"/>
      <style>
          html,
          body{
            background-color: #F4F6F9;
          }
      </style>
  </head>
  <body>
    <header class="aui-header-bar" style="padding-top:30px;background-color:#5B7FF8">
      <div class="aui-header-left" tapmode onclick="closeWin();">
          <i class="aui-iconfont aui-icon-left" style="color:#FFFFFF;font-size:16px;">返回</i>
      </div>
      <div class="aui-title title-font">保护动作</div>
      <div class="aui-header-right" tapmode onclick="handleMsg();">
        <div style="color: #FFFFFF;font-size: 14px;" id="edit_title">编辑</div>
      </div>
    </header>
    <div style="height:94px;background-color:#FFFFFF;box-shadow:0px 0px 8px 0px rgba(55,57,78,0.05);">
      <div class="store01001-protect-protect-title">
        <div style="margin-left:15px;margin-right:15.5px;">
          <div class="aui-row aui-row-flex store01001-protect-top-14">
            <div class="aui-col aui-col-span-1" style="margin-top: 1rem;">
              <div class="store01001-protect-title-sign"></div>
            </div>
            <div class="aui-col aui-col-span-23">
              <span class="store01001-protect-device-name" id="device_imei">设备编号:暂无</span>
            </div>
          </div>
        </div>
      </div>
      <div class="search-view-inline">
          <div class="select-list aui-ellipsis-1" style="width: 50%;" tapmode id="select-date" onclick="selectDate();">
              <span class="store01001-alarm-choose-device-title" id="selected_time">请选择日期</span>
              <i></i>
          </div>
          <label style="background-color:rgba(240,245,255,1);"></label>
          <div class="select-list aui-ellipsis-1" style="width: 50%;" tapmode id="select-status" onclick="selectActionType();">
              <span class="store01001-alarm-choose-device-title" id="selected_action">所有动作</span>
              <i></i>
          </div>
      </div>
    </div>
    <footer style="background:#FFFFFF;"></footer>
  </body>
  <script type="text/javascript" src="http://iot.uccc.cc:9090/app/js/api.js"></script>
  <script type="text/javascript" src="http://iot.uccc.cc:9090/app/js/common.js"></script>
  <script type="text/javascript">
    var defaultImei;
    var h;
    var f;
    var isEdit = false;
    var actionType = 'all';
      apiready = function(){
        api.parseTapmode();
        var header = $api.dom('header'); // 获取 header 标签元素
        var footer = $api.dom('footer'); // 获取 footer 标签元素
        var headerH = $api.fixStatusBar(header);
        var footerH = $api.fixTabBar(footer);
        h = headerH;
        f = footerH;
        defaultImei = api.pageParam.imei;
        $api.html($api.byId("device_imei"), '设备编号:'+ defaultImei);

        openProtectFrame(headerH,footerH);

        api.addEventListener({
            name: 'changeProtectType'
        }, function(ret, err){
            if( ret ){
              actionType = ret.value.curSelect;
              if (actionType != 'all') {
                $api.html($api.byId('selected_action'), '动作类型 ' + actionType);
              }else {
                $api.html($api.byId('selected_action'), '所有动作');
              }
            }
        });

        api.addEventListener({
            name: 'closeProtectFrame'
        }, function(ret, err){
            if( ret ){
              api.closeFrame({
                  name: 'protectAction_frm'
              });
              // $api.html($api.byId('selected_time'), '请选择日期');
              // $api.html($api.byId('selected_action'), '动作类型');
              $api.html($api.byId('edit_title') , '编辑');
              openProtectFrame(headerH,footerH);
            }
        });

        api.addEventListener({
            name: 'reloadProtectList'
        }, function(ret, err){
            if( ret ){
              $api.html($api.byId('selected_time'), '请选择日期');
              $api.html($api.byId('selected_action'), '所有动作');
            }
        });

        api.addEventListener({
            name: 'reflashPortect'
        }, function(ret, err){
            if( ret ){
              handleMsg(true);
            }
        });



        // if (api.pageParam.staticToProtect) {
        //   api.sendEvent({
        //       name: 'chanegProtectSearchDate',
        //       extra: {
        //         selected_time: api.pageParam.staticToProtect,
        //       }
        //   });
        // }
      };

      function openProtectFrame(headerH,footerH) {
        var params = {
          f: footerH,
          h: headerH,
          imei: api.pageParam.imei,
          productId: api.pageParam.productId
        }
        if (api.pageParam.staticToProtect) {
          $api.html($api.byId('selected_time'), api.pageParam.staticToProtect);
          params.staticToProtect = api.pageParam.staticToProtect;
        }
        api.openFrame({
            name: 'protectAction_frm',
            url: 'http://iot.uccc.cc:9090/app_html/store01001/protect_action_frm.html',
            rect: {
                x: 0,
                y: headerH+94,
                w: api.winWidth,
                h: api.winHeight-headerH-footerH-94
            },
            bounces: true,
            bgColor: '#F4F6F9',
            pageParam: params,
            hScrollBarEnabled: true,
            vScrollBarEnabled: true
        });
      }

      function closeWin() {
        api.closeWin();
      }

      function selectDate() {
        api.openPicker({
            type: 'date',
            date: new Date(),
            title: '选择日期'
        }, function(ret, err) {
          if (ret) {
            var allDate = timeFormater(ret.year,ret.month,ret.day);
            var date = new Date(allDate);
            var curdate = new Date();
            if (curdate.getTime() >= date.getTime()) {
              $api.html($api.byId('selected_time'), allDate);
              api.sendEvent({
                  name: 'chanegProtectSearchDate',
                  extra: {
                    selected_time: allDate,
                  }
              });
            }else {
              addAlert('请选择有效查询日期');
            }
          }
        });
      }

      function selectActionType() {
        api.openFrame({
            name: 'protectTypeSelect_frm',
            url: 'http://iot.uccc.cc:9090/app_html/store01001/protectTypeSelect_frm.html',
            rect: {
                x: 0,
                // y: api.winHeight-203,
                y: h,
                w: api.winWidth,
                h: api.winHeight-h-f

            },
            pageParam: {
                selected: actionType,
                imei: api.pageParam.imei,
                productId: api.pageParam.productId
            },
            bounces: false,
            animation: {
                type:"fade",                //动画类型(详见动画类型常量)
                subType:"from_bottom",       //动画子类型(详见动画子类型常量)
                duration:300                //动画过渡时间,默认300毫秒
            }
        });

      }

      function handleMsg(bol) {
        if (bol) {
          isEdit = false;
        }else {
          isEdit = !isEdit;
        }

        api.sendEvent({
            name: 'handleAllProtectMsgBegin',
            extra: {
              isEdit: isEdit,
            }
        });
        if (isEdit) {
          $api.html($api.byId('edit_title') , '取消');
        }else {
          $api.html($api.byId('edit_title') , '编辑');
        }
      }
  </script>
</html>