tdesign-pro-component
Version:
ProComponents tdesign-vue-next + Vue3 + TS
352 lines (351 loc) • 12.3 kB
JavaScript
import { a as O, i as H, w as J } from "./utils-DU1amZow.js";
import { defineComponent as K, ref as B, useSlots as Q, onMounted as X, watch as z, resolveComponent as k, openBlock as r, createBlock as p, mergeProps as $, withCtx as n, createSlots as f, createVNode as Y, unref as E, isRef as M, createElementBlock as m, Fragment as v, renderList as y, renderSlot as t } from "vue";
import { u as Z } from "./hooks-9GWkbKry.js";
const x = /* @__PURE__ */ K({
name: "ProFormSelect",
__name: "ProFormSelect",
props: {
name: {},
modelValue: { type: [String, Number, Boolean, null, Array] },
data: {},
label: {},
rules: {},
formItemProps: {},
labelWidth: {},
labelAlign: { default: "left" },
requiredMark: { type: Boolean },
append: {},
prepend: {},
size: {},
labelName: { default: "label" },
valueName: { default: "value" },
disabled: { type: Boolean },
readonly: { type: Boolean },
multiple: { type: Boolean },
placeholder: {},
autofocus: { type: Boolean },
autoWidth: { type: Boolean },
borderless: { type: Boolean },
clearable: { type: Boolean },
creatable: { type: Boolean },
filterable: { type: Boolean },
loading: { type: Boolean },
loadingText: {},
selectProps: {},
selectLabel: {},
optionGroup: { type: Boolean }
},
emits: ["update:modelValue", "change", "create", "enter", "focus", "input-change", "popup-visible-change", "remove", "search"],
setup(j, { expose: A, emit: G }) {
const e = j, s = G, c = B([]), h = B(!1), C = B(!1), i = Z(e, "modelValue", s, e.modelValue ? e.modelValue : e.multiple ? [] : ""), g = B(), o = Q();
X(() => {
e.name || O("name is empty"), T();
});
function T() {
H(e.data) ? (h.value = !0, e.data().then((l) => {
c.value = l.map((u) => _(u));
}).finally(() => {
h.value = !1;
})) : c.value = e.data.map((l) => _(l));
}
function _(l) {
var u;
return l.group ? (C.value = !0, {
...l,
children: (u = l.children) == null ? void 0 : u.map((b) => ({ label: b[e.labelName], value: b[e.valueName], disabled: b.disabled }))
}) : (C.value = !1, { label: l[e.labelName], value: l[e.valueName], disabled: l.disabled });
}
function P(l) {
s("change", l);
}
function I(l) {
s("create", l);
}
function W(l) {
s("enter", l);
}
function S(l) {
s("focus", l);
}
function D(l) {
s("remove", l);
}
function F(l, u) {
s("search", l, u);
}
function N(l, u) {
s("input-change", l, u);
}
function R(l, u) {
s("popup-visible-change", l, u);
}
return z(() => e.loading, (l) => h.value = l), z(() => e.data, () => {
T();
}), A({
getValue: () => i.value,
focus: () => g.value.focus(),
blur: () => g.value.blur(),
clear: () => {
i.value = e.multiple ? [] : "";
},
getRef: () => g.value
}), (l, u) => {
const b = k("t-option"), w = k("t-option-group"), L = k("t-select"), U = k("t-input-adornment"), q = k("t-form-item");
return r(), p(q, $({
name: e.name
}, e.formItemProps, {
label: e.label,
rules: e.rules,
labelWidth: e.labelWidth
}), {
default: n(() => [
o.prepend || o.append || e.prepend || e.append ? (r(), p(U, {
key: 0,
prepend: e.prepend,
append: e.append
}, f({
default: n(() => [
Y(L, $({
ref_key: "selectRef",
ref: g,
label: e.selectLabel,
creatable: e.creatable,
size: e.size,
filterable: e.filterable,
clearable: e.clearable,
borderless: e.borderless,
autoWidth: e.autoWidth,
autofocus: e.autofocus,
loadingText: e.loadingText,
loading: h.value
}, e.selectProps, {
multiple: e.multiple,
disabled: e.disabled,
readonly: e.readonly,
modelValue: E(i),
"onUpdate:modelValue": u[0] || (u[0] = (a) => M(i) ? i.value = a : null),
placeholder: e.placeholder || `请选择${l.label || "数据"}`,
onChange: P,
onCreate: I,
onEnter: W,
onFocus: S,
onInputChange: N,
onSearch: F,
onPopupVisibleChange: R,
onRemove: D
}), f({
default: n(() => [
C.value ? (r(!0), m(v, { key: 0 }, y(c.value, (a, V) => (r(), p(w, {
key: V,
label: typeof a.group == "object" ? a.group.label : a.group,
divider: ""
}, {
default: n(() => [
(r(!0), m(v, null, y(a.children, (d) => (r(), p(b, {
key: d.value,
value: d.value,
label: d.label
}, f({ _: 2 }, [
o.default ? {
name: "default",
fn: n(() => [
t(l.$slots, "default", {
value: d.value,
label: d.label
})
]),
key: "0"
} : void 0
]), 1032, ["value", "label"]))), 128))
]),
_: 2
}, 1032, ["label"]))), 128)) : (r(!0), m(v, { key: 1 }, y(c.value, (a) => (r(), p(b, {
key: a.value,
value: a.value,
label: a.label
}, f({ _: 2 }, [
o.default ? {
name: "default",
fn: n(() => [
t(l.$slots, "default", {
value: a.value,
label: a.label
})
]),
key: "0"
} : void 0
]), 1032, ["value", "label"]))), 128))
]),
_: 2
}, [
o.prefixIcon ? {
name: "prefixIcon",
fn: n(() => [
t(l.$slots, "prefixIcon")
]),
key: "0"
} : void 0,
o.panelTopContent ? {
name: "panelTopContent",
fn: n(() => [
t(l.$slots, "panelTopContent")
]),
key: "1"
} : void 0,
o.panelBottomContent ? {
name: "panelBottomContent",
fn: n(() => [
t(l.$slots, "panelTopContent")
]),
key: "2"
} : void 0,
o.valueDisplay ? {
name: "valueDisplay",
fn: n(({ value: a }) => [
t(l.$slots, "valueDisplay", { value: a })
]),
key: "3"
} : void 0,
o["select-label"] ? {
name: "label",
fn: n(() => [
t(l.$slots, "select-label")
]),
key: "4"
} : void 0
]), 1040, ["label", "creatable", "size", "filterable", "clearable", "borderless", "autoWidth", "autofocus", "loadingText", "loading", "multiple", "disabled", "readonly", "modelValue", "placeholder"])
]),
_: 2
}, [
o.prepend ? {
name: "prepend",
fn: n(() => [
t(l.$slots, "prepend")
]),
key: "0"
} : void 0,
o.append ? {
name: "append",
fn: n(() => [
t(l.$slots, "append")
]),
key: "1"
} : void 0
]), 1032, ["prepend", "append"])) : (r(), p(L, $({
key: 1,
ref_key: "selectRef",
ref: g,
label: e.selectLabel,
creatable: e.creatable,
filterable: e.filterable,
clearable: e.clearable,
borderless: e.borderless,
autoWidth: e.autoWidth,
autofocus: e.autofocus,
loadingText: e.loadingText,
loading: h.value
}, e.selectProps, {
multiple: e.multiple,
disabled: e.disabled,
readonly: e.readonly,
modelValue: E(i),
"onUpdate:modelValue": u[1] || (u[1] = (a) => M(i) ? i.value = a : null),
placeholder: e.placeholder || `请选择${l.label || "数据"}`,
onChange: P,
onCreate: I,
onEnter: W,
onFocus: S,
onSearch: F,
onInputChange: N,
onPopupVisibleChange: R,
onRemove: D
}), f({
default: n(() => [
C.value ? (r(!0), m(v, { key: 0 }, y(c.value, (a, V) => (r(), p(w, {
key: V,
label: typeof a.group == "object" ? a.group.label : a.group,
divider: ""
}, {
default: n(() => [
(r(!0), m(v, null, y(a.children, (d) => (r(), p(b, {
key: d.value,
value: d.value,
label: d.label
}, f({ _: 2 }, [
o.default ? {
name: "default",
fn: n(() => [
t(l.$slots, "default", {
value: d.value,
label: d.label
})
]),
key: "0"
} : void 0
]), 1032, ["value", "label"]))), 128))
]),
_: 2
}, 1032, ["label"]))), 128)) : (r(!0), m(v, { key: 1 }, y(c.value, (a) => (r(), p(b, {
key: a.value,
value: a.value,
label: a.label
}, f({ _: 2 }, [
o.default ? {
name: "default",
fn: n(() => [
t(l.$slots, "default", {
value: a.value,
label: a.label
})
]),
key: "0"
} : void 0
]), 1032, ["value", "label"]))), 128))
]),
_: 2
}, [
o.prefixIcon ? {
name: "prefixIcon",
fn: n(() => [
t(l.$slots, "prefixIcon")
]),
key: "0"
} : void 0,
o.panelTopContent ? {
name: "panelTopContent",
fn: n(() => [
t(l.$slots, "panelTopContent")
]),
key: "1"
} : void 0,
o.panelBottomContent ? {
name: "panelBottomContent",
fn: n(() => [
t(l.$slots, "panelTopContent")
]),
key: "2"
} : void 0,
o.valueDisplay ? {
name: "valueDisplay",
fn: n(({ value: a }) => [
t(l.$slots, "valueDisplay", { value: a })
]),
key: "3"
} : void 0,
o["select-label"] ? {
name: "label",
fn: n(() => [
t(l.$slots, "select-label")
]),
key: "4"
} : void 0
]), 1040, ["label", "creatable", "filterable", "clearable", "borderless", "autoWidth", "autofocus", "loadingText", "loading", "multiple", "disabled", "readonly", "modelValue", "placeholder"]))
]),
_: 3
}, 16, ["name", "label", "rules", "labelWidth"]);
};
}
}), ne = J(x);
export {
ne as P
};