2.4.3 Oinone独特性之低无一体

相关推荐

• 模型设计器

  史, 昂

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

  2.2K000
• Oinone 7天入门到精通

  图表

  1. 业务场景 进入数据可视化后，默认处于图表列表页面，点击报表/数据大屏图标则可切换至对应列表；支持从模型获取数据后，过滤数据后创建可视化图表，维护的图表信息可以被报表、数据大屏、以及业务系统引用。 2. 操作流程 1）进入数据可视化，进入图表tab，维护分组信息； 2）在二级分组名称后点击“+”【添加图表】，对图表进行编辑设计； 3）创建完成后可以【编辑】图表； 4）图表完善后，可以点击【发布】图表，则图表此时可以被引用； 5）如果图表有更新，则可以点击【更新发布】，使业务系统引用对图表变为最新的图表信息； 6）如果图表数据不再可以公开使用，则需要通过【隐藏】功能将图表的引用权限收起，此时报表、数据大屏、前端业务系统均不可再引用该图表，但不影响已被引用的图表； 7）隐藏后可以【取消隐藏】，图表恢复隐藏前的状态和功能，可以被引用。 3. 操作流程图解 3.1 创建分组 1）操作流程：创建分组 2）操作路径：数据可视化-图表-创建分组 3）点击搜索框后的「+」创建一级分组，输入一级分组名称后，点击一级分组后的「+」创建二级分组，输入二级分组名称后，此时分组创建完成，可以在二级分组下创建图表 3.2 编辑分组名称 1）操作流程：选择分组-编辑分组名称 2）操作路径：数据可视化-图表-编辑分组名称 3）鼠标移动至需要修改的分组上，点击出现的「编辑图标」，可以修改分组名称，修改后分组名称实时更新 3.3 删除分组 1）操作流程：选择分组-删除分组 2）操作路径：数据可视化-图表-删除分组 3）鼠标移动至需要删除的分组上，当分组下无图表时出现「删除图标」，可以点击图标后删除分组，删除一级分组时对应所有的二级分组也会被删除，删除后消失，只有分组下没有图表的分组才能直接删除成功 3.4 创建图表 1）操作流程：选择二级分组-创建图表 2）操作路径：数据可视化-图表-二级分组-创建图表 3）鼠标移动至需要创建图表的二级分组上，出现「+」，点击图标后弹出“创建图表”弹窗，需要填写图表标题、模型、方法； a图表标题：最大支持20个字，支持汉字、数字、大小写字母、-；同个一级分组下不允许重复； b模型：需要选择来源数据对应的模型； c方法：选择模型后需要选择方法，方法是用来提取模型数据的逻辑； 4）选择成功后进入图表设计页面 3.5 编辑图表 1）操作流程：选择图表-编辑图表 2）操作路径：数据可视化-图表-二级分组-图表-编辑图表 3）只能编辑未发布或者已发布但没有被隐藏的图表，且存在三种编辑情况 a第一种：点击图表标题后的编辑图标，仅能编辑图表标题； b第二种：点击图表中的图表标题、图表副标题、图表描述后的编辑图标，可以直接编辑图表标题、图表副标题、图表描述； c第三种：点击【编辑】按钮，进入图表设计页面，带出已有的数据字段、样式、图表内容，编辑时的规则与创建时一致，编辑后可以点击保存进行更新，如果未保存直接返回，则编辑无效； 4）编辑后实时生效，图表信息保持展示最新效果 3.6 删除图表 1）操作流程：选择图表-删除图表 2）操作路径：数据可视化-图表-二级分组-图表-删除图表 3）未发布或者已发布但没有被隐藏的图表，并且没被前端或者报表引用，才展示图表菜单名称后的删除图标 4）删除后图表消失 3.7 复制 1）操作流程：选择图表-复制图表 2）操作路径：数据可视化-图表-二级分组-图表-复制图表 3）点击【复制】按钮，复制成功，名称为copy of 原图表标题，展示在原图表分组的最后一个 3.8 发布 1）操作流程：选择图表-发布图表 2）操作路径：数据可视化-图表-二级分组-图表-发布 3）选择单个未发布且没有被隐藏的图表，点击【发布】按钮，图表发布后可以被前端引用，图表状态变为已发布，展示最近发布时间； 4）如果图表发布后有更新内容，会展示的更新类型：更新图表信息/更新图表内容 3.9 查看最近一次发布的版本 1）操作流程：选择图表-查看最近一次发布的版本 2）操作路径：数据可视化-图表-二级分组-图表-查看最近一次发布的版本 3）当图表发布后有更新，在最近发布时间左侧展示【查看】，在最近发布时间下展示更新的类型，点击查看可以查看最近发布的版本 3.10 更新发布 1）操作流程：选择图表-更新发布图表 2）操作路径：数据可视化-图表-二级分组-图表-更新发布图表 3）选择单个已发布且没有被隐藏的图表，并且该图表在上次发布后有所更新，可以点击【更新发布】按钮，将最新的图表内容发布至业务系统，业务系统引用的图表为最新内容； 4）如果更新了内容，但未点击更新发布，则前端业务系统查看的图表仍为最近发布的图表 3.11 隐藏 1）操作流程：选择图表-隐藏图表 2）操作路径：数据可视化-图表-二级分组-图表-隐藏图表 3）图表默认不隐藏，点击图表左侧的是否隐藏可以切换，切换是否隐藏=是 a未发布的图表，较隐藏前，不可以操作【发布】，可以【取消隐藏】； b已发布的图表，较隐藏前，只能操作【导出图片、导出excel、取消隐藏】； 4）隐藏后的图表不可以被引用，但不影响已经被引用的数据 3.12 取消隐藏 1）操作流程：选择图表-取消隐藏图表 2）操作路径：数据可视化-图表-二级分组-图表-取消隐藏图表 3）隐藏后的图表可以取消隐藏，切换是否隐藏=否，取消隐藏后，图表恢复隐藏前的状态和功能，可以被引用 3.13 查看引用 1）流程：选择图表-查看被哪些报表/数据大屏/页面引用 2）操作路径：数据可视化-图表-二级分组-图表-更多-查看引用 3）选择具体的图表，查看当前图表被引用的所有信息 3.14 不允许别人编辑 1）流程：选择图表-不允许别人编辑 2）操作路径：数据可视化-图表-二级分组-图表-更多-不允许别人编辑 3）选择自己创建的图表，对图表是否允许其他人编辑进行设置；如果设置为不允许，则其他人无法编辑图表 3.15 不允许别人引用 1）流程：选择图表-更多-不允许别人引用 2）操作路径：数据可视化-图表-二级分组-图表-更多-不允许别人引用 3）选择自己创建的图表，对图表是否允许他人引用进行设置；如果设置为不允许，则其他人无法在报表、数据大屏、界面设计器引用到该图表 3.16 导出图片 1）操作流程：选择图表-导出图片 2）操作路径：数据可视化-图表-二级分组-图表-图表导出图片 3）选择图表后，点击【导出图片】按钮可以将当前图表导出为图片 3.17 导出EXCEL 1）操作流程：选择图表-导出EXCEL 2）操作路径：数据可视化-图表-二级分组-图表-图表导出EXCEL 3）选择图表后，点击【导出EXCEL】按钮可以将当前图表导出为EXCEL 4. 图表设计页面 4.1 修改模型、方法 1）操作流程：创建图表-进入图表设计页面 2）操作路径：数据可视化-图表-二级分组-图表-创建图表 3）在“创建图表”弹窗中选择了模型和方法后，可以在进入图表设计页面修改 4）图表设计页面，点击模型后的设置图标后，右侧弹出弹窗，可以修改模型和获取模型数据的方法，需要注意的是：修改模型后，图表信息会清空 4.2 维度 1）操作流程：创建图表-进入图表设计页面 2）操作路径：数据可视化-图表-二级分组-图表-创建图表 3）维度字段：布尔、文本、枚举、日期时间、年份、日期、时间、用户ID、手机号、邮箱 4.2.1 维度的添加 1）图表设计页面，点击维度后的「+」，右侧弹出弹窗，展示所有的维度字段，可以选择对应的字段进行分析 a拖动字段进入维度列表 b点击字段，则字段进入维度列表 2）不同的图表支持的维度个数不同，当维度字段个数已达上限后不可再添加；此时拖动新字段到旧字段上后，新字段会代替旧字段进行数据分析，且会保留相同的样式 4.2.2 维度的删除 1）维度选择后，鼠标放到维度字段上，显示「删除图标」 2）点击则字段删除成功，维度字段的效果消失 4.2.3 修改维度展示名称 1）维度选择后，鼠标放到维度字段上，显示「设置图标」 2）点击后下方弹出「修改展示名称」的设置选项，点击后右侧出现修改展示名称的弹窗，可以进行修改，在输入框下方可以查看原字段名称 4.3 数值 1）操作流程：创建图表-进入图表设计页面 2）操作路径：数据可视化-图表-二级分组-图表-创建图表 3）数值字段：整数、浮点数、金额、（连续的日期时间、年份、日期、时间） 4.3.1 数值的添加 1）图表设计页面，点击数值后的「+」，右侧弹出弹窗，展示所有的数值字段，可以选择对应的字段进行分析 a拖动字段进入数值列表 b点击字段，则字段进入数值列表 2）不同的图表支持的数值个数不同，当数值字段个数已达上限后不可再添加；此时拖动新字段到旧字段上后，新字段会代替旧字段进行数据分析，且会保留相同的样式 3）拖入的数值字段中，可以同时拖入整数、浮点数、金额；但是拖入字段类型=年份/日期时间/日期/时间后，不可以拖入其他字段类型的数值字段 4）饼图、漏斗图不可以在数值列表中拖入字段类型=年份/日期时间/日期/时间的字段 4.3.2 数值的删除 1）数值选择后，鼠标放到数值字段上，显示「删除图标」 2）点击则字段删除成功，数值字段的效果消失 4.3.3 修改数值展示名称 1）维度选择后，鼠标放到数值字段上，显示「设置图标」 2）点击后下方弹出可以设置的选项，点击「修改展示名称」选项，点击后右侧出现修改展示名称的弹窗，可以进行修改，在输入框下方可以查看原字段名称 4.3.4 修改数值聚合方式 1）维度选择后，鼠标放到数值字段上，显示「设置图标」 2）点击后下方弹出可以设置的选项，点击「聚合方式」选项，点击后右侧出现修改展示名称的弹窗，可以进行修改 3）默认是求和，可以修改为「无处理、最小值、最大值、平均值、计数」 a求和：将维度值对应的所有数值进行加和 b无处理：取维度值对应数值中的最近一条不为空的值 c最小值：取维度值对应数值中的最小值 d最大值：取维度值对应数值中的最大值 e平均值：取维度值对应数值的平均值 f计数：计算维度值对应的数值个数 4）修改后实时更新图表信息，会影响辅助线取数值字段时的值 4.3.5 修改数值数据格式 1）维度选择后，鼠标放到数值字段上，显示「设置图标」 2）点击后下方弹出可以设置的选项，点击「数据格式」选项，点击后右侧出现修改数据格式的弹窗，可以进行修改 3）可以设置字段的数据类型、单位；…

  史, 昂

  2024年6月20日

  1.5K000
