From 1b4639d5d8e6207f6eec174a2db69c8862f1439b Mon Sep 17 00:00:00 2001
From: chansee97 <chen.dev@foxmail.com>
Date: Fri, 1 Aug 2025 11:33:28 +0800
Subject: [PATCH] fix: full content error

---
 package.json                                  |  2 +-
 .../components/tab/ContentFullScreen.vue      | 41 +++++++++++++++++--
 src/store/app/index.ts                        |  4 +-
 3 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/package.json b/package.json
index 9059b09..b20e554 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "nova-admin",
   "type": "module",
-  "version": "0.9.15",
+  "version": "0.9.17",
   "private": true,
   "description": "a clean and concise back-end management template based on Vue3, Vite5, Typescript, and Naive UI.",
   "author": {
diff --git a/src/layouts/components/tab/ContentFullScreen.vue b/src/layouts/components/tab/ContentFullScreen.vue
index db4c8b4..8737b43 100644
--- a/src/layouts/components/tab/ContentFullScreen.vue
+++ b/src/layouts/components/tab/ContentFullScreen.vue
@@ -2,16 +2,49 @@
 import { useAppStore } from '@/store'
 
 const appStore = useAppStore()
+
+let previousLayoutMode = appStore.layoutMode
+
+function enterFullContent() {
+  previousLayoutMode = appStore.layoutMode
+  appStore.layoutMode = 'full-content'
+}
+
+function exitFullContent() {
+  // 如果是全屏或者数据不存在，则恢复为默认的vertical
+  if (previousLayoutMode === 'full-content' || !previousLayoutMode) {
+    previousLayoutMode = 'vertical'
+  }
+  appStore.layoutMode = previousLayoutMode
+}
 </script>
 
 <template>
   <n-tooltip placement="bottom" trigger="hover">
     <template #trigger>
-      <CommonWrapper @click="appStore.contentFullScreen = !appStore.contentFullScreen">
-        <icon-park-outline-off-screen-one v-if="appStore.contentFullScreen" />
-        <icon-park-outline-full-screen-one v-else />
+      <CommonWrapper @click="enterFullContent">
+        <icon-park-outline-full-screen-one />
       </CommonWrapper>
     </template>
-    <span>{{ $t('app.togglContentFullScreen') }}</span>
+    {{ $t('app.togglContentFullScreen') }}
   </n-tooltip>
+
+  <Teleport to="body">
+    <div
+      v-if="appStore.layoutMode === 'full-content'"
+      class="fixed top-4 right-0 z-[9999]"
+    >
+      <n-tooltip placement="left" trigger="hover">
+        <template #trigger>
+          <n-el
+            class="bg-[var(--primary-color)] c-[var(--base-color)] rounded-l-lg shadow-lg p-2 cursor-pointer"
+            @click="exitFullContent"
+          >
+            <icon-park-outline-off-screen-one />
+          </n-el>
+        </template>
+        {{ $t('app.togglContentFullScreen') }}
+      </n-tooltip>
+    </div>
+  </Teleport>
 </template>
diff --git a/src/store/app/index.ts b/src/store/app/index.ts
index 5733a44..87e5e7c 100644
--- a/src/store/app/index.ts
+++ b/src/store/app/index.ts
@@ -38,7 +38,6 @@ export const useAppStore = defineStore('app-store', {
       showSetting: false,
       transitionAnimation: 'fade-slide' as TransitionAnimation,
       layoutMode: 'vertical' as ProLayoutMode,
-      contentFullScreen: false,
     }
   },
   getters: {
@@ -68,8 +67,7 @@ export const useAppStore = defineStore('app-store', {
       this.showBreadcrumbIcon = true
       this.showWatermark = false
       this.transitionAnimation = 'fade-slide'
-      this.layoutMode = 'leftMenu'
-      this.contentFullScreen = false
+      this.layoutMode = 'vertical'
 
       // 重置所有配色
       this.setPrimaryColor(this.primaryColor)