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 {
|
.bar {
|
||||||
width: 20px;
|
width: 35px;
|
||||||
min-height: 2px;
|
min-height: 2px;
|
||||||
border-radius: 2px 2px 0 0;
|
border-radius: 2px 2px 0 0;
|
||||||
transition: all 0.3s ease;
|
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 selectedGroup = ref(groups[0])
|
||||||
|
|
||||||
// 选择组别函数
|
// 选择组别函数
|
||||||
const selectGroup = (group) => {
|
const selectGroup = async (group) => {
|
||||||
selectedGroup.value = 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