将客服工作台(Dashboard)从模拟数据改为对接Parse Server真实数据,确保数据统计准确性,并优化界面显示。
2024年10月24日
src/app/pages/customer-service/dashboard/dashboard.ts - 组件逻辑src/app/pages/customer-service/dashboard/dashboard.html - 模板文件目的: 显示公司所有项目的总数
实现:
// 添加到 stats 对象
totalProjects: signal(0), // 项目总数
// 查询逻辑
const totalProjectQuery = this.createQuery('Project');
const totalProjects = await totalProjectQuery.count();
this.stats.totalProjects.set(totalProjects);
数据来源: Project 表,使用公司过滤条件
原名称: 待派单数
新名称: 待分配项目数
查询逻辑:
const pendingQuery = this.createQuery('Project');
pendingQuery.equalTo('status', '待分配');
pendingQuery.doesNotExist('assignee');
const pendingAssignments = await pendingQuery.count();
this.stats.pendingAssignments.set(pendingAssignments);
查询条件:
待分配assignee 字段不存在)查询类: Project
过滤条件:
company = 当前公司指针isDeleted ≠ true查询类: Project
过滤条件:
company = 当前公司指针isDeleted ≠ truecreatedAt >= 今日0点说明: 统计今日新增的项目数量
查询类: Project
过滤条件:
company = 当前公司指针isDeleted ≠ truestatus = '待分配'assignee 不存在查询类: ProjectIssue
过滤条件:
company = 当前公司指针isDeleted ≠ truepriority = 'high'status = 'open'说明: 统计高优先级且未解决的项目问题
查询类: ProjectFeedback
过滤条件:
company = 当前公司指针isDeleted ≠ truestatus = 'pending'feedbackType = 'complaint'说明: 统计待处理的客户投诉反馈
以下核心指标因为没有对应的数据表字段,已从界面移除:
conversionRateToday)pendingComplaints)unRepliedConsultations)新客户触达和老客户回访模块已暂时隐藏,等待后续功能开发:
newCustomerReachCount、newCustomerConversionRate)oldCustomerFollowUpCount、oldCustomerRetentionRate)原因: 这些功能需要额外的数据表支持,当前数据库schema中没有对应的表结构。
| 卡片名称 | 数据来源 | 图标颜色 | 说明 |
|---|---|---|---|
| 项目总数 | Project 表计数 |
Primary(蓝色) | 显示公司所有项目总数 |
| 新咨询数 | Project 表(今日创建) |
Secondary(紫色) | 今日新增的咨询项目数 |
| 待分配项目数 | Project 表(待分配且无设计师) |
Warning(橙色) | 需要分配设计师的项目数 |
| 异常项目 | ProjectIssue 表(高优先级未解决) |
Danger(红色) | 需要紧急处理的项目问题 |
| 售后服务 | ProjectFeedback 表(待处理投诉) |
Success(绿色) | 待处理的客户投诉数 |
stats = {
totalProjects: signal(0), // 项目总数
newConsultations: signal(0), // 新咨询数
pendingAssignments: signal(0), // 待分配项目数
exceptionProjects: signal(0), // 异常项目数
afterSalesCount: signal(0) // 售后服务数量
};
使用 createQuery() 方法创建带公司过滤的查询:
private createQuery(className: string): any {
const query = new Parse.Query(className);
query.equalTo('company', this.getCompanyPointer());
query.notEqualTo('isDeleted', true);
return query;
}
private getCompanyPointer(): any {
if (!this.company()) {
throw new Error('公司信息未加载');
}
return {
__type: 'Pointer',
className: 'Company',
objectId: this.company().id
};
}
Project - 项目表
objectId: 项目IDtitle: 项目名称status: 项目状态assignee: 分配的设计师(Pointer → Profile)company: 所属公司(Pointer → Company)createdAt: 创建时间isDeleted: 是否已删除ProjectIssue - 项目问题表
priority: 优先级(high/medium/low)status: 状态(open/closed)company: 所属公司isDeleted: 是否已删除ProjectFeedback - 项目反馈表
status: 状态(pending/resolved)feedbackType: 反馈类型(complaint/suggestion/praise)company: 所属公司isDeleted: 是否已删除Company - 公司表
objectId: 公司ID(固定为 'cDL6R1hgSi' - 映三色帐套)ngOnInit()
↓
initializeUserAndCompany()
↓
loadDashboardData()
↓
loadConsultationStats() ←── 加载所有统计数据
├─ 项目总数
├─ 新咨询数
├─ 待分配项目数
├─ 异常项目数
└─ 售后服务数量
所有数据加载方法都包含错误处理:
try {
// 查询数据
const result = await query.count();
this.stats.xxx.set(result);
console.log(`✅ 数据加载成功`);
} catch (error) {
console.error('❌ 数据加载失败:', error);
// 不抛出错误,允许其他数据继续加载
}
成功加载时的日志格式:
✅ 用户和公司信息初始化完成
✅ 咨询统计: 项目总数128, 新咨询12, 待分配5, 异常2, 售后15
✅ 紧急任务加载完成: 8 个任务
✅ 项目动态加载完成: 20 条动态
✅ 客服仪表板数据加载完成
核心指标统计
CRM客户管理
CustomerContact 表记录客户触达情况CustomerFollowUp 表记录客户回访记录实时数据更新
查询优化
缓存策略
AI Assistant (Claude)
此次修改严格遵循了Parse Server的数据表结构,确保数据查询的准确性和安全性。所有查询都包含了公司过滤和软删除过滤,保证了数据的隔离性。