合并代码

src/views/AgentDashboard.vue

@@ -142,11 +142,31 @@
             </el-button>
           </div>
           
+          <!-- 商户统计信息 -->
+          <div class="merchant-stats" v-if="stats.total_merchants">
+            <div class="stat-item">
+              <span class="stat-label">总商户数：</span>
+              <span class="stat-value">{{ stats.total_merchants || 0 }}</span>
+            </div>
+            <div class="stat-item">
+              <span class="stat-label">正常商户：</span>
+              <span class="stat-value normal">{{ stats.normal_merchants || 0 }}</span>
+            </div>
+            <div class="stat-item">
+              <span class="stat-label">早期商户：</span>
+              <span class="stat-value early">{{ stats.early_merchants || 0 }}</span>
+              <el-tooltip content="注册时间早于代理加入时间的商户，不参与佣金计算" placement="top">
+                <el-icon class="info-icon"><InfoFilled /></el-icon>
+              </el-tooltip>
+            </div>
+          </div>
+          
           <el-table 
             :data="merchants" 
             v-loading="loadingMerchants"
             stripe
             style="width: 100%"
+            :row-class-name="({ row }) => row.is_early_merchant ? 'early-merchant' : ''"
           >
             <el-table-column prop="username" label="用户名" width="120">
               <template #default="{ row }">
@@ -166,6 +186,30 @@
                 </el-tag>
               </template>
             </el-table-column>
+            <el-table-column prop="merchant_status" label="商户类型" width="150">
+              <template #default="{ row }">
+                <el-tag 
+                  :type="row.is_early_merchant ? 'warning' : 'success'"
+                  :icon="row.is_early_merchant ? 'Warning' : 'Check'"
+                >
+                  {{ row.merchant_status || '正常商户' }}
+                </el-tag>
+                <el-tooltip 
+                  v-if="row.is_early_merchant" 
+                  content="该商户注册时间早于代理加入时间，不参与佣金计算" 
+                  placement="top"
+                >
+                  <el-icon class="info-icon"><InfoFilled /></el-icon>
+                </el-tooltip>
+              </template>
+            </el-table-column>
+            <el-table-column prop="commission_count" label="佣金记录" width="100">
+              <template #default="{ row }">
+                <span :class="{ 'text-muted': row.is_early_merchant }">
+                  {{ row.commission_count || 0 }} 笔
+                </span>
+              </template>
+            </el-table-column>
             <el-table-column prop="completed_matches" label="完成匹配" width="100" />
             <el-table-column prop="joined_at" label="加入时间" width="160">
               <template #default="{ row }">
@@ -228,10 +272,9 @@
             </el-table-column>
             <el-table-column prop="commission_type" label="佣金类型" width="120">
               <template #default="{ row }">
-                <el-tag v-if="row.commission_type === 'third_match'" type="success">
-                  第三次匹配
+                <el-tag :type="getCommissionTypeTagType(row.commission_type)">
+                  {{ getCommissionTypeText(row.commission_type) }}
                 </el-tag>
-                <el-tag v-else>{{ row.commission_type }}</el-tag>
               </template>
             </el-table-column>
             <el-table-column prop="status" label="状态" width="100">
@@ -324,7 +367,10 @@ import {
   Refresh, 
   CreditCard, 
   Management, 
-  ArrowRight 
+  ArrowRight,
+  InfoFilled,
+  Warning,
+  Check
 } from '@element-plus/icons-vue'
 import { use } from 'echarts/core'
 import { CanvasRenderer } from 'echarts/renderers'
