index.js 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343
  1. "use strict";
  2. var __spreadArray = (this && this.__spreadArray) || function (to, from) {
  3. for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
  4. to[j] = from[i];
  5. return to;
  6. };
  7. var __importDefault = (this && this.__importDefault) || function (mod) {
  8. return (mod && mod.__esModule) ? mod : { "default": mod };
  9. };
  10. Object.defineProperty(exports, "__esModule", { value: true });
  11. var component_1 = require("../common/component");
  12. var utils_1 = require("./utils");
  13. var toast_1 = __importDefault(require("../toast/toast"));
  14. var utils_2 = require("../common/utils");
  15. var initialMinDate = utils_1.getToday().getTime();
  16. var initialMaxDate = (function () {
  17. var now = utils_1.getToday();
  18. return new Date(now.getFullYear(), now.getMonth() + 6, now.getDate()).getTime();
  19. })();
  20. component_1.VantComponent({
  21. props: {
  22. title: {
  23. type: String,
  24. value: '日期选择',
  25. },
  26. color: String,
  27. show: {
  28. type: Boolean,
  29. observer: function (val) {
  30. if (val) {
  31. this.initRect();
  32. this.scrollIntoView();
  33. }
  34. },
  35. },
  36. formatter: null,
  37. confirmText: {
  38. type: String,
  39. value: '确定',
  40. },
  41. confirmDisabledText: {
  42. type: String,
  43. value: '确定',
  44. },
  45. rangePrompt: String,
  46. showRangePrompt: {
  47. type: Boolean,
  48. value: true,
  49. },
  50. defaultDate: {
  51. type: null,
  52. observer: function (val) {
  53. this.setData({ currentDate: val });
  54. this.scrollIntoView();
  55. },
  56. },
  57. allowSameDay: Boolean,
  58. type: {
  59. type: String,
  60. value: 'single',
  61. observer: 'reset',
  62. },
  63. minDate: {
  64. type: Number,
  65. value: initialMinDate,
  66. },
  67. maxDate: {
  68. type: Number,
  69. value: initialMaxDate,
  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(this.data.defaultDate),
  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({ subtitle: utils_1.formatMonthTitle(res.dataset.date) });
  156. }
  157. });
  158. },
  159. limitDateRange: function (date, minDate, maxDate) {
  160. if (minDate === void 0) { minDate = null; }
  161. if (maxDate === void 0) { maxDate = null; }
  162. minDate = minDate || this.data.minDate;
  163. maxDate = maxDate || this.data.maxDate;
  164. if (utils_1.compareDay(date, minDate) === -1) {
  165. return minDate;
  166. }
  167. if (utils_1.compareDay(date, maxDate) === 1) {
  168. return maxDate;
  169. }
  170. return date;
  171. },
  172. getInitialDate: function (defaultDate) {
  173. var _this = this;
  174. if (defaultDate === void 0) { defaultDate = null; }
  175. var _a = this.data, type = _a.type, minDate = _a.minDate, maxDate = _a.maxDate;
  176. var now = utils_1.getToday().getTime();
  177. if (type === 'range') {
  178. if (!Array.isArray(defaultDate)) {
  179. defaultDate = [];
  180. }
  181. var _b = defaultDate || [], startDay = _b[0], endDay = _b[1];
  182. var start = this.limitDateRange(startDay || now, minDate, utils_1.getPrevDay(new Date(maxDate)).getTime());
  183. var end = this.limitDateRange(endDay || now, utils_1.getNextDay(new Date(minDate)).getTime());
  184. return [start, end];
  185. }
  186. if (type === 'multiple') {
  187. if (Array.isArray(defaultDate)) {
  188. return defaultDate.map(function (date) { return _this.limitDateRange(date); });
  189. }
  190. return [this.limitDateRange(now)];
  191. }
  192. if (!defaultDate || Array.isArray(defaultDate)) {
  193. defaultDate = now;
  194. }
  195. return this.limitDateRange(defaultDate);
  196. },
  197. scrollIntoView: function () {
  198. var _this = this;
  199. utils_2.requestAnimationFrame(function () {
  200. var _a = _this.data, currentDate = _a.currentDate, type = _a.type, show = _a.show, poppable = _a.poppable, minDate = _a.minDate, maxDate = _a.maxDate;
  201. // @ts-ignore
  202. var targetDate = type === 'single' ? currentDate : currentDate[0];
  203. var displayed = show || !poppable;
  204. if (!targetDate || !displayed) {
  205. return;
  206. }
  207. var months = utils_1.getMonths(minDate, maxDate);
  208. months.some(function (month, index) {
  209. if (utils_1.compareMonth(month, targetDate) === 0) {
  210. _this.setData({ scrollIntoView: "month" + index });
  211. return true;
  212. }
  213. return false;
  214. });
  215. });
  216. },
  217. onOpen: function () {
  218. this.$emit('open');
  219. },
  220. onOpened: function () {
  221. this.$emit('opened');
  222. },
  223. onClose: function () {
  224. this.$emit('close');
  225. },
  226. onClosed: function () {
  227. this.$emit('closed');
  228. },
  229. onClickDay: function (event) {
  230. var date = event.detail.date;
  231. var _a = this.data, type = _a.type, currentDate = _a.currentDate, allowSameDay = _a.allowSameDay;
  232. if (type === 'range') {
  233. // @ts-ignore
  234. var startDay = currentDate[0], endDay = currentDate[1];
  235. if (startDay && !endDay) {
  236. var compareToStart = utils_1.compareDay(date, startDay);
  237. if (compareToStart === 1) {
  238. this.select([startDay, date], true);
  239. }
  240. else if (compareToStart === -1) {
  241. this.select([date, null]);
  242. }
  243. else if (allowSameDay) {
  244. this.select([date, date]);
  245. }
  246. }
  247. else {
  248. this.select([date, null]);
  249. }
  250. }
  251. else if (type === 'multiple') {
  252. var selectedIndex_1;
  253. // @ts-ignore
  254. var selected = currentDate.some(function (dateItem, index) {
  255. var equal = utils_1.compareDay(dateItem, date) === 0;
  256. if (equal) {
  257. selectedIndex_1 = index;
  258. }
  259. return equal;
  260. });
  261. if (selected) {
  262. // @ts-ignore
  263. var cancelDate = currentDate.splice(selectedIndex_1, 1);
  264. this.setData({ currentDate: currentDate });
  265. this.unselect(cancelDate);
  266. }
  267. else {
  268. // @ts-ignore
  269. this.select(__spreadArray(__spreadArray([], currentDate), [date]));
  270. }
  271. }
  272. else {
  273. this.select(date, true);
  274. }
  275. },
  276. unselect: function (dateArray) {
  277. var date = dateArray[0];
  278. if (date) {
  279. this.$emit('unselect', utils_1.copyDates(date));
  280. }
  281. },
  282. select: function (date, complete) {
  283. if (complete && this.data.type === 'range') {
  284. var valid = this.checkRange(date);
  285. if (!valid) {
  286. // auto selected to max range if showConfirm
  287. if (this.data.showConfirm) {
  288. this.emit([
  289. date[0],
  290. utils_1.getDayByOffset(date[0], this.data.maxRange - 1),
  291. ]);
  292. }
  293. else {
  294. this.emit(date);
  295. }
  296. return;
  297. }
  298. }
  299. this.emit(date);
  300. if (complete && !this.data.showConfirm) {
  301. this.onConfirm();
  302. }
  303. },
  304. emit: function (date) {
  305. var getTime = function (date) {
  306. return date instanceof Date ? date.getTime() : date;
  307. };
  308. this.setData({
  309. currentDate: Array.isArray(date) ? date.map(getTime) : getTime(date),
  310. });
  311. this.$emit('select', utils_1.copyDates(date));
  312. },
  313. checkRange: function (date) {
  314. var _a = this.data, maxRange = _a.maxRange, rangePrompt = _a.rangePrompt, showRangePrompt = _a.showRangePrompt;
  315. if (maxRange && utils_1.calcDateNum(date) > maxRange) {
  316. if (showRangePrompt) {
  317. toast_1.default({
  318. context: this,
  319. message: rangePrompt || "\u9009\u62E9\u5929\u6570\u4E0D\u80FD\u8D85\u8FC7 " + maxRange + " \u5929",
  320. });
  321. }
  322. this.$emit('over-range');
  323. return false;
  324. }
  325. return true;
  326. },
  327. onConfirm: function () {
  328. var _this = this;
  329. if (this.data.type === 'range' &&
  330. !this.checkRange(this.data.currentDate)) {
  331. return;
  332. }
  333. wx.nextTick(function () {
  334. // @ts-ignore
  335. _this.$emit('confirm', utils_1.copyDates(_this.data.currentDate));
  336. });
  337. },
  338. onClickSubtitle: function (event) {
  339. this.$emit('click-subtitle', event);
  340. },
  341. },
  342. });