feat: 添加 Vlog 模块路由和相关图像路径，更新模块切换器交互

src/views/home/action.vue

@@ -3,6 +3,9 @@ import { getBackgroundImage, IMAGE_PATHS } from '@/utils'
 import { ImgButton } from '@/components/Button'
 import { ModuleSwitcher } from './components/ModuleSwitcher'
 import { computed, ref, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
 
 // 响应式状态
 const status = ref(false)
@@ -48,6 +51,13 @@ const handleModuleChange = (module: 'vlog' | 'film' | 'interview') => {
   }, 100)
 }
 
+const handleClick = () => {
+  router.push({
+    //首字母大写
+    name: selectedModule.value.charAt(0).toUpperCase() + selectedModule.value.slice(1)
+  })
+}
+
 // 计算属性
 const selectedImage = computed(() => {
   return getBackgroundImage(imageMap[selectedModule.value])
@@ -68,15 +78,16 @@ onMounted(() => {
     ></div>
 
     <!-- 选择模块 -->
-    <div :class="['absolute left-0 top-[-140px] inset-0 z-[8]']">
+    <div :class="['absolute left-0 top-[-140px] inset-0 z-[8] pointer-events-none']">
       <ModuleSwitcher v-model="selectedModule" @change="handleModuleChange" />
     </div>
 
     <!-- 电视机 -->
     <div
-      class="absolute w-[765px] h-[768px] right-0 top-0 z-[5] transition-opacity duration-200"
+      class="absolute w-[765px] h-[768px] right-0 top-0 z-[5] transition-opacity duration-200 cursor-pointer"
       :class="{ 'opacity-50': isImageLoading }"
       :style="{ backgroundImage: selectedImage }"
+      @click.stop="handleClick"
     ></div>
 
     <ImgButton