feat: 初始化Vue项目并添加核心功能模块

添加了Vue3项目基础结构，包括路由、状态管理和API配置
实现了销售管理系统的核心功能模块，包括业绩看板、团队管理和客户分析
集成了Element Plus UI组件库和ECharts数据可视化
添加了全局样式和响应式布局支持

my-vue-app/src/views/topOne/components/CommunicationData.vue

@@ -0,0 +1,104 @@
+<template>
+  <div class="dashboard-card">
+    <div class="card-header">
+      <h3>沟通总数据</h3>
+      <span class="metric-period">本周</span>
+    </div>
+    <div class="communication-cards">
+      <div class="comm-card">
+        <div class="card-icon">📞</div>
+        <div class="card-content">
+          <div class="card-label">总通话时长</div>
+          <div class="card-value">{{ communicationData.totalDuration }}小时</div>
+        </div>
+      </div>
+      <div class="comm-card">
+        <div class="card-icon">✅</div>
+        <div class="card-content">
+          <div class="card-label">有效沟通率</div>
+          <div class="card-value">{{ communicationData.effectiveRate }}%</div>
+        </div>
+      </div>
+      <div class="comm-card">
+        <div class="card-icon">⚡</div>
+        <div class="card-content">
+          <div class="card-label">首次响应时长</div>
+          <div class="card-value">{{ communicationData.firstResponseTime }}秒</div>
+        </div>
+      </div>
+      <div class="comm-card">
+        <div class="card-icon">📊</div>
+        <div class="card-content">
+          <div class="card-label">接通率</div>
+          <div class="card-value">{{ communicationData.connectionRate }}%</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { defineProps } from 'vue';
+
+defineProps({
+  communicationData: Object
+});
+</script>
+
+<style scoped>
+.dashboard-card {
+  background-color: #fff;
+  border-radius: 8px;
+  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+}
+
+.card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 20px;
+}
+
+.card-header h3 {
+  margin: 0;
+  font-size: 18px;
+}
+
+.metric-period {
+  font-size: 14px;
+  color: #666;
+}
+
+.communication-cards {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 15px;
+}
+
+.comm-card {
+  display: flex;
+  align-items: center;
+  background-color: #f9f9f9;
+  padding: 15px;
+  border-radius: 8px;
+}
+
+.card-icon {
+  font-size: 24px;
+  margin-right: 15px;
+}
+
+.card-label {
+  font-size: 14px;
+  color: #666;
+}
+
+.card-value {
+  font-size: 18px;
+  font-weight: bold;
+}
+</style>