3.5.1 构建第一个Menu

相关推荐

• Oinone 7天入门到精通

  4.1.18 框架之网关协议-Variables变量

  我们在应用开发过程有一种特殊情况在后端逻辑编写的时候需要知道请求的发起入口，平台利用GQL协议中的Variables属性来传递信息，本文就介绍如何获取。 一、前端附带额外变量 属性名 类型 说明 scene String 菜单入口 表4-1-18-1 前端附带额外变量 图4-1-18-1 variables信息中的scene 二、后端如何接收variables信息 通过PamirsSession.getRequestVariables()可以得到PamirsRequestVariables对象。 三、第一个variable（举例） Step1 修改PetTalentAction，获取得到前端传递的Variables package pro.shushi.pamirs.demo.core.action; ……类引用 @Model.model(PetTalent.MODEL_MODEL) @Component public class PetTalentAction { ……其他代码 @Function.Advanced(type= FunctionTypeEnum.QUERY) @Function.fun(FunctionConstants.queryPage) @Function(openLevel = {FunctionOpenEnum.API}) public Pagination<PetTalent> queryPage(Pagination<PetTalent> page, IWrapper<PetTalent> queryWrapper){ String scene = (String)PamirsSession.getRequestVariables().getVariables().get("scene"); System.out.println("scene: "+ scene); ……其他代码 } ……其他代码 } 图4-1-18-2 修改PetTalentAction Step2 重启验证 点击宠物达人不同菜单入口，查看效果 图4-1-18-3 示例效果（一） 图4-1-18-4 示例效果（二）

  史, 昂

  2024年5月23日

  1.7K000
• Oinone 7天入门到精通

  翻译

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

  史, 昂

  2024年6月20日

  1.3K000
