v-nuxt-ui 0.2.21 → 0.2.22
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.
- package/dist/module.json +1 -1
- package/dist/runtime/components/AsyncSelect.vue +9 -7
- package/dist/runtime/components/AsyncTreeSelect.vue +2 -1
- package/dist/runtime/components/Select.d.vue.ts +25 -0
- package/dist/runtime/components/Select.vue +67 -0
- package/dist/runtime/components/Select.vue.d.ts +25 -0
- package/dist/runtime/components/form/field/AsyncObjectSelect.vue +2 -1
- package/dist/runtime/components/form/field/AsyncSelect.vue +2 -1
- package/dist/runtime/components/form/field/AsyncTreeSelect.vue +2 -1
- package/dist/runtime/components/form/field/Select.d.vue.ts +19 -12
- package/dist/runtime/components/form/field/Select.vue +11 -6
- package/dist/runtime/components/form/field/Select.vue.d.ts +19 -12
- package/dist/runtime/components/form/field/index.vue +1 -7
- package/dist/runtime/components/sys/user/Table.vue +1 -0
- package/dist/runtime/components/table/query/where/simple/item/opr/AsyncSelect.vue +3 -1
- package/dist/runtime/components/table/query/where/simple/item/opr/Select.d.vue.ts +2 -7
- package/dist/runtime/components/table/query/where/simple/item/opr/Select.vue +20 -40
- package/dist/runtime/components/table/query/where/simple/item/opr/Select.vue.d.ts +2 -7
- package/dist/runtime/components/table/query/where/simple/item/opr/index.vue +1 -3
- package/dist/runtime/types/components/async-select.d.ts +1 -0
- package/dist/runtime/types/components/form/field.d.ts +4 -9
- package/dist/runtime/types/components/index.d.ts +1 -0
- package/dist/runtime/types/components/index.js +1 -0
- package/dist/runtime/types/components/select.d.ts +14 -0
- package/dist/runtime/types/components/select.js +0 -0
- package/dist/runtime/types/components/table/column.d.ts +3 -5
- package/package.json +1 -1
package/dist/module.json
CHANGED
|
@@ -25,7 +25,8 @@ const props = defineProps({
|
|
|
25
25
|
afterSelect: { type: Function, required: false },
|
|
26
26
|
canCreate: { type: Boolean, required: false },
|
|
27
27
|
createModalComponent: { type: null, required: false },
|
|
28
|
-
createModalOpenProps: { type: Object, required: false }
|
|
28
|
+
createModalOpenProps: { type: Object, required: false },
|
|
29
|
+
roundedNone: { type: Boolean, required: false }
|
|
29
30
|
});
|
|
30
31
|
const overlay = useOverlay();
|
|
31
32
|
const modelValue = defineModel("modelValue", { type: Object, ...{ required: true } });
|
|
@@ -117,6 +118,12 @@ const onSelect = (values) => {
|
|
|
117
118
|
};
|
|
118
119
|
}
|
|
119
120
|
};
|
|
121
|
+
const ui = computed(() => ({
|
|
122
|
+
root: ["min-w-32", props.roundedNone && "rounded-none"].filter(Boolean).join(" "),
|
|
123
|
+
base: "peer",
|
|
124
|
+
content: "min-w-fit",
|
|
125
|
+
tagsInput: "min-w-4 w-0"
|
|
126
|
+
}));
|
|
120
127
|
const dropdownOpen = ref(false);
|
|
121
128
|
const searchTerm = ref("");
|
|
122
129
|
const onDebounceFetchItems = useDebounceFn(onFetchItems, 512);
|
|
@@ -158,12 +165,7 @@ defineExpose({
|
|
|
158
165
|
open-on-focus
|
|
159
166
|
trailing
|
|
160
167
|
ignore-filter
|
|
161
|
-
:ui="
|
|
162
|
-
root: 'min-w-32',
|
|
163
|
-
base: 'peer',
|
|
164
|
-
content: 'min-w-fit',
|
|
165
|
-
tagsInput: 'min-w-4 w-0'
|
|
166
|
-
}"
|
|
168
|
+
:ui="ui"
|
|
167
169
|
:content="{
|
|
168
170
|
align: 'start'
|
|
169
171
|
}"
|
|
@@ -27,7 +27,8 @@ const props = defineProps({
|
|
|
27
27
|
afterSelect: { type: Function, required: false },
|
|
28
28
|
canCreate: { type: Boolean, required: false },
|
|
29
29
|
createModalComponent: { type: null, required: false },
|
|
30
|
-
createModalOpenProps: { type: Object, required: false }
|
|
30
|
+
createModalOpenProps: { type: Object, required: false },
|
|
31
|
+
roundedNone: { type: Boolean, required: false }
|
|
31
32
|
});
|
|
32
33
|
const modelValue = defineModel("modelValue", { type: Object, ...{ required: true } });
|
|
33
34
|
const treeModelValue = computed(() => allModels.value.filter((item) => item[props.valueField] === modelValue.value));
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { VSelectProps } from '#v/types';
|
|
2
|
+
declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
|
+
props: import("vue").PublicProps & __VLS_PrettifyLocal<(VSelectProps<T> & {
|
|
4
|
+
modelValue: string | number | string[] | number[] | undefined;
|
|
5
|
+
}) & {
|
|
6
|
+
"onUpdate:modelValue"?: ((value: string | number | string[] | number[] | undefined) => any) | undefined;
|
|
7
|
+
}> & (typeof globalThis extends {
|
|
8
|
+
__VLS_PROPS_FALLBACK: infer P;
|
|
9
|
+
} ? P : {});
|
|
10
|
+
expose: (exposed: import("vue").ShallowUnwrapRef<{
|
|
11
|
+
focus: () => void;
|
|
12
|
+
}>) => void;
|
|
13
|
+
attrs: any;
|
|
14
|
+
slots: {};
|
|
15
|
+
emit: (event: "update:modelValue", value: string | number | string[] | number[] | undefined) => void;
|
|
16
|
+
}>) => import("vue").VNode & {
|
|
17
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
18
|
+
};
|
|
19
|
+
declare const _default: typeof __VLS_export;
|
|
20
|
+
export default _default;
|
|
21
|
+
type __VLS_PrettifyLocal<T> = (T extends any ? {
|
|
22
|
+
[K in keyof T]: T[K];
|
|
23
|
+
} : {
|
|
24
|
+
[K in keyof T as K]: T[K];
|
|
25
|
+
}) & {};
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
<script setup>
|
|
2
|
+
import { computed, ref, useTemplateRef } from "vue";
|
|
3
|
+
const props = defineProps({
|
|
4
|
+
label: { type: String, required: false },
|
|
5
|
+
floatingPlaceholder: { type: Boolean, required: false },
|
|
6
|
+
disabled: { type: Boolean, required: false },
|
|
7
|
+
placeholder: { type: String, required: false },
|
|
8
|
+
size: { type: null, required: false },
|
|
9
|
+
icon: { type: null, required: false },
|
|
10
|
+
enableEmptyOption: { type: Boolean, required: false },
|
|
11
|
+
items: { type: Array, required: true },
|
|
12
|
+
multiple: { type: Boolean, required: false },
|
|
13
|
+
afterSelect: { type: Function, required: false },
|
|
14
|
+
roundedNone: { type: Boolean, required: false }
|
|
15
|
+
});
|
|
16
|
+
const modelValue = defineModel("modelValue", { type: null, ...{ required: true } });
|
|
17
|
+
const searchTerm = ref("");
|
|
18
|
+
const getItemLabel = (item) => {
|
|
19
|
+
if (typeof item === "string" || typeof item === "number" || typeof item === "boolean" || typeof item === "bigint") {
|
|
20
|
+
return String(item);
|
|
21
|
+
}
|
|
22
|
+
return String(item?.label ?? "");
|
|
23
|
+
};
|
|
24
|
+
const filteredItems = computed(() => {
|
|
25
|
+
if (!searchTerm.value) {
|
|
26
|
+
return props.items;
|
|
27
|
+
}
|
|
28
|
+
return props.items.filter((item) => getItemLabel(item).toLowerCase().includes(searchTerm.value.toLowerCase()));
|
|
29
|
+
});
|
|
30
|
+
const ui = computed(() => ({
|
|
31
|
+
root: ["min-w-32", props.roundedNone && "rounded-none"].filter(Boolean).join(" "),
|
|
32
|
+
base: "peer",
|
|
33
|
+
content: "min-w-fit",
|
|
34
|
+
tagsInput: "min-w-4 w-0"
|
|
35
|
+
}));
|
|
36
|
+
const inputMenuRef = useTemplateRef("inputMenu");
|
|
37
|
+
defineExpose({
|
|
38
|
+
focus: () => {
|
|
39
|
+
inputMenuRef.value?.inputRef.focus();
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
</script>
|
|
43
|
+
|
|
44
|
+
<template>
|
|
45
|
+
<UInputMenu
|
|
46
|
+
ref="inputMenu"
|
|
47
|
+
v-model:search-term="searchTerm"
|
|
48
|
+
v-model="modelValue"
|
|
49
|
+
:items="filteredItems"
|
|
50
|
+
:placeholder="placeholder"
|
|
51
|
+
:multiple="multiple ?? false"
|
|
52
|
+
:size="size"
|
|
53
|
+
color="neutral"
|
|
54
|
+
delete-icon="i-lucide-trash"
|
|
55
|
+
value-key="value"
|
|
56
|
+
clear
|
|
57
|
+
clear-icon="i-lucide-circle-x"
|
|
58
|
+
:icon="icon"
|
|
59
|
+
:disabled="disabled"
|
|
60
|
+
open-on-focus
|
|
61
|
+
trailing
|
|
62
|
+
:ui="ui"
|
|
63
|
+
:content="{
|
|
64
|
+
align: 'start'
|
|
65
|
+
}"
|
|
66
|
+
/>
|
|
67
|
+
</template>
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { VSelectProps } from '#v/types';
|
|
2
|
+
declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
|
+
props: import("vue").PublicProps & __VLS_PrettifyLocal<(VSelectProps<T> & {
|
|
4
|
+
modelValue: string | number | string[] | number[] | undefined;
|
|
5
|
+
}) & {
|
|
6
|
+
"onUpdate:modelValue"?: ((value: string | number | string[] | number[] | undefined) => any) | undefined;
|
|
7
|
+
}> & (typeof globalThis extends {
|
|
8
|
+
__VLS_PROPS_FALLBACK: infer P;
|
|
9
|
+
} ? P : {});
|
|
10
|
+
expose: (exposed: import("vue").ShallowUnwrapRef<{
|
|
11
|
+
focus: () => void;
|
|
12
|
+
}>) => void;
|
|
13
|
+
attrs: any;
|
|
14
|
+
slots: {};
|
|
15
|
+
emit: (event: "update:modelValue", value: string | number | string[] | number[] | undefined) => void;
|
|
16
|
+
}>) => import("vue").VNode & {
|
|
17
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
18
|
+
};
|
|
19
|
+
declare const _default: typeof __VLS_export;
|
|
20
|
+
export default _default;
|
|
21
|
+
type __VLS_PrettifyLocal<T> = (T extends any ? {
|
|
22
|
+
[K in keyof T]: T[K];
|
|
23
|
+
} : {
|
|
24
|
+
[K in keyof T as K]: T[K];
|
|
25
|
+
}) & {};
|
|
@@ -23,7 +23,8 @@ const props = defineProps({
|
|
|
23
23
|
afterSelect: { type: Function, required: false },
|
|
24
24
|
canCreate: { type: Boolean, required: false },
|
|
25
25
|
createModalComponent: { type: null, required: false },
|
|
26
|
-
createModalOpenProps: { type: Object, required: false }
|
|
26
|
+
createModalOpenProps: { type: Object, required: false },
|
|
27
|
+
roundedNone: { type: Boolean, required: false }
|
|
27
28
|
});
|
|
28
29
|
const modelValue = defineModel("modelValue", { type: null, ...{ required: true } });
|
|
29
30
|
const modelValueWithValueField = ref(modelValue.value?.map((item) => item[props.valueField]));
|
|
@@ -28,7 +28,8 @@ const props = defineProps({
|
|
|
28
28
|
afterSelect: { type: Function, required: false },
|
|
29
29
|
canCreate: { type: Boolean, required: false },
|
|
30
30
|
createModalComponent: { type: null, required: false },
|
|
31
|
-
createModalOpenProps: { type: Object, required: false }
|
|
31
|
+
createModalOpenProps: { type: Object, required: false },
|
|
32
|
+
roundedNone: { type: Boolean, required: false }
|
|
32
33
|
});
|
|
33
34
|
const modelValue = defineModel("modelValue", { type: null, ...{ required: true } });
|
|
34
35
|
const asyncSelectModelValue = computed({
|
|
@@ -27,7 +27,8 @@ const props = defineProps({
|
|
|
27
27
|
afterSelect: { type: Function, required: false },
|
|
28
28
|
canCreate: { type: Boolean, required: false },
|
|
29
29
|
createModalComponent: { type: null, required: false },
|
|
30
|
-
createModalOpenProps: { type: Object, required: false }
|
|
30
|
+
createModalOpenProps: { type: Object, required: false },
|
|
31
|
+
roundedNone: { type: Boolean, required: false }
|
|
31
32
|
});
|
|
32
33
|
const modelValue = defineModel("modelValue", { type: null, ...{ required: true } });
|
|
33
34
|
const asyncTreeSelectModelValue = computed({
|
|
@@ -1,16 +1,23 @@
|
|
|
1
1
|
import type { VFormFieldSelectProps } from '#v/types';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
} &
|
|
6
|
-
|
|
7
|
-
|
|
2
|
+
declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
|
+
props: import("vue").PublicProps & __VLS_PrettifyLocal<(VFormFieldSelectProps<T> & {
|
|
4
|
+
modelValue: string | number | string[] | number[] | undefined;
|
|
5
|
+
}) & {
|
|
6
|
+
"onUpdate:modelValue"?: ((value: string | number | string[] | number[] | undefined) => any) | undefined;
|
|
7
|
+
}> & (typeof globalThis extends {
|
|
8
|
+
__VLS_PROPS_FALLBACK: infer P;
|
|
9
|
+
} ? P : {});
|
|
10
|
+
expose: (exposed: {}) => void;
|
|
11
|
+
attrs: any;
|
|
12
|
+
slots: {};
|
|
13
|
+
emit: (event: "update:modelValue", value: string | number | string[] | number[] | undefined) => void;
|
|
14
|
+
}>) => import("vue").VNode & {
|
|
15
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
8
16
|
};
|
|
9
|
-
type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
10
|
-
declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
11
|
-
"update:modelValue": (value: string | null | undefined) => any;
|
|
12
|
-
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
13
|
-
"onUpdate:modelValue"?: ((value: string | null | undefined) => any) | undefined;
|
|
14
|
-
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
15
17
|
declare const _default: typeof __VLS_export;
|
|
16
18
|
export default _default;
|
|
19
|
+
type __VLS_PrettifyLocal<T> = (T extends any ? {
|
|
20
|
+
[K in keyof T]: T[K];
|
|
21
|
+
} : {
|
|
22
|
+
[K in keyof T as K]: T[K];
|
|
23
|
+
}) & {};
|
|
@@ -1,13 +1,18 @@
|
|
|
1
1
|
<script setup>
|
|
2
2
|
import { computed } from "vue";
|
|
3
|
+
import VSelect from "#v/components/Select.vue";
|
|
3
4
|
const props = defineProps({
|
|
5
|
+
label: { type: String, required: false },
|
|
6
|
+
floatingPlaceholder: { type: Boolean, required: false },
|
|
4
7
|
disabled: { type: Boolean, required: false },
|
|
5
|
-
|
|
8
|
+
placeholder: { type: String, required: false },
|
|
9
|
+
size: { type: null, required: false },
|
|
10
|
+
icon: { type: null, required: false },
|
|
11
|
+
enableEmptyOption: { type: Boolean, required: false },
|
|
6
12
|
items: { type: Array, required: true },
|
|
7
|
-
searchable: { type: Boolean, required: false },
|
|
8
13
|
multiple: { type: Boolean, required: false },
|
|
9
|
-
|
|
10
|
-
|
|
14
|
+
afterSelect: { type: Function, required: false },
|
|
15
|
+
roundedNone: { type: Boolean, required: false }
|
|
11
16
|
});
|
|
12
17
|
const modelValue = defineModel("modelValue", { type: null, ...{ required: true } });
|
|
13
18
|
const selectItems = computed(
|
|
@@ -16,10 +21,10 @@ const selectItems = computed(
|
|
|
16
21
|
</script>
|
|
17
22
|
|
|
18
23
|
<template>
|
|
19
|
-
<
|
|
24
|
+
<VSelect
|
|
20
25
|
v-model="modelValue"
|
|
26
|
+
v-bind="props"
|
|
21
27
|
:items="selectItems"
|
|
22
|
-
:search-input="searchable ?? false"
|
|
23
28
|
:icon="icon ? icon : multiple ? 'i-lucide-list-todo' : void 0"
|
|
24
29
|
:placeholder="placeholder"
|
|
25
30
|
value-key="value"
|
|
@@ -1,16 +1,23 @@
|
|
|
1
1
|
import type { VFormFieldSelectProps } from '#v/types';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
} &
|
|
6
|
-
|
|
7
|
-
|
|
2
|
+
declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
3
|
+
props: import("vue").PublicProps & __VLS_PrettifyLocal<(VFormFieldSelectProps<T> & {
|
|
4
|
+
modelValue: string | number | string[] | number[] | undefined;
|
|
5
|
+
}) & {
|
|
6
|
+
"onUpdate:modelValue"?: ((value: string | number | string[] | number[] | undefined) => any) | undefined;
|
|
7
|
+
}> & (typeof globalThis extends {
|
|
8
|
+
__VLS_PROPS_FALLBACK: infer P;
|
|
9
|
+
} ? P : {});
|
|
10
|
+
expose: (exposed: {}) => void;
|
|
11
|
+
attrs: any;
|
|
12
|
+
slots: {};
|
|
13
|
+
emit: (event: "update:modelValue", value: string | number | string[] | number[] | undefined) => void;
|
|
14
|
+
}>) => import("vue").VNode & {
|
|
15
|
+
__ctx?: Awaited<typeof __VLS_setup>;
|
|
8
16
|
};
|
|
9
|
-
type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
10
|
-
declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
11
|
-
"update:modelValue": (value: string | null | undefined) => any;
|
|
12
|
-
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
13
|
-
"onUpdate:modelValue"?: ((value: string | null | undefined) => any) | undefined;
|
|
14
|
-
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
15
17
|
declare const _default: typeof __VLS_export;
|
|
16
18
|
export default _default;
|
|
19
|
+
type __VLS_PrettifyLocal<T> = (T extends any ? {
|
|
20
|
+
[K in keyof T]: T[K];
|
|
21
|
+
} : {
|
|
22
|
+
[K in keyof T as K]: T[K];
|
|
23
|
+
}) & {};
|
|
@@ -110,13 +110,7 @@ const fieldModelValue = computed({
|
|
|
110
110
|
<FormFieldSelect
|
|
111
111
|
v-else-if="field.type === 'select'"
|
|
112
112
|
v-model="fieldModelValue"
|
|
113
|
-
|
|
114
|
-
:searchable="field.searchable ?? false"
|
|
115
|
-
:icon="field.icon ? field.icon : field.multiple ? 'i-lucide-list-todo' : void 0"
|
|
116
|
-
:enable-empty-option="field.enableEmptyOption"
|
|
117
|
-
:placeholder="field.placeholder"
|
|
118
|
-
value-key="value"
|
|
119
|
-
:disabled="field.disabled"
|
|
113
|
+
v-bind="field"
|
|
120
114
|
/>
|
|
121
115
|
<USelectMenu
|
|
122
116
|
v-else-if="field.type === 'multiple-select-string'"
|
|
@@ -21,7 +21,8 @@ const props = defineProps({
|
|
|
21
21
|
afterSelect: { type: Function, required: false },
|
|
22
22
|
canCreate: { type: Boolean, required: false },
|
|
23
23
|
createModalComponent: { type: null, required: false },
|
|
24
|
-
createModalOpenProps: { type: Object, required: false }
|
|
24
|
+
createModalOpenProps: { type: Object, required: false },
|
|
25
|
+
roundedNone: { type: Boolean, required: false }
|
|
25
26
|
});
|
|
26
27
|
const whereQueryItem = defineModel("whereQueryItem", { type: Object, ...{ required: true } });
|
|
27
28
|
const modelValue = computed({
|
|
@@ -53,5 +54,6 @@ defineExpose({
|
|
|
53
54
|
v-bind="props"
|
|
54
55
|
v-model="modelValue"
|
|
55
56
|
:placeholder="`\u8BF7\u9009\u62E9${label ?? ''}`"
|
|
57
|
+
rounded-none
|
|
56
58
|
/>
|
|
57
59
|
</template>
|
|
@@ -1,11 +1,6 @@
|
|
|
1
|
-
import type { WhereQueryItem } from '#v/types';
|
|
2
|
-
import type { InputMenuItem, InputMenuProps } from '@nuxt/ui';
|
|
1
|
+
import type { VSelectProps, WhereQueryItem } from '#v/types';
|
|
3
2
|
declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
4
|
-
props: import("vue").PublicProps & __VLS_PrettifyLocal<({
|
|
5
|
-
disabled?: boolean;
|
|
6
|
-
items: InputMenuItem[];
|
|
7
|
-
placeholder?: InputMenuProps["placeholder"];
|
|
8
|
-
} & {
|
|
3
|
+
props: import("vue").PublicProps & __VLS_PrettifyLocal<(VSelectProps<T> & {
|
|
9
4
|
whereQueryItem: WhereQueryItem<T>;
|
|
10
5
|
}) & {
|
|
11
6
|
"onUpdate:whereQueryItem"?: ((value: WhereQueryItem<T>) => any) | undefined;
|
|
@@ -1,12 +1,21 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import { computed,
|
|
2
|
+
import { computed, useTemplateRef } from "vue";
|
|
3
|
+
import VSelect from "#v/components/Select.vue";
|
|
3
4
|
const props = defineProps({
|
|
5
|
+
label: { type: String, required: false },
|
|
6
|
+
floatingPlaceholder: { type: Boolean, required: false },
|
|
4
7
|
disabled: { type: Boolean, required: false },
|
|
8
|
+
placeholder: { type: String, required: false },
|
|
9
|
+
size: { type: null, required: false, default: "sm" },
|
|
10
|
+
icon: { type: null, required: false },
|
|
11
|
+
enableEmptyOption: { type: Boolean, required: false },
|
|
5
12
|
items: { type: Array, required: true },
|
|
6
|
-
|
|
13
|
+
multiple: { type: Boolean, required: false },
|
|
14
|
+
afterSelect: { type: Function, required: false },
|
|
15
|
+
roundedNone: { type: Boolean, required: false }
|
|
7
16
|
});
|
|
8
17
|
const whereQueryItem = defineModel("whereQueryItem", { type: Object, ...{ required: true } });
|
|
9
|
-
const
|
|
18
|
+
const modelValue = computed({
|
|
10
19
|
get() {
|
|
11
20
|
return whereQueryItem.value.value;
|
|
12
21
|
},
|
|
@@ -14,49 +23,20 @@ const inputMenuValue = computed({
|
|
|
14
23
|
whereQueryItem.value = { ...whereQueryItem.value, value: newValue };
|
|
15
24
|
}
|
|
16
25
|
});
|
|
17
|
-
const
|
|
18
|
-
const filteredItems = computed(() => {
|
|
19
|
-
if (!searchTerm.value) {
|
|
20
|
-
return props.items;
|
|
21
|
-
}
|
|
22
|
-
return props.items.filter((item) => item?.label.toLowerCase().includes(searchTerm.value.toLowerCase()));
|
|
23
|
-
});
|
|
24
|
-
const inputMenuRef = useTemplateRef("inputMenu");
|
|
26
|
+
const selectRef = useTemplateRef("select");
|
|
25
27
|
defineExpose({
|
|
26
28
|
focus: () => {
|
|
27
|
-
|
|
29
|
+
selectRef.value?.focus();
|
|
28
30
|
}
|
|
29
31
|
});
|
|
30
32
|
</script>
|
|
31
33
|
|
|
32
34
|
<template>
|
|
33
|
-
<
|
|
34
|
-
ref="
|
|
35
|
-
v-
|
|
36
|
-
v-model="
|
|
37
|
-
:
|
|
38
|
-
|
|
39
|
-
multiple
|
|
40
|
-
color="neutral"
|
|
41
|
-
delete-icon="i-lucide-trash"
|
|
42
|
-
value-key="value"
|
|
43
|
-
clear
|
|
44
|
-
clear-icon="i-lucide-circle-x"
|
|
45
|
-
icon=""
|
|
46
|
-
:disabled="disabled"
|
|
47
|
-
open-on-focus
|
|
48
|
-
trailing
|
|
49
|
-
:ui="{
|
|
50
|
-
root: 'rounded-none min-w-32',
|
|
51
|
-
// TODO: 不然有rounded,这个应该是个bug
|
|
52
|
-
content: 'min-w-fit',
|
|
53
|
-
tagsInput: 'min-w-4 w-0'
|
|
54
|
-
}"
|
|
55
|
-
:content="{
|
|
56
|
-
align: 'start'
|
|
57
|
-
}"
|
|
58
|
-
@update:model-value="() => {
|
|
59
|
-
inputMenuRef?.inputRef.focus();
|
|
60
|
-
}"
|
|
35
|
+
<VSelect
|
|
36
|
+
ref="select"
|
|
37
|
+
v-bind="props"
|
|
38
|
+
v-model="modelValue"
|
|
39
|
+
:placeholder="`\u8BF7\u9009\u62E9${label ?? ''}`"
|
|
40
|
+
rounded-none
|
|
61
41
|
/>
|
|
62
42
|
</template>
|
|
@@ -1,11 +1,6 @@
|
|
|
1
|
-
import type { WhereQueryItem } from '#v/types';
|
|
2
|
-
import type { InputMenuItem, InputMenuProps } from '@nuxt/ui';
|
|
1
|
+
import type { VSelectProps, WhereQueryItem } from '#v/types';
|
|
3
2
|
declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
4
|
-
props: import("vue").PublicProps & __VLS_PrettifyLocal<({
|
|
5
|
-
disabled?: boolean;
|
|
6
|
-
items: InputMenuItem[];
|
|
7
|
-
placeholder?: InputMenuProps["placeholder"];
|
|
8
|
-
} & {
|
|
3
|
+
props: import("vue").PublicProps & __VLS_PrettifyLocal<(VSelectProps<T> & {
|
|
9
4
|
whereQueryItem: WhereQueryItem<T>;
|
|
10
5
|
}) & {
|
|
11
6
|
"onUpdate:whereQueryItem"?: ((value: WhereQueryItem<T>) => any) | undefined;
|
|
@@ -48,8 +48,7 @@ defineExpose({
|
|
|
48
48
|
ref="item"
|
|
49
49
|
v-model:where-query-item="whereQueryItem"
|
|
50
50
|
:disabled="fetching"
|
|
51
|
-
|
|
52
|
-
:placeholder="option.placeholder"
|
|
51
|
+
v-bind="option"
|
|
53
52
|
/>
|
|
54
53
|
<TableQueryWhereSimpleItemOprDatePicker
|
|
55
54
|
v-else-if="option.type === 'date-picker'"
|
|
@@ -62,7 +61,6 @@ defineExpose({
|
|
|
62
61
|
ref="item"
|
|
63
62
|
v-model:where-query-item="whereQueryItem"
|
|
64
63
|
:disabled="fetching"
|
|
65
|
-
:trigger-fetching="triggerFetching"
|
|
66
64
|
v-bind="option"
|
|
67
65
|
/>
|
|
68
66
|
</template>
|
|
@@ -22,6 +22,7 @@ export type VAsyncSelectProps<T> = {
|
|
|
22
22
|
canCreate?: boolean;
|
|
23
23
|
createModalComponent?: Component;
|
|
24
24
|
createModalOpenProps?: Record<string, any>;
|
|
25
|
+
roundedNone?: boolean;
|
|
25
26
|
};
|
|
26
27
|
export type AsyncSelectValue = string[] | number[] | string | number | undefined;
|
|
27
28
|
export type AsyncSelectCombinedValue = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import type { VNode } from 'vue';
|
|
2
|
-
import type { ButtonProps, FormFieldProps, InputProps, RadioGroupProps, SelectMenuItem,
|
|
2
|
+
import type { ButtonProps, FormFieldProps, InputProps, RadioGroupProps, SelectMenuItem, TreeItem } from '@nuxt/ui';
|
|
3
3
|
import type { ZodType } from 'zod';
|
|
4
|
-
import type { VAsyncSelectProps } from '#v/types';
|
|
4
|
+
import type { VAsyncSelectProps, VSelectProps } from '#v/types';
|
|
5
5
|
export type VFormFieldAsyncSelectProps<T> = {
|
|
6
6
|
initModel?: any | any[];
|
|
7
7
|
onUpdateInitModel?(model: any | any[] | undefined): void;
|
|
@@ -16,12 +16,7 @@ export type VFormFieldTreeSelectTransferProps = {
|
|
|
16
16
|
onUpdateTargetTreeItems: (val: TreeItem[]) => void;
|
|
17
17
|
disabled?: boolean;
|
|
18
18
|
};
|
|
19
|
-
export type VFormFieldSelectProps = {
|
|
20
|
-
items: SelectMenuItem[];
|
|
21
|
-
searchable?: boolean;
|
|
22
|
-
multiple?: SelectProps['multiple'];
|
|
23
|
-
enableEmptyOption?: boolean;
|
|
24
|
-
} & Pick<SelectProps, 'placeholder'>;
|
|
19
|
+
export type VFormFieldSelectProps<T> = {} & VSelectProps<T>;
|
|
25
20
|
export type VFormFieldDynamicObjectInputProps = {
|
|
26
21
|
objectFields: Array<{
|
|
27
22
|
key: string;
|
|
@@ -66,7 +61,7 @@ export type VFormFieldProps = FormFieldProps & {
|
|
|
66
61
|
peerButtons?: ButtonProps[];
|
|
67
62
|
} | {
|
|
68
63
|
type: 'select';
|
|
69
|
-
} & VFormFieldSelectProps | {
|
|
64
|
+
} & VFormFieldSelectProps<any> | {
|
|
70
65
|
type: 'multiple-select-string';
|
|
71
66
|
items: SelectMenuItem[];
|
|
72
67
|
searchable?: boolean;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type { InputMenuItem, InputMenuProps } from '@nuxt/ui';
|
|
2
|
+
export type VSelectProps<T> = {
|
|
3
|
+
label?: string;
|
|
4
|
+
floatingPlaceholder?: boolean;
|
|
5
|
+
disabled?: InputMenuProps['disabled'];
|
|
6
|
+
placeholder?: InputMenuProps['placeholder'];
|
|
7
|
+
size?: InputMenuProps['size'];
|
|
8
|
+
icon?: InputMenuProps['icon'];
|
|
9
|
+
enableEmptyOption?: boolean;
|
|
10
|
+
items: InputMenuItem[];
|
|
11
|
+
multiple?: boolean;
|
|
12
|
+
afterSelect?(selected: T | T[] | undefined): void;
|
|
13
|
+
roundedNone?: boolean;
|
|
14
|
+
};
|
|
File without changes
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { OrderQueryOpr, WhereQueryOpr } from '../../query.js';
|
|
2
|
-
import type {
|
|
3
|
-
import type {
|
|
2
|
+
import type { BadgeProps, TableColumn } from '@nuxt/ui';
|
|
3
|
+
import type { VAsyncSelectProps, VSelectProps } from '../../index.js';
|
|
4
4
|
export type WhereQueryType = 'input' | 'input-number' | 'date-picker' | 'select' | 'async-select' | 'unknown';
|
|
5
5
|
export type WhereQueryColumnOption<T> = {
|
|
6
6
|
defaultOpr?: WhereQueryOpr;
|
|
@@ -17,10 +17,8 @@ export type WhereQueryColumnOption<T> = {
|
|
|
17
17
|
} | {
|
|
18
18
|
type: 'select';
|
|
19
19
|
variant?: BadgeProps['variant'];
|
|
20
|
-
items: SelectOption[];
|
|
21
20
|
empty?: BadgeProps;
|
|
22
|
-
|
|
23
|
-
} | {
|
|
21
|
+
} & VSelectProps<T> | {
|
|
24
22
|
type: 'async-select';
|
|
25
23
|
} & VAsyncSelectProps<T> | {
|
|
26
24
|
type: 'unknown';
|
package/package.json
CHANGED