• Oinone 7天入门到精通

  3.5.4 Ux注解详解

  我们默认视图已经基本可以用了，但实际业务中还是会有一些不大不小的自定义需求，写自定义视图又太麻烦，今天我们来学习一种更加轻量的模式即：后端研发可以通过注解来配置视觉交互。该系列注解以Ux开头，例如@UxHomepage、@UxMenu、@UxAction、@UxView、@UxWidget等等。 视图XML的配置优先级大于在代码上的注解，也就是代码上的注解影响的是默认展示逻辑。 一、Ux家族图谱 我们先简单通过家族图谱做个简单了解，脑海里有一个影响当有需要的时候知道能不能做，深入了解还需要大家多多动手去尝试 图3-5-4-1 Ux家族图谱 二、默认视图后端配置举例 在下面的代码片段中UxTable、UxForm、UxDetail、UxTableSearch都有涉及，几个特殊点做些解释其他的留大家自行测试 Group分组的配置逻辑：为了不让一个分组内的字段不断的写Group，所以采取了第一个字段写了Group，到下一个出现的group之间的字段都自动归为一个Group 搜素整体不展示可以用“@UxTable(enableSearch = false)”配置在模型的类上。 字段搜索用“UxTableSearch”配置在模型的字段上，其特殊逻辑是只要你配了一个字段，系统就不自动补充了，例子中表格页的搜索栏只会留下店铺名称和店铺编码 ……其他代码 //@UxTable(enableSearch = false)，整体不支持搜索 public class PetShop extends AbstractDemoIdModel { public static final String MODEL_MODEL="demo.PetShop"; @Field(displayName = "店铺编码") @UxForm.FieldWidget(@UxWidget(group = "Form基础数据"))//Form分组 @UxTableSearch.FieldWidget(@UxWidget())//支持搜索 private String code; @Field(displayName = "店铺编码2") @Field.Sequence(sequence = "DATE_ORDERLY_SEQ",prefix = "C",size=6,step=1,initial = 10000,format = "yyyyMMdd") private String codeTwo; @UxTableSearch.FieldWidget(@UxWidget())//支持搜索 @UxTable.FieldWidget(@UxWidget(invisible = "true"))//表格中不展示支持搜索 @Field(displayName = "店铺名称",required = true,immutable=true) private String shopName; @Field(displayName = "一年内新店") @UxForm.FieldWidget(@UxWidget(widget = "Switch",group = "Form基础数据"))//Switch,Checkbox可以切换着看，字段可选widget参考【字段的配置】一文 private Boolean oneYear; @Field(displayName = "开店时间",required = true) @UxDetail.FieldWidget(@UxWidget(invisible = "true"))//详情不展示 private Time openTime; @Field(displayName = "闭店时间",required = true) @UxDetail.FieldWidget(@UxWidget(invisible = "true"))//详情不展示 private Time closeTime; …… 其他代码 } 图3-5-4-2 默认视图后端配置举例

  史, 昂

  2024年5月23日

  1.4K000
