tdesign-vue
Version:
362 lines (358 loc) • 14.6 kB
JavaScript
/**
* tdesign v1.14.1
* (c) 2025 tdesign
* @license MIT
*/
import _typeof from '@babel/runtime/helpers/typeof';
import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
import _defineProperty from '@babel/runtime/helpers/defineProperty';
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import { ref, toRefs, computed, watch } from '@vue/composition-api';
import { get, set, isFunction } from 'lodash-es';
import { usePrefixClass } from '../hooks/useConfig.js';
import { useFormDisabled } from '../hooks/useFormDisabled.js';
import { useVModel } from '../hooks/useVModel.js';
import useDefaultValue from '../hooks/useDefaultValue.js';
import { normalizeArray, getNodeDataByValue } from './utils.js';
import { useConfig } from '../config-provider/useConfig.js';
import '../config-provider/context.js';
import '../_common/js/global-config/default-config.js';
import '../_common/js/global-config/locale/zh_CN.js';
import '../_chunks/dep-d2f11e9e.js';
import '../_chunks/dep-05dc6583.js';
import 'dayjs';
import '../_chunks/dep-62386ed0.js';
import '../config-provider/type.js';
import '../_common/js/global-config/t.js';
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var DEFAULT_KEYS = {
label: "label",
value: "value",
children: "children"
};
function useTreeSelect(props, context) {
var classPrefix = usePrefixClass();
var _useConfig = useConfig("treeSelect"),
global = _useConfig.global;
var _useFormDisabled = useFormDisabled(),
formDisabled = _useFormDisabled.formDisabled;
var treeRef = ref(null);
var treeKey = ref(0);
var _toRefs = toRefs(props),
value = _toRefs.value,
popupVisible = _toRefs.popupVisible,
inputValue = _toRefs.inputValue;
var _useVModel = useVModel(value, props.defaultValue, props.onChange, "change"),
_useVModel2 = _slicedToArray(_useVModel, 2),
treeSelectValue = _useVModel2[0],
setTreeSelectValue = _useVModel2[1];
var _useDefaultValue = useDefaultValue(popupVisible, props.defaultPopupVisible, props.onPopupVisibleChange, "popupVisible", "popup-visible-change"),
_useDefaultValue2 = _slicedToArray(_useDefaultValue, 2),
innerVisible = _useDefaultValue2[0],
setInnerVisible = _useDefaultValue2[1];
var _useDefaultValue3 = useDefaultValue(inputValue, props.defaultInputValue || "", props.onInputChange, "inputValue", "input-change"),
_useDefaultValue4 = _slicedToArray(_useDefaultValue3, 2),
innerInputValue = _useDefaultValue4[0],
setInnerInputValue = _useDefaultValue4[1];
var tDisabled = computed(function () {
return formDisabled.value || props.disabled;
});
var isObjectValue = computed(function () {
return props.valueType === "object";
});
var tKeys = computed(function () {
var _props$treeProps;
return _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_KEYS), (_props$treeProps = props.treeProps) === null || _props$treeProps === void 0 ? void 0 : _props$treeProps.keys), props.keys);
});
var inputPlaceholder = computed(function () {
var label = nodeInfo.value ? get(nodeInfo.value, tKeys.value.label) : void 0;
if (typeof label === "number") label = String(label);
return innerVisible.value && label || props.placeholder || global.value.placeholder;
});
var popupClass = computed(function () {
return ["".concat(classPrefix.value, "-select__dropdown"), "narrow-scrollbar"];
});
var dropdownInnerSize = computed(function () {
return {
small: "s",
medium: "m",
large: "l"
}[props.size];
});
var treeRerender = function treeRerender() {
treeKey.value += 1;
};
watch(function () {
return _toConsumableArray(props.data);
}, function () {
treeRerender();
}, {
immediate: true,
flush: "post"
});
var nodeInfo = computed(function () {
return props.multiple ? getMultipleNodeInfo() : getSingleNodeInfo();
});
var singleActivated = computed(function () {
if (props.multiple || !nodeInfo.value) return [];
if (nodeInfo.value instanceof Array) return [nodeInfo.value[0] ? get(nodeInfo.value[0], tKeys.value.value) : void 0];
return [get(nodeInfo.value, tKeys.value.value)];
});
var multipleChecked = computed(function () {
if (!props.multiple || !nodeInfo.value) return [];
if (nodeInfo.value instanceof Array) {
return nodeInfo.value.map(function (item) {
return get(item, tKeys.value.value);
});
}
return [get(nodeInfo.value, tKeys.value.value)];
});
function getMultipleNodeInfo() {
var value2 = treeSelectValue.value;
var list = normalizeArray(value2);
if (treeRef.value) {
return list.map(function (item) {
var _treeRef$value$getIte;
var finalValue = _typeof(item) === "object" ? item.value : item;
var obj = {};
set(obj, tKeys.value.label, finalValue);
set(obj, tKeys.value.value, finalValue);
return ((_treeRef$value$getIte = treeRef.value.getItem(finalValue)) === null || _treeRef$value$getIte === void 0 ? void 0 : _treeRef$value$getIte.data) || obj;
});
}
var onlyValues = list.map(function (item) {
return _typeof(item) === "object" ? get(item, tKeys.value.value) : item;
});
return getNodeDataByValue(onlyValues, props.data, tKeys.value);
}
function getSingleNodeInfo() {
var value2 = treeSelectValue.value;
if (value2 === "" || value2 === void 0 || value2 === null) {
return void 0;
}
var oneValue = Array.isArray(value2) ? value2[0] : value2;
var finalValue = _typeof(oneValue) === "object" ? oneValue.value : oneValue;
if (treeRef.value) {
var _treeRef$value$getIte2;
var obj = {};
set(obj, tKeys.value.label, finalValue);
set(obj, tKeys.value.value, finalValue);
return ((_treeRef$value$getIte2 = treeRef.value.getItem(finalValue)) === null || _treeRef$value$getIte2 === void 0 ? void 0 : _treeRef$value$getIte2.data) || obj;
}
return getNodeDataByValue([finalValue], props.data, tKeys.value)[0];
}
var clear = function clear(_ref) {
var _props$onClear;
var e = _ref.e;
var defaultValue = props.multiple ? [] : void 0;
setTreeSelectValue(defaultValue, {
e: e,
node: null,
data: null,
trigger: "clear"
});
(_props$onClear = props.onClear) === null || _props$onClear === void 0 || _props$onClear.call(props, {
e: e
});
context.emit("clear", {
e: e
});
setInnerVisible(false, {
e: e,
trigger: "clear"
});
};
var treeNodeChange = function treeNodeChange(value2, ctx) {
if (!props.multiple) return;
var current = value2;
if (isObjectValue.value) {
current = value2.map(function (nodeValue) {
return treeRef.value.getItem(nodeValue);
});
}
var tmpValue = Array.isArray(treeSelectValue.value) ? treeSelectValue.value : [treeSelectValue.value];
setTreeSelectValue(current, _objectSpread(_objectSpread({}, ctx), {}, {
data: ctx.node.data,
trigger: value2.length > tmpValue.length ? "check" : "uncheck"
}));
innerInputValue.value && setInnerInputValue("", {
trigger: "change",
e: ctx.e
});
};
var treeNodeActive = function treeNodeActive(value2, ctx) {
var _props$treeProps2, _ctx$node, _ctx$node2;
if (props.multiple) return;
if (treeSelectValue.value === get(ctx.node.data, tKeys.value.value)) {
return;
}
var onlyLeafNode = Boolean(!props.multiple && ((_props$treeProps2 = props.treeProps) === null || _props$treeProps2 === void 0 ? void 0 : _props$treeProps2.valueMode) === "onlyLeaf" && Array.isArray((_ctx$node = ctx.node) === null || _ctx$node === void 0 || (_ctx$node = _ctx$node.data) === null || _ctx$node === void 0 ? void 0 : _ctx$node.children) && ((_ctx$node2 = ctx.node) === null || _ctx$node2 === void 0 || (_ctx$node2 = _ctx$node2.data) === null || _ctx$node2 === void 0 || (_ctx$node2 = _ctx$node2.children) === null || _ctx$node2 === void 0 ? void 0 : _ctx$node2.length));
var current = value2;
var nodeValue = Array.isArray(value2) ? value2[0] : value2;
current = isObjectValue.value ? treeRef.value.getItem(nodeValue) : nodeValue;
if (!onlyLeafNode) {
setTreeSelectValue(current, _objectSpread(_objectSpread({}, ctx), {}, {
data: ctx.node.data,
trigger: "check"
}));
setInnerVisible(false, {
e: ctx.e,
trigger: "trigger-element-click"
});
}
innerInputValue.value && setInnerInputValue("", {
trigger: "change",
e: ctx.e
});
};
var defaultFilterFunction = function defaultFilterFunction(node) {
var label = get(node.data, tKeys.value.label);
var searchLabel = isFunction(label) ? node.data.text : label || node.data.text;
return (searchLabel === null || searchLabel === void 0 ? void 0 : searchLabel.indexOf(innerInputValue.value)) >= 0;
};
var filterByText = computed(function () {
if (props.onSearch || context.listeners.search) return;
if ((props.filter || props.filterable) && innerInputValue.value && !context.listeners.search) {
return props.filter ? function (node) {
return props.filter(innerInputValue.value, node);
} : function (node) {
return defaultFilterFunction(node);
};
}
return void 0;
});
var inputChange = function inputChange() {
var value2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
var ctx = arguments.length > 1 ? arguments[1] : undefined;
if (value2 === innerInputValue.value) return;
setInnerInputValue(value2, ctx);
if (context.listeners.search || props.onSearch) {
var _props$onSearch;
(_props$onSearch = props.onSearch) === null || _props$onSearch === void 0 || _props$onSearch.call(props, value2, {
e: ctx.e
});
context.emit("search", value2);
}
};
var onInnerPopupVisibleChange = function onInnerPopupVisibleChange(state, ctx) {
setInnerVisible(state, ctx);
if (state) {
treeRerender();
}
if (!state && innerInputValue.value) {
setInnerInputValue("", {
trigger: "blur",
e: ctx.e
});
}
};
var tagChange = function tagChange(_, ctx) {
var _treeRef$value;
var trigger = ctx.trigger,
index = ctx.index;
var fitTrigger = trigger === "tag-remove" || trigger === "backspace";
if (!fitTrigger) return;
var current = treeSelectValue.value[index];
var currentDeleteValue = _typeof(current) === "object" ? get(current, tKeys.value.value) : current;
var currentNode = (_treeRef$value = treeRef.value) === null || _treeRef$value === void 0 ? void 0 : _treeRef$value.getItem(currentDeleteValue);
var data = currentNode ? currentNode.data : getNodeDataByValue([currentDeleteValue], props.data, tKeys.value)[0];
if (fitTrigger) {
var _props$onRemove;
var removeParams = {
value: currentDeleteValue,
data: data,
node: currentNode,
trigger: fitTrigger ? trigger : void 0,
index: index,
e: ctx.e
};
(_props$onRemove = props.onRemove) === null || _props$onRemove === void 0 || _props$onRemove.call(props, removeParams);
context.emit("remove", removeParams);
}
if (Array.isArray(treeSelectValue.value)) {
var newValue = _toConsumableArray(treeSelectValue.value);
newValue.splice(index, 1);
setTreeSelectValue(newValue, {
node: currentNode,
data: data,
index: index,
e: ctx.e,
trigger: fitTrigger ? trigger : void 0
});
}
innerInputValue.value && setInnerInputValue("", {
trigger: "change",
e: ctx.e
});
};
var onInnerFocus = function onInnerFocus(_, ctx) {
var _props$onFocus;
(_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, {
value: treeSelectValue.value,
e: ctx.e
});
context.emit("focus", {
value: treeSelectValue.value,
e: ctx.e
});
};
var onInnerBlur = function onInnerBlur(_, ctx) {
var _props$onBlur;
(_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, _objectSpread({
value: treeSelectValue.value
}, ctx));
context.emit("blur", _objectSpread({
value: treeSelectValue.value
}, ctx));
};
var onInnerEnter = function onInnerEnter(_, ctx) {
var _props$onEnter, _props$onSearch2;
var enterParams = {
value: treeSelectValue.value,
inputValue: ctx.inputValue,
e: ctx.e
};
(_props$onEnter = props.onEnter) === null || _props$onEnter === void 0 || _props$onEnter.call(props, enterParams);
context.emit("enter", enterParams);
(_props$onSearch2 = props.onSearch) === null || _props$onSearch2 === void 0 || _props$onSearch2.call(props, ctx.inputValue, {
e: ctx.e
});
context.emit("search", ctx.inputValue, {
e: ctx.e
});
};
return {
classPrefix: classPrefix,
global: global,
tDisabled: tDisabled,
treeRef: treeRef,
tKeys: tKeys,
treeKey: treeKey,
popupClass: popupClass,
isObjectValue: isObjectValue,
dropdownInnerSize: dropdownInnerSize,
inputPlaceholder: inputPlaceholder,
innerVisible: innerVisible,
nodeInfo: nodeInfo,
treeSelectValue: treeSelectValue,
innerInputValue: innerInputValue,
multipleChecked: multipleChecked,
singleActivated: singleActivated,
clear: clear,
filterByText: filterByText,
setInnerVisible: setInnerVisible,
setTreeSelectValue: setTreeSelectValue,
setInnerInputValue: setInnerInputValue,
treeNodeChange: treeNodeChange,
treeNodeActive: treeNodeActive,
inputChange: inputChange,
tagChange: tagChange,
onInnerPopupVisibleChange: onInnerPopupVisibleChange,
onInnerFocus: onInnerFocus,
onInnerBlur: onInnerBlur,
onInnerEnter: onInnerEnter
};
}
export { useTreeSelect as default };
//# sourceMappingURL=useTreeSelect.js.map