😎完善手机号登录

Web/package.json

@@ -2,7 +2,7 @@
 	"name": "admin.net.pro",
 	"type": "module",
 	"version": "2.4.33",
-	"lastBuildTime": "2024.12.17",
+	"lastBuildTime": "2024.12.19",
 	"description": "Admin.NET 站在巨人肩膀上的 .NET 通用权限开发框架",
 	"author": "zuohuaijun",
 	"license": "MIT",
@@ -74,7 +74,7 @@
 		"vue-router": "^4.5.0",
 		"vue-signature-pad": "^3.0.2",
 		"vue3-tree-org": "^4.2.2",
-		"vxe-pc-ui": "^4.3.36",
+		"vxe-pc-ui": "^4.3.37",
 		"vxe-table": "^4.8.10",
 		"vxe-table-plugin-element": "^4.0.4",
 		"vxe-table-plugin-export-xlsx": "^4.0.7",
@@ -96,7 +96,7 @@
 		"code-inspector-plugin": "^0.18.3",
 		"eslint": "^9.17.0",
 		"eslint-plugin-vue": "^9.32.0",
-		"globals": "^15.13.0",
+		"globals": "^15.14.0",
 		"less": "^4.2.1",
 		"prettier": "^3.4.2",
 		"rollup-plugin-visualizer": "^5.12.0",

Web/src/views/login/component/mobile.vue

@@ -32,15 +32,26 @@
 </template>
 
 <script setup lang="ts" name="loginMobile">
-import { reactive } from 'vue';
+import { reactive, computed } from 'vue';
 import { ElMessage } from 'element-plus';
 import { verifyPhone } from '/@/utils/toolsValidate';
-import { useRoute } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
+
+import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
+import { NextLoading } from '/@/utils/loading';
+import { formatAxis } from '/@/utils/formatTime';
+import { Local, Session } from '/@/utils/storage';
+import { useRoutesList } from '/@/stores/routesList';
+import { initBackEndControlRoutes } from '/@/router/backEnd';
+import { accessTokenKey, clearTokens, getAPI } from '/@/utils/axios-utils';
 
-import { getAPI } from '/@/utils/axios-utils';
 import { SysSmsApi, SysAuthApi } from '/@/api-services/api';
 
 const route = useRoute();
+const router = useRouter();
+const { t } = useI18n();
+
 const state = reactive({
 	ruleForm: {
 		phone: '',
@@ -90,9 +101,68 @@ const onSignIn = async () => {
 		return;
 	}
 
-	// // 系统登录
+	// 系统登录
-	// await accountRef.value?.saveTokenAndInitRoutes(res.data.result?.accessToken);
+	await saveTokenAndInitRoutes(res.data.result?.accessToken);
 };
+
+// 保持Token并初始化路由
+const saveTokenAndInitRoutes = async (accessToken: string | any) => {
+	// 缓存token
+	Local.set(accessTokenKey, accessToken);
+	// Local.set(refreshAccessTokenKey, refreshAccessToken);
+	Session.set('token', accessToken);
+
+	// 添加完动态路由再进行router跳转，否则可能报错 No match found for location with path "/"
+	const isNoPower = await initBackEndControlRoutes();
+	signInSuccess(isNoPower); // 再执行 signInSuccess
+};
+
+// 登录成功后的跳转
+const signInSuccess = (isNoPower: boolean | undefined) => {
+	if (isNoPower) {
+		ElMessage.warning('抱歉，您没有登录权限');
+		clearTokens(); // 清空Token缓存
+	} else {
+		// 初始化登录成功时间问候语
+		let currentTimeInfo = currentTime.value;
+		// 登录成功，跳到转首页 如果是复制粘贴的路径，非首页/登录页，那么登录成功后重定向到对应的路径中
+		if (route.query?.redirect) {
+			const stores = useRoutesList();
+			const { routesList } = storeToRefs(stores);
+			const recursion = (routeList: any[], url: string): boolean | undefined => {
+				if (routeList && routeList.length > 0) {
+					for (let i = 0; i < routeList.length; i++) {
+						if (routeList[i].path === url) return true;
+						if (routeList[i]?.children.length > 0) {
+							let result = recursion(routeList[i]?.children, url);
+							if (result) return true;
+						}
+					}
+				}
+			};
+			let exist = recursion(routesList.value, route.query?.redirect as string);
+			if (exist) {
+				router.push({
+					path: <string>route.query?.redirect,
+					query: Object.keys(<string>route.query?.params).length > 0 ? JSON.parse(<string>route.query?.params) : '',
+				});
+			} else router.push('/');
+		} else {
+			router.push('/');
+		}
+
+		// 登录成功提示
+		const signInText = t('message.signInText');
+		ElMessage.success(`${currentTimeInfo}，${signInText}`);
+		// 添加 loading，防止第一次进入界面时出现短暂空白
+		NextLoading.start();
+	}
+};
+
+// 获取时间
+const currentTime = computed(() => {
+	return formatAxis(new Date());
+});
 </script>
 
 <style scoped lang="scss">