feat(secondTop): 增加团队业绩详情功能并调整柱状图宽度
- 在secondTop.vue中添加团队业绩详情数据获取和展示功能 - 修改GroupRanking.vue中柱状图宽度从20px调整为35px
This commit is contained in:
@@ -280,7 +280,7 @@ const yAxisLabels = ref(['100%', '80%', '60%', '40%', '20%', '0%'])
|
||||
}
|
||||
|
||||
.bar {
|
||||
width: 20px;
|
||||
width: 35px;
|
||||
min-height: 2px;
|
||||
border-radius: 2px 2px 0 0;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
@@ -401,12 +401,170 @@ const conversionRateVsAverage = ref({})
|
||||
}
|
||||
}
|
||||
|
||||
// 团队业绩详情数据
|
||||
const groupPerformance = ref({})
|
||||
|
||||
// 根据传来的组名字来获取组业绩详情
|
||||
async function CenterGroupPerformance(groupName) {
|
||||
const params = getRequestParams()
|
||||
const hasParams = params.user_name
|
||||
const requestParams = hasParams ? {
|
||||
...params,
|
||||
department: groupName
|
||||
} : {
|
||||
department: groupName
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await getTeamRankingInfo(requestParams)
|
||||
|
||||
if (res.code === 200) {
|
||||
groupPerformance.value = res.data
|
||||
/**
|
||||
* "data": {
|
||||
"department": "巅峰三部-刘东洋",
|
||||
"group_details": [
|
||||
{
|
||||
"name": "徐小玉",
|
||||
"today_performance": 0.0,
|
||||
"monthly_performance": 0.0,
|
||||
"conversion_rate_this_period": "0.00%",
|
||||
"new_customers_this_period": 41,
|
||||
"deals_this_period": 0,
|
||||
"deals_this_month": 0,
|
||||
"call_count_this_period": 0,
|
||||
"rank": 2
|
||||
},
|
||||
{
|
||||
"name": "唐梦",
|
||||
"today_performance": 0.0,
|
||||
"monthly_performance": 0.0,
|
||||
"conversion_rate_this_period": "0.00%",
|
||||
"new_customers_this_period": 39,
|
||||
"deals_this_period": 0,
|
||||
"deals_this_month": 0,
|
||||
"call_count_this_period": 0,
|
||||
"rank": 2
|
||||
},
|
||||
{
|
||||
"name": "董富忠",
|
||||
"today_performance": 0,
|
||||
"monthly_performance": 6500.0,
|
||||
"conversion_rate_this_period": "1.72%",
|
||||
"new_customers_this_period": 58,
|
||||
"deals_this_period": 1,
|
||||
"deals_this_month": 1,
|
||||
"call_count_this_period": 0,
|
||||
"rank": 1
|
||||
},
|
||||
{
|
||||
"name": "王娟娟",
|
||||
"today_performance": 0.0,
|
||||
"monthly_performance": 0.0,
|
||||
"conversion_rate_this_period": "0.00%",
|
||||
"new_customers_this_period": 51,
|
||||
"deals_this_period": 0,
|
||||
"deals_this_month": 0,
|
||||
"call_count_this_period": 0,
|
||||
"rank": 2
|
||||
},
|
||||
{
|
||||
"name": "罗荣海",
|
||||
"today_performance": 0.0,
|
||||
"monthly_performance": 0.0,
|
||||
"conversion_rate_this_period": "0.00%",
|
||||
"new_customers_this_period": 0,
|
||||
"deals_this_period": 0,
|
||||
"deals_this_month": 0,
|
||||
"call_count_this_period": 0,
|
||||
"rank": 2
|
||||
},
|
||||
{
|
||||
"name": "代秀珍",
|
||||
"today_performance": 0.0,
|
||||
"monthly_performance": 0.0,
|
||||
"conversion_rate_this_period": "0.00%",
|
||||
"new_customers_this_period": 39,
|
||||
"deals_this_period": 0,
|
||||
"deals_this_month": 0,
|
||||
"call_count_this_period": 0,
|
||||
"rank": 2
|
||||
}
|
||||
]
|
||||
}
|
||||
*/
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取团队排名失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 当前选中的组别,默认为第一个
|
||||
const selectedGroup = ref(groups[0])
|
||||
|
||||
// 选择组别函数
|
||||
const selectGroup = (group) => {
|
||||
const selectGroup = async (group) => {
|
||||
selectedGroup.value = group
|
||||
|
||||
// 获取组名并调用API获取团队成员详情
|
||||
let departmentName = group.name
|
||||
|
||||
// 如果有groupList数据,尝试找到完整的部门名称
|
||||
if (groupList.value && groupList.value.formal_plural) {
|
||||
const departmentKeys = Object.keys(groupList.value.formal_plural)
|
||||
console.log('所有部门名称:', departmentKeys)
|
||||
console.log('当前选中组别名称:', group.name)
|
||||
|
||||
// 优先进行精确匹配
|
||||
let matchedDepartment = departmentKeys.find(key => key === group.name)
|
||||
|
||||
// 如果精确匹配失败,尝试模糊匹配
|
||||
if (!matchedDepartment) {
|
||||
matchedDepartment = departmentKeys.find(key => {
|
||||
// 提取部门主要名称进行匹配(去掉经理名字部分)
|
||||
const mainName = key.split('-')[0] || key
|
||||
const groupMainName = group.name.split('-')[0] || group.name
|
||||
return mainName.includes(groupMainName) || groupMainName.includes(mainName)
|
||||
})
|
||||
}
|
||||
|
||||
if (matchedDepartment) {
|
||||
departmentName = matchedDepartment
|
||||
}
|
||||
}
|
||||
|
||||
console.log('选中的组别:', group.name, '-> 发送的部门名称:', departmentName)
|
||||
|
||||
try {
|
||||
await CenterGroupPerformance(departmentName)
|
||||
|
||||
// 将API返回的数据整理后更新到selectedGroup的members字段
|
||||
if (groupPerformance.value && groupPerformance.value.group_details) {
|
||||
const formattedMembers = groupPerformance.value.group_details.map((member, index) => ({
|
||||
id: index + 1,
|
||||
name: member.name,
|
||||
position: '销售顾问', // 默认职位
|
||||
phone: '***-****-****', // 隐藏手机号
|
||||
status: member.rank === 1 ? 'excellent' : member.rank === 2 ? 'good' : 'average',
|
||||
joinDate: '2023-01-01', // 默认入职日期
|
||||
todayPerformance: member.today_performance || 0,
|
||||
monthlyPerformance: member.monthly_performance || 0,
|
||||
conversionRate: parseFloat(member.conversion_rate_this_period) || 0,
|
||||
callCount: member.call_count_this_period || 0,
|
||||
newClients: member.new_customers_this_period || 0,
|
||||
deals: member.deals_this_period || 0
|
||||
}))
|
||||
|
||||
// 更新selectedGroup的members数据
|
||||
selectedGroup.value = {
|
||||
...selectedGroup.value,
|
||||
members: formattedMembers
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取团队详情失败:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理高级经理选择变化
|
||||
|
||||
Reference in New Issue
Block a user