@visactor/vue-vtable/cjs/hooks/useEditorRender.js

The vue version of VTable

'use strict';

var vue = require('vue');
var vutils = require('@visactor/vutils');
var util = require('../edit/util.js');

/**
 * 编辑渲染器
 * @param props
 * @param tableRef
 */
function useEditorRender(props, tableRef) {
    /** 当前实例 */
    const instance = vue.getCurrentInstance();
    /** 需要渲染编辑器的列 */
    const validColumns = vue.computed(() => {
        var _a;
        const columns = flattenColumns(((_a = props.options) === null || _a === void 0 ? void 0 : _a.columns) || []);
        if (!vutils.isArray(columns)) {
            return [];
        }
        return columns.filter(col => !!vutils.isObject(col) && !!util.checkRenderEditor(col));
    });
    vue.watchEffect(() => {
        resolveRenderEditor();
    });
    vue.onBeforeUnmount(() => {
        releaseRenderEditor();
    });
    /**
     * @description: 动态渲染式编辑器
     * @return {*}
     */
    function resolveRenderEditor() {
        const id = getTableId();
        if (!vutils.isValid(id)) {
            return;
        }
        // 移除原本已存在的编辑器
        let renderEditor = util.getRenderEditor();
        if (renderEditor) {
            renderEditor.removeNode(id);
        }
        else if (validColumns.value.length > 0) {
            // 注册编辑器
            renderEditor = util.getRenderEditor(true, instance === null || instance === void 0 ? void 0 : instance.appContext);
        }
        validColumns.value.forEach(column => {
            const { getEditCustomNode } = column;
            const key = util.getRenderEditorColumnKeyField(column);
            renderEditor.registerNode(id, key, getEditCustomNode);
            delete column.editCustomNode;
        });
    }
    /**
     * @description: 释放动态渲染式编辑器
     * @return {*}
     */
    function releaseRenderEditor() {
        const id = getTableId();
        if (!vutils.isValid(id)) {
            return;
        }
        const renderEditor = util.getRenderEditor();
        renderEditor === null || renderEditor === void 0 ? void 0 : renderEditor.release(id);
    }
    /**
     * @description: 获取表格 id
     * @return {*}
     */
    function getTableId() {
        var _a;
        return (_a = tableRef.value) === null || _a === void 0 ? void 0 : _a.id;
    }
}
/**
 * @description: 获取所有扁平化的 columns
 * @param {any} columns
 */
function flattenColumns(columns) {
    return columns.flatMap(column => (Array.isArray(column.columns) ? flattenColumns(column.columns) : column));
}

exports.useEditorRender = useEditorRender;