fix(projects): 修复页面滚动和页面100%视高占比

package.json

@@ -23,7 +23,7 @@
     "chroma-js": "^2.1.2",
     "dayjs": "^1.10.7",
     "form-data": "^4.0.0",
-    "naive-ui": "^2.19.0",
+    "naive-ui": "^2.19.1",
     "pinia": "^2.0.0-rc.4",
     "qs": "^6.10.1",
     "vue": "^3.2.10",
@@ -32,12 +32,12 @@
   "devDependencies": {
     "@commitlint/cli": "^13.1.0",
     "@commitlint/config-conventional": "^13.1.0",
-    "@iconify/json": "^1.1.404",
+    "@iconify/json": "^1.1.405",
     "@iconify/vue": "^3.0.0",
     "@types/chroma-js": "^2.1.3",
     "@types/qs": "^6.9.7",
-    "@typescript-eslint/eslint-plugin": "^4.31.1",
-    "@typescript-eslint/parser": "^4.31.1",
+    "@typescript-eslint/eslint-plugin": "^4.31.2",
+    "@typescript-eslint/parser": "^4.31.2",
     "@vicons/antd": "^0.11.0",
     "@vicons/carbon": "^0.11.0",
     "@vicons/fa": "^0.11.0",
@@ -46,8 +46,8 @@
     "@vicons/ionicons5": "^0.11.0",
     "@vicons/material": "^0.11.0",
     "@vicons/tabler": "^0.11.0",
-    "@vitejs/plugin-vue": "^1.8.1",
-    "@vue/compiler-sfc": "^3.2.12",
+    "@vitejs/plugin-vue": "^1.9.0",
+    "@vue/compiler-sfc": "^3.2.13",
     "@vue/eslint-config-prettier": "^6.0.0",
     "@vue/eslint-config-typescript": "^7.0.0",
     "commitizen": "^4.2.4",
@@ -65,13 +65,13 @@
     "patch-package": "^6.4.7",
     "postinstall-postinstall": "^2.1.0",
     "prettier": "^2.4.1",
-    "sass": "^1.41.1",
+    "sass": "^1.42.1",
     "typescript": "^4.4.3",
     "unplugin-icons": "^0.11.1",
-    "unplugin-vue-components": "^0.15.1",
+    "unplugin-vue-components": "^0.15.2",
     "vite": "^2.5.10",
     "vite-plugin-html": "^2.1.0",
-    "vite-plugin-windicss": "^1.4.3",
+    "vite-plugin-windicss": "^1.4.4",
     "vue-tsc": "^0.3.0",
     "vueuc": "^0.4.10",
     "windicss": "^3.1.7"

src/layouts/BasicLayout/components/GlobalContent/index.vue

@@ -1,22 +1,26 @@
 <template>
-  <n-layout-content class="flex-auto p-10px" :class="{ 'bg-[#f5f7f9]': !theme.darkMode }">
+  <div
+    class="flex-1 flex-col-stretch p-10px"
+    :class="{ 'bg-[#f5f7f9]': !theme.darkMode, 'overflow-hidden': routeProps.fullPage }"
+  >
     <router-view v-slot="{ Component, route }">
       <transition :name="theme.pageStyle.animateType" mode="out-in" appear>
         <keep-alive :include="cacheRoutes">
-          <component :is="Component" v-if="reload" :key="route.fullPath" />
+          <component :is="Component" v-if="reload" :key="route.fullPath" class="flex-1" />
         </keep-alive>
       </transition>
     </router-view>
-  </n-layout-content>
+  </div>
 </template>
 
 <script lang="ts" setup>
-import { NLayoutContent } from 'naive-ui';
 import { useThemeStore } from '@/store';
 import { useReloadInject } from '@/context';
 import { cacheRoutes } from '@/router';
+import { useRouteProps } from '@/hooks';
 
 const theme = useThemeStore();
 const { reload } = useReloadInject();
+const routeProps = useRouteProps();
 </script>
 <style scoped></style>

src/layouts/BlankLayout/index.vue

@@ -1,10 +1,15 @@
 <template>
   <n-scrollbar ref="scrollbar" class="h-full" :x-scrollable="true" :content-class="routeProps.fullPage ? 'h-full' : ''">
-    <div class="inline-block w-full" :class="[routeProps.fullPage ? 'h-full' : 'min-h-100vh']">
+    <div class="inline-block w-full h-full">
       <router-view v-slot="{ Component, route: itemRoute }">
         <transition :name="theme.pageStyle.animateType" mode="out-in" appear>
           <keep-alive :include="cacheRoutes">
-            <component :is="Component" v-if="reload" :key="itemRoute.fullPath" />
+            <component
+              :is="Component"
+              v-if="reload"
+              :key="itemRoute.fullPath"
+              :class="{ 'min-h-100vh': !routeProps.fullPage }"
+            />
           </keep-alive>
         </transition>
       </router-view>

src/views/dashboard/workbench/index.vue

@@ -1,6 +1,6 @@
 <template>
-  <div>
-    <n-spin class="flex-y-center flex-col h-500px bg-white" :show="loading">
+  <div class="bg-white">
+    <n-spin class="flex-y-center flex-col" :show="loading">
       <n-gradient-text type="primary" size="32">工作台</n-gradient-text>
       <n-space>
         <n-button>Default</n-button>