前端如何按月份和天数拆分用户订阅总金额并重新计算？

需求背景 #

从后端获取用户列表，每个用户支付月度订阅费（金额可能因其他因素变动），前端通过「起始日期」和「结束日期」输入框查看用户支付的总金额。

示例：3位用户2024年1月1日至4月1日每月支付100元，返回的用户数据格式如下：

users: [
  {
    0: [{
      userName: 'user 1',
      amountPaid: 300
    }],
    1: [{
      userName: 'user 2',
      amountPaid: 300
    }],
    2: [{
      userName: 'user 3',
      amountPaid: 300
    }]
  }
]

核心计算需求 #

需要实现按天数比例计算非整月的订阅金额：若起始日期为2024-01-01，结束日期为2024-03-15，计算逻辑为100（1月）+100（2月）+48.39（15÷31×100），即非整月部分按实际天数占当月总天数的比例计算金额。

现有代码 #

已完成基础代码搭建：

splitTotalPaidIntoMonths(){
  this.diffBetweenDatesMonthFormat = moment(this.toDate).diff(this.fromDate, 'month')
  this.toDateMonthStartDate = moment(this.toDate).startOf('month')
  this.compareToDateWithToDateMonthStart = moment(this.toDate).diff(this.toDateMonthStartDate, 'days')
  if(this.users){
    this.totalPaymentDividedByMonths = this.users[0].amountPaid / this.diffBetweenDatesMonthFormat;
  }
},

showUsers() {
  this.users = null;
  this.init = true;
  axiosDatabaseService.getUsers(
    moment(this.fromDate).format('YYYY-MM-DD'),
    moment(this.toDate).format('YYYY-MM-DD'))
    .then(result => {
      this.users = result.data;
    })
},

思路与遇到的问题 #

我的实现思路：

• 计算起止日期之间的月份数；
• 计算结束日期所在月的1号到结束日期的天数；
• 获取用户数据后，将每个用户的总金额按月份数拆分（如总金额300、3个月拆分为[100,100,100]），存入totalPaymentDividedByMonths数组；
• 若结束日期为月中，将最后一个金额替换为按天数比例计算的值；
• 求和拆分后的金额，替换users数组中原有的amountPaid为新的求和结果。

但目前totalPaymentDividedByMonths数组无法正确填充用户及拆分后的金额，尝试以下代码仍未解决：

this.totalPaymentDividedByMonths = (num = this.users[0].totalAmount, n = this.diffBetweenDatesMonthFormat) => new Array(n).fill(num / n);

希望找到更简便的前端实现方式，该如何推进？

内容的提问来源于stack exchange，提问作者Cphml444