sard-uniapp 1.15.4 → 1.17.0

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 (133) hide show
  1. package/CHANGELOG.md +25 -0
  2. package/components/calendar-input/calendar-input.vue +26 -89
  3. package/components/calendar-input/common.d.ts +7 -17
  4. package/components/calendar-input/common.js +2 -1
  5. package/components/calendar-popout/calendar-popout.d.ts +17 -0
  6. package/components/calendar-popout/calendar-popout.vue +102 -0
  7. package/components/calendar-popout/common.d.ts +27 -0
  8. package/components/calendar-popout/common.js +5 -0
  9. package/components/calendar-popout/index.d.ts +1 -0
  10. package/components/calendar-popout/index.js +1 -0
  11. package/components/cascader-input/cascader-input.vue +26 -89
  12. package/components/cascader-input/common.d.ts +5 -19
  13. package/components/cascader-input/common.js +3 -1
  14. package/components/cascader-popout/cascader-popout.d.ts +23 -0
  15. package/components/cascader-popout/cascader-popout.vue +88 -0
  16. package/components/cascader-popout/common.d.ts +27 -0
  17. package/components/cascader-popout/common.js +2 -0
  18. package/components/cascader-popout/index.d.ts +1 -0
  19. package/components/cascader-popout/index.js +1 -0
  20. package/components/checkbox-input/checkbox-input.vue +21 -141
  21. package/components/checkbox-input/common.d.ts +4 -11
  22. package/components/checkbox-input/common.js +2 -5
  23. package/components/checkbox-popout/checkbox-popout.d.ts +21 -0
  24. package/components/checkbox-popout/checkbox-popout.vue +136 -0
  25. package/components/checkbox-popout/common.d.ts +22 -0
  26. package/components/checkbox-popout/common.js +5 -0
  27. package/components/checkbox-popout/index.d.ts +1 -0
  28. package/components/checkbox-popout/index.js +1 -0
  29. package/components/{checkbox-input → checkbox-popout}/index.scss +2 -2
  30. package/components/{checkbox-input → checkbox-popout}/variables.scss +1 -1
  31. package/components/config/index.d.ts +9 -7
  32. package/components/config/index.js +9 -7
  33. package/components/count-down/count-down.vue +5 -3
  34. package/components/datetime-picker/common.d.ts +3 -0
  35. package/components/datetime-picker/datetime-picker.d.ts +9 -2
  36. package/components/datetime-picker-input/common.d.ts +5 -13
  37. package/components/datetime-picker-input/common.js +1 -1
  38. package/components/datetime-picker-input/datetime-picker-input.d.ts +9 -2
  39. package/components/datetime-picker-input/datetime-picker-input.vue +22 -109
  40. package/components/datetime-picker-popout/common.d.ts +22 -0
  41. package/components/datetime-picker-popout/common.js +5 -0
  42. package/components/datetime-picker-popout/datetime-picker-popout.d.ts +21 -0
  43. package/components/datetime-picker-popout/datetime-picker-popout.vue +113 -0
  44. package/components/datetime-picker-popout/index.d.ts +1 -0
  45. package/components/datetime-picker-popout/index.js +1 -0
  46. package/components/datetime-range-picker/common.d.ts +2 -3
  47. package/components/datetime-range-picker-input/common.d.ts +5 -13
  48. package/components/datetime-range-picker-input/common.js +1 -1
  49. package/components/datetime-range-picker-input/datetime-range-picker-input.d.ts +9 -2
  50. package/components/datetime-range-picker-input/datetime-range-picker-input.vue +23 -97
  51. package/components/datetime-range-picker-popout/common.d.ts +22 -0
  52. package/components/datetime-range-picker-popout/common.js +5 -0
  53. package/components/datetime-range-picker-popout/datetime-range-picker-popout.d.ts +21 -0
  54. package/components/datetime-range-picker-popout/datetime-range-picker-popout.vue +102 -0
  55. package/components/datetime-range-picker-popout/index.d.ts +1 -0
  56. package/components/datetime-range-picker-popout/index.js +1 -0
  57. package/components/navbar/navbar.vue +1 -1
  58. package/components/navbar-pit/common.d.ts +6 -0
  59. package/components/navbar-pit/common.js +1 -0
  60. package/components/navbar-pit/index.d.ts +1 -0
  61. package/components/navbar-pit/index.js +1 -0
  62. package/components/navbar-pit/index.scss +11 -0
  63. package/components/navbar-pit/navbar-pit.d.ts +2 -1
  64. package/components/navbar-pit/navbar-pit.vue +29 -4
  65. package/components/picker/common.d.ts +11 -0
  66. package/components/picker/index.scss +0 -13
  67. package/components/picker/picker.d.ts +9 -2
  68. package/components/picker/picker.vue +31 -9
  69. package/components/picker/variables.scss +4 -1
  70. package/components/picker-input/common.d.ts +5 -12
  71. package/components/picker-input/common.js +2 -4
  72. package/components/picker-input/picker-input.d.ts +9 -2
  73. package/components/picker-input/picker-input.vue +37 -74
  74. package/components/picker-item/common.d.ts +12 -0
  75. package/components/picker-item/common.js +1 -0
  76. package/components/picker-item/index.d.ts +1 -0
  77. package/components/picker-item/index.js +1 -0
  78. package/components/picker-item/index.scss +12 -0
  79. package/components/picker-item/picker-item.d.ts +10 -0
  80. package/components/picker-item/picker-item.vue +41 -0
  81. package/components/picker-popout/common.d.ts +23 -0
  82. package/components/picker-popout/common.js +6 -0
  83. package/components/picker-popout/index.d.ts +1 -0
  84. package/components/picker-popout/index.js +1 -0
  85. package/components/picker-popout/picker-popout.d.ts +22 -0
  86. package/components/picker-popout/picker-popout.vue +112 -0
  87. package/components/popout-input/common.d.ts +2 -0
  88. package/components/popout-input/popout-input.d.ts +2 -0
  89. package/components/popout-input/popout-input.vue +4 -0
  90. package/components/popup/popup.vue +15 -3
  91. package/components/radio-input/common.d.ts +4 -11
  92. package/components/radio-input/common.js +2 -5
  93. package/components/radio-input/radio-input.vue +21 -140
  94. package/components/radio-popout/common.d.ts +23 -0
  95. package/components/radio-popout/common.js +5 -0
  96. package/components/radio-popout/index.d.ts +1 -0
  97. package/components/radio-popout/index.js +1 -0
  98. package/components/{radio-input → radio-popout}/index.scss +2 -2
  99. package/components/radio-popout/radio-popout.d.ts +22 -0
  100. package/components/radio-popout/radio-popout.vue +135 -0
  101. package/components/{radio-input → radio-popout}/variables.scss +1 -1
  102. package/components/signature/signature.d.ts +2 -2
  103. package/components/tabbar/common.d.ts +2 -0
  104. package/components/tabbar/index.scss +13 -0
  105. package/components/tabbar/tabbar.vue +10 -2
  106. package/components/tabbar/variables.scss +1 -0
  107. package/components/tabbar-pit/common.d.ts +13 -0
  108. package/components/tabbar-pit/common.js +1 -0
  109. package/components/tabbar-pit/index.d.ts +1 -0
  110. package/components/tabbar-pit/index.js +1 -0
  111. package/components/tabbar-pit/index.scss +12 -0
  112. package/components/tabbar-pit/tabbar-pit.d.ts +10 -0
  113. package/components/tabbar-pit/tabbar-pit.vue +46 -0
  114. package/components/tree/common.d.ts +11 -0
  115. package/components/tree/index.d.ts +1 -1
  116. package/components/tree/tree.d.ts +8 -2
  117. package/components/tree/tree.vue +28 -5
  118. package/components/tree/variables.scss +2 -2
  119. package/components/tree-node/index.scss +2 -1
  120. package/components/tree-node/tree-node.vue +25 -3
  121. package/global.d.ts +9 -0
  122. package/index.d.ts +10 -0
  123. package/index.js +10 -0
  124. package/index.scss +2 -2
  125. package/package.json +4 -4
  126. package/use/index.d.ts +3 -0
  127. package/use/index.js +3 -0
  128. package/use/useFormPopout.d.ts +20 -0
  129. package/use/useFormPopout.js +42 -0
  130. package/use/usePopoutInput.d.ts +19 -0
  131. package/use/usePopoutInput.js +39 -0
  132. package/use/useTwoWayVisible.d.ts +9 -0
  133. package/use/useTwoWayVisible.js +13 -0