• Oinone 7天入门到精通

  组件属性

  1. 通用属性 介绍组件和其属性之前，先介绍一些大部分组件通用支持的一些基础属性。 1.2 标题 标题是字段在当前页面的展示名称，标题默认为字段名称，可以修改。 1.2 占位提示 在未填写内容时，输入框或选择框内的浅色提示文字，仅用于提示，不会影响字段的值。 1.3 描述说明 一个字段的描述信息，通常用于说明当前字段的范围、注意事项等。描述说明大部分在组件的下方显示，特殊的是，分组的描述说明在标题的左侧。 1.4 默认值 创建数据时，有些字段大概率都是相同值，可设置默认值，减少添加人员的操作步骤，提高录入数据效率。 1.5 只读 设为只读时，字段可见，但不可编辑。 除了只读和非只读的对立选项，也可以设置条件只读，在设置的条件下才只读，条件不符合则非只读。 1.6 禁用 设为禁用时，字段可见，但不可编辑。 除了禁用和非禁用的对立选项，也可以设置条件禁用，在设置的条件下才禁用，条件不符合则非禁用。 1.7 隐藏 设为隐藏时，字段不可见，也不可编辑。但是在页面设计时，隐藏的组件也会展示，效果如下图。 除了隐藏和非隐藏的对立选项，也可以设置条件隐藏，在设置的条件下才隐藏，条件不符合则非隐藏。 1.8 必填 控制字段在当前页面是否必填，若设置为必填则在标题前会有红色的*作为标识。除了必填和非必填的对立选项，也可以设置条件必填，在设置的条件下才必填，条件不符合则非必填。 1.9 标题排列方式 字段的标题可以自定义横向排列还是纵向排列。每个字段组件都支持设置，设置后之间互不影响。除了组件支持自定义，表单、分组、选项卡也可以设置排列方式，对于这种布局容器类组件，设置后会将其容器内的所有组件的标题排列方式都改为所设置的值。 1.10 宽度 定义在页面中的宽度：占整行的比例，一般可选项有1/4、1/3、1/2、2/3、3/4、1。 其中1/2表示占当前行的一半；1表示占当前行一整行；以此类推。部分组件特殊，如富文本仅支持宽度为1，即占一整行。 2. 分组 分组是一个布局类组件，类似一个容器，可以把业务含义相近的内容放在这个分组容器内。 2.1 属性 2.1.1 标题 分组可以定义一个标题名称，标题显示在分组左上角，可以不设置标题。 2.1.2 描述说明 分组的描述说明显示在分组标题右侧。 2.1.3 标题排列方式 分组中的标题排列方式属性并不是控制分组的标题，而是控制分组内组件的标题。设置后对分组内的所有组件生效。 3. 选项卡 选项卡是一个布局类组件，类似一个容器，每个选项卡可以添加多个选项页，可以把业务含义相近的内容放在选项卡的选项页容器内。 3.1 选项卡属性 3.1.1 选项页排列方式 选中选项卡，可选择选项卡中的选项页排列方式：水平排列、竖直排列。默认是水平排列，效果如下图。 3.1.2 标题排列方式 选项卡中的标题排列方式控制选项卡内组件的标题。设置后对选项卡内的所有组件生效。 3.2 选项页属性 3.2.1 标题 选中选项页，显示选项页的属性设置，选项卡中的每个选项页支持设置标题。 3.2.2 标题排列方式 选项页中的标题排列方式控制选项页内组件的标题。设置后对选项页内的所有组件生效。同一个选项卡，不同选项页之间的标题排列方式可以不同。 4. 单行文本 单行文本输入框，常用于记录名称、身份证号或其他普通的文字内容。 4.1 创建字段 单行文本仅支持创建「文本」业务类型的字段，填写规则、内容和模型设计器端创建字段一致。 4.2 表单属性 4.2.1 通用属性 在表单中，单行文本可以设置一些通用的属性：标题、占位提示、描述说明、默认值、只读、隐藏、禁用、必填、标题排列方式、宽度。 4.2.2 文本类型 文本类型选项为文本或密码。若设置为文本，输入时内容是可见的；若设置为密码，输入时是不可见的密码形态，如下图： 4.2.3 最小/大长度 设置输入框输入内容的长度，输入框会根据设置的值进行校验。 最大长度默认为创建字段时填写的长度，且设置的最大长度不可以大于字段的长度 最小长度默认为空，为空则为不限制最小长度 4.2.4 输入格式 设置输入格式为网址或者身份证时，会进行格式的校验 无：默认为无，不会校验内容 网址：进行网址校验 身份证：进行身份证号校验，设置后，需要输入正确的身份证号 4.2.5 显示计数器 当需要用户关注输入内容长度时，可以开启显示计数器，在输入时会实时显示当前内容的长度。 4.2.6 显示清除按钮 若开启了清除按钮，则在输入框有内容时，点击清除按钮一键清除已有内容 5. 多行文本 多行文本输入框，常用于记录字数较多的文字，如意见、复杂备注等。 5.1 创建字段 多行文本仅支持创建「多行文本」业务类型的字段，填写规则、内容和模型设计器端创建字段一致。 5.2 表单属性 5.2.1 通用属性 在表单中，单行文本可以设置一些通用的属性：标题、占位提示、描述说明、默认值、只读、隐藏、禁用、必填、标题排列方式、宽度。 5.2.2 最小/大长度 设置输入框输入内容的长度，输入框会根据设置的值进行校验。 -最大长度默认为创建字段时填写的长度，且设置的最大长度不可以大于字段的长度 -最小长度默认为空，为空则为不限制最小长度 5.2.3 显示计数器 当需要用户关注输入内容长度时，可以开启显示计数器，在输入时会实时显示当前内容的长度。 5.2.5 显示清除按钮 若开启了清除按钮，则在输入框有内容时，点击清除按钮一键清除已有内容 6. 整数 整数输入框，常用于输入整数的天数、数量等，如果会出现小数，请使用小数组件。 6.1 创建字段 整数仅支持创建「整数」业务类型的字段，填写规则、内容和模型设计器端创建字段一致。 6.2 表单属性 6.2.1 通用属性 在表单中，整数可以设置一些通用的属性：标题、占位提示、描述说明、默认值、只读、隐藏、禁用、必填、标题排列方式、宽度。 6.2.2 最小/大值 设置整数输入框输入内容的最值，输入框会根据设置的最值进行校验。 最大值可设置的范围根据字段填写的长度转换，如设置长度为3，则最大值最大不可以超过999 截图 6.2.3 显示千分位 数字过长时，不便于查看，可开启显示千分位。 7. 小数 小数输入框，常用于输入金额、单价等，会出现小数的数值。 7.1 创建字段 小数仅支持创建「浮点型」业务类型的字段，填写规则、内容和模型设计器端创建字段一致。 7.2 表单属性 7.2.1 通用属性 在表单中，小数可以设置一些通用的属性：标题、占位提示、描述说明、默认值、只读、隐藏、禁用、必填、标题排列方式、宽度。 7.2.2 最小/大值 设置小数输入框输入内容的最值，输入框会根据设置的最值进行校验。 最大值可设置的范围根据字段填写的长度转换，如设置长度为3，则最大值最大不可以超过999 7.2.3 保留小数位数 支持设置小数的保留位数，设置后在页面中输入内容时，将进行校验 可设置的保留小数位数不可大于该字段的精度，如字段精度为2，则组件属性中的小数位数最大只能为2； 7.2.4 显示千分位 数字过长时，不便于查看，可开启显示千分位。 8. 下拉单选 从多个选项中下拉选择一个数据，作为数据值。选项可以是关联模型的数据，也可以是数据字典或布尔型开关。 8.1 创建字段 下拉单选支持创建三种业务类型的字段，分别是：多对一、布尔型、数据字典。 多对一：创建字段时需要选择关联的模型，关联模型的数据将作为下拉选项； 布尔型：下拉选项默认只有是、否； 数据字典：创建字段时需要选择数据字典，其数据字典项将作为下拉选项 8.2 表单属性 8.2.1 通用属性 在表单中，下拉单选可以设置一些通用的属性：标题、占位提示、描述说明、只读、隐藏、禁用、必填、标题排列方式、宽度。 8.2.2 选项类型…

  史, 昂

  2024年6月20日

  1.6K000
