fix: 修复点击菜单无法渲染组件的问题

src/layout/components/AppMain.vue

@@ -8,9 +8,11 @@ const key = computed(() => route.path)
 
 <template>
   <section class="app-main">
+    <router-view v-slot="{ Component }" :key="key">
       <transition name="fade-transform" mode="out-in">
-      <router-view :key="key" />
+        <component :is="Component" />
       </transition>
+    </router-view>
   </section>
 </template>
 

src/views/os-dataDisplay/index.vue

 <template>
-    <div >
-        <div class="backStyle" v-if="route.query.jump === 'yes'" @click="goToStatus">
-        </div>
-        <div class="text-left p-4 ">
+  <div>
+    <div class="text-left p-4">
         <div class="custom-style">
-                <el-segmented v-model="mode" :options="sizeOptions" style="margin-bottom: 1rem" size="default" />
+            <el-segmented v-model="mode" :options="sizeOptions" style="margin-bottom: 1rem" size="large" />
         </div>
     </div>
     <!-- 综合数据页面组件 -->
@@ -23,7 +21,6 @@
 
 
 
-
 </template>
 
 <script setup lang="ts">

src/views/os-log/index.vue

 <template>
+  <div>
     <div class="backStyle" @click="bactToRecord()">
     </div>
     <div class="m-t-4">
@@ -7,6 +8,7 @@
     <div>
         <el-input v-model="textarea" style="width: 93%" :rows="33" type="textarea" placeholder=" " />
     </div>
+  </div>
 </template>
 
 <script setup lang="ts">

src/views/os-spiderManager/index.vue

 <template>
+  <div>
     <div class="mt-20">
     </div>
     <div>
@@ -20,6 +21,7 @@
         <Pagination :total="pageObj.total" v-model:page="pageObj.pageNo" v-model:limit="pageObj.pageSize"
             @pagination="getData" />
     </div>
+  </div>
 </template>
 
 <script setup lang="ts">

src/views/os-status/index.vue

 <template>
   <div>
-    <div class="text-left timeStyle">
-  </div>
+    <div>
+      <div class="text-left timeStyle" />
       <div class="border-100">
-    <statusMonitor></statusMonitor>
+        <statusMonitor />
+      </div>
     </div>
   </div>
   

src/views/os-system/index.vue

 <template>
+  <div>
     <div class="text-left p-8">
         <el-form inline>
             <el-form-item>
@@ -38,6 +39,7 @@
     <!-- 创建用户弹窗组件 -->
     <addUserDialog v-model:dialogVisible="dialogVisible" :mode="mode" :user-count="userCount" :user-name="userName"
         :user-remark="userRemark" :user-password="userPassword " @confirm="handleConfirm" />
+  </div>
 </template>
 
 <script setup lang="ts">

src/views/os-taskInformation/index.vue

 <template>
+  <div>
     <div class="m-t-7">
     </div>
     <div class="text-left p-6 toolbarStyle">
@@ -43,6 +44,7 @@
     </div>
     <!-- 添加任务对话框组件 -->
     <addTaskDialog v-model:dialogVisible="showDialog" @confirm="handleDeleteConfirm" :mode="editMode" />
+  </div>
 
 </template>
 

src/views/os-taskRecord/index.vue

 <template>
-    <div class="backStyle" v-if="route.query.jump === 'yes'" @click="goToStatus">
-    </div>
-    <div class="m-t-7">
-    </div>
+  <div>
+    <div class="m-t-7" />
     <div class="text-left p-6 toolbarStyle">
         <div class="formStyle">
             <el-form inline>
@@ -73,6 +71,7 @@
         <Pagination :total="pageObj.total" v-model:page="pageObj.pageNo" v-model:limit="pageObj.pageSize"
             @pagination="getData" />
     </div>
+  </div>