index.js 9.8 KB

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