假设需要打卡的总天数为X
当 1≤X＜2²时，每行默认显示1个
当2²≤X＜3²时，每行默认显示2个
当3²≤X＜4²时，每行默认显示3个
……
当9²≤X＜10²时，每行默认显示9个
计算规则：用需要计算的数除以每行的个数，计算结果如果为整数的话，那么计算就一步完成了。计算结果如果不为整数，那么将结果向下取整，得到所需行数，每一行显示的数量需根据原始数据除以总行数来判断，原始数据除以总行数如果不为整数，那么第一行就显示默认数量，计算第二行的显示数量时，用当前剩余数量除以剩余行数，如果结果不为整数的话就还是显示默认数量，以此类推，直到余数除以剩余行数的结果为整数为止。
举例：需要打卡的天数为21天，根据最上面的规则，可以知道数字为21天时，每行默认显示4个。下面计算所需行数。21/4=5.25，不为整数，那么就将5.25向下取整，得到所需行数为5. 接下来计算每行展示的方块数量：
第一行：21/5=4.2，不为整，所以第一行显示4个
第二行：（21-4）/（5-1）=4.25，不为整，所以第二行显示4个
第三行：（21-4-4）/（5-1-1）=4.33，不为整，所以第三行显示4个
第四行：（21-4-4-4）/（5-1-1-1）=4.5，不为整，所以第四行显示4个
第五行：（21-4-4-4-4）/（5-1-1-1-1）=5，最后一行显示5个
假如需要打卡的天数为29天，那就是每行默认显示5个，29/5=5.8，不为整数，将5.8向下取整得到所需行数为5. 接下来计算每行展示的方块数量：
第一行：29/5=5.8，不为整，所以第一行显示5个
第二行：（29-5）/（5-1）=6，为整，所以剩下4行每行显示6个
/**
* 页面的初始数据
*/
data: {
height: 0,
complete: false, //是否打卡完成
times: 21, //总共打卡天数
list: [],
clock: 5, //打卡第几天
is_show_complete:0,
},
//这里页的需要优化
defaultColumn: function(){
let times = this.data.times
var column = 1
if (1 <= times && times < Math.pow(2,2)) {
column = 1
} else if (Math.pow(2,2) <= times && times < Math.pow(3,2)) {
column = 2
} else if (Math.pow(3,2) <= times && times < Math.pow(4,2)) {
column = 3
} else if (Math.pow(4,2) <= times && times < Math.pow(5,2)) {
column = 4
} else if (Math.pow(5,2) <= times && times < Math.pow(6,2)) {
column = 5
} else if (Math.pow(6,2) <= times && times < Math.pow(7,2)) {
column = 6
} else if (Math.pow(7,2) <= times && times < Math.pow(8,2)) {
column = 7
} else if (Math.pow(8,2) <= times && times < Math.pow(9,2)) {
column = 8
} else if (Math.pow(9,2) <= times && times < Math.pow(10,2)) {
column = 9
} else {
column = 10
}
return column;
},
getColumn: function(total, totalRow, column, row, ids){
let rowColumn = Math.floor(total / (totalRow - row))
if (rowColumn * column === total) {
for (let i = 0; i < rowColumn; i++) {
ids += rowColumn+","
}
return ids
} else {
const nTotal = total - rowColumn;
ids += rowColumn+","
if (nTotal > 0) {
ids = this.getColumn(nTotal, totalRow, column, row + 1, ids)
return ids
} else {
return ids
}
}
},
calculate: function(){
let times = this.data.times;
var list = []
if (times > 0) {
let column = this.defaultColumn();
let totalRow = Math.floor(times / column)
let ids = this.getColumn(times, totalRow, column, 0, "");
let tmp = ids.split(",");
var h = 100
if (tmp.length > 1) {
h = (100 / (tmp.length - 1)).toFixed(2)
}
let total = 0;
let clock = this.data.clock
for (var i = 0; i < tmp.length; i++) {
if (tmp[i] != "") {
list[i] = {}
list[i]['height'] = h
list[i]['row'] = []
let w = (100 / tmp[i]).toFixed(2)
for (var j = 0; j < tmp[i]; j++) {
total += 1
list[i]['row'][j] = {
width: w,
is_complete: total <= clock ? 1 : 0,
next: total == clock+1 ? 1 : 0
}
}
}
}
console.log(list)
}
this.setData({
list: list
})
}