如何设计公用跳转动作(类似导入导出动作)

背景

设计一个公共动作,在界面设计器可以拖到页面里,点击之后跳转指定页面。就像导入导出一样。

实现思路

元数据计算时,初始化跳转动作,为本模块以及依赖于本模块的所有模块生成该跳转动作。实现所有模型都有该跳转动作的元数据。

代码示例:

package pro.shushi.pamirs.top.core.init;

import com.google.common.collect.Lists;
import org.apache.commons.collections4.MapUtils;
import org.springframework.stereotype.Component;
import pro.shushi.pamirs.boot.base.enmu.ActionTargetEnum;
import pro.shushi.pamirs.boot.base.enmu.ActionTypeEnum;
import pro.shushi.pamirs.boot.base.model.ViewAction;
import pro.shushi.pamirs.boot.common.api.command.AppLifecycleCommand;
import pro.shushi.pamirs.boot.common.extend.MetaDataEditor;
import pro.shushi.pamirs.core.common.InitializationUtil;
import pro.shushi.pamirs.meta.annotation.fun.extern.Slf4j;
import pro.shushi.pamirs.meta.api.dto.meta.Meta;
import pro.shushi.pamirs.meta.api.dto.meta.MetaData;
import pro.shushi.pamirs.meta.domain.model.ModelDefinition;
import pro.shushi.pamirs.meta.enmu.ActionContextTypeEnum;
import pro.shushi.pamirs.meta.enmu.SystemSourceEnum;
import pro.shushi.pamirs.meta.enmu.ViewTypeEnum;
import pro.shushi.pamirs.top.api.TopModule;
import pro.shushi.pamirs.top.api.model.Teacher;

import java.util.*;
import java.util.stream.Collectors;

@Slf4j
@Component
public class DemoModuleAppInstall implements MetaDataEditor {
    @Override
    public void edit(AppLifecycleCommand command, Map<String, Meta> metaMap) {
        InitializationUtil util = InitializationUtil.get(metaMap, TopModule.MODULE_MODULE, TopModule.MODULE_NAME);
        if (util == null) {
            return;
        }
        if (MapUtils.isEmpty(metaMap)) {
            return;
        }

        Set<String> dependencyFileModels = metaMap.values().stream()
                .filter(v -> v.getData().containsKey(TopModule.MODULE_MODULE))
                .map(Meta::getModule)
                .collect(Collectors.toSet());
        for (String module : metaMap.keySet()) {
            if (!dependencyFileModels.contains(module)) {
                // 不依赖本模块,不生成跳转动作
                continue;
            }
            Meta meta = metaMap.get(module);
            MetaData metaData = meta.getCurrentModuleData();
            List<ModelDefinition> modelList = metaData.getDataList(ModelDefinition.MODEL_MODEL);
            for (ModelDefinition data : modelList) {
                makeDefaultModelViewAction(meta, data, dependencyFileModels);
            }
        }
    }

    // 跳转的xml模版 name
    public static final String DEFAULT_VIEW_NAME = "fixed_teacher_table";

    private void makeDefaultModelViewAction(Meta meta, ModelDefinition data, Set<String> dependencyFileModels) {
        if (!dependencyFileModels.contains(data.getModule())) {
            // 当前模块使用了其他模块的模型,对方模块未依赖本模块,不生成跳转动作
            return;
        }
        Map<String, Object> context = new HashMap<>();
        context.put("model", "'" + data.getModel() + "'");
        // 创建 跳转表格页面 viewAction,根据实际需求更改
        makeDefaultViewAction(meta, data,
                "teacherListDialog",
                "教师表格",
                null,
                ActionContextTypeEnum.CONTEXT_FREE,
                ViewTypeEnum.TABLE, 99,
                Teacher.MODEL_MODEL, DEFAULT_VIEW_NAME, ActionTargetEnum.DIALOG,
                context);
    }

