更新

Your Name

2022-07-27 b78c039181ac316964a0f0de077170de178d90ab

 src/views/loginPage/component/accountLogin.vue

@@ -1,9 +1,18 @@
<template>
   <el-form size="large" class="login-content-form">
      <el-form-item class="login-animation1">
         <el-input type="text" :placeholder="$t('message.account.accountPlaceholder1')" v-model="ruleForm.username" clearable autocomplete="off" size="large">
            <el-input
                type="text"
                :placeholder="$t('message.account.accountPlaceholder1')"
                v-model="ruleForm.username"
                clearable
                autocomplete="off"
                size="large"
            >
            <template #prefix>
               <el-icon class="el-input__icon" style="margin-right: 20px"><img src="../../../assets/loginPage/login_icon_user.png" style="width: 24px;height: 24px"></el-icon>
                    <el-icon class="el-input__icon" style="margin-right: 20px"
                        ><img src="../../../assets/loginPage/login_icon_user.png" style="width: 24px; height: 24px"
                    /></el-icon>
            </template>
         </el-input>
      </el-form-item>
@@ -17,7 +26,9 @@
                @keyup.enter.native="onSignIn"
         >
            <template #prefix>
               <el-icon class="el-input__icon" style="margin-right: 20px"><img src="../../../assets/loginPage/login_icon_password.png" style="width: 24px;height: 24px"></el-icon>
                    <el-icon class="el-input__icon" style="margin-right: 20px"
                        ><img src="../../../assets/loginPage/login_icon_password.png" style="width: 24px; height: 24px"
                    /></el-icon>
            </template>
            <template #suffix>
               <i
@@ -55,24 +66,24 @@
import { formatAxis } from '/@/utils/formatTime';
import { NextLoading } from '/@/utils/loading';
import { useLoginApi } from '/@/api/login';
import {useUserInfo} from "/@/stores/userInfo";
import { useUserInfo } from '/@/stores/userInfo';

export default defineComponent({
   name: 'accountLogin',
   setup() {
      const { t } = useI18n();
      const userInfo = useUserInfo()
        const userInfo = useUserInfo();
      const route = useRoute();
      const router = useRouter();
      const state = reactive({
         isShowPassword: false,
         ruleForm: {
            username: '',
            password: '',
                password: ''
         },
         loading: {
            signIn: false,
         },
                signIn: false
            }
      });
      // 时间获取
      const currentTime = computed(() => {
@@ -82,20 +93,21 @@
      const onSignIn = async () => {
         state.loading.signIn = true;
         // 存储 token 到浏览器缓存
         let res = await useLoginApi().signIn(state.ruleForm)
            let res = await useLoginApi().signIn(state.ruleForm);
         if(res.data.code === '200'){
            userInfo.setUserInfos(res.data.data)
                await userInfo.setUserInfos(res.data.data);
            Session.set('token', res.data.data.accessToken);
            Session.set('projectId','');
            Session.set('uid',res.data.data.uid);
            signInSuccess();
                await signInSuccess();
         }else{
            state.loading.signIn = false
                state.loading.signIn = false;
            ElMessage({
               type:'warning',
               message:res.data.msg
            })
                });
         }
            state.loading.signIn = false;
         // Session.set('token', Math.random().toString(36).substr(0));
         // // 模拟数据，对接接口时，记得删除多余代码及对应依赖的引入。用于 `/src/stores/userInfo.ts` 中不同用户登录判断（模拟数据）
         // Cookies.set('userName', state.ruleForm.username);
@@ -136,9 +148,9 @@
      };
      return {
         onSignIn,
         ...toRefs(state),
            ...toRefs(state)
      };
   },
    }
});
</script>

@@ -151,9 +163,9 @@
      height: 56px;
      border-radius: 28px;
      padding: 0 30px;
      background: #F2F2F2;
        background: #f2f2f2;
      &:focus-within{
         border: 1px solid #2053D7;
            border: 1px solid #2053d7;
      }
   }
   @for $i from 1 through 4 {
@@ -170,7 +182,7 @@
      justify-content: space-between;

      .forgetCode{
         color: #2053D7;
            color: #2053d7;
         cursor: pointer;
      }
   }
@@ -197,11 +209,11 @@
      letter-spacing: 4px;
      font-weight: 300;
      margin-top: 15px;
      background: #2053D7;
      transition: .3s;
        background: #2053d7;
        transition: 0.3s;
      &:hover{
         letter-spacing: 6px;
         background: #4E7AEC;
            background: #4e7aec;
      }
   }
}