3.5.6.4 动作的配置

在3.5.3【Action的类型】一文中,我们介绍Action的几种类型,以及组合动作。

通用配置

配置项 可选值 默认值 作用
name 动作名称
label 显示名称
icon 图标
type primary defaultlink primary 按钮类型样式,支持主要样式、次要样式以及链接样式。
bizStyle defaultsuccesswarningdangerinfo default 按钮业务样式,支持成功(green)、警告(yellow)、危险(red)、信息(grey)四种样式。
invisible truefalse condition false 展示规则,有简单的true/false显隐,也支持复杂的表达式
disabled truefalse condition 根据动作上下文类型进行自动推断 是否禁用自动推断规则:当上下文类型为【单行】时,相当于使用表达式LIST_COUNT(context.activeRecords) != 1当上下文类型为【多行】时,相当于使用表达式LIST_COUNT(context.activeRecords) <= 1当上下文类型为【单行或多行】时,相当于使用表达式LIST_COUNT(context.activeRecords) == 0
disabledTitle string 根据动作上下文类型进行自动推断 禁用悬浮提示

表3-5-6-12 动作通用配置

二次确认配置

二次确认框默认支持两种模式,对话框和气泡框;

对话框

image.png

图3-5-6-51 对话框提示

气泡框

image.png

图3-5-6-52 气泡框警告

配置项

配置项 可选值 默认值 作用 备注
confirm string 二次确认提示文字 配置后开启二次确认
confirmType POPPER(气泡提示框) MODAL(对话框) POPPER 确认框类型
confirmPosition TM(按钮上方) BM(按钮下方) LM(按钮左侧) RM(按钮右侧) BM 确认框位置 气泡框该配置生效
enterText 确定 确定按钮文字
cancelText 取消 取消按钮文字

表3-5-6-13 配置项

弹出层动作配置(窗口动作ViewAction)

目前平台对于弹出层支持了两种展示形式。弹窗(modal/dialog)和抽屉(drawer)

支持两种配置方式【内嵌视图配置】和【引用已有页面】,内嵌视图配置优先于引用已有页面。

内嵌视图配置

该配置对于弹窗和抽屉均适用。

<action name="窗口动作名称" label="创建">
    <view model="模型编码" type="form">
        <template slot="form" widget="form">
            <field data="id" invisible="true" />
            <field data="code" label="编码" widget="Input" />
            <field data="name" label="名称" widget="Input" />
        </template>
        <template slot="footer">
            <action name="$$internal_DialogCancel" label="关闭" type="default" />
            <action name="create" label="确定" />
        </template>
    </view>
</action>

图3-5-6-53 内嵌视图配置

引用已有页面配置

该配置对于弹窗和抽屉均适用。

<view model="模型编码" type="form">
    <template slot="form" widget="form">
        <field data="id" invisible="true" />
        <field data="code" label="编码" widget="Input" />
        <field data="name" label="名称" widget="Input" />
    </template>
    <template slot="footer">
        <action name="$$internal_DialogCancel" label="关闭" type="default" />
        <action name="create" label="确定" />
    </template>
</view>

图3-5-6-54 引用已有页面示例

<action name="窗口动作名称" label="创建" resViewName="$viewName$" />

图3-5-6-55 引用已有页面

弹窗

当窗口动作的路由方式(target)为dialog时,内嵌视图/引用页面将以弹窗形式展示在页面上。

配置项

配置项 可选值 默认值 作用
title string 动作名称 标题名称
width string/number/enumsmall(560px)medium(890px)large(1200px) medium 宽度

表3-5-6-14 弹窗配置项

示例:配置标题名称为【自定义创建弹窗】,宽度为70%的弹窗

<!-- 内嵌视图配置 -->
<action name="窗口动作名称" label="创建">
    <template slot="default" title="自定义创建弹窗" width="70%">
        <view model="模型编码" type="form">
            <template slot="form" widget="form">
                <field data="id" invisible="true" />
                <field data="code" label="编码" widget="Input" />
                <field data="name" label="名称" widget="Input" />
            </template>
            <template slot="footer">
                <action actionType="client" name="$$internal_DialogCancel" label="关闭" type="default" />
                <action name="create" label="确定" />
            </template>
        </view>
    </template>
</action>

<!-- 引用已有页面配置 -->
<action name="窗口动作名称" label="创建" resViewName="引用页面名称">
    <template slot="default" title="自定义创建弹窗" width="70%" />
</action>

图3-5-6-56 内嵌视图配置

抽屉

当窗口动作的路由方式(target)为drawer时,内嵌视图/引用页面将以弹窗形式展示在页面上。

