1
This commit is contained in:
372
admin/node_modules/element-plus/es/components/table/src/table.mjs
generated
vendored
Normal file
372
admin/node_modules/element-plus/es/components/table/src/table.mjs
generated
vendored
Normal file
@@ -0,0 +1,372 @@
|
||||
import { defineComponent, getCurrentInstance, provide, computed, onBeforeUnmount, resolveComponent, resolveDirective, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, withDirectives, createVNode, createCommentVNode, withCtx, createBlock, createTextVNode, toDisplayString, vShow } from 'vue';
|
||||
import { debounce } from 'lodash-unified';
|
||||
import { ElScrollbar } from '../../scrollbar/index.mjs';
|
||||
import { createStore } from './store/helper.mjs';
|
||||
import TableLayout from './table-layout.mjs';
|
||||
import TableHeader from './table-header/index.mjs';
|
||||
import TableBody from './table-body/index.mjs';
|
||||
import TableFooter from './table-footer/index.mjs';
|
||||
import useUtils from './table/utils-helper.mjs';
|
||||
import { convertToRows } from './table-header/utils-helper.mjs';
|
||||
import useStyle from './table/style-helper.mjs';
|
||||
import useKeyRender from './table/key-render-helper.mjs';
|
||||
import defaultProps from './table/defaults.mjs';
|
||||
import { TABLE_INJECTION_KEY } from './tokens.mjs';
|
||||
import { hColgroup } from './h-helper.mjs';
|
||||
import { useScrollbar } from './composables/use-scrollbar.mjs';
|
||||
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
|
||||
import Mousewheel from '../../../directives/mousewheel/index.mjs';
|
||||
import { useLocale } from '../../../hooks/use-locale/index.mjs';
|
||||
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
|
||||
|
||||
let tableIdSeed = 1;
|
||||
const _sfc_main = defineComponent({
|
||||
name: "ElTable",
|
||||
directives: {
|
||||
Mousewheel
|
||||
},
|
||||
components: {
|
||||
TableHeader,
|
||||
TableBody,
|
||||
TableFooter,
|
||||
ElScrollbar,
|
||||
hColgroup
|
||||
},
|
||||
props: defaultProps,
|
||||
emits: [
|
||||
"select",
|
||||
"select-all",
|
||||
"selection-change",
|
||||
"cell-mouse-enter",
|
||||
"cell-mouse-leave",
|
||||
"cell-contextmenu",
|
||||
"cell-click",
|
||||
"cell-dblclick",
|
||||
"row-click",
|
||||
"row-contextmenu",
|
||||
"row-dblclick",
|
||||
"header-click",
|
||||
"header-contextmenu",
|
||||
"sort-change",
|
||||
"filter-change",
|
||||
"current-change",
|
||||
"header-dragend",
|
||||
"expand-change",
|
||||
"scroll"
|
||||
],
|
||||
setup(props) {
|
||||
const { t } = useLocale();
|
||||
const ns = useNamespace("table");
|
||||
const table = getCurrentInstance();
|
||||
provide(TABLE_INJECTION_KEY, table);
|
||||
const store = createStore(table, props);
|
||||
table.store = store;
|
||||
const layout = new TableLayout({
|
||||
store: table.store,
|
||||
table,
|
||||
fit: props.fit,
|
||||
showHeader: props.showHeader
|
||||
});
|
||||
table.layout = layout;
|
||||
const isEmpty = computed(() => (store.states.data.value || []).length === 0);
|
||||
const {
|
||||
setCurrentRow,
|
||||
getSelectionRows,
|
||||
toggleRowSelection,
|
||||
clearSelection,
|
||||
clearFilter,
|
||||
toggleAllSelection,
|
||||
toggleRowExpansion,
|
||||
clearSort,
|
||||
sort,
|
||||
updateKeyChildren
|
||||
} = useUtils(store);
|
||||
const {
|
||||
isHidden,
|
||||
renderExpanded,
|
||||
setDragVisible,
|
||||
isGroup,
|
||||
handleMouseLeave,
|
||||
handleHeaderFooterMousewheel,
|
||||
tableSize,
|
||||
emptyBlockStyle,
|
||||
resizeProxyVisible,
|
||||
bodyWidth,
|
||||
resizeState,
|
||||
doLayout,
|
||||
tableBodyStyles,
|
||||
tableLayout,
|
||||
scrollbarViewStyle,
|
||||
scrollbarStyle
|
||||
} = useStyle(props, layout, store, table);
|
||||
const { scrollBarRef, scrollTo, setScrollLeft, setScrollTop } = useScrollbar();
|
||||
const debouncedUpdateLayout = debounce(doLayout, 50);
|
||||
const tableId = `${ns.namespace.value}-table_${tableIdSeed++}`;
|
||||
table.tableId = tableId;
|
||||
table.state = {
|
||||
isGroup,
|
||||
resizeState,
|
||||
doLayout,
|
||||
debouncedUpdateLayout
|
||||
};
|
||||
const computedSumText = computed(() => {
|
||||
var _a;
|
||||
return (_a = props.sumText) != null ? _a : t("el.table.sumText");
|
||||
});
|
||||
const computedEmptyText = computed(() => {
|
||||
var _a;
|
||||
return (_a = props.emptyText) != null ? _a : t("el.table.emptyText");
|
||||
});
|
||||
const columns = computed(() => {
|
||||
return convertToRows(store.states.originColumns.value)[0];
|
||||
});
|
||||
useKeyRender(table);
|
||||
onBeforeUnmount(() => {
|
||||
debouncedUpdateLayout.cancel();
|
||||
});
|
||||
return {
|
||||
ns,
|
||||
layout,
|
||||
store,
|
||||
columns,
|
||||
handleHeaderFooterMousewheel,
|
||||
handleMouseLeave,
|
||||
tableId,
|
||||
tableSize,
|
||||
isHidden,
|
||||
isEmpty,
|
||||
renderExpanded,
|
||||
resizeProxyVisible,
|
||||
resizeState,
|
||||
isGroup,
|
||||
bodyWidth,
|
||||
tableBodyStyles,
|
||||
emptyBlockStyle,
|
||||
debouncedUpdateLayout,
|
||||
setCurrentRow,
|
||||
getSelectionRows,
|
||||
toggleRowSelection,
|
||||
clearSelection,
|
||||
clearFilter,
|
||||
toggleAllSelection,
|
||||
toggleRowExpansion,
|
||||
clearSort,
|
||||
doLayout,
|
||||
sort,
|
||||
updateKeyChildren,
|
||||
t,
|
||||
setDragVisible,
|
||||
context: table,
|
||||
computedSumText,
|
||||
computedEmptyText,
|
||||
tableLayout,
|
||||
scrollbarViewStyle,
|
||||
scrollbarStyle,
|
||||
scrollBarRef,
|
||||
scrollTo,
|
||||
setScrollLeft,
|
||||
setScrollTop,
|
||||
allowDragLastColumn: props.allowDragLastColumn
|
||||
};
|
||||
}
|
||||
});
|
||||
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
||||
const _component_hColgroup = resolveComponent("hColgroup");
|
||||
const _component_table_header = resolveComponent("table-header");
|
||||
const _component_table_body = resolveComponent("table-body");
|
||||
const _component_table_footer = resolveComponent("table-footer");
|
||||
const _component_el_scrollbar = resolveComponent("el-scrollbar");
|
||||
const _directive_mousewheel = resolveDirective("mousewheel");
|
||||
return openBlock(), createElementBlock("div", {
|
||||
ref: "tableWrapper",
|
||||
class: normalizeClass([
|
||||
{
|
||||
[_ctx.ns.m("fit")]: _ctx.fit,
|
||||
[_ctx.ns.m("striped")]: _ctx.stripe,
|
||||
[_ctx.ns.m("border")]: _ctx.border || _ctx.isGroup,
|
||||
[_ctx.ns.m("hidden")]: _ctx.isHidden,
|
||||
[_ctx.ns.m("group")]: _ctx.isGroup,
|
||||
[_ctx.ns.m("fluid-height")]: _ctx.maxHeight,
|
||||
[_ctx.ns.m("scrollable-x")]: _ctx.layout.scrollX.value,
|
||||
[_ctx.ns.m("scrollable-y")]: _ctx.layout.scrollY.value,
|
||||
[_ctx.ns.m("enable-row-hover")]: !_ctx.store.states.isComplex.value,
|
||||
[_ctx.ns.m("enable-row-transition")]: (_ctx.store.states.data.value || []).length !== 0 && (_ctx.store.states.data.value || []).length < 100,
|
||||
"has-footer": _ctx.showSummary
|
||||
},
|
||||
_ctx.ns.m(_ctx.tableSize),
|
||||
_ctx.className,
|
||||
_ctx.ns.b(),
|
||||
_ctx.ns.m(`layout-${_ctx.tableLayout}`)
|
||||
]),
|
||||
style: normalizeStyle(_ctx.style),
|
||||
"data-prefix": _ctx.ns.namespace.value,
|
||||
onMouseleave: _ctx.handleMouseLeave
|
||||
}, [
|
||||
createElementVNode("div", {
|
||||
class: normalizeClass(_ctx.ns.e("inner-wrapper"))
|
||||
}, [
|
||||
createElementVNode("div", {
|
||||
ref: "hiddenColumns",
|
||||
class: "hidden-columns"
|
||||
}, [
|
||||
renderSlot(_ctx.$slots, "default")
|
||||
], 512),
|
||||
_ctx.showHeader && _ctx.tableLayout === "fixed" ? withDirectives((openBlock(), createElementBlock("div", {
|
||||
key: 0,
|
||||
ref: "headerWrapper",
|
||||
class: normalizeClass(_ctx.ns.e("header-wrapper"))
|
||||
}, [
|
||||
createElementVNode("table", {
|
||||
ref: "tableHeader",
|
||||
class: normalizeClass(_ctx.ns.e("header")),
|
||||
style: normalizeStyle(_ctx.tableBodyStyles),
|
||||
border: "0",
|
||||
cellpadding: "0",
|
||||
cellspacing: "0"
|
||||
}, [
|
||||
createVNode(_component_hColgroup, {
|
||||
columns: _ctx.store.states.columns.value,
|
||||
"table-layout": _ctx.tableLayout
|
||||
}, null, 8, ["columns", "table-layout"]),
|
||||
createVNode(_component_table_header, {
|
||||
ref: "tableHeaderRef",
|
||||
border: _ctx.border,
|
||||
"default-sort": _ctx.defaultSort,
|
||||
store: _ctx.store,
|
||||
"append-filter-panel-to": _ctx.appendFilterPanelTo,
|
||||
"allow-drag-last-column": _ctx.allowDragLastColumn,
|
||||
onSetDragVisible: _ctx.setDragVisible
|
||||
}, null, 8, ["border", "default-sort", "store", "append-filter-panel-to", "allow-drag-last-column", "onSetDragVisible"])
|
||||
], 6)
|
||||
], 2)), [
|
||||
[_directive_mousewheel, _ctx.handleHeaderFooterMousewheel]
|
||||
]) : createCommentVNode("v-if", true),
|
||||
createElementVNode("div", {
|
||||
ref: "bodyWrapper",
|
||||
class: normalizeClass(_ctx.ns.e("body-wrapper"))
|
||||
}, [
|
||||
createVNode(_component_el_scrollbar, {
|
||||
ref: "scrollBarRef",
|
||||
"view-style": _ctx.scrollbarViewStyle,
|
||||
"wrap-style": _ctx.scrollbarStyle,
|
||||
always: _ctx.scrollbarAlwaysOn,
|
||||
tabindex: _ctx.scrollbarTabindex,
|
||||
native: _ctx.nativeScrollbar,
|
||||
onScroll: ($event) => _ctx.$emit("scroll", $event)
|
||||
}, {
|
||||
default: withCtx(() => [
|
||||
createElementVNode("table", {
|
||||
ref: "tableBody",
|
||||
class: normalizeClass(_ctx.ns.e("body")),
|
||||
cellspacing: "0",
|
||||
cellpadding: "0",
|
||||
border: "0",
|
||||
style: normalizeStyle({
|
||||
width: _ctx.bodyWidth,
|
||||
tableLayout: _ctx.tableLayout
|
||||
})
|
||||
}, [
|
||||
createVNode(_component_hColgroup, {
|
||||
columns: _ctx.store.states.columns.value,
|
||||
"table-layout": _ctx.tableLayout
|
||||
}, null, 8, ["columns", "table-layout"]),
|
||||
_ctx.showHeader && _ctx.tableLayout === "auto" ? (openBlock(), createBlock(_component_table_header, {
|
||||
key: 0,
|
||||
ref: "tableHeaderRef",
|
||||
class: normalizeClass(_ctx.ns.e("body-header")),
|
||||
border: _ctx.border,
|
||||
"default-sort": _ctx.defaultSort,
|
||||
store: _ctx.store,
|
||||
"append-filter-panel-to": _ctx.appendFilterPanelTo,
|
||||
onSetDragVisible: _ctx.setDragVisible
|
||||
}, null, 8, ["class", "border", "default-sort", "store", "append-filter-panel-to", "onSetDragVisible"])) : createCommentVNode("v-if", true),
|
||||
createVNode(_component_table_body, {
|
||||
context: _ctx.context,
|
||||
highlight: _ctx.highlightCurrentRow,
|
||||
"row-class-name": _ctx.rowClassName,
|
||||
"tooltip-effect": _ctx.tooltipEffect,
|
||||
"tooltip-options": _ctx.tooltipOptions,
|
||||
"row-style": _ctx.rowStyle,
|
||||
store: _ctx.store,
|
||||
stripe: _ctx.stripe
|
||||
}, null, 8, ["context", "highlight", "row-class-name", "tooltip-effect", "tooltip-options", "row-style", "store", "stripe"]),
|
||||
_ctx.showSummary && _ctx.tableLayout === "auto" ? (openBlock(), createBlock(_component_table_footer, {
|
||||
key: 1,
|
||||
class: normalizeClass(_ctx.ns.e("body-footer")),
|
||||
border: _ctx.border,
|
||||
"default-sort": _ctx.defaultSort,
|
||||
store: _ctx.store,
|
||||
"sum-text": _ctx.computedSumText,
|
||||
"summary-method": _ctx.summaryMethod
|
||||
}, null, 8, ["class", "border", "default-sort", "store", "sum-text", "summary-method"])) : createCommentVNode("v-if", true)
|
||||
], 6),
|
||||
_ctx.isEmpty ? (openBlock(), createElementBlock("div", {
|
||||
key: 0,
|
||||
ref: "emptyBlock",
|
||||
style: normalizeStyle(_ctx.emptyBlockStyle),
|
||||
class: normalizeClass(_ctx.ns.e("empty-block"))
|
||||
}, [
|
||||
createElementVNode("span", {
|
||||
class: normalizeClass(_ctx.ns.e("empty-text"))
|
||||
}, [
|
||||
renderSlot(_ctx.$slots, "empty", {}, () => [
|
||||
createTextVNode(toDisplayString(_ctx.computedEmptyText), 1)
|
||||
])
|
||||
], 2)
|
||||
], 6)) : createCommentVNode("v-if", true),
|
||||
_ctx.$slots.append ? (openBlock(), createElementBlock("div", {
|
||||
key: 1,
|
||||
ref: "appendWrapper",
|
||||
class: normalizeClass(_ctx.ns.e("append-wrapper"))
|
||||
}, [
|
||||
renderSlot(_ctx.$slots, "append")
|
||||
], 2)) : createCommentVNode("v-if", true)
|
||||
]),
|
||||
_: 3
|
||||
}, 8, ["view-style", "wrap-style", "always", "tabindex", "native", "onScroll"])
|
||||
], 2),
|
||||
_ctx.showSummary && _ctx.tableLayout === "fixed" ? withDirectives((openBlock(), createElementBlock("div", {
|
||||
key: 1,
|
||||
ref: "footerWrapper",
|
||||
class: normalizeClass(_ctx.ns.e("footer-wrapper"))
|
||||
}, [
|
||||
createElementVNode("table", {
|
||||
class: normalizeClass(_ctx.ns.e("footer")),
|
||||
cellspacing: "0",
|
||||
cellpadding: "0",
|
||||
border: "0",
|
||||
style: normalizeStyle(_ctx.tableBodyStyles)
|
||||
}, [
|
||||
createVNode(_component_hColgroup, {
|
||||
columns: _ctx.store.states.columns.value,
|
||||
"table-layout": _ctx.tableLayout
|
||||
}, null, 8, ["columns", "table-layout"]),
|
||||
createVNode(_component_table_footer, {
|
||||
border: _ctx.border,
|
||||
"default-sort": _ctx.defaultSort,
|
||||
store: _ctx.store,
|
||||
"sum-text": _ctx.computedSumText,
|
||||
"summary-method": _ctx.summaryMethod
|
||||
}, null, 8, ["border", "default-sort", "store", "sum-text", "summary-method"])
|
||||
], 6)
|
||||
], 2)), [
|
||||
[vShow, !_ctx.isEmpty],
|
||||
[_directive_mousewheel, _ctx.handleHeaderFooterMousewheel]
|
||||
]) : createCommentVNode("v-if", true),
|
||||
_ctx.border || _ctx.isGroup ? (openBlock(), createElementBlock("div", {
|
||||
key: 2,
|
||||
class: normalizeClass(_ctx.ns.e("border-left-patch"))
|
||||
}, null, 2)) : createCommentVNode("v-if", true)
|
||||
], 2),
|
||||
withDirectives(createElementVNode("div", {
|
||||
ref: "resizeProxy",
|
||||
class: normalizeClass(_ctx.ns.e("column-resize-proxy"))
|
||||
}, null, 2), [
|
||||
[vShow, _ctx.resizeProxyVisible]
|
||||
])
|
||||
], 46, ["data-prefix", "onMouseleave"]);
|
||||
}
|
||||
var Table = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "table.vue"]]);
|
||||
|
||||
export { Table as default };
|
||||
//# sourceMappingURL=table.mjs.map
|
||||
Reference in New Issue
Block a user