element-plus
Version:
A Component Library for Vue 3
1 lines • 16.9 kB
Source Map (JSON)
{"version":3,"file":"index.mjs","sources":["../../../../../../../packages/components/table/src/table-header/index.ts"],"sourcesContent":["import {\n defineComponent,\n getCurrentInstance,\n h,\n inject,\n nextTick,\n onBeforeUnmount,\n onMounted,\n reactive,\n ref,\n watch,\n} from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useLocale } from '@element-plus/hooks/use-locale'\nimport FilterPanel from '../filter-panel.vue'\nimport useLayoutObserver from '../layout-observer'\nimport { TABLE_INJECTION_KEY } from '../tokens'\nimport useEvent from './event-helper'\nimport useStyle from './style.helper'\nimport useUtils from './utils-helper'\n\nimport type TableLayout from '../table-layout'\nimport type { ComponentInternalInstance, PropType, Ref } from 'vue'\nimport type { DefaultRow, Sort } from '../table/defaults'\nimport type { Store } from '../store'\n\nexport interface TableHeader extends ComponentInternalInstance {\n state: {\n onColumnsChange: (layout: TableLayout<any>) => void\n onScrollableChange: (layout: TableLayout<any>) => void\n }\n filterPanels: Ref<DefaultRow>\n}\nexport interface TableHeaderProps<T extends DefaultRow> {\n fixed: string\n store: Store<T>\n border: boolean\n defaultSort: Sort\n allowDragLastColumn: boolean\n}\n\nexport default defineComponent({\n name: 'ElTableHeader',\n components: {\n ElCheckbox,\n },\n props: {\n fixed: {\n type: String,\n default: '',\n },\n store: {\n required: true,\n type: Object as PropType<TableHeaderProps<any>['store']>,\n },\n border: Boolean,\n defaultSort: {\n type: Object as PropType<TableHeaderProps<any>['defaultSort']>,\n default: () => {\n return {\n prop: '',\n order: '',\n }\n },\n },\n appendFilterPanelTo: {\n type: String,\n },\n allowDragLastColumn: {\n type: Boolean,\n },\n },\n setup(props, { emit }) {\n const instance = getCurrentInstance() as TableHeader\n const parent = inject(TABLE_INJECTION_KEY)\n const ns = useNamespace('table')\n const filterPanels = ref({})\n const { onColumnsChange, onScrollableChange } = useLayoutObserver(parent!)\n\n const isTableLayoutAuto = parent?.props.tableLayout === 'auto'\n const saveIndexSelection = reactive(new Map())\n const theadRef = ref()\n\n let delayId: ReturnType<typeof setTimeout> | undefined\n const updateFixedColumnStyle = () => {\n delayId = setTimeout(() => {\n if (saveIndexSelection.size > 0) {\n saveIndexSelection.forEach((column, key) => {\n const el = theadRef.value.querySelector(\n `.${key.replace(/\\s/g, '.')}`\n )\n if (el) {\n const width = el.getBoundingClientRect().width\n column.width = width || column.width\n }\n })\n saveIndexSelection.clear()\n }\n })\n }\n\n watch(saveIndexSelection, updateFixedColumnStyle)\n onBeforeUnmount(() => {\n if (delayId) {\n clearTimeout(delayId)\n delayId = undefined\n }\n })\n\n onMounted(async () => {\n // Need double await, because updateColumns is executed after nextTick for now\n await nextTick()\n await nextTick()\n const { prop, order } = props.defaultSort\n parent?.store.commit('sort', { prop, order, init: true })\n\n updateFixedColumnStyle()\n })\n\n const {\n handleHeaderClick,\n handleHeaderContextMenu,\n handleMouseDown,\n handleMouseMove,\n handleMouseOut,\n handleSortClick,\n handleFilterClick,\n } = useEvent(props as TableHeaderProps<any>, emit)\n const {\n getHeaderRowStyle,\n getHeaderRowClass,\n getHeaderCellStyle,\n getHeaderCellClass,\n } = useStyle(props as TableHeaderProps<any>)\n const { isGroup, toggleAllSelection, columnRows } = useUtils(\n props as TableHeaderProps<any>\n )\n\n const { t } = useLocale()\n\n instance.state = {\n onColumnsChange,\n onScrollableChange,\n }\n instance.filterPanels = filterPanels\n\n return {\n ns,\n t,\n filterPanels,\n onColumnsChange,\n onScrollableChange,\n columnRows,\n getHeaderRowClass,\n getHeaderRowStyle,\n getHeaderCellClass,\n getHeaderCellStyle,\n handleHeaderClick,\n handleHeaderContextMenu,\n handleMouseDown,\n handleMouseMove,\n handleMouseOut,\n handleSortClick,\n handleFilterClick,\n isGroup,\n toggleAllSelection,\n saveIndexSelection,\n isTableLayoutAuto,\n theadRef,\n updateFixedColumnStyle,\n }\n },\n render() {\n const {\n ns,\n t,\n isGroup,\n columnRows,\n getHeaderCellStyle,\n getHeaderCellClass,\n getHeaderRowClass,\n getHeaderRowStyle,\n handleHeaderClick,\n handleHeaderContextMenu,\n handleMouseDown,\n handleMouseMove,\n handleSortClick,\n handleMouseOut,\n store,\n $parent,\n saveIndexSelection,\n isTableLayoutAuto,\n } = this\n let rowSpan = 1\n return h(\n 'thead',\n {\n ref: 'theadRef',\n class: ns.is('group', isGroup),\n },\n columnRows.map((subColumns, rowIndex) =>\n h(\n 'tr',\n {\n class: getHeaderRowClass(rowIndex),\n key: rowIndex,\n style: getHeaderRowStyle(rowIndex),\n },\n subColumns.map((column, cellIndex) => {\n if (column.rowSpan > rowSpan) {\n rowSpan = column.rowSpan\n }\n const _class = getHeaderCellClass(\n rowIndex,\n cellIndex,\n subColumns,\n column\n )\n if (isTableLayoutAuto && column.fixed) {\n saveIndexSelection.set(_class, column)\n }\n return h(\n 'th',\n {\n class: _class,\n colspan: column.colSpan,\n key: `${column.id}-thead`,\n rowspan: column.rowSpan,\n scope: column.colSpan > 1 ? 'colgroup' : 'col',\n ariaSort: column.sortable ? column.order : undefined,\n style: getHeaderCellStyle(\n rowIndex,\n cellIndex,\n subColumns,\n column\n ),\n onClick: ($event: Event) => {\n if (\n ($event.currentTarget as Element)?.classList.contains(\n 'noclick'\n )\n ) {\n return\n }\n handleHeaderClick($event, column)\n },\n onContextmenu: ($event: MouseEvent) =>\n handleHeaderContextMenu($event, column),\n onMousedown: ($event: MouseEvent) =>\n handleMouseDown($event, column),\n onMousemove: ($event: MouseEvent) =>\n handleMouseMove($event, column),\n onMouseout: handleMouseOut,\n },\n [\n h(\n 'div',\n {\n class: [\n 'cell',\n column.filteredValue && column.filteredValue.length > 0\n ? 'highlight'\n : '',\n ],\n },\n [\n column.renderHeader\n ? column.renderHeader({\n column,\n $index: cellIndex,\n store,\n _self: $parent,\n })\n : column.label,\n column.sortable &&\n h(\n 'button',\n {\n type: 'button',\n class: 'caret-wrapper',\n 'aria-label': t('el.table.sortLabel', {\n column: column.label || '',\n }),\n onClick: ($event: Event) =>\n handleSortClick($event, column),\n },\n [\n h('i', {\n onClick: ($event: Event) =>\n handleSortClick($event, column, 'ascending'),\n class: 'sort-caret ascending',\n }),\n h('i', {\n onClick: ($event: Event) =>\n handleSortClick($event, column, 'descending'),\n class: 'sort-caret descending',\n }),\n ]\n ),\n column.filterable &&\n h(\n FilterPanel as any,\n {\n store,\n placement: column.filterPlacement || 'bottom-start',\n appendTo: ($parent as any)?.appendFilterPanelTo,\n column,\n upDataColumn: (key: never, value: never) => {\n column[key] = value\n },\n },\n {\n 'filter-icon': () =>\n column.renderFilterIcon\n ? column.renderFilterIcon({\n filterOpened: column.filterOpened,\n })\n : null,\n }\n ),\n ]\n ),\n ]\n )\n })\n )\n )\n )\n },\n})\n"],"names":[],"mappings":"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"}