配置项

配置项 可选值 默认值 作用 备注
title string 动作名称 标题名称
placement top(上)right(右)bottom(下)left(左) right 抽屉打开位置
width string/number/enumsmall(20%)medium(40%)large(80%) small 宽度 打开位置为left和right时生效
height string/number/enumsmall(20%)medium(40%)large(80%) small 宽度 打开位置为top和bottom时生效

表3-5-6-15 抽屉配置项

示例:配置从下方打开,高度为large的抽屉

<!-- 内嵌视图配置 -->
<action name="窗口动作名称" label="创建">
    <template slot="default" placement="bottom" height="large">
        <view model="模型编码" type="form">
            <template slot="form" widget="form">
                <field data="id" invisible="true" />
                <field data="code" label="编码" widget="Input" />
                <field data="name" label="名称" widget="Input" />
            </template>
            <template slot="footer">
                <action actionType="client" name="$$internal_DialogCancel" label="关闭" type="default" />
                <action name="create" label="确定" />
            </template>
        </view>
    </template>
</action>

<!-- 引用已有页面配置 -->
<action name="窗口动作名称" label="创建" resViewName="引用页面名称">
    <template slot="default" placement="bottom" height="large" />
</action>

图3-5-6-57 配置从下方打开,高度为large的抽屉

组合动作配置

具体例子详见3.5.3【Aciton的类型】一文中介绍的“前端动作之组合动作”部分。

服务器动作串行

<action actionType="composition" label="组合动作">
    <action name="服务器动作1" />
    <action name="服务器动作2" />
</action>

图3-5-6-58 服务器动作串行

服务器动作与跳转动作组合执行

<action actionType="composition" label="组合动作">
    <action name="服务器动作1" />
    <action name="跳转动作1" />
</action>

图3-5-6-59 服务器动作与跳转动作组合执行

后端动作与前端动作组合

<action actionType="composition" label="组合动作">
    // 校验表单
    <action actionType="client" name="$$internal_ValidateForm" />
    <action name="服务器动作" />
    // 返回上一级页面
    <action actionType="client" name="$$internal_GotoListTableRouter" />
</action>

图3-5-6-60 后端动作与前端动作组合

展示规则

在介绍3.5.3【Action的类型】一文中的“ServerAction之前端展示规则(举例)”部分,用到invisible这个属性定义。这个在xml中也可以配置,而且前端的优先级高于后端

可以通过 invisible 属性配置一个表达式来使动作根据数据记录条件显示、隐藏。

如果 invisible 所引用的动作的 bindingType 是个列表型视图,则要用 context.activeRecords 获取当前选中记录,如果是个对象型视图或列表型视图的行内显示则需用 context.activeRecord:

<!-- 列表型视图 -->
<action name="a" invisible="context.activeRecords && context.activeRecords[0].a === true" />
<!-- 对象型视图或列表型视图的行内显示 -->
<action name="b" invisible="context.activeRecord && context.activeRecord.b === true" />

图3-5-6-61 列表型视图

举例

Table视图动作配置

示例1:不允许删除编码为“5”的数据

PS:当配置disabled时,自动推断规则将会失效,需要按需配置。下方的配置保留了【单行或多行】的自动推断规则。

<view model="模型编码" type="table">
    <template slot="actionBar" widget="actionBar">
        <action name="delete" label="删除" disabled="LIST_COUNT(context.activeRecords) == 0 || LIST_CONTAINS(LIST_FIELD_VALUES(context.activeRecords, '', 'code'), '5')" refreshData="true" />
    </template>
    <template slot="fields">
        <field data="id" invisible="true" />
        <field data="code" label="编码" widget="Input" />
        <field data="name" label="名称" widget="Input" />
    </template>
</view>

图3-5-6-62 Table视图动作配置

结果展示

未选中时

image.png

图3-5-6-63 未选中时

选中编码不是“5”的数据

image.png

图3-5-6-64 选中编码不是“5”的数据

选中编码包含“5”的数据

image.png

图3-5-6-65 选中编码包含“5”的数据

Form视图动作配置

示例:创建和编辑使用同一个视图配置

<view model="模型编码" type="form">
    <template slot="actionBar" widget="actionBar">
        <action actionType="client" name="$$internal_GotoListTableRouter" label="返回" type="default" />
        <action name="create" label="创建" invisible="!IS_NULL(activeRecord.id)" validateForm="true" goBack="true" />
        <action name="update" label="更新" invisible="IS_NULL(activeRecord.id)" validateForm="true" goBack="true" />
    </template>
    <template slot="fields">
        <pack widget="fieldset" title="基础信息">
            <field data="id" invisible="true" />
            <field data="code" label="编码" widget="Input" />
            <field data="name" label="名称" widget="Input" />
        </pack>
    </template>
