Files
wx_pbzc/components/calendar-heatmap/calendar-heatmap.js
T
lc 8c7f633541 refactor: ES6+ modernization + 2 bugfixes
- var→const/let, function→arrow/class across all 13 JS files
- Timer: prototype→class with ES6 getters
- plan days: IIFE→Array.from declarative generation
- storage/plan: unified formatDate via util.js
- Bugfix: getPlanDay now filters by planId (plan switch accuracy)
- Bugfix: getTodayRecord searches all months (cross-month boundary)
- WXML/WXSS unchanged; public API unchanged
2026-06-04 16:29:25 +08:00

79 lines
2.0 KiB
JavaScript

const util = require('../../utils/util')
Component({
properties: {
year: { type: Number, value: new Date().getFullYear() },
month: { type: Number, value: new Date().getMonth() + 1 },
records: { type: Array, value: [] }
},
data: {
weeks: []
},
observers: {
'year, month, records'(year, month, records) {
this._compute(year, month, records)
}
},
lifetimes: {
ready() {
const { year, month, records } = this.properties
this._compute(year, month, records)
}
},
methods: {
_compute(year, month, records) {
const weeks = util.getMonthCalendar(year, month)
const recordMap = {}
if (records && records.length) {
records.forEach((r) => {
const d = parseInt(r.date.split('-')[2])
recordMap[d] = (recordMap[d] || 0) + r.duration
})
}
const data = weeks.map((week) =>
week.map((day) => {
if (!day) return null
const duration = recordMap[day] || 0
let color = 'transparent'
if (duration > 0) {
if (duration < 30) color = '#FFE0D0'
else if (duration < 60) color = '#FFB088'
else if (duration < 120) color = '#FF6B35'
else color = '#E05520'
}
return { day, duration, color }
})
)
this.setData({ weeks: data })
},
onDayTap(e) {
const day = e.currentTarget.dataset.day
if (!day) return
const cell = this.data.weeks.flat().find(c => c && c.day === day)
if (!cell || cell.duration <= 0) return
this.triggerEvent('daytap', {
year: this.properties.year,
month: this.properties.month,
day,
duration: cell.duration
})
},
getHeatColor(cell) {
if (!cell || cell.duration <= 0) return 'transparent'
const d = cell.duration
if (d < 30) return '#FFE0D0'
if (d < 60) return '#FFB088'
if (d < 120) return '#FF6B35'
return '#E05520'
}
}
})