From 55691fa3df44451bf071420f2ef6507c885e5f27 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=86=E5=85=89LG?= <lg@tydi.fun>
Date: Wed, 13 Aug 2025 08:59:25 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96=E4=BB=93=E5=BA=93?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/TagsView/src/TagsView.vue      |  2 +
 src/layout/components/useRenderLayout.tsx     | 15 +++--
 src/views/Login/Login.vue                     | 57 +++++++++++++++----
 3 files changed, 57 insertions(+), 17 deletions(-)

diff --git a/src/layout/components/TagsView/src/TagsView.vue b/src/layout/components/TagsView/src/TagsView.vue
index 6b6510b..0d326b2 100644
--- a/src/layout/components/TagsView/src/TagsView.vue
+++ b/src/layout/components/TagsView/src/TagsView.vue
@@ -274,10 +274,12 @@ watch(
     :id="prefixCls"
     :class="prefixCls"
     class="relative w-full h-[var(--tags-view-height)] flex bg-[#fff] dark:bg-[var(--el-bg-color)]"
+    data-tauri-drag-region
   >
     <span
       :class="tagsViewImmerse ? '' : `${prefixCls}__tool ${prefixCls}__tool--first`"
       class="h-[var(--tags-view-height)] w-[var(--tags-view-height)] flex cursor-pointer items-center justify-center"
+      style="pointer-events: auto"
       @click="move(-200)"
     >
       <Icon
diff --git a/src/layout/components/useRenderLayout.tsx b/src/layout/components/useRenderLayout.tsx
index 9909ccb..f10ef9a 100644
--- a/src/layout/components/useRenderLayout.tsx
+++ b/src/layout/components/useRenderLayout.tsx
@@ -58,26 +58,29 @@ export const useRenderLayout = () => {
                 }
               ]}
             >
-              <div class="flex items-center bg-[var(--top-header-bg-color)] h-[var(--top-tool-height)] px-4">
+              <div class="flex items-center bg-[var(--top-header-bg-color)] h-[var(--top-tool-height)] px-4" data-tauri-drag-region>
                 {/* Logo区域 */}
-                <div class="flex items-center mr-auto">
+                <div class="flex items-center mr-auto" data-tauri-drag-region>
                   <img src="/logo.png" alt="Logo" class="h-8 w-8 mr-3" />
                   <span class="text-lg font-semibold text-[var(--top-header-text-color)]">
                     教师端管理系统
                   </span>
                 </div>
                 
