refactor(TabBar): 格式化模板代码并调整注释结构

将模板中的长属性拆分为多行以提升可读性
调整 handleTabClick 函数内的注释格式，使其更清晰

 <!--
 <!--
  * @Date: 2026-01-29 20:33:23
  * @Date: 2026-01-29 20:33:23
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2026-01-30 20:13:36
+ * @LastEditTime: 2026-01-30 21:03:18
  * @FilePath: /manulife-weapp/src/components/TabBar.vue
  * @FilePath: /manulife-weapp/src/components/TabBar.vue
  * @Description: 通用底部导航栏组件，用于页面底部固定导航栏，展示页面标题。
  * @Description: 通用底部导航栏组件，用于页面底部固定导航栏，展示页面标题。
 -->
 -->
 <template>
 <template>
-  <view class="fixed bottom-0 left-0 w-full bg-white shadow-[0_-4rpx_16rpx_rgba(0,0,0,0.05)] pb-[env(safe-area-inset-bottom)] z-50">
+  <view
+    class="fixed bottom-0 left-0 w-full bg-white shadow-[0_-4rpx_16rpx_rgba(0,0,0,0.05)] pb-[env(safe-area-inset-bottom)] z-50">
     <view class="flex items-center justify-around py-[32rpx]">
     <view class="flex items-center justify-around py-[32rpx]">
-      <view
-        class="flex-1 flex flex-col items-center justify-center"
-        v-for="(item, index) in tabs"
-        :key="index"
-        @tap="handleTabClick(item)"
-      >
-        <IconFont
-          :name="item.icon"
-          :class="[current === item.key ? 'text-blue-600' : 'text-gray-400']"
-          size="24"
-        />
-        <text
-          class="text-[20rpx] mt-[8rpx]"
-          :class="[current === item.key ? 'text-blue-600' : 'text-gray-400']"
-        >{{ item.label }}</text>
+      <view class="flex-1 flex flex-col items-center justify-center" v-for="(item, index) in tabs" :key="index"
+        @tap="handleTabClick(item)">
+        <IconFont :name="item.icon" :class="[current === item.key ? 'text-blue-600' : 'text-gray-400']" size="24" />
+        <text class="text-[20rpx] mt-[8rpx]" :class="[current === item.key ? 'text-blue-600' : 'text-gray-400']">{{
+          item.label }}</text>
       </view>
       </view>
     </view>
     </view>
   </view>
   </view>
@@ -70,50 +61,50 @@ const handleTabClick = (item) => {
   if (item.key === 'home') {
   if (item.key === 'home') {
     go(item.path)
     go(item.path)
   } else if (item.key === 'me') {
   } else if (item.key === 'me') {
-     // Check if 'me' page exists, otherwise show toast or just go
-     // For now, assuming me page might not exist or we just navigate
-     // go(item.path)
-     // Based on existing logic in index.vue:
-     // Taro.redirectTo({ url: '/pages/me/index' });
-     // But wait, standard tab bar usually uses switchTab or redirectTo.
-     // Since this is a custom tab bar, we use useGo (which uses navigateTo usually).
-     // Ideally for tab switching we might want reLaunch or redirectTo to avoid stack buildup.
-     // However, useGo defaults to navigateTo.
-     // Let's use reLaunch to simulate tab switching behavior if it's a "tab bar"
+    // Check if 'me' page exists, otherwise show toast or just go
+    // For now, assuming me page might not exist or we just navigate
+    // go(item.path)
+    // Based on existing logic in index.vue:
+    // Taro.redirectTo({ url: '/pages/me/index' });
+    // But wait, standard tab bar usually uses switchTab or redirectTo.
+    // Since this is a custom tab bar, we use useGo (which uses navigateTo usually).
+    // Ideally for tab switching we might want reLaunch or redirectTo to avoid stack buildup.
+    // However, useGo defaults to navigateTo.
+    // Let's use reLaunch to simulate tab switching behavior if it's a "tab bar"
 
 
-     // Actually, let's look at index.vue logic:
-     // if (item.key === 'me') Taro.redirectTo({ url: '/pages/me/index' });
-     // if (item.key === 'ai') Taro.showToast({ title: '功能开发中', icon: 'none' });
+    // Actually, let's look at index.vue logic:
+    // if (item.key === 'me') Taro.redirectTo({ url: '/pages/me/index' });
+    // if (item.key === 'ai') Taro.showToast({ title: '功能开发中', icon: 'none' });
 
 
-     // I will replicate this logic for now but make it more generic if possible.
-     // Since 'me' and 'ai' might not be fully implemented, I will stick to what I know.
-     // But 'onboarding' and 'signing' pages use this tab bar too.
+    // I will replicate this logic for now but make it more generic if possible.
+    // Since 'me' and 'ai' might not be fully implemented, I will stick to what I know.
+    // But 'onboarding' and 'signing' pages use this tab bar too.
 
 
-     // If we are on 'onboarding' (which is seemingly a sub-page but has a tab bar),
-     // clicking 'Home' should probably go back to Home.
+    // If we are on 'onboarding' (which is seemingly a sub-page but has a tab bar),
+    // clicking 'Home' should probably go back to Home.
 
 
-     Taro.reLaunch({ url: item.path })
+    Taro.reLaunch({ url: item.path })
   } else if (item.key === 'ai') {
   } else if (item.key === 'ai') {
-     // 跳转到腾讯元宝AI小程序
-     Taro.navigateToMiniProgram({
-       appId: 'wxXXXXXXXXXXXXXXXX', // TODO: 替换为实际的腾讯元宝小程序 AppID
-       path: 'pages/index/index', // TODO: 元宝小程序的路径（根据实际情况填写）
-       extraData: {
-         // TODO: 如果需要传递参数，在这里配置
-         // from: 'manulife-weapp'
-       },
-       envVersion: 'release', // 打开正式版
-       success: (res) => {
-         console.log('跳转元宝小程序成功', res)
-       },
-       fail: (err) => {
-         console.error('跳转元宝小程序失败', err)
-         Taro.showToast({
-           title: '跳转失败，请稍后重试',
-           icon: 'none'
-         })
-       }
-     })
+    // 跳转到腾讯元宝AI小程序
+    Taro.navigateToMiniProgram({
+      appId: 'wxXXXXXXXXXXXXXXXX', // TODO: 替换为实际的腾讯元宝小程序 AppID
+      path: 'pages/index/index', // TODO: 元宝小程序的路径（根据实际情况填写）
+      extraData: {
+        // TODO: 如果需要传递参数，在这里配置
+        // from: 'manulife-weapp'
+      },
+      envVersion: 'release', // 打开正式版
+      success: (res) => {
+        console.log('跳转元宝小程序成功', res)
+      },
+      fail: (err) => {
+        console.error('跳转元宝小程序失败', err)
+        Taro.showToast({
+          title: '跳转失败，请稍后重试',
+          icon: 'none'
+        })
+      }
+    })
   }
   }
 }
 }
 </script>
 </script>