tdesign-mobile-vue
Version:
tdesign-mobile-vue
318 lines (310 loc) • 12.3 kB
JavaScript
/**
* tdesign v1.9.3
* (c) 2025 TDesign Group
* @license MIT
*/
;
Object.defineProperty(exports, '__esModule', { value: true });
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var vue = require('vue');
var sideBar_index = require('../side-bar/index.js');
var radio_index = require('../radio/index.js');
var checkbox_index = require('../checkbox/index.js');
var config = require('../config.js');
var treeSelect_props = require('./props.js');
var hooks_useClass = require('../hooks/useClass.js');
var hooks_useVModel = require('../hooks/useVModel.js');
var shared_util = require('../shared/util.js');
require('../side-bar/side-bar.js');
require('../side-bar/props.js');
require('../hooks/tnode.js');
require('../hooks/render-tnode.js');
require('../_chunks/dep-ef223206.js');
require('@babel/runtime/helpers/typeof');
require('../_chunks/dep-c3cb976c.js');
require('../_chunks/dep-2f809ed9.js');
require('../_chunks/dep-757b152c.js');
require('../_chunks/dep-5be9198d.js');
require('../_chunks/dep-a7319409.js');
require('../_chunks/dep-afa9f3f2.js');
require('../_chunks/dep-ae809b86.js');
require('../_chunks/dep-2b08c0a6.js');
require('../_chunks/dep-288156c7.js');
require('../_chunks/dep-3d4c38f1.js');
require('../_chunks/dep-6df33aaf.js');
require('../_chunks/dep-88fe047a.js');
require('../_chunks/dep-675798b4.js');
require('../_chunks/dep-ccc9ad3d.js');
require('../_chunks/dep-d950aa21.js');
require('../_chunks/dep-a697b1b9.js');
require('../_chunks/dep-4dfb9b9c.js');
require('../_chunks/dep-7c911ba3.js');
require('../_common/js/utils/general.js');
require('../_chunks/dep-21f18d3b.js');
require('../_chunks/dep-b9642a56.js');
require('../_common/js/global-config/mobile/default-config.js');
require('../_common/js/global-config/mobile/locale/zh_CN.js');
require('../_chunks/dep-28b1e09d.js');
require('../_chunks/dep-57aa1aa0.js');
require('dayjs');
require('../_chunks/dep-85204fa0.js');
require('../_chunks/dep-f6b14f80.js');
require('../_chunks/dep-a8d60643.js');
require('../_chunks/dep-49f0a63e.js');
require('../_chunks/dep-c65deed7.js');
require('../_chunks/dep-94eeec5a.js');
require('../_chunks/dep-060bf1cf.js');
require('../_chunks/dep-0e05e959.js');
require('../_chunks/dep-324da301.js');
require('../_chunks/dep-da6dc2cf.js');
require('../side-bar/side-bar-item.js');
require('../side-bar/side-bar-item-props.js');
require('../badge/index.js');
require('../badge/badge.js');
require('../badge/props.js');
require('../_chunks/dep-ff4786c0.js');
require('../shared/component.js');
require('../radio/radio.js');
require('tdesign-icons-vue-next');
require('../radio/props.js');
require('../form/hooks.js');
require('../_chunks/dep-d5bc9590.js');
require('../radio/radio-group.js');
require('../radio/radio-group-props.js');
require('../_chunks/dep-7fa39e6f.js');
require('../_chunks/dep-0528a76d.js');
require('../checkbox/checkbox.js');
require('../checkbox/props.js');
require('../shared/render-tnode.js');
require('../checkbox/checkbox-group.js');
require('../checkbox/checkbox-group-props.js');
require('../checkbox/hooks/getOptions.js');
require('../hooks/useChildSlots.js');
require('../checkbox/hooks/setCheckAllStatus.js');
require('../_chunks/dep-731c3bbd.js');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
function _isSlot(s) {
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
}
var prefix = config["default"].prefix;
var _TreeSelect = vue.defineComponent({
name: "".concat(prefix, "-tree-select"),
components: {
TSideBar: sideBar_index.SideBar,
TSideBarItem: sideBar_index.SideBarItem,
TRadio: radio_index.Radio,
TRadioGroup: radio_index.RadioGroup
},
props: treeSelect_props["default"],
emits: ["update:value", "update:modelValue", "change"],
setup: function setup(props2, context) {
var treeSelectClass = hooks_useClass.usePrefixClass("tree-select");
var _toRefs = vue.toRefs(props2),
height = _toRefs.height,
customStyle = _toRefs.customStyle,
value = _toRefs.value,
modelValue = _toRefs.modelValue,
options = _toRefs.options,
keys = _toRefs.keys,
multiple = _toRefs.multiple;
var _useVModel = hooks_useVModel["default"](value, modelValue, props2.defaultValue, props2.onChange),
_useVModel2 = _slicedToArray__default["default"](_useVModel, 2),
innerValue = _useVModel2[0],
setInnerValue = _useVModel2[1];
var leafLevel = vue.ref(0);
var treeOptions = vue.ref([]);
var rootStyle = vue.computed(function () {
return ["height: ".concat(shared_util.convertUnit(height.value)), customStyle.value].join(";");
});
var buildTreeOptions = function buildTreeOptions() {
var options2 = props2.options,
multiple2 = props2.multiple,
keys2 = props2.keys;
var level = -1;
var tmpTreeOptions = [];
var node = {
children: options2
};
if (options2.length === 0 || Array.isArray(value) && value.length === 0) return;
var _loop = function _loop() {
var _innerValue$value;
level += 1;
var list = node.children.map(function (item) {
return {
label: item[(keys2 === null || keys2 === void 0 ? void 0 : keys2.label) || "label"],
value: item[(keys2 === null || keys2 === void 0 ? void 0 : keys2.value) || "value"],
disabled: item[(keys2 === null || keys2 === void 0 ? void 0 : keys2.disabled) || "disabled"],
children: item.children
};
});
var thisValue = (_innerValue$value = innerValue.value) === null || _innerValue$value === void 0 ? void 0 : _innerValue$value[level];
tmpTreeOptions.push(_toConsumableArray__default["default"](list));
if (thisValue == null) {
var _list = _slicedToArray__default["default"](list, 1),
firstChild = _list[0];
node = firstChild;
} else {
var child = list.find(function (child2) {
return child2.value === thisValue;
});
node = child !== null && child !== void 0 ? child : list[0];
}
};
while (node && node.children) {
_loop();
}
leafLevel.value = Math.max(0, level);
treeOptions.value = tmpTreeOptions;
if (multiple2) {
var finalValue = innerValue.value;
if (finalValue[leafLevel.value] != null && !Array.isArray(finalValue[leafLevel.value])) {
throw TypeError("\u5E94\u4F20\u5165\u6570\u7EC4\u7C7B\u578B\u7684 value");
}
}
};
var getTreeClass = function getTreeClass(level, total) {
if (level === 0) return "right";
if (level === 1 && level !== total - 1) return "middle";
return "left";
};
var onRootChange = function onRootChange(level) {
setInnerValue(innerValue.value, level);
};
var handleTreeClick = function handleTreeClick(itemValue, level, isDisabled) {
if (isDisabled) return;
innerValue.value[level] = itemValue;
setInnerValue(innerValue.value, level);
};
vue.watch([innerValue, options, keys, multiple], function () {
buildTreeOptions();
}, {
immediate: true,
deep: true
});
var renderSideBar = function renderSideBar(treeOption) {
var _slot;
return vue.createVNode(sideBar_index.SideBar, {
"modelValue": innerValue.value[0],
"onUpdate:modelValue": function onUpdateModelValue($event) {
return innerValue.value[0] = $event;
},
"class": "".concat(treeSelectClass.value, "-colum"),
"onChange": function onChange() {
return onRootChange(0);
}
}, _isSlot(_slot = treeOption.map(function (item, index) {
return vue.createVNode(sideBar_index.SideBarItem, {
"key": index,
"label": item.label,
"value": item.value,
"disabled": item.disabled
}, null);
})) ? _slot : {
default: function _default() {
return [_slot];
}
});
};
var renderMiddleLevel = function renderMiddleLevel(treeOption, level) {
return treeOption.map(function (item) {
return vue.createVNode("div", {
"key": item.value,
"class": _defineProperty__default["default"](_defineProperty__default["default"](_defineProperty__default["default"]({}, "".concat(treeSelectClass.value, "__item"), true), "".concat(treeSelectClass.value, "__item--active"), item.value === innerValue.value[level]), "".concat(treeSelectClass.value, "__item--disabled"), item.disabled),
"onClick": function onClick() {
return handleTreeClick(item.value, level, item.disabled);
}
}, [item.label]);
});
};
var renderLeafLevel = function renderLeafLevel(treeOption, level) {
var _slot3;
if (multiple.value) {
var _slot2;
return vue.createVNode(checkbox_index.CheckboxGroup, {
"modelValue": innerValue.value[level],
"onUpdate:modelValue": function onUpdateModelValue($event) {
return innerValue.value[level] = $event;
},
"class": "".concat(treeSelectClass.value, "__checkbox"),
"onChange": function onChange() {
return onRootChange(level);
}
}, _isSlot(_slot2 = treeOption.map(function (item) {
return vue.createVNode(checkbox_index.Checkbox, {
"key": item.value,
"class": "".concat(treeSelectClass.value, "__checkbox-item"),
"value": item.value,
"maxLabelRow": 1,
"icon": "line",
"borderless": true,
"placement": "right",
"disabled": item.disabled
}, {
default: function _default() {
return [item.label];
}
});
})) ? _slot2 : {
default: function _default() {
return [_slot2];
}
});
}
return vue.createVNode(radio_index.RadioGroup, {
"modelValue": innerValue.value[level],
"onUpdate:modelValue": function onUpdateModelValue($event) {
return innerValue.value[level] = $event;
},
"class": "".concat(treeSelectClass.value, "__radio"),
"onChange": function onChange() {
return onRootChange(level);
}
}, _isSlot(_slot3 = treeOption.map(function (item) {
return vue.createVNode(radio_index.Radio, {
"key": item.value,
"class": "".concat(treeSelectClass.value, "__radio-item"),
"value": item.value,
"icon": "line",
"maxLabelRow": 1,
"borderless": true,
"placement": "right",
"disabled": item.disabled
}, {
default: function _default() {
return [item.label];
}
});
})) ? _slot3 : {
default: function _default() {
return [_slot3];
}
});
};
return function () {
return vue.createVNode("div", {
"class": treeSelectClass.value,
"style": rootStyle.value
}, [treeOptions.value.map(function (item, level) {
var levelContent;
if (level === 0) {
levelContent = renderSideBar(item);
} else if (level === leafLevel.value) {
levelContent = renderLeafLevel(item, level);
} else {
levelContent = renderMiddleLevel(item, level);
}
return vue.createVNode("div", {
"key": level,
"class": ["".concat(treeSelectClass.value, "__column"), "".concat(treeSelectClass.value, "__column--").concat(getTreeClass(leafLevel.value - level, treeOptions.value.length))]
}, [levelContent]);
})]);
};
}
});
exports["default"] = _TreeSelect;
//# sourceMappingURL=tree-select.js.map