• Oinone 7天入门到精通

  工作台

  有工作台权限的用户，默认登录页为工作台，也可以通过APP Finder进入工作台。 1. 快捷处理 右上角消息中会气泡展示未处理或未读的操作，点击展开后可以点过去进行快捷处理。 2. 查看、处理流程 2.1 流程查看 流程管理页面共同点： 1包含选项分类筛选 2包含标签筛选 3包含应用下拉选筛选 4包含根据流程名称搜素 流程管理页面名词解释： 待办：当前登录用户未处理的流程节点 我发起的：当前登录用户人为触发的流程（模型触发） 抄送：抄送给当前登录用户的节点（审批/填写） 我已办结：由当前登录用户完成人工/自动同意、人工拒绝或人工填写的节点 无需办理：当前登录用户转交的任务/被退回、被撤销、被或签、被其他分支任务拒绝的还未办理的任务 站内信：当前登录用户收到的站内信 2.2 流程处理 每条流程数据下方有动作，点击进入流程处理页面，大致分为详情页和操作页。 待办中点击“审批/填写”会进入流程操作页。审批操作页可能包含“同意、拒绝、退回、加签、转交、返回”，填写操作页可能包含“提交、暂存”，审批操作页包含哪些动作由流程设计决定。 我发起的、抄送、我已办结、无需处理点击“查看”会进入流程详情页。 3. 应用快捷入口 应用中心中星标的收藏应用会展示在此处，点击可快捷进入应用。 应用中心中已安装的应用点击星标即可收藏。

  史, 昂

  2024年6月20日

  1.8K000
• Oinone 7天入门到精通

  4.2.8 自定义组件与设计器结合（新）

  界面设计器组件管理页面添加组件 进入组件的元件管理页面 点击“添加元件” 设计元件的属性 这里以是否“显示清除按钮”作为自定义属性从左侧拖入到中间设计区域，然后发布 点击“返回组件” 鼠标悬浮到卡片的更多按钮的图标，弹出下拉弹出“低无一体”的按钮 在弹窗内点击“生成SDK”的按钮 生成完成后，点击“下载模板工程” 解压模板工程kunlun-sdk.zip 解压后先查看README.MD，了解一下工程运行要点，可以先运行 npm i 安装依赖 再看kunlun-plugin目录下已经有生成好的组件对应的ts和vue文件 下面在vue文件内增加自定义代码，可以运行 npm run dev 在开发模式下调试看效果 <template> <div class="my-form-string-input"> <oio-input :value="realValue" @update:value="change" > <template #prepend>MyPrepend</template> </oio-input> </div> </template> <script lang="ts"> import { defineComponent, ref } from 'vue'; import { OioInput } from '@kunlun/vue-ui-antd'; export default defineComponent({ name: 'customField1', components: { OioInput }, props: { value: { type: String }, change: { type: Function }, }, setup(props) { const realValue = ref<string | null | undefined>(props.value); return { realValue }; } }); </script> <style lang="scss"> .my-form-string-input { border: 1px solid red; } </style> 确定改好代码后运行 npm run build，生成上传所需的js和css文件 可以看到 kunlun-plugin目录下多出了dist目录，我们需要的是 kunlun-plugin.umd.js 和 kunlun-plugin.css 这2个文件 再次回到组件的“低无一体”管理弹窗页面，上传上面生成的js和css文件，并点击“确定”保存，到这里我们的组件就新增完成了。 下面我们再到页面设计器的页面中使用上面设计的组件（这里的表单页面是提前准备好的，这里就不介绍如何新建表单页面了） 将左侧组件库拉直最底部，可以看到刚刚新建的组件，将其拖至中间设计区域，我们可以看到自定义组件的展示结果跟刚刚的代码是对应上的（ps: 如果样式未生效，请刷新页面查看，因为刚刚上传的js和css文件在页面初始加载的时候才会导入进来，刚刚上传的动作未导入新上传的代码文件），再次点击设计区域中的自定义组件，可以看到右侧属性设置面板也出现了元件设计时拖入的属性。 最后再去运行时的页面查看效果，与代码逻辑一致！

  史, 昂

  2024年5月23日

  1.4K000