tdesign-pro-component
Version:
ProComponents tdesign-vue-next + Vue3 + TS
245 lines (244 loc) • 7.95 kB
JavaScript
import { a as E, i as M, w as T } from "./utils-DU1amZow.js";
import { defineComponent as A, ref as b, useSlots as L, onMounted as U, watch as D, resolveComponent as v, openBlock as y, createBlock as g, mergeProps as I, withCtx as n, createSlots as V, createVNode as j, unref as _, isRef as x, renderSlot as r } from "vue";
import { u as q } from "./hooks-9GWkbKry.js";
const G = /* @__PURE__ */ A({
name: "ProFormTreeSelect",
__name: "ProFormTreeSelect",
props: {
name: {},
modelValue: { type: [String, Number, Boolean, null, Array] },
data: {},
label: {},
rules: {},
formItemProps: {},
labelWidth: {},
labelAlign: { default: "left" },
requiredMark: { type: Boolean },
placeholder: {},
labelName: { default: "label" },
valueName: { default: "value" },
childrenName: { default: "children" },
autoWidth: { type: Boolean },
borderless: { type: Boolean },
size: {},
clearable: { type: Boolean },
disabled: { type: Boolean },
filterable: { type: Boolean },
loading: { type: Boolean },
multiple: { type: Boolean },
readonly: { type: Boolean },
treeSelectProps: {},
append: {},
prepend: {}
},
emits: ["update:modelValue", "change", "enter", "focus", "input-change", "popup-visible-change", "remove", "search"],
setup(z, { expose: F, emit: w }) {
const e = z, s = w, u = b(!1), d = q(e, "modelValue", s, e.modelValue || ""), f = b(), m = b([]), o = L();
U(() => {
e.name || E("name is empty"), k();
});
function k() {
M(e.data) ? (u.value = !0, e.data().then((l) => {
m.value = h(l);
}).finally(() => {
u.value = !1;
})) : m.value = h(e.data);
}
function P(l, a) {
s("change", l, a);
}
function S(l) {
s("enter", l);
}
function B(l) {
s("focus", l);
}
function C(l) {
s("remove", l);
}
function $(l, a) {
s("search", l, a);
}
function W(l, a) {
s("input-change", l, a);
}
function N(l, a) {
s("popup-visible-change", l, a);
}
function h(l) {
const a = [];
return l.forEach((i) => {
let c = {
label: i[e.labelName],
value: i[e.valueName]
};
i[e.childrenName] && (c[e.childrenName] = h(i[e.childrenName])), a.push(c);
}), a;
}
return D(() => e.loading, (l) => u.value = l), D(() => e.data, () => {
k();
}), F({
getValue: () => d.value,
focus: () => f.value.focus(),
blur: () => f.value.blur(),
clear: () => {
d.value = e.multiple ? [] : "";
},
getRef: () => f.value
}), (l, a) => {
const i = v("t-tree-select"), c = v("t-input-adornment"), R = v("t-form-item");
return y(), g(R, I({
label: e.label,
name: e.name,
rules: e.rules,
labelWidth: e.labelWidth
}, e.formItemProps), {
default: n(() => [
o.prepend || o.append || e.prepend || e.append ? (y(), g(c, {
key: 0,
style: { width: "100%", border: "1px solid red" },
prepend: e.prepend,
append: e.append
}, V({
default: n(() => [
j(i, I({
modelValue: _(d),
"onUpdate:modelValue": a[0] || (a[0] = (t) => x(d) ? d.value = t : null),
data: m.value,
placeholder: e.placeholder || `请选择${e.label || "数据"}`,
onChange: P,
onEnter: S,
onFocus: B,
onInputChange: W,
onPopupVisibleChange: N,
onRemove: C,
onSearch: $,
disabled: e.disabled,
readonly: e.readonly,
size: e.size,
autoWidth: e.autoWidth,
borderless: e.borderless,
clearable: e.clearable,
loading: u.value,
filterable: e.filterable,
multiple: e.multiple
}, e.treeSelectProps), V({ _: 2 }, [
o.valueDisplay ? {
name: "valueDisplay",
fn: n(({ value: t, onClose: p }) => [
r(l.$slots, "valueDisplay", {
value: t,
onClose: p
})
]),
key: "0"
} : void 0,
o.prefixIcon ? {
name: "prefixIcon",
fn: n(() => [
r(l.$slots, "prefixIcon")
]),
key: "1"
} : void 0,
o.suffix ? {
name: "suffix",
fn: n(() => [
r(l.$slots, "suffix")
]),
key: "2"
} : void 0,
o.collapsedItems ? {
name: "collapsedItems",
fn: n(({ value: t, onClose: p }) => [
r(l.$slots, "collapsedItems", {
value: t,
onClose: p
})
]),
key: "3"
} : void 0
]), 1040, ["modelValue", "data", "placeholder", "disabled", "readonly", "size", "autoWidth", "borderless", "clearable", "loading", "filterable", "multiple"])
]),
_: 2
}, [
o.prepend ? {
name: "prepend",
fn: n(() => [
r(l.$slots, "prepend")
]),
key: "0"
} : void 0,
o.append ? {
name: "append",
fn: n(() => [
r(l.$slots, "append")
]),
key: "1"
} : void 0
]), 1032, ["prepend", "append"])) : (y(), g(i, I({
key: 1,
modelValue: _(d),
"onUpdate:modelValue": a[1] || (a[1] = (t) => x(d) ? d.value = t : null),
data: m.value,
placeholder: e.placeholder || `请选择${e.label || "数据"}`,
onChange: P,
onEnter: S,
onFocus: B,
onInputChange: W,
onPopupVisibleChange: N,
onRemove: C,
onSearch: $,
disabled: e.disabled,
readonly: e.readonly,
size: e.size,
autoWidth: e.autoWidth,
borderless: e.borderless,
clearable: e.clearable,
loading: u.value,
filterable: e.filterable,
multiple: e.multiple
}, e.treeSelectProps), V({ _: 2 }, [
o.valueDisplay ? {
name: "valueDisplay",
fn: n(({ value: t, onClose: p }) => [
r(l.$slots, "valueDisplay", {
value: t,
onClose: p
})
]),
key: "0"
} : void 0,
o.prefixIcon ? {
name: "prefixIcon",
fn: n(() => [
r(l.$slots, "prefixIcon")
]),
key: "1"
} : void 0,
o.suffix ? {
name: "suffix",
fn: n(() => [
r(l.$slots, "suffix")
]),
key: "2"
} : void 0,
o.collapsedItems ? {
name: "collapsedItems",
fn: n(({ value: t, onClose: p }) => [
r(l.$slots, "collapsedItems", {
value: t,
onClose: p
})
]),
key: "3"
} : void 0
]), 1040, ["modelValue", "data", "placeholder", "disabled", "readonly", "size", "autoWidth", "borderless", "clearable", "loading", "filterable", "multiple"]))
]),
_: 3
}, 16, ["label", "name", "rules", "labelWidth"]);
};
}
}), O = T(G);
export {
O as P
};