Fix: 优化代码结构

src/config/navigation.ts

@@ -0,0 +1,33 @@
+export interface NavigationItem {
+  title: string
+  to: string
+  icon?: string
+  component?: string
+}
+
+export const navigationConfig: NavigationItem[] = [
+  {
+    title: 'paperTubeWeightCalculate',
+    to: '/calculators/paper-tube-weight',
+  },
+  {
+    title: 'beltSpecificationCalculate',
+    to: '/calculators/belt-specification',
+  },
+  {
+    title: 'paperRollWeightLengthCalculate',
+    to: '/calculators/paper-roll-weight-length',
+  },
+  {
+    title: 'paperTubeProductionCalculate',
+    to: '/calculators/paper-tube-production',
+  },
+  {
+    title: 'paperTapeWidthAngleCalculate',
+    to: '/calculators/paper-tape-width-angle',
+  },
+  {
+    title: 'multiLayerPaperTapeWidthAngleCalculate',
+    to: '/calculators/multi-layer-paper-tape-width-angle',
+  },
+]

src/layouts/CalculatorLayout.vue

@@ -133,9 +133,11 @@
         class="pa-6"
         fluid
       />
-      <v-fade-transition mode="hide-on-leave">
-        <router-view />
-      </v-fade-transition>
+      <router-view v-slot="{ Component }">
+        <v-fade-transition hide-on-leave>
+          <component :is="Component" />
+        </v-fade-transition>
+      </router-view>
     </v-main>
 
     <!-- 页脚 -->
@@ -156,6 +158,7 @@
 <script lang="ts" setup>
   import { computed, onMounted, onUnmounted, ref } from 'vue'
   import { useI18n } from 'vue-i18n'
+  import { navigationConfig } from '@/config/navigation'
 
   const { t, locale } = useI18n()
 
@@ -244,32 +247,12 @@
   })
 
   const menuItems = computed(() => {
-    return [
-      {
-        title: t('paperTubeWeightCalculate'),
-        to: '/calculators/paper-tube-weight',
-      },
-      {
-        title: t('beltSpecificationCalculate'),
-        to: '/calculators/belt-specification',
-      },
-      {
-        title: t('paperRollWeightLengthCalculate'),
-        to: '/calculators/paper-roll-weight-length',
-      },
-      {
-        title: t('paperTubeProductionCalculate'),
-        to: '/calculators/paper-tube-production',
-      },
-      {
-        title: t('paperTapeWidthAngleCalculate'),
-        to: '/calculators/paper-tape-width-angle',
-      },
-      {
-        title: t('multiLayerPaperTapeWidthAngleCalculate'),
-        to: '/calculators/multi-layer-paper-tape-width-angle',
-      },
-    ]
+    return navigationConfig.map((item, _) => {
+      return {
+        title: t(item.title),
+        to: item.to,
+      }
+    })
   })
 
   function toggleLanguage () {

src/layouts/default.vue

@@ -3,7 +3,6 @@
     <router-view />
   </v-main>
 
-  <AppFooter />
 </template>
 
 <script lang="ts" setup>