相关推荐

• Oinone 7天入门到精通

  3.5.7.3 自定义布局

  布局是什么 在系统中，布局决定了母版内的页面元素，一个页面可以由多个组件进行组装，布局可以根据视图类型来替换。 默认布局范围: 图3-5-7-36 默认布局范围 作用场景 系统内置了多个布局组件，这些组件适用于全局、某个应用或某个页面，提供了灵活的布局定制选项。这些组件根据不同类型的视图进行了默认的组装，这也是选择了视图类型后，页面能够呈现的原因。当然，这些默认的组装是可以被覆盖、新增和添加新组件的。 使用registerLayout进行自定义布局 开发者在使用这些布局组件时，应该遵循公司的规范进行统一的调整。自定义布局组件的使用可通过 registerLayout 实现。registerLayout 的第一个参数是代表布局的 XML，第二个参数是不同的选项维度，默认包含以下维度： viewType: 视图类型 module: 视图模型所在模块 moduleName: 视图模型所在模块名称 model: 视图模型编码 modelName: 视图模型名称 viewName: 视图名称 actionName: 动作名称 inline: 是否内嵌视图(子视图特有) ttype: 模型字段类型(子视图特有) relatedTtype: 关联模型字段类型(子视图特有) field: 字段(子视图特有) 需要注意的是，动作可以是A模块下的a模型，这个动作可以打开B模块下的b模型的视图，module、moduleName、model、modelName应该填b模型对应的值，只不过大部分场景我们都是本模型的动作打开本模型的视图，所以这些场景拿动作所在模型填这些值也可以这些纬度也可以通过查看TS的定义查看 全局 在系统中，我们可以通过指定视图类型来决定某一类视图的全局布局。以表格为例，当第二个入参为 { viewType: ViewType.Table } 时，代表了替换了系统内所有表格的布局样式。 示例工程目录 以下是需关注的工程目录示例，main.ts更新导入./layout，layout/index.ts更新导出./tableLayout： 图3-5-7-37 全局纬度注册布局工程目录示例 示例代码 import {registerLayout, ViewType} from '@kunlun/dependencies' /** * 把系统内所有表格类型视图的全局动作放入搜索区域 * * 移动actionBar布局至外层 * <element widget="actionBar" slot="actionBar" slotSupport="action"> * <xslot name="actions" slotSupport="action" /> * </element> * */ const registerGlobalTableLayout = () => { return registerLayout(`<view type="TABLE"> <element widget="actionBar" slot="actionBar" slotSupport="action"> <xslot name="actions" slotSupport="action" /> </element> <pack widget="group"> <view type="SEARCH"> <element widget="search" slot="search" slotSupport="field" /> </view> </pack> <pack widget="group" slot="tableGroup"> <element widget="table" slot="table" slotSupport="field"> <element widget="expandColumn" slot="expandRow" /> <xslot name="fields" slotSupport="field" /> <element widget="rowActions" slot="rowActions" slotSupport="action" /> </element> </pack> </view>`, { viewType: ViewType.Table }) } registerGlobalTableLayout() 图3-5-7-38 全局纬度注册布局代码示例 效果 图3-5-7-39 全局纬度注册布局效果示例 应用 在系统中，我们可以通过指定视图类型和模块名称来替换某一类视图在特定模块下的全局布局。以表格为例，当第二个入参为 { viewType: ViewType.Table, moduleName: ‘resource’ } 时，代表了替换了资源应用下所有表格的布局样式，而其他应用仍使用默认布局 import {registerLayout, ViewType} from '@kunlun/dependencies' const registerModuleTableLayout = () => { return registerLayout(`<view type="TABLE"> <element widget="actionBar" slot="actionBar" slotSupport="action"> <xslot name="actions" slotSupport="action" /> </element> <pack widget="group"> <view type="SEARCH"> <element widget="search" slot="search" slotSupport="field" /> </view> </pack> <pack…

  史, 昂

  2024年5月23日

  1.2K000
• Oinone 7天入门到精通

  4.5.1 研发辅助之插件-结构性代码

  研发辅助意在 消灭研发过程中的重复性工作提升研发效率，如结构性代码 提供生产示例性代码，如果根据模型生成导入导出、view自定义配置等经常性开发 一、插件安装 根据自身Idea版本下载插件并安装： 版本 插件 2023.1 pamirs-source-maker-1.0.0-2023.1.zip(2.4 MB) 2021.1 pamirs-source-maker-1.0.0-2021.1.zip(2.4 MB) 2021.2 pamirs-source-maker-1.0.0-2021.2.zip(2.4 MB) 2021.3 pamirs-source-maker-1.0.0-2021.3.zip(2.4 MB) 2022.1 pamirs-source-maker-1.0.0-2022.1.zip(2.4 MB) pamirs-source-maker-1.0.0-223-EAP-SNAPSHOT(2.4 MB) 表4-5-1-1 插件列表 二、研发辅助之配置式结构性代码生成器 我们在开发过程中为了日后代码易于维护和修改，往往会做工程性的职责划分。 除去模型外会有 代理模型和代理模型Action来负责前端交互 以面向接口的形式来定义函数，就会有api和实现类之分 如果项目有多端，那么如代理模型和代理模型Action又要为每一个端构建一份 在大型项目的初始阶段，我们需要手工重复做很多事情，特别麻烦。现在用oinone的研发辅助插件的结构性代码生成器，就可以避免前面的重复工作 插件执行的配置文件 <?xml version="1.0" encoding="utf-8" ?> <oinone> <makers> <!– 根据模型生成代理类、代理类的Action、Service、ServiceImpl –> <maker> <!– 选择模型所在位置 –> <modelPath>/Users/oinone/Documents/oinone/demo/pamirs-second/pamirs-second-api/src/main/java/pro/shushi/pamirs/second/api/model</modelPath> <!– 代理模型、代理模型Action生成相关配置信息 –> <proxyModules> <module> <!– 代理模型和代理模型Action的生成位置信息 –> <generatePath>/Users/oinone/Documents/oinone/demo/pamirs-second/pamirs-second-api/src/main/java/pro/shushi/pamirs/second/api</generatePath> <!– 代理模型和代理模型Action的模块前缀 –> <modulePrefix>second</modulePrefix> <!– 代理模型和代理模型Action的模块名，代理模型和代理模型Action类名为moduleName+模型名+"Proxy"+"Action" –> <moduleName>second</moduleName> <!– 代理模型和代理模型Action的包名,实际包名为 packageName+".proxy"或packageName+".action"–> <packageName>pro.shushi.pamirs.second.api</packageName> </module> </proxyModules> <!– 根据模型生成api，包括service（写方法）和queryService（读方法） –> <apiModule> <!– service和queryService的生成位置信息 –> <generatePath>/Users/oinone/Documents/oinone/demo/pamirs-second/pamirs-second-api/src/main/java/pro/shushi/pamirs/second/api</generatePath> <!– service和queryService的模块前缀 –> <modulePrefix>second</modulePrefix> <!– service和queryService的模块名 –> <moduleName>second</moduleName> <!– service和queryService的包名,实际包名为 packageName+".service" –> <packageName>pro.shushi.pamirs.second.api</packageName> </apiModule> <!– 根据模型生成api实现类，包括serviceImpl（写方法）和queryServiceImpl（读方法） –> <coreModule> <!– serviceImpl和queryServiceImpl的生成位置信息 –> <generatePath>/Users/oinone/Documents/oinone/demo/pamirs-second/pamirs-second-core/src/main/java/pro/shushi/pamirs/second/core</generatePath> <!– serviceImpl和queryServiceImpl的模块前缀 –> <modulePrefix>second</modulePrefix> <!– serviceImpl和queryServiceImpl的模块名 –> <moduleName>second</moduleName> <!– serviceImpl和queryServiceImpl的包名,实际包名为 packageName+".service" –> <packageName>pro.shushi.pamirs.second.core</packageName> </coreModule> </maker> </makers> </oinone> 图4-5-1-1 插件执行的配置文件 三、研发辅助之多模型结构性代码生成器 是配置式结构性代码生成器的补充，应对开发后期维护中新增模型的场景。它的不同点在于只要选择模型文件就可以，不需要专门编写xml文件。生成的文件默认就在模型所在路径下 Step1 菜单栏上找到oinone，并点击子菜单【多模型结构性代码生成器】 图4-5-1-2 多模型结构性代码生成操作步骤一 Step2 设置必要的信息 模型前缀 模型的所属模块 代理模型的模块 这三个信息分别用于构建 代理模型的MODEL_MODEL = 模型前缀.代理模型的模块.代理模型类名 服务的FUN_NAMESPACE = 模型前缀.代理模型的模块.服务类名 图4-5-1-3 多模型结构性代码生成操作步骤二 Step3 选择为哪些模型生成对应的结构性代码 图4-5-1-4 多模型结构性代码生成操作步骤三 Step4 代码在模型所在目录 生成的文件默认就在模型所在路径下，您可以手动拖动到对应的包路径当中去 图4-5-1-5 多模型结构性代码生成操作步骤四

  史, 昂

  2024年5月23日

  1.1K000

• 产品使用手册（改）

  史, 昂

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

  1.1K000

• 高级视图

  史, 昂

  Oinone 7天入门到精通 2024年6月20日

  1.2K000
• Oinone 7天入门到精通

  页面设计

  1. 功能说明 页面设计时界面设计器中「页面」模块的设计入口，在这个界面，进行页面的设置、搭建、设计、排版。 主要分为顶部操作栏、左侧工具栏、中部设计画布区、右侧属性面板。 2. 操作栏 进入页面设计，顶部显示了页面的标题，以及返回、发布等操作。 2.1 发布 页面设计完成后，点击「发布」运行页面生效。若不点击发布，页面也有自动保存的功能，但在发布前，自动保存也等同于草稿，不会正式生效。 发布时如果有属性不符合校验规则（必填的属性未填、输入的内容校验不通过），会发布失败，相应的字段会特殊标记，需要查看并修改属性。 2.2 显示/隐藏母版 进入页面设计时默认不展示母版，可以手动操作显示母版 3. 工具栏 左侧的工具栏中包括组件库、页面设置等模块。 3.1 组件库 组件库中包含组件和模型，组件是当前设计器支持的所有组件，模型是页面所在模型下的所有字段和动作。 3.1.1 组件 组件中展示了系统支持的所有组件。包含 1）布局类组件，如分组、选项卡等，使用布局组件可以将页面进字段分类、分页； 2）字段类组件，如单行文本、整数、日期等等，使用字段类组件时都会在模型下对应创建一个字段； 3）动作类组件，如跳转动作、提交动作、链接动作等。 3.1.2 模型 组件库顶部，由组件可切换为模型：模型选项下，会展示当前模型的所有字段，以及系统默认动作。可以直接拖拽字段至设计画布中，会应用形成某个组件，可对组件进行多样的属性设置，优化交互。 3.1.2 组件和模型有什么区别 1展示内容维度不同 组件中展示的内容是组件信息，如分组、选项卡、单行文本、文件上传等；模型中展示的是模型下已有的所有字段。 2使用功能不同 组件中的组件使用前需要在模型中创建一个字段，当然，创建好的字段也会存在于模型中；模型中的字段可直接使用，并且使用时会在设计画布中对应生成个默认组件。 3使用场景不同 如果模型中已经存在目标字段，应直接选择从模型中拖拽字段；如果模型中没有需要的字段，可以在页面中增加一个组件，实际上也是在新增一个字段。 3.2 页面设置 页面设置中可以修改当前页面的标题、分组、页面描述，同时也是给页面上传缩略图的唯一入口。 4. 设计画布 将组件或字段拖拽至设计画布区，会生成样式。点击组件，右侧可对其进行设置，大部分属性可实时在画布中展示效果。 5. 属性面板 右侧属性面板抽屉中可以设置属性或查看字段信息，通过不同的属性配置化实现组件的多样化。 5.1 属性 属性中包括基本信息（如标题、占位提示、描述说明等）、校验信息（如是否必填、长度校验等）、交互信息（如排序方式、是否展示计数器等） 5.2 字段 首次从组件中拖拽，会先展示字段信息，并且是需要先创建一个字段，字段创建成功后，再次切换字段选项，只读展示当前组件所对应的字段基本信息。同理，如果是直接从字段中拖拽，字段选项中，只读展示当前字段基本信息。

  史, 昂

  2024年6月20日

  3.2K000