base.js 8.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274
  1. /**
  2. * @Author: drfu*
  3. * @Description: 基础功能
  4. * @Date: 2020-10-08 21:22:09*
  5. * @Last Modified by: drfu
  6. * @Last Modified time: 2020-10-11 13:28:52
  7. * */
  8. import { calcJumpData } from '../../core'
  9. import { renderCalendar } from '../../render'
  10. import {
  11. dateUtil,
  12. getCalendarData,
  13. setCalendarData,
  14. getCalendarConfig
  15. } from '../../utils/index'
  16. export default () => {
  17. return {
  18. name: 'base',
  19. beforeRender(calendarData = {}, calendarConfig) {
  20. const calendar = calendarData
  21. const { selectedDates = [], dates } = calendar
  22. let _dates = [...dates]
  23. if (selectedDates.length) {
  24. const selectedDatesStr = selectedDates.map(date =>
  25. dateUtil.toTimeStr(date)
  26. )
  27. _dates.forEach(date => {
  28. const dateStr = dateUtil.toTimeStr(date)
  29. if (selectedDatesStr.includes(dateStr)) {
  30. date.choosed = true
  31. }
  32. })
  33. }
  34. return {
  35. calendarData: {
  36. ...calendarData,
  37. dates: _dates
  38. },
  39. calendarConfig
  40. }
  41. },
  42. onTapDate(tapedDate, calendarData = {}, calendarConfig = {}) {
  43. const calendar = {
  44. ...calendarData
  45. }
  46. const dateIndex = dateUtil.findDateIndexInArray(
  47. tapedDate,
  48. calendarData.dates
  49. )
  50. const { multi, inverse } = calendarConfig
  51. let dates = [...calendar.dates]
  52. const { selectedDates = [] } = calendar
  53. if (!multi) {
  54. let preSelectedDate = {}
  55. if (selectedDates.length) {
  56. preSelectedDate = [...selectedDates].pop() || {}
  57. }
  58. if (!inverse && +preSelectedDate.date === +tapedDate.date) {
  59. return calendar
  60. }
  61. let _tapedDate = { ...tapedDate, choosed: !tapedDate.choosed }
  62. dates[dateIndex] = _tapedDate
  63. if (preSelectedDate.date) {
  64. const idx = dateUtil.findDateIndexInArray(preSelectedDate, dates)
  65. const date = dates[idx]
  66. if (date) {
  67. date.choosed = false
  68. }
  69. }
  70. if (dates[dateIndex].choosed) {
  71. calendar.selectedDates = [dates[dateIndex]]
  72. } else {
  73. calendar.selectedDates = []
  74. }
  75. } else {
  76. dates[dateIndex] = {
  77. ...dates[dateIndex],
  78. choosed: !dates[dateIndex].choosed
  79. }
  80. if (!calendar.selectedDates) {
  81. calendar.selectedDates = []
  82. }
  83. if (dates[dateIndex].choosed) {
  84. calendar.selectedDates.push(dates[dateIndex])
  85. } else {
  86. calendar.selectedDates = calendar.selectedDates.filter(
  87. date =>
  88. dateUtil.toTimeStr(date) !== dateUtil.toTimeStr(dates[dateIndex])
  89. )
  90. }
  91. }
  92. return {
  93. calendarData: {
  94. ...calendar,
  95. dates
  96. },
  97. calendarConfig
  98. }
  99. },
  100. onSwitchCalendar(date, calendarData = {}, component) {
  101. const calendarConfig = getCalendarConfig(component)
  102. if (calendarConfig.weekMode) {
  103. return calendarData
  104. }
  105. const updatedRenderData = calcJumpData({
  106. dateInfo: date,
  107. config: calendarConfig
  108. })
  109. return {
  110. ...calendarData,
  111. ...updatedRenderData
  112. }
  113. },
  114. methods(component) {
  115. return {
  116. jump: dateInfo => {
  117. if (Object.prototype.toString.call(dateInfo) !== '[object Object]')
  118. return
  119. const updatedRenderData = calcJumpData({
  120. dateInfo,
  121. component
  122. })
  123. const existCalendarData = getCalendarData('calendar', component)
  124. const config = getCalendarConfig(component)
  125. if (config.autoChoosedWhenJump) {
  126. const target = updatedRenderData.dates[dateInfo.date - 1]
  127. if (!updatedRenderData.selectedDates) {
  128. updatedRenderData.selectedDates = [target]
  129. } else {
  130. updatedRenderData.selectedDates.push(target)
  131. }
  132. }
  133. return renderCalendar.call(component, {
  134. ...existCalendarData,
  135. ...updatedRenderData
  136. })
  137. },
  138. getCalendarConfig() {
  139. return getCalendarConfig(component)
  140. },
  141. setCalendarConfig(config) {
  142. return new Promise((resolve, reject) => {
  143. if (!component || !component.config) {
  144. reject('异常:未找到组件配置信息')
  145. return
  146. }
  147. let conf = { ...component.config, ...config }
  148. component.config = conf
  149. setCalendarData('calendar.config', conf)
  150. })
  151. },
  152. cancelSelectedDates(cancelDates = []) {
  153. const existCalendarData = getCalendarData('calendar', component) || {}
  154. const { dates = [], selectedDates = [] } = existCalendarData
  155. let updatedRenderData = {}
  156. const config = getCalendarConfig(component)
  157. let chooseAreaData = {}
  158. if (config.chooseAreaMode) {
  159. chooseAreaData = {
  160. chooseAreaTimestamp: [],
  161. tempChooseAreaTimestamp: []
  162. }
  163. }
  164. if (!cancelDates.length) {
  165. dates.forEach(item => {
  166. item.choosed = false
  167. })
  168. updatedRenderData = {
  169. dates,
  170. selectedDates: []
  171. }
  172. } else {
  173. const cancelDatesStr = cancelDates.map(date =>
  174. dateUtil.toTimeStr(date)
  175. )
  176. const filterSelectedDates = selectedDates.filter(
  177. date => !cancelDatesStr.includes(dateUtil.toTimeStr(date))
  178. )
  179. dates.forEach(date => {
  180. if (cancelDatesStr.includes(dateUtil.toTimeStr(date))) {
  181. date.choosed = false
  182. }
  183. })
  184. updatedRenderData = {
  185. dates,
  186. selectedDates: filterSelectedDates
  187. }
  188. }
  189. return renderCalendar.call(component, {
  190. ...existCalendarData,
  191. ...updatedRenderData,
  192. ...chooseAreaData
  193. })
  194. },
  195. setSelectedDates: targetDates => {
  196. const existCalendarData = getCalendarData('calendar', component)
  197. let { dates, selectedDates = [] } = existCalendarData || {}
  198. let __selectedDates = []
  199. let __dates = dates
  200. if (!targetDates) {
  201. __dates = dates.map(item => {
  202. const date = { ...item }
  203. date.choosed = true
  204. if (existCalendarData.showLabelAlways && date.showTodoLabel) {
  205. date.showTodoLabel = true
  206. } else {
  207. date.showTodoLabel = false
  208. }
  209. return date
  210. })
  211. __selectedDates = dates
  212. } else if (targetDates && targetDates.length) {
  213. const allSelected = dateUtil.uniqueArrayByDate(
  214. selectedDates.concat(targetDates)
  215. )
  216. const allSelectedDateStr = allSelected.map(d =>
  217. dateUtil.toTimeStr(d)
  218. )
  219. __dates = dates.map(item => {
  220. const date = { ...item }
  221. if (allSelectedDateStr.includes(dateUtil.toTimeStr(date))) {
  222. date.choosed = true
  223. __selectedDates.push(date)
  224. }
  225. if (existCalendarData.showLabelAlways && date.showTodoLabel) {
  226. date.showTodoLabel = true
  227. } else {
  228. date.showTodoLabel = false
  229. }
  230. return date
  231. })
  232. }
  233. return renderCalendar.call(component, {
  234. ...existCalendarData,
  235. dates: __dates,
  236. selectedDates: __selectedDates
  237. })
  238. },
  239. setDateStyle: toSetDates => {
  240. if (!Array.isArray(toSetDates)) return Promise.reject()
  241. const existCalendarData = getCalendarData('calendar', component)
  242. const { dates = [], specialStyleDates } = existCalendarData || {}
  243. if (Array.isArray(specialStyleDates)) {
  244. toSetDates = dateUtil.uniqueArrayByDate([
  245. ...specialStyleDates,
  246. ...toSetDates
  247. ])
  248. }
  249. const toSetDatesStr = toSetDates.map(item => dateUtil.toTimeStr(item))
  250. const _dates = dates.map(item => {
  251. const idx = toSetDatesStr.indexOf(dateUtil.toTimeStr(item))
  252. if (idx > -1) {
  253. return {
  254. ...item,
  255. class: toSetDates[idx].class
  256. }
  257. } else {
  258. return item
  259. }
  260. })
  261. return renderCalendar.call(component, {
  262. ...existCalendarData,
  263. dates: _dates,
  264. specialStyleDates: toSetDates
  265. })
  266. }
  267. }
  268. }
  269. }
  270. }