yangys
2024-01-16 30ab871400e5064bc38085ef64931b8dc1f64fb9
src/views/login/index.vue
@@ -7,44 +7,23 @@
        <span class="svg-container svg-container_login">
          <svg-icon icon-class="user" />
        </span>
        <el-input  name="username" type="text" v-model="loginForm.username" autoComplete="on" placeholder="请输入用户名" />
        <el-input class="home-input"  name="username" type="text" v-model="loginForm.username" autoComplete="on" placeholder="请输入用户名" />
      </el-form-item>
      <el-form-item prop="password" class="username">
        <span class="svg-container">
          <svg-icon icon-class="password"></svg-icon>
        </span>
        <el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="off"
        <el-input class="home-input" name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="off"
          placeholder="请输入密码"></el-input>
          <span class="show-pwd" @click="showPwd"><svg-icon icon-class="eye" v-show="pwdType==='password'"/><svg-icon icon-class="eyeopen" v-show="pwdType!=='password'"/></span>
      </el-form-item>
      <el-form-item style="text-align: center;margin-top: 30px">
      <el-form-item class="login-btn" style="text-align: center;">
        <div class="btn" :loading="loading" @click="handleLogin">
          登录
        </div>
      </el-form-item>
    </el-form>
    <p class="compName">千文科技</p><el-form class="login-form" autoComplete="on" :model="loginForm" :rules="loginRules" ref="loginForm" label-position="left">
      <el-form-item prop="username" class="username">
        <span class="svg-container svg-container_login">
          <svg-icon icon-class="user" />
        </span>
        <el-input  name="username" type="text" v-model="loginForm.username" autoComplete="on" placeholder="请输入用户名" />
      </el-form-item>
      <el-form-item prop="password" class="username">
        <span class="svg-container">
          <svg-icon icon-class="password"></svg-icon>
        </span>
        <el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="off"
          placeholder="请输入密码"></el-input>
          <span class="show-pwd" @click="showPwd"><svg-icon icon-class="eye" v-show="pwdType==='password'"/><svg-icon icon-class="eyeopen" v-show="pwdType!=='password'"/></span>
      </el-form-item>
      <el-form-item style="text-align: center;margin-top: 30px">
        <div class="btn" :loading="loading" @click="handleLogin">
          登录
        </div>
      </el-form-item>
    </el-form>
    <p class="compName">千文科技</p>
    <p class="compName">Copyright ©  2023 江苏千文科技有限公司   版权所有</p>
    </template>
  </Home>
  <!-- <div class="login-container">
@@ -168,24 +147,25 @@
$light_gray:#eee;
/* reset element-ui css */
.el-input {
  .login-form .el-input {
    display: inline-block;
    height: 47px;
    // height: 47px;
    width: calc(100% - 40px);
    input {
      background: transparent;
      border: 0px;
      -webkit-appearance: none;
      border-radius: 0px;
      padding: 12px 5px 12px 15px;
      // padding: 12px 5px 12px 15px;
      color: $light_gray;
      height: 47px;
      // height: 47px;
      &:-webkit-autofill {
        -webkit-box-shadow: 0 0 0px 1000px $bg inset !important;
        -webkit-text-fill-color: #fff !important;
      }
    }
  }
</style>
@@ -205,8 +185,8 @@
    padding-left: 30px;
    height: 94px;
    flex: 0 0 auto;
    background-image: url('~@/assets/img/login/top.png');
    background-size: contain;
    background: url('~@/assets/img/login/top.png') 100% 100% no-repeat;
    // background-size: cover;
    img {
      display: inline-block;
      width: 500px;
@@ -310,4 +290,7 @@
    text-align: center;
    font-size: 70%;
  }
  .login-btn {
    margin-top: 30px;
  }
</style>