tdesign-vue
Version:
197 lines (189 loc) • 8.46 kB
JavaScript
/**
* tdesign v1.15.0
* (c) 2026 tdesign
* @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 VueCompositionAPI = require('@vue/composition-api');
var tdesignIconsVue = require('tdesign-icons-vue');
var table_hooks_useClassName = require('./useClassName.js');
var hooks_tnode = require('../../hooks/tnode.js');
var hooks_useDefaultValue = require('../../hooks/useDefaultValue.js');
var configProvider_useConfig = require('../../config-provider/useConfig.js');
var hooks_useGlobalIcon = require('../../hooks/useGlobalIcon.js');
var get = require('../../_chunks/dep-a7198720.js');
require('../../_chunks/dep-8eddb350.js');
require('../../_common/js/global-config/default-config.js');
require('../../_common/js/global-config/locale/zh_CN.js');
require('../../_chunks/dep-0c37520c.js');
require('@babel/runtime/helpers/typeof');
require('../../_chunks/dep-c13dcbfd.js');
require('dayjs');
require('../../_chunks/dep-6f4e680e.js');
require('../../_chunks/dep-bb0ececf.js');
require('../../_chunks/dep-3b2292ce.js');
require('../../_chunks/dep-ba7f5924.js');
require('../../_chunks/dep-10fcb46d.js');
require('../../_chunks/dep-6eba4d23.js');
require('../../_chunks/dep-010db548.js');
require('../../_chunks/dep-8d206316.js');
require('../../_chunks/dep-2bc87cc8.js');
require('../../_chunks/dep-f77d6ad5.js');
require('../../_chunks/dep-9dae8101.js');
require('../../_chunks/dep-7c84d9a0.js');
require('../../_chunks/dep-733a2279.js');
require('../../_chunks/dep-d844c9ed.js');
require('../../_chunks/dep-c05a9033.js');
require('../../_chunks/dep-efe55b82.js');
require('../../_chunks/dep-7da70ee1.js');
require('../../_chunks/dep-124386d4.js');
require('../../_chunks/dep-f5b14344.js');
require('../../_chunks/dep-36c2788b.js');
require('../../_chunks/dep-fa353fbb.js');
require('../../_chunks/dep-d66ab3a4.js');
require('../../_chunks/dep-d4d8c513.js');
require('../../_common/js/global-config/t.js');
require('../../_chunks/dep-a2217d56.js');
require('../../hooks/render-tnode.js');
require('../../_chunks/dep-9c5b91d3.js');
require('../../_chunks/dep-9a74c2be.js');
require('../../_chunks/dep-689d381f.js');
require('../../_chunks/dep-803744d9.js');
require('../../_chunks/dep-84027b7f.js');
require('../../_chunks/dep-49400b00.js');
require('../../_chunks/dep-f1081d8e.js');
require('../../_chunks/dep-2c592e99.js');
require('../../_chunks/dep-812bd25d.js');
require('../../_chunks/dep-82ce56ef.js');
require('../../_chunks/dep-4e96e31a.js');
require('../../_chunks/dep-1e173c2b.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 useRowExpand(props, context) {
var _toRefs = VueCompositionAPI.toRefs(props),
expandedRowKeys = _toRefs.expandedRowKeys;
var renderTNode = hooks_tnode.useTNodeJSX();
var _useConfig = configProvider_useConfig.useConfig("table", props.locale),
t = _useConfig.t,
global = _useConfig.global;
var _useGlobalIcon = hooks_useGlobalIcon.useGlobalIcon({
ChevronRightCircleIcon: tdesignIconsVue.ChevronRightCircleIcon
}),
ChevronRightCircleIcon = _useGlobalIcon.ChevronRightCircleIcon;
var _useClassName = table_hooks_useClassName["default"](),
tableExpandClasses = _useClassName.tableExpandClasses,
positiveRotate90 = _useClassName.positiveRotate90,
tableFullRowClasses = _useClassName.tableFullRowClasses;
var _useDefaultValue = hooks_useDefaultValue["default"](expandedRowKeys, props.defaultExpandedRowKeys || [], props.onExpandChange, "expandedRowKeys", "expand-change"),
_useDefaultValue2 = _slicedToArray__default["default"](_useDefaultValue, 2),
tExpandedRowKeys = _useDefaultValue2[0],
setTExpandedRowKeys = _useDefaultValue2[1];
var showExpandedRow = VueCompositionAPI.computed(function () {
return Boolean(props.expandedRow || context.slots.expandedRow || context.slots["expanded-row"]);
});
var showExpandIconColumn = VueCompositionAPI.computed(function () {
return props.expandIcon !== false && showExpandedRow.value;
});
var isFirstColumnFixed = VueCompositionAPI.computed(function () {
var _props$columns;
return ((_props$columns = props.columns) === null || _props$columns === void 0 || (_props$columns = _props$columns[0]) === null || _props$columns === void 0 ? void 0 : _props$columns.fixed) === "left";
});
var getExpandedRowClass = function getExpandedRowClass(params) {
var _tExpandedRowKeys$val;
if (!showExpandedRow.value) return null;
var row = params.row,
rowKey = params.rowKey;
var currentRowKey = get.get(row, rowKey || "id");
return tableExpandClasses[(_tExpandedRowKeys$val = tExpandedRowKeys.value) !== null && _tExpandedRowKeys$val !== void 0 && _tExpandedRowKeys$val.includes(currentRowKey) ? "rowExpanded" : "rowFolded"];
};
var onToggleExpand = function onToggleExpand(e, row) {
props.expandOnRowClick && e.stopPropagation();
var currentId = get.get(row, props.rowKey || "id");
var index = tExpandedRowKeys.value.indexOf(currentId);
var newKeys = _toConsumableArray__default["default"](tExpandedRowKeys.value);
index !== -1 ? newKeys.splice(index, 1) : newKeys.push(currentId);
setTExpandedRowKeys(newKeys, {
expandedRowData: props.data.filter(function (t2) {
return newKeys.includes(get.get(t2, props.rowKey || "id"));
}),
currentRowData: row
});
};
var renderExpandIcon = function renderExpandIcon(h, p) {
var row = p.row,
rowIndex = p.rowIndex;
var currentId = get.get(row, props.rowKey || "id");
var expanded = tExpandedRowKeys.value.includes(currentId);
var icon = renderTNode("expandIcon", {
defaultNode: t(global.value.expandIcon) || h(ChevronRightCircleIcon),
params: {
row: row,
index: rowIndex
}
});
if (!icon) return null;
var classes = [tableExpandClasses.iconBox, tableExpandClasses[expanded ? "expanded" : "collapsed"], _defineProperty__default["default"]({}, positiveRotate90, expanded)];
return h("span", {
"class": classes,
"on": {
"click": function click(e) {
return onToggleExpand(e, row);
}
}
}, [icon]);
};
var getExpandColumn = function getExpandColumn(h) {
var expandCol = {
colKey: "__EXPAND_ROW_ICON_COLUMN__",
width: 64,
className: tableExpandClasses.iconCell,
fixed: isFirstColumnFixed.value ? "left" : void 0,
cell: renderExpandIcon,
stopPropagation: true
};
return expandCol;
};
var renderExpandedRow = function renderExpandedRow(h, p) {
var rowId = get.get(p.row, props.rowKey || "id");
if (!tExpandedRowKeys.value || !tExpandedRowKeys.value.includes(rowId)) return null;
var isFixedLeft = p.isWidthOverflow && props.columns.find(function (item) {
return item.fixed === "left";
});
return h("tr", {
"key": "expand_".concat(rowId),
"class": [tableExpandClasses.row, _defineProperty__default["default"]({}, tableFullRowClasses.base, isFixedLeft)]
}, [h("td", {
"attrs": {
"colspan": p.columns.length
}
}, [h("div", {
"class": [tableExpandClasses.rowInner, _defineProperty__default["default"]({}, tableFullRowClasses.innerFullRow, isFixedLeft)],
"style": isFixedLeft ? {
width: "".concat(p.tableWidth, "px")
} : {}
}, [h("div", {
"class": tableFullRowClasses.innerFullElement
}, [renderTNode("expandedRow", {
params: p
})])])])]);
};
var onInnerExpandRowClick = function onInnerExpandRowClick(p) {
onToggleExpand(p.e, p.row);
};
return {
showExpandedRow: showExpandedRow,
showExpandIconColumn: showExpandIconColumn,
getExpandColumn: getExpandColumn,
renderExpandedRow: renderExpandedRow,
onInnerExpandRowClick: onInnerExpandRowClick,
getExpandedRowClass: getExpandedRowClass
};
}
exports["default"] = useRowExpand;
//# sourceMappingURL=useRowExpand.js.map