修改

jinlin

2024-02-23 1772fc5e211f9e9e0ab4cdc6c29b436aac178c2a

 web/src/views/pages/login.vue

@@ -1,18 +1,18 @@
<template>
  <div class="aui-wrapper aui-page__login aui-page__login__border">
    <h2 class="login__h2">{{ $t('brand.lg') }}</h2>
    <div class="aui-content__wrapper">
      <div class="clear"></div>
      <main class="aui-content">
        <img class="login-left-bg" src="../../assets/img/vis-map2.png"/>
<!--        <img class="login-left-bg" src="../../assets/img/vis-map2.png"/>-->
        <div class="login-content">
          <div class="login-header">
            <!--<h3 class="login-title">{{ $t('login.title') }}</h3>-->
          </div>
<!--          <div class="login-header">-->
<!--            &lt;!&ndash;<h3 class="login-title">{{ $t('login.title') }}</h3>&ndash;&gt;-->
<!--          </div>-->
          <h2 class="login__h2">{{ $t('brand.lg') }}</h2>
          <div class="login-body">
            <h3 class="login-title">{{ $t('login.title') }}</h3>
<!--            <h3 class="login-title">{{ $t('login.title') }}</h3>-->
            <el-form :model="dataForm" ref="dataForm" @keyup.enter.native="formSubmit()" status-icon>
              <zt-form-item class="login-form-margin" prop="username" rules="required">
              <zt-form-item class="login-form-margin" style="margin-top:35px" prop="username" rules="required">
                <el-input v-model="dataForm.username" :placeholder="$t('login.username')">
                <span slot="prefix" class="el-input__icon">
                  <svg class="icon-svg" aria-hidden="true"><use xlink:href="#icon-user"></use></svg>
@@ -26,6 +26,11 @@
                </span>
                </el-input>
              </zt-form-item>
<!--              <zt-form-item class="login-form-margin" prop="password" rules="required">-->
<!--                <span slot="prefix" class="el-input__icon">-->
<!--                  <svg class="icon-svg" aria-hidden="true"><use xlink:href="#icon-lock"></use></svg>-->
<!--                </span>-->
<!--              </zt-form-item>-->
              <zt-form-item prop="captcha" rules="required" v-if="$config.IS_LOGIN_NEED_CAPTURE">
                <el-row :gutter="20">
                  <el-col :span="14">
@@ -40,12 +45,14 @@
                  </el-col>
                </el-row>
              </zt-form-item>
              <el-form-item class="login-form-margin">
                <el-button style="margin-bottom:0;" type="primary" @click="formSubmit()">{{
                  $t('login.clickTitle') }}
         <!--     <el-form-item class="login-form-margin">
                <el-button class="btn" style="margin-bottom:0;float: left" type="primary" @click="changePassword()">修改密码</el-button>
                <el-button class="btn" style="margin-bottom:0;float: right" @click="register">用户注册
                </el-button>
                <el-button style="margin-bottom:0;" type="primary" @click="changePassword()">修改密码</el-button>
                <el-button style="margin-bottom:0;" @click="register">用户注册
              </el-form-item>-->
              <el-form-item class="login-form-margin">
                <el-button class="btn" style="margin-bottom:0;width: 100%" type="primary" @click="formSubmit()">{{
                  $t('login.clickTitle') }}
                </el-button>
              </el-form-item>
            </el-form>
@@ -53,11 +60,11 @@
<!--            <UserChangePassword ref="changePassword"/>-->
          </div>
        </div>
        <div class="login-time">
          <span v-text="day"></span>
          <br/>
          <span v-text="time"></span>
        </div>
<!--        <div class="login-time">-->
<!--          <span v-text="day"></span>-->
<!--          <br/>-->
<!--          <span v-text="time"></span>-->
<!--        </div>-->
      </main>
    </div>
  </div>
@@ -166,20 +173,12 @@
          // console.log(res,'getAdminRoleInfo');
          this.$store.state.user.isAdmin = res.data.isAdmin
          this.$store.state.user.isAssistant = res.data.isAssistant
          this.$store.state.user.isTyRole = res.data.isTyRole
          this.$store.state.user.isCjRole = res.data.isCjRole
          this.$store.state.user.isZcRole = res.data.isZcRole
          this.$store.state.user.isCzRole = res.data.isCzRole
          this.$store.state.user.isBzRole = res.data.isBzRole
          this.$store.state.user.isTzRole = res.data.isTzRole
          this.$store.state.user.isYwzRole = res.data.isYwzRole
          this.$store.state.user.roles = res.data.roles
          this.$store.state.debug = res.data.debug
          this.$store.state.test = res.data.test
          this.$store.state.menuPos = res.data.menuPos
          window.SITE_CONFIG['isAdmin'] = res.data.isAdmin // 权限
          this.loading = false
          console.log(this.$store.state.user.isZcRole, 'this.$store.state.user.isZcRole')
        }).catch(() => {
          console.log('/user/adminRole', 'adminRole')
        })
