| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175 |
- 'use strict';
- Object.defineProperty(exports, '__esModule', { value: true });
- var vue = require('vue');
- var config = require('../config.js');
- var util = require('../util.js');
- var index = require('../../../../hooks/use-namespace/index.js');
- var types = require('../../../../utils/types.js');
- var shared = require('@vue/shared');
- function useRender(props, slots, owner) {
- const instance = vue.getCurrentInstance();
- const columnId = vue.ref("");
- const isSubColumn = vue.ref(false);
- const realAlign = vue.ref();
- const realHeaderAlign = vue.ref();
- const ns = index.useNamespace("table");
- vue.watchEffect(() => {
- realAlign.value = props.align ? `is-${props.align}` : null;
- realAlign.value;
- });
- vue.watchEffect(() => {
- realHeaderAlign.value = props.headerAlign ? `is-${props.headerAlign}` : realAlign.value;
- realHeaderAlign.value;
- });
- const columnOrTableParent = vue.computed(() => {
- let parent = instance.vnode.vParent || instance.parent;
- while (parent && !parent.tableId && !parent.columnId) {
- parent = parent.vnode.vParent || parent.parent;
- }
- return parent;
- });
- const hasTreeColumn = vue.computed(() => {
- const { store } = instance.parent;
- if (!store)
- return false;
- const { treeData } = store.states;
- const treeDataValue = treeData.value;
- return treeDataValue && Object.keys(treeDataValue).length > 0;
- });
- const realWidth = vue.ref(util.parseWidth(props.width));
- const realMinWidth = vue.ref(util.parseMinWidth(props.minWidth));
- const setColumnWidth = (column) => {
- if (realWidth.value)
- column.width = realWidth.value;
- if (realMinWidth.value) {
- column.minWidth = realMinWidth.value;
- }
- if (!realWidth.value && realMinWidth.value) {
- column.width = void 0;
- }
- if (!column.minWidth) {
- column.minWidth = 80;
- }
- column.realWidth = Number(types.isUndefined(column.width) ? column.minWidth : column.width);
- return column;
- };
- const setColumnForcedProps = (column) => {
- const type = column.type;
- const source = config.cellForced[type] || {};
- Object.keys(source).forEach((prop) => {
- const value = source[prop];
- if (prop !== "className" && !types.isUndefined(value)) {
- column[prop] = value;
- }
- });
- const className = config.getDefaultClassName(type);
- if (className) {
- const forceClass = `${vue.unref(ns.namespace)}-${className}`;
- column.className = column.className ? `${column.className} ${forceClass}` : forceClass;
- }
- return column;
- };
- const checkSubColumn = (children) => {
- if (shared.isArray(children)) {
- children.forEach((child) => check(child));
- } else {
- check(children);
- }
- function check(item) {
- var _a;
- if (((_a = item == null ? void 0 : item.type) == null ? void 0 : _a.name) === "ElTableColumn") {
- item.vParent = instance;
- }
- }
- };
- const setColumnRenders = (column) => {
- if (props.renderHeader) ; else if (column.type !== "selection") {
- column.renderHeader = (scope) => {
- instance.columnConfig.value["label"];
- return vue.renderSlot(slots, "header", scope, () => [column.label]);
- };
- }
- if (slots["filter-icon"]) {
- column.renderFilterIcon = (scope) => {
- return vue.renderSlot(slots, "filter-icon", scope);
- };
- }
- if (slots.expand) {
- column.renderExpand = (scope) => {
- return vue.renderSlot(slots, "expand", scope);
- };
- }
- let originRenderCell = column.renderCell;
- if (column.type === "expand") {
- column.renderCell = (data) => vue.h("div", {
- class: "cell"
- }, [originRenderCell(data)]);
- owner.value.renderExpanded = (row) => {
- return slots.default ? slots.default(row) : slots.default;
- };
- } else {
- originRenderCell = originRenderCell || config.defaultRenderCell;
- column.renderCell = (data) => {
- let children = null;
- if (slots.default) {
- const vnodes = slots.default(data);
- children = vnodes.some((v) => v.type !== vue.Comment) ? vnodes : originRenderCell(data);
- } else {
- children = originRenderCell(data);
- }
- const { columns } = owner.value.store.states;
- const firstUserColumnIndex = columns.value.findIndex((item) => item.type === "default");
- const shouldCreatePlaceholder = hasTreeColumn.value && data.cellIndex === firstUserColumnIndex;
- const prefix = config.treeCellPrefix(data, shouldCreatePlaceholder);
- const props2 = {
- class: "cell",
- style: {}
- };
- if (column.showOverflowTooltip) {
- props2.class = `${props2.class} ${vue.unref(ns.namespace)}-tooltip`;
- props2.style = {
- width: `${(data.column.realWidth || Number(data.column.width)) - 1}px`
- };
- }
- checkSubColumn(children);
- return vue.h("div", props2, [prefix, children]);
- };
- }
- return column;
- };
- const getPropsData = (...propsKey) => {
- return propsKey.reduce((prev, cur) => {
- if (shared.isArray(cur)) {
- cur.forEach((key) => {
- prev[key] = props[key];
- });
- }
- return prev;
- }, {});
- };
- const getColumnElIndex = (children, child) => {
- return Array.prototype.indexOf.call(children, child);
- };
- const updateColumnOrder = () => {
- owner.value.store.commit("updateColumnOrder", instance.columnConfig.value);
- };
- return {
- columnId,
- realAlign,
- isSubColumn,
- realHeaderAlign,
- columnOrTableParent,
- setColumnWidth,
- setColumnForcedProps,
- setColumnRenders,
- getPropsData,
- getColumnElIndex,
- updateColumnOrder
- };
- }
- exports["default"] = useRender;
- //# sourceMappingURL=render-helper.js.map
|