前情回顾与本节目标

在上一节中，我们完成了智能开票功能，打通了销售前端与财务后端的开票流程。

本节我们将继续完善财务管理模块，实现回款管理功能。在MBA培训业务中，企业客户往往采用分期付款的方式，财务人员需要跟踪每期回款情况、催收逾期款项、登记回款记录。此外，当财务人员离职时，还需要将手中的客户资源和应收账款交接给接手人。

本节核心目标：

• 数据模型设计：创建回款记录表、分期付款计划表、交接记录表
• 应收账款驾驶舱：展示总应收、逾期金额、本月到期、回款率、高风险学员等核心指标
• 分期付款监控：跟踪每期付款状态，支持催收登记和坏账申请
• 回款登记：财务录入回款信息，上传支付凭证

---

第一步：数据模型准备

1.1 回款记录表（MBA_Receivables）

用于记录每一笔回款信息：

字段名称	字段标识	字段类型	说明
记录ID	_id	文本	主键，系统自动生成
关联订单	rel_order_id	关联关系	关联 MBA_Orders 表
关联客户	rel_customer_id	关联关系	关联 MBA_Customer 表
关联分期计划	rel_installment_id	关联关系	关联 MBA_InstallmentPlans 表
回款金额	amount	数字	实际回款金额
支付方式	pay_method	枚举	1-银行转账、2-支付宝、3-微信支付、4-现金、5-其他
支付凭证	voucher	文件	支付凭证截图或文件
回款日期	pay_date	日期	回款日期
操作人	rel_operator_id	关联关系	关联 MBA_Users 表（财务人员）
备注	remark	文本	备注信息
创建时间	created_at	日期时间	自动生成
更新时间	updated_at	日期时间	自动更新

1.2 分期付款计划表（MBA_InstallmentPlans）

用于记录订单的分期付款计划：

字段名称	字段标识	字段类型	说明
计划ID	_id	文本	主键，系统自动生成
关联订单	rel_order_id	关联关系	关联 MBA_Orders 表
关联客户	rel_customer_id	关联关系	关联 MBA_Customer 表
分期期数	installment_no	数字	第几期（如 1/3）
总期数	total_installments	数字	总分期数
应付金额	amount	数字	本期应付金额
应收日期	due_date	日期	本期应收日期
实收金额	paid_amount	数字	实际已收金额
实收日期	paid_date	日期	实际收款日期
付款状态	status	枚举	1-待支付、2-已支付、3-逾期、4-坏账
逾期天数	overdue_days	数字	逾期天数（自动计算）
责任人	rel_owner_id	关联关系	关联 MBA_Users 表（负责催收的销售）
催收记录	collection_notes	多行文本	催收沟通记录
创建时间	created_at	日期时间	自动生成
更新时间	updated_at	日期时间	自动更新

---

第二步：应收账款驾驶舱

2.1 创建回款管理页面

点击创建页面图标，输入"回款管理"，选择财务布局

切换到布局管理，选择财务布局，添加平级菜单，添加"回款管理"菜单

2.2 页面整体布局

切换回页面设计，在财务布局的内容插槽下添加布局组件，修改标题为"回款管理"

2.3 统计卡片区域

在页面顶部添加网格布局。

选中行组件，设置列的数量为5

在列里添加卡片组件

卡片组件分别展示核心指标：

卡片	指标	数据来源
总应收金额	¥128,500	汇总分期计划表中待支付+逾期金额
逾期金额	¥45,000	汇总分期计划表中逾期状态的金额
本月到期金额	¥35,500	汇总分期计划表中本月到期的金额
已回款率	68%	已支付金额 / 总应收金额 × 100%
高风险学员数	8	逾期超过30天且剩余课时少的学员数

创建自定义变量，用来保存统计的结果

创建自定义方法 loadDashboardData：

export default async function loadDashboardData({ event, data }) {
  try {
    // 1. 查询所有分期计划
    const planRes = await $w.cloud.callDataSource({
      dataSourceName: 'MBA_InstallmentPlans',
      methodName: 'wedaGetRecordsV2',
      params: {
        filter: { where: {} },
        select: { $master: true }
      }
    });

    const plans = planRes.records || [];

    // 2. 计算各项指标
    const totalReceivable = plans.reduce((sum, p) => sum + (p.amount || 0), 0);
    const totalPaid = plans
      .filter(p => p.status === '2')
      .reduce((sum, p) => sum + (p.paid_amount || 0), 0);
    const overdueAmount = plans
      .filter(p => p.status === '3')
      .reduce((sum, p) => sum + (p.amount || 0), 0);

    const now = new Date();
    const currentMonth = now.getMonth();
    const currentYear = now.getFullYear();
    const monthDueAmount = plans
      .filter(p => {
        const dueDate = new Date(p.due_date);
        return dueDate.getMonth() === currentMonth && dueDate.getFullYear() === currentYear;
      })
      .reduce((sum, p) => sum + (p.amount || 0), 0);

    const payRate = totalReceivable > 0 ? Math.round((totalPaid / totalReceivable) * 100) : 0;
    const highRiskCount = plans.filter(p => p.overdue_days > 30).length;

    // 3. 更新页面状态
    $w.page.dataset.state.dashboardData = {
      totalReceivable,
      overdueAmount,
      monthDueAmount,
      payRate,
      highRiskCount
    };

  } catch (error) {
    console.error('加载驾驶舱数据失败:', error);
  }
}

