hongluan-ui
Version:
Hongluan Component Library for Vue 3
67 lines (64 loc) • 2.23 kB
JavaScript
import { createVNode, renderSlot, mergeProps } from 'vue';
import '../components/index.mjs';
import { oppositeOrderMap, SortOrder, Alignment } from '../constants.mjs';
import { placeholderSign } from '../private.mjs';
import { enforceUnit, componentToSlot, tryCall } from '../utils.mjs';
import HeaderCell from '../components/header-cell.mjs';
import SortIcon from '../components/sort-icon.mjs';
const HeaderCellRenderer = (props, {
slots
}) => {
const {
column,
style,
onColumnSorted
} = props;
const cellStyle = enforceUnit(style);
if (column.placeholderSign === placeholderSign) {
return createVNode("div", {
"class": "table-v2-header-row-cell-placeholder",
"style": cellStyle
}, null);
}
const {
headerCellRenderer,
headerClass,
sortable
} = column;
const cellProps = {
...props,
class: "table-v2-header-cell-text"
};
const columnCellRenderer = componentToSlot(headerCellRenderer);
const Cell = columnCellRenderer ? columnCellRenderer(cellProps) : renderSlot(slots, "default", cellProps, () => [createVNode(HeaderCell, cellProps, null)]);
const {
sortBy,
sortState,
headerCellProps
} = props;
let sorting, sortOrder;
if (sortState) {
const order = sortState[column.key];
sorting = Boolean(oppositeOrderMap[order]);
sortOrder = sorting ? order : SortOrder.ASC;
} else {
sorting = column.key === sortBy.key;
sortOrder = sorting ? sortBy.order : SortOrder.ASC;
}
const cellKls = ["table-v2-header-cell", tryCall(headerClass, props, ""), column.align === Alignment.CENTER && "is-align-center", column.align === Alignment.RIGHT && "is-align-right", sortable && "is-sortable"];
const cellWrapperProps = {
...tryCall(headerCellProps, props),
onClick: column.sortable ? onColumnSorted : void 0,
class: cellKls,
style: cellStyle,
["data-key"]: column.key
};
return createVNode("div", mergeProps(cellWrapperProps, {
"role": "columnheader"
}), [Cell, sortable && createVNode(SortIcon, {
"class": ["table-v2-sort-icon", sorting && "is-sorting"],
"sortOrder": sortOrder
}, null)]);
};
export { HeaderCellRenderer as default };
//# sourceMappingURL=header-cell.mjs.map