![}]J}G2`AR5WA@)CWQ`~0]9F.png](https://ucc.alicdn.com/pic/developer-ecology/9a49c94ff39c45d6b3295da78234735d.png?x-oss-process=image/resize,w_1400/format,webp "}]J}G2`AR5WA@)CWQ`~0]9F.png")
这是人力统计的一个表格的表头，根据月份，划分周，每周从周一开始到周日（国内习惯性）。而跨月份的周算在前一个月还是后一个月，我们的需求是算在后一个月。根据情况而定。
在表格中我们可以通过动态生成列，维护一个二维的数组，这个二维数组应该长得像这样
外层的属性 nameLabel 是显示在最上面的年月，weekData 对应的是一个数组显示的是下面的周起止日期和周序号 W1 - W5
我们再来看，如何得到一个这样的二维数组？
首先声明一个名为 generateWeeklyArray 的函数，参数为起止年月，格式为年月组成的数字类型好了，如 202108
generateWeeklyArray (startTime, endTime){}
这里为了方便日期转化，和计算，引入了
momnet日期库
下面是具体的实现，我们对着代码具体讲解下
generateWeeklyArray (startTime, endTime) { startTime = moment(startTime).format('YYYY-MM-DD') endTime = moment(endTime).endOf('month').format('YYYY-MM-DD') let firstDay = new Date(startTime) let lastDay = new Date(endTime) let day = firstDay let weeklyData = [] if (firstDay.getDay !== 1) { let realFirst = moment(day).add(-6, 'days').format('YYYY-MM-DD') day = new Date(realFirst) } while (day.getTime() < lastDay.getTime() || day.getTime() === lastDay.getTime()) { if (day.getDay() === 1) { let yearMonth = moment(day).format('YYYYMM') if (moment(day).format('M') < moment(day).add(6, 'days').format('M') || moment(day).format('YYYY') < moment(day).add(6, 'days').format('YYYY')) { yearMonth = moment(day).add(6, 'days').format('YYYYMM') } if (moment(day).format('YYYYMM') === moment(lastDay).format('YYYYMM') && moment(lastDay).format('YYYYMM') !== moment(day).add(6, 'days').format('YYYYMM')) { // console.log('下个月显示') } else { let weekRange = moment(day).format('M/D') + '-' + moment(day).add(6, 'days').format('M/D') weeklyData.push({ nameProp: 'col' + yearMonth + weekRange.replace(/\/|-/g, ''), weekRange: weekRange, yearMonth: yearMonth }) } day.setDate(day.getDate() + 7) } else { day.setDate(day.getDate() + 1) } } let weeklyColumnHeaders = [] weeklyData.forEach(col => { let colName = 'col' + col.yearMonth let colItem = weeklyColumnHeaders.find(item => item.nameProp === colName) if (colItem) { weeklyColumnHeaders.map(item => { if (item.nameProp === colName) { item.weekData.push({ weekRange: col.weekRange, nameProp: col.nameProp, weekNo: 'W' + (item.weekData.length + 1) }) } }) } else { weeklyColumnHeaders.push({ nameProp: colName, nameLabel: col.yearMonth, weekData: [{weekRange: col.weekRange, nameProp: col.nameProp, weekNo: 'W' + 1}] }) } }) return weeklyColumnHeaders }
这里主要的逻辑是在 while 循环中，以起止时间为条件，循环遍历找出周一的日期，通过向后推算六天，得到周的日期范围，组成数据添加到当前月份的 weekData 的数组中，当前数组的长度即为周的序号。
一般循环需要兼顾下两头的特殊情况，首先看开始的情况：当 startTime 月份的1号不是周一，就需要往前推几天，直到周一作为开始日期。
let day = firstDay let weeklyData = [] if (firstDay.getDay !== 1) { let realFirst = moment(day).add(-6, 'days').format('YYYY-MM-DD') day = new Date(realFirst) }
再来看结束时间的情况：如果 endTime 所在的月份的最后一周跨了月份，根据我们的规则，我们要把它算在下一个月里，这里要排除掉它
if (moment(day).format('YYYYMM') === moment(lastDay).format('YYYYMM') && moment(lastDay).format('YYYYMM') !== moment(day).add(6, 'days').format('YYYYMM')) { // console.log('下个月显示') } else { let weekRange = moment(day).format('M/D') + '-' + moment(day).add(6, 'days').format('M/D') weeklyData.push({ nameProp: 'col' + yearMonth + weekRange.replace(/\/|-/g, ''), weekRange: weekRange, yearMonth: yearMonth }) }
好了，这里的需要注意的地方就这些，其它的逻辑简单可以自己看代码。
