feat(组件): 添加指标说明工具提示功能

在个人仪表盘、团队报表和统计指标组件中添加工具提示功能，当用户悬停在指标信息图标上时显示详细说明
创建新的Tooltip组件用于显示指标说明
更新API基础路径配置

my-vue-app/src/views/maneger/components/TeamReport.vue

@@ -4,52 +4,62 @@
     <div class="report-grid">
       <div class="report-card">
         <div class="card-header">
-          <span class="card-title">团队总通话</span>
+          <span class="card-title">团队总通话 <i class="info-icon" @mouseenter="showTooltip('totalCalls', $event)" @mouseleave="hideTooltip">ⓘ</i></span>
           <span class="card-trend positive">{{ weekTotalData.week_total_call?.team_data?.current_rate_last_current || '0%' }} vs 上期</span>
         </div>
         <div class="card-value">{{ weekTotalData.week_total_call?.team_data?.total_current_week_call || 0 }} 次</div>
       </div>
       <div class="report-card">
         <div class="card-header">
-          <span class="card-title">有效通话时长</span>
+          <span class="card-title">有效通话时长 <i class="info-icon" @mouseenter="showTooltip('callDuration', $event)" @mouseleave="hideTooltip">ⓘ</i></span>
           <span class="card-trend negative">{{ weekTotalData.week_total_call?.team_data?.current_rate_last_current || '0%' }} vs 上期</span>
         </div>
         <div class="card-value">{{ formatDuration(weekTotalData.week_total_call?.team_data?.total_call_duration)||0 }} 小时</div>
       </div>
       <div class="report-card">
         <div class="card-header">
-          <span class="card-title">新增意向客户</span>
+          <span class="card-title">新增意向客户 <i class="info-icon" @mouseenter="showTooltip('newCustomers', $event)" @mouseleave="hideTooltip">ⓘ</i></span>
           <span class="card-trend positive">{{ weekTotalData.week_add_customer_total?.team_data?.week_rate_last_week || '0%' }} vs 上期</span>
         </div>
         <div class="card-value">{{ weekTotalData.week_add_customer_total?.team_data?.total_week_add_customer || 0 }} 人</div>
       </div>
       <div class="report-card">
         <div class="card-header">
-          <span class="card-title">新增成交</span>
+          <span class="card-title">新增成交 <i class="info-icon" @mouseenter="showTooltip('newDeals', $event)" @mouseleave="hideTooltip">ⓘ</i></span>
           <span class="card-trend positive">{{ weekTotalData.week_add_deal_total?.team_data?.week_rate_last_week || '0%' }} vs 上期</span>
         </div>
         <div class="card-value">{{ weekTotalData.week_add_deal_total?.team_data?.total_week_add_deal || 0 }} 单</div>
       </div>
       <div class="report-card">
         <div class="card-header">
-          <span class="card-title">月度总业绩</span>
+          <span class="card-title">月度总业绩 <i class="info-icon" @mouseenter="showTooltip('monthlyRevenue', $event)" @mouseleave="hideTooltip">ⓘ</i></span>
           <span class="card-trend positive">+8% vs 上月</span>
         </div>
         <div class="card-value">{{ formatCurrency(weekTotalData.week_add_fee_total?.total_add_fee || 0) }} 元</div>
       </div>
       <div class="report-card">
         <div class="card-header">
-          <span class="card-title">定金转化率</span>
+          <span class="card-title">定金转化率 <i class="info-icon" @mouseenter="showTooltip('conversionRate', $event)" @mouseleave="hideTooltip">ⓘ</i></span>
           <span class="card-trend positive">{{ weekTotalData.pay_deposit_to_money_rate?.team_data?.week_vs_last_week || '0%' }} vs 上期</span>
         </div>
         <div class="card-value">{{ weekTotalData.pay_deposit_to_money_rate?.team_data?.week_pay_deposit_to_money_rate || '0%' }} </div>
       </div>
     </div>
+    
+    <!-- Tooltip 组件 -->
+    <Tooltip
+      :visible="tooltip.visible"
+      :x="tooltip.x"
+      :y="tooltip.y"
+      :title="tooltip.title"
+      :description="tooltip.description"
+    />
   </div>
 </template>
 
 <script setup>
-import { watch } from 'vue'
+import { watch, reactive } from 'vue'
+import Tooltip from '@/components/Tooltip.vue'
 
 // 定义props
 const props = defineProps({
@@ -82,6 +92,59 @@ const formatCurrency = (amount) => {
   if (!amount) return '0'
   return amount.toLocaleString()
 }
+
+// Tooltip 相关数据
+const tooltip = reactive({
+  visible: false,
+  x: 0,
+  y: 0,
+  title: '',
+  description: ''
+})
+
+// 指标说明配置
+const metricDescriptions = {
+  totalCalls: {
+    title: '团队总通话',
+    description: '团队所有成员在本期内的通话总次数，包括拨出和接听的所有电话。'
+  },
+  callDuration: {
+    title: '有效通话时长',
+    description: '团队所有成员有效通话的总时长，不包括未接通和短时间通话。'
+  },
+  newCustomers: {
+    title: '新增意向客户',
+    description: '本期新增的有明确购买意向的客户数量，通过沟通确认有需求的客户。'
+  },
+  newDeals: {
+    title: '新增成交',
+    description: '本期新增的成交订单数量，已确认付款或签约的客户订单。'
+  },
+  monthlyRevenue: {
+    title: '月度总业绩',
+    description: '本月团队累计完成的销售业绩总额，包括所有已确认的订单金额。'
+  },
+  conversionRate: {
+    title: '定金转化率',
+    description: '支付定金的客户数 ÷ 意向客户总数，反映客户从意向到付费的转化效果。'
+  }
+}
+
+// Tooltip 相关方法
+const showTooltip = (metricType, event) => {
+  const description = metricDescriptions[metricType]
+  if (description) {
+    tooltip.title = description.title
+    tooltip.description = description.description
+    tooltip.x = event.clientX + 10
+    tooltip.y = event.clientY - 10
+    tooltip.visible = true
+  }
+}
+
+const hideTooltip = () => {
+  tooltip.visible = false
+}
 </script>
 
 <style lang="scss" scoped>
@@ -188,4 +251,30 @@ const formatCurrency = (amount) => {
     border-radius: 8px;
   }
 }
+
+// 感叹号图标样式
+.info-icon {
+  font-style: normal;
+  color: #409eff;
+  font-size: 12px;
+  margin-left: 4px;
+  opacity: 0.7;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  
+  &:hover {
+    opacity: 1;
+    color: #007bff;
+    transform: scale(1.2);
+  }
+}
+
+.card-title:hover .info-icon {
+  opacity: 1;
+}
+
+.report-card {
+  position: relative;
+  transition: all 0.2s ease;
+}
 </style>