From acd82e817644e75fb61088d3dfb937859d7f3819 Mon Sep 17 00:00:00 2001
From: yinbangzhong <zhongbangyin@126.com>
Date: 星期三, 07 八月 2024 16:27:15 +0800
Subject: [PATCH] 登录跳转权限配置页面
---
src/store/modules/user/index.ts | 8 +
src/router/guard/userLoginInfo.ts | 62 ++++++------
src/views/login/components/login-form.vue | 200 ++++++++++++++++++++-------------------
3 files changed, 142 insertions(+), 128 deletions(-)
diff --git a/src/router/guard/userLoginInfo.ts b/src/router/guard/userLoginInfo.ts
index 876976d..8facaf8 100644
--- a/src/router/guard/userLoginInfo.ts
+++ b/src/router/guard/userLoginInfo.ts
@@ -9,36 +9,36 @@
NProgress.start();
const userStore = useUserStore();
next();
- // if (isLogin()) {
- // if (userStore.role) {
- // next();
- // } else {
- // try {
- // await userStore.info();
- // next();
- // } catch (error) {
- // await userStore.logout();
- // next({
- // name: 'login',
- // query: {
- // redirect: to.name,
- // ...to.query,
- // } as LocationQueryRaw,
- // });
- // }
- // }
- // } else {
- // if (to.name === 'login') {
- // next();
- // return;
- // }
- // next({
- // name: 'login',
- // query: {
- // redirect: to.name,
- // ...to.query,
- // } as LocationQueryRaw,
- // });
- // }
+ if (isLogin()) {
+ if (userStore.role) {
+ next();
+ } else {
+ try {
+ await userStore.info();
+ next();
+ } catch (error) {
+ await userStore.logout();
+ next({
+ name: 'login',
+ query: {
+ redirect: to.name,
+ ...to.query,
+ } as LocationQueryRaw,
+ });
+ }
+ }
+ } else {
+ if (to.name === 'login') {
+ next();
+ return;
+ }
+ next({
+ name: 'login',
+ query: {
+ redirect: to.name,
+ ...to.query,
+ } as LocationQueryRaw,
+ });
+ }
});
}
diff --git a/src/store/modules/user/index.ts b/src/store/modules/user/index.ts
index 0849edf..0a3e0d3 100644
--- a/src/store/modules/user/index.ts
+++ b/src/store/modules/user/index.ts
@@ -10,6 +10,7 @@
import { UserState } from './types';
import useAppStore from '../app';
+
const useUserStore = defineStore('user', {
state: (): UserState => ({
name: undefined,
@@ -63,7 +64,7 @@
},
// Login
- async login(loginForm: LoginData) {
+ async login(loginForm: LoginData):string {
try {
const res = await userLogin(loginForm);
setToken(res.data.access_token);
@@ -75,6 +76,11 @@
this.resources=res.data.resources;
setUserInfo(JSON.stringify(userInfo));
setUserResources(JSON.stringify(this.resources))
+ for (const r of this.resources) {
+ if (r.menuType == 0) {
+ return r.component
+ }
+ }
} catch (err) {
clearToken();
throw err;
diff --git a/src/views/login/components/login-form.vue b/src/views/login/components/login-form.vue
index a1259f6..5519dfd 100644
--- a/src/views/login/components/login-form.vue
+++ b/src/views/login/components/login-form.vue
@@ -1,6 +1,6 @@
<template>
<div class="login-form-wrapper">
- <div class="login-form-title">{{ $t('login.form.title') }}</div>
+ <div class="login-form-title">{{ $t("login.form.title") }}</div>
<!-- <div class="login-form-sub-title">{{ $t('login.form.title') }}</div>-->
<div class="login-form-error-msg">{{ errorMessage }}</div>
<a-form
@@ -45,12 +45,12 @@
:model-value="loginConfig.rememberPassword"
@change="setRememberPassword as any"
>
- {{ $t('login.form.rememberPassword') }}
+ {{ $t("login.form.rememberPassword") }}
</a-checkbox>
- <a-link>{{ $t('login.form.forgetPassword') }}</a-link>
+ <a-link>{{ $t("login.form.forgetPassword") }}</a-link>
</div>
<a-button type="primary" html-type="submit" long :loading="loading">
- {{ $t('login.form.login') }}
+ {{ $t("login.form.login") }}
</a-button>
<!-- <a-button type="text" long class="login-form-register-btn">
{{ $t('login.form.register') }}
@@ -61,108 +61,116 @@
</template>
<script lang="ts" setup>
- import { ref, reactive } from 'vue';
- import { useRouter } from 'vue-router';
- import { Message } from '@arco-design/web-vue';
- import { ValidatedError } from '@arco-design/web-vue/es/form/interface';
- import { useI18n } from 'vue-i18n';
- import { useStorage } from '@vueuse/core';
- import { useUserStore } from '@/store';
- import useLoading from '@/hooks/loading';
- import type { LoginData } from '@/api/user';
- import { rsaPsw } from '@/utils/ras';
+import { reactive, ref } from "vue";
+import { useRouter } from "vue-router";
+import { Message } from "@arco-design/web-vue";
+import { ValidatedError } from "@arco-design/web-vue/es/form/interface";
+import { useI18n } from "vue-i18n";
+import { useStorage } from "@vueuse/core";
+import { useUserStore } from "@/store";
+import useLoading from "@/hooks/loading";
+import type { LoginData } from "@/api/user";
+import { rsaPsw } from "@/utils/ras";
- const router = useRouter();
- const { t } = useI18n();
- const errorMessage = ref('');
- const { loading, setLoading } = useLoading();
- const userStore = useUserStore();
+const router = useRouter();
+const { t } = useI18n();
+const errorMessage = ref("");
+const { loading, setLoading } = useLoading();
+const userStore = useUserStore();
- const loginConfig = useStorage('login-config', {
- rememberPassword: true,
- email: '', // 婕旂ず榛樿鍊�
- password: '', // demo default value
- });
- const userInfo = reactive({
- email: '', // 婕旂ず榛樿鍊�
- password: '', // demo default value
- });
+const loginConfig = useStorage("login-config", {
+ rememberPassword: true,
+ email: "", // 婕旂ず榛樿鍊�
+ password: "" // demo default value
+});
+const userInfo = reactive({
+ email: "", // 婕旂ず榛樿鍊�
+ password: "" // demo default value
+});
- const handleSubmit = async ({
- errors,
- values,
- }: {
- errors: Record<string, ValidatedError> | undefined;
- values: Record<string, any>;
- }) => {
- if (loading.value) return;
- if (!errors) {
- setLoading(true);
- try {
- const rsaPassWord = rsaPsw(values.password) as string;
- console.log(values, '鐧诲綍淇℃伅');
- await userStore.login({
- email: values.email,
- password: rsaPassWord,
- } as LoginData);
- const { redirect, ...othersQuery } = router.currentRoute.value.query;
- router.push({
- name: 'knowledgeLib',
- query: {
- ...othersQuery,
- },
- });
- Message.success(t('鐧诲綍鎴愬姛'));
- const { rememberPassword } = loginConfig.value;
- const { email, password } = values;
- // 瀹為檯鐢熶骇鐜闇�瑕佽繘琛屽姞瀵嗗瓨鍌ㄣ��
- // The actual production environment requires encrypted storage.
- loginConfig.value.email = rememberPassword ? email : '';
- loginConfig.value.password = rememberPassword ? password : '';
- } catch (err) {
- errorMessage.value = (err as Error).message;
- } finally {
- setLoading(false);
- }
+const handleSubmit = async ({
+ errors,
+ values
+ }: {
+ errors: Record<string, ValidatedError> | undefined;
+ values: Record<string, any>;
+}) => {
+ if (loading.value) return;
+ if (!errors) {
+ setLoading(true);
+ try {
+ const rsaPassWord = rsaPsw(values.password) as string;
+ console.log(values, "鐧诲綍淇℃伅");
+ let goto = await userStore.login({
+ email: values.email,
+ password: rsaPassWord
+ } as LoginData);
+ const { redirect, ...othersQuery } = router.currentRoute.value.query;
+ router.push({
+ name: goto,
+ query: {
+ ...othersQuery
+ }
+ });
+ Message.success(t("鐧诲綍鎴愬姛"));
+ const { rememberPassword } = loginConfig.value;
+ const { email, password } = values;
+ // 瀹為檯鐢熶骇鐜闇�瑕佽繘琛屽姞瀵嗗瓨鍌ㄣ��
+ // The actual production environment requires encrypted storage.
+ loginConfig.value.email = rememberPassword ? email : "";
+ loginConfig.value.password = rememberPassword ? password : "";
+ } catch (err) {
+ errorMessage.value = (err as Error).message;
+ } finally {
+ setLoading(false);
}
- };
- const setRememberPassword = (value: boolean) => {
- loginConfig.value.rememberPassword = value;
- };
+ }
+};
+const setRememberPassword = (value: boolean) => {
+ loginConfig.value.rememberPassword = value;
+};
</script>
<style lang="less" scoped>
- .login-form {
- &-wrapper {
- width: 320px;
- }
+.login-form {
- &-title {
- color: var(--color-text-1);
- font-weight: 500;
- font-size: 24px;
- line-height: 32px;
- }
+&
+-wrapper {
+ width: 320px;
+}
- &-sub-title {
- color: var(--color-text-3);
- font-size: 16px;
- line-height: 24px;
- }
+&
+-title {
+ color: var(--color-text-1);
+ font-weight: 500;
+ font-size: 24px;
+ line-height: 32px;
+}
- &-error-msg {
- height: 32px;
- color: rgb(var(--red-6));
- line-height: 32px;
- }
+&
+-sub-title {
+ color: var(--color-text-3);
+ font-size: 16px;
+ line-height: 24px;
+}
- &-password-actions {
- display: flex;
- justify-content: space-between;
- }
+&
+-error-msg {
+ height: 32px;
+ color: rgb(var(--red-6));
+ line-height: 32px;
+}
- &-register-btn {
- color: var(--color-text-3) !important;
- }
- }
+&
+-password-actions {
+ display: flex;
+ justify-content: space-between;
+}
+
+&
+-register-btn {
+ color: var(--color-text-3) !important;
+}
+
+}
</style>
--
Gitblit v1.8.0