refactor: ♻️ 重构登录页面并添加新功能

重新设计了登录页面布局和样式,添加了注册和重置密码功能组件

src/components/CommonWrapper/index.vue

@@ -0,0 +1,21 @@
+<template>
+  <div cursor-pointer flex-center rounded class="el" :class="padding">
+    <slot></slot>
+  </div>
+</template>
+<script setup lang="ts">
+defineProps({
+  padding: {
+    type: String,
+    default: "p-2",
+  },
+});
+</script>
+<style scoped lang="scss">
+.el {
+  transition: 0.3s var(--el-transition-function-ease-in-out-bezier);
+  &:hover {
+    background-color: var(--el-fill-color);
+  }
+}
+</style>

src/components/DarkModeSwitch/index.vue

@@ -0,0 +1,39 @@
+<template>
+  <el-dropdown trigger="click" @command="handleDarkChange">
+    <el-icon :size="20">
+      <component :is="settingsStore.theme === ThemeMode.DARK ? Moon : Sunny" />
+    </el-icon>
+    <template #dropdown>
+      <el-dropdown-menu>
+        <el-dropdown-item
+          v-for="item in theneList"
+          :key="item.value"
+          :command="item.value"
+          :disabled="settingsStore.theme === item.value"
+        >
+          <el-icon>
+            <component :is="item.component" />
+          </el-icon>
+          {{ item.label }}
+        </el-dropdown-item>
+      </el-dropdown-menu>
+    </template>
+  </el-dropdown>
+</template>
+<script setup lang="ts">
+import { useSettingsStore } from "@/store";
+import { ThemeMode } from "@/enums";
+import { Moon, Sunny } from "@element-plus/icons-vue";
+
+const { t } = useI18n();
+const settingsStore = useSettingsStore();
+
+const theneList = [
+  { label: t("login.light"), value: ThemeMode.LIGHT, component: Sunny },
+  { label: t("login.dark"), value: ThemeMode.DARK, component: Moon },
+];
+
+const handleDarkChange = (theme: ThemeMode) => {
+  settingsStore.changeTheme(theme);
+};
+</script>

src/components/LangSelect/index.vue

@@ -1,6 +1,6 @@
 <template>
   <el-dropdown trigger="click" @command="handleLanguageChange">
-    <div class="i-svg:language" />
+    <div class="i-svg:language" :class="size" />
     <template #dropdown>
       <el-dropdown-menu>
         <el-dropdown-item