@@ -35,11 +35,13 @@ export const defaultConfig = {
35
35
  weekStartsOn: 0,
36
36
  },
37
37
  calendarInput: {
38
+ outletFormat: 'YYYY-MM-DD',
39
+ },
40
+ calendarPopout: {
38
41
  showConfirm: true,
39
42
  validateEvent: true,
40
- outletFormat: 'YYYY-MM-DD',
41
43
  },
42
- cascaderInput: {
44
+ cascaderPopout: {
43
45
  showConfirm: true,
44
46
  validateEvent: true,
45
47
  },
@@ -50,7 +52,7 @@ export const defaultConfig = {
50
52
  direction: 'vertical',
51
53
  validateEvent: true,
52
54
  },
53
- checkboxInput: {
55
+ checkboxPopout: {
54
56
  validateEvent: true,
55
57
  },
56
58
  countDown: {
@@ -76,13 +78,13 @@ export const defaultConfig = {
76
78
  datetimePicker: {
77
79
  type: 'yMd',
78
80
  },
79
- datetimePickerInput: {
81
+ datetimePickerPopout: {
80
82
  validateEvent: true,
81
83
  },
82
84
  datetimeRangePicker: {
83
85
  type: 'yMd',
84
86
  },
85
- datetimeRangePickerInput: {
87
+ datetimeRangePickerPopout: {
86
88
  validateEvent: true,
87
89
  },
88
90
  dialog: {
@@ -213,7 +215,7 @@ export const defaultConfig = {
213
215
  picker: {
214
216
  immediateChange: false,
215
217
  },
216
- pickerInput: {
218
+ pickerPopout: {
217
219
  validateEvent: true,
218
220
  },
219
221
  popout: {
@@ -266,7 +268,7 @@ export const defaultConfig = {
266
268
  direction: 'vertical',
267
269
  validateEvent: true,
268
270
  },
269
- radioInput: {
271
+ radioPopout: {
270
272
  validateEvent: true,
271
273
  type: 'circle',
272
274
  },
@@ -1,7 +1,9 @@
1
1
  <template>
2
- <slot :time="currentTime">
3
- {{ formatTime(format, currentTime) }}
4
- </slot>
2
+ <text>
3
+ <slot :time="currentTime">
4
+ {{ formatTime(format, currentTime) }}
5
+ </slot>
6
+ </text>
5
7
  </template>
6
8
 
7
9
  <script>
@@ -1,4 +1,5 @@
1
1
  import { type StyleValue } from 'vue';
2
+ import { type PickerSlots } from '../picker/common';
2
3
  export interface DatetimePickerProps {
3
4
  rootStyle?: StyleValue;
4
5
  rootClass?: string;
@@ -13,6 +14,8 @@ export interface DatetimePickerProps {
13
14
  export declare const defaultDatetimePickerProps: {
14
15
  type: string;
15
16
  };
17
+ export interface DatetimePickerSlots extends PickerSlots {
18
+ }
16
19
  export interface DatetimePickerEmits {
17
20
  (e: 'update:model-value', date: Date | string): void;
18
21
  (e: 'change', date: Date | string): void;
@@ -1,5 +1,6 @@
1
- import { type DatetimePickerProps } from './common';
2
- declare const _default: import("vue").DefineComponent<DatetimePickerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
1
+ import { type DatetimePickerProps, type DatetimePickerSlots } from './common';
2
+ declare function __VLS_template(): Readonly<DatetimePickerSlots> & DatetimePickerSlots;
3
+ declare const __VLS_component: import("vue").DefineComponent<DatetimePickerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
3
4
  "update:model-value": (date: string | Date) => any;
4
5
  change: (date: string | Date) => any;
5
6
  }, string, import("vue").PublicProps, Readonly<DatetimePickerProps> & Readonly<{
@@ -8,4 +9,10 @@ declare const _default: import("vue").DefineComponent<DatetimePickerProps, {}, {
8
9
  }>, {
9
10
  type: string;
10
11
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
12
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
11
13
  export default _default;
14
+ type __VLS_WithTemplateSlots<T, S> = T & {
15
+ new (): {
16
+ $slots: S;
17
+ };
18
+ };
@@ -1,23 +1,15 @@
1
- import { type DatetimePickerProps } from '../datetime-picker/common';
2
1
  import { type PopoutInputProps } from '../popout-input/common';
3
- import { type StyleValue } from 'vue';
4
- export interface DatetimePickerInputProps extends DatetimePickerProps, Omit<PopoutInputProps, 'modelValue' | 'loading'> {
5
- visible?: boolean;
6
- title?: string;
2
+ import { type DatetimePickerPopoutProps, type DatetimePickerPopoutEmits, type DatetimePickerPopoutSlots } from '../datetime-picker-popout/common';
3
+ export interface DatetimePickerInputProps extends DatetimePickerPopoutProps, Omit<PopoutInputProps, 'modelValue' | 'loading'> {
7
4
  outletFormat?: string;
8
- valueFormat?: string;
9
- validateEvent?: boolean;
10
- popoutClass?: string;
11
- popoutStyle?: StyleValue;
12
5
  }
13
6
  export declare const defaultDatetimePickerInputProps: () => {
14
7
  validateEvent: boolean;
15
8
  type: string;
16
9
  };
17
- export interface DatetimePickerInputEmits {
18
- (e: 'update:visible', visible: boolean): void;
19
- (e: 'update:model-value', date: Date | string | undefined): void;
20
- (e: 'change', date: Date | string | undefined): void;
10
+ export interface DatetimePickerInputSlots extends DatetimePickerPopoutSlots {
11
+ }
12
+ export interface DatetimePickerInputEmits extends DatetimePickerPopoutEmits {
21
13
  }
22
14
  export declare const mapTypeFormat: {
23
15
  y: string;
@@ -1,7 +1,7 @@
1
1
  import { defaultConfig } from '../config';
2
2
  export const defaultDatetimePickerInputProps = () => ({
3
3
  ...defaultConfig.datetimePicker,
4
- ...defaultConfig.datetimePickerInput,
4
+ ...defaultConfig.datetimePickerPopout,
5
5
  });
6
6
  export const mapTypeFormat = {
7
7
  y: 'YYYY',
@@ -1,5 +1,6 @@
1
- import { type DatetimePickerInputProps } from './common';
2
- declare const _default: import("vue").DefineComponent<DatetimePickerInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
1
+ import { type DatetimePickerInputProps, type DatetimePickerInputSlots } from './common';
2
+ declare function __VLS_template(): Readonly<DatetimePickerInputSlots> & DatetimePickerInputSlots;
3
+ declare const __VLS_component: import("vue").DefineComponent<DatetimePickerInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
3
4
  "update:model-value": (date: string | Date | undefined) => any;
4
5
  change: (date: string | Date | undefined) => any;
5
6
  "update:visible": (visible: boolean) => any;
@@ -11,4 +12,10 @@ declare const _default: import("vue").DefineComponent<DatetimePickerInputProps,
11
12
  type: string;
12
13
  validateEvent: boolean;
13
14
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
15
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
14
16
  export default _default;
17
+ type __VLS_WithTemplateSlots<T, S> = T & {
18
+ new (): {
19
+ $slots: S;
20
+ };
21
+ };
@@ -8,57 +8,42 @@
8
8
  :root-class="rootClass"
9
9
  :root-style="rootStyle"
10
10
  @clear="onClear"
11
- @click="onInputClick"
11
+ @click="show"
12
12
  >
13
- <sar-popout
13
+ <sar-datetime-picker-popout
14
+ v-model:visible="innerVisible"
15
+ v-model="innerValue"
14
16
  keep-render
15
- :visible="innerVisible"
16
17
  :title="title ?? placeholder"
17
18
  :root-class="popoutClass"
18
19
  :root-style="popoutStyle"
19
- @update:visible="onVisible"
20
- @confirm="onConfirm"
21
- @enter="onEnter"
22
- >
23
- <template #visible="{ already }">
24
- <sar-datetime-picker
25
- v-if="already"
26
- :model-value="popoutValue"
27
- @change="onChange"
28
- :type="type"
29
- :min="min"
30
- :max="max"
31
- :filter="filter"
32
- :formatter="formatter"
33
- :value-format="valueFormat"
34
- />
35
- </template>
36
- </sar-popout>
20
+ :type="type"
21
+ :min="min"
22
+ :max="max"
23
+ :filter="filter"
24
+ :formatter="formatter"
25
+ :value-format="valueFormat"
26
+ :validate-event="validateEvent"
27
+ @change="onChange"
28
+ />
37
29
  </sar-popout-input>
38
30
  </template>
39
31
 
40
32
  <script>
41
33
  import { mergeDefaults as _mergeDefaults, defineComponent as _defineComponent } from "vue";
42
- import { ref, watch, computed } from "vue";
34
+ import { watch } from "vue";
43
35
  import SarPopoutInput from "../popout-input/popout-input.vue";
44
- import SarPopout from "../popout/popout.vue";
45
- import SarDatetimePicker from "../datetime-picker/datetime-picker.vue";
46
- import { formatDate, isNullish, isString, parseDate, toDate } from "../../utils";
47
- import {
48
- getInitialValue,
49
- getMinDate,
50
- getMaxDate
51
- } from "../datetime-picker/common";
36
+ import SarDatetimePickerPopout from "../datetime-picker-popout/datetime-picker-popout.vue";
37
+ import { formatDate, isString, parseDate } from "../../utils";
38
+ import { usePopoutInput } from "../../use";
52
39
  import {
53
40
  defaultDatetimePickerInputProps,
54
41
  mapTypeFormat
55
42
  } from "./common";
56
- import { useFormItemContext } from "../form/common";
57
43
  export default _defineComponent({
58
44
  components: {
59
45
  SarPopoutInput,
60
- SarPopout,
61
- SarDatetimePicker,
46
+ SarDatetimePickerPopout,
62
47
  },
63
48
  ...{
64
49
  options: {
@@ -68,10 +53,9 @@ export default _defineComponent({
68
53
  },
69
54
  __name: "datetime-picker-input",
70
55
  props: _mergeDefaults({
56
+ outletFormat: { type: String, required: false },
71
57
  visible: { type: Boolean, required: false },
72
58
  title: { type: String, required: false },
73
- outletFormat: { type: String, required: false },
74
- valueFormat: { type: String, required: false },
75
59
  validateEvent: { type: Boolean, required: false },
76
60
  popoutClass: { type: String, required: false },
77
61
  popoutStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
@@ -83,6 +67,7 @@ export default _defineComponent({
83
67
  modelValue: { type: [Date, String], required: false },
84
68
  filter: { type: Function, required: false },
85
69
  formatter: { type: Function, required: false },
70
+ valueFormat: { type: String, required: false },
86
71
  placeholder: { type: String, required: false },
87
72
  readonly: { type: Boolean, required: false },
88
73
  disabled: { type: Boolean, required: false },
@@ -94,58 +79,7 @@ export default _defineComponent({
94
79
  __expose();
95
80
  const props = __props;
96
81
  const emit = __emit;
97
- const formItemContext = useFormItemContext();
98
- const innerValue = ref(props.modelValue);
99
- watch(
100
- () => props.modelValue,
101
- () => {
102
- innerValue.value = props.modelValue;
103
- if (props.validateEvent) {
104
- formItemContext?.onChange();
105
- }
106
- }
107
- );
108
- const popoutValue = ref(props.modelValue);
109
- const onChange = (value) => {
110
- popoutValue.value = value;
111
- };
112
- const onEnter = () => {
113
- if (!isNullish(innerValue.value) && popoutValue.value !== innerValue.value) {
114
- popoutValue.value = innerValue.value;
115
- }
116
- };
117
- const minDate = computed(
118
- () => toDate(props.min || getMinDate(), props.valueFormat)
119
- );
120
- const maxDate = computed(() => {
121
- const maxDate2 = toDate(props.max || getMaxDate());
122
- return maxDate2 < minDate.value ? new Date(minDate.value) : maxDate2;
123
- });
124
- const normalizeValue = (value) => {
125
- const date = value ? toDate(value, props.valueFormat) : new Date();
126
- return date < minDate.value ? new Date(minDate.value) : date > maxDate.value ? new Date(maxDate.value) : date;
127
- };
128
- watch([minDate, maxDate], () => {
129
- if (innerValue.value) {
130
- const oldDate = toDate(innerValue.value, props.valueFormat);
131
- const value = normalizeValue(innerValue.value);
132
- if (value.getTime() !== oldDate.getTime()) {
133
- popoutValue.value = value;
134
- onConfirm();
135
- }
136
- }
137
- });
138
- const onConfirm = () => {
139
- if (!popoutValue.value) {
140
- const initialValue = getInitialValue(minDate.value, maxDate.value);
141
- popoutValue.value = props.valueFormat ? formatDate(initialValue, props.valueFormat) : initialValue;
142
- }
143
- innerValue.value = popoutValue.value;
144
- emit("update:model-value", popoutValue.value);
145
- emit("change", popoutValue.value);
146
- inputValue.value = getInputValue();
147
- };
148
- const inputValue = ref("");
82
+ const { innerVisible, innerValue, inputValue, show, onChange, onClear } = usePopoutInput(props, emit);
149
83
  function getOutletText(value) {
150
84
  if (isString(value) && props.valueFormat) {
151
85
  value = parseDate(value, props.valueFormat);
@@ -173,28 +107,7 @@ export default _defineComponent({
173
107
  immediate: true
174
108
  }
175
109
  );
176
- const onClear = () => {
177
- inputValue.value = "";
178
- innerValue.value = void 0;
179
- emit("update:model-value", void 0);
180
- emit("change", void 0);
181
- };
182
- const innerVisible = ref(props.visible);
183
- watch(
184
- () => props.visible,
185
- () => {
186
- innerVisible.value = props.visible;
187
- }
188
- );
189
- const onVisible = (visible) => {
190
- innerVisible.value = visible;
191
- emit("update:visible", visible);
192
- };
193
- const onInputClick = () => {
194
- innerVisible.value = true;
195
- emit("update:visible", true);
196
- };
197
- const __returned__ = { props, emit, formItemContext, innerValue, popoutValue, onChange, onEnter, minDate, maxDate, normalizeValue, onConfirm, inputValue, getOutletText, getInputValue, onClear, innerVisible, onVisible, onInputClick, SarPopoutInput, SarPopout, SarDatetimePicker };
110
+ const __returned__ = { props, emit, innerVisible, innerValue, inputValue, show, onChange, onClear, getOutletText, getInputValue, SarPopoutInput, SarDatetimePickerPopout };
198
111
  return __returned__;
199
112
  }
200
113
  });
@@ -0,0 +1,22 @@
1
+ import { type StyleValue } from 'vue';
2
+ import { type DatetimePickerProps, type DatetimePickerSlots } from '../datetime-picker/common';
3
+ export interface DatetimePickerPopoutProps extends DatetimePickerProps {
4
+ visible?: boolean;
5
+ title?: string;
6
+ validateEvent?: boolean;
7
+ popoutClass?: string;
8
+ popoutStyle?: StyleValue;
9
+ }
10
+ export declare const defaultDatetimePickerPopoutProps: () => {
11
+ validateEvent: boolean;
12
+ type: string;
13
+ };
14
+ export interface DatetimePickerPopoutSlots extends DatetimePickerSlots {
15
+ }
16
+ export interface DatetimePickerPopoutEmits {
17
+ (e: 'update:visible', visible: boolean): void;
18
+ (e: 'update:model-value', date: Date | string | undefined): void;
19
+ (e: 'change', date: Date | string | undefined): void;
20
+ }
21
+ export interface DatetimePickerPopoutExpose {
22
+ }
@@ -0,0 +1,5 @@
1
+ import { defaultConfig } from '../config';
2
+ export const defaultDatetimePickerPopoutProps = () => ({
3
+ ...defaultConfig.datetimePicker,
4
+ ...defaultConfig.datetimePickerPopout,
5
+ });
@@ -0,0 +1,21 @@
1
+ import { type DatetimePickerPopoutProps, type DatetimePickerPopoutSlots } from './common';
2
+ declare function __VLS_template(): Readonly<DatetimePickerPopoutSlots> & DatetimePickerPopoutSlots;
3
+ declare const __VLS_component: import("vue").DefineComponent<DatetimePickerPopoutProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
4
+ "update:model-value": (date: string | Date | undefined) => any;
5
+ change: (date: string | Date | undefined) => any;
6
+ "update:visible": (visible: boolean) => any;
7
+ }, string, import("vue").PublicProps, Readonly<DatetimePickerPopoutProps> & Readonly<{
8
+ "onUpdate:model-value"?: ((date: string | Date | undefined) => any) | undefined;
9
+ onChange?: ((date: string | Date | undefined) => any) | undefined;
10
+ "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
11
+ }>, {
12
+ type: string;
13
+ validateEvent: boolean;
14
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
15
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
16
+ export default _default;
17
+ type __VLS_WithTemplateSlots<T, S> = T & {
18
+ new (): {
19
+ $slots: S;
20
+ };
21
+ };
@@ -0,0 +1,113 @@
1
+ <template>
2
+ <sar-popout
3
+ v-model:visible="innerVisible"
4
+ keep-render
5
+ :title="title"
6
+ :root-class="popoutClass"
7
+ :root-style="popoutStyle"
8
+ @confirm="onConfirm"
9
+ @enter="onEnter"
10
+ >
11
+ <template #visible="{ already }">
12
+ <sar-datetime-picker
13
+ v-if="already"
14
+ :model-value="popoutValue"
15
+ :type="type"
16
+ :min="min"
17
+ :max="max"
18
+ :filter="filter"
19
+ :formatter="formatter"
20
+ :value-format="valueFormat"
21
+ @change="onChange"
22
+ />
23
+ </template>
24
+ </sar-popout>
25
+ </template>
26
+
27
+ <script>
28
+ import { mergeDefaults as _mergeDefaults, defineComponent as _defineComponent } from "vue";
29
+ import { computed, watch } from "vue";
30
+ import SarPopout from "../popout/popout.vue";
31
+ import SarDatetimePicker from "../datetime-picker/datetime-picker.vue";
32
+ import {
33
+ defaultDatetimePickerPopoutProps
34
+ } from "./common";
35
+ import { formatDate, isNullish, toDate } from "../../utils";
36
+ import {
37
+ getInitialValue,
38
+ getMaxDate,
39
+ getMinDate
40
+ } from "../datetime-picker/common";
41
+ import { useFormPopout } from "../../use";
42
+ export default _defineComponent({
43
+ components: {
44
+ SarPopout,
45
+ SarDatetimePicker,
46
+ },
47
+ ...{
48
+ options: {
49
+ virtualHost: true,
50
+ styleIsolation: "shared"
51
+ }
52
+ },
53
+ __name: "datetime-picker-popout",
54
+ props: _mergeDefaults({
55
+ visible: { type: Boolean, required: false },
56
+ title: { type: String, required: false },
57
+ validateEvent: { type: Boolean, required: false },
58
+ popoutClass: { type: String, required: false },
59
+ popoutStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
60
+ rootStyle: { type: [Boolean, null, String, Object, Array], required: false, skipCheck: true },
61
+ rootClass: { type: String, required: false },
62
+ type: { type: String, required: false },
63
+ min: { type: [Date, String], required: false },
64
+ max: { type: [Date, String], required: false },
65
+ modelValue: { type: [Date, String], required: false },
66
+ filter: { type: Function, required: false },
67
+ formatter: { type: Function, required: false },
68
+ valueFormat: { type: String, required: false }
69
+ }, defaultDatetimePickerPopoutProps()),
70
+ emits: ["update:visible", "update:model-value", "change"],
71
+ setup(__props, { expose: __expose, emit: __emit }) {
72
+ __expose();
73
+ const props = __props;
74
+ const emit = __emit;
75
+ const minDate = computed(
76
+ () => toDate(props.min || getMinDate(), props.valueFormat)
77
+ );
78
+ const maxDate = computed(() => {
79
+ const maxDate2 = toDate(props.max || getMaxDate());
80
+ return maxDate2 < minDate.value ? new Date(minDate.value) : maxDate2;
81
+ });
82
+ const { innerVisible, innerValue, popoutValue, onChange, onConfirm } = useFormPopout(props, emit, {
83
+ onConfirmBefore() {
84
+ if (!popoutValue.value) {
85
+ const initialValue = getInitialValue(minDate.value, maxDate.value);
86
+ popoutValue.value = props.valueFormat ? formatDate(initialValue, props.valueFormat) : initialValue;
87
+ }
88
+ }
89
+ });
90
+ const onEnter = () => {
91
+ if (!isNullish(innerValue.value) && popoutValue.value !== innerValue.value) {
92
+ popoutValue.value = innerValue.value;
93
+ }
94
+ };
95
+ const normalizeValue = (value) => {
96
+ const date = value ? toDate(value, props.valueFormat) : new Date();
97
+ return date < minDate.value ? new Date(minDate.value) : date > maxDate.value ? new Date(maxDate.value) : date;
98
+ };
99
+ watch([minDate, maxDate], () => {
100
+ if (innerValue.value) {
101
+ const oldDate = toDate(innerValue.value, props.valueFormat);
102
+ const value = normalizeValue(innerValue.value);
103
+ if (value.getTime() !== oldDate.getTime()) {
104
+ popoutValue.value = value;
105
+ onConfirm();
106
+ }
107
+ }
108
+ });
109
+ const __returned__ = { props, emit, minDate, maxDate, innerVisible, innerValue, popoutValue, onChange, onConfirm, onEnter, normalizeValue, SarPopout, SarDatetimePicker };
110
+ return __returned__;
111
+ }
112
+ });
113
+ </script>
@@ -0,0 +1 @@
1
+ export type { DatetimePickerPopoutProps, DatetimePickerPopoutSlots, DatetimePickerPopoutEmits, DatetimePickerPopoutExpose, } from './common';
@@ -0,0 +1 @@
1
+ export {};
@@ -1,4 +1,4 @@
1
- import { type DatetimePickerProps } from '../datetime-picker/common';
1
+ import { type DatetimePickerSlots, type DatetimePickerProps } from '../datetime-picker/common';
2
2
  export interface DatetimeRangePickerProps extends Omit<DatetimePickerProps, 'modelValue'> {
3
3
  modelValue?: (Date | string)[];
4
4
  tabs?: string[];
@@ -6,8 +6,7 @@ export interface DatetimeRangePickerProps extends Omit<DatetimePickerProps, 'mod
6
6
  export declare const defaultDatetimeRangePickerProps: {
7
7
  type: string;
8
8
  };
9
- export interface DatetimeRangePickerSlots {
10
- default?(props: Record<string, never>): any;
9
+ export interface DatetimeRangePickerSlots extends DatetimePickerSlots {
11
10
  }
12
11
  export interface DatetimeRangePickerEmits {
13
12
  (e: 'update:model-value', date: (Date | string)[]): void;
@@ -1,21 +1,13 @@
1
- import { type DatetimeRangePickerProps } from '../datetime-range-picker/common';
1
+ import { type DatetimeRangePickerPopoutProps, type DatetimeRangePickerPopoutSlots, type DatetimeRangePickerPopoutEmits } from '../datetime-range-picker-popout/common';
2
2
  import { type PopoutInputProps } from '../popout-input/common';
3
- import { type StyleValue } from 'vue';
4
- export interface DatetimeRangePickerInputProps extends DatetimeRangePickerProps, Omit<PopoutInputProps, 'modelValue' | 'loading'> {
5
- visible?: boolean;
6
- title?: string;
3
+ export interface DatetimeRangePickerInputProps extends DatetimeRangePickerPopoutProps, Omit<PopoutInputProps, 'modelValue' | 'loading'> {
7
4
  outletFormat?: string;
8
- valueFormat?: string;
9
- validateEvent?: boolean;
10
- popoutClass?: string;
11
- popoutStyle?: StyleValue;
12
5
  }
13
6
  export declare const defaultDatetimeRangePickerInputProps: () => {
14
7
  validateEvent: boolean;
15
8
  type: string;
16
9
  };
17
- export interface DatetimeRangePickerInputEmits {
18
- (e: 'update:visible', visible: boolean): void;
19
- (e: 'update:model-value', date: (Date | string)[] | undefined): void;
20
- (e: 'change', date: (Date | string)[] | undefined): void;
10
+ export interface DatetimeRangePickerInputSlots extends DatetimeRangePickerPopoutSlots {
11
+ }
12
+ export interface DatetimeRangePickerInputEmits extends DatetimeRangePickerPopoutEmits {
21
13
  }
@@ -1,5 +1,5 @@
1
1
  import { defaultConfig } from '../config';
2
2
  export const defaultDatetimeRangePickerInputProps = () => ({
3
3
  ...defaultConfig.datetimeRangePicker,
4
- ...defaultConfig.datetimeRangePickerInput,
4
+ ...defaultConfig.datetimeRangePickerPopout,
5
5
  });
@@ -1,5 +1,6 @@
1
- import { type DatetimeRangePickerInputProps } from './common';
2
- declare const _default: import("vue").DefineComponent<DatetimeRangePickerInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
1
+ import { type DatetimeRangePickerInputProps, type DatetimeRangePickerInputSlots } from './common';
2
+ declare function __VLS_template(): Readonly<DatetimeRangePickerInputSlots> & DatetimeRangePickerInputSlots;
3
+ declare const __VLS_component: import("vue").DefineComponent<DatetimeRangePickerInputProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
3
4
  "update:model-value": (date: (string | Date)[] | undefined) => any;
4
5
  change: (date: (string | Date)[] | undefined) => any;
5
6
  "update:visible": (visible: boolean) => any;
@@ -11,4 +12,10 @@ declare const _default: import("vue").DefineComponent<DatetimeRangePickerInputPr
11
12
  type: string;
12
13
  validateEvent: boolean;
13
14
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
15
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
14
16
  export default _default;
17
+ type __VLS_WithTemplateSlots<T, S> = T & {
18
+ new (): {
19
+ $slots: S;
20
+ };
21
+ };