www-huanghe/modules/login/views/liyanglogin.html

<ion-modal-view>
  <div class="bar bar-header bar-header-blue">
    <div class="button button-icon icon  pus_blue" ng-click="hideModel()"></div>
    <button class="ion-android-close hideBackModel" ng-click="hideModel()"></button>
    <h1 class="bar_title" style="color: #fff">登录</h1>
  </div>
  <ion-content  has-bouncing="true" overflow-scroll="false" class="loginAccountWrap">
    <div class="buttons">
      <button class="button button-icon"></button>
    </div>
    <div>
      <img src="img/liyang_login.jpg" width="50%" height="35" style="display: block;margin:50px auto 53px"/>
    </div>
    <div class="login-mian" >
      <div class="login-content">
        <div class="blank-h12"></div>
        <div class="blank-h12"></div>
        <form name="form"  novalidate="novalidate">
          <div class="input-wrap row row-center" style="width: 90%;border: 1px solid #ccc; height: 50px;margin: 0 auto 6px;border-radius: 4px;top: -12px;" ng-class="{warn:form.tel.$dirty&&form.tel.$error.required}">
            <label  class="left-icon-wrap">
              手机号
            </label>
            <input type="tel" name="tel"  class="col login-input" placeholder="输入手机号码" ng-model="user.name" ng-minlength="11"  ng-maxlength="11" required ng-pattern="/1[3|4|5|7|8|9][0-9]{9}/" ng-focus/>
            <span class="login_pep"></span>
          </div>
          <div style="width: 100%; height: 20px; position: absolute;top: 39px;">
             <span  ng-if="(form.tel.$invalid&&form.tel.$dirty &&!form.tel.$focused) || (form.tel.$invalid && submitted )" class="tel_error">
                      <!--//验证1-->
                     <small  ng-if="form.tel.$error.required">*请输入11位手机号</small>
               <!--//验证2-->
                      <small ng-if="form.tel.$error.pattern">*请填写正确的手机号</small>
               <!--//验证3-->
                      <small ng-if="form.tel.$error.maxlength">手机号不能多于11位</small>
             </span>
          </div>
          <!--<span style="color:red" ng-if"myForm.user.$dirty && myForm.user.$invalid">
               <span ng-if="myForm.user.$error.required">手机号错误</span>
          </span>-->

          <div class="input-wrap row row-center mt-20" style="width: 90%;border: 1px solid #ccc !important; height: 50px;margin: 0 auto 6px;border-radius: 4px;" ng-class="{warn:form.password.$dirty&&form.password.$error.required}">
            <label  class="left-icon-wrap" style="text-align: center;padding-right: 4px;">
              密码
            </label>
            <input type="{{show_psd ? 'text' : 'password'}}" name="password"  class="col login-input" placeholder="输入6-20位密码"   ng-model="user.password" onkeyup="value=value.replace(/[^\w\.\/]/ig,'')"
                   required
                   ng-focus
                   ng-maxlength="20"
                   ng-minlength="6"/>


            <button class="psd-control" ng-click="showPassword()">
              <i class="icon  {{show_psd ? 'ion-ios-unlocked-outline' : 'ion-ios-locked-outline'}} " style="font-size: 26px;"></i>
            </button>
          </div>
          <div>
            <div style="width: 100%; height: 20px; position: absolute;top:111px;">
             <span class="tel_error" ng-if="(form.password.$invalid && form.password.$dirty && !form.password.$focused) || (form.password.$invalid && submitted)">
                        <small ng-if="form.password.$error.minlength">*密码不能少于6位</small>
                        <small ng-if="form.password.$error.maxlength">*密码不能多于20位</small>
                        <small ng-if="form.password.$error.required">*密码不能为空</small>
             </span>
            </div>
          </div>
          <div class="blank-h12"></div>
          <div class="blank-h12"></div>
          <button class="button button-block  button-positive my_login" ng-click="login(user)" type="submit" ng-disabled="(form.tel.$pristine||form.password.$pristine)||(form.tel.$dirty&&form.tel.$invalid )||(form.password.$dirty&& form.password.$invalid)"
                  style="margin-top: 27px !important;">
            登录
          </button>
        </form>
        <div style="" id="login_text">
          <div class=" text-left" style="width: 49%;margin: 0 auto;text-align: center;">
            还没有账号？<a  class="forget-passw" ng-click="registerHideModel()">立即注册</a>
          </div>
          <!--<div class=" text-right" style="width: 50%;float: left;">
            <a  class="forget-passw" ui-sref="findpsw">忘记密码?</a>
          </div>-->
        </div>
      </div>
      <!--<div  class="other_act">
        <i  class="line_hide"></i>

      </div>-->
      <!-- <p class="other_loge">
         <span class="t1"></span>
         <span class="t2"></span>
         <span class="t3"></span>
       </p>-->

    </div>
    <p class="text-center qq_login">
      <!--<small  class="other_load">第三方账号登录</small>-->
      <span ng-click="wechatLogin()" style="margin-top: 10px;" ng-show="app"><i class="weChat_login"></i><em>微信登录</em></span>
      <!--<span ng-click="qqLogin()" style="margin-top: 10px;"><i></i><em>QQ登录</em></span>-->
    </p>
    <span class="readAndAgreeM" ng-if="false">登录即代表阅读并同意<a ng-click="showAgreeMent()">用户协议</a></span>
    <div class=" comment_bottom" style="width: 49%;margin: 0 auto;text-align: center;">
      <span>登录即代表您已经同意</span>
      <span style="color: blue" ng-click="showPrivacyPolicy()">《平台隐私政策》</span>
    </div>
  </ion-content>
</ion-modal-view>
<style>
  @media screen and (min-width: 900px){
    .modal-backdrop, .modal-backdrop-bg{
      position: absolute;
      left: 0;
      top: 0;
      right: 0;
      bottom: 0;
      margin: auto;
      width: 20.5rem;
    }
  }
</style>