Oinone 初级学习路径

相关推荐

• 未分类

  前端 快速查询并替换默认组件

  可以借助vue的调试工具快速找到对应的组件，请参考这篇文章 使用vue调试工具快速找到对应的组件 Mask默认组件 重写Mask组件 重写AppSwitcherWidget import Com from './com.vue' /** * SPI注册条件保持根 AppSwitcherWidget 一致，即可覆盖 */ @SPI.ClassFactory( MaskWidget.Token({ widget: 'app-switcher' }) ) export class CustomAppSwitcherWidget extends AppSwitcherWidget { /** * 如果需要重写vue组件，那么可以通过重写initialize方法来实现，如果是修改数据或者逻辑，那么可以删除这个函数 */ public initialize(props: any) { super.initialize(props); this.setComponent(Com) return this } } 重写 MenuWidget import Com from './com.vue' /** * SPI注册条件保持根 MenuWidget 一致，即可覆盖 */ @SPI.ClassFactory(MaskWidget.Token({ widget: 'nav-menu' })) export class CustomMenuWidget extends MenuWidget { /** * 如果需要重写vue组件，那么可以通过重写initialize方法来实现，如果是修改数据或者逻辑，那么可以删除这个函数 */ public initialize(props: any) { super.initialize(props); this.setComponent(Com) return this } } 重写 NotificationWidget import Com from './com.vue' /** * SPI注册条件保持根 NotificationWidget 一致，即可覆盖 */ @SPI.ClassFactory(MaskWidget.Token({ widget: 'notification' })) export class CustomNotificationWidget extends NotificationWidget { /** * 如果需要重写vue组件，那么可以通过重写initialize方法来实现，如果是修改数据或者逻辑，那么可以删除这个函数 */ public initialize(props: any) { super.initialize(props); this.setComponent(Com) return this } } 重写 LanguageWidget import Com from './com.vue' /** * SPI注册条件保持根 LanguageWidget 一致，即可覆盖 */ @SPI.ClassFactory(MaskWidget.Token({ widget: 'language' })) export class CustomLanguageWidget extends LanguageWidget { /** * 如果需要重写vue组件，那么可以通过重写initialize方法来实现，如果是修改数据或者逻辑，那么可以删除这个函数 */ public initialize(props: any) { super.initialize(props); this.setComponent(Com) return this } } 重写 UserWidget import Com from './com.vue' /** * SPI注册条件保持根 UserWidget 一致，即可覆盖 */ @SPI.ClassFactory(MaskWidget.Token({ widget: 'user' })) export class CustomUserWidget extends UserWidget { /** * 如果需要重写vue组件，那么可以通过重写initialize方法来实现，如果是修改数据或者逻辑，那么可以删除这个函数 */ public initialize(props: any) { super.initialize(props);…

  汤乾华

  2025年8月14日

  539000
• 未分类

  开放应用中的ip黑白名单

  IP白名单配置 入口：集成应用>开放管理>应用>授权调整>IP白名单配置 IP白名单取请求头中的X-Forwarded-For属性的最后一个值，X-Forwarded-For以英文,分割ip地址。 X-Forwarded-For: clientIP, proxy1IP, proxy2IP, …, proxyNIP 根据 RFC 7239 标准所述，X-Forwarded-For含义如下： clientIP：最左边的 IP，表示最初发起请求的客户端 IP（即真实用户 IP）。 proxyXIP：从左往右依次为中间各级代理服务器的 IP。 最右边的 IP：表示离当前 Web 服务器最近的一层代理服务器（IP白名单拦截的此IP）。 Nginx配置示例 以Nginx为例，为确保X-Forwarded-For拿到的是真实的IP地址，需要增加配置。 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; IP黑名单配置 入口：集成应用>开放管理>应用>黑名单 取值来源：从请求头 X-Real-IP 中提取客户端 IP。 验证逻辑： 若 X-Real-IP 不存在，直接拦截并返回异常提示：未获取到真实IP地址。 检查提取的 IP 是否在阻止列表中。 相关文章 IP黑白名单实现拦截三方用户

  夜神月

  2025年5月15日

  345000
• 未分类

  前端自定义组件之锚点分组

  本文将讲解如何通过自定义，实现锚点组件。这个锚点组件会根据界面设计器拖入的分组，动态解析出锚点。 实现路径 整体的实现思路是界面设计器拖个容器类的组件（这里以选项卡为例），自定义这个选项卡，往选项卡里拖拽的每个分组，每个锚点的名称是分组的标题。 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日

  265000
• 未分类

  导入导出支持国际化语言分隔符

  需求 导出 Excel 时，所有整数、小数字段需要加千分位分隔符显示 例如：10000 导出成 10,000。 只影响“导出的显示效果”，不改变原始数据的语义。 实现思路 通过修改“ Excel 默认导出模版”的平台逻辑，将整型字段模版定义为文本类型，并自定义导出扩展，将所有整型字段的数据根据国际化配置进行分割。 代码示例 自定义导出扩展，分割整型字段 注意 所有已有的导出扩展必须修改继承类ExcelExportSameQueryPageTemplate<Object> –> GlobalExportExt<Object> 否则，已有的导出扩展生成的Excel将无法正常格式化整型字段。 package pro.shushi.pamirs.top.core.temp.exports; import org.apache.commons.collections4.CollectionUtils; import org.springframework.stereotype.Component; import pro.shushi.pamirs.file.api.context.ExcelDefinitionContext; import pro.shushi.pamirs.file.api.entity.EasyExcelBlockDefinition; import pro.shushi.pamirs.file.api.entity.EasyExcelCellDefinition; import pro.shushi.pamirs.file.api.entity.EasyExcelSheetDefinition; import pro.shushi.pamirs.file.api.extpoint.ExcelExportFetchDataExtPoint; import pro.shushi.pamirs.file.api.extpoint.impl.ExcelExportSameQueryPageTemplate; import pro.shushi.pamirs.file.api.model.ExcelExportTask; import pro.shushi.pamirs.meta.annotation.Ext; import pro.shushi.pamirs.meta.annotation.ExtPoint; import pro.shushi.pamirs.meta.api.dto.config.ModelFieldConfig; import pro.shushi.pamirs.meta.api.session.PamirsSession; import pro.shushi.pamirs.meta.enmu.TtypeEnum; import pro.shushi.pamirs.meta.util.FieldUtils; import pro.shushi.pamirs.resource.api.model.ResourceLang; import java.math.BigDecimal; import java.util.ArrayList; import java.util.List; import java.util.Map; import java.util.concurrent.ConcurrentHashMap; import java.util.concurrent.ConcurrentMap; @Component @Ext(ExcelExportTask.class) public class GlobalExportExt<T> extends ExcelExportSameQueryPageTemplate<T> implements ExcelExportFetchDataExtPoint { @ExtPoint.Implement(priority = 1) @Override public List<Object> fetchExportData(ExcelExportTask exportTask, ExcelDefinitionContext context) { List<Object> results = super.fetchExportData(exportTask, context); if (CollectionUtils.isEmpty(results)) { return results; } return dataFormat(context, results); } public static List<Object> dataFormat(ExcelDefinitionContext context, List<Object> results) { ResourceLang resourceLang = new ResourceLang().setCode(PamirsSession.getLang()).queryOne(); if (resourceLang == null) { return results; } // 小数分隔符 String decimalPoint = resourceLang.getDecimalPoint(); // 整数分隔符 String thousandsSep = resourceLang.getThousandsSep(); // 数字分组规则（每组多少位，比如 "3"） String groupingRule = resourceLang.getGroupingRule(); // 解析 groupSize，只做一次 int groupSize = 3; if (groupingRule != null && groupingRule.matches("\\d+")) { try { groupSize = Integer.parseInt(groupingRule); } catch (NumberFormatException ignore) { } } boolean needGroup = groupSize > 0 && thousandsSep != null && !thousandsSep.isEmpty(); //…

  yexiu

  2025年11月18日

  107000
• 未分类

  打印支持非存储数据导出

  介绍 平台提供的默认打印功能没有支持非存储数据的导出。我们可以自定义打印导出功能，以满足业务中个性化的需求。 实现思路 重写打印任务模型，添加业务数据字段 自定义打印动作，前端将导出数据放到业务数据字段中 使用导出数据扩展点机制修改导出数据 代码示例 继承平台的打印任务模型，加上需要业务数据字段，这个字段用于传输需要打印的表单数据，但是需要自定义打印的表单往往不止一个，所以需要定义为通用的Object字段。 @Model.model(TransientPdfPrintTask.MODEL_MODEL) @Model(displayName = "传输模型Pdf打印任务") public class TransientPdfPrintTask extends PdfPrintTask { public static final String MODEL_MODEL="demo.TransientPdfPrintTask"; @Field(displayName = "业务数据") private Object businessData; } 自定义打印动作 @Model.model(TransientPdfPrintTask.MODEL_MODEL) @Component public class TransientPdfPrintTaskAction extends AbstractPdfPrintTaskAction<TransientPdfPrintTask> { @Resource private PdfFileService pdfFileService; @Action(displayName = "打印", contextType = ActionContextTypeEnum.CONTEXT_FREE, bindingType = {ViewTypeEnum.TABLE}) @Override public TransientPdfPrintTask createPrintTask(TransientPdfPrintTask data) { return super.createPrintTask(data); } @Override protected void doExport(TransientPdfPrintTask exportTask, PdfDefinitionContext context) { pdfFileService.doExportSync(exportTask, context); } @Function.Advanced(type = FunctionTypeEnum.QUERY) @Function(openLevel = FunctionOpenEnum.API) public TransientPdfPrintTask construct(TransientPdfPrintTask data) { String model = FetchUtil.fetchVariables(PdfConstants.MODEL); data.construct(); data.setModel(model); return data; } } 本篇文章只介绍同步打印，如果异步需要修改doExport方法。 编写导出的数据处理逻辑 @Ext(PdfPrintTask.class) public class PrintExportExt extends AbstractPdfExportFetchDataExtPointImpl implements PdfExportFetchDataExtPoint { // 这里使用扩展点表达式匹配需要打印的非存储模型，只有表达式为true才会走这段逻辑。 @Override @ExtPoint.Implement(expression = "context.model==\"" + ProductPricingClientTransient.MODEL_MODEL + "\"") public List<Object> fetchExportData(PdfPrintTask exportTask, PdfDefinitionContext context) { List<Object> result = new ArrayList<>(); List<Object> dataList = new ArrayList<>(); TransientPdfPrintTask transientPdfPrintTask = new TransientPdfPrintTask(); transientPdfPrintTask.set_d(exportTask.get_d()); dataList.add(transientPdfPrintTask.getBusinessData()); result.add(dataList); return result; } } 前端自定义打印按钮，将数据提交给业务数据字段，并使用同步导出打印。

  yexiu

  2025年10月13日

  432000