    private void makeDefaultViewAction(Meta meta, ModelDefinition data,
                                             String viewActionName,
                                             String displayName,
                                             String title,
                                             ActionContextTypeEnum contextType,
                                             ViewTypeEnum viewType,
                                             int priority,
                                             String resModel,
                                             String resViewName,
                                             ActionTargetEnum target,
                                             Map<String, Object> context) {
        String sign = ViewAction.sign(data.getModel(), viewActionName);
        ViewAction defaultViewAction = meta.getData().get(data.getModule())
                .getDataItem(ViewAction.MODEL_MODEL, sign);
        boolean newAction = false;
        if (null == defaultViewAction) {
            defaultViewAction = new ViewAction();
            newAction = true;
        }
        if (newAction || SystemSourceEnum.MANUAL.equals(defaultViewAction.getSystemSource())) {
            defaultViewAction.setDisplayName(displayName)
                    .setLabel(defaultViewAction.getDisplayName())
                    .setName(viewActionName)
                    .setModel(data.getModel());
            defaultViewAction.setTitle(title)
                    .setViewType(viewType)
                    .setTarget(Optional.ofNullable(target).orElse(ActionTargetEnum.ROUTER))
                    .setResModel(resModel)
                    .setResViewName(resViewName)
                    .setResModule(null)
                    .setResModuleName(null)
                    .setContextType(contextType)
                    .setActionType(ActionTypeEnum.VIEW)
                    .setBindingType(Lists.newArrayList(ViewTypeEnum.TABLE))
                    .setContext(context)
                    .setPriority(priority)
                    .setSystemSource(SystemSourceEnum.MANUAL);
            defaultViewAction.setSign(sign);
            if (newAction) {
                defaultViewAction.construct();
                meta.getData().get(data.getModule()).addData(defaultViewAction);
            } else {
                defaultViewAction.disableMetaCompleted();
            }
        }
    }
}

xml模版示例,默认模版文件放到/pamirs/views下面

可以利用界面设计器生成需要的跳转页面。在base_view表里面根据model以及title查询,template字段就是xml模版。拷贝出来之后,在view标签里指定一个name(即上文的DEFAULT_VIEW_NAME),然后保存为xml文件放到resource/pamirs/views路径下面

<view model="top.Teacher" name = "fixed_teacher_table"  type="table">
    <template colSpan="FULL" slot="search">
        <field colSpan="QUARTER" data="enumType" widget="Select"/>
        <field allowClear="true" autoFillOptions="true" colSpan="QUARTER" data="professionalId" label="科目id" showThousandth="false" statistics="false" widget="Integer"/>
    </template>
    <template colSpan="FULL" cols="24" slot="tableGroup"/>
    <template slot="actionBar">
        <action label="导入" name="internalGotoListImportDialog"/>
        <action label="导出" name="internalGotoListExportDialog" sync="true"/>
        <action label="打印" name="internalGotoPrintDialog"/>
    </template>
    <template checkbox="true" colSpan="FULL" defaultPageSize="OPTION_2" enableSequence="false" filter="" inlineActiveCount="THREE" slot="table" sortable="false">
        <field allowClear="true" autoFillOptions="true" colSpan="HALF" data="teacherName" label="教师名字" patternType="NONE" showCount="false" type="TEXT" widget="Input"/>
        <field allowClear="true" autoFillOptions="true" colSpan="HALF" data="field00001" invisible="true" label="嵌入网页" patternType="NONE" showCount="false" type="TEXT" widget="Input"/>
        <field allowClear="true" autoFillOptions="true" colSpan="HALF" data="readStatus" label="读取状态" optionColorStyle="COLORFUL" widget="Select">
            <options>
                <option displayName="未读" label="未读" name="NO_READ"/>
                <option displayName="结束" label="结束" name="READ"/>
            </options>
        </field>
        <field data="createDate" widget="DateTimePicker"/>
        <field data="writeDate" widget="DateTimePicker"/>
        <template slot="rowActions" colSpan="FULL">
        </template>
        <field data="id" invisible="true"/>
    </template>
</view>

效果:

如何设计公用跳转动作(类似导入导出动作)

Oinone社区 作者:yexiu原创文章,如若转载,请注明出处:https://doc.oinone.top/other/22199.html

访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验

(0)
yexiu的头像yexiu数式员工
上一篇 2025年10月13日 pm3:50
下一篇 2024年4月24日 pm4:45

相关推荐

  • 后端脚手架生成工程

    后端脚手架生成工程 1、使用如下命令来利用项目脚手架生成工程:新建archetype-project-generate.sh 脚本,或者直接下载链接链接:Linux/Unix/Mac下: archetype-project-generate.shWindows: archetype-project-generate.bat archetype-project-generate.sh #!/bin/bash # 项目生成脚手架 # 用于新项目的构建 # 脚手架使用目录 # 本地 local # 本地脚手架信息存储路径 ~/.m2/repository/archetype-catalog.xml archetypeCatalog=local # 以下参数以pamirs-demo为例 # 新项目的groupId groupId=pro.shushi.pamirs.demo # 新项目的artifactId artifactId=pamirs-demo # 新项目的version version=1.0.0-SNAPSHOT # Java包名前缀 packagePrefix=pro.shushi # Java包名后缀 packageSuffix=pamirs.demo # 新项目的pamirs platform version pamirsVersion=6.2.8 # Java类名称前缀 javaClassNamePrefix=Demo # 项目名称 module.displayName projectName=OinoneDemo # 模块 MODULE_MODULE 常量 moduleModule=demo_core # 模块 MODULE_NAME 常量 moduleName=DemoCore # spring.application.name applicationName=pamirs-demo # tomcat server address serverAddress=0.0.0.0 # tomcat server port serverPort=8090 # redis host redisHost=127.0.0.1 # redis port redisPort=6379 # 数据库名 db=demo # zookeeper connect string zkConnectString=127.0.0.1:2181 # zookeeper rootPath zkRootPath=/demo mvn archetype:generate \ -DinteractiveMode=false \ -DarchetypeCatalog=${archetypeCatalog} \ -DarchetypeGroupId=pro.shushi.pamirs.archetype \ -DarchetypeArtifactId=pamirs-project-archetype \ -DarchetypeVersion=6.2.8 \ -DgroupId=${groupId} \ -DartifactId=${artifactId} \ -Dversion=${version} \ -DpamirsVersion=${pamirsVersion} \ -Dpackage=${packagePrefix}.${packageSuffix} \ -DpackagePrefix=${packagePrefix} \ -DpackageSuffix=${packageSuffix} \ -DjavaClassNamePrefix=${javaClassNamePrefix} \ -DprojectName="${projectName}" \ -DmoduleModule=${moduleModule} \ -DmoduleName=${moduleName} \ -DapplicationName=${applicationName} \ -DserverAddress=${serverAddress} \ -DserverPort=${serverPort} \ -DredisHost=${redisHost} \ -DredisPort=${redisPort} \ -Ddb=${db} \ -DzkConnectString=${zkConnectString} \ -DzkRootPath=${zkRootPath} archetype-project-generate.bat @echo off :: 项目生成脚手架 set archetypeCatalog=local set groupId=pro.shushi.pamirs.demo set artifactId=pamirs-demo set version=1.0.0-SNAPSHOT set packagePrefix=pro.shushi set packageSuffix=pamirs.demo set pamirsVersion=6.2.8 set javaClassNamePrefix=Demo set projectName=OinoneDemo set moduleModule=demo_core set moduleName=DemoCore set applicationName=pamirs-demo set serverAddress=0.0.0.0 set serverPort=8090 set redisHost=127.0.0.1 set redisPort=6379 set…

    2025年8月22日
    37900
  • IP黑白名单实现拦截三方用户

    已知厂商IP为10.139.0.1,经系统检测122.233.24.28、138.122.12.9为风险IP,需要禁止访问。 白名单配置:10.139.0.1 黑名单配置:122.233.24.28、138.122.12.9 厂商请求到Oinone开放平台请求头需携带X-Forwarded-For和X-Real-IP,例如: X-Forwarded-For 122.233.24.28 X-Real-IP 122.233.24.28 经Nginx代理后,oinone获取的请求头内容: X-Forwarded-For 122.233.24.28, 10.139.0.1 # 代理追加厂商IP到末尾 X-Real-IP 122.233.24.28 # 保持客户端原始值,Nginx不处理 效果:厂商10.139.0.1发送的请求且用户X-Real-IP不在黑名单内才放行。 注意事项 Nginx如果配置X-Real-IP需关闭,否则拿到的永远是厂商IP。 proxy_set_header X-Real-IP $remote_addr; 相关文章 开放应用中的ip黑白名单

    2025年5月15日
    24500
  • 前端学习路径

    准备工作 环境准备-1h安装基础环境,需要Node和PNPM如果已经安装检查对应版本,体验阶段建议版本保持一致 克隆一个空工程-0.5h全新工程 注意事项-0.5h静态资源解压,如果还没有对应的后端服务。可以使用:https://demo.oinone.top(Oinone演示环境),账号密码:admin/admin 前端基础 1.1.1了解组件-3h– 组件如何开发– 组件如何复用– 组件如何嵌套 1.1.2 更近一步-5h– 构建更复杂的工作台– 如何发起后端请求– 构建一个通用的图表组件 1.1.3 深入了解概念-5h– 通用概念、名词解释– 页面渲染原理– 组件执行原理 1.1.4业务实战-实现通用的甘特图组件-8h– 怎么与第三方结合– 如何在开源组件上接入Oinone, 并复用 1.1.5 业务实战-实现通用的画廊组件-6h–如何更近一步复用–基础学习结束 前端进阶 2.1.1代码和无代码如何结合-4h– 了解无代码如何使用和基础概念 2.1.2使用无代码搭建增删改查-8h– 了解无代码如何使用和基础概念 最后一步 当您实现玩基础和进阶的所有的效果,Oinone的整体使用您已经大致掌握了,接下来您可以找一个当前业务的场景来实现它把!

    2025年9月1日
    62400
  • 前端自定义组件之锚点分组

    本文将讲解如何通过自定义,实现锚点组件。这个锚点组件会根据界面设计器拖入的分组,动态解析出锚点。 实现路径 整体的实现思路是界面设计器拖个容器类的组件(这里以选项卡为例),自定义这个选项卡,往选项卡里拖拽的每个分组,每个锚点的名称是分组的标题。 1. 界面设计器拖出页面 我们界面设计器拖个选项卡组件,然后在选项页里拖拽任意多个分组。完成后点击右上角九宫格,选中选项卡,填入组件 api 名称,作用是把选项卡切换成我们自定义的锚点分组组件,这里的 api 名称和自定义组件的 widget 对应。最后发布页面,并绑定菜单。 2. 组件实现 widget 组件重写了选项卡,核心函数 renderGroups,通过 DslRender.render 方法渲染界面设计器拖拽的分组。 import { BasePackWidget, DslDefinition, DslRender, SPI, Widget } from '@oinone/kunlun-dependencies'; import TabsParseGroup from './TabsParseGroup.vue'; function fetchGroupChildren(widgets?: DslDefinition[], level = 1): DslDefinition[] { if (!widgets) { return []; } const children: DslDefinition[] = []; for (const widget of widgets) { if (widget.widget === 'group') { children.push(widget); } else if (level >= 1) { fetchGroupChildren(widget.widgets, level – 1).forEach((child) => children.push(child)); } } return children; } @SPI.ClassFactory( BasePackWidget.Token({ widget: 'TabsParseGroup' }) ) export class TabsParseGroupWidget extends BasePackWidget { public initialize(props) { super.initialize(props); this.setComponent(TabsParseGroup); return this; } // 获取分组的子元素 public get groupChildren(): DslDefinition[] { return fetchGroupChildren(this.template?.widgets); } @Widget.Reactive() public get groupTitles() { return this.groupChildren.map((group) => group.title); } // 根据容器子元素渲染左侧 @Widget.Method() public renderGroups() { if (this.groupChildren && this.groupChildren.length) { return this.groupChildren.map((group) => DslRender.render(group)); } } } vue组件核心内容是用component :is属性,渲染出配置的分组组件 <template> <div class="TabsParseGroup"> <a-anchor :affix="false"> <a-anchor-link v-for="(item, index) in groupTitles" :href="`#default-group-${index}`" :title="item" /> </a-anchor> <div v-for="(item, index) in groupComponents" :id="`default-group-${index}`"> <component :is="item" /> </div> </div> </template> <script lang="ts"> import { computed, defineComponent, PropType } from 'vue'; export default…

    2025年7月8日
    18600

Leave a Reply

登录后才能评论