|
|
import Day from './func/day' |
|
|
import Week from './func/week' |
|
|
import Todo from './func/todo' |
|
|
import WxData from './func/wxData' |
|
|
import Calendar from './func/render' |
|
|
import CalendarConfig from './func/config' |
|
|
import convertSolarLunar from './func/convertSolarLunar' |
|
|
import { |
|
|
Logger, |
|
|
GetDate, |
|
|
isComponent, |
|
|
initialTasks, |
|
|
getCurrentPage, |
|
|
getComponent, |
|
|
getDateTimeStamp |
|
|
} from './func/utils' |
|
|
|
|
|
let Component = {} |
|
|
let logger = new Logger() |
|
|
let getDate = new GetDate() |
|
|
let dataInstance = null |
|
|
|
|
|
/** |
|
|
* 全局赋值正在操作的组件实例，方便读/写各自的 data |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
function bindCurrentComponent(componentId) { |
|
|
if (componentId) { |
|
|
Component = getComponent(componentId) |
|
|
} |
|
|
return Component |
|
|
} |
|
|
|
|
|
/** |
|
|
* 获取日历内部数据 |
|
|
* @param {string} key 获取值的键名 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
function getData(key, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
dataInstance = new WxData(Component) |
|
|
return dataInstance.getData(key) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 设置日历内部数据 |
|
|
* @param {object}} data 待设置的数据 |
|
|
* @param {function} callback 设置成功回调函数 |
|
|
*/ |
|
|
function setData(data, callback = () => { |
|
|
}) { |
|
|
const dataInstance = new WxData(Component) |
|
|
return dataInstance.setData(data, callback) |
|
|
} |
|
|
|
|
|
const conf = { |
|
|
/** |
|
|
* 渲染日历 |
|
|
* @param {number} curYear |
|
|
* @param {number} curMonth |
|
|
* @param {number} curDate |
|
|
*/ |
|
|
renderCalendar(curYear, curMonth, curDate) { |
|
|
if (isComponent(this)) Component = this |
|
|
return new Promise((resolve, reject) => { |
|
|
Calendar(Component) |
|
|
.renderCalendar(curYear, curMonth, curDate) |
|
|
.then((info = {}) => { |
|
|
if (!info.firstRender) { |
|
|
return resolve({ |
|
|
year: curYear, |
|
|
month: curMonth, |
|
|
date: curDate |
|
|
}) |
|
|
} |
|
|
mountEventsOnPage(getCurrentPage()) |
|
|
Component.triggerEvent('afterCalendarRender', Component) |
|
|
Component.firstRender = true |
|
|
initialTasks.flag = 'finished' |
|
|
if (initialTasks.tasks.length) { |
|
|
initialTasks.tasks.shift()() |
|
|
} |
|
|
resolve({ |
|
|
year: curYear, |
|
|
month: curMonth, |
|
|
date: curDate |
|
|
}) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
/** |
|
|
* 当改变月份时触发 |
|
|
* @param {object} param |
|
|
*/ |
|
|
whenChangeDate({curYear, curMonth, newYear, newMonth}) { |
|
|
Component.triggerEvent('whenChangeMonth', { |
|
|
current: { |
|
|
year: curYear, |
|
|
month: curMonth |
|
|
}, |
|
|
next: { |
|
|
year: newYear, |
|
|
month: newMonth |
|
|
} |
|
|
}) |
|
|
}, |
|
|
/** |
|
|
* 多选 |
|
|
* @param {number} dateIdx 当前选中日期索引值 |
|
|
*/ |
|
|
whenMulitSelect(dateIdx) { |
|
|
if (isComponent(this)) Component = this |
|
|
const {calendar = {}} = getData() |
|
|
const {days, todoLabels} = calendar |
|
|
const config = CalendarConfig(Component).getCalendarConfig() |
|
|
let {selectedDay: selectedDays = []} = calendar |
|
|
const currentDay = days[dateIdx] |
|
|
if (!currentDay) return |
|
|
currentDay.choosed = !currentDay.choosed |
|
|
if (!currentDay.choosed) { |
|
|
currentDay.cancel = true // 该次点击是否为取消日期操作 |
|
|
const currentDayStr = getDate.toTimeStr(currentDay) |
|
|
selectedDays = selectedDays.filter( |
|
|
item => currentDayStr !== getDate.toTimeStr(item) |
|
|
) |
|
|
if (todoLabels) { |
|
|
todoLabels.forEach(item => { |
|
|
if (currentDayStr === getDate.toTimeStr(item)) { |
|
|
currentDay.showTodoLabel = true |
|
|
} |
|
|
}) |
|
|
} |
|
|
} else { |
|
|
currentDay.cancel = false |
|
|
const {showLabelAlways} = getData('calendar') |
|
|
if (showLabelAlways && currentDay.showTodoLabel) { |
|
|
currentDay.showTodoLabel = true |
|
|
} else { |
|
|
currentDay.showTodoLabel = false |
|
|
} |
|
|
if (!config.takeoverTap) { |
|
|
selectedDays.push(currentDay) |
|
|
} |
|
|
} |
|
|
if (config.takeoverTap) { |
|
|
return Component.triggerEvent('onTapDay', currentDay) |
|
|
} |
|
|
setData({ |
|
|
'calendar.days': days, |
|
|
'calendar.selectedDay': selectedDays |
|
|
}) |
|
|
conf.afterTapDay(currentDay, selectedDays) |
|
|
}, |
|
|
/** |
|
|
* 单选 |
|
|
* @param {number} dateIdx 当前选中日期索引值 |
|
|
*/ |
|
|
whenSingleSelect(dateIdx) { |
|
|
if (isComponent(this)) Component = this |
|
|
const {calendar = {}} = getData() |
|
|
const {days, selectedDay: selectedDays = [], todoLabels} = calendar |
|
|
let shouldMarkerTodoDay = [] |
|
|
const currentDay = days[dateIdx] |
|
|
if (!currentDay) return |
|
|
const preSelectedDate = [...selectedDays].pop() || {} |
|
|
const {month: dMonth, year: dYear} = days[0] || {} |
|
|
const config = CalendarConfig(Component).getCalendarConfig() |
|
|
if (config.takeoverTap) { |
|
|
return Component.triggerEvent('onTapDay', currentDay) |
|
|
} |
|
|
conf.afterTapDay(currentDay) |
|
|
if (!config.inverse && preSelectedDate.day === currentDay.day) return |
|
|
days.forEach((item, idx) => { |
|
|
if (+item.day === +preSelectedDate.day) days[idx].choosed = false |
|
|
}) |
|
|
if (todoLabels) { |
|
|
// 筛选当月待办事项的日期 |
|
|
shouldMarkerTodoDay = todoLabels.filter( |
|
|
item => +item.year === dYear && +item.month === dMonth |
|
|
) |
|
|
} |
|
|
Todo(Component).showTodoLabels(shouldMarkerTodoDay, days, selectedDays) |
|
|
const tmp = { |
|
|
'calendar.days': days |
|
|
} |
|
|
if (preSelectedDate.day !== currentDay.day) { |
|
|
preSelectedDate.choosed = false |
|
|
currentDay.choosed = true |
|
|
if (!calendar.showLabelAlways || !currentDay.showTodoLabel) { |
|
|
currentDay.showTodoLabel = false |
|
|
} |
|
|
tmp['calendar.selectedDay'] = [currentDay] |
|
|
} else if (config.inverse) { |
|
|
if (currentDay.choosed) { |
|
|
if (currentDay.showTodoLabel && calendar.showLabelAlways) { |
|
|
currentDay.showTodoLabel = true |
|
|
} else { |
|
|
currentDay.showTodoLabel = false |
|
|
} |
|
|
} |
|
|
tmp['calendar.selectedDay'] = [] |
|
|
} |
|
|
if (config.weekMode) { |
|
|
tmp['calendar.curYear'] = currentDay.year |
|
|
tmp['calendar.curMonth'] = currentDay.month |
|
|
} |
|
|
setData(tmp) |
|
|
}, |
|
|
gotoSetContinuousDates(start, end) { |
|
|
return chooseDateArea([ |
|
|
`${getDate.toTimeStr(start)}`, |
|
|
`${getDate.toTimeStr(end)}` |
|
|
]) |
|
|
}, |
|
|
timeRangeHelper(currentDate, selectedDay) { |
|
|
const currentDateTimestamp = getDateTimeStamp(currentDate) |
|
|
const startDate = selectedDay[0] |
|
|
let endDate |
|
|
let endDateTimestamp |
|
|
let selectedLen = selectedDay.length |
|
|
if (selectedLen > 1) { |
|
|
endDate = selectedDay[selectedLen - 1] |
|
|
endDateTimestamp = getDateTimeStamp(endDate) |
|
|
} |
|
|
const startTimestamp = getDateTimeStamp(startDate) |
|
|
return { |
|
|
endDate, |
|
|
startDate, |
|
|
currentDateTimestamp, |
|
|
endDateTimestamp, |
|
|
startTimestamp |
|
|
} |
|
|
}, |
|
|
/** |
|
|
* 计算连续日期选择的开始及结束日期 |
|
|
* @param {object} currentDate 当前选择日期 |
|
|
* @param {array} selectedDay 已选择的的日期 |
|
|
*/ |
|
|
calculateDateRange(currentDate, selectedDay) { |
|
|
const { |
|
|
endDate, |
|
|
startDate, |
|
|
currentDateTimestamp, |
|
|
endDateTimestamp, |
|
|
startTimestamp |
|
|
} = this.timeRangeHelper(currentDate, selectedDay) |
|
|
let range = [] |
|
|
let selectedLen = selectedDay.length |
|
|
const isWantToChooseOneDate = selectedDay.filter( |
|
|
item => getDate.toTimeStr(item) === getDate.toTimeStr(currentDate) |
|
|
) |
|
|
if (selectedLen === 2 && isWantToChooseOneDate.length) { |
|
|
range = [currentDate, currentDate] |
|
|
return range |
|
|
} |
|
|
if ( |
|
|
currentDateTimestamp >= startTimestamp && |
|
|
endDateTimestamp && |
|
|
currentDateTimestamp <= endDateTimestamp |
|
|
) { |
|
|
const currentDateIdxInChoosedDateArea = selectedDay.findIndex( |
|
|
item => getDate.toTimeStr(item) === getDate.toTimeStr(currentDate) |
|
|
) |
|
|
if (selectedLen / 2 > currentDateIdxInChoosedDateArea) { |
|
|
range = [currentDate, endDate] |
|
|
} else { |
|
|
range = [startDate, currentDate] |
|
|
} |
|
|
} else if (currentDateTimestamp < startTimestamp) { |
|
|
range = [currentDate, endDate] |
|
|
} else if (currentDateTimestamp > startTimestamp) { |
|
|
range = [startDate, currentDate] |
|
|
} |
|
|
return range |
|
|
}, |
|
|
chooseAreaWhenExistArea(currentDate, selectedDay) { |
|
|
return new Promise((resolve, reject) => { |
|
|
const range = conf.calculateDateRange( |
|
|
currentDate, |
|
|
getDate.sortDates(selectedDay) |
|
|
) |
|
|
conf |
|
|
.gotoSetContinuousDates(...range) |
|
|
.then(data => { |
|
|
resolve(data) |
|
|
conf.afterTapDay(currentDate) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
conf.afterTapDay(currentDate) |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
chooseAreaWhenHasOneDate(currentDate, selectedDay, lastChoosedDate) { |
|
|
return new Promise((resolve, reject) => { |
|
|
const startDate = lastChoosedDate || selectedDay[0] |
|
|
let range = [startDate, currentDate] |
|
|
const currentDateTimestamp = getDateTimeStamp(currentDate) |
|
|
const lastChoosedDateTimestamp = getDateTimeStamp(startDate) |
|
|
if (lastChoosedDateTimestamp > currentDateTimestamp) { |
|
|
range = [currentDate, startDate] |
|
|
} |
|
|
conf |
|
|
.gotoSetContinuousDates(...range) |
|
|
.then(data => { |
|
|
resolve(data) |
|
|
conf.afterTapDay(currentDate) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
conf.afterTapDay(currentDate) |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
/** |
|
|
* 日期范围选择模式 |
|
|
* @param {number} dateIdx 当前选中日期索引值 |
|
|
*/ |
|
|
whenChooseArea(dateIdx) { |
|
|
return new Promise((resolve, reject) => { |
|
|
if (isComponent(this)) Component = this |
|
|
if (Component.weekMode) return |
|
|
const {days = [], selectedDay, lastChoosedDate} = getData('calendar') |
|
|
const currentDate = days[dateIdx] |
|
|
if (currentDate.disable) return |
|
|
const config = CalendarConfig(Component).getCalendarConfig() |
|
|
if (config.takeoverTap) { |
|
|
return Component.triggerEvent('onTapDay', currentDate) |
|
|
} |
|
|
if (selectedDay && selectedDay.length > 1) { |
|
|
conf |
|
|
.chooseAreaWhenExistArea(currentDate, selectedDay) |
|
|
.then(dates => { |
|
|
resolve(dates) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
} else if (lastChoosedDate || (selectedDay && selectedDay.length === 1)) { |
|
|
conf |
|
|
.chooseAreaWhenHasOneDate(currentDate, selectedDay, lastChoosedDate) |
|
|
.then(dates => { |
|
|
resolve(dates) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
} else { |
|
|
days.forEach(date => { |
|
|
if (+date.day === +currentDate.day) { |
|
|
date.choosed = true |
|
|
} else { |
|
|
date.choosed = false |
|
|
} |
|
|
}) |
|
|
|
|
|
const dataInstance = new WxData(Component) |
|
|
dataInstance.setData({ |
|
|
'calendar.days': [...days], |
|
|
'calendar.lastChoosedDate': currentDate |
|
|
}) |
|
|
} |
|
|
}) |
|
|
}, |
|
|
/** |
|
|
* 点击日期后触发事件 |
|
|
* @param {object} currentSelected 当前选择的日期 |
|
|
* @param {array} selectedDates 多选状态下选中的日期 |
|
|
*/ |
|
|
afterTapDay(currentSelected, selectedDates) { |
|
|
const config = CalendarConfig(Component).getCalendarConfig() |
|
|
const {multi} = config |
|
|
if (!multi) { |
|
|
Component.triggerEvent('afterTapDay', currentSelected) |
|
|
} else { |
|
|
Component.triggerEvent('afterTapDay', { |
|
|
currentSelected, |
|
|
selectedDates |
|
|
}) |
|
|
} |
|
|
}, |
|
|
/** |
|
|
* 跳转至今天 |
|
|
*/ |
|
|
jumpToToday() { |
|
|
return new Promise((resolve, reject) => { |
|
|
const {year, month, date} = getDate.todayDate() |
|
|
const timestamp = getDate.todayTimestamp() |
|
|
const config = CalendarConfig(Component).getCalendarConfig() |
|
|
setData({ |
|
|
'calendar.curYear': year, |
|
|
'calendar.curMonth': month, |
|
|
'calendar.selectedDay': [ |
|
|
{ |
|
|
year: year, |
|
|
day: date, |
|
|
month: month, |
|
|
choosed: true, |
|
|
lunar: config.showLunar |
|
|
? convertSolarLunar.solar2lunar(year, month, date) |
|
|
: null |
|
|
} |
|
|
], |
|
|
'calendar.todayTimestamp': timestamp |
|
|
}) |
|
|
conf |
|
|
.renderCalendar(year, month, date) |
|
|
.then(() => { |
|
|
resolve({year, month, date}) |
|
|
}) |
|
|
.catch(() => { |
|
|
reject('jump failed') |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
export const whenChangeDate = conf.whenChangeDate |
|
|
export const renderCalendar = conf.renderCalendar |
|
|
export const whenSingleSelect = conf.whenSingleSelect |
|
|
export const whenChooseArea = conf.whenChooseArea |
|
|
export const whenMulitSelect = conf.whenMulitSelect |
|
|
export const calculatePrevWeekDays = conf.calculatePrevWeekDays |
|
|
export const calculateNextWeekDays = conf.calculateNextWeekDays |
|
|
|
|
|
/** |
|
|
* 获取当前年月 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function getCurrentYM(componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
return { |
|
|
year: getData('calendar.curYear'), |
|
|
month: getData('calendar.curMonth') |
|
|
} |
|
|
} |
|
|
|
|
|
/** |
|
|
* 获取已选择的日期 |
|
|
* @param {object } options 日期配置选项 {lunar} 是否返回农历信息 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function getSelectedDay(options = {}, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
const config = getCalendarConfig() |
|
|
const dates = getData('calendar.selectedDay') || [] |
|
|
if (options.lunar && !config.showLunar) { |
|
|
const datesWithLunar = getDate.convertLunar(dates) |
|
|
return datesWithLunar |
|
|
} else { |
|
|
return dates |
|
|
} |
|
|
} |
|
|
|
|
|
/** |
|
|
* 取消选中日期 |
|
|
* @param {array} dates 需要取消的日期，不传则取消所有已选择的日期 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function cancelSelectedDates(dates, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
const {days = [], selectedDay = []} = getData('calendar') || {} |
|
|
if (!dates || !dates.length) { |
|
|
days.forEach(item => { |
|
|
item.choosed = false |
|
|
}) |
|
|
setData({ |
|
|
'calendar.days': days, |
|
|
'calendar.selectedDay': [] |
|
|
}) |
|
|
} else { |
|
|
const cancelDatesStr = dates.map( |
|
|
date => `${+date.year}-${+date.month}-${+date.day}` |
|
|
) |
|
|
const filterSelectedDates = selectedDay.filter( |
|
|
date => |
|
|
!cancelDatesStr.includes(`${+date.year}-${+date.month}-${+date.day}`) |
|
|
) |
|
|
days.forEach(date => { |
|
|
if ( |
|
|
cancelDatesStr.includes(`${+date.year}-${+date.month}-${+date.day}`) |
|
|
) { |
|
|
date.choosed = false |
|
|
} |
|
|
}) |
|
|
setData({ |
|
|
'calendar.days': days, |
|
|
'calendar.selectedDay': filterSelectedDates |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
/** |
|
|
* 周视图跳转 |
|
|
* @param {object} date info |
|
|
* @param {boolean} disableSelected 跳转时是否需要选中，周视图切换调用该方法，如未选择日期时不选中日期 |
|
|
*/ |
|
|
function jumpWhenWeekMode({year, month, day}, disableSelected) { |
|
|
return new Promise((resolve, reject) => { |
|
|
Week(Component) |
|
|
.jump( |
|
|
{ |
|
|
year: +year, |
|
|
month: +month, |
|
|
day: +day |
|
|
}, |
|
|
disableSelected |
|
|
) |
|
|
.then(date => { |
|
|
resolve(date) |
|
|
Component.triggerEvent('afterCalendarRender', Component) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
Component.triggerEvent('afterCalendarRender', Component) |
|
|
}) |
|
|
}) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 月视图跳转 |
|
|
* @param {object} date info |
|
|
*/ |
|
|
function jumpWhenNormalMode({year, month, day}) { |
|
|
return new Promise((resolve, reject) => { |
|
|
if (typeof +year !== 'number' || typeof +month !== 'number') { |
|
|
return logger.warn('jump 函数年月日参数必须为数字') |
|
|
} |
|
|
const timestamp = getDate.todayTimestamp() |
|
|
let tmp = { |
|
|
'calendar.curYear': +year, |
|
|
'calendar.curMonth': +month, |
|
|
'calendar.todayTimestamp': timestamp |
|
|
} |
|
|
setData(tmp, () => { |
|
|
conf |
|
|
.renderCalendar(+year, +month, +day) |
|
|
.then(date => { |
|
|
resolve(date) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
}) |
|
|
}) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 跳转至指定日期 |
|
|
* @param {number} year |
|
|
* @param {number} month |
|
|
* @param {number} day |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function jump(year, month, day, componentId) { |
|
|
return new Promise((resolve, reject) => { |
|
|
bindCurrentComponent(componentId) |
|
|
const {selectedDay = []} = getData('calendar') || {} |
|
|
const {weekMode} = getData('calendarConfig') || {} |
|
|
const {year: y, month: m, day: d} = selectedDay[0] || {} |
|
|
if (+y === +year && +m === +month && +d === +day) { |
|
|
return |
|
|
} |
|
|
if (weekMode) { |
|
|
let disableSelected = false |
|
|
if (!year || !month || !day) { |
|
|
const today = getDate.todayDate() |
|
|
year = today.year |
|
|
month = today.month |
|
|
day = today.date |
|
|
disableSelected = true |
|
|
} |
|
|
jumpWhenWeekMode({year, month, day}, disableSelected) |
|
|
.then(date => { |
|
|
resolve(date) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
mountEventsOnPage(getCurrentPage()) |
|
|
return |
|
|
} |
|
|
if (year && month) { |
|
|
jumpWhenNormalMode({year, month, day}) |
|
|
.then(date => { |
|
|
resolve(date) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
} else { |
|
|
conf |
|
|
.jumpToToday() |
|
|
.then(date => { |
|
|
resolve(date) |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
} |
|
|
}) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 设置待办事项日期标记 |
|
|
* @param {object} todos 待办事项配置 |
|
|
* @param {string} [todos.pos] 标记显示位置，默认值'bottom' ['bottom', 'top'] |
|
|
* @param {string} [todos.dotColor] 标记点颜色，backgroundColor 支持的值都行 |
|
|
* @param {object[]} [todos.days] 需要标记的所有日期，如：[{year: 2015, month: 5, day: 12}]，其中年月日字段必填 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function setTodoLabels(todos, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
Todo(Component).setTodoLabels(todos) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 删除指定日期待办事项 |
|
|
* @param {array} todos 需要删除的待办日期数组 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function deleteTodoLabels(todos, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
Todo(Component).deleteTodoLabels(todos) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 清空所有待办事项 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function clearTodoLabels(componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
Todo(Component).clearTodoLabels() |
|
|
} |
|
|
|
|
|
/** |
|
|
* 获取所有待办事项 |
|
|
* @param {object } options 日期配置选项 {lunar} 是否返回农历信息 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function getTodoLabels(options = {}, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
const config = getCalendarConfig() |
|
|
const todoDates = Todo(Component).getTodoLabels() || [] |
|
|
if (options.lunar && !config.showLunar) { |
|
|
const todoDatesWithLunar = getDate.convertLunar(todoDates) |
|
|
return todoDatesWithLunar |
|
|
} else { |
|
|
return todoDates |
|
|
} |
|
|
} |
|
|
|
|
|
/** |
|
|
* 禁用指定日期 |
|
|
* @param {array} days 日期 |
|
|
* @param {number} [days.year] |
|
|
* @param {number} [days.month] |
|
|
* @param {number} [days.day] |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function disableDay(days = [], componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
Day(Component).disableDays(days) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 指定可选日期范围 |
|
|
* @param {array} area 日期访问数组 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function enableArea(area = [], componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
Day(Component).enableArea(area) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 指定特定日期可选 |
|
|
* @param {array} days 指定日期数组 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function enableDays(days = [], componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
Day(Component).enableDays(days) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 设置选中日期（多选模式下） |
|
|
* @param {array} selected 需选中日期 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function setSelectedDays(selected, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
Day(Component).setSelectedDays(selected) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 获取当前日历配置 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function getCalendarConfig(componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
return CalendarConfig(Component).getCalendarConfig() |
|
|
} |
|
|
|
|
|
/** |
|
|
* 设置日历配置 |
|
|
* @param {object} config |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function setCalendarConfig(config, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
if (!config || Object.keys(config).length === 0) { |
|
|
return logger.warn('setCalendarConfig 参数必须为非空对象') |
|
|
} |
|
|
const existConfig = getCalendarConfig() |
|
|
return new Promise((resolve, reject) => { |
|
|
CalendarConfig(Component) |
|
|
.setCalendarConfig(config) |
|
|
.then(conf => { |
|
|
resolve(conf) |
|
|
const {date, type} = existConfig.disableMode || {} |
|
|
const {_date, _type} = config.disableMode || {} |
|
|
if (type !== _type || date !== _date) { |
|
|
const {year, month} = getCurrentYM() |
|
|
jump(year, month) |
|
|
} |
|
|
}) |
|
|
.catch(err => { |
|
|
reject(err) |
|
|
}) |
|
|
}) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 获取当前日历面板日期 |
|
|
* @param {object } options 日期配置选项 {lunar} 是否返回农历信息 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function getCalendarDates(options = {}, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
const config = getCalendarConfig() |
|
|
const dates = getData('calendar.days', componentId) || [] |
|
|
if (options.lunar && !config.showLunar) { |
|
|
const datesWithLunar = getDate.convertLunar(dates) |
|
|
return datesWithLunar |
|
|
} else { |
|
|
return dates |
|
|
} |
|
|
} |
|
|
|
|
|
/** |
|
|
* 选择连续日期范围 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function chooseDateArea(dateArea, componentId) { |
|
|
bindCurrentComponent(componentId) |
|
|
return Day(Component).chooseArea(dateArea) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 设置指定日期样式 |
|
|
* @param {array} dates 待设置特殊样式的日期 |
|
|
* @param {string} componentId 要操作的日历组件ID |
|
|
*/ |
|
|
export function setDateStyle(dates, componentId) { |
|
|
if (!dates) return |
|
|
bindCurrentComponent(componentId) |
|
|
Day(Component).setDateStyle(dates) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 切换周月视图 |
|
|
* 切换视图时可传入指定日期，如: {year: 2019, month: 1, day: 3} |
|
|
* args[0] view 视图模式[week, month] |
|
|
* args[1]|args[2]为day object或者 componentId |
|
|
*/ |
|
|
export function switchView(...args) { |
|
|
return new Promise((resolve, reject) => { |
|
|
const view = args[0] |
|
|
if (!args[1]) { |
|
|
return Week(Component) |
|
|
.switchWeek(view) |
|
|
.then(resolve) |
|
|
.catch(reject) |
|
|
} |
|
|
if (typeof args[1] === 'string') { |
|
|
bindCurrentComponent(args[1], this) |
|
|
Week(Component) |
|
|
.switchWeek(view, args[2]) |
|
|
.then(resolve) |
|
|
.catch(reject) |
|
|
} else if (typeof args[1] === 'object') { |
|
|
if (typeof args[2] === 'string') { |
|
|
bindCurrentComponent(args[1], this) |
|
|
} |
|
|
Week(Component) |
|
|
.switchWeek(view, args[1]) |
|
|
.then(resolve) |
|
|
.catch(reject) |
|
|
} |
|
|
}) |
|
|
} |
|
|
|
|
|
/** |
|
|
* 绑定日历事件至当前页面实例 |
|
|
* @param {object} page 当前页面实例 |
|
|
*/ |
|
|
function mountEventsOnPage(page) { |
|
|
page.calendar = { |
|
|
jump, |
|
|
switchView, |
|
|
disableDay, |
|
|
enableArea, |
|
|
enableDays, |
|
|
chooseDateArea, |
|
|
getCurrentYM, |
|
|
getSelectedDay, |
|
|
cancelSelectedDates, |
|
|
setDateStyle, |
|
|
setTodoLabels, |
|
|
getTodoLabels, |
|
|
deleteTodoLabels, |
|
|
clearTodoLabels, |
|
|
setSelectedDays, |
|
|
getCalendarConfig, |
|
|
setCalendarConfig, |
|
|
getCalendarDates |
|
|
} |
|
|
} |
|
|
|
|
|
function setWeekHeader(firstDayOfWeek) { |
|
|
let weeksCh = ['日', '一', '二', '三', '四', '五', '六'] |
|
|
if (firstDayOfWeek === 'Mon') { |
|
|
weeksCh = ['一', '二', '三', '四', '五', '六', '日'] |
|
|
} |
|
|
setData({ |
|
|
'calendar.weeksCh': weeksCh |
|
|
}) |
|
|
} |
|
|
|
|
|
function autoSelectDay(defaultDay) { |
|
|
Component.firstRenderWeekMode = true |
|
|
if (defaultDay && typeof defaultDay === 'string') { |
|
|
const day = defaultDay.split('-') |
|
|
if (day.length < 3) { |
|
|
return logger.warn('配置 jumpTo 格式应为: 2018-4-2 或 2018-04-02') |
|
|
} |
|
|
jump(+day[0], +day[1], +day[2]) |
|
|
} else { |
|
|
if (!defaultDay) { |
|
|
Component.config.noDefault = true |
|
|
setData({ |
|
|
'config.noDefault': true |
|
|
}) |
|
|
} |
|
|
jump() |
|
|
} |
|
|
} |
|
|
|
|
|
function init(component, config) { |
|
|
initialTasks.flag = 'process' |
|
|
Component = component |
|
|
Component.config = config |
|
|
setWeekHeader(config.firstDayOfWeek) |
|
|
autoSelectDay(config.defaultDay) |
|
|
logger.tips( |
|
|
'使用中若遇问题请反馈至 https://github.com/treadpit/wx_calendar/issues ✍️' |
|
|
) |
|
|
} |
|
|
|
|
|
export default (component, config = {}) => { |
|
|
if (initialTasks.flag === 'process') { |
|
|
return initialTasks.tasks.push(function () { |
|
|
init(component, config) |
|
|
}) |
|
|
} |
|
|
init(component, config) |
|
|
}
|
|
|
|
