element-nice-ui
Version:
A Component Library for Vue.js.
1,578 lines (1,452 loc) • 83 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 = 202);
/******/ })
/************************************************************************/
/******/ ({
/***/ 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");
/***/ }),
/***/ 19:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/mixins/locale");
/***/ }),
/***/ 2:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return normalizeComponent; });
/* globals __VUE_SSR_CONTEXT__ */
// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
// This module is a runtime utility for cleaner component module output and will
// be included in the final webpack user bundle.
function normalizeComponent(
scriptExports,
render,
staticRenderFns,
functionalTemplate,
injectStyles,
scopeId,
moduleIdentifier /* server only */,
shadowMode /* vue-cli only */
) {
// Vue.extend constructor export interop
var options =
typeof scriptExports === 'function' ? scriptExports.options : scriptExports
// render functions
if (render) {
options.render = render
options.staticRenderFns = staticRenderFns
options._compiled = true
}
// functional template
if (functionalTemplate) {
options.functional = true
}
// scopedId
if (scopeId) {
options._scopeId = 'data-v-' + scopeId
}
var hook
if (moduleIdentifier) {
// server build
hook = function (context) {
// 2.3 injection
context =
context || // cached call
(this.$vnode && this.$vnode.ssrContext) || // stateful
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
// 2.2 with runInNewContext: true
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__
}
// inject component styles
if (injectStyles) {
injectStyles.call(this, context)
}
// register component module identifier for async chunk inferrence
if (context && context._registeredComponents) {
context._registeredComponents.add(moduleIdentifier)
}
}
// used by ssr in case component is cached and beforeCreate
// never gets called
options._ssrRegister = hook
} else if (injectStyles) {
hook = shadowMode
? function () {
injectStyles.call(
this,
(options.functional ? this.parent : this).$root.$options.shadowRoot
)
}
: injectStyles
}
if (hook) {
if (options.functional) {
// for template-only hot-reload because in that case the render fn doesn't
// go through the normalizer
options._injectStyles = hook
// register for functional component in vue file
var originalRender = options.render
options.render = function renderWithStyleInjection(h, context) {
hook.call(context)
return originalRender(h, context)
}
} else {
// inject component registration as beforeCreate hook
var existing = options.beforeCreate
options.beforeCreate = existing ? [].concat(existing, hook) : [hook]
}
}
return {
exports: scriptExports,
options: options
}
}
/***/ }),
/***/ 202:
/***/ (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);
// EXTERNAL MODULE: ./packages/date-picker/src/panel/time.vue + 4 modules
var 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/panel/time-range.vue?vue&type=template&id=1efb14d2
var render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"transition",
{
attrs: { name: "el-zoom-in-top" },
on: {
"after-leave": function ($event) {
return _vm.$emit("dodestroy")
},
},
},
[
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.visible,
expression: "visible",
},
],
staticClass: "el-time-range-picker el-picker-panel el-popper",
class: _vm.popperClass,
},
[
_c("div", { staticClass: "el-time-range-picker__content" }, [
_c("div", { staticClass: "el-time-range-picker__cell" }, [
_c("div", { staticClass: "el-time-range-picker__header" }, [
_vm._v(_vm._s(_vm.t("el.datepicker.startTime"))),
]),
_c(
"div",
{
staticClass:
"el-time-range-picker__body el-time-panel__content",
class: {
"has-seconds": _vm.showSeconds,
"is-arrow": _vm.arrowControl,
},
},
[
_c("time-spinner", {
ref: "minSpinner",
attrs: {
"show-seconds": _vm.showSeconds,
"am-pm-mode": _vm.amPmMode,
"arrow-control": _vm.arrowControl,
date: _vm.minDate,
},
on: {
change: _vm.handleMinChange,
"select-range": _vm.setMinSelectionRange,
},
}),
],
1
),
]),
_c("div", { staticClass: "el-time-range-picker__cell" }, [
_c("div", { staticClass: "el-time-range-picker__header" }, [
_vm._v(_vm._s(_vm.t("el.datepicker.endTime"))),
]),
_c(
"div",
{
staticClass:
"el-time-range-picker__body el-time-panel__content",
class: {
"has-seconds": _vm.showSeconds,
"is-arrow": _vm.arrowControl,
},
},
[
_c("time-spinner", {
ref: "maxSpinner",
attrs: {
"show-seconds": _vm.showSeconds,
"am-pm-mode": _vm.amPmMode,
"arrow-control": _vm.arrowControl,
date: _vm.maxDate,
},
on: {
change: _vm.handleMaxChange,
"select-range": _vm.setMaxSelectionRange,
},
}),
],
1
),
]),
]),
_c("div", { staticClass: "el-time-panel__footer" }, [
_c(
"button",
{
staticClass: "el-time-panel__btn cancel",
attrs: { type: "button" },
on: {
click: function ($event) {
return _vm.handleCancel()
},
},
},
[_vm._v(_vm._s(_vm.t("el.datepicker.cancel")))]
),
_c(
"button",
{
staticClass: "el-time-panel__btn confirm",
attrs: { type: "button", disabled: _vm.btnDisabled },
on: {
click: function ($event) {
return _vm.handleConfirm()
},
},
},
[_vm._v(_vm._s(_vm.t("el.datepicker.confirm")))]
),
]),
]
),
]
)
}
var staticRenderFns = []
render._withStripped = true
// CONCATENATED MODULE: ./packages/date-picker/src/panel/time-range.vue?vue&type=template&id=1efb14d2
// EXTERNAL MODULE: external "element-nice-ui/lib/utils/date-util"
var date_util_ = __webpack_require__(4);
// EXTERNAL MODULE: external "element-nice-ui/lib/mixins/locale"
var locale_ = __webpack_require__(19);
var locale_default = /*#__PURE__*/__webpack_require__.n(locale_);
// EXTERNAL MODULE: ./packages/date-picker/src/basic/time-spinner.vue + 4 modules
var time_spinner = __webpack_require__(86);
// 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/panel/time-range.vue?vue&type=script&lang=js
const MIN_TIME = Object(date_util_["parseDate"])('00:00:00', 'HH:mm:ss');
const MAX_TIME = Object(date_util_["parseDate"])('23:59:59', 'HH:mm:ss');
const time_rangevue_type_script_lang_js_minTimeOfDay = function minTimeOfDay(date) {
return Object(date_util_["modifyDate"])(MIN_TIME, date.getFullYear(), date.getMonth(), date.getDate());
};
const time_rangevue_type_script_lang_js_maxTimeOfDay = function maxTimeOfDay(date) {
return Object(date_util_["modifyDate"])(MAX_TIME, date.getFullYear(), date.getMonth(), date.getDate());
};
// increase time by amount of milliseconds, but within the range of day
const advanceTime = function advanceTime(date, amount) {
return new Date(Math.min(date.getTime() + amount, time_rangevue_type_script_lang_js_maxTimeOfDay(date).getTime()));
};
/* harmony default export */ var time_rangevue_type_script_lang_js = ({
mixins: [locale_default.a],
components: {
TimeSpinner: time_spinner["a" /* default */]
},
computed: {
showSeconds() {
return (this.format || '').indexOf('ss') !== -1;
},
offset() {
return this.showSeconds ? 11 : 8;
},
spinner() {
return this.selectionRange[0] < this.offset ? this.$refs.minSpinner : this.$refs.maxSpinner;
},
btnDisabled() {
return this.minDate.getTime() > this.maxDate.getTime();
},
amPmMode() {
if ((this.format || '').indexOf('A') !== -1) return 'A';
if ((this.format || '').indexOf('a') !== -1) return 'a';
return '';
}
},
data() {
return {
popperClass: '',
minDate: new Date(),
maxDate: new Date(),
value: [],
oldValue: [new Date(), new Date()],
defaultValue: null,
format: 'HH:mm:ss',
visible: false,
selectionRange: [0, 2],
arrowControl: false
};
},
watch: {
value(value) {
if (Array.isArray(value)) {
this.minDate = new Date(value[0]);
this.maxDate = new Date(value[1]);
} else {
if (Array.isArray(this.defaultValue)) {
this.minDate = new Date(this.defaultValue[0]);
this.maxDate = new Date(this.defaultValue[1]);
} else if (this.defaultValue) {
this.minDate = new Date(this.defaultValue);
this.maxDate = advanceTime(new Date(this.defaultValue), 60 * 60 * 1000);
} else {
this.minDate = new Date();
this.maxDate = advanceTime(new Date(), 60 * 60 * 1000);
}
}
},
visible(val) {
if (val) {
this.oldValue = this.value;
this.$nextTick(() => this.$refs.minSpinner.emitSelectRange('hours'));
}
}
},
methods: {
handleClear() {
this.$emit('pick', null);
},
handleCancel() {
this.$emit('pick', this.oldValue);
},
handleMinChange(date) {
this.minDate = Object(date_util_["clearMilliseconds"])(date);
this.handleChange();
},
handleMaxChange(date) {
this.maxDate = Object(date_util_["clearMilliseconds"])(date);
this.handleChange();
},
handleChange() {
if (this.isValidValue([this.minDate, this.maxDate])) {
this.$refs.minSpinner.selectableRange = [[time_rangevue_type_script_lang_js_minTimeOfDay(this.minDate), this.maxDate]];
this.$refs.maxSpinner.selectableRange = [[this.minDate, time_rangevue_type_script_lang_js_maxTimeOfDay(this.maxDate)]];
this.$emit('pick', [this.minDate, this.maxDate], true);
}
},
setMinSelectionRange(start, end) {
this.$emit('select-range', start, end, 'min');
this.selectionRange = [start, end];
},
setMaxSelectionRange(start, end) {
this.$emit('select-range', start, end, 'max');
this.selectionRange = [start + this.offset, end + this.offset];
},
handleConfirm() {
let visible = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
const minSelectableRange = this.$refs.minSpinner.selectableRange;
const maxSelectableRange = this.$refs.maxSpinner.selectableRange;
this.minDate = Object(date_util_["limitTimeRange"])(this.minDate, minSelectableRange, this.format);
this.maxDate = Object(date_util_["limitTimeRange"])(this.maxDate, maxSelectableRange, this.format);
this.$emit('pick', [this.minDate, this.maxDate], visible);
},
adjustSpinners() {
this.$refs.minSpinner.adjustSpinners();
this.$refs.maxSpinner.adjustSpinners();
},
changeSelectionRange(step) {
const list = this.showSeconds ? [0, 3, 6, 11, 14, 17] : [0, 3, 8, 11];
const mapping = ['hours', 'minutes'].concat(this.showSeconds ? ['seconds'] : []);
const index = list.indexOf(this.selectionRange[0]);
const next = (index + step + list.length) % list.length;
const half = list.length / 2;
if (next < half) {
this.$refs.minSpinner.emitSelectRange(mapping[next]);
} else {
this.$refs.maxSpinner.emitSelectRange(mapping[next - half]);
}
},
isValidValue(date) {
return Array.isArray(date) && Object(date_util_["timeWithinRange"])(this.minDate, this.$refs.minSpinner.selectableRange) && Object(date_util_["timeWithinRange"])(this.maxDate, this.$refs.maxSpinner.selectableRange);
},
handleKeydown(event) {
const keyCode = event.keyCode;
const mapping = {
38: -1,
40: 1,
37: -1,
39: 1
};
// Left or Right
if (keyCode === 37 || keyCode === 39) {
const step = mapping[keyCode];
this.changeSelectionRange(step);
event.preventDefault();
return;
}
// Up or Down
if (keyCode === 38 || keyCode === 40) {
const step = mapping[keyCode];
this.spinner.scrollDown(step);
event.preventDefault();
return;
}
}
}
});
// CONCATENATED MODULE: ./packages/date-picker/src/panel/time-range.vue?vue&type=script&lang=js
/* harmony default export */ var panel_time_rangevue_type_script_lang_js = (time_rangevue_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/panel/time-range.vue
/* normalize component */
var component = Object(componentNormalizer["a" /* default */])(
panel_time_rangevue_type_script_lang_js,
render,
staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var time_range = (component.exports);
// CONCATENATED MODULE: ./packages/date-picker/src/picker/time-picker.js
/* harmony default export */ var time_picker = ({
mixins: [picker["a" /* default */]],
name: 'ElTimePicker',
props: {
isRange: Boolean,
arrowControl: Boolean
},
data() {
return {
type: ''
};
},
watch: {
isRange(isRange) {
if (this.picker) {
this.unmountPicker();
this.type = isRange ? 'timerange' : 'time';
this.panel = isRange ? time_range : time["a" /* default */];
this.mountPicker();
} else {
this.type = isRange ? 'timerange' : 'time';
this.panel = isRange ? time_range : time["a" /* default */];
}
}
},
created() {
this.type = this.isRange ? 'timerange' : 'time';
this.panel = this.isRange ? time_range : time["a" /* default */];
}
});
// CONCATENATED MODULE: ./packages/time-picker/index.js
/* istanbul ignore next */
time_picker.install = function (Vue) {
Vue.component(time_picker.name, time_picker);
};
/* harmony default export */ var packages_time_picker = __webpack_exports__["default"] = (time_picker);
/***/ }),
/***/ 22:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/input");
/***/ }),
/***/ 23:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/utils/merge");
/***/ }),
/***/ 27:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/utils/clickoutside");
/***/ }),
/***/ 32:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/scrollbar");
/***/ }),
/***/ 4:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/utils/date-util");
/***/ }),
/***/ 5:
/***/ (function(module, exports) {
module.exports = require("element-nice-ui/lib/utils/util");
/***/ }),
/***/ 64:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
// 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/time.vue?vue&type=template&id=692f77e1
var render = function render() {
var _vm = this,
_c = _vm._self._c
return _c(
"transition",
{
attrs: { name: "el-zoom-in-top" },
on: {
"after-leave": function ($event) {
return _vm.$emit("dodestroy")
},
},
},
[
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.visible,
expression: "visible",
},
],
staticClass: "el-time-panel el-popper",
class: _vm.popperClass,
},
[
_c(
"div",
{
staticClass: "el-time-panel__content",
class: { "has-seconds": _vm.showSeconds },
},
[
_c("time-spinner", {
ref: "spinner",
attrs: {
"arrow-control": _vm.useArrow,
"show-seconds": _vm.showSeconds,
"am-pm-mode": _vm.amPmMode,
date: _vm.date,
},
on: {
change: _vm.handleChange,
"select-range": _vm.setSelectionRange,
},
}),
],
1
),
_c("div", { staticClass: "el-time-panel__footer" }, [
_c(
"button",
{
staticClass: "el-time-panel__btn cancel",
attrs: { type: "button" },
on: { click: _vm.handleCancel },
},
[_vm._v(_vm._s(_vm.t("el.datepicker.cancel")))]
),
_c(
"button",
{
staticClass: "el-time-panel__btn",
class: { confirm: !_vm.disabled },
attrs: { type: "button" },
on: {
click: function ($event) {
return _vm.handleConfirm()
},
},
},
[_vm._v(_vm._s(_vm.t("el.datepicker.confirm")))]
),
]),
]
),
]
)
}
var staticRenderFns = []
render._withStripped = true
// CONCATENATED MODULE: ./packages/date-picker/src/panel/time.vue?vue&type=template&id=692f77e1
// EXTERNAL MODULE: external "element-nice-ui/lib/utils/date-util"
var date_util_ = __webpack_require__(4);
// EXTERNAL MODULE: external "element-nice-ui/lib/mixins/locale"
var locale_ = __webpack_require__(19);
var locale_default = /*#__PURE__*/__webpack_require__.n(locale_);
// EXTERNAL MODULE: ./packages/date-picker/src/basic/time-spinner.vue + 4 modules
var time_spinner = __webpack_require__(86);
// 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/panel/time.vue?vue&type=script&lang=js
/* harmony default export */ var timevue_type_script_lang_js = ({
mixins: [locale_default.a],
components: {
TimeSpinner: time_spinner["a" /* default */]
},
props: {
visible: Boolean,
timeArrowControl: Boolean
},
watch: {
visible(val) {
if (val) {
this.oldValue = this.value;
this.$nextTick(() => this.$refs.spinner.emitSelectRange('hours'));
} else {
this.needInitAdjust = true;
}
},
value(newVal) {
let date;
if (newVal instanceof Date) {
date = Object(date_util_["limitTimeRange"])(newVal, this.selectableRange, this.format);
} else if (!newVal) {
date = this.defaultValue ? new Date(this.defaultValue) : new Date();
}
this.date = date;
if (this.visible && this.needInitAdjust) {
this.$nextTick(_ => this.adjustSpinners());
this.needInitAdjust = false;
}
},
selectableRange(val) {
this.$refs.spinner.selectableRange = val;
},
defaultValue(val) {
if (!Object(date_util_["isDate"])(this.value)) {
this.date = val ? new Date(val) : new Date();
}
}
},
data() {
return {
popperClass: '',
format: 'HH:mm:ss',
value: '',
defaultValue: null,
date: new Date(),
oldValue: new Date(),
selectableRange: [],
selectionRange: [0, 2],
disabled: false,
arrowControl: false,
needInitAdjust: true
};
},
computed: {
showSeconds() {
return (this.format || '').indexOf('ss') !== -1;
},
useArrow() {
return this.arrowControl || this.timeArrowControl || false;
},
amPmMode() {
if ((this.format || '').indexOf('A') !== -1) return 'A';
if ((this.format || '').indexOf('a') !== -1) return 'a';
return '';
}
},
methods: {
handleCancel() {
this.$emit('pick', this.oldValue, false);
},
handleChange(date) {
// this.visible avoids edge cases, when use scrolls during panel closing animation
if (this.visible) {
this.date = Object(date_util_["clearMilliseconds"])(date);
// if date is out of range, do not emit
if (this.isValidValue(this.date)) {
this.$emit('pick', this.date, true);
}
}
},
setSelectionRange(start, end) {
this.$emit('select-range', start, end);
this.selectionRange = [start, end];
},
handleConfirm() {
let visible = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
let first = arguments.length > 1 ? arguments[1] : undefined;
if (first) return;
const date = Object(date_util_["clearMilliseconds"])(Object(date_util_["limitTimeRange"])(this.date, this.selectableRange, this.format));
this.$emit('pick', date, visible, first);
},
handleKeydown(event) {
const keyCode = event.keyCode;
const mapping = {
38: -1,
40: 1,
37: -1,
39: 1
};
// Left or Right
if (keyCode === 37 || keyCode === 39) {
const step = mapping[keyCode];
this.changeSelectionRange(step);
event.preventDefault();
return;
}
// Up or Down
if (keyCode === 38 || keyCode === 40) {
const step = mapping[keyCode];
this.$refs.spinner.scrollDown(step);
event.preventDefault();
return;
}
},
isValidValue(date) {
return Object(date_util_["timeWithinRange"])(date, this.selectableRange, this.format);
},
adjustSpinners() {
return this.$refs.spinner.adjustSpinners();
},
changeSelectionRange(step) {
const list = [0, 3].concat(this.showSeconds ? [6] : []);
const mapping = ['hours', 'minutes'].concat(this.showSeconds ? ['seconds'] : []);
const index = list.indexOf(this.selectionRange[0]);
const next = (index + step + list.length) % list.length;
this.$refs.spinner.emitSelectRange(mapping[next]);
}
},
mounted() {
this.$nextTick(() => this.handleConfirm(true, true));
this.$emit('mounted');
}
});
// CONCATENATED MODULE: ./packages/date-picker/src/panel/time.vue?vue&type=script&lang=js
/* harmony default export */ var panel_timevue_type_script_lang_js = (timevue_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/panel/time.vue
/* normalize component */
var component = Object(componentNormalizer["a" /* default */])(
panel_timevue_type_script_lang_js,
render,
staticRenderFns,
false,
null,
null,
null
)
/* harmony default export */ var time = __webpack_exports__["a"] = (component.exports);
/***/ }),
/***/ 69:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var element_nice_ui_src_utils_dom__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
/* harmony import */ var element_nice_ui_src_utils_dom__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(element_nice_ui_src_utils_dom__WEBPACK_IMPORTED_MODULE_0__);
/* harmony default export */ __webpack_exports__["a"] = ({
bind(el, binding, vnode) {
let interval = null;
let startTime;
const handler = () => vnode.context[binding.expression].apply();
const clear = () => {
if (Date.now() - startTime < 100) {
handler();
}
clearInterval(interval);
interval = null;
};
Object(element_nice_ui_src_utils_dom__WEBPACK_IMPORTED_MODULE_0__["on"])(el, 'mousedown', e => {
if (e.button !== 0) return;
startTime = Date.now();
Object(element_nice_ui_src_utils_dom__WEBPACK_IMPORTED_MODULE_0__["once"])(document, 'mouseup', clear);
clearInterval(interval);
interval = setInterval(handler, 100);
});
}
});
/***/ }),
/***/ 73:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
// 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/picker.vue?vue&type=template&id=20a643ec
var render = function render() {
var _vm = this,
_c = _vm._self._c
return !_vm.ranged
? _c(
"el-input",
_vm._b(
{
directives: [
{
name: "clickoutside",
rawName: "v-clickoutside",
value: _vm.handleClose,
expression: "handleClose",
},
],
ref: "reference",
staticClass: "el-date-editor",
class: "el-date-editor--" + _vm.type,
attrs: {
readonly:
!_vm.editable ||
_vm.pickerReadonly ||
_vm.type === "dates" ||
_vm.type === "week",
disabled: _vm.pickerDisabled,
size: _vm.pickerSize,
name: _vm.name,
placeholder: _vm.placeholder,
value: _vm.displayValue,
clearable: false,
validateEvent: false,
},
on: {
focus: _vm.handleFocus,
input: (value) => (_vm.userInput = value),
change: _vm.handleChange,
},
nativeOn: {
keydown: function ($event) {
return _vm.handleKeydown.apply(null, arguments)
},
mouseenter: function ($event) {
return _vm.handleMouseEnter.apply(null, arguments)
},
mouseleave: function ($event) {
_vm.showClose = false
},
},
},
"el-input",
_vm.firstInputId,
false
),
[
_c("i", {
staticClass: "el-input__icon",
class: _vm.triggerClass,
attrs: { slot: "prefix" },
on: { click: _vm.handleFocus },
slot: "prefix",
}),
_vm.haveTrigger
? _c("i", {
staticClass: "el-input__icon",
class: [_vm.showClose ? "" + _vm.clearIcon : ""],
attrs: { slot: "suffix" },
on: { click: _vm.handleClickIcon },
slot: "suffix",
})
: _vm._e(),
]
)
: _c(
"div",
{
directives: [
{
name: "clickoutside",
rawName: "v-clickoutside",
value: _vm.handleClose,
expression: "handleClose",
},
],
ref: "reference",
staticClass: "el-date-editor el-range-editor el-input__inner",
class: [
"el-date-editor--" + _vm.type,
_vm.pickerSize ? `el-range-editor--${_vm.pickerSize}` : "",
_vm.pickerDisabled ? "is-disabled" : "",
_vm.pickerVisible ? "is-active" : "",
],
on: {
click: _vm.handleRangeClick,
mouseenter: _vm.handleMouseEnter,
mouseleave: function ($event) {
_vm.showClose = false
},
keydown: _vm.handleKeydown,
},
},
[
_c("i", {
class: ["el-input__icon", "el-range__icon", _vm.triggerClass],
}),
_c(
"input",
_vm._b(
{
staticClass: "el-range-input",
attrs: {
autocomplete: "off",
placeholder: _vm.startPlaceholder,
disabled: _vm.pickerDisabled,
readonly: !_vm.editable || _vm.pickerReadonly,
name: _vm.name && _vm.name[0],
},
domProps: { value: _vm.displayValue && _vm.displayValue[0] },
on: {
input: _vm.handleStartInput,
change: _vm.handleStartChange,
focus: _vm.handleFocus,
},
},
"input",
_vm.firstInputId,
false
)
),
_vm._t("range-separator", function () {
return [
_c("span", { staticClass: "el-range-separator" }, [
_vm._v(_vm._s(_vm.rangeSeparator)),
]),
]
}),
_c(
"input",
_vm._b(
{
staticClass: "el-range-input",
attrs: {
autocomplete: "off",
placeholder: _vm.endPlaceholder,
disabled: _vm.pickerDisabled,
readonly: !_vm.editable || _vm.pickerReadonly,
name: _vm.name && _vm.name[1],
},
domProps: { value: _vm.displayValue && _vm.displayValue[1] },
on: {
input: _vm.handleEndInput,
change: _vm.handleEndChange,
focus: _vm.handleFocus,
},
},
"input",
_vm.secondInputId,
false
)
),
_vm.haveTrigger
? _c("i", {
staticClass: "el-input__icon el-range__close-icon",
class: [_vm.showClose ? "" + _vm.clearIcon : ""],
on: { click: _vm.handleClickIcon },
})
: _vm._e(),
],
2
)
}
var staticRenderFns = []
render._withStripped = true
// CONCATENATED MODULE: ./packages/date-picker/src/picker.vue?vue&type=template&id=20a643ec
// EXTERNAL MODULE: external "vue"
var external_vue_ = __webpack_require__(18);
var external_vue_default = /*#__PURE__*/__webpack_require__.n(external_vue_);
// 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/utils/date-util"
var date_util_ = __webpack_require__(4);
// EXTERNAL MODULE: external "element-nice-ui/lib/utils/vue-popper"
var vue_popper_ = __webpack_require__(17);
var vue_popper_default = /*#__PURE__*/__webpack_require__.n(vue_popper_);
// EXTERNAL MODULE: external "element-nice-ui/lib/mixins/emitter"
var emitter_ = __webpack_require__(13);
var emitter_default = /*#__PURE__*/__webpack_require__.n(emitter_);
// 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/utils/merge"
var merge_ = __webpack_require__(23);
var merge_default = /*#__PURE__*/__webpack_require__.n(merge_);
// 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/picker.vue?vue&type=script&lang=js
const NewPopper = {
props: {
appendToBody: vue_popper_default.a.props.appendToBody,
offset: vue_popper_default.a.props.offset,
boundariesPadding: vue_popper_default.a.props.boundariesPadding,
arrowOffset: vue_popper_default.a.props.arrowOffset
},
methods: vue_popper_default.a.methods,
data() {
return merge_default()({
visibleArrow: true
}, vue_popper_default.a.data);
},
beforeDestroy: vue_popper_default.a.beforeDestroy
};
const DEFAULT_FORMATS = {
date: 'yyyy-MM-dd',
month: 'yyyy-MM',
datetime: 'yyyy-MM-dd HH:mm:ss',
time: 'HH:mm:ss',
week: 'yyyywWW',
timerange: 'HH:mm:ss',
daterange: 'yyyy-MM-dd',
monthrange: 'yyyy-MM',
datetimerange: 'yyyy-MM-dd HH:mm:ss',
year: 'yyyy'
};
const HAVE_TRIGGER_TYPES = ['date', 'datetime', 'time', 'time-select', 'week', 'month', 'year', 'daterange', 'monthrange', 'timerange', 'datetimerange', 'dates'];
const pickervue_type_script_lang_js_DATE_FORMATTER = function DATE_FORMATTER(value, format) {
if (format === 'timestamp') return value.getTime();
return Object(date_util_["formatDate"])(value, format);
};
const pickervue_type_script_lang_js_DATE_PARSER = function DATE_PARSER(text, format) {
if (format === 'timestamp') return new Date(Number(text));
return Object(date_util_["parseDate"])(text, format);
};
const RANGE_FORMATTER = function RANGE_FORMATTER(value, format) {
if (Array.isArray(value) && value.length === 2) {
const start = value[0];
const end = value[1];
if (start && end) {
return [pickervue_type_script_lang_js_DATE_FORMATTER(start, format), pickervue_type_script_lang_js_DATE_FORMATTER(end, format)];
}
}
return '';
};
const RANGE_PARSER = function RANGE_PARSER(array, format, separator) {
if (!Array.isArray(array)) {
array = array.split(separator);
}
if (array.length === 2) {
const range1 = array[0];
const range2 = array[1];
return [pickervue_type_script_lang_js_DATE_PARSER(range1, format), pickervue_type_script_lang_js_DATE_PARSER(range2, format)];
}
return [];
};
const TYPE_VALUE_RESOLVER_MAP = {
default: {
formatter(value) {
if (!value) return '';
return '' + value;
},
parser(text) {
if (text === undefined || text === '') return null;
return text;
}
},
week: {
formatter(value, format) {
let week = Object(date_util_["getWeekNumber"])(value);
let month = value.getMonth();
const trueDate = new Date(value);
if (week === 1 && month === 11) {
trueDate.setHours(0, 0, 0, 0);
trueDate.setDate(trueDate.getDate() + 3 - (trueDate.getDay() + 6) % 7);
}
let date = Object(date_util_["formatDate"])(trueDate, format);
date = /WW/.test(date) ? date.replace(/WW/, week < 10 ? '0' + week : week) : date.replace(/W/, week);
return date;
},
parser(text, format) {
// parse as if a normal date
return TYPE_VALUE_RESOLVER_MAP.date.parser(text, format);
}
},
date: {
formatter: pickervue_type_script_lang_js_DATE_FORMATTER,
parser: pickervue_type_script_lang_js_DATE_PARSER
},
datetime: {
formatter: pickervue_type_script_lang_js_DATE_FORMATTER,
parser: pickervue_type_script_lang_js_DATE_PARSER
},
daterange: {
formatter: RANGE_FORMATTER,
parser: RANGE_PARSER
},
monthrange: {
formatter: RANGE_FORMATTER,
parser: RANGE_PARSER
},
datetimerange: {
formatter: RANGE_FORMATTER,
parser: RANGE_PARSER
},
timerange: {
formatter: RANGE_FORMATTER,
parser: RANGE_PARSER
},
time: {
formatter: pickervue_type_script_lang_js_DATE_FORMATTER,
parser: pickervue_type_script_lang_js_DATE_PARSER
},
month: {
formatter: pickervue_type_script_lang_js_DATE_FORMATTER,
parser: pickervue_type_script_lang_js_DATE_PARSER
},
year: {
formatter: pickervue_type_script_lang_js_DATE_FORMATTER,
parser: pickervue_type_script_lang_js_DATE_PARSER
},
number: {
formatter(value) {
if (!value) return '';
return '' + value;
},
parser(text) {
let result = Number(text);
if (!isNaN(text)) {
return result;
} else {
return null;
}
}
},
dates: {
formatter(value, format) {
return value.map(date => pickervue_type_script_lang_js_DATE_FORMATTER(date, format));
},
parser(value, format) {
return (typeof value === 'string' ? value.split(', ') : value).map(date => date instanceof Date ? date : pickervue_type_script_lang_js_DATE_PARSER(date, format));
}
}
};
const PLACEMENT_MAP = {
left: 'bottom-start',
center: 'bottom',
right: 'bottom-end'
};
const parseAsFormatAndType = function parseAsFormatAndType(value, customFormat, type) {
let rangeSeparator = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '-';
if (!value) return null;
const parser = (TYPE_VALUE_RESOLVER_MAP[type] || TYPE_VALUE_RESOLVER_MAP['default']).parser;
const format = customFormat || DEFAULT_FORMATS[type];
return parser(value, format, rangeSeparator);
};
const formatAsFormatAndType = (value, customFormat, type) => {
if (!value) return null;
const formatter = (TYPE_VALUE_RESOLVER_MAP[type] || TYPE_VALUE_RESOLVER_MAP['default']).formatter;
const format = customFormat || DEFAULT_FORMATS[type];
return formatter(value, format);
};
/*
* Considers:
* 1. Date object
* 2. date string
* 3. array of 1 or 2
*/
const valueEquals = function valueEquals(a, b) {
// considers Date object and string
const dateEquals = function dateEquals(a, b) {
const aIsDate = a instanceof Date;
const bIsDate = b instanceof Date;
if (aIsDate && bIsDate) {
return a.getTime() === b.getTime();
}
if (!aIsDate && !bIsDate) {
return a === b;
}
return false;
};
const aIsArray = a instanceof Array;
const bIsArray = b instanceof Array;
if (aIsArray && bIsArray) {
if (a.length !== b.length) {
return false;
}
return a.every((item, index) => dateEquals(item, b[index]));
}
if (!aIsArray && !bIsArray) {
return dateEquals(a, b);
}
return false;
};
const isString = function isString(val) {
return typeof val === 'string' || val instanceof String;
};
const validator = function validator(val) {
// either: String, Array of String, null / undefined
return val === null || val === undefined || isString(val) || Array.isArray(val) && val.length === 2 && val.every(isString);
};
/* harmony default export */ var pickervue_type_script_lang_js = ({
mixins: [emitter_default.a, NewPopper],
inject: {
elForm: {
default: ''
},
elFormItem: {
default: ''
}
},
props: {
size: String,
format: String,
valueFormat: String,
readonly: {
type: Boolean,
default: undefined
},
placeholder: {
type: String,
default: '请选择日期'
},
startPlaceholder: {
type: String,
default: '开始日期'
},
endPlaceholder: {
type: String,
default: '结束日期'
},
prefixIcon: String,
clearIcon: {
type: String,
default: 'el-icon-circle-close'
},
name: {
default: '',
validator
},
disabled: {
type: Boolean,
default: undefined
},
clearable: {
type: Boolean,
default: true
},
id: {
default: '',
validator
},
popperClass: String,
editable: {
type: Boolean,
default: true
},
align: {
type: String,
default: 'left'
},
value: {},
defaultValue: {},
defaultTime: {},
rangeSeparator: {
default: '-'
},
pickerOptions: {},
unlinkPanels: Boolean,
validateEvent: {
type: Boolean,
default: true
}
},
components: {
ElInput: input_default.a
},
directives: {
Clickoutside: clickoutside_default.a
},
data() {
return {
pickerVisible: false,
showClose: false,
userInput: null,
valueOnOpen: null,
// value when picker opens, used to determine whether to emit change
unwatchPickerOptions: null
};
},
watch: {
pickerVisible(val) {
if (this.pickerReadonly || this.pickerDisabled) return;
if (val) {
this.showPicker();
this.valueOnOpen = Array.isArray(this.value) ? [...this.value] : this.value;
} else {
this.hidePicker();
this.emitChange(this.value);
this.userInput = null;
if (this.validateEvent) {
this.dispatch('ElFormItem', 'el.form.blur');
}
this.$emit('blur', this);
this.blur();
}
},
parsedValue: {
immediate: true,
handler(val) {
if (this.picker) {
this.picker.value = val;
}
}
},
defaultValue(val) {
// NOTE: should eventually move to jsx style picker + panel ?
if (this.picker) {
this.picker.defaultValue = val;
}
},
value(val, oldVal) {
if (!valueEquals(val, oldVal) && !this.pickerVisible && this.validateEvent) {
this.dispatch('ElFormItem', 'el.form.change', val);
}
}
},
computed: {
ranged() {
return this.type.indexOf('range') > -1;
},
reference() {
const reference = this.$refs.reference;
return reference.$el || reference;
},
refInput() {
if (this.reference) {
return [].slice.call(this.reference.querySelectorAll('input'));
}
return [];
},
valueIsEmpty() {
const val = this.value;
if (Array.isArray(val)) {
for (let i = 0, len = val.length; i < len; i++) {
if (val[i]) {
return false;
}
}
} else {
if (val) {
return false;
}
}
return true;
},
triggerClass() {
return this.prefixIcon || (this.type.indexOf('time') !== -1 ? 'el-icon-time' : 'el-icon-date');
},
selectionMode() {
if (this.type === 'week') {
return 'week';
} else if (this.type === 'month') {
return 'month';
} else if (this.type === 'year') {
return 'year';
} else if (this.type === 'dates') {
return 'dates';
}
return 'day';
},
haveTrigger() {
if (typeof this.showTrigger !== 'undefined') {
return this.showTrigger;
}
return HAVE_TRIGGER_TYPES.indexOf(this.type) !== -1;
},
displayValue() {
const formattedValue = formatAsFormatAndType(this.parsedValue, this.format, this.type, this.rangeSeparator);
if (Array.isArray(this.userInput)) {
return [this.userInput[0] || formattedValue && formattedValue[0] || '', this.userInput[1] || formattedValue && formattedValue[1] || ''];
} else if (this.userInput !== null) {
return this.userInput;
} else if (formattedValue) {
return this.type === 'dates' ? formattedValue.join(', ') : formattedValue;
} else {
return '';
}
},
parsedValue() {
if (!this.value) return this.value; // component value is not set
if (this.type === 'time-select') return this.value; // time-select does not require parsing, this might change in next major version
const valueIsDateObjec