@@ -428,6 +474,17 @@ const loadMerchants = async () => {
     
     merchants.value = data.data.merchants
     merchantsTotal.value = data.data.total
+    
+    // 更新商户相关的统计信息（如果返回了统计数据）
+    if (data.data.stats) {
+      // 只更新商户相关的统计字段，保留其他统计数据
+      stats.value = { 
+        ...stats.value, 
+        total_merchants: data.data.stats.total_merchants,
+        early_merchants: data.data.stats.early_merchants,
+        normal_merchants: data.data.stats.normal_merchants
+      }
+    }
   } catch (error) {
     ElMessage.error('加载商户列表失败')
   } finally {
@@ -489,22 +546,50 @@ const getAuditStatusText = (status) => {
   return texts[status] || status
 }
 
-const getCommissionStatusType = (status) => {
+/**
+ * 获取佣金类型标签类型
+ * @param {string} type - 佣金类型
+ * @returns {string} 标签类型
+ */
+const getCommissionTypeTagType = (type) => {
   const types = {
-    pending: 'warning',
-    paid: 'success',
-    cancelled: 'danger'
+    registration: 'primary',
+    matching: 'success'
   }
-  return types[status] || 'info'
+  return types[type] || 'info'
 }
 
-const getCommissionStatusText = (status) => {
+/**
+ * 获取佣金类型文本
+ * @param {string} type - 佣金类型
+ * @returns {string} 显示文本
+ */
+const getCommissionTypeText = (type) => {
   const texts = {
-    pending: '待支付',
-    paid: '已支付',
-    cancelled: '已取消'
+    registration: '注册佣金',
+    matching: '匹配佣金'
   }
-  return texts[status] || status
+  return texts[type] || type
+}
+
+/**
+ * 获取佣金状态标签类型
+ * @param {string} status - 佣金状态
+ * @returns {string} 标签类型
+ */
+const getCommissionStatusType = (status) => {
+  // 由于agent_commission_records表没有status字段，所有佣金记录都是已生成状态
+  return 'success'
+}
+
+/**
+ * 获取佣金状态文本
+ * @param {string} status - 佣金状态
+ * @returns {string} 显示文本
+ */
+const getCommissionStatusText = (status) => {
+  // 由于agent_commission_records表没有status字段，所有佣金记录都是已生成状态
+  return '已生成'
 }
 
 const formatDateTime = (date) => {
@@ -745,13 +830,17 @@ const updateChartOptions = () => {
 }
 
 // 生命周期
-onMounted(() => {
+onMounted(async () => {
   loadAgentInfo()
   if (agentInfo.value) {
-    loadStats()
-    loadChartData()
-    loadMerchants()
+    // 先加载基础统计数据
+    await loadStats()
+    // 然后并行加载其他数据
+    await Promise.all([
+      loadChartData(),
+      loadMerchants(),
       loadCommissions()
+    ])
   }
 })
 </script>
@@ -1206,6 +1295,71 @@ onMounted(() => {
   color: white;
 }
 
+/* 商户统计信息样式 */
+.merchant-stats {
+  display: flex;
+  gap: 24px;
+  padding: 16px;
+  background: #f8f9fa;
+  border-radius: 8px;
+  margin-bottom: 16px;
+  border: 1px solid #e9ecef;
+}
+
+.merchant-stats .stat-item {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+}
+
+.merchant-stats .stat-label {
+  font-size: 14px;
+  color: #666;
+  font-weight: 500;
+}
+
+.merchant-stats .stat-value {
+  font-size: 16px;
+  font-weight: 600;
+  color: #333;
+}
+
+.merchant-stats .stat-value.normal {
+  color: #67C23A;
+}
+
+.merchant-stats .stat-value.early {
+  color: #E6A23C;
+}
+
+/* 商户类型相关样式 */
+.info-icon {
+  margin-left: 4px;
+  color: #E6A23C;
+  cursor: help;
+  font-size: 14px;
+}
+
+.text-muted {
+  color: #909399;
+  font-style: italic;
+}
+
+.merchant-status-tag {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+
+/* 早期商户行样式 */
+.el-table .el-table__row.early-merchant {
+  background-color: #fdf6ec;
+}
+
+.el-table .el-table__row.early-merchant:hover {
+  background-color: #faecd8;
+}
+
 /* 移动端响应式 */
 @media (max-width: 768px) {
   .dashboard-header {