first

node_modules/vant/lib/calendar/components/Month.js

@@ -0,0 +1,343 @@
+"use strict";
+
+exports.__esModule = true;
+exports.default = void 0;
+
+var _utils = require("../../utils");
+
+var _scroll = require("../../utils/dom/scroll");
+
+var _utils2 = require("../utils");
+
+var _utils3 = require("../../datetime-picker/utils");
+
+var _createNamespace = (0, _utils.createNamespace)('calendar-month'),
+    createComponent = _createNamespace[0];
+
+var _default = createComponent({
+  props: {
+    date: Date,
+    type: String,
+    color: String,
+    minDate: Date,
+    maxDate: Date,
+    showMark: Boolean,
+    rowHeight: [Number, String],
+    formatter: Function,
+    lazyRender: Boolean,
+    currentDate: [Date, Array],
+    allowSameDay: Boolean,
+    showSubtitle: Boolean,
+    showMonthTitle: Boolean,
+    firstDayOfWeek: Number
+  },
+  data: function data() {
+    return {
+      visible: false
+    };
+  },
+  computed: {
+    title: function title() {
+      return (0, _utils2.formatMonthTitle)(this.date);
+    },
+    rowHeightWithUnit: function rowHeightWithUnit() {
+      return (0, _utils.addUnit)(this.rowHeight);
+    },
+    offset: function offset() {
+      var firstDayOfWeek = this.firstDayOfWeek;
+      var realDay = this.date.getDay();
+
+      if (!firstDayOfWeek) {
+        return realDay;
+      }
+
+      return (realDay + 7 - this.firstDayOfWeek) % 7;
+    },
+    totalDay: function totalDay() {
+      return (0, _utils3.getMonthEndDay)(this.date.getFullYear(), this.date.getMonth() + 1);
+    },
+    shouldRender: function shouldRender() {
+      return this.visible || !this.lazyRender;
+    },
+    placeholders: function placeholders() {
+      var rows = [];
+      var count = Math.ceil((this.totalDay + this.offset) / 7);
+
+      for (var day = 1; day <= count; day++) {
+        rows.push({
+          type: 'placeholder'
+        });
+      }
+
+      return rows;
+    },
+    days: function days() {
+      var days = [];
+      var year = this.date.getFullYear();
+      var month = this.date.getMonth();
+
+      for (var day = 1; day <= this.totalDay; day++) {
+        var date = new Date(year, month, day);
+        var type = this.getDayType(date);
+        var config = {
+          date: date,
+          type: type,
+          text: day,
+          bottomInfo: this.getBottomInfo(type)
+        };
+
+        if (this.formatter) {
+          config = this.formatter(config);
+        }
+
+        days.push(config);
+      }
+
+      return days;
+    }
+  },
+  methods: {
+    getHeight: function getHeight() {
+      var _this$$el;
+
+      return ((_this$$el = this.$el) == null ? void 0 : _this$$el.getBoundingClientRect().height) || 0;
+    },
+    scrollIntoView: function scrollIntoView(body) {
+      var _this$$refs = this.$refs,
+          days = _this$$refs.days,
+          month = _this$$refs.month;
+      var el = this.showSubtitle ? days : month;
+      var scrollTop = el.getBoundingClientRect().top - body.getBoundingClientRect().top + body.scrollTop;
+      (0, _scroll.setScrollTop)(body, scrollTop);
+    },
+    getMultipleDayType: function getMultipleDayType(day) {
+      var _this = this;
+
+      var isSelected = function isSelected(date) {
+        return _this.currentDate.some(function (item) {
+          return (0, _utils2.compareDay)(item, date) === 0;
+        });
+      };
+
+      if (isSelected(day)) {
+        var prevDay = (0, _utils2.getPrevDay)(day);
+        var nextDay = (0, _utils2.getNextDay)(day);
+        var prevSelected = isSelected(prevDay);
+        var nextSelected = isSelected(nextDay);
+
+        if (prevSelected && nextSelected) {
+          return 'multiple-middle';
+        }
+
+        if (prevSelected) {
+          return 'end';
+        }
+
+        return nextSelected ? 'start' : 'multiple-selected';
+      }
+
+      return '';
+    },
+    getRangeDayType: function getRangeDayType(day) {
+      var _this$currentDate = this.currentDate,
+          startDay = _this$currentDate[0],
+          endDay = _this$currentDate[1];
+
+      if (!startDay) {
+        return '';
+      }
+
+      var compareToStart = (0, _utils2.compareDay)(day, startDay);
+
+      if (!endDay) {
+        return compareToStart === 0 ? 'start' : '';
+      }
+
+      var compareToEnd = (0, _utils2.compareDay)(day, endDay);
+
+      if (compareToStart === 0 && compareToEnd === 0 && this.allowSameDay) {
+        return 'start-end';
+      }
+
+      if (compareToStart === 0) {
+        return 'start';
+      }
+
+      if (compareToEnd === 0) {
+        return 'end';
+      }
+
+      if (compareToStart > 0 && compareToEnd < 0) {
+        return 'middle';
+      }
+    },
+    getDayType: function getDayType(day) {
+      var type = this.type,
+          minDate = this.minDate,
+          maxDate = this.maxDate,
+          currentDate = this.currentDate;
+
+      if ((0, _utils2.compareDay)(day, minDate) < 0 || (0, _utils2.compareDay)(day, maxDate) > 0) {
+        return 'disabled';
+      }
+
+      if (currentDate === null) {
+        return;
+      }
+
+      if (type === 'single') {
+        return (0, _utils2.compareDay)(day, currentDate) === 0 ? 'selected' : '';
+      }
+
+      if (type === 'multiple') {
+        return this.getMultipleDayType(day);
+      }
+      /* istanbul ignore else */
+
+
+      if (type === 'range') {
+        return this.getRangeDayType(day);
+      }
+    },
+    getBottomInfo: function getBottomInfo(type) {
+      if (this.type === 'range') {
+        if (type === 'start' || type === 'end') {
+          return (0, _utils2.t)(type);
+        }
+
+        if (type === 'start-end') {
+          return (0, _utils2.t)('startEnd');
+        }
+      }
+    },
+    getDayStyle: function getDayStyle(type, index) {
+      var style = {
+        height: this.rowHeightWithUnit
+      };
+
+      if (type === 'placeholder') {
+        style.width = '100%';
+        return style;
+      }
+
+      if (index === 0) {
+        style.marginLeft = 100 * this.offset / 7 + "%";
+      }
+
+      if (this.color) {
+        if (type === 'start' || type === 'end' || type === 'start-end' || type === 'multiple-selected' || type === 'multiple-middle') {
+          style.background = this.color;
+        } else if (type === 'middle') {
+          style.color = this.color;
+        }
+      }
+
+      return style;
+    },
+    genTitle: function genTitle() {
+      var h = this.$createElement;
+
+      if (this.showMonthTitle) {
+        return h("div", {
+          "class": (0, _utils2.bem)('month-title')
+        }, [this.title]);
+      }
+    },
+    genMark: function genMark() {
+      var h = this.$createElement;
+
+      if (this.showMark && this.shouldRender) {
+        return h("div", {
+          "class": (0, _utils2.bem)('month-mark')
+        }, [this.date.getMonth() + 1]);
+      }
+    },
+    genDays: function genDays() {
+      var h = this.$createElement;
+      var days = this.shouldRender ? this.days : this.placeholders;
+      return h("div", {
+        "ref": "days",
+        "attrs": {
+          "role": "grid"
+        },
+        "class": (0, _utils2.bem)('days')
+      }, [this.genMark(), days.map(this.genDay)]);
+    },
+    genTopInfo: function genTopInfo(item) {
+      var h = this.$createElement;
+      var slot = this.$scopedSlots['top-info'];
+
+      if (item.topInfo || slot) {
+        return h("div", {
+          "class": (0, _utils2.bem)('top-info')
+        }, [slot ? slot(item) : item.topInfo]);
+      }
+    },
+    genBottomInfo: function genBottomInfo(item) {
+      var h = this.$createElement;
+      var slot = this.$scopedSlots['bottom-info'];
+
+      if (item.bottomInfo || slot) {
+        return h("div", {
+          "class": (0, _utils2.bem)('bottom-info')
+        }, [slot ? slot(item) : item.bottomInfo]);
+      }
+    },
+    genDay: function genDay(item, index) {
+      var _this2 = this;
+
+      var h = this.$createElement;
+      var type = item.type;
+      var style = this.getDayStyle(type, index);
+      var disabled = type === 'disabled';
+
+      var onClick = function onClick() {
+        if (!disabled) {
+          _this2.$emit('click', item);
+        }
+      };
+
+      if (type === 'selected') {
+        return h("div", {
+          "attrs": {
+            "role": "gridcell",
+            "tabindex": -1
+          },
+          "style": style,
+          "class": [(0, _utils2.bem)('day'), item.className],
+          "on": {
+            "click": onClick
+          }
+        }, [h("div", {
+          "class": (0, _utils2.bem)('selected-day'),
+          "style": {
+            width: this.rowHeightWithUnit,
+            height: this.rowHeightWithUnit,
+            background: this.color
+          }
+        }, [this.genTopInfo(item), item.text, this.genBottomInfo(item)])]);
+      }
+
+      return h("div", {
+        "attrs": {
+          "role": "gridcell",
+          "tabindex": disabled ? null : -1
+        },
+        "style": style,
+        "class": [(0, _utils2.bem)('day', type), item.className],
+        "on": {
+          "click": onClick
+        }
+      }, [this.genTopInfo(item), item.text, this.genBottomInfo(item)]);
+    }
+  },
+  render: function render() {
+    var h = arguments[0];
+    return h("div", {
+      "class": (0, _utils2.bem)('month'),
+      "ref": "month"
+    }, [this.genTitle(), this.genDays()]);
+  }
+});
+
+exports.default = _default;