@@ -213,13 +212,7 @@
                  console.log(res.data.roleName,'res.data.roleName res.data.roleName')
                  if (res.data.roleName != null &&
                    (res.data.roleName.indexOf('系统管理员') >= 0 ||
                      res.data.roleName.indexOf('全部权限') >= 0 ||
                      res.data.roleName.indexOf('总体所角色') >= 0 ||
                      res.data.roleName.indexOf('代表室角色') >= 0 ||
                      res.data.roleName.indexOf('助理角色') >= 0 ||
                      res.data.roleName.indexOf('总厂角色') >= 0 ||
                      res.data.roleName.indexOf('部长角色') >= 0 ||
                      res.data.roleName.indexOf('处长角色') >= 0)
                      res.data.roleName.indexOf('全部权限') >= 0)
                  ) {
                    console.log('TestDjxlHome')
                    // this.$router.push({name: 'TestDjxlHome', params: {roleName: res.data.roleName}})
@@ -230,8 +223,11 @@
                  }
                }
                let roleName = res.data.roleName
                let userSecretClass = res.data.userSecretClass
                localStorage.setItem('roleName', roleName)
                localStorage.setItem('userSecretClass', userSecretClass)
                console.log(localStorage.getItem('roleName'),'localStorage.getItem(\'roleName\')')
                console.log(localStorage.getItem('userSecretClass'),'localStorage.getItem(\'userSecretClass\')')
              }
            }
          })
@@ -242,31 +238,22 @@
</script>
<style>
  .login__h2 {
    float: left;
    margin: 0;
    margin-left: 35.5%;
    color: rgba(123, 224, 244, 1);
    font-size: 40px;
    margin-top: 20px;
    width: 600px;
    position: absolute;
    left: -11%;
    top: -10%;
    letter-spacing: 35px;
    color: #fff;
    font-size: 1.5rem;
    font-weight: 400;
    letter-spacing: 8px;
    text-align: center;
    margin-bottom: -80px;
  }

  .clear {
    clear: both;
  }

  .login__h2::before,
  .login__h2::after {
    display: inline;
    margin: 5px;
    content: '/////';
    font-size: 25px;
    font-weight: bold;
    font-style: oblique;
  }


  .login-left-bg {
    position: absolute;
@@ -279,11 +266,15 @@

  .login-content {
    position: absolute;
    border-radius: 20px;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    width: 25%;
    border: 15px solid transparent;
    border-image: url(../../assets/img/page-border.png) 20 stretch;
    right: 7%;
    top: 20%;
    background:#ecf0f3;
    box-shadow: 0 3px 6px 0 rgb(72 119 232 / 14%);
    //border: 15px solid transparent;
    //border-image: url(../../assets/img/page-border.png) 20 stretch;
  }

  .login-h6 {
@@ -292,27 +283,65 @@
    margin-top: -6px;
    margin-bottom: 25px;
  }

  .login-body .el-input__inner {
  .login-body {
    position: relative;
  }
  .login-body .el-input{
    border-radius: 3px;
    height: 60px;
    font-size: 17px;
    color: rgba(123, 224, 244, 1);
    background: transparent;
    border: 1px solid rgba(123, 224, 244, 0.3);
    color: #000;
    background-color: #fff !important;
    outline: none; /* 移除聚焦时的外边框样式 */
    border: none; /* 移除默认的边框样式 */
    box-shadow: 20px 20px 30px rgba(0,0,0,0.2),
    -20px -20px 30px rgba(255,255,255,1);
    transition: all 0.4s ease-out;
  }
  .login-title{
    box-shadow: 20px 20px 30px rgba(0,0,0,0.2),
    -20px -20px 30px rgba(255,255,255,1);
    transition: all 0.4s ease-out;
  }
  .login-body .el-input:hover{
    box-shadow:
      0 0 0 rgba(0,0,0,0.2),
      0 0 0 rgba(255,255,255,0.8),
      inset 10px 10px 20px rgba(0,0,0,0.1),
      inset -10px -10px 20px rgba(255,255,255,1);
  }
  .login-body .el-input__inner{
    font-size: 18px;
    height: inherit;
    transition: all 0.4s ease-out;
    border: none; /* 移除默认的边框样式 */
  }
  .login-body .el-input__inner:hover{
    font-size: 16px;
  }

  .aui-page__login__border .el-input {
    border: 1px solid rgba(123, 224, 244, 0.3);
    border-radius: 4px;
  .login-form-margin .btn{
    border: none !important;
    box-shadow: 20px 20px 30px rgba(0,0,0,0.2),
    -20px -20px 30px rgba(255,255,255,1);
    transition: all 0.4s ease-out;
  }

  .aui-page__login__border .el-input:hover,
  .aui-page__login__border .el-input:active {
    border-radius: 4px;
    border: 1px solid rgba(123, 224, 244, 1);
  .login-form-margin .btn:hover{
    box-shadow:
      0 0 0 rgba(0,0,0,0.2),
      0 0 0 rgba(255,255,255,0.8),
      inset 10px 10px 20px rgba(0,0,0,0.1),
      inset -10px -10px 20px rgba(255,255,255,1);
  }

  input:-webkit-autofill ,
  textarea:-webkit-autofill,
  select:-webkit-autofill{
    -webkit-text-fill-color: #000 !important;
    -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
    background-color: transparent;
    font-size: 18px;
    background-image: none;
    transition: all 0.4s ease-out;
  }
  .aui-page__login__border .el-form-item {
    margin-bottom: 35px;
  }
@@ -321,9 +350,6 @@
    height: 50px;
  }

  .aui-page__login__border .el-form-item__content .el-input__inner {
    background: transparent !important;;
  }

  .aui-page__login__border .login-body .el-input__prefix .el-input__icon {
    font-size: 25px;
@@ -355,13 +381,4 @@
    color: rgba(0, 153, 255, 1)
  }

  input:-webkit-autofill,
  textarea:-webkit-autofill,
  select:-webkit-autofill {
    -webkit-text-fill-color: rgba(123, 224, 244, 1) !important;
    -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
    background-color: transparent;
    background-image: none;
    transition: background-color 50000s ease-in-out 5000s;
  }
</style>