• Oinone 7天入门到精通

  4.2.4 框架之网络请求-HttpClient

  oinone提供统一的网络请求底座，基于graphql二次封装 一、初始化 import { HttpClient } from '@kunlun/dependencies'; const http = HttpClient.getInstance(); http.setMiddleware() // 必须设置，请求回调。具体查看文章https://shushi.yuque.com/yqitvf/oinone/vwo80g http.setBaseURL() // 必须设置，后端请求的路径 图4-2-4-1 初始化代码示例 二、HttpClient详细介绍 获取实例 import { HttpClient } from '@kunlun/dependencies'; const http = HttpClient.getInstance(); 图4-2-4-2 获取实例 接口地址 import { HttpClient } from '@kunlun/dependencies'; const http = HttpClient.getInstance(); http.setBaseURL('接口地址'); http.getBaseURL(); // 获取接口地址 图4-2-4-3 接口地址 请求头 import { HttpClient } from '@kunlun/dependencies'; const http = HttpClient.getInstance(); http.setHeader({key: value}); 图4-2-4-4 请求头 variables import { HttpClient } from '@kunlun/dependencies'; const http = HttpClient.getInstance(); http.setExtendVariables((moduleName: string) => { return customFuntion(); }); 图4-2-4-5 variables 回调 import { HttpClient } from '@kunlun/dependencies'; const http = HttpClient.getInstance(); http.setMiddleware([middleware]); 图4-2-4-6 回调 业务使用-query private http = HttpClient.getInstance(); private getTestQuery = async () => { const query = `gql str`; const result = await this.http.query('module name', query); console.log(result) return result.data[`xx`]['xx']; // 返回的接口，打印出result对象层次返回 }; 图4-2-4-7 业务使用-query 业务使用-mutate private http = HttpClient.getInstance(); private getTestMutate = async () => { const mutation = `gql str`; const result = await this.http.mutate('module name', mutation); console.log(result) return result.data[`xx`]['xx']; // 返回的接口，打印出result对象层次返回 }; 图4-2-4-8 业务使用-mutate 三、如何使用HttpClient 初始化 在项目目录src/main.ts下初始化httpClient 初始化必须要做的事: 设置服务接口链接 设置接口请求回调 业务实战 前文说到自定义新增宠物表单，让我们在这个基础上加入我们的httpClient; 第一步新增service.ts 图4-2-4-8 新增service.ts service.ts import { HttpClient }…

  史, 昂

  2024年5月23日

  1.6K000
