合并代码
This commit is contained in:
@@ -142,11 +142,31 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</div>
|
</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
|
<el-table
|
||||||
:data="merchants"
|
:data="merchants"
|
||||||
v-loading="loadingMerchants"
|
v-loading="loadingMerchants"
|
||||||
stripe
|
stripe
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
|
:row-class-name="({ row }) => row.is_early_merchant ? 'early-merchant' : ''"
|
||||||
>
|
>
|
||||||
<el-table-column prop="username" label="用户名" width="120">
|
<el-table-column prop="username" label="用户名" width="120">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
@@ -166,6 +186,30 @@
|
|||||||
</el-tag>
|
</el-tag>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</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="completed_matches" label="完成匹配" width="100" />
|
||||||
<el-table-column prop="joined_at" label="加入时间" width="160">
|
<el-table-column prop="joined_at" label="加入时间" width="160">
|
||||||
<template #default="{ row }">
|
<template #default="{ row }">
|
||||||
@@ -228,10 +272,9 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="commission_type" label="佣金类型" width="120">
|
<el-table-column prop="commission_type" label="佣金类型" width="120">
|
||||||
<template #default="{ row }">
|
<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>
|
||||||
<el-tag v-else>{{ row.commission_type }}</el-tag>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column prop="status" label="状态" width="100">
|
<el-table-column prop="status" label="状态" width="100">
|
||||||
@@ -324,7 +367,10 @@ import {
|
|||||||
Refresh,
|
Refresh,
|
||||||
CreditCard,
|
CreditCard,
|
||||||
Management,
|
Management,
|
||||||
ArrowRight
|
ArrowRight,
|
||||||
|
InfoFilled,
|
||||||
|
Warning,
|
||||||
|
Check
|
||||||
} from '@element-plus/icons-vue'
|
} from '@element-plus/icons-vue'
|
||||||
import { use } from 'echarts/core'
|
import { use } from 'echarts/core'
|
||||||
import { CanvasRenderer } from 'echarts/renderers'
|
import { CanvasRenderer } from 'echarts/renderers'
|
||||||
@@ -428,6 +474,17 @@ const loadMerchants = async () => {
|
|||||||
|
|
||||||
merchants.value = data.data.merchants
|
merchants.value = data.data.merchants
|
||||||
merchantsTotal.value = data.data.total
|
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) {
|
} catch (error) {
|
||||||
ElMessage.error('加载商户列表失败')
|
ElMessage.error('加载商户列表失败')
|
||||||
} finally {
|
} finally {
|
||||||
@@ -489,22 +546,50 @@ const getAuditStatusText = (status) => {
|
|||||||
return texts[status] || status
|
return texts[status] || status
|
||||||
}
|
}
|
||||||
|
|
||||||
const getCommissionStatusType = (status) => {
|
/**
|
||||||
|
* 获取佣金类型标签类型
|
||||||
|
* @param {string} type - 佣金类型
|
||||||
|
* @returns {string} 标签类型
|
||||||
|
*/
|
||||||
|
const getCommissionTypeTagType = (type) => {
|
||||||
const types = {
|
const types = {
|
||||||
pending: 'warning',
|
registration: 'primary',
|
||||||
paid: 'success',
|
matching: 'success'
|
||||||
cancelled: 'danger'
|
|
||||||
}
|
}
|
||||||
return types[status] || 'info'
|
return types[type] || 'info'
|
||||||
}
|
}
|
||||||
|
|
||||||
const getCommissionStatusText = (status) => {
|
/**
|
||||||
|
* 获取佣金类型文本
|
||||||
|
* @param {string} type - 佣金类型
|
||||||
|
* @returns {string} 显示文本
|
||||||
|
*/
|
||||||
|
const getCommissionTypeText = (type) => {
|
||||||
const texts = {
|
const texts = {
|
||||||
pending: '待支付',
|
registration: '注册佣金',
|
||||||
paid: '已支付',
|
matching: '匹配佣金'
|
||||||
cancelled: '已取消'
|
|
||||||
}
|
}
|
||||||
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) => {
|
const formatDateTime = (date) => {
|
||||||
@@ -745,13 +830,17 @@ const updateChartOptions = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 生命周期
|
// 生命周期
|
||||||
onMounted(() => {
|
onMounted(async () => {
|
||||||
loadAgentInfo()
|
loadAgentInfo()
|
||||||
if (agentInfo.value) {
|
if (agentInfo.value) {
|
||||||
loadStats()
|
// 先加载基础统计数据
|
||||||
loadChartData()
|
await loadStats()
|
||||||
loadMerchants()
|
// 然后并行加载其他数据
|
||||||
loadCommissions()
|
await Promise.all([
|
||||||
|
loadChartData(),
|
||||||
|
loadMerchants(),
|
||||||
|
loadCommissions()
|
||||||
|
])
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
@@ -1206,6 +1295,71 @@ onMounted(() => {
|
|||||||
color: white;
|
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) {
|
@media (max-width: 768px) {
|
||||||
.dashboard-header {
|
.dashboard-header {
|
||||||
|
|||||||
Reference in New Issue
Block a user