login_frm.html 9.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">
      <title>login_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/style.css" />
      <link rel="stylesheet" type="text/css" href="../../css/login/login.css" />
  </head>
  <body class="login-aui-view" ontouchstart="">
    <div class="aui-content-padded aui-margin-b-15">
      <img src="../../image/logo2.png" class="logo-img" />
      <!-- <div class="aui-row aui-row-flex" style="margin-top:40px;">
          <div class="aui-col aui-col-span-24 aui-row-flex-center aui-row-flex-middle" style="height:80px;">
            <img src="../../image/logo2.png" style="width:95px;height:35px;" />
          </div>
      </div> -->
    </div>
    <div style="margin-left:2rem;margin-right:2rem;margin-top:3rem;">
      <div class="aui-list">
        <div class="aui-list-item" id="name_input">
            <div class="aui-list-item-left">
              <img src="../../image/login/login_icon_user.png" style="height:24px;width:24px;"/>
            </div>
            <div class="aui-list-item-center">
                <input id="input_phone" class="aui-input input-style-normal" type="text" placeholder="请输入账号" onfocus="focusInput(1)" onblur="cleanFocus(1);">
            </div>
        </div>
        <div class="aui-list-item" id="pwd_input">
            <div class="aui-list-item-left">
              <img src="../../image/login/login_icon_password.png" style="height:24px;width:24px;"/>
            </div>
            <div class="aui-list-item-center">
                <input id="input_pwd" class="aui-input input-style-normal" type="password" placeholder="请输入密码" onfocus="focusInput(2)" onblur="cleanFocus(2);">
            </div>
        </div>
        <span tapmode onclick="forgetPassword();" class="aui-pull-left aui-margin-t-15 tytx-color-b">忘记密码</span>
        <span tapmode onclick="codeLogin();" class="aui-pull-right aui-margin-t-15 tytx-color-b">验证码登录</span>
        <span class="aui-clearfix"></span>
        <span tapmode onclick="login(this);" id="loginBtn" class="login-btn">登录</span>
        <div tapmode onclick="phoneRegister();" class="login-register" style="height:30px;">注册新用户</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" src="../../script/jquery-3.3.1.min.js"></script>
  <script type="text/javascript">
      apiready = function(){
        api.parseTapmode();
        api.addEventListener({
            name: 'cleanLoginPage'
        }, function(ret, err){
            if( ret ){
              api.openWin({
                  name: 'root',
                  url: 'widget://html/index.html',
                  reload: true,
                  slidBackEnabled: false,
              });

              api.sendEvent({
                  name: 'closeLoginPage'
              });
            }
        });
        api.addEventListener({
            name: 'showPhone'
        }, function(ret, err){
          if( ret.value.phone ){
            var obj = $api.byId("input_phone");
            $api.val(obj, ret.value.phone);
          }
        });
      };

      function focusInput(val) {
        var dom;
        if (val == 1) {
          dom = $api.byId('name_input');
        }else if (val == 2) {
          dom = $api.byId('pwd_input');
        }
        dom.style.cssText = "background-image: linear-gradient(0deg, #5b7ff8, #5b7ff8 50%, transparent 50%);"
      }

      function cleanFocus(val) {
        var dom;
        if (val == 1) {
          dom = $api.byId('name_input');
        }else if (val == 2) {
          dom = $api.byId('pwd_input');
        }
        dom.style.cssText = "background-image: linear-gradient(0deg, #e8e8e8, #e8e8e8 50%, transparent 50%);"
      }

      function login() {
        var input_phone_dom = $api.byId('input_phone');
        var inputed_pwd_dom = $api.byId('input_pwd');
        input_phone_dom.blur();
        inputed_pwd_dom.blur();
        var inputed_phone = $api.val($api.byId('input_phone'));
        var inputed_pwd = $api.val($api.byId('input_pwd'));
        // if (!checkPhone(inputed_phone)) {
          /**
           * 引入企业账号概念,取消手机号验证 
           */
          
           // api.toast({
          //     msg: "请输入正确的手机号"
          // });
          // return;
        // }else {
          api.showProgress({
              style: 'default',
              animationType: 'zoom',
              modal: true
          });
          $.ajax({
              url: HOST + '/iot_api/v2/app/login',
              type: 'POST',
              dataType: 'json',
              headers:{
                  'Content-Type':'application/json;charset=utf-8',
                  'imei':api.deviceId
              },
              data: JSON.stringify({
                phone: inputed_phone,
                password: inputed_pwd
              }),
              complete: function() {
                  api.hideProgress();
              },
              success: function(ret) {
                if (ret.code == 0) {
                  $api.clearStorage();
                  api.toast({
                      msg: '登陆成功',
                      duration: 2000,
                      location: 'bottom'
                  });
                  var now = new Date();
                  // $api.setStorage('login_time', now.getTime());
                  // $api.setStorage('userToken', ret.data.token);
                  api.setPrefs({
                    key: 'login_time',
                    value: now.getTime()
                  });
                  api.setPrefs({
                    key: 'userToken',
                    value: ret.data.token
                  });
                  
                  $.ajax({
                      url: HOST + '/iot_api/v2/app/user',
                      type: 'GET',
                      dataType: 'json',
                      headers: {
                          'Content-Type': 'application/json;charset=utf-8',
                          'token': ret.data.token
                      },
                      success: function(rett) {
                        console.log(JSON.stringify(rett));
                        
                        if (rett.code == 0 && rett.data.user) {
                          var user = rett.data.user;
                          // $api.setStorage('userName', user.name);
                          // $api.setStorage('userPhone', user.user);
                          // $api.setStorage('userID', user.id);
                          api.setPrefs({
                            key: 'userName',
                            value: user.name
                          });
                          api.setPrefs({
                            key: 'userPhone',
                            value: user.user
                          });
                          api.setPrefs({
                            key: 'userID',
                            value: user.id
                          });
                          api.setPrefs({
                            key: 'userType',
                            value: chooseUserType(user.type)
                          });
                          api.openWin({
                              name: 'root',
                              url: 'widget://html/index.html',
                              reload: true,
                              slidBackEnabled: false,
                          });


                          api.sendEvent({
                              name: 'closeLoginPage'
                          });
                        }
                      }
                  });
                }else {
                  api.toast({
                      msg: "登陆失败," + ajaxCodeCheck(ret.code, ret.msg, '请稍后再试')
                  });
                }
              },
              error: function() {
                api.toast({msg: ERR_MSG,duration: 2000,location: 'bottom'});
              }
          });
        // }
      }

      function phoneRegister() {
        api.openWin({
          slidBackEnabled:false,
          name: 'phoneRegister',
          url: './register_win.html',
          allowEdit:true
        });
      }

      function codeLogin() {
        api.openWin({
          slidBackEnabled:false,
          name: 'codeLogin',
          url: './codeLogin_win.html',
          allowEdit:true
        });
      }

      function forgetPassword() {
        api.openWin({
          slidBackEnabled:false,
          name: 'forgetPassword',
          url: './forgetPassword_win.html',
          allowEdit:true,
          animation: {
            type:"movein",
            subType:"from_left",
            duration:300  
          }
        });

      }
  </script>
  </html>