element-nice-ui
Version:
A Component Library for Vue.js.
1,361 lines (1,299 loc) • 185 kB
JavaScript
module.exports =
/******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/dist/";
/******/
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 182);
/******/ })
/************************************************************************/
/******/ ({
/***/ 13:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/mixins/emitter");
/***/ }),
/***/ 17:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/utils/vue-popper");
/***/ }),
/***/ 18:
/***/ (function(module, exports) {
module.exports = require("vue");
/***/ }),
/***/ 182:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);
// EXTERNAL MODULE: ./packages/date-picker/src/picker.vue + 4 modules
var picker = __webpack_require__(73);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/date-picker/src/panel/date.vue?vue&type=template&id=12078611
var render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"transition",
{
attrs: { name: "el-zoom-in-top" },
on: { "after-enter": _vm.handleEnter, "after-leave": _vm.handleLeave },
},
[
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.visible,
expression: "visible",
},
],
staticClass: "el-picker-panel el-date-picker el-popper",
class: [
{
"has-sidebar": _vm.$slots.sidebar || _vm.shortcuts,
"has-time": _vm.showTime,
},
_vm.popperClass,
],
},
[
_c(
"div",
{ staticClass: "el-picker-panel__body-wrapper" },
[
_vm._t("sidebar"),
_vm.shortcuts
? _c(
"div",
{ staticClass: "el-picker-panel__sidebar" },
_vm._l(_vm.shortcuts, function (shortcut, key) {
return _c(
"button",
{
key: key,
staticClass: "el-picker-panel__shortcut",
attrs: { type: "button" },
on: {
click: function ($event) {
return _vm.handleShortcutClick(shortcut)
},
},
},
[_vm._v(_vm._s(shortcut.text))]
)
}),
0
)
: _vm._e(),
_c("div", { staticClass: "el-picker-panel__body" }, [
_vm.showTime
? _c("div", { staticClass: "el-date-picker__time-header" }, [
_c(
"span",
{ staticClass: "el-date-picker__editor-wrap" },
[
_c("el-input", {
attrs: {
placeholder: _vm.t("el.datepicker.selectDate"),
value: _vm.visibleDate,
size: "small",
clearable: false,
},
on: {
input: (val) => (_vm.userInputDate = val),
change: _vm.handleVisibleDateChange,
},
}),
],
1
),
_c(
"span",
{
directives: [
{
name: "clickoutside",
rawName: "v-clickoutside",
value: _vm.handleTimePickClose,
expression: "handleTimePickClose",
},
],
staticClass: "el-date-picker__editor-wrap",
},
[
_c("el-input", {
ref: "input",
attrs: {
placeholder: _vm.t("el.datepicker.selectTime"),
value: _vm.visibleTime,
size: "small",
clearable: false,
},
on: {
focus: function ($event) {
_vm.timePickerVisible = true
},
input: (val) => (_vm.userInputTime = val),
change: _vm.handleVisibleTimeChange,
},
}),
_c("time-picker", {
ref: "timepicker",
attrs: {
"time-arrow-control": _vm.arrowControl,
visible: _vm.timePickerVisible,
},
on: {
pick: _vm.handleTimePick,
mounted: _vm.proxyTimePickerDataProperties,
},
}),
],
1
),
])
: _vm._e(),
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.currentView !== "time",
expression: "currentView !== 'time'",
},
],
staticClass: "el-date-picker__header",
class: {
"el-date-picker__header--bordered":
_vm.currentView === "year" ||
_vm.currentView === "month",
},
},
[
_c("button", {
staticClass:
"el-picker-panel__icon-btn el-date-picker__prev-btn el-icon-d-arrow-left",
attrs: {
type: "button",
"aria-label": _vm.t(`el.datepicker.prevYear`),
},
on: { click: _vm.prevYear },
}),
_c("button", {
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.currentView === "date",
expression: "currentView === 'date'",
},
],
staticClass:
"el-picker-panel__icon-btn el-date-picker__prev-btn el-icon-arrow-left",
attrs: {
type: "button",
"aria-label": _vm.t(`el.datepicker.prevMonth`),
},
on: { click: _vm.prevMonth },
}),
_c(
"span",
{
staticClass: "el-date-picker__header-label",
attrs: { role: "button" },
on: { click: _vm.showYearPicker },
},
[_vm._v(_vm._s(_vm.yearLabel))]
),
_c(
"span",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.currentView === "date",
expression: "currentView === 'date'",
},
],
staticClass: "el-date-picker__header-label",
class: { active: _vm.currentView === "month" },
attrs: { role: "button" },
on: { click: _vm.showMonthPicker },
},
[
_vm._v(
_vm._s(_vm.t(`el.datepicker.month${_vm.month + 1}`))
),
]
),
_c("button", {
staticClass:
"el-picker-panel__icon-btn el-date-picker__next-btn el-icon-d-arrow-right",
attrs: {
type: "button",
"aria-label": _vm.t(`el.datepicker.nextYear`),
},
on: { click: _vm.nextYear },
}),
_c("button", {
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.currentView === "date",
expression: "currentView === 'date'",
},
],
staticClass:
"el-picker-panel__icon-btn el-date-picker__next-btn el-icon-arrow-right",
attrs: {
type: "button",
"aria-label": _vm.t(`el.datepicker.nextMonth`),
},
on: { click: _vm.nextMonth },
}),
]
),
_c(
"div",
{ staticClass: "el-picker-panel__content" },
[
_c("date-table", {
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.currentView === "date",
expression: "currentView === 'date'",
},
],
attrs: {
"selection-mode": _vm.selectionMode,
"first-day-of-week": _vm.firstDayOfWeek,
value: _vm.value,
"default-value": _vm.defaultValue
? new Date(_vm.defaultValue)
: null,
date: _vm.date,
"cell-class-name": _vm.cellClassName,
"disabled-date": _vm.disabledDate,
},
on: { pick: _vm.handleDatePick },
}),
_c("year-table", {
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.currentView === "year",
expression: "currentView === 'year'",
},
],
attrs: {
value: _vm.value,
"default-value": _vm.defaultValue
? new Date(_vm.defaultValue)
: null,
date: _vm.date,
"disabled-date": _vm.disabledDate,
},
on: { pick: _vm.handleYearPick },
}),
_c("month-table", {
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.currentView === "month",
expression: "currentView === 'month'",
},
],
attrs: {
value: _vm.value,
"default-value": _vm.defaultValue
? new Date(_vm.defaultValue)
: null,
date: _vm.date,
"disabled-date": _vm.disabledDate,
},
on: { pick: _vm.handleMonthPick },
}),
],
1
),
]),
],
2
),
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.footerVisible && _vm.currentView === "date",
expression: "footerVisible && currentView === 'date'",
},
],
staticClass: "el-picker-panel__footer",
},
[
_c(
"el-btn",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.selectionMode !== "dates",
expression: "selectionMode !== 'dates'",
},
],
staticClass: "el-picker-panel__link-btn",
attrs: { size: "mini", type: "text" },
on: { click: _vm.changeToNow },
},
[
_vm._v(
"\n " +
_vm._s(_vm.t("el.datepicker.now")) +
"\n "
),
]
),
_c(
"el-btn",
{
staticClass: "el-picker-panel__link-btn",
attrs: { plain: "", size: "mini" },
on: { click: _vm.confirm },
},
[
_vm._v(
"\n " +
_vm._s(_vm.t("el.datepicker.confirm")) +
"\n "
),
]
),
],
1
),
]
),
]
)
}
var staticRenderFns = []
render._withStripped = true
// CONCATENATED MODULE: ./packages/date-picker/src/panel/date.vue?vue&type=template&id=12078611
// EXTERNAL MODULE: external "element-nice-ui/lib/utils/date-util"
var date_util_ = __webpack_require__(4);
// EXTERNAL MODULE: external "element-nice-ui/lib/utils/clickoutside"
var clickoutside_ = __webpack_require__(27);
var clickoutside_default = /*#__PURE__*/__webpack_require__.n(clickoutside_);
// EXTERNAL MODULE: external "element-nice-ui/lib/mixins/locale"
var locale_ = __webpack_require__(19);
var locale_default = /*#__PURE__*/__webpack_require__.n(locale_);
// EXTERNAL MODULE: external "element-nice-ui/lib/input"
var input_ = __webpack_require__(22);
var input_default = /*#__PURE__*/__webpack_require__.n(input_);
// EXTERNAL MODULE: external "element-nice-ui/lib/btn"
var btn_ = __webpack_require__(21);
var btn_default = /*#__PURE__*/__webpack_require__.n(btn_);
// EXTERNAL MODULE: ./packages/date-picker/src/panel/time.vue + 4 modules
var panel_time = __webpack_require__(64);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/date-picker/src/basic/year-table.vue?vue&type=template&id=5c5ff758
var year_tablevue_type_template_id_5c5ff758_render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"table",
{ staticClass: "el-year-table", on: { click: _vm.handleYearTableClick } },
[
_c("tbody", [
_c("tr", [
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 0),
},
[_c("a", { staticClass: "cell" }, [_vm._v(_vm._s(_vm.startYear))])]
),
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 1),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 1)),
]),
]
),
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 2),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 2)),
]),
]
),
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 3),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 3)),
]),
]
),
]),
_c("tr", [
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 4),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 4)),
]),
]
),
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 5),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 5)),
]),
]
),
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 6),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 6)),
]),
]
),
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 7),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 7)),
]),
]
),
]),
_c("tr", [
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 8),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 8)),
]),
]
),
_c(
"td",
{
staticClass: "available",
class: _vm.getCellStyle(_vm.startYear + 9),
},
[
_c("a", { staticClass: "cell" }, [
_vm._v(_vm._s(_vm.startYear + 9)),
]),
]
),
_c("td"),
_c("td"),
]),
]),
]
)
}
var year_tablevue_type_template_id_5c5ff758_staticRenderFns = []
year_tablevue_type_template_id_5c5ff758_render._withStripped = true
// CONCATENATED MODULE: ./packages/date-picker/src/basic/year-table.vue?vue&type=template&id=5c5ff758
// EXTERNAL MODULE: external "element-nice-ui/lib/utils/dom"
var dom_ = __webpack_require__(8);
// EXTERNAL MODULE: external "element-nice-ui/lib/utils/util"
var util_ = __webpack_require__(5);
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/date-picker/src/basic/year-table.vue?vue&type=script&lang=js
const datesInYear = year => {
const numOfDays = Object(date_util_["getDayCountOfYear"])(year);
const firstDay = new Date(year, 0, 1);
return Object(date_util_["range"])(numOfDays).map(n => Object(date_util_["nextDate"])(firstDay, n));
};
/* harmony default export */ var year_tablevue_type_script_lang_js = ({
props: {
disabledDate: {},
value: {},
defaultValue: {
validator(val) {
// null or valid Date Object
return val === null || val instanceof Date && Object(date_util_["isDate"])(val);
}
},
date: {}
},
computed: {
startYear() {
return Math.floor(this.date.getFullYear() / 10) * 10;
}
},
methods: {
getCellStyle(year) {
const style = {};
const today = new Date();
style.disabled = typeof this.disabledDate === 'function' ? datesInYear(year).every(this.disabledDate) : false;
style.current = Object(util_["arrayFindIndex"])(Object(util_["coerceTruthyValueToArray"])(this.value), date => date.getFullYear() === year) >= 0;
style.today = today.getFullYear() === year;
style.default = this.defaultValue && this.defaultValue.getFullYear() === year;
return style;
},
handleYearTableClick(event) {
const target = event.target;
if (target.tagName === 'A') {
if (Object(dom_["hasClass"])(target.parentNode, 'disabled')) return;
const year = target.textContent || target.innerText;
this.$emit('pick', Number(year));
}
}
}
});
// CONCATENATED MODULE: ./packages/date-picker/src/basic/year-table.vue?vue&type=script&lang=js
/* harmony default export */ var basic_year_tablevue_type_script_lang_js = (year_tablevue_type_script_lang_js);
// EXTERNAL MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(2);
// CONCATENATED MODULE: ./packages/date-picker/src/basic/year-table.vue
/* normalize component */
var component = Object(componentNormalizer["a" /* default */])(
basic_year_tablevue_type_script_lang_js,
year_tablevue_type_template_id_5c5ff758_render,
year_tablevue_type_template_id_5c5ff758_staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var year_table = (component.exports);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/date-picker/src/basic/month-table.vue?vue&type=template&id=1e37ceac
var month_tablevue_type_template_id_1e37ceac_render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"table",
{
staticClass: "el-month-table",
on: { click: _vm.handleMonthTableClick, mousemove: _vm.handleMouseMove },
},
[
_c(
"tbody",
_vm._l(_vm.rows, function (row, key) {
return _c(
"tr",
{ key: key },
_vm._l(row, function (cell, key) {
return _c("td", { key: key, class: _vm.getCellStyle(cell) }, [
_c("div", [
_c("a", { staticClass: "cell" }, [
_vm._v(
_vm._s(
_vm.t("el.datepicker.months." + _vm.months[cell.text])
)
),
]),
]),
])
}),
0
)
}),
0
),
]
)
}
var month_tablevue_type_template_id_1e37ceac_staticRenderFns = []
month_tablevue_type_template_id_1e37ceac_render._withStripped = true
// CONCATENATED MODULE: ./packages/date-picker/src/basic/month-table.vue?vue&type=template&id=1e37ceac
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/date-picker/src/basic/month-table.vue?vue&type=script&lang=js
const datesInMonth = (year, month) => {
const numOfDays = Object(date_util_["getDayCountOfMonth"])(year, month);
const firstDay = new Date(year, month, 1);
return Object(date_util_["range"])(numOfDays).map(n => Object(date_util_["nextDate"])(firstDay, n));
};
const clearDate = date => {
return new Date(date.getFullYear(), date.getMonth());
};
const getMonthTimestamp = function getMonthTimestamp(time) {
if (typeof time === 'number' || typeof time === 'string') {
return clearDate(new Date(time)).getTime();
} else if (time instanceof Date) {
return clearDate(time).getTime();
} else {
return NaN;
}
};
/* harmony default export */ var month_tablevue_type_script_lang_js = ({
props: {
disabledDate: {},
value: {},
selectionMode: {
default: 'month'
},
minDate: {},
maxDate: {},
defaultValue: {
validator(val) {
// null or valid Date Object
return val === null || Object(date_util_["isDate"])(val) || Array.isArray(val) && val.every(date_util_["isDate"]);
}
},
date: {},
rangeState: {
default() {
return {
endDate: null,
selecting: false
};
}
}
},
mixins: [locale_default.a],
watch: {
'rangeState.endDate'(newVal) {
this.markRange(this.minDate, newVal);
},
minDate(newVal, oldVal) {
if (getMonthTimestamp(newVal) !== getMonthTimestamp(oldVal)) {
this.markRange(this.minDate, this.maxDate);
}
},
maxDate(newVal, oldVal) {
if (getMonthTimestamp(newVal) !== getMonthTimestamp(oldVal)) {
this.markRange(this.minDate, this.maxDate);
}
}
},
data() {
return {
months: ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'],
tableRows: [[], [], []],
lastRow: null,
lastColumn: null
};
},
methods: {
cellMatchesDate(cell, date) {
const value = new Date(date);
return this.date.getFullYear() === value.getFullYear() && Number(cell.text) === value.getMonth();
},
getCellStyle(cell) {
const style = {};
const year = this.date.getFullYear();
const today = new Date();
const month = cell.text;
const defaultValue = this.defaultValue ? Array.isArray(this.defaultValue) ? this.defaultValue : [this.defaultValue] : [];
style.disabled = typeof this.disabledDate === 'function' ? datesInMonth(year, month).every(this.disabledDate) : false;
style.current = Object(util_["arrayFindIndex"])(Object(util_["coerceTruthyValueToArray"])(this.value), date => date.getFullYear() === year && date.getMonth() === month) >= 0;
style.today = today.getFullYear() === year && today.getMonth() === month;
style.default = defaultValue.some(date => this.cellMatchesDate(cell, date));
if (cell.inRange) {
style['in-range'] = true;
if (cell.start) {
style['start-date'] = true;
}
if (cell.end) {
style['end-date'] = true;
}
}
return style;
},
getMonthOfCell(month) {
const year = this.date.getFullYear();
return new Date(year, month, 1);
},
markRange(minDate, maxDate) {
minDate = getMonthTimestamp(minDate);
maxDate = getMonthTimestamp(maxDate) || minDate;
[minDate, maxDate] = [Math.min(minDate, maxDate), Math.max(minDate, maxDate)];
const rows = this.rows;
for (let i = 0, k = rows.length; i < k; i++) {
const row = rows[i];
for (let j = 0, l = row.length; j < l; j++) {
const cell = row[j];
const index = i * 4 + j;
const time = new Date(this.date.getFullYear(), index).getTime();
cell.inRange = minDate && time >= minDate && time <= maxDate;
cell.start = minDate && time === minDate;
cell.end = maxDate && time === maxDate;
}
}
},
handleMouseMove(event) {
if (!this.rangeState.selecting) return;
let target = event.target;
if (target.tagName === 'A') {
target = target.parentNode.parentNode;
}
if (target.tagName === 'DIV') {
target = target.parentNode;
}
if (target.tagName !== 'TD') return;
const row = target.parentNode.rowIndex;
const column = target.cellIndex;
// can not select disabled date
if (this.rows[row][column].disabled) return;
// only update rangeState when mouse moves to a new cell
// this avoids frequent Date object creation and improves performance
if (row !== this.lastRow || column !== this.lastColumn) {
this.lastRow = row;
this.lastColumn = column;
this.$emit('changerange', {
minDate: this.minDate,
maxDate: this.maxDate,
rangeState: {
selecting: true,
endDate: this.getMonthOfCell(row * 4 + column)
}
});
}
},
handleMonthTableClick(event) {
let target = event.target;
if (target.tagName === 'A') {
target = target.parentNode.parentNode;
}
if (target.tagName === 'DIV') {
target = target.parentNode;
}
if (target.tagName !== 'TD') return;
if (Object(dom_["hasClass"])(target, 'disabled')) return;
const column = target.cellIndex;
const row = target.parentNode.rowIndex;
const month = row * 4 + column;
const newDate = this.getMonthOfCell(month);
if (this.selectionMode === 'range') {
if (!this.rangeState.selecting) {
this.$emit('pick', {
minDate: newDate,
maxDate: null
});
this.rangeState.selecting = true;
} else {
if (newDate >= this.minDate) {
this.$emit('pick', {
minDate: this.minDate,
maxDate: newDate
});
} else {
this.$emit('pick', {
minDate: newDate,
maxDate: this.minDate
});
}
this.rangeState.selecting = false;
}
} else {
this.$emit('pick', month);
}
}
},
computed: {
rows() {
// TODO: refactory rows / getCellClasses
const rows = this.tableRows;
const disabledDate = this.disabledDate;
const selectedDate = [];
const now = getMonthTimestamp(new Date());
for (let i = 0; i < 3; i++) {
const row = rows[i];
for (let j = 0; j < 4; j++) {
let cell = row[j];
if (!cell) {
cell = {
row: i,
column: j,
type: 'normal',
inRange: false,
start: false,
end: false
};
}
cell.type = 'normal';
const index = i * 4 + j;
const time = new Date(this.date.getFullYear(), index).getTime();
cell.inRange = time >= getMonthTimestamp(this.minDate) && time <= getMonthTimestamp(this.maxDate);
cell.start = this.minDate && time === getMonthTimestamp(this.minDate);
cell.end = this.maxDate && time === getMonthTimestamp(this.maxDate);
const isToday = time === now;
if (isToday) {
cell.type = 'today';
}
cell.text = index;
let cellDate = new Date(time);
cell.disabled = typeof disabledDate === 'function' && disabledDate(cellDate);
cell.selected = Object(util_["arrayFind"])(selectedDate, date => date.getTime() === cellDate.getTime());
this.$set(row, j, cell);
}
}
return rows;
}
}
});
// CONCATENATED MODULE: ./packages/date-picker/src/basic/month-table.vue?vue&type=script&lang=js
/* harmony default export */ var basic_month_tablevue_type_script_lang_js = (month_tablevue_type_script_lang_js);
// CONCATENATED MODULE: ./packages/date-picker/src/basic/month-table.vue
/* normalize component */
var month_table_component = Object(componentNormalizer["a" /* default */])(
basic_month_tablevue_type_script_lang_js,
month_tablevue_type_template_id_1e37ceac_render,
month_tablevue_type_template_id_1e37ceac_staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var month_table = (month_table_component.exports);
// CONCATENATED MODULE: ./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib/loaders/templateLoader.js??ref--5!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/date-picker/src/basic/date-table.vue?vue&type=template&id=25876179
var date_tablevue_type_template_id_25876179_render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"table",
{
staticClass: "el-date-table",
class: { "is-week-mode": _vm.selectionMode === "week" },
attrs: { cellspacing: "0", cellpadding: "0" },
on: { click: _vm.handleClick, mousemove: _vm.handleMouseMove },
},
[
_c(
"tbody",
[
_c(
"tr",
[
_vm.showWeekNumber
? _c("th", [_vm._v(_vm._s(_vm.t("el.datepicker.week")))])
: _vm._e(),
_vm._l(_vm.WEEKS, function (week, key) {
return _c("th", { key: key }, [
_vm._v(_vm._s(_vm.t("el.datepicker.weeks." + week))),
])
}),
],
2
),
_vm._l(_vm.rows, function (row, key) {
return _c(
"tr",
{
key: key,
staticClass: "el-date-table__row",
class: { current: _vm.isWeekActive(row[1]) },
},
_vm._l(row, function (cell, key) {
return _c("td", { key: key, class: _vm.getCellClasses(cell) }, [
_c("div", [
_c("span", [
_vm._v("\n " + _vm._s(cell.text) + "\n "),
]),
]),
])
}),
0
)
}),
],
2
),
]
)
}
var date_tablevue_type_template_id_25876179_staticRenderFns = []
date_tablevue_type_template_id_25876179_render._withStripped = true
// CONCATENATED MODULE: ./packages/date-picker/src/basic/date-table.vue?vue&type=template&id=25876179
// CONCATENATED MODULE: ./node_modules/.pnpm/babel-loader@8.4.1_@babel+core@7.28.0_webpack@4.47.0/node_modules/babel-loader/lib!./node_modules/.pnpm/vue-loader@15.11.1_@vue+compiler-sfc@3.5.18_css-loader@5.2.7_webpack@4.47.0__lodash@4.1_bb9a19950a80e648dc95ba33c71fa343/node_modules/vue-loader/lib??vue-loader-options!./packages/date-picker/src/basic/date-table.vue?vue&type=script&lang=js
const WEEKS = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
const date_tablevue_type_script_lang_js_getDateTimestamp = function getDateTimestamp(time) {
if (typeof time === 'number' || typeof time === 'string') {
return Object(date_util_["clearTime"])(new Date(time)).getTime();
} else if (time instanceof Date) {
return Object(date_util_["clearTime"])(time).getTime();
} else {
return NaN;
}
};
// remove the first element that satisfies `pred` from arr
// return a new array if modification occurs
// return the original array otherwise
const date_tablevue_type_script_lang_js_removeFromArray = function removeFromArray(arr, pred) {
const idx = typeof pred === 'function' ? Object(util_["arrayFindIndex"])(arr, pred) : arr.indexOf(pred);
return idx >= 0 ? [...arr.slice(0, idx), ...arr.slice(idx + 1)] : arr;
};
/* harmony default export */ var date_tablevue_type_script_lang_js = ({
mixins: [locale_default.a],
props: {
firstDayOfWeek: {
default: 7,
type: Number,
validator: val => val >= 1 && val <= 7
},
value: {},
defaultValue: {
validator(val) {
// either: null, valid Date object, Array of valid Date objects
return val === null || Object(date_util_["isDate"])(val) || Array.isArray(val) && val.every(date_util_["isDate"]);
}
},
date: {},
selectionMode: {
default: 'day'
},
showWeekNumber: {
type: Boolean,
default: false
},
disabledDate: {},
cellClassName: {},
minDate: {},
maxDate: {},
rangeState: {
default() {
return {
endDate: null,
selecting: false
};
}
}
},
computed: {
offsetDay() {
const week = this.firstDayOfWeek;
// 周日为界限，左右偏移的天数，3217654 例如周一就是 -1，目的是调整前两行日期的位置
return week > 3 ? 7 - week : -week;
},
WEEKS() {
const week = this.firstDayOfWeek;
return WEEKS.concat(WEEKS).slice(week, week + 7);
},
year() {
return this.date.getFullYear();
},
month() {
return this.date.getMonth();
},
startDate() {
return Object(date_util_["getStartDateOfMonth"])(this.year, this.month);
},
rows() {
// TODO: refactory rows / getCellClasses
const date = new Date(this.year, this.month, 1);
let day = Object(date_util_["getFirstDayOfMonth"])(date); // day of first day
const dateCountOfMonth = Object(date_util_["getDayCountOfMonth"])(date.getFullYear(), date.getMonth());
const dateCountOfLastMonth = Object(date_util_["getDayCountOfMonth"])(date.getFullYear(), date.getMonth() === 0 ? 11 : date.getMonth() - 1);
day = day === 0 ? 7 : day;
const offset = this.offsetDay;
const rows = this.tableRows;
let count = 1;
const startDate = this.startDate;
const disabledDate = this.disabledDate;
const cellClassName = this.cellClassName;
const selectedDate = this.selectionMode === 'dates' ? Object(util_["coerceTruthyValueToArray"])(this.value) : [];
const now = date_tablevue_type_script_lang_js_getDateTimestamp(new Date());
for (let i = 0; i < 6; i++) {
const row = rows[i];
if (this.showWeekNumber) {
if (!row[0]) {
row[0] = {
type: 'week',
text: Object(date_util_["getWeekNumber"])(Object(date_util_["nextDate"])(startDate, i * 7 + 1))
};
}
}
for (let j = 0; j < 7; j++) {
let cell = row[this.showWeekNumber ? j + 1 : j];
if (!cell) {
cell = {
row: i,
column: j,
type: 'normal',
inRange: false,
start: false,
end: false
};
}
cell.type = 'normal';
const index = i * 7 + j;
const time = Object(date_util_["nextDate"])(startDate, index - offset).getTime();
cell.inRange = time >= date_tablevue_type_script_lang_js_getDateTimestamp(this.minDate) && time <= date_tablevue_type_script_lang_js_getDateTimestamp(this.maxDate);
cell.start = this.minDate && time === date_tablevue_type_script_lang_js_getDateTimestamp(this.minDate);
cell.end = this.maxDate && time === date_tablevue_type_script_lang_js_getDateTimestamp(this.maxDate);
const isToday = time === now;
if (isToday) {
cell.type = 'today';
}
if (i >= 0 && i <= 1) {
const numberOfDaysFromPreviousMonth = day + offset < 0 ? 7 + day + offset : day + offset;
if (j + i * 7 >= numberOfDaysFromPreviousMonth) {
cell.text = count++;
} else {
cell.text = dateCountOfLastMonth - (numberOfDaysFromPreviousMonth - j % 7) + 1 + i * 7;
cell.type = 'prev-month';
}
} else {
if (count <= dateCountOfMonth) {
cell.text = count++;
} else {
cell.text = count++ - dateCountOfMonth;
cell.type = 'next-month';
}
}
let cellDate = new Date(time);
cell.disabled = typeof disabledDate === 'function' && disabledDate(cellDate);
cell.selected = Object(util_["arrayFind"])(selectedDate, date => date.getTime() === cellDate.getTime());
cell.customClass = typeof cellClassName === 'function' && cellClassName(cellDate);
this.$set(row, this.showWeekNumber ? j + 1 : j, cell);
}
if (this.selectionMode === 'week') {
const start = this.showWeekNumber ? 1 : 0;
const end = this.showWeekNumber ? 7 : 6;
const isWeekActive = this.isWeekActive(row[start + 1]);
row[start].inRange = isWeekActive;
row[start].start = isWeekActive;
row[end].inRange = isWeekActive;
row[end].end = isWeekActive;
}
}
return rows;
}
},
watch: {
'rangeState.endDate'(newVal) {
this.markRange(this.minDate, newVal);
},
minDate(newVal, oldVal) {
if (date_tablevue_type_script_lang_js_getDateTimestamp(newVal) !== date_tablevue_type_script_lang_js_getDateTimestamp(oldVal)) {
this.markRange(this.minDate, this.maxDate);
}
},
maxDate(newVal, oldVal) {
if (date_tablevue_type_script_lang_js_getDateTimestamp(newVal) !== date_tablevue_type_script_lang_js_getDateTimestamp(oldVal)) {
this.markRange(this.minDate, this.maxDate);
}
}
},
data() {
return {
tableRows: [[], [], [], [], [], []],
lastRow: null,
lastColumn: null
};
},
methods: {
cellMatchesDate(cell, date) {
const value = new Date(date);
return this.year === value.getFullYear() && this.month === value.getMonth() && Number(cell.text) === value.getDate();
},
getCellClasses(cell) {
const selectionMode = this.selectionMode;
const defaultValue = this.defaultValue ? Array.isArray(this.defaultValue) ? this.defaultValue : [this.defaultValue] : [];
let classes = [];
if ((cell.type === 'normal' || cell.type === 'today') && !cell.disabled) {
classes.push('available');
if (cell.type === 'today') {
classes.push('today');
}
} else {
classes.push(cell.type);
}
if (cell.type === 'normal' && defaultValue.some(date => this.cellMatchesDate(cell, date))) {
classes.push('default');
}
if (selectionMode === 'day' && (cell.type === 'normal' || cell.type === 'today') && this.cellMatchesDate(cell, this.value)) {
classes.push('current');
}
if (cell.inRange && (cell.type === 'normal' || cell.type === 'today' || this.selectionMode === 'week')) {
classes.push('in-range');
if (cell.start) {
classes.push('start-date');
}
if (cell.end) {
classes.push('end-date');
}
}
if (cell.disabled) {
classes.push('disabled');
}
if (cell.selected) {
classes.push('selected');
}
if (cell.customClass) {
classes.push(cell.customClass);
}
return classes.join(' ');
},
getDateOfCell(row, column) {
const offsetFromStart = row * 7 + (column - (this.showWeekNumber ? 1 : 0)) - this.offsetDay;
return Object(date_util_["nextDate"])(this.startDate, offsetFromStart);
},
isWeekActive(cell) {
if (this.selectionMode !== 'week') return false;
const newDate = new Date(this.year, this.month, 1);
const year = newDate.getFullYear();
const month = newDate.getMonth();
if (cell.type === 'prev-month') {
newDate.setMonth(month === 0 ? 11 : month - 1);
newDate.setFullYear(month === 0 ? year - 1 : year);
}
if (cell.type === 'next-month') {
newDate.setMonth(month === 11 ? 0 : month + 1);
newDate.setFullYear(month === 11 ? year + 1 : year);
}
newDate.setDate(parseInt(cell.text, 10));
if (Object(date_util_["isDate"])(this.value)) {
const dayOffset = (this.value.getDay() - this.firstDayOfWeek + 7) % 7 - 1;
const weekDate = Object(date_util_["prevDate"])(this.value, dayOffset);
return weekDate.getTime() === newDate.getTime();
}
return false;
},
markRange(minDate, maxDate) {
minDate = date_tablevue_type_script_lang_js_getDateTimestamp(minDate);
maxDate = date_tablevue_type_script_lang_js_getDateTimestamp(maxDate) || minDate;
[minDate, maxDate] = [Math.min(minDate, maxDate), Math.max(minDate, maxDate)];
const startDate = this.startDate;
const rows = this.rows;
for (let i = 0, k = rows.length; i < k; i++) {
const row = rows[i];
for (let j = 0, l = row.length; j < l; j++) {
if (this.showWeekNumber && j === 0) continue;
const cell = row[j];
const index = i * 7 + j + (this.showWeekNumber ? -1 : 0);
const time = Object(date_util_["nextDate"])(startDate, index - this.offsetDay).getTime();
cell.inRange = minDate && time >= minDate && time <= maxDate;
cell.start = minDate && time === minDate;
cell.end = maxDate && time === maxDate;
}
}
},
handleMouseMove(event) {
if (!this.rangeState.selecting) return;
let target = event.target;
if (target.t