| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219 |
- import { h } from 'vue';
- import { ElCheckbox } from '../../checkbox/index.mjs';
- import { ElIcon } from '../../icon/index.mjs';
- import { ArrowRight, Loading } from '@element-plus/icons-vue';
- import { isNumber, isBoolean } from '../../../utils/types.mjs';
- import { isFunction } from '@vue/shared';
- import { getProp } from '../../../utils/objects.mjs';
- const defaultClassNames = {
- selection: "table-column--selection",
- expand: "table__expand-column"
- };
- const cellStarts = {
- default: {
- order: ""
- },
- selection: {
- width: 48,
- minWidth: 48,
- realWidth: 48,
- order: ""
- },
- expand: {
- width: 48,
- minWidth: 48,
- realWidth: 48,
- order: ""
- },
- index: {
- width: 48,
- minWidth: 48,
- realWidth: 48,
- order: ""
- }
- };
- const getDefaultClassName = (type) => {
- return defaultClassNames[type] || "";
- };
- const cellForced = {
- selection: {
- renderHeader({
- store,
- column
- }) {
- var _a;
- function isDisabled() {
- return store.states.data.value && store.states.data.value.length === 0;
- }
- return h(ElCheckbox, {
- disabled: isDisabled(),
- size: store.states.tableSize.value,
- indeterminate: store.states.selection.value.length > 0 && !store.states.isAllSelected.value,
- "onUpdate:modelValue": (_a = store.toggleAllSelection) != null ? _a : void 0,
- modelValue: store.states.isAllSelected.value,
- ariaLabel: column.label
- });
- },
- renderCell({
- row,
- column,
- store,
- $index
- }) {
- return h(ElCheckbox, {
- disabled: column.selectable ? !column.selectable.call(null, row, $index) : false,
- size: store.states.tableSize.value,
- onChange: () => {
- store.commit("rowSelectedChanged", row);
- },
- onClick: (event) => event.stopPropagation(),
- modelValue: store.isSelected(row),
- ariaLabel: column.label
- });
- },
- sortable: false,
- resizable: false
- },
- index: {
- renderHeader({
- column
- }) {
- return column.label || "#";
- },
- renderCell({
- column,
- $index
- }) {
- let i = $index + 1;
- const index = column.index;
- if (isNumber(index)) {
- i = $index + index;
- } else if (isFunction(index)) {
- i = index($index);
- }
- return h("div", {}, [i]);
- },
- sortable: false
- },
- expand: {
- renderHeader({
- column
- }) {
- return column.label || "";
- },
- renderCell({
- column,
- row,
- store,
- expanded
- }) {
- const { ns } = store;
- const classes = [ns.e("expand-icon")];
- if (!column.renderExpand && expanded) {
- classes.push(ns.em("expand-icon", "expanded"));
- }
- const callback = function(e) {
- e.stopPropagation();
- store.toggleRowExpansion(row);
- };
- return h("div", {
- class: classes,
- onClick: callback
- }, {
- default: () => {
- if (column.renderExpand) {
- return [
- column.renderExpand({
- expanded
- })
- ];
- }
- return [
- h(ElIcon, null, {
- default: () => {
- return [h(ArrowRight)];
- }
- })
- ];
- }
- });
- },
- sortable: false,
- resizable: false
- }
- };
- function defaultRenderCell({
- row,
- column,
- $index
- }) {
- var _a;
- const property = column.property;
- const value = property && getProp(row, property).value;
- if (column && column.formatter) {
- return column.formatter(row, column, value, $index);
- }
- return ((_a = value == null ? void 0 : value.toString) == null ? void 0 : _a.call(value)) || "";
- }
- function treeCellPrefix({
- row,
- treeNode,
- store
- }, createPlaceholder = false) {
- const { ns } = store;
- if (!treeNode) {
- if (createPlaceholder) {
- return [
- h("span", {
- class: ns.e("placeholder")
- })
- ];
- }
- return null;
- }
- const ele = [];
- const callback = function(e) {
- e.stopPropagation();
- if (treeNode.loading) {
- return;
- }
- store.loadOrToggle(row);
- };
- if (treeNode.indent) {
- ele.push(h("span", {
- class: ns.e("indent"),
- style: { "padding-left": `${treeNode.indent}px` }
- }));
- }
- if (isBoolean(treeNode.expanded) && !treeNode.noLazyChildren) {
- const expandClasses = [
- ns.e("expand-icon"),
- treeNode.expanded ? ns.em("expand-icon", "expanded") : ""
- ];
- let icon = ArrowRight;
- if (treeNode.loading) {
- icon = Loading;
- }
- ele.push(h("div", {
- class: expandClasses,
- onClick: callback
- }, {
- default: () => {
- return [
- h(ElIcon, { class: { [ns.is("loading")]: treeNode.loading } }, {
- default: () => [h(icon)]
- })
- ];
- }
- }));
- } else {
- ele.push(h("span", {
- class: ns.e("placeholder")
- }));
- }
- return ele;
- }
- export { cellForced, cellStarts, defaultRenderCell, getDefaultClassName, treeCellPrefix };
- //# sourceMappingURL=config.mjs.map
|