Oracle APEX交互式网格区域最大化功能实现求助

你可以通过以下方式完善代码，实现交互式网格的最大化/还原功能：

1. 修改动作的set方法，添加DOM操作和样式切换逻辑，同时保存区域原有样式以便还原：

function(config) {
    let $           = apex.jQuery,
        toolbarData = $.apex.interactiveGrid.copyDefaultToolbar(),
        toolbarGroup = toolbarData.toolbarFind("actions4");

    toolbarGroup.controls.push({
        type: "TOGGLE",
        action: "maximize-region",
        icon: "fa fa-expand"
    });

    config.initActions = function(actions){
        actions.add({
            name: "maximize-region",
            maximize: false,
            // 保存区域原始样式
            originalStyles: {},
            set: function(maximize) {
                this.maximize = maximize;
                let $igWidget = $(this.context.$widget);
                let $region = $igWidget.closest(".t-Region");
                let toggleButton = $igWidget.find(".a-Icon.fa-expand, .a-Icon.fa-compress");

                if (maximize) {
                    // 保存原始样式
                    this.originalStyles = {
                        position: $region.css("position"),
                        top: $region.css("top"),
                        left: $region.css("left"),
                        width: $region.css("width"),
                        height: $region.css("height"),
                        zIndex: $region.css("z-index")
                    };
                    // 应用最大化样式
                    $region.css({
                        position: "fixed",
                        top: "0",
                        left: "0",
                        width: "100vw",
                        height: "100vh",
                        "z-index": "9999",
                        overflow: "auto"
                    });
                    // 切换图标为压缩
                    toggleButton.removeClass("fa-expand").addClass("fa-compress");
                } else {
                    // 还原原始样式
                    $region.css(this.originalStyles);
                    // 切换图标为展开
                    toggleButton.removeClass("fa-compress").addClass("fa-expand");
                }
            },
            get: function() {
                return this.maximize;
            }
        });
    }

    config.toolbarData = toolbarData;
    return config;
}

2. 关键逻辑说明：

• 通过$(this.context.$widget)获取交互式网格的容器对象，再向上查找找到对应的区域元素(.t-Region)
• 最大化时保存区域的原始样式属性，避免还原时样式错乱
• 应用固定定位、全屏宽高、高层级等样式实现全屏效果
• 同步切换按钮图标，给用户直观的状态反馈
• 还原时直接恢复之前保存的原始样式

内容的提问来源于stack exchange，提问作者Jason Bourne