mine.html 11.6 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>mine-win</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/mine/mine.css"/>
      <style>
          html,
          body{
            background-color: #F4F6F9;
          }
      </style>
  </head>
  <body ontouchstart="" οnmοuseοver="">
    <div class="mine-top-bg" id="mine_top_bg"></div>
    <div class="persion-area-panel" id="persion_area_panel" tapmode onclick="openPersonCenter()">
      <div class="aui-list aui-list-noborder" style="background-color:rgba(0,0,0,0);">
        <div class="aui-list-item">
            <div class="aui-list-item-left">
              <img src="../../image/user-avatar-big.png" style="width:54px;height:54px;"/>
            </div>
            <div class="aui-list-item-center">
                <div class="aui-list-item-title user-name" id="user_name"></div>
                <div class="aui-list-item-subtitle user-phone" id="user_phone"></div>
            </div>
            <div class="aui-list-item-right">
              <i class="aui-iconfont aui-icon-right" style="color:#AEB8CE;"></i>
            </div>
        </div>
      </div>
    </div>
    <div class="choose-area">
      <div class="info-inside-panel">
        <div tapmode onclick="myDevices();">
          <div style="height:21px;"></div>
          <div class="aui-row aui-row-flex" >
            <div class="aui-col aui-col-span-3 aui-row-flex-start">
              <img src="../../image/mine/info-icon-1.png" style="width:22px;height:22px;" />
            </div>
            <div class="aui-col aui-col-span-10 aui-row-flex-start">
              <span class="title-obj">我的设备</span>
            </div>
            <div class="aui-col aui-col-span-11 aui-row-flex-end">
              <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
            </div>
          </div>
          <div class="panel-line margin-top-21"></div>
        </div>
        <div tapmode onclick="guide('repair');">
          <div style="height:21px;"></div>
          <div class="aui-row aui-row-flex" >
            <div class="aui-col aui-col-span-3 aui-row-flex-start">
              <img src="../../image/mine/info-icon-8.png" style="width:22px;height:22px;" />
            </div>
            <div class="aui-col aui-col-span-10 aui-row-flex-start">
              <span class="title-obj">故障报修</span>
            </div>
            <div class="aui-col aui-col-span-11 aui-row-flex-end">
              <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
            </div>
          </div>
          <div class="panel-line margin-top-21"></div>
        </div>        
        <div tapmode onclick="guide('appGuide');">
          <div style="height:21px;"></div>
          <div class="aui-row aui-row-flex" >
            <div class="aui-col aui-col-span-3 aui-row-flex-start">
              <img src="../../image/mine/info-icon-2.png" style="width:22px;height:22px;" />
            </div>
            <div class="aui-col aui-col-span-10 aui-row-flex-start">
              <span class="title-obj">App使用说明</span>
            </div>
            <div class="aui-col aui-col-span-11 aui-row-flex-end">
              <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
            </div>
          </div>
          <div class="panel-line margin-top-21"></div>
        </div>        
        <div tapmode onclick="guide('deviceGuide');">
          <div style="height:21px;"></div>
          <div class="aui-row aui-row-flex">
            <div class="aui-col aui-col-span-3 aui-row-flex-start">
              <img src="../../image/mine/info-icon-4.png" style="width:22px;height:22px;" />
            </div>
            <div class="aui-col aui-col-span-10 aui-row-flex-start">
              <span class="title-obj">设备使用说明</span>
            </div>
            <div class="aui-col aui-col-span-11 aui-row-flex-end">
              <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
            </div>
          </div>
          <div class="panel-line margin-top-21"></div>
        </div>
        <div tapmode onclick="guide('supportGuide');">
          <div style="height:21px;"></div>
          <div class="aui-row aui-row-flex">
            <div class="aui-col aui-col-span-3 aui-row-flex-start">
              <img src="../../image/mine/info-icon-5.png" style="width:22px;height:22px;" />
            </div>
            <div class="aui-col aui-col-span-10 aui-row-flex-start">
              <span class="title-obj">技术支持</span>
            </div>
            <div class="aui-col aui-col-span-11 aui-row-flex-end">
              <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
            </div>
          </div>
          <div class="panel-line margin-top-21"></div>
        </div>
        <div tapmode onclick="resetPwd();">
          <div style="height:21px;"></div>
          <div class="aui-row aui-row-flex">
            <div class="aui-col aui-col-span-3 aui-row-flex-start">
              <img src="../../image/mine/info-icon-6.png" style="width:22px;height:22px;" />
            </div>
            <div class="aui-col aui-col-span-10 aui-row-flex-start">
              <span class="title-obj">重置密码</span>
            </div>
            <div class="aui-col aui-col-span-11 aui-row-flex-end">
              <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
            </div>
          </div>
          <div class="panel-line margin-top-21"></div>
        </div>
        <div tapmode onclick="aboutUs();">
          <div style="height:21px;"></div>
          <div class="aui-row aui-row-flex">
            <div class="aui-col aui-col-span-3 aui-row-flex-start">
              <img src="../../image/mine/info-icon-7.png" style="width:22px;height:22px;" />
            </div>
            <div class="aui-col aui-col-span-10 aui-row-flex-start">
              <span class="title-obj">关于罗电</span>
            </div>
            <div class="aui-col aui-col-span-11 aui-row-flex-end">
              <i class="aui-iconfont aui-icon-right icon-right" style="color:#AEB8CE;"></i>
            </div>
          </div>
          <div class="panel-line" style="height:21px;background-color:#FFFFFF;"></div>
        </div>
      </div>
    </div>
    <div class="login-out-btn" tapmode onclick="loginOut();">退出登录</div>
    <div style="margin-bottom:15px;"></div>
    <footer></footer>
  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
  <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript" src="../../script/jquery-3.3.1.min.js"></script>
  <script type="text/javascript">
    var token;
    var userId;
      apiready = function(){
        api.parseTapmode();
        setStatusBg('light');
        token = api.getPrefs({sync: true,key: 'userToken'});
        userId = api.getPrefs({sync: true,key: 'userID'});
        var footer = $api.dom('footer'); // 获取 footer 标签元素
        var footerH = $api.fixTabBar(footer);
        getUserInfo();
        var statusH = api.getPrefs({sync: true,key: 'SAFEAREATOP'});
        // console.log("height:"+ (83+statusH) +"px");
        document.getElementById('mine_top_bg').style.cssText = "height:"+ (83+Number(statusH)) +"px";
        document.getElementById('persion_area_panel').style.cssText = "top:"+ (37+Number(statusH)) +"px";
      };

      function getUserInfo() {
        var username_ = api.getPrefs({sync: true,key: 'userName'});
        var userphone_ = api.getPrefs({sync: true,key: 'userPhone'});
        $api.html($api.byId('user_name'), username_);
        $api.html($api.byId('user_phone'), userphone_);
        // guide('deviceGuide');
      }

      function openPersonCenter() {
        api.closeWin({
            name: 'person_center'
        });
        api.closeWin({
            name: 'changePhone_win'
        });

        api.openWin({
            name: 'person_center',
            url: './person_center.html',
            slidBackEnabled: true,
        });
      }

      function myDevices() {
        api.openWin({
            name: 'my_devices_win',
            url: './my_devices_win.html',
            slidBackEnabled: true,
        });
      }

      function aboutUs() {
        api.openWin({
            name: 'aboutUs_win',
            url: './aboutUs_win.html',
            slidBackEnabled: true,
        });
      }

      function loginOut() {
        var dialogBox = api.require('dialogBox');
        dialogBox.alert({
            texts: {
                title: '',
                content: '确定退出登陆吗',
                leftBtnTitle: '取消',
                rightBtnTitle: '确认'
            },
            styles: {
                bg: '#fff',
                w: 300,
                corner:2,
                title: {
                    marginT: 20,
                    icon: '../../image/mine/img-signOut.png',
                    iconSize: 74,
                    titleSize: 14,
                    titleColor: '#000'
                },
                content: {
                    color: '#37394E',
                    size: 14
                },
                left: {
                    marginB: 0,
                    marginL: 0,
                    w: 150,
                    h: 47,
                    corner: 10,
                    bg: '#FFFFFF',
                    color: '#818295',
                    size: 16
                },
                right: {
                    marginB: 0,
                    marginL: 0,
                    w: 150,
                    h: 47,
                    corner: 10,
                    bg: '#FFFFFF',
                    color: '#5B7FF8',
                    size: 16
                },
                horizontalLine:{
                  color:'rgba(240,245,255,1)',
                  height:1
                },
                verticalLine:{
                    color:'rgba(240,245,255,1)',
                    width:1                 //(可选项)数字类型;左右边按钮竖线的高度;默认:0
                }
            }
        }, function(ret) {
          dialogBox.close({
              dialogName: 'alert'
          });
          if (ret.eventType == 'right') {
            var ajpush = api.require("ajpush");
            api.showProgress({
                style: 'default',
                animationType: 'fade',
                title: '正在退出...',
                text: '',
                modal: true
            });

            clearPush(ajpush, function(){
              // $api.clearStorage();
              api.removePrefs({
                  key: 'userToken'
              });
              //补充基础的缓存数据
              initHeaderH();
              check();
              api.hideProgress();
              api.sendEvent({
                  name: 'cleanIndexRefresh'
              });

            })
          }
        });
      }

      function resetPwd() {
        api.openWin({
            name: 'forgetPwd_login',
            url: './forgetPassword_win_login.html',
            slidBackEnabled: false,
        });

      }

      function guide(name) {
        api.openWin({
            name:  name + '_win',
            url: './' + name + '_win.html',
            slidBackEnabled: true,
        });
      }
  </script>
  </html>