-                {/* 工具栏 */}
-                <ToolHeader class="flex-shrink-0"></ToolHeader>
+                {/* 工具栏 - 移除data-tauri-drag-region以允许按钮点击 */}
+                <ToolHeader class="flex-shrink-0" style="pointer-events: auto;"></ToolHeader>
               </div>
 
               {tagsView.value ? (
-                <TagsView class="layout-border__top layout-border__bottom"></TagsView>
+                <div data-tauri-drag-region>
+                  <TagsView class="layout-border__top layout-border__bottom"></TagsView>
+                </div>
               ) : !isDashboardPage.value ? (
-                <div class="flex items-center h-[var(--tags-view-height)] bg-[var(--top-header-bg-color)] layout-border__top layout-border__bottom px-4">
+                <div class="flex items-center h-[var(--tags-view-height)] bg-[var(--top-header-bg-color)] layout-border__top layout-border__bottom px-4" data-tauri-drag-region>
                   <ElButton 
                     type="primary" 
                     onClick={goToDashboard}
+                    style="pointer-events: auto;"
                   >
                     <Icon icon="ep:home-filled" class="mr-1" />
                     返回主页
diff --git a/src/views/Login/Login.vue b/src/views/Login/Login.vue
index ab7958a..cd3e021 100644
--- a/src/views/Login/Login.vue
+++ b/src/views/Login/Login.vue
@@ -3,6 +3,22 @@
     :class="prefixCls"
     class="relative h-[100%] lt-md:px-10px lt-sm:px-10px lt-xl:px-10px lt-xl:px-10px"
   >
+    <!-- 顶部拖拽区域和关闭按钮 -->
+    <div
+      class="fixed top-0 left-0 right-0 z-50 flex justify-between items-center h-12 px-4"
+      data-tauri-drag-region
+    >
+      <div class="flex-1" data-tauri-drag-region></div>
+      <div class="flex items-center space-x-2 pointer-events-auto">
+        <div
+          class="w-8 h-8 flex items-center justify-center rounded-full hover:bg-red-500 hover:bg-opacity-20 cursor-pointer transition-colors"
+          @click="handleClose"
+          style="pointer-events: auto"
+        >
+          <el-icon class="text-white hover:text-red-500"><CloseBold /></el-icon>
+        </div>
+      </div>
+    </div>
     <div class="relative mx-auto h-full flex">
       <div
         :class="`${prefixCls}__left flex-1 bg-gray-500 bg-opacity-20 relative p-30px lt-xl:hidden overflow-x-hidden overflow-y-auto`"
@@ -33,11 +49,11 @@
         <!-- 右上角的主题、语言选择 -->
         <div
           class="flex items-center justify-between at-2xl:justify-end at-xl:justify-end"
-          style="color: var(--el-text-color-primary);"
+          style="color: var(--el-text-color-primary)"
         >
           <div class="flex items-center at-2xl:hidden at-xl:hidden">
             <img alt="" class="mr-10px h-48px w-48px" src="@/assets/imgs/transparent_logo2.png" />
-            <span class="text-20px font-bold" >{{ underlineToHump(appStore.getTitle) }}</span>
+            <span class="text-20px font-bold">{{ underlineToHump(appStore.getTitle) }}</span>
           </div>
           <div class="flex items-center justify-end space-x-10px h-48px">
             <ThemeSwitch />
@@ -52,15 +68,15 @@
             <!-- 账号登录 -->
             <LoginForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />
             <!-- 手机登录 -->
-<!--            <MobileForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
+            <!--            <MobileForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
             <!-- 二维码登录 -->
-<!--            <QrCodeForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
+            <!--            <QrCodeForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
             <!-- 注册 -->
-<!--            <RegisterForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
+            <!--            <RegisterForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
             <!-- 三方登录 -->
-<!--            <SSOLoginVue class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
+            <!--            <SSOLoginVue class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
             <!-- 忘记密码 -->
-<!--            <ForgetPasswordForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
+            <!--            <ForgetPasswordForm class="m-auto h-auto p-20px lt-xl:(rounded-3xl light:bg-white)" />-->
           </div>
         </Transition>
       </div>
@@ -70,13 +86,14 @@
 
 <script lang="ts" setup>
 import { underlineToHump } from '@/utils'
-
 import { useDesign } from '@/hooks/web/useDesign'
 import { useAppStore } from '@/store/modules/app'
 import { ThemeSwitch } from '@/layout/components/ThemeSwitch'
 import { LocaleDropdown } from '@/layout/components/LocaleDropdown'
-
-import { LoginForm, MobileForm, QrCodeForm, RegisterForm, SSOLoginVue, ForgetPasswordForm } from './components'
+import { LoginForm } from './components'
+import { CloseBold } from '@element-plus/icons-vue'
+import { WebviewWindow } from '@tauri-apps/api/webviewWindow'
+import { ElMessageBox } from 'element-plus'
 
 defineOptions({ name: 'Login' })
 
@@ -84,6 +101,24 @@ const { t } = useI18n()
 const appStore = useAppStore()
 const { getPrefixCls } = useDesign()
 const prefixCls = getPrefixCls('login')
+
+// 关闭应用
+const handleClose = () => {
+  ElMessageBox.confirm('确定要退出应用吗?', '提示', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    cancelButtonClass: 'el-button--danger',
+    confirmButtonClass: 'el-button--success',
+    closeOnClickModal: false
+  })
+    .then(async () => {
+      const thisWindow = await WebviewWindow.getCurrent()
+      thisWindow.close()
+    })
+    .catch(() => {
+      // 用户取消操作
+    })
+}
 </script>
 
 <style lang="scss" scoped>
@@ -119,4 +154,4 @@ $prefix-cls: #{$namespace}-login;
     background-color: var(--login-bg-color);
   }
 }
-</style>
\ No newline at end of file
+</style>