• Oinone 7天入门到精通

  6.5 权限体系（改）

  做好企业级软件，首先得过权限这一关 在企业的IT部门沟通中，权限是避免不了。自嘲下在我们刚出来创业时，为了收获客户对我们技术能力的信任，每每与跟客户沟通时都会说我们是阿里出来的，但在权限设计这个环节不那么灵验，反而被打上了不懂B端权限设计的标签，会问很多问题。我就很奇怪难道大厂就没有内部管理系统了？大厂只有C端交易，没有B端交易？但从侧面说明权限不简单还特别重要。做好企业级软件，首先得过权限这一关。 整体介绍 对于平台运行来说，权限是必须，但我们的auth模块不是必须的，auth模块只是我们提供的一种默认实现，客户可以根据平台的spi机制进行替换。auth模块利用了平台的Hook特性做到与业务无关，在我们开发上层应用的时，是不用感知它的存在的。 auth模块涉及：功能权限、数据权限 数据权限：行权限和列权限。备注：数据权限的控制只能用于【存储模型】 表级权限：表达的语义是：是否该表可读/写（修改和新增） 列权限：表达的语义是：是否该列可读/写（修改和新增） 行权限：表达的语义是：是否对该行可读/写（修改）/删除 功能权限：表达的语义是ServerAction/Function是否可执行/展示，viewAction是否可展示，菜单是否可以显示 范围说明： 配置多个权限项的时候，取并集 配置多个角色的时候，取并集 模型设计 产品体验 Step1 创建角色 通过App Finder 切换至【权限】应用，点击新增按钮创建一个名为oinone的角色 Step2 创建数据权限项 在【权限项列表】菜单，点击【创建】按钮新增一个名为【宠物达人数据权限项】，同时宠物达人的数据权限设置为只能查看性别为男的记录 配置说明： 名称： 代表该项配置的权限的名字（必填）（必须是全系统唯一） 权限模型： 选择需要拦截的数据所在的表，即为模型，可以搜索使用 描述：对该权限项的描述 权限条件的配置： 满足全部：对条件一和条件二要同时满足的数据才能被看见 满足任一：对条件一和条件二要任意满足的数据都能被看见 读权限：对该数据是否有读取的权限 写权限：对该数据是否有修改的权限 删除权限：对该条件内的数据是否有删除的权限 Step3 为角色配置权限 编辑oinone角色，只开通oinoneDemo工程应用 选中【数据权限】选项卡点击【添加】按钮，勾选宠物达人数据权限项点击【确定】按钮 整体点击保存，回到列表页记得点击【权限生效】按钮 Step4 新建用户绑定角色 切换到用户中心模块，点击【创建】按钮填写必要信息，并在角色选中oinone权限组。 退出admin用户，用oinone登陆，权限效果： 只能看见demo模块 oinone登陆只能看到性别为男的宠物达人记录 admin用户登陆 oinone用户登陆 因为宠物达人的页面没有把性别字段放出来，我们看下数据库数据 auth模块扩展 在日常项目开发中，难免会碰到一些针对权限管理的特殊需求，或是为提升性能做的特殊逻辑。接下来我给大家介绍auth模块扩展性。 权限全局配置 对所有权限角色都做限制，而且不想让用户感知，可以实现PermissionFunApi接口，API接口实现的配置方式【只能用于支持全局的数据权限配置】 实现接口PermissionFunApi 将实现托管给SpringAOP 接口的具体实现看下图的代码 package pro.shushi.pamirs.demo.core.service; import org.springframework.stereotype.Component; import pro.shushi.pamirs.auth.api.service.PermissionFunApi; import pro.shushi.pamirs.demo.api.model.PetTalent; @Component public class PetTalentPermissionFunApi implements PermissionFunApi { @Override public String permissionDomain(Object… args) { //获取当前组织中 return "name == '张学友'"; } @Override public String nameSpace() { return PetTalent.MODEL_MODEL; } } 不参与权限控制 如果某一接口不想做权限控制，则可以在启动工程的application-dev.yml文件中配置不需要权限过滤的接口 pamirs: auth: fun-filter: – namespace: demo.PetTalent fun: queryPage 换一个没有配置宠物达人权限的用户（除管理员以外）进入系统，则也可以看到数据。注意【权限全局控制】还是生效的 API 1. 获取当前用户对该模型的行权限 Result<String> result = CommonApiFactory.getApi(AuthApi.class).canReadAccessData("Model"); 返回值为 { 'data':"name=in=('hahaha')" 'success'：true … } 用法 ： 场景：前端发起的请求都会经过权限拦截，后端代码逻辑发起的数据请求都是不经过任何权限的过滤，但是某些特殊情况需要在后端代码逻辑发起的数据请求也带上权限过滤 入参：请求的模型 出参：Result 数据结构中data会存储一段字符串，该字符串为Rsql 将该Rsql追加到wrapper中 Result<String> result = CommonApiFactory.getApi(AuthApi.class).canReadAccessData("base.UeModule"); String data=result.getData(); QueryWrapper<UeModule> wrapper = Pops.query(); wrapper.setEntity(ueModule); if (!StringUtils.isBlank(data)) { wrapper.apply(data); }

  史, 昂

  2024年5月23日

  1.4K001