在页面加载时调用 loadDashboardData 方法。

然后给卡片组件对应的文本绑定内容

---

第三步：分期付款监控

3.1 数据表格配置

在网格布局继续添加行，在列里添加数据表格组件，数据模型选择分期付款计划表（MBA_InstallmentPlans），勾选全部场景

3.2 配置筛选条件

在表格上方添加筛选区域，包含以下筛选条件：

• 学员姓名/电话（文本搜索）
• 付款状态（下拉选择：待支付/已支付/逾期/坏账）
• 责任人
• 逾期天数
  

3.3 配置操作列

在数据表格的操作列配置功能按钮：

按钮名称	功能说明	显示条件
催收登记	记录催收沟通内容	状态 = 待支付 或 逾期
查看订单	跳转到订单详情	全部显示
标记已付	手动标记为已支付	状态 ≠ 已支付
发起坏账申请	标记为坏账	状态 = 逾期
回款登记	记录当期回款情况	状态 = 待支付

3.4 催收登记功能

在页面组件下添加弹窗组件，修改标题为"催收登记"

在弹窗内容区域添加多行文本组件，用于记录催收沟通内容。

创建自定义方法 submitCollection：

export default async function submitCollection({ event, data }) {
  const planId = data.target;
  const collectionNote = $w.textarea_collection.value;

  if (!collectionNote) {
    return $w.utils.showToast({ title: '请填写催收记录', icon: 'error' });
  }

  try {
    $w.utils.showLoading({ title: '保存中...' });

    await $w.cloud.callDataSource({
      dataSourceName: 'MBA_InstallmentPlans',
      methodName: 'wedaUpdateV2',
      params: {
        filter: { where: { _id: { $eq: planId } } },
        data: {
          collection_notes: collectionNote,
          updated_at: Date.now()
        }
      }
    });

    $w.utils.hideLoading();
    $w.utils.showToast({ title: '催收记录已保存', icon: 'success' });
    $w.modal1.close({});
    $w.table1.refresh();

  } catch (error) {
    console.error('保存催收记录失败:', error);
    $w.utils.hideLoading();
    $w.utils.showToast({ title: '保存失败，请重试', icon: 'error' });
  }
}

给催收登记按钮配置点击事件，打开弹窗，传入所在行的数据标识

给弹窗的确认按钮配置点击事件，调用方法，传入弹窗的入参

3.5 标记已付功能

创建自定义方法 markAsPaid：

export default async function markAsPaid({ event, data }) {
  const planId = data.target._id;

  try {
    $w.utils.showLoading({ title: '处理中...' });

    await $w.cloud.callDataSource({
      dataSourceName: 'MBA_InstallmentPlans',
      methodName: 'wedaUpdateV2',
      params: {
        filter: { where: { _id: { $eq: planId } } },
        data: {
          status: '2',
          paid_date: Date.now(),
          overdue_days: 0,
          updated_at: Date.now()
        }
      }
    });

    $w.utils.hideLoading();
    $w.utils.showToast({ title: '已标记为已支付', icon: 'success' });
    $w.table1.refresh();

  } catch (error) {
    console.error('标记失败:', error);
    $w.utils.hideLoading();
    $w.utils.showToast({ title: '操作失败，请重试', icon: 'error' });
  }
}

给按钮配置点击事件，调用方法，传入所在行的数据标识

---

最终效果

财务人员进入回款管理页面，首先看到应收账款驾驶舱的5个核心指标卡片，快速掌握整体回款情况。

在分期付款监控区域，可以按状态、责任人、逾期天数等条件筛选，查看每笔分期付款的详情。对于待支付和逾期的款项，可以进行催收登记；对于已确认收款的，可以标记已付。

---

总结

本节完成了回款管理功能的实现：

1. 数据模型设计：创建回款记录表（MBA_Receivables）、分期付款计划表（MBA_InstallmentPlans）、交接记录表（MBA_Handovers）
2. 应收账款驾驶舱：5个核心指标卡片，实时掌握回款全貌
3. 分期付款监控：跟踪每期付款状态，支持催收登记、标记已付

通过本节的学习，我们完善了财务管理的回款流程。下一节我们将继续完善财务管理模块的其他功能。