quasar-ui-sellmate-ui-kit 2.2.8 → 2.2.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (11) hide show
  1. package/dist/index.common.js +2 -2
  2. package/dist/index.css +1 -1
  3. package/dist/index.esm.js +2 -2
  4. package/dist/index.min.css +1 -1
  5. package/dist/index.rtl.css +1 -1
  6. package/dist/index.rtl.min.css +1 -1
  7. package/dist/index.umd.js +127 -115
  8. package/dist/index.umd.min.js +2 -2
  9. package/package.json +1 -1
  10. package/src/components/SDate.vue +109 -97
  11. package/src/components/SSelect.vue +1 -1
package/dist/index.umd.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * quasar-ui-sellmate-ui-kit v2.2.7
2
+ * quasar-ui-sellmate-ui-kit v2.2.8
3
3
  * (c) 2023 Sellmate Dev Team <dev@sellmate.co.kr>
4
4
  * Released under the MIT License.
5
5
  */
@@ -3050,7 +3050,7 @@
3050
3050
  ]), 1040, ["dropdown-icon", "options-selected-class", "popup-content-class", "use-input", "options", "option-label", "option-value", "onInputValue", "onFocus", "onBlur", "emit-value", "onPopupHide"]))
3051
3051
  }
3052
3052
 
3053
- var css_248z$g = ".s-select .q-field__inner .q-field__control {\n background: white;\n padding: 0;\n min-height: 0;\n height: 28px;\n}\n.s-select .q-field__inner .q-field__control:after {\n border: 1px solid #aaaaaa;\n box-shadow: none;\n}\n.s-select .q-field__inner .q-field__control:hover, .s-select .q-field__inner .q-field__control:active {\n background: #f6f6f6;\n}\n.s-select .q-field__inner .q-field__control-container .q-field__native {\n font-size: 12px;\n min-height: 0;\n padding: 4px 0 4px 12px !important;\n color: #333333;\n}\n.s-select .q-field__inner .q-field__control-container .q-field__native > span {\n max-height: 28px;\n}\n.s-select .q-field__inner .q-field__control-container .q-field__native > .q-placeholder {\n min-height: 100%;\n}\n.s-select .q-field__inner .q-field__control .q-field__append {\n min-height: 0;\n height: inherit;\n padding: 8px;\n}\n.s-select .q-field__inner .q-field__control .q-field__append .q-icon {\n font-size: 12px;\n color: #888888;\n width: 1em;\n height: 1em;\n}\n.s-select .q-field__inner .q-field__bottom {\n padding: 8px 0px 0px 0px;\n font-size: 12px;\n color: #737373;\n}\n.s-select .q-field__inner .q-field__bottom .q-field__messages div[role=alert] {\n color: #e30000;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control {\n opacity: 1 !important;\n background: #eeeeee;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control:after {\n border: 1px solid #cccccc;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control-container .q-field__native > span {\n color: #888888;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control .q-field__append .q-icon {\n color: #888888;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-item, .s-select-opts .q-virtual-scroll__content .q-item {\n padding: 6px 12px;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-item__section .q-item__label > span, .s-select-opts .q-virtual-scroll__content .q-item__section .q-item__label > span {\n font-size: 12px;\n font-weight: 400;\n color: #333333;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-item--active, .s-select-opts .q-virtual-scroll__content .q-item--active {\n color: #333333 !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused {\n background: #0075ff;\n color: white !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-focus-helper, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-focus-helper {\n opacity: 0 !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-item__label > span, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-item__label > span {\n color: white !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--indet .q-checkbox__bg, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--indet .q-checkbox__bg, .s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--truthy .q-checkbox__bg, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--truthy .q-checkbox__bg {\n border: 1px solid white !important;\n}\n.s-select.q-field--disabled .q-field__control > div {\n opacity: 1 !important;\n border-right: 1px solid #cccccc;\n}\n.s-select .q-field__prepend {\n background-color: #f6f6f6;\n height: auto;\n border-right: 1px solid #aaaaaa;\n padding: 4px 12px !important;\n}\n.s-select .q-field__prepend .include-label {\n font-size: 12px;\n font-weight: 400;\n color: #333333;\n}\n.s-select.q-select--multiple .q-field__inner .q-field__control-container .q-field__native {\n display: block;\n min-height: 0;\n height: 28px;\n padding: 4px 0 4px 12px !important;\n color: #333333;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.s-select.q-select--multiple .q-field__inner .q-field__control-container .q-field__native > span {\n max-height: 28px;\n text-overflow: ellipsis;\n overflow-x: hidden;\n}\n.s-select.q-select--multiple .q-field__inner .q-field__control-container .q-field__native > input {\n min-height: 100%;\n}\n.s-select-group-opts {\n padding: 0;\n}\n.s-select-group-opts .s-select-no-option {\n padding: 6px 12px;\n}\n.s-select-group-opts .group-title {\n opacity: 1 !important;\n background: #f6f6f6 !important;\n border: none;\n border-top: 1px solid #e1e1e1;\n}\n.s-select-group-opts .group-title .q-item__section .q-item__label {\n color: #333333 !important;\n}\n.s-select-group-opts .group-option {\n padding: 4px 12px 4px 20px !important;\n}\n.s-select-group-opts .group-option.disabled {\n background: white !important;\n border: none !important;\n}\n.s-select-group-opts .group-option.disabled .q-item__section {\n color: #aaaaaa !important;\n}";
3053
+ var css_248z$g = ".s-select .q-field__inner .q-field__control {\n background: white;\n padding: 0;\n min-height: 0;\n height: 28px;\n}\n.s-select .q-field__inner .q-field__control:after {\n border: 1px solid #aaaaaa;\n box-shadow: none;\n}\n.s-select .q-field__inner .q-field__control:hover, .s-select .q-field__inner .q-field__control:active {\n background: #f6f6f6;\n}\n.s-select .q-field__inner .q-field__control-container .q-field__native {\n font-size: 12px;\n min-height: 0;\n padding: 4px 0 4px 12px !important;\n color: #333333;\n}\n.s-select .q-field__inner .q-field__control-container .q-field__native > span {\n max-height: 28px;\n}\n.s-select .q-field__inner .q-field__control-container .q-field__native > .q-placeholder {\n min-height: 100%;\n}\n.s-select .q-field__inner .q-field__control .q-field__append {\n min-height: 0;\n height: inherit;\n padding: 8px;\n}\n.s-select .q-field__inner .q-field__control .q-field__append .q-icon {\n font-size: 12px;\n color: #888888;\n width: 1em;\n height: 1em;\n}\n.s-select .q-field__inner .q-field__bottom {\n padding: 8px 0px 0px 0px;\n font-size: 12px;\n color: #737373;\n}\n.s-select .q-field__inner .q-field__bottom .q-field__messages div[role=alert] {\n color: #e30000;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control {\n opacity: 1 !important;\n background: #eeeeee;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control:after {\n border: 1px solid #cccccc;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control-container .q-field__native > span {\n color: #888888;\n}\n.q-field--disabled.s-select .q-field__inner .q-field__control .q-field__append .q-icon {\n color: #888888;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-item, .s-select-opts .q-virtual-scroll__content .q-item {\n padding: 6px 12px;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-item__section .q-item__label > span, .s-select-opts .q-virtual-scroll__content .q-item__section .q-item__label > span {\n font-size: 12px;\n font-weight: 400;\n color: #333333;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-item--active, .s-select-opts .q-virtual-scroll__content .q-item--active {\n color: #333333 !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused {\n background: #0075ff;\n color: white !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-focus-helper, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-focus-helper {\n opacity: 0 !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-item__label > span, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-item__label > span {\n color: white !important;\n}\n.s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--indet .q-checkbox__bg, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--indet .q-checkbox__bg, .s-select-group-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--truthy .q-checkbox__bg, .s-select-opts .q-virtual-scroll__content .q-manual-focusable--focused .q-item__section .q-checkbox .q-checkbox__inner--truthy .q-checkbox__bg {\n border: 1px solid white !important;\n}\n.s-select.q-field--disabled .q-field__control > .q-field__prepend {\n opacity: 1 !important;\n border-right: 1px solid #cccccc;\n}\n.s-select .q-field__prepend {\n background-color: #f6f6f6;\n height: auto;\n border-right: 1px solid #aaaaaa;\n padding: 4px 12px !important;\n}\n.s-select .q-field__prepend .include-label {\n font-size: 12px;\n font-weight: 400;\n color: #333333;\n}\n.s-select.q-select--multiple .q-field__inner .q-field__control-container .q-field__native {\n display: block;\n min-height: 0;\n height: 28px;\n padding: 4px 0 4px 12px !important;\n color: #333333;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.s-select.q-select--multiple .q-field__inner .q-field__control-container .q-field__native > span {\n max-height: 28px;\n text-overflow: ellipsis;\n overflow-x: hidden;\n}\n.s-select.q-select--multiple .q-field__inner .q-field__control-container .q-field__native > input {\n min-height: 100%;\n}\n.s-select-group-opts {\n padding: 0;\n}\n.s-select-group-opts .s-select-no-option {\n padding: 6px 12px;\n}\n.s-select-group-opts .group-title {\n opacity: 1 !important;\n background: #f6f6f6 !important;\n border: none;\n border-top: 1px solid #e1e1e1;\n}\n.s-select-group-opts .group-title .q-item__section .q-item__label {\n color: #333333 !important;\n}\n.s-select-group-opts .group-option {\n padding: 4px 12px 4px 20px !important;\n}\n.s-select-group-opts .group-option.disabled {\n background: white !important;\n border: none !important;\n}\n.s-select-group-opts .group-option.disabled .q-item__section {\n color: #aaaaaa !important;\n}";
3054
3054
  styleInject(css_248z$g);
