后台嵌入其他系统的界面，设计器：嵌入网页组件

相关推荐

• 未分类

  Excel导出模块翻译值

  由于目前翻译资源导出只可以导出应用资源，无法导出模块资源，所以暂时提供以下方法导出模块资源。6.2.11、5.7.4.20 之前版本验证 方案一： 导出环境覆盖以下类 package pro.shushi.pamirs.translate.template.imports; import com.alibaba.fastjson.JSON; import com.google.common.collect.Lists; import org.apache.commons.collections4.CollectionUtils; import org.apache.commons.lang3.StringUtils; import org.springframework.stereotype.Component; import pro.shushi.pamirs.file.api.context.ExcelDefinitionContext; import pro.shushi.pamirs.file.api.entity.ExcelExportFetchDataContext; import pro.shushi.pamirs.file.api.extpoint.impl.DefaultExcelExportFetchDataExtPoint; import pro.shushi.pamirs.file.api.model.ExcelExportTask; import pro.shushi.pamirs.framework.connectors.data.sql.Pops; import pro.shushi.pamirs.framework.connectors.data.sql.query.LambdaQueryWrapper; import pro.shushi.pamirs.framework.connectors.data.sql.query.QueryWrapper; import pro.shushi.pamirs.meta.annotation.Ext; import pro.shushi.pamirs.meta.annotation.ExtPoint; import pro.shushi.pamirs.meta.annotation.fun.extern.Slf4j; import pro.shushi.pamirs.meta.api.Models; import pro.shushi.pamirs.meta.api.dto.wrapper.IWrapper; import pro.shushi.pamirs.meta.common.lambda.LambdaUtil; import pro.shushi.pamirs.meta.common.util.PStringUtils; import pro.shushi.pamirs.meta.constant.SqlConstants; import pro.shushi.pamirs.meta.domain.module.ModuleDefinition; import pro.shushi.pamirs.resource.api.enmu.TranslationApplicationScopeEnum; import pro.shushi.pamirs.resource.api.model.ResourceTranslation; import pro.shushi.pamirs.resource.api.model.ResourceTranslationItem; import pro.shushi.pamirs.translate.constant.TranslateConstants; import pro.shushi.pamirs.translate.proxy.TranslationItemExportProxy; import pro.shushi.pamirs.translate.service.TranslationDslNodeVisitor; import pro.shushi.pamirs.translate.template.TranslateTemplate; import pro.shushi.pamirs.translate.utils.UniversalParser; import java.util.*; import java.util.stream.Collectors; import static pro.shushi.pamirs.translate.constant.TranslateConstants.FIELD_TO_EXCLUDE; /** * @author Adamancy Zhang * @date 2020-11-04 18:09 */ @Slf4j @Component @Ext(ExcelExportTask.class) @SuppressWarnings({"unchecked"}) public class ResourceTranslationExportExtPoint extends DefaultExcelExportFetchDataExtPoint { private String resLangCodeColumn = PStringUtils.fieldName2Column(LambdaUtil.fetchFieldName(ResourceTranslationItem::getResLangCode)); private String langCodeColumn = PStringUtils.fieldName2Column(LambdaUtil.fetchFieldName(ResourceTranslationItem::getLangCode)); private String moduleColumn = PStringUtils.fieldName2Column(LambdaUtil.fetchFieldName(ResourceTranslationItem::getModule)); @Override @ExtPoint.Implement(expression = "context.name=="" + TranslateTemplate.TEMPLATE_NAME + "" && context.model=="" + ResourceTranslation.MODEL_MODEL + """) public List<Object> fetchExportData(ExcelExportTask exportTask, ExcelDefinitionContext context) { ArrayList<Object> objects = new ArrayList<>(); Map<String, Object> queryData = exportTask.getConditionWrapper().getQueryData(); TranslationItemExportProxy data = JSON.parseObject(JSON.toJSONString(queryData), TranslationItemExportProxy.class); LambdaQueryWrapper<TranslationItemExportProxy> queryWrapper = Pops.<TranslationItemExportProxy>lambdaQuery() .from(TranslationItemExportProxy.MODEL_MODEL) .eq(StringUtils.isNotBlank(data.getModule()), ResourceTranslationItem::getModule, data.getModule()) .eq(ResourceTranslationItem::getResLangCode, TranslateConstants.RES_LANG_CODE) .eq(StringUtils.isNotBlank(data.getLangCode()), ResourceTranslationItem::getLangCode, data.getLangCode()) .eq(data.getState() != null, ResourceTranslationItem::getState, data.getState()) .like(StringUtils.isNotBlank(data.getResLangInclude()), ResourceTranslationItem::getOrigin, data.getResLangInclude()) .like(StringUtils.isNotBlank(data.getTargetInclude()), ResourceTranslationItem::getTarget, data.getResLangInclude()); Map<String, String> moduleNameMap = Models.origin().queryListByWrapper(Pops.<ModuleDefinition>lambdaQuery() .from(ModuleDefinition.MODEL_MODEL) .eq(StringUtils.isNotBlank(data.getModule()), ModuleDefinition::getModule, data.getModule())) .stream() .collect(Collectors.toMap(ModuleDefinition::getModule, ModuleDefinition::getDisplayName, (_a, _b)…

  yexiu

  2025年8月21日

  518000
• 未分类

  打印支持非存储数据导出

  介绍 平台提供的默认打印功能没有支持非存储数据的导出。我们可以自定义打印导出功能，以满足业务中个性化的需求。 实现思路 重写打印任务模型，添加业务数据字段 自定义打印动作，前端将导出数据放到业务数据字段中 使用导出数据扩展点机制修改导出数据 代码示例 继承平台的打印任务模型，加上需要业务数据字段，这个字段用于传输需要打印的表单数据，但是需要自定义打印的表单往往不止一个，所以需要定义为通用的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日

  785000
• 未分类

  Oinone 初级学习路径

  文档说明 文档链接 介绍Oinone前端相关知识点 前端基础学习路径 介绍Oinone后端相关知识点 后端基础学习路径 介绍平台基础组件 平台基础组件 介绍平台设计器常用场景实操 设计器基础学习路径 设计器实操案例示例 7.2 实战训练（积分发放）

  shao

  2024年6月15日

  1.4K000
• 未分类

  前端发布接入jenkins

  最原始的前端发布，会经过本地打包、压个 zip 包、通过工具手动上传、找到 leader 帮忙解压到对应的服务器上、同步文件服务器等等的步骤。每一个环节都是人工操作，发个版非常的繁琐。接入jenkins有助于我们简化CI/CD流程，实现前端发布自动化。 1. jenkins 安装部署（docker） 1-1 前置条件 安装 git、docker、配置 ssh git 安装 # enter 到底 yum install -y git # 查看git版本号 验证git安装成功 # git version 1.8.3.1 git –version docker 安装 # docker-ce Docker社区版 # docker-ce-cli Docker命令行界面（CLI） # containerd.io Docker插件，直接调用 Docker Compose # docker-compose-plugin Docker插件，直接调用 Docker Compose yum install -y docker-ce docker-ce-cli containerd.io docker-compose-plugin 配置 ssh # Enter到底，最终会生成以下文件 # /root/.ssh/authorized_keys 允许无密码登录的公钥列表 # /root/.ssh/id_rsa 私钥文件 # /root/.ssh/id_rsa.pub 公钥文件 注意该文件里的内容是接下来要用的 ssh-keygen -t rsa -C "root" # 复制公钥文件的内容，添加到GitHub 的 SSH keys 或 任意其他远程仓库 vim /root/.ssh/id_rsa.pub 1-2 jenkins 安装 docker 拉取镜像 # 拉取nginx docker pull nginx # 拉取jenkins docker pull jenkins/jenkins:lts # 查看镜像是否安装成功 docker images # REPOSITORY TAG IMAGE ID CREATED SIZE # jenkins/jenkins lts 6a44d1dd2d60 3 weeks ago 468MB # nginx latest 53a18edff809 7 weeks ago 192MB 创建 docker 相关目录 # 创建docker的相关目录 mkdir -p ./docker/{compose,jenkins_home,nginx/conf,html/origin/{master,dev}} # 创建docker-compose.yml配置文件 cd ./docker/compose # 具体配置内容见下面 touch docker-compose.yml # 创建nginx.conf配置文件 cd ./docker/nginx/conf # 具体配置内容见下面 touch nginx.conf 最终目录结构如下 ./docker/ ├── compose/ │ └── docker-compose.yml # 空的 docker-compose 配置文件 └── html/ └── origin/ ├── master/ # 预留的 master 版本 HTML 目录（为空） └── dev/ # 预留的 dev 版本 HTML…

  银时

  2025年5月12日

  688000
• 未分类

  自定义字段样式

  在日常开发中，我们经常会遇到需要根据业务规则动态展示字段样式的场景，比如表格、表单或详情中的某些字段需要改变文字颜色。本文将通过一个具体的案例，带大家实现这一功能。 以下以 自定义表格字段文字颜色 为例。 实现步骤 1. 在界面设计器中添加组件 通过界面设计器，添加一个组件 2. 创建元件 以表格的「金额字段」为例，创建对应的元件（可根据自己的业务场景调整）。 3. 配置元件属性 进入元件设计页面，从组件库中拖入「单行文本」到设计区域。在右侧属性面板中填写相关配置并保存 4. 保存元件 完成配置后，保存元件。 5. 发布元件 将元件发布，供页面设计使用。 6. 切换表格字段 进入页面设计器，将表格中的字段切换为刚刚创建的元件。 7. 配置字段颜色 在右侧属性面板中，配置字段的文字颜色： 固定颜色：直接输入颜色值（如 red）。 动态颜色：输入表达式，根据业务逻辑动态展示颜色。例如：当前行的名称等于 1 时显示红色，否则为蓝色。 示例表达式： activeRecord.name === '1' ? 'red' : 'blue' 8: 在代码中，自定义对应的表格字段 import { SPI, BaseFieldWidget, ModelFieldType, ViewType, TableCurrencyFieldWidget, Widget, RowContext, numberZeroFill, numberAddThousandth, Expression, ExpressionRunParam } from '@kunlun/dependencies'; import { toString } from 'lodash-es'; import { createVNode, VNode } from 'vue'; @SPI.ClassFactory( BaseFieldWidget.Token({ viewType: [ViewType.Table], ttype: [ModelFieldType.Currency], widget: 'TableCurrencyColor' }) ) export class TableCustomCurrencyFieldWidget extends TableCurrencyFieldWidget { computedFieldColor(context: RowContext) { const { fieldColor = ' ' } = this.getDsl(); if (!fieldColor) { return null; } // 如果当前颜色是表达式，则需要计算 if (Expression.hasKeywords(fieldColor)) { const params: ExpressionRunParam = { activeRecords: [context.data], rootRecord: {}, openerRecord: {}, scene: '' }; return Expression.run(params, fieldColor, fieldColor)!; } return fieldColor; } @Widget.Method() public renderDefaultSlot(context: RowContext): VNode[] | string { let value = numberZeroFill(toString(super.compute(context)), this.getPrecision(context)); if (this.getShowThousandth(context)) { value = numberAddThousandth(value); } return [ createVNode( 'div', { style: { color: this.computedFieldColor(context) } }, value ) ]; } } 9: 页面效果图

  汤乾华

  2025年1月9日

  6.1K000