ui.calendar.views.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278
  1. /**
  2. * DevExtreme (ui/calendar/ui.calendar.views.js)
  3. * Version: 19.1.16
  4. * Build date: Tue Oct 18 2022
  5. *
  6. * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED
  7. * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/
  8. */
  9. "use strict";
  10. var _renderer = require("../../core/renderer");
  11. var _renderer2 = _interopRequireDefault(_renderer);
  12. var _uiCalendar = require("./ui.calendar.base_view");
  13. var _uiCalendar2 = _interopRequireDefault(_uiCalendar);
  14. var _common = require("../../core/utils/common");
  15. var _date = require("../../core/utils/date");
  16. var _extend = require("../../core/utils/extend");
  17. var _date2 = require("../../localization/date");
  18. var _date_serialization = require("../../core/utils/date_serialization");
  19. var _type = require("../../core/utils/type");
  20. function _interopRequireDefault(obj) {
  21. return obj && obj.__esModule ? obj : {
  22. "default": obj
  23. }
  24. }
  25. var CALENDAR_OTHER_MONTH_CLASS = "dx-calendar-other-month";
  26. var CALENDAR_OTHER_VIEW_CLASS = "dx-calendar-other-view";
  27. var Views = {
  28. month: _uiCalendar2.default.inherit({
  29. _getViewName: function() {
  30. return "month"
  31. },
  32. _getDefaultOptions: function() {
  33. return (0, _extend.extend)(this.callBase(), {
  34. firstDayOfWeek: void 0,
  35. rowCount: 6,
  36. colCount: 7
  37. })
  38. },
  39. _renderImpl: function() {
  40. this.callBase();
  41. this._renderHeader()
  42. },
  43. _renderBody: function() {
  44. this.callBase();
  45. this._$table.find(".".concat(CALENDAR_OTHER_VIEW_CLASS)).addClass(CALENDAR_OTHER_MONTH_CLASS)
  46. },
  47. _renderFocusTarget: _common.noop,
  48. getCellAriaLabel: function(date) {
  49. return (0, _date2.format)(date, "longdate")
  50. },
  51. _renderHeader: function() {
  52. var $headerRow = (0, _renderer2.default)("<tr>");
  53. var $header = (0, _renderer2.default)("<thead>").append($headerRow);
  54. this._$table.prepend($header);
  55. for (var colIndex = 0, colCount = this.option("colCount"); colIndex < colCount; colIndex++) {
  56. this._renderHeaderCell(colIndex, $headerRow)
  57. }
  58. },
  59. _renderHeaderCell: function(cellIndex, $headerRow) {
  60. var _this$_getDayCaption = this._getDayCaption(this._getFirstDayOfWeek() + cellIndex),
  61. fullCaption = _this$_getDayCaption.full,
  62. abbrCaption = _this$_getDayCaption.abbreviated;
  63. var $cell = (0, _renderer2.default)("<th>").attr({
  64. scope: "col",
  65. abbr: fullCaption
  66. }).text(abbrCaption);
  67. this._appendCell($headerRow, $cell)
  68. },
  69. getNavigatorCaption: function() {
  70. return (0, _date2.format)(this.option("date"), "monthandyear")
  71. },
  72. _isTodayCell: function(cellDate) {
  73. var today = new Date;
  74. return (0, _date.sameDate)(cellDate, today)
  75. },
  76. _isDateOutOfRange: function(cellDate) {
  77. var minDate = this.option("min");
  78. var maxDate = this.option("max");
  79. return !(0, _date.dateInRange)(cellDate, minDate, maxDate, "date")
  80. },
  81. _isOtherView: function(cellDate) {
  82. return cellDate.getMonth() !== this.option("date").getMonth()
  83. },
  84. _getCellText: function(cellDate) {
  85. return (0, _date2.format)(cellDate, "d")
  86. },
  87. _getDayCaption: function(day) {
  88. var daysInWeek = this.option("colCount");
  89. var dayIndex = day % daysInWeek;
  90. return {
  91. full: (0, _date2.getDayNames)()[dayIndex],
  92. abbreviated: (0, _date2.getDayNames)("abbreviated")[dayIndex]
  93. }
  94. },
  95. _getFirstCellData: function() {
  96. var firstDay = (0, _date.getFirstMonthDate)(this.option("date"));
  97. var firstMonthDayOffset = this._getFirstDayOfWeek() - firstDay.getDay();
  98. var daysInWeek = this.option("colCount");
  99. if (firstMonthDayOffset >= 0) {
  100. firstMonthDayOffset -= daysInWeek
  101. }
  102. firstDay.setDate(firstDay.getDate() + firstMonthDayOffset);
  103. return firstDay
  104. },
  105. _getNextCellData: function(date) {
  106. date = new Date(date);
  107. date.setDate(date.getDate() + 1);
  108. return date
  109. },
  110. _getFirstDayOfWeek: function() {
  111. return (0, _type.isDefined)(this.option("firstDayOfWeek")) ? this.option("firstDayOfWeek") : (0, _date2.firstDayOfWeekIndex)()
  112. },
  113. _getCellByDate: function(date) {
  114. return this._$table.find("td[data-value='".concat((0, _date_serialization.serializeDate)(date, (0, _date.getShortDateFormat)()), "']"))
  115. },
  116. isBoundary: function(date) {
  117. return (0, _date.sameMonthAndYear)(date, this.option("min")) || (0, _date.sameMonthAndYear)(date, this.option("max"))
  118. },
  119. _getDefaultDisabledDatesHandler: function(disabledDates) {
  120. return function(args) {
  121. var isDisabledDate = disabledDates.some(function(item) {
  122. return (0, _date.sameDate)(item, args.date)
  123. });
  124. if (isDisabledDate) {
  125. return true
  126. }
  127. }
  128. }
  129. }),
  130. year: _uiCalendar2.default.inherit({
  131. _getViewName: function() {
  132. return "year"
  133. },
  134. _isTodayCell: function(cellDate) {
  135. return (0, _date.sameMonthAndYear)(cellDate, new Date)
  136. },
  137. _isDateOutOfRange: function(cellDate) {
  138. return !(0, _date.dateInRange)(cellDate, (0, _date.getFirstMonthDate)(this.option("min")), (0, _date.getLastMonthDate)(this.option("max")))
  139. },
  140. _isOtherView: function() {
  141. return false
  142. },
  143. _getCellText: function(cellDate) {
  144. return (0, _date2.getMonthNames)("abbreviated")[cellDate.getMonth()]
  145. },
  146. _getFirstCellData: function() {
  147. var data = new Date(this.option("date"));
  148. data.setDate(1);
  149. data.setMonth(0);
  150. return data
  151. },
  152. _getNextCellData: function(date) {
  153. date = new Date(date);
  154. date.setMonth(date.getMonth() + 1);
  155. return date
  156. },
  157. _getCellByDate: function(date) {
  158. var foundDate = new Date(date);
  159. foundDate.setDate(1);
  160. return this._$table.find("td[data-value='".concat((0, _date_serialization.serializeDate)(foundDate, (0, _date.getShortDateFormat)()), "']"))
  161. },
  162. getCellAriaLabel: function(date) {
  163. return (0, _date2.format)(date, "monthandyear")
  164. },
  165. getNavigatorCaption: function() {
  166. return (0, _date2.format)(this.option("date"), "yyyy")
  167. },
  168. isBoundary: function(date) {
  169. return (0, _date.sameYear)(date, this.option("min")) || (0, _date.sameYear)(date, this.option("max"))
  170. }
  171. }),
  172. decade: _uiCalendar2.default.inherit({
  173. _getViewName: function() {
  174. return "decade"
  175. },
  176. _isTodayCell: function(cellDate) {
  177. return (0, _date.sameYear)(cellDate, new Date)
  178. },
  179. _isDateOutOfRange: function(cellDate) {
  180. var min = this.option("min");
  181. var max = this.option("max");
  182. return !(0, _date.dateInRange)(cellDate.getFullYear(), min && min.getFullYear(), max && max.getFullYear())
  183. },
  184. _isOtherView: function(cellDate) {
  185. var date = new Date(cellDate);
  186. date.setMonth(1);
  187. return !(0, _date.sameDecade)(date, this.option("date"))
  188. },
  189. _getCellText: function(cellDate) {
  190. return (0, _date2.format)(cellDate, "yyyy")
  191. },
  192. _getFirstCellData: function() {
  193. var year = (0, _date.getFirstYearInDecade)(this.option("date")) - 1;
  194. return new Date(year, 0, 1)
  195. },
  196. _getNextCellData: function(date) {
  197. date = new Date(date);
  198. date.setFullYear(date.getFullYear() + 1);
  199. return date
  200. },
  201. getNavigatorCaption: function() {
  202. var currentDate = this.option("date");
  203. var firstYearInDecade = (0, _date.getFirstYearInDecade)(currentDate);
  204. var startDate = new Date(currentDate);
  205. var endDate = new Date(currentDate);
  206. startDate.setFullYear(firstYearInDecade);
  207. endDate.setFullYear(firstYearInDecade + 9);
  208. return (0, _date2.format)(startDate, "yyyy") + "-" + (0, _date2.format)(endDate, "yyyy")
  209. },
  210. _isValueOnCurrentView: function(currentDate, value) {
  211. return (0, _date.sameDecade)(currentDate, value)
  212. },
  213. _getCellByDate: function(date) {
  214. var foundDate = new Date(date);
  215. foundDate.setDate(1);
  216. foundDate.setMonth(0);
  217. return this._$table.find("td[data-value='".concat((0, _date_serialization.serializeDate)(foundDate, (0, _date.getShortDateFormat)()), "']"))
  218. },
  219. isBoundary: function(date) {
  220. return (0, _date.sameDecade)(date, this.option("min")) || (0, _date.sameDecade)(date, this.option("max"))
  221. }
  222. }),
  223. century: _uiCalendar2.default.inherit({
  224. _getViewName: function() {
  225. return "century"
  226. },
  227. _isTodayCell: function(cellDate) {
  228. return (0, _date.sameDecade)(cellDate, new Date)
  229. },
  230. _isDateOutOfRange: function(cellDate) {
  231. var decade = (0, _date.getFirstYearInDecade)(cellDate);
  232. var minDecade = (0, _date.getFirstYearInDecade)(this.option("min"));
  233. var maxDecade = (0, _date.getFirstYearInDecade)(this.option("max"));
  234. return !(0, _date.dateInRange)(decade, minDecade, maxDecade)
  235. },
  236. _isOtherView: function(cellDate) {
  237. var date = new Date(cellDate);
  238. date.setMonth(1);
  239. return !(0, _date.sameCentury)(date, this.option("date"))
  240. },
  241. _getCellText: function(cellDate) {
  242. var startDate = (0, _date2.format)(cellDate, "yyyy");
  243. var endDate = new Date(cellDate);
  244. endDate.setFullYear(endDate.getFullYear() + 9);
  245. return startDate + " - " + (0, _date2.format)(endDate, "yyyy")
  246. },
  247. _getFirstCellData: function() {
  248. var decade = (0, _date.getFirstDecadeInCentury)(this.option("date")) - 10;
  249. return new Date(decade, 0, 1)
  250. },
  251. _getNextCellData: function(date) {
  252. date = new Date(date);
  253. date.setFullYear(date.getFullYear() + 10);
  254. return date
  255. },
  256. _getCellByDate: function(date) {
  257. var foundDate = new Date(date);
  258. foundDate.setDate(1);
  259. foundDate.setMonth(0);
  260. foundDate.setFullYear((0, _date.getFirstYearInDecade)(foundDate));
  261. return this._$table.find("td[data-value='".concat((0, _date_serialization.serializeDate)(foundDate, (0, _date.getShortDateFormat)()), "']"))
  262. },
  263. getNavigatorCaption: function() {
  264. var currentDate = this.option("date");
  265. var firstDecadeInCentury = (0, _date.getFirstDecadeInCentury)(currentDate);
  266. var startDate = new Date(currentDate);
  267. var endDate = new Date(currentDate);
  268. startDate.setFullYear(firstDecadeInCentury);
  269. endDate.setFullYear(firstDecadeInCentury + 99);
  270. return (0, _date2.format)(startDate, "yyyy") + "-" + (0, _date2.format)(endDate, "yyyy")
  271. },
  272. isBoundary: function(date) {
  273. return (0, _date.sameCentury)(date, this.option("min")) || (0, _date.sameCentury)(date, this.option("max"))
  274. }
  275. })
  276. };
  277. module.exports = Views;