3055
3055
 
3056
3056
  script$h.render = render$i;
@@ -6357,11 +6357,10 @@
6357
6357
  type: Boolean,
6358
6358
  default: false,
6359
6359
  },
6360
- durationLimit: Number,
6361
- rangeDate: { type: [Number, Object], default: function () { return 1; } },
6362
- dateLimit: {
6360
+ dateRangeLimit: { type: [Number, Object], default: 1 },
6361
+ minMaxDate: {
6363
6362
  type: Object,
6364
- default: function () { return ({ from: '', to: '' }); },
6363
+ default: function () { return ({ minDate: '', maxDate: '' }); },
6365
6364
  },
6366
6365
  },
6367
6366
 
@@ -6369,29 +6368,24 @@
6369
6368
  var emit = ref$1.emit;
6370
6369
 
6371
6370
  var dateModel = useModelBinder(props);
6372
- var singleMenuRef = vue.ref(null);
6373
6371
  var fromMenuRef = vue.ref(null);
6374
6372
  var toMenuRef = vue.ref(null);
6375
6373
  var wrapperInputRef = vue.ref(null);
6376
- var menuModel = vue.ref({
6377
- single: false,
6378
- from: false,
6379
- to: false,
6380
- });
6381
6374
 
6382
6375
  function resetDate(key) {
6383
6376
  var todayDate = quasar.date.formatDate(new Date(), 'YYYY-MM-DD');
6384
- var durationBeforeToday = quasar.date.formatDate(
6385
- quasar.date.subtractFromDate(new Date(), { month: props.durationLimit }),
6386
- 'YYYY-MM-DD'
6387
- );
6388
6377
 
6389
6378
  if (!props.isRange) {
6390
6379
  dateModel.value = todayDate;
6391
6380
  return;
6392
6381
  }
6393
6382
 
6394
- if (props.noLimit && !!props.durationLimit) {
6383
+ var durationBeforeToday = quasar.date.formatDate(
6384
+ quasar.date.subtractFromDate(new Date(), { month: props.dateRangeLimit }),
6385
+ 'YYYY-MM-DD'
6386
+ );
6387
+
6388
+ if (props.noLimit && !!props.dateRangeLimit) {
6395
6389
  if (typeof dateModel.value !== 'object' || !dateModel.value.from) {
6396
6390
  dateModel.value = { from: durationBeforeToday, to: todayDate };
6397
6391
  return;
@@ -6409,9 +6403,9 @@
6409
6403
  - fromDate.getMonth()
6410
6404
  + 12 * (toDate.getFullYear() - fromDate.getFullYear());
6411
6405
 
6412
- if (monthDifference >= props.durationLimit) {
6406
+ if (monthDifference >= props.dateRangeLimit) {
6413
6407
  dateModel.value.from = quasar.date.formatDate(
6414
- quasar.date.subtractFromDate(toDate, { month: props.durationLimit }),
6408
+ quasar.date.subtractFromDate(toDate, { month: props.dateRangeLimit }),
6415
6409
  'YYYY-MM-DD'
6416
6410
  );
6417
6411
  }
@@ -6430,8 +6424,10 @@
6430
6424
  function optionsFn(day) {
6431
6425
  if (props.noLimit) { return true; }
6432
6426
 
6433
- var minDate = props.dateLimit.from && quasar.date.formatDate(new Date(props.dateLimit.from), 'YYYY/MM/DD');
6434
- var maxDate = props.dateLimit.to && quasar.date.formatDate(new Date(props.dateLimit.to), 'YYYY/MM/DD');
6427
+ var minDate = props.minMaxDate.minDate
6428
+ && quasar.date.formatDate(new Date(props.minMaxDate.minDate), 'YYYY/MM/DD');
6429
+ var maxDate = props.minMaxDate.maxDate
6430
+ && quasar.date.formatDate(new Date(props.minMaxDate.maxDate), 'YYYY/MM/DD');
6435
6431
 
6436
6432
  if (minDate && maxDate) {
6437
6433
  return minDate <= day && day <= maxDate;
@@ -6449,79 +6445,97 @@
6449
6445
  }
6450
6446
 
6451
6447
  function optionsStartFn(day) {
6452
- if (props.noLimit && dateModel.value.to) {
6453
- var selectedEndDay = quasar.date.formatDate(dateModel.value.to, 'YYYY/MM/DD');
6454
- return day <= selectedEndDay;
6448
+ if (props.noLimit) {
6449
+ return true;
6455
6450
  }
6456
6451
 
6457
6452
  var dayTo = quasar.date.formatDate(dateModel.value.to, 'YYYY/MM/DD');
6458
- var maxFromDate = quasar.date.formatDate(
6459
- quasar.date.subtractFromDate(
6460
- new Date(dateModel.value.to),
6461
- typeof props.rangeDate === 'number' ? { month: props.rangeDate } : props.rangeDate
6462
- ),
6463
- 'YYYY/MM/DD'
6464
- );
6453
+ var maxFromDate = dayTo
6454
+ ? quasar.date.formatDate(
6455
+ quasar.date.subtractFromDate(
6456
+ new Date(dateModel.value.to),
6457
+ typeof props.dateRangeLimit === 'number'
6458
+ ? { month: props.dateRangeLimit }
6459
+ : props.dateRangeLimit
6460
+ ),
6461
+ 'YYYY/MM/DD'
6462
+ )
6463
+ : null;
6464
+
6465
+ if (props.minMaxDate.minDate) {
6466
+ maxFromDate = maxFromDate
6467
+ ? quasar.date.formatDate(
6468
+ new Date(Math.max(new Date(maxFromDate), new Date(props.minMaxDate.minDate))),
6469
+ 'YYYY/MM/DD'
6470
+ )
6471
+ : quasar.date.formatDate(new Date(props.minMaxDate.minDate), 'YYYY/MM/DD');
6472
+ }
6465
6473
 
6466
- if (props.dateLimit.from) {
6467
- maxFromDate = quasar.date.formatDate(
6468
- new Date(Math.max(new Date(maxFromDate), new Date(props.dateLimit.from))),
6469
- 'YYYY/MM/DD'
6470
- );
6474
+ if (maxFromDate && dayTo) {
6475
+ return maxFromDate <= day && day <= dayTo;
6471
6476
  }
6472
6477
 
6473
- if (!dateModel.value.to) {
6474
- return true;
6478
+ if (maxFromDate) {
6479
+ return maxFromDate <= day;
6475
6480
  }
6476
- return maxFromDate <= day && day <= dayTo;
6481
+
6482
+ if (dayTo) {
6483
+ return day <= dayTo;
6484
+ }
6485
+
6486
+ return true;
6477
6487
  }
6478
6488
 
6479
6489
  function optionsEndFn(day) {
6480
- var today = quasar.date.formatDate(new Date(), 'YYYY/MM/DD');
6490
+ var dayFrom = quasar.date.formatDate(dateModel.value.from, 'YYYY/MM/DD');
6481
6491
 
6482
- // isRange와 noLimit이 모두 true일 때, 종료 날짜에 제한을 두지 않는다.
6483
- if (props.isRange && props.noLimit) {
6484
- var dayFrom$1 = quasar.date.formatDate(dateModel.value.from, 'YYYY/MM/DD');
6485
- return dayFrom$1 <= day && day <= today;
6492
+ var maxToDate = dayFrom
6493
+ ? quasar.date.formatDate(
6494
+ quasar.date.addToDate(
6495
+ new Date(dateModel.value.from),
6496
+ typeof props.dateRangeLimit === 'number'
6497
+ ? { month: props.dateRangeLimit }
6498
+ : props.dateRangeLimit
6499
+ ),
6500
+ 'YYYY/MM/DD'
6501
+ )
6502
+ : null;
6503
+
6504
+ if (props.minMaxDate.maxDate) {
6505
+ maxToDate = maxToDate
6506
+ ? quasar.date.formatDate(
6507
+ new Date(Math.min(new Date(maxToDate), new Date(props.minMaxDate.maxDate))),
6508
+ 'YYYY/MM/DD'
6509
+ )
6510
+ : quasar.date.formatDate(new Date(props.minMaxDate.maxDate), 'YYYY/MM/DD');
6486
6511
  }
6487
6512
 
6488
- if (props.noLimit && !!props.durationLimit) {
6489
- var maxToDate$1 = today;
6490
- if (dateModel.value.from) {
6491
- var dayFrom$2 = quasar.date.formatDate(dateModel.value.from, 'YYYY/MM/DD');
6492
- maxToDate$1 = today;
6493
- return dayFrom$2 <= day && day <= maxToDate$1;
6494
- }
6495
- return day <= maxToDate$1;
6513
+ if (dayFrom && maxToDate) {
6514
+ return dayFrom <= day && day <= maxToDate;
6496
6515
  }
6497
6516
 
6498
- var dayFrom = quasar.date.formatDate(dateModel.value.from, 'YYYY/MM/DD');
6499
- var maxToDate = quasar.date.formatDate(
6500
- quasar.date.addToDate(
6501
- new Date(dateModel.value.from),
6502
- typeof props.rangeDate === 'number' ? { month: props.rangeDate } : props.rangeDate
6503
- ),
6504
- 'YYYY/MM/DD'
6505
- );
6506
-
6507
- if (props.dateLimit.to) {
6508
- maxToDate = quasar.date.formatDate(
6509
- new Date(Math.min(new Date(maxToDate), new Date(props.dateLimit.to))),
6510
- 'YYYY/MM/DD'
6511
- );
6517
+ if (dayFrom) {
6518
+ return dayFrom <= day;
6512
6519
  }
6513
- if (!dateModel.value.from) {
6514
- return day <= today;
6520
+
6521
+ if (maxToDate) {
6522
+ return day <= maxToDate;
6515
6523
  }
6516
6524
 
6517
- return dayFrom <= day && day <= maxToDate && day <= today;
6525
+ return true;
6526
+ }
6527
+
6528
+ function triggerValidation() {
6529
+ if (wrapperInputRef.value) { wrapperInputRef.value.validate(); }
6518
6530
  }
6519
6531
 
6520
- function handleFromMenuHide() {
6521
- if (props.noLimit && !!props.durationLimit) {
6532
+ function settingFromDate() {
6533
+ triggerValidation();
6534
+
6535
+ if (props.noLimit && !!props.dateRangeLimit) {
6522
6536
  var fromDate = new Date(dateModel.value.from);
6523
6537
  var monthsLater = new Date(fromDate).setMonth(
6524
- fromDate.getMonth() + props.durationLimit
6538
+ fromDate.getMonth() + props.dateRangeLimit
6525
6539
  );
6526
6540
  var maxToDate = quasar.date.formatDate(Math.min(monthsLater, new Date()), 'YYYY-MM-DD'); // 최대개월 후 또는 오늘 중 더 이른 날짜
6527
6541
 
@@ -6530,14 +6544,19 @@
6530
6544
  // 선택된 'to' 날짜가 최대개월을 초과하는 경우
6531
6545
  dateModel.value.to = maxToDate;
6532
6546
  }
6547
+
6548
+ if (fromDate > toDate) {
6549
+ dateModel.value.to = '';
6550
+ }
6533
6551
  }
6534
- fromMenuRef.value.hide();
6535
6552
  }
6536
6553
 
6537
6554
  function handleToMenuHide() {
6538
- if (props.noLimit && !!props.durationLimit) {
6555
+ // FIXME: 종료 일자는 보통 시작 일자에 의해 제한 되기 때문에
6556
+ // 종료 일자가 시작 일자를 제한하는 경우는 없을 것으로 보임, 추후 확인 후 삭제
6557
+ if (props.noLimit && !!props.dateRangeLimit) {
6539
6558
  var toDate = new Date(dateModel.value.to);
6540
- var monthsBefore = new Date(toDate).setMonth(toDate.getMonth() - props.durationLimit);
6559
+ var monthsBefore = new Date(toDate).setMonth(toDate.getMonth() - props.dateRangeLimit);
6541
6560
  var minFromDate = quasar.date.formatDate(monthsBefore, 'YYYY-MM-DD'); // 'to' 날짜로부터 최대개월 이전
6542
6561
 
6543
6562
  var fromDate = new Date(dateModel.value.from);
@@ -6553,20 +6572,23 @@
6553
6572
  if (!props.isRange) {
6554
6573
  dateModel.value = '';
6555
6574
  emit('update:modelValue', dateModel.value);
6575
+ return;
6556
6576
  }
6557
6577
 
6558
- if (dateModel.value.from && dateModel.value.to) {
6559
- dateModel.value.from = '';
6560
- dateModel.value.to = '';
6561
- emit('update:modelValue', dateModel.value);
6562
- }
6578
+ dateModel.value.from = '';
6579
+ dateModel.value.to = '';
6580
+ emit('update:modelValue', dateModel.value);
6563
6581
  }
6564
6582
 
6565
6583
  return {
6566
6584
  locale: locale$1,
6585
+ menuModel: vue.ref({
6586
+ single: false,
6587
+ from: false,
6588
+ to: false,
6589
+ }),
6567
6590
  dateModel: dateModel,
6568
- menuModel: menuModel,
6569
- singleMenuRef: singleMenuRef,
6591
+ singleMenuRef: vue.ref(null),
6570
6592
  fromMenuRef: fromMenuRef,
6571
6593
  toMenuRef: toMenuRef,
6572
6594
  wrapperInputRef: wrapperInputRef,
@@ -6577,9 +6599,10 @@
6577
6599
  optionsFn: optionsFn,
6578
6600
  optionsStartFn: optionsStartFn,
6579
6601
  optionsEndFn: optionsEndFn,
6580
- handleFromMenuHide: handleFromMenuHide,
6602
+ settingFromDate: settingFromDate,
6581
6603
  handleToMenuHide: handleToMenuHide,
6582
6604
  deleteDate: deleteDate,
6605
+ triggerValidation: triggerValidation,
6583
6606
  };
6584
6607
  },
6585
6608
  };
@@ -6607,7 +6630,8 @@
6607
6630
  outlined: "",
6608
6631
  readonly: "",
6609
6632
  disable: $props.isDisable,
6610
- ref: "wrapperInputRef"
6633
+ ref: "wrapperInputRef",
6634
+ "no-error-icon": ""
6611
6635
  }, vue.createSlots({
6612
6636
  default: vue.withCtx(function () { return [
6613
6637
  vue.createElementVNode("div", _hoisted_2$1, [
@@ -6616,13 +6640,13 @@
6616
6640
  vue.createVNode(_component_q_input, {
6617
6641
  class: "inner-input",
6618
6642
  modelValue: $setup.dateModel.from,
6619
- "onUpdate:modelValue": _cache[5] || (_cache[5] = function ($event) { return (($setup.dateModel.from) = $event); }),
6643
+ "onUpdate:modelValue": _cache[6] || (_cache[6] = function ($event) { return (($setup.dateModel.from) = $event); }),
6620
6644
  dense: "",
6621
6645
  borderless: "",
6622
6646
  mask: "####-##-##",
6623
6647
  autocomplete: "off",
6624
- onClick: _cache[6] || (_cache[6] = function ($event) { return ($setup.fromMenuRef.show()); }),
6625
- onKeyup: _cache[7] || (_cache[7] = vue.withKeys(function ($event) { return ($setup.fromMenuRef.hide()); }, ["enter"]))
6648
+ onClick: _cache[7] || (_cache[7] = function ($event) { return ($setup.fromMenuRef.show()); }),
6649
+ onKeyup: _cache[8] || (_cache[8] = vue.withKeys(function ($event) { return ($setup.fromMenuRef.hide()); }, ["enter"]))
6626
6650
  }, {
6627
6651
  prepend: vue.withCtx(function () { return [
6628
6652
  vue.createVNode(_component_q_icon, {
@@ -6636,18 +6660,14 @@
6636
6660
  default: vue.withCtx(function () { return [
6637
6661
  vue.createVNode(_component_q_menu, {
6638
6662
  modelValue: $setup.menuModel.from,
6639
- "onUpdate:modelValue": _cache[3] || (_cache[3] = function ($event) { return (($setup.menuModel.from) = $event); }),
6663
+ "onUpdate:modelValue": _cache[4] || (_cache[4] = function ($event) { return (($setup.menuModel.from) = $event); }),
6640
6664
  ref: "fromMenuRef",
6641
6665
  class: "s-date-menu",
6642
6666
  "no-focus": "",
6643
6667
  "no-refocus": "",
6644
6668
  offset: [0, 6],
6645
6669
  "no-parent-event": "",
6646
- onHide: _cache[4] || (_cache[4] =
6647
- function () {
6648
- if ($setup.wrapperInputRef) { $setup.wrapperInputRef.validate(); }
6649
- }
6650
- )
6670
+ onHide: _cache[5] || (_cache[5] = function ($event) { return ($setup.settingFromDate()); })
6651
6671
  }, {
6652
6672
  default: vue.withCtx(function () { return [
6653
6673
  vue.createElementVNode("div", _hoisted_3, [
@@ -6664,7 +6684,7 @@
6664
6684
  modelValue: $setup.dateModel.from,
6665
6685
  "onUpdate:modelValue": [
6666
6686
  _cache[2] || (_cache[2] = function ($event) { return (($setup.dateModel.from) = $event); }),
6667
- $setup.handleFromMenuHide
6687
+ _cache[3] || (_cache[3] = function ($event) { return ($setup.fromMenuRef.hide()); })
6668
6688
  ],
6669
6689
  minimal: "",
6670
6690
  square: "",
@@ -6675,7 +6695,7 @@
6675
6695
  mask: "YYYY-MM-DD",
6676
6696
  locale: $props.lang ? $setup.locale[$props.lang] : {},
6677
6697
  options: $setup.optionsStartFn
6678
- }, null, 8, ["modelValue", "locale", "options", "onUpdate:modelValue"])
6698
+ }, null, 8, ["modelValue", "locale", "options"])
6679
6699
  ]; }),
6680
6700
  _: 1
6681
6701
  }, 8, ["modelValue"])
@@ -6700,24 +6720,20 @@
6700
6720
  size: "20px",
6701
6721
  color: "Grey_Darken-1",
6702
6722
  class: "cursor-pointer",
6703
- onClick: _cache[8] || (_cache[8] = function ($event) { return ($setup.toMenuRef[$setup.menuModel.to ? 'hide' : 'show']()); })
6723
+ onClick: _cache[9] || (_cache[9] = function ($event) { return ($setup.toMenuRef[$setup.menuModel.to ? 'hide' : 'show']()); })
6704
6724
  }, null, 8, ["name"])
6705
6725
  ]; }),
6706
6726
  default: vue.withCtx(function () { return [
6707
6727
  vue.createVNode(_component_q_menu, {
6708
6728
  modelValue: $setup.menuModel.to,
6709
- "onUpdate:modelValue": _cache[11] || (_cache[11] = function ($event) { return (($setup.menuModel.to) = $event); }),
6729
+ "onUpdate:modelValue": _cache[12] || (_cache[12] = function ($event) { return (($setup.menuModel.to) = $event); }),
6710
6730
  ref: "toMenuRef",
6711
6731
  class: "s-date-menu",
6712
6732
  "no-focus": "",
6713
6733
  "no-refocus": "",
6714
6734
  offset: [0, 6],
6715
6735
  "no-parent-event": "",
6716
- onHide: _cache[12] || (_cache[12] =
6717
- function () {
6718
- if ($setup.wrapperInputRef) { $setup.wrapperInputRef.validate(); }
6719
- }
6720
- )
6736
+ onHide: $setup.triggerValidation
6721
6737
  }, {
6722
6738
  default: vue.withCtx(function () { return [
6723
6739
  vue.createElementVNode("div", _hoisted_5, [
@@ -6727,13 +6743,13 @@
6727
6743
  label: $props.lang ? $setup.locale[$props.lang].today : '오늘',
6728
6744
  "text-color": "Grey_Darken-4",
6729
6745
  ripple: false,
6730
- onClick: _cache[9] || (_cache[9] = function ($event) { return ($setup.resetDate('to')); })
6746
+ onClick: _cache[10] || (_cache[10] = function ($event) { return ($setup.resetDate('to')); })
6731
6747
  }, null, 8, ["label"])
6732
6748
  ]),
6733
6749
  vue.createVNode(_component_q_date, {
6734
6750
  modelValue: $setup.dateModel.to,
6735
6751
  "onUpdate:modelValue": [
6736
- _cache[10] || (_cache[10] = function ($event) { return (($setup.dateModel.to) = $event); }),
6752
+ _cache[11] || (_cache[11] = function ($event) { return (($setup.dateModel.to) = $event); }),
6737
6753
  $setup.handleToMenuHide
6738
6754
  ],
6739
6755
  minimal: "",
@@ -6748,7 +6764,7 @@
6748
6764
  }, null, 8, ["modelValue", "locale", "options", "onUpdate:modelValue"])
6749
6765
  ]; }),
6750
6766
  _: 1
6751
- }, 8, ["modelValue"])
6767
+ }, 8, ["modelValue", "onHide"])
6752
6768
  ]; }),
6753
6769
  _: 1
6754
6770
  }, 8, ["modelValue"])
@@ -6757,13 +6773,13 @@
6757
6773
  key: 1,
6758
6774
  class: "inner-input",
6759
6775
  modelValue: $setup.dateModel,
6760
- "onUpdate:modelValue": _cache[22] || (_cache[22] = function ($event) { return (($setup.dateModel) = $event); }),
6776
+ "onUpdate:modelValue": _cache[21] || (_cache[21] = function ($event) { return (($setup.dateModel) = $event); }),
6761
6777
  dense: "",
6762
6778
  borderless: "",
6763
6779
  mask: "####-##-##",
6764
6780
  autocomplete: "off",
6765
- onClick: _cache[23] || (_cache[23] = function ($event) { return ($setup.singleMenuRef.show()); }),
6766
- onKeyup: _cache[24] || (_cache[24] = vue.withKeys(function ($event) { return ($setup.singleMenuRef.hide()); }, ["enter"]))
6781
+ onClick: _cache[22] || (_cache[22] = function ($event) { return ($setup.singleMenuRef.show()); }),
6782
+ onKeyup: _cache[23] || (_cache[23] = vue.withKeys(function ($event) { return ($setup.singleMenuRef.hide()); }, ["enter"]))
6767
6783
  }, {
6768
6784
  prepend: vue.withCtx(function () { return [
6769
6785
  vue.createVNode(_component_q_icon, {
@@ -6784,11 +6800,7 @@
6784
6800
  "no-refocus": "",
6785
6801
  offset: [0, 6],
6786
6802
  "no-parent-event": "",
6787
- onHide: _cache[21] || (_cache[21] =
6788
- function () {
6789
- if ($setup.wrapperInputRef) { $setup.wrapperInputRef.validate(); }
6790
- }
6791
- )
6803
+ onHide: $setup.triggerValidation
6792
6804
  }, {
6793
6805
  default: vue.withCtx(function () { return [
6794
6806
  vue.createElementVNode("div", _hoisted_6, [
@@ -6819,7 +6831,7 @@
6819
6831
  }, null, 8, ["modelValue", "locale", "options"])
6820
6832
  ]; }),
6821
6833
  _: 1
6822
- }, 8, ["modelValue"])
6834
+ }, 8, ["modelValue", "onHide"])
6823
6835
  ]; }),
6824
6836
  _: 1
6825
6837
  }, 8, ["modelValue"]))
@@ -7168,7 +7180,7 @@
7168
7180
 
7169
7181
  /* eslint-disable no-multiple-empty-lines */
7170
7182
 
7171
- var version = '2.2.7';
7183
+ var version = '2.2.8';
7172
7184
 
7173
7185
  function install(app) {
7174
7186
  app.component('s-breadcrumbs', script$D);