</view>

<!-- 使用组合动作实现validateForm和goBack属性 -->
<view model="模型编码" type="form">
    <template slot="actionBar" widget="actionBar">
        <action actionType="client" name="$$internal_GotoListTableRouter" label="返回" type="default" />
        <action actionType="composition" label="创建" invisible="!IS_NULL(activeRecord.id)">
            <action actionType="client" name="$$internal_ValidateForm" />
            <action name="create" />
            <action actionType="client" name="$$internal_GotoListTableRouter" />
        </action>
        <action actionType="composition" label="更新" invisible="IS_NULL(activeRecord.id)">
            <action actionType="client" name="$$internal_ValidateForm" />
            <action name="update" />
            <action actionType="client" name="$$internal_GotoListTableRouter" />
        </action>
    </template>
    <template slot="fields">
        <pack widget="fieldset" title="基础信息">
            <field data="id" invisible="true" />
            <field data="code" label="编码" widget="Input" />
            <field data="name" label="名称" widget="Input" />
        </pack>
    </template>
</view>

图3-5-6-66 创建和编辑使用同一个视图配置

结果展示

使用【上下文无关】的跳转动作进入该视图时

image.png

图3-5-6-67 使用上下文无关的跳转动作进入该视图时

使用【单行】的跳转动作进入该视图时

image.png

图3-5-6-68 使用单行的跳转动作进入该视图时

实战

Step1 修改宠物商品代理表格视图的Template

启用和禁用服务器动作根据状态分别显示其中一个

<view name="tableView1" type="TABLE" cols="2" enableSequence="false" model ='demo.PetShopProxy' priority="1" >
    <template slot="actions" autoFill="true"/>
    <template slot="rowActions">
        <action name="dataStatusEnable" label="启用" invisible="activeRecord.dataStatus == 'ENABLED'" />
        <action name="dataStatusDisable" label="禁用" invisible="activeRecord.dataStatus == 'DISABLED'" />
    </template>
    <template slot="fields">
        <field priority="1" data="income" label="收入"/>
        <field priority="101" data="code" label="店铺编码"/>
        <field priority="102" data="relatedShopName" label="引用字段shopName"/>
        <field priority="102" data="codeTwo" label="店铺编码2"/>
        <field priority="103" data="createrId" label="引用创建者Id"/>
        <field priority="110" data="description" label="描述"/>
        <field priority="111" data="description1" label="描述"/>
        <field priority="112" data="descHtml" label="html描述"/>
        <field priority="113" data="anniversary" label="店庆"/>
        <field priority="114" data="publishYear" label="开店年份"/>
        <!-- 表格其他字段-->
    </template>
</view>

图3-5-6-69 修改宠物商品代理表格视图的Template

Step2 重启看效果

【已启用】状态时只显示【禁用】按钮

image.png

图3-5-6-70 已启用状态时只显示禁用按钮

【已禁用】状态时只显示【启用】按钮

image.png

图3-5-6-71 已禁用状态时只显示启用按钮

Oinone社区 作者:史, 昂原创文章,如若转载,请注明出处:https://doc.oinone.top/oio4/9263.html

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

(0)
史, 昂的头像史, 昂数式管理员
上一篇 2024年5月23日 am9:15
下一篇 2024年5月23日 am9:17

