You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 line
18 KiB
1 line
18 KiB
{"ast":null,"code":"import { defineComponent, getCurrentInstance, inject, ref, onMounted, nextTick, h } from 'vue';\nimport { ElCheckbox } from '../../../checkbox/index.mjs';\nimport '../../../../hooks/index.mjs';\nimport FilterPanel from '../filter-panel.mjs';\nimport useLayoutObserver from '../layout-observer.mjs';\nimport { TABLE_INJECTION_KEY } from '../tokens.mjs';\nimport useEvent from './event-helper.mjs';\nimport useStyle from './style.helper.mjs';\nimport useUtils from './utils-helper.mjs';\nimport { useNamespace } from '../../../../hooks/use-namespace/index.mjs';\nvar TableHeader = 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\n },\n border: Boolean,\n defaultSort: {\n type: Object,\n default: () => {\n return {\n prop: \"\",\n order: \"\"\n };\n }\n },\n appendFilterPanelTo: {\n type: String\n }\n },\n setup(props, {\n emit\n }) {\n const instance = getCurrentInstance();\n const parent = inject(TABLE_INJECTION_KEY);\n const ns = useNamespace(\"table\");\n const filterPanels = ref({});\n const {\n onColumnsChange,\n onScrollableChange\n } = useLayoutObserver(parent);\n onMounted(async () => {\n await nextTick();\n await nextTick();\n const {\n prop,\n order\n } = props.defaultSort;\n parent == null ? void 0 : parent.store.commit(\"sort\", {\n prop,\n order,\n init: true\n });\n });\n const {\n handleHeaderClick,\n handleHeaderContextMenu,\n handleMouseDown,\n handleMouseMove,\n handleMouseOut,\n handleSortClick,\n handleFilterClick\n } = useEvent(props, emit);\n const {\n getHeaderRowStyle,\n getHeaderRowClass,\n getHeaderCellStyle,\n getHeaderCellClass\n } = useStyle(props);\n const {\n isGroup,\n toggleAllSelection,\n columnRows\n } = useUtils(props);\n instance.state = {\n onColumnsChange,\n onScrollableChange\n };\n instance.filterPanels = filterPanels;\n return {\n ns,\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 };\n },\n render() {\n const {\n ns,\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 } = this;\n let rowSpan = 1;\n return h(\"thead\", {\n class: {\n [ns.is(\"group\")]: isGroup\n }\n }, columnRows.map((subColumns, rowIndex) => h(\"tr\", {\n class: getHeaderRowClass(rowIndex),\n key: rowIndex,\n style: getHeaderRowStyle(rowIndex)\n }, subColumns.map((column, cellIndex) => {\n if (column.rowSpan > rowSpan) {\n rowSpan = column.rowSpan;\n }\n return h(\"th\", {\n class: getHeaderCellClass(rowIndex, cellIndex, subColumns, column),\n colspan: column.colSpan,\n key: `${column.id}-thead`,\n rowspan: column.rowSpan,\n style: getHeaderCellStyle(rowIndex, cellIndex, subColumns, column),\n onClick: $event => {\n if ($event.currentTarget.classList.contains(\"noclick\")) {\n return;\n }\n handleHeaderClick($event, column);\n },\n onContextmenu: $event => handleHeaderContextMenu($event, column),\n onMousedown: $event => handleMouseDown($event, column),\n onMousemove: $event => handleMouseMove($event, column),\n onMouseout: handleMouseOut\n }, [h(\"div\", {\n class: [\"cell\", column.filteredValue && column.filteredValue.length > 0 ? \"highlight\" : \"\"]\n }, [column.renderHeader ? column.renderHeader({\n column,\n $index: cellIndex,\n store,\n _self: $parent\n }) : column.label, column.sortable && h(\"span\", {\n onClick: $event => handleSortClick($event, column),\n class: \"caret-wrapper\"\n }, [h(\"i\", {\n onClick: $event => handleSortClick($event, column, \"ascending\"),\n class: \"sort-caret ascending\"\n }), h(\"i\", {\n onClick: $event => handleSortClick($event, column, \"descending\"),\n class: \"sort-caret descending\"\n })]), column.filterable && h(FilterPanel, {\n store,\n placement: column.filterPlacement || \"bottom-start\",\n appendTo: $parent.appendFilterPanelTo,\n column,\n upDataColumn: (key, value) => {\n column[key] = value;\n }\n }, {\n \"filter-icon\": () => column.renderFilterIcon ? column.renderFilterIcon({\n filterOpened: column.filterOpened\n }) : null\n })])]);\n }))));\n }\n});\nexport { TableHeader as default };","map":{"version":3,"names":["TableHeader","defineComponent","name","components","ElCheckbox","props","fixed","type","String","default","store","required","Object","border","Boolean","defaultSort","prop","order","appendFilterPanelTo","setup","emit","instance","getCurrentInstance","parent","inject","TABLE_INJECTION_KEY","ns","useNamespace","filterPanels","ref","onColumnsChange","onScrollableChange","useLayoutObserver","onMounted","nextTick","commit","init","handleHeaderClick","handleHeaderContextMenu","handleMouseDown","handleMouseMove","handleMouseOut","handleSortClick","handleFilterClick","useEvent","getHeaderRowStyle","getHeaderRowClass","getHeaderCellStyle","getHeaderCellClass","useStyle","isGroup","toggleAllSelection","columnRows","useUtils","state","render","$parent","rowSpan","h","class","is","map","subColumns","rowIndex","key","style","column","cellIndex","colspan","colSpan","id","rowspan","onClick","$event","currentTarget","classList","contains","onContextmenu","onMousedown","onMousemove","onMouseout","filteredValue","length","renderHeader","$index","_self","label","sortable","filterable","FilterPanel","placement","filterPlacement","appendTo","upDataColumn","value","filter-icon","renderFilterIcon","filterOpened"],"sources":["../../../../../../../packages/components/table/src/table-header/index.ts"],"sourcesContent":["// @ts-nocheck\nimport {\n defineComponent,\n getCurrentInstance,\n h,\n inject,\n nextTick,\n onMounted,\n ref,\n} from 'vue'\nimport ElCheckbox from '@element-plus/components/checkbox'\nimport { useNamespace } from '@element-plus/hooks'\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'\nimport type { ComponentInternalInstance, PropType, Ref } from 'vue'\nimport type { DefaultRow, Sort } from '../table/defaults'\nimport type { Store } from '../store'\nexport interface TableHeader extends ComponentInternalInstance {\n state: {\n onColumnsChange\n onScrollableChange\n }\n filterPanels: Ref<unknown>\n}\nexport interface TableHeaderProps<T> {\n fixed: string\n store: Store<T>\n border: boolean\n defaultSort: Sort\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<DefaultRow>['store']>,\n },\n border: Boolean,\n defaultSort: {\n type: Object as PropType<TableHeaderProps<DefaultRow>['defaultSort']>,\n default: () => {\n return {\n prop: '',\n order: '',\n }\n },\n },\n appendFilterPanelTo: {\n type: String,\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 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 const {\n handleHeaderClick,\n handleHeaderContextMenu,\n handleMouseDown,\n handleMouseMove,\n handleMouseOut,\n handleSortClick,\n handleFilterClick,\n } = useEvent(props as TableHeaderProps<unknown>, emit)\n const {\n getHeaderRowStyle,\n getHeaderRowClass,\n getHeaderCellStyle,\n getHeaderCellClass,\n } = useStyle(props as TableHeaderProps<unknown>)\n const { isGroup, toggleAllSelection, columnRows } = useUtils(\n props as TableHeaderProps<unknown>\n )\n\n instance.state = {\n onColumnsChange,\n onScrollableChange,\n }\n instance.filterPanels = filterPanels\n\n return {\n ns,\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 }\n },\n render() {\n const {\n ns,\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 } = this\n let rowSpan = 1\n return h(\n 'thead',\n {\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 return h(\n 'th',\n {\n class: getHeaderCellClass(\n rowIndex,\n cellIndex,\n subColumns,\n column\n ),\n colspan: column.colSpan,\n key: `${column.id}-thead`,\n rowspan: column.rowSpan,\n style: getHeaderCellStyle(\n rowIndex,\n cellIndex,\n subColumns,\n column\n ),\n onClick: ($event) => {\n if ($event.currentTarget.classList.contains('noclick')) {\n return\n }\n handleHeaderClick($event, column)\n },\n onContextmenu: ($event) =>\n handleHeaderContextMenu($event, column),\n onMousedown: ($event) => handleMouseDown($event, column),\n onMousemove: ($event) => 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 'span',\n {\n onClick: ($event) => handleSortClick($event, column),\n class: 'caret-wrapper',\n },\n [\n h('i', {\n onClick: ($event) =>\n handleSortClick($event, column, 'ascending'),\n class: 'sort-caret ascending',\n }),\n h('i', {\n onClick: ($event) =>\n handleSortClick($event, column, 'descending'),\n class: 'sort-caret descending',\n }),\n ]\n ),\n column.filterable &&\n h(\n FilterPanel,\n {\n store,\n placement: column.filterPlacement || 'bottom-start',\n appendTo: $parent.appendFilterPanelTo,\n column,\n upDataColumn: (key, value) => {\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"],"mappings":"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","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]} |