index.js 8.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335
  1. 'use strict';
  2. var __spreadArray =
  3. (this && this.__spreadArray) ||
  4. function (to, from) {
  5. for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
  6. to[j] = from[i];
  7. return to;
  8. };
  9. var __importDefault =
  10. (this && this.__importDefault) ||
  11. function (mod) {
  12. return mod && mod.__esModule ? mod : { default: mod };
  13. };
  14. Object.defineProperty(exports, '__esModule', { value: true });
  15. var component_1 = require('../common/component');
  16. var utils_1 = require('./utils');
  17. var toast_1 = __importDefault(require('../toast/toast'));
  18. var utils_2 = require('../common/utils');
  19. component_1.VantComponent({
  20. props: {
  21. title: {
  22. type: String,
  23. value: '日期选择',
  24. },
  25. color: String,
  26. show: {
  27. type: Boolean,
  28. observer: function (val) {
  29. if (val) {
  30. this.initRect();
  31. this.scrollIntoView();
  32. }
  33. },
  34. },
  35. formatter: null,
  36. confirmText: {
  37. type: String,
  38. value: '确定',
  39. },
  40. rangePrompt: String,
  41. showRangePrompt: {
  42. type: Boolean,
  43. value: true,
  44. },
  45. defaultDate: {
  46. type: null,
  47. observer: function (val) {
  48. this.setData({ currentDate: val });
  49. this.scrollIntoView();
  50. },
  51. },
  52. allowSameDay: Boolean,
  53. confirmDisabledText: String,
  54. type: {
  55. type: String,
  56. value: 'single',
  57. observer: 'reset',
  58. },
  59. minDate: {
  60. type: null,
  61. value: Date.now(),
  62. },
  63. maxDate: {
  64. type: null,
  65. value: new Date(
  66. new Date().getFullYear(),
  67. new Date().getMonth() + 6,
  68. new Date().getDate()
  69. ).getTime(),
  70. },
  71. position: {
  72. type: String,
  73. value: 'bottom',
  74. },
  75. rowHeight: {
  76. type: null,
  77. value: utils_1.ROW_HEIGHT,
  78. },
  79. round: {
  80. type: Boolean,
  81. value: true,
  82. },
  83. poppable: {
  84. type: Boolean,
  85. value: true,
  86. },
  87. showMark: {
  88. type: Boolean,
  89. value: true,
  90. },
  91. showTitle: {
  92. type: Boolean,
  93. value: true,
  94. },
  95. showConfirm: {
  96. type: Boolean,
  97. value: true,
  98. },
  99. showSubtitle: {
  100. type: Boolean,
  101. value: true,
  102. },
  103. safeAreaInsetBottom: {
  104. type: Boolean,
  105. value: true,
  106. },
  107. closeOnClickOverlay: {
  108. type: Boolean,
  109. value: true,
  110. },
  111. maxRange: {
  112. type: null,
  113. value: null,
  114. },
  115. firstDayOfWeek: {
  116. type: Number,
  117. value: 0,
  118. },
  119. },
  120. data: {
  121. subtitle: '',
  122. currentDate: null,
  123. scrollIntoView: '',
  124. },
  125. created: function () {
  126. this.setData({
  127. currentDate: this.getInitialDate(),
  128. });
  129. },
  130. mounted: function () {
  131. if (this.data.show || !this.data.poppable) {
  132. this.initRect();
  133. this.scrollIntoView();
  134. }
  135. },
  136. methods: {
  137. reset: function () {
  138. this.setData({ currentDate: this.getInitialDate() });
  139. this.scrollIntoView();
  140. },
  141. initRect: function () {
  142. var _this = this;
  143. if (this.contentObserver != null) {
  144. this.contentObserver.disconnect();
  145. }
  146. var contentObserver = this.createIntersectionObserver({
  147. thresholds: [0, 0.1, 0.9, 1],
  148. observeAll: true,
  149. });
  150. this.contentObserver = contentObserver;
  151. contentObserver.relativeTo('.van-calendar__body');
  152. contentObserver.observe('.month', function (res) {
  153. if (res.boundingClientRect.top <= res.relativeRect.top) {
  154. // @ts-ignore
  155. _this.setData({
  156. subtitle: utils_1.formatMonthTitle(res.dataset.date),
  157. });
  158. }
  159. });
  160. },
  161. getInitialDate: function () {
  162. var _a = this.data,
  163. type = _a.type,
  164. defaultDate = _a.defaultDate,
  165. minDate = _a.minDate;
  166. if (type === 'range') {
  167. var _b = defaultDate || [],
  168. startDay = _b[0],
  169. endDay = _b[1];
  170. return [
  171. startDay || minDate,
  172. endDay || utils_1.getNextDay(new Date(minDate)).getTime(),
  173. ];
  174. }
  175. if (type === 'multiple') {
  176. return defaultDate || [minDate];
  177. }
  178. return defaultDate || minDate;
  179. },
  180. scrollIntoView: function () {
  181. var _this = this;
  182. utils_2.requestAnimationFrame(function () {
  183. var _a = _this.data,
  184. currentDate = _a.currentDate,
  185. type = _a.type,
  186. show = _a.show,
  187. poppable = _a.poppable,
  188. minDate = _a.minDate,
  189. maxDate = _a.maxDate;
  190. // @ts-ignore
  191. var targetDate = type === 'single' ? currentDate : currentDate[0];
  192. var displayed = show || !poppable;
  193. if (!targetDate || !displayed) {
  194. return;
  195. }
  196. var months = utils_1.getMonths(minDate, maxDate);
  197. months.some(function (month, index) {
  198. if (utils_1.compareMonth(month, targetDate) === 0) {
  199. _this.setData({ scrollIntoView: 'month' + index });
  200. return true;
  201. }
  202. return false;
  203. });
  204. });
  205. },
  206. onOpen: function () {
  207. this.$emit('open');
  208. },
  209. onOpened: function () {
  210. this.$emit('opened');
  211. },
  212. onClose: function () {
  213. this.$emit('close');
  214. },
  215. onClosed: function () {
  216. this.$emit('closed');
  217. },
  218. onClickDay: function (event) {
  219. var date = event.detail.date;
  220. var _a = this.data,
  221. type = _a.type,
  222. currentDate = _a.currentDate,
  223. allowSameDay = _a.allowSameDay;
  224. if (type === 'range') {
  225. // @ts-ignore
  226. var startDay = currentDate[0],
  227. endDay = currentDate[1];
  228. if (startDay && !endDay) {
  229. var compareToStart = utils_1.compareDay(date, startDay);
  230. if (compareToStart === 1) {
  231. this.select([startDay, date], true);
  232. } else if (compareToStart === -1) {
  233. this.select([date, null]);
  234. } else if (allowSameDay) {
  235. this.select([date, date]);
  236. }
  237. } else {
  238. this.select([date, null]);
  239. }
  240. } else if (type === 'multiple') {
  241. var selectedIndex_1;
  242. // @ts-ignore
  243. var selected = currentDate.some(function (dateItem, index) {
  244. var equal = utils_1.compareDay(dateItem, date) === 0;
  245. if (equal) {
  246. selectedIndex_1 = index;
  247. }
  248. return equal;
  249. });
  250. if (selected) {
  251. // @ts-ignore
  252. var cancelDate = currentDate.splice(selectedIndex_1, 1);
  253. this.setData({ currentDate: currentDate });
  254. this.unselect(cancelDate);
  255. } else {
  256. // @ts-ignore
  257. this.select(__spreadArray(__spreadArray([], currentDate), [date]));
  258. }
  259. } else {
  260. this.select(date, true);
  261. }
  262. },
  263. unselect: function (dateArray) {
  264. var date = dateArray[0];
  265. if (date) {
  266. this.$emit('unselect', utils_1.copyDates(date));
  267. }
  268. },
  269. select: function (date, complete) {
  270. if (complete && this.data.type === 'range') {
  271. var valid = this.checkRange(date);
  272. if (!valid) {
  273. // auto selected to max range if showConfirm
  274. if (this.data.showConfirm) {
  275. this.emit([
  276. date[0],
  277. utils_1.getDayByOffset(date[0], this.data.maxRange - 1),
  278. ]);
  279. } else {
  280. this.emit(date);
  281. }
  282. return;
  283. }
  284. }
  285. this.emit(date);
  286. if (complete && !this.data.showConfirm) {
  287. this.onConfirm();
  288. }
  289. },
  290. emit: function (date) {
  291. var getTime = function (date) {
  292. return date instanceof Date ? date.getTime() : date;
  293. };
  294. this.setData({
  295. currentDate: Array.isArray(date) ? date.map(getTime) : getTime(date),
  296. });
  297. this.$emit('select', utils_1.copyDates(date));
  298. },
  299. checkRange: function (date) {
  300. var _a = this.data,
  301. maxRange = _a.maxRange,
  302. rangePrompt = _a.rangePrompt,
  303. showRangePrompt = _a.showRangePrompt;
  304. if (maxRange && utils_1.calcDateNum(date) > maxRange) {
  305. if (showRangePrompt) {
  306. toast_1.default({
  307. duration: 0,
  308. context: this,
  309. message:
  310. rangePrompt ||
  311. '\u9009\u62E9\u5929\u6570\u4E0D\u80FD\u8D85\u8FC7 ' +
  312. maxRange +
  313. ' \u5929',
  314. });
  315. }
  316. this.$emit('over-range');
  317. return false;
  318. }
  319. return true;
  320. },
  321. onConfirm: function () {
  322. var _this = this;
  323. if (
  324. this.data.type === 'range' &&
  325. !this.checkRange(this.data.currentDate)
  326. ) {
  327. return;
  328. }
  329. wx.nextTick(function () {
  330. // @ts-ignore
  331. _this.$emit('confirm', utils_1.copyDates(_this.data.currentDate));
  332. });
  333. },
  334. },
  335. });