相关推荐

  • 5.1 CDM的背景介绍

    如果说低代码开发框架输出技术标准,CDM则是结合oinone技术特性和软件工程设计,让输出数据标准变成可能。 一、背景介绍 无法照搬的最佳实践 要了解引入CDM的初衷,得从互联网架构的演进开始,了解其过程,就知道为什么说Oinone的CDM是中台架构的最佳技术实践的核心!我们在2.2【互联架构做为最佳实践为何失效】一文中介绍过互联网技术发展的四个阶段,特别平台化到中台化的阶段,目的是在一套规范下让听的见炮火声音的团队自行决定业务系统发展,适用多业务线(或多场景应用)独立发展。 互联网架构在演进过程中碰到的问题跟企业数字化转型过程中碰到的问题是非常类似: 随着企业业务在线化后对系统性能、稳定都提出了更高的要求,而且大部分企业的内部很多系统相互割裂导致,导致很多重复建设,所以我们需要服务化、平台化。 同时没有一个供应商能解决企业所有商业场景问题,又需要多个供应商共同参与,所以把供应商类类比成各个业务线,在一套规范下让供应商自行决定业务系统发展 既然跟阿里当初在架构演进过程中碰到的问题非常类似,那么是不是照搬阿里中台架构方案到企业就好了?当然不是,因为历史原因阿里的中台架构是采用的平台共建模式:“让业务线研发以平台设计好的规范进来共同开发”,其本质还是平台主导模式,它是有非常大的历史包袱。我们想象各个供应商的共建一个交易平台或商品平台,那是多么荒唐的事情,平台化已经足够的复杂了,还让不同背景、不同企业的研发一起共建,最后往往导致企业架构负载过重,这时对企业来说便不再是赋能而是“内耗”。 那么如果没有历史包袱,我们重新设计,站在上帝视角去看有没有更好的方式呢?当然有 借鉴微软的CDM 这里我们借鉴微软的CDM理念,CDM这个概念最早是2016年微软宣布“以Dynamics 365的形式改造其CRM和ERP”战略时提出的。微软给它的定义是“用于存储和管理业务实体的业务数据库,而且是开箱即用的”。CDM不仅仅提供标准实体,它还允许用户建立个性化的实体,用户可以扩展标准实体也可以增加和标准实体相关的新实体。 CDM可能并不性感,但绝对是非常必要的。它成为了微软的很多产品的基础,是构建了无数业务领域的原型。同时微软也期望它能成为快速实现数据交换和迁移的标准,这个有点像菜鸟网络推出的奇门,让所有TMS、OMS、WMS都基于一套数据接口API进行互通,一套标准是为了解决一个行业问题,而不是具体某一个企业一个集团的问题。 我们发现CDM的理念跟我们想要的“企业级的数据标准”是非常吻合的。但是我们也不能照搬照抄,虽然微软的CDM很好的解决了数据割裂问题,但就模型来说就够大家喝一壶了,模型库非常庞大而且复杂,学习成本巨高。 数字化时代软件会产生新的技术流派 我们知道传统软件的设计理念:侧重在模型对业务支撑全面性上。优点体现为配置丰富,缺点模型设计过于复杂,刚开始有前瞻性,但在理解、维护都非常困难,随着业务发展系统原先的设计逐渐腐化,异常笨重。 而Oinone的CDM设计理念:侧重在简单、灵活、统一上,体现为在上层应用开发时,每一业务领域保持独立,模型简单易懂,并结合Oinone的低代码开发机制进行快速开发,灵活应对业务变化。 所以我更想说Oinone的CDM是微软CDM的在原有基础上,与互联网架构结合,利用Oinone低代码开发平台特性形成新的工程化建议。Oinone-CDM不以把模型抽象到极致,支撑“所有业务可能性”为目标,而是抽象80%通用的设计,保持模型简单可复用,来解决数据割裂问题,并保持业务线独立自主性,快速创新的能力。 图5-1-1 Oinone-CDM要解决的问题 二、Oinone的CDM本质是创新的工程化建议 引入CDM以后系统工程结构会有什么变化,跟大家认知的互联网架构有什么区别。 原本上层的业务线系统,需要调用各个业务平台提供的功能,增加CDM以后也就是我们右的图,每个业务线就像一个独立右边。看上去复杂了,其实对业务线来说更加简单了。 互联网整体平台化带来的问题: 业务线每次业务调整都需要给各个平台提需求 业务平台研发需要了解所有业务线的知识再做设计,对研发要求非常高 各个业务域的不同需求相互影响包括系统稳定性、研发对需求响应的及时性 结合oinone特性提出的新工程建议: 一些通用性模块继续以平台化的方式存在,能力完全复用。 业务线自建业务平台,保持业务线的独立性和敏捷性 业务线以CDM为原型,保证核心数据不割裂,形成一致的数据规范 图5-1-2 引入CDM概念后的工程结构对比 三、CDM思路示意图 该示例中OinoneCDM的商品域不仅仅提供标准实体,保证各个业务系统的对商品的通用需求、简单易懂,在我们星空系列业务产品中如全渠道运营、B2B交易等系统以此为基础建立属于自身个性化的实体,可以扩展标准实体也可以增加和标准实体相关的新实体。 带来的好处: 通过多种继承方式,继承后的模型可扩展模型本身、模型行为等,从而解决业务独立性问题。 通过CDM层统一数据模型,从而解决多应用数据割裂问题 图5-1-3 Oinone-CDM思路示意图

    2024年5月23日
    94900
  • 资源

    翻译应用是管理翻译规则的应用,以模型为基础、维护字段的翻译值,支持导入、导出 1. 操作步骤 Step1:导出所有翻译项; Step2:线下翻译; Step3:导入翻译项; Step4:刷新远程资源; Step5:页面右上角可切换语言,查看翻译效果。 2. 新增翻译 翻译是具体到模型字段,其中需要区分出是否字典; 源语言、目标语言,是在资源中维护的语言,可在资源中维护需要翻译的语言; 翻译项则是模型字段,默认翻译项为激活状态,关闭后维护的翻译项无效。 3. 导出、导入 不勾选导出:导出所有需要翻译的翻译项,包括模块、字段,源术语、翻译值等,其中如果已经翻译过的内容,会体现在翻译值中; 勾选导出:导出勾选模型的翻译项。 导入:导入翻译项,平台会根据模型拆分为多条数据。 4. 刷新远程资源 导入翻译项后,点击“刷新远程资源”按钮。 5. 查看翻译内容 页面右上角切换语言,查看翻译效果。

    2024年6月20日
    1.1K00
  • 4.1.7 函数之元数据详解

    介绍Function相关元数据,以及对应代码注解方式。大家还是可以通读下,以备不时之需 如您还不了解Function的定义,可以先看下2.3【oinone独特之源,元数据与设计原则】对Function的描述,本节主要带大家了解Function元数据构成,能让小伙伴非常清楚oinone从哪些维度来描述Function, 一、元数据说明 FunctionDefinition 元素数据构成 含义 对应注解 备注 namespace 函数命名空间 @Fun("") @Model.model("") @Fun或@Model.model name 技术名称 @Function( name=””, scene={}, summary=””, openLevel=FunctionOpenEnum.REMOTE ) scene 可用场景 见:FunctionSceneEnum description 描述 openLevel 开放级别 见:FunctionOpenEnum fun 编码 @Function.fun("") displayName 显示名称 @Function.Advanced( displayName=””, type=FunctionTypeEnum.UPDATE, dataManager=false, language=FunctionLanguageEnum.JAVA, isBuiltin=false, category=FunctionCategoryEnum.OTHER, group=”pamirs”, version=”1.0.0″, timeout=5000, retries=0, isLongPolling=false, longPollingKey=”userId” longPollingTimeout=1 ) type 函数类型默认:4(改) 见 FunctionTypeEnum dataManager 数据管理器函数默认:false language 函数语言默认:DSL 见FunctionLanguageEnum isBuiltin 是否内置函数 默认:false category 分类 默认:OTHER 见:FunctionCategoryEnum group 系统分组 默认:pamirs version 系统版本 默认:1.0.0 timeout 超时时间 默认:5000 retries 重试次数 默认:0 isLongPolling 是否支持long polling,默认false longPollingKey 支持从上下文中获取字段作为key longPollingTimeout long polling超时时间 默认值为1 transactionConfig 事务配置 JSON存储 见TransactionConfig 配置@PamirsTransactional source 来源 系统推断值,见:FunctionSourceEnum extPointList 函数包含扩展点 系统推断值 module 所属模块 系统推断值 bitOptions 位 系统推断值 attributes 属性 系统推断值 imports 上下文引用 系统推断值 context 上下文变量 系统推断值 codes 函数内容 系统推断值 beanName bean名称 系统推断值 rule 前端规则 系统推断值,一般Action.rule传递下来的 clazz 函数位置 系统推断值 method 函数方法 系统推断值 argumentList 函数参数 系统推断值,List<Argument> returnType 返回值类型 系统推断值 表4-1-7-1 FunctionDefinition TransactionConfig 函数事务管理之配置项事务,具体事务使用详见4.1.8【函数之事务管理】一文。 元素数据构成 含义 对应注解 备注 transactionManager 事务管理器 @PamirsTransactional( transactionManager=””, enableXa=false, isolation=Isolation.DEFAULT, propagation=Propagation.REQUIRED, timeout=-1, readOnly=false, rollbackFor={}, rollbackForClassName={}, noRollbackFor={}, noRollbackForClassName={}, rollbackForExpCode={}, noRollbackForExpCode={} ) enableXa 分布式事务默认为false isolation 事务隔离级别 propagation 事务传递类型 timeout 过期时间 默认:-1 readOnly 只读 默认:false rollbackForExpCode 回滚异常编码 rollbackForExpCode 忽略异常编码 namespace 函数命名空间 系统推断值 fun 函数编码 系统推断值 active…

    Oinone 7天入门到精通 2024年5月23日
    1.2K00

Leave a Reply

登录后才能评论