diff --git a/web/src/components/page/AppPage.vue b/web/src/components/page/AppPage.vue
index f570ba94..06eab8d2 100644
--- a/web/src/components/page/AppPage.vue
+++ b/web/src/components/page/AppPage.vue
@@ -12,7 +12,7 @@ withDefaults(defineProps<Props>(), {
   <transition appear mode="out-in" name="fade-slide">
     <section class="cus-scroll-y wh-full flex-col bg-[#f5f6fb] p-15" dark:bg-hex-121212>
       <slot />
-      <AppFooter v-if="showFooter" mt-15 />
+      <app-footer v-if="showFooter" mt-15 />
     </section>
   </transition>
 </template>
diff --git a/web/src/components/page/CommonPage.vue b/web/src/components/page/CommonPage.vue
index baa8e3f0..48e87140 100644
--- a/web/src/components/page/CommonPage.vue
+++ b/web/src/components/page/CommonPage.vue
@@ -19,7 +19,7 @@ const route = useRoute()
 </script>
 
 <template>
-  <AppPage :show-footer="showFooter">
+  <app-page :show-footer="showFooter">
     <header v-if="showHeader" mb-15 min-h-45 flex items-center justify-between px-15>
       <slot v-if="$slots.header" name="header" />
       <template v-else>
@@ -36,5 +36,5 @@ const route = useRoute()
     <n-card flex-1>
       <slot />
     </n-card>
-  </AppPage>
+  </app-page>
 </template>
diff --git a/web/src/layout/header/IndexView.vue b/web/src/layout/header/IndexView.vue
index 9bf7cdfd..abf29699 100644
--- a/web/src/layout/header/IndexView.vue
+++ b/web/src/layout/header/IndexView.vue
@@ -14,17 +14,17 @@ const themeStore = useThemeStore()
 
 <template>
   <div w-full flex items-center justify-between>
-    <MenuCollapse v-if="themeStore.isMobile" />
+    <menu-collapse v-if="themeStore.isMobile" />
     <section v-if="!themeStore.isMobile && themeStore.tab.visible" w-0 flex-1 pr-12>
-      <AppTab />
+      <app-tab />
     </section>
     <span v-if="!themeStore.isMobile && themeStore.tab.visible" mx-6 opacity-20>|</span>
     <div ml-auto flex flex-shrink-0 items-center px-12>
-      <ReloadPage />
-      <FullScreen />
-      <ThemeMode />
-      <ThemeSetting />
-      <UserAvatar />
+      <reload-page />
+      <full-screen />
+      <theme-mode />
+      <theme-setting />
+      <user-avatar />
     </div>
   </div>
 </template>