Commit bf12cb89df2ffe4ec2d9c4c9e81df1de0d7e5e85
1 parent
266a1325
perf: login
Showing
1 changed file
with
34 additions
and
28 deletions
yudao-ui-admin-vue3/src/views/Login/components/LoginForm.vue
| @@ -104,29 +104,29 @@ | @@ -104,29 +104,29 @@ | ||
| 104 | <div class="flex justify-between w-[100%]"> | 104 | <div class="flex justify-between w-[100%]"> |
| 105 | <Icon | 105 | <Icon |
| 106 | icon="ant-design:github-filled" | 106 | icon="ant-design:github-filled" |
| 107 | - :size="iconSize" | 107 | + :size="30" |
| 108 | class="cursor-pointer anticon" | 108 | class="cursor-pointer anticon" |
| 109 | - :color="iconColor" | 109 | + color="#999" |
| 110 | @click="doSocialLogin('github')" | 110 | @click="doSocialLogin('github')" |
| 111 | /> | 111 | /> |
| 112 | <Icon | 112 | <Icon |
| 113 | icon="ant-design:wechat-filled" | 113 | icon="ant-design:wechat-filled" |
| 114 | - :size="iconSize" | 114 | + :size="30" |
| 115 | class="cursor-pointer anticon" | 115 | class="cursor-pointer anticon" |
| 116 | - :color="iconColor" | 116 | + color="#999" |
| 117 | @click="doSocialLogin('wechat')" | 117 | @click="doSocialLogin('wechat')" |
| 118 | /> | 118 | /> |
| 119 | <Icon | 119 | <Icon |
| 120 | icon="ant-design:alipay-circle-filled" | 120 | icon="ant-design:alipay-circle-filled" |
| 121 | - :size="iconSize" | ||
| 122 | - :color="iconColor" | 121 | + :size="30" |
| 122 | + color="#999" | ||
| 123 | class="cursor-pointer anticon" | 123 | class="cursor-pointer anticon" |
| 124 | @click="doSocialLogin('alipay')" | 124 | @click="doSocialLogin('alipay')" |
| 125 | /> | 125 | /> |
| 126 | <Icon | 126 | <Icon |
| 127 | icon="ant-design:dingtalk-circle-filled" | 127 | icon="ant-design:dingtalk-circle-filled" |
| 128 | - :size="iconSize" | ||
| 129 | - :color="iconColor" | 128 | + :size="30" |
| 129 | + color="#999" | ||
| 130 | class="cursor-pointer anticon" | 130 | class="cursor-pointer anticon" |
| 131 | @click="doSocialLogin('dingtalk')" | 131 | @click="doSocialLogin('dingtalk')" |
| 132 | /> | 132 | /> |
| @@ -165,19 +165,21 @@ import * as LoginApi from '@/api/login' | @@ -165,19 +165,21 @@ import * as LoginApi from '@/api/login' | ||
| 165 | import { LoginStateEnum, useLoginState, useFormValid } from './useLogin' | 165 | import { LoginStateEnum, useLoginState, useFormValid } from './useLogin' |
| 166 | 166 | ||
| 167 | const { t } = useI18n() | 167 | const { t } = useI18n() |
| 168 | -const iconHouse = useIcon({ icon: 'ep:house' }) | ||
| 169 | -const iconAvatar = useIcon({ icon: 'ep:avatar' }) | ||
| 170 | -const iconLock = useIcon({ icon: 'ep:lock' }) | ||
| 171 | -const { currentRoute, push } = useRouter() | ||
| 172 | -const permissionStore = usePermissionStore() | ||
| 173 | const formLogin = ref() | 168 | const formLogin = ref() |
| 174 | const { validForm } = useFormValid(formLogin) | 169 | const { validForm } = useFormValid(formLogin) |
| 175 | const { setLoginState, getLoginState } = useLoginState() | 170 | const { setLoginState, getLoginState } = useLoginState() |
| 176 | -const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN) | ||
| 177 | -const iconSize = 30 | ||
| 178 | -const iconColor = '#999' | 171 | +const { currentRoute, push } = useRouter() |
| 172 | +const permissionStore = usePermissionStore() | ||
| 179 | const redirect = ref<string>('') | 173 | const redirect = ref<string>('') |
| 180 | const loginLoading = ref(false) | 174 | const loginLoading = ref(false) |
| 175 | +const iconHouse = useIcon({ icon: 'ep:house' }) | ||
| 176 | +const iconAvatar = useIcon({ icon: 'ep:avatar' }) | ||
| 177 | +const iconLock = useIcon({ icon: 'ep:lock' }) | ||
| 178 | +const verify = ref() | ||
| 179 | +const captchaType = ref('blockPuzzle') // blockPuzzle 滑块 clickWord 点击文字 | ||
| 180 | + | ||
| 181 | +const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN) | ||
| 182 | + | ||
| 181 | const LoginRules = { | 183 | const LoginRules = { |
| 182 | tenantName: [required], | 184 | tenantName: [required], |
| 183 | username: [required], | 185 | username: [required], |
| @@ -192,26 +194,26 @@ const loginData = reactive({ | @@ -192,26 +194,26 @@ const loginData = reactive({ | ||
| 192 | signIn: false | 194 | signIn: false |
| 193 | }, | 195 | }, |
| 194 | loginForm: { | 196 | loginForm: { |
| 195 | - tenantName: '芋道源码', | ||
| 196 | - username: 'admin', | ||
| 197 | - password: 'admin123', | 197 | + tenantName: Cookies.get('tenantName') ? Cookies.get('tenantName') : '芋道源码', |
| 198 | + username: Cookies.get('username') ? Cookies.get('username') : 'admin', | ||
| 199 | + password: Cookies.get('password') | ||
| 200 | + ? (decrypt(Cookies.get('password')) as unknown as string) | ||
| 201 | + : 'admin123', | ||
| 198 | captchaVerification: '', | 202 | captchaVerification: '', |
| 199 | rememberMe: false | 203 | rememberMe: false |
| 200 | } | 204 | } |
| 201 | }) | 205 | }) |
| 202 | -// blockPuzzle 滑块 clickWord 点击文字 | ||
| 203 | -const verify = ref() | ||
| 204 | -const captchaType = ref('blockPuzzle') | 206 | + |
| 205 | // 获取验证码 | 207 | // 获取验证码 |
| 206 | const getCode = async () => { | 208 | const getCode = async () => { |
| 207 | // 情况一,未开启:则直接登录 | 209 | // 情况一,未开启:则直接登录 |
| 208 | if (loginData.captchaEnable === 'false') { | 210 | if (loginData.captchaEnable === 'false') { |
| 209 | await handleLogin({}) | 211 | await handleLogin({}) |
| 210 | - return | 212 | + } else { |
| 213 | + // 情况二,已开启:则展示验证码;只有完成验证码的情况,才进行登录 | ||
| 214 | + // 弹出验证码 | ||
| 215 | + verify.value.show() | ||
| 211 | } | 216 | } |
| 212 | - // 情况二,已开启:则展示验证码;只有完成验证码的情况,才进行登录 | ||
| 213 | - // 弹出验证码 | ||
| 214 | - verify.value.show() | ||
| 215 | } | 217 | } |
| 216 | //获取租户ID | 218 | //获取租户ID |
| 217 | const getTenantId = async () => { | 219 | const getTenantId = async () => { |
| @@ -221,7 +223,9 @@ const getTenantId = async () => { | @@ -221,7 +223,9 @@ const getTenantId = async () => { | ||
| 221 | // 记住我 | 223 | // 记住我 |
| 222 | const getCookie = () => { | 224 | const getCookie = () => { |
| 223 | const username = Cookies.get('username') | 225 | const username = Cookies.get('username') |
| 224 | - const password = Cookies.get('password') ? decrypt(Cookies.get('password')) : undefined | 226 | + const password = Cookies.get('password') |
| 227 | + ? (decrypt(Cookies.get('password')) as unknown as string) | ||
| 228 | + : undefined | ||
| 225 | const rememberMe = Cookies.get('rememberMe') | 229 | const rememberMe = Cookies.get('rememberMe') |
| 226 | const tenantName = Cookies.get('tenantName') | 230 | const tenantName = Cookies.get('tenantName') |
| 227 | loginData.loginForm = { | 231 | loginData.loginForm = { |
| @@ -253,7 +257,9 @@ const handleLogin = async (params) => { | @@ -253,7 +257,9 @@ const handleLogin = async (params) => { | ||
| 253 | }) | 257 | }) |
| 254 | if (loginData.loginForm.rememberMe) { | 258 | if (loginData.loginForm.rememberMe) { |
| 255 | Cookies.set('username', loginData.loginForm.username, { expires: 30 }) | 259 | Cookies.set('username', loginData.loginForm.username, { expires: 30 }) |
| 256 | - Cookies.set('password', encrypt(loginData.loginForm.password), { expires: 30 }) | 260 | + Cookies.set('password', encrypt(loginData.loginForm.password as unknown as string), { |
| 261 | + expires: 30 | ||
| 262 | + }) | ||
| 257 | Cookies.set('rememberMe', loginData.loginForm.rememberMe, { expires: 30 }) | 263 | Cookies.set('rememberMe', loginData.loginForm.rememberMe, { expires: 30 }) |
| 258 | Cookies.set('tenantName', loginData.loginForm.tenantName, { expires: 30 }) | 264 | Cookies.set('tenantName', loginData.loginForm.tenantName, { expires: 30 }) |
| 259 | } else { | 265 | } else { |