From bba1b16e1aeb6bd7c1280ef2248e68d38b54d4aa Mon Sep 17 00:00:00 2001
From: "chen.home" <1147347984@qq.com>
Date: Fri, 13 Jan 2023 23:41:29 +0800
Subject: [PATCH] =?UTF-8?q?feat(login):=20=E5=A2=9E=E5=8A=A0=E8=AE=B0?=
 =?UTF-8?q?=E4=BD=8F=E8=B4=A6=E5=8F=B7=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/auth.ts         | 20 ++++++++++----------
 src/utils/storage.ts      |  4 ++--
 src/views/login/index.vue | 38 ++++++++++++++++++++++++++++++--------
 3 files changed, 42 insertions(+), 20 deletions(-)

diff --git a/src/utils/auth.ts b/src/utils/auth.ts
index 3b2bb30..35e1b64 100644
--- a/src/utils/auth.ts
+++ b/src/utils/auth.ts
@@ -1,44 +1,44 @@
-import { loacl } from './storage';
+import { local } from './storage';
 import { EnumStorageKey } from '@/enum';
 
 const DURATION = 6 * 60 * 60;
 
 /* 获取当前token */
 export function getToken() {
-	return loacl.get(EnumStorageKey.token);
+	return local.get(EnumStorageKey.token);
 }
 /* 设置token */
 export function setToken(data: string) {
-	loacl.set(EnumStorageKey.token, data, DURATION);
+	local.set(EnumStorageKey.token, data, DURATION);
 }
 /* 移除token */
 export function removeToken() {
-	loacl.remove(EnumStorageKey.token);
+	local.remove(EnumStorageKey.token);
 }
 /* 获取当前refreshToken */
 export function getRefreshToken() {
-	return loacl.get(EnumStorageKey.refreshToken);
+	return local.get(EnumStorageKey.refreshToken);
 }
 /* 设置refreshToken */
 export function setRefreshToken(data: string) {
-	loacl.set(EnumStorageKey.refreshToken, data, DURATION);
+	local.set(EnumStorageKey.refreshToken, data, DURATION);
 }
 /* 移除refreshToken */
 export function removeRefreshToken() {
-	loacl.remove(EnumStorageKey.refreshToken);
+	local.remove(EnumStorageKey.refreshToken);
 }
 
 /* 获取用户详情 */
 export function getUserInfo() {
-	return loacl.get(EnumStorageKey.userInfo);
+	return local.get(EnumStorageKey.userInfo);
 }
 /* 设置用户详情 */
 export function setUserInfo(data: any) {
-	loacl.set(EnumStorageKey.userInfo, data);
+	local.set(EnumStorageKey.userInfo, data);
 }
 /* 移除用户详情 */
 export function removeUserInfo() {
-	loacl.remove(EnumStorageKey.userInfo);
+	local.remove(EnumStorageKey.userInfo);
 }
 
 /** 去除用户相关缓存 */
diff --git a/src/utils/storage.ts b/src/utils/storage.ts
index 2be6cc1..4c62542 100644
--- a/src/utils/storage.ts
+++ b/src/utils/storage.ts
@@ -34,7 +34,7 @@ function createLocalStorage() {
 				return value;
 			}
 		}
-		loacl.remove(key);
+		local.remove(key);
 		return null;
 	}
 
@@ -81,5 +81,5 @@ function createSessionStorage() {
 	}
 }
 
-export const loacl = createLocalStorage();
+export const local = createLocalStorage();
 export const session = createSessionStorage();
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 53d9782..7dfd7d6 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -78,7 +78,9 @@
           :size="24"
         >
           <div class="flex-y-center justify-between">
-            <n-checkbox>记住我</n-checkbox>
+            <n-checkbox v-model:checked="isRemember">
+              记住我
+            </n-checkbox>
             <n-button :text="true">
               忘记密码？
             </n-button>
@@ -107,7 +109,8 @@
 <script setup lang="ts">
 import { FormInst } from 'naive-ui';
 import { useAuthStore } from '@/store';
-import { ref } from 'vue';
+import { ref, onMounted } from 'vue';
+import { local } from '@/utils';
 
 const authStore = useAuthStore();
 const swiperList = [
@@ -118,10 +121,12 @@ const swiperList = [
 ];
 
 const formValue = ref({
-	account: 'admin',
-	pwd: '123456',
-	code: '1234',
+	account: '',
+	pwd: '',
+	code: '',
 });
+
+const isRemember = ref(false);
 const rules = {
 	account: {
 		required: true,
@@ -142,14 +147,31 @@ const rules = {
 };
 const formRef = ref<FormInst | null>(null);
 
-const handleLogin = () => {
+function handleLogin() {
 	formRef.value?.validate((errors) => {
-		if (errors) return console.error(errors);
+		if (errors) return;
 
 		const { account, pwd } = formValue.value;
+
+		if (isRemember.value) {
+			local.set('login_account', { account, pwd });
+		}
+
 		authStore.login(account, pwd);
 	});
-};
+}
+
+function checkUserAccount() {
+	const loginAccount = local.get('login_account');
+	if (!loginAccount) return;
+
+	formValue.value = loginAccount;
+	isRemember.value = true;
+}
+
+onMounted(() => {
+	checkUserAccount();
+});
 </script>
 
 <style scoped></style>