6.4 国际化之多语言

史, 昂 • 2024年5月23日 am8:11 • Oinone 7天入门到精通 • 2872 views

多语言是国际化中大家最常面对的问题，我们需要对应用的页面结构元素进行翻译，也需要对系统内容进行翻译比如：菜单、数据字典等，甚至还会业务数据进行翻译。但不管什么翻译需求，我们在实现上基本可以归类为前端翻译和后端翻译。前端翻译顾名思义是在前端根据用户选择语言对内容进行翻译，反之就是后端翻译。本文会带着大家了解oinone的前端翻译与后端翻译

准备工作

pamirs-demo-boot的pom文件中引入pamirs-translate包依赖

<dependency>
    <groupId>pro.shushi.pamirs.core</groupId>
    <artifactId>pamirs-translate</artifactId>
</dependency>

pamirs-demo-boot的application-dev.yml文件中增加配置pamirs.boot.modules增加translate，即在启动模块中增加translate模块

pamirs:
    boot:
    modules:
        - translate

后端翻译（使用）

这里通过对菜单的翻译来带大家了解翻译模块

Step1 新增翻译记录

切换应用到translate模块，点击新增翻译。

选择新增翻译生效模块
选择翻译的模型为：菜单模型
源语言选择中文，目标选择English
添加翻译项目：
1. 源术语为：商店
2. 翻译值为：shop
3. 状态为：激活

Step2 查看效果

应用切换到Demo模块，在右上角切换语言至英语

后端翻译（自定义模型的翻译）

在前面菜单的翻译中，似乎我们什么都没做就可以正常通过翻译模块完成多语言的切换了。是不是真如我们想象的一样，当然不是。是因为Menu模型的displayName字段加上@Field(translate = true)注解。

Step1 为PetType模型的name字段增加翻译注解

package pro.shushi.pamirs.demo.api.model;

import pro.shushi.pamirs.meta.annotation.Field;
import pro.shushi.pamirs.meta.annotation.Model;
import pro.shushi.pamirs.meta.base.IdModel;

@Model.MultiTable(typeField = "kind")
@Model.model(PetType.MODEL_MODEL)
@Model(displayName="品种",labelFields = {"name"})
public class PetType extends IdModel {

    public static final String MODEL_MODEL="demo.PetType";

    @Field(displayName = "品种名" , translate = true)
    private String name;

    @Field(displayName = "宠物分类")
    private String kind;
}

Step2 重启应用查看效果

切换应用到translate模块，点击新增翻译

切换应用到Demo模块，切换中英文，查看效果

前端翻译

还记得我们前端第一个自定义动作吗？会弹出“oinone第一个自定义Action，啥也没干”，我们要对它进行翻译。

Step1 修改前端DoNothingActionWidget.ts

import translateValueByKey
提示语用translateValueByKey加上翻译 const confirmRs = executeConfirm(translateValueByKey(\'oinone第一个自定义Action，啥也没干\')||\'oinone第一个自定义Action，啥也没干\');

前端更多翻译工具请见前端高级特性-框架之翻译工具

import {
  Action,
  ActionContextType,
  ActionWidget,
  executeConfirm,
  IClientAction,
  SPI,
  ViewType,
  Widget,
  translateValueByKey
} from '@kunlun/dependencies';

@SPI.ClassFactory(ActionWidget.Token({ name: 'demo.doNothing' }))
export class DoNothingActionWidget extends ActionWidget {
  @Widget.Method()
  public async clickAction() {
        const confirmRs =  executeConfirm(translateValueByKey('oinone第一个自定义Action，啥也没干')||'oinone第一个自定义Action，啥也没干');
    }
}

//定义动作元数据
Action.registerAction('*', {
  displayName: '啥也没干',
  name: 'demo.doNothing',
  id: 'demo.doNothing',
  contextType: ActionContextType.ContextFree,
  bindingType: [ViewType.Table]
} as IClientAction);

Step2 新增翻译记录

前端翻译的翻译记录对应的模型可以随意找一个放。但要注意几点：

不要找有字读配置translate = true的模型，因为会影响后端翻译性能。
最好统一到一个模型中，便于后续管理。这里大家可以自定义一个无有业务访问且本身无需要翻译的模型来挂载，避免性能损失

Step3 刷新远程资源生成前端语言文件

Step4 新增或修改.env

前端在项目根目录下新增或修改.env，可以参考.env.example文件。通过.env文件为前端配置oss文件路径，针对I18N_OSS_URL配置项。真实前端访问翻译语言文件的路径规则为：http://bucket.downloadUrl/mainDir/租户/translate/模块/语言文件。

yaml文件中oss配置的文件路径：http://pamirs.oss-cn-hangzhou.aliyuncs.com/upload/demo/
租户/translate/模块/语言文件前端会自动根据上下文组织

# 后端api配置
# API_BASE_URL=http://127.0.0.1:8090
# 下面是国际化语言的cdn配置，默认用当前请求链接下的路径: /pamirs/translate/${module}/i18n_${lang}.js
I18N_OSS_URL=http://pamirs.oss-cn-hangzhou.aliyuncs.com/upload/demo

Step5 重启前端应用看效果

对语言进行中英文切换，进入宠狗达人页面，点击【第一个自定义Action】，查看前端翻译效果

Oinone社区作者：史, 昂原创文章，如若转载，请注明出处：https://doc.oinone.top/oio4/9328.html

访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验

Oinone 7天从入门到精通

Like (0)

史, 昂数式管理员

0 2

6.5 权限体系（改）

Previous 2024年5月23日 am8:10

6.3 数据审计（改）

Next 2024年5月23日 am8:12

Oinone 7天入门到精通

书籍封面

史, 昂
2024年5月23日
3.7K001
Oinone 7天入门到精通

3.4.3.2 面向切面-拦截器

一、拦截器拦截器为平台满足条件的函数以非侵入方式根据优先级扩展函数执行前和执行后的逻辑。使用方法上的@Hook注解可以标识方法为拦截器。前置扩展点需要实现HookBefore接口；后置扩展点需要实现HookAfter接口。入参包含当前拦截函数定义与该函数的入参。拦截器可以根据函数定义与入参增加处理逻辑。拦截器分为前置拦截器和后置拦截器，前者的出入参为所拦截函数的入参，后者的出入参为所拦截函数的出参。可以使用@Hook注解或Hook模型的非必填字段module、model、fun、函数类型、active来筛选出对当前拦截方法所需要生效的拦截器。若未配置任何过滤属性，拦截器将对所有函数生效。根据拦截器的优先级priority属性可以对拦截器的执行顺序进行调整。priority数字越小，越先执行。二、前置拦截(举例) 增加一个前置拦截，对PetShop的sayHello函数进行前置拦截，修改函数的入参的shopName属性，在其前面增加"hookbefore:"字符串。并查看效果 Step1 新增PetShopSayHelloHookBefore实现HookBefore接口为run方法增加@Hook注解配置module={DemoModule.MODULE_MODULE},这里module代表的是执行模块，该Hook只匹配由DemoModule模块为发起入口的请求配置model={PetShop.MODEL_MODEL}，该Hook只匹配PetShop模型配置fun={"sayHello"}，该Hook只匹配函数编码为sayHello的函数 package pro.shushi.pamirs.demo.core.hook; import org.springframework.stereotype.Component; import pro.shushi.pamirs.demo.api.DemoModule; import pro.shushi.pamirs.demo.api.model.PetShop; import pro.shushi.pamirs.meta.annotation.Hook; import pro.shushi.pamirs.meta.api.core.faas.HookBefore; import pro.shushi.pamirs.meta.api.dto.fun.Function; @Component public class PetShopSayHelloHookBefore implements HookBefore { @Override @Hook(module = {DemoModule.MODULE_MODULE},model = {PetShop.MODEL_MODEL},fun = {"sayHello"}) public Object run(Function function, Object… args) { if(args!=null && args[0]!=null){ PetShop arg = (PetShop)args[0]; arg.setShopName("hookbefore:"+ arg.getShopName()); } return args; } } 图3-4-3-5 新增PetShopSayHelloHookBefore实现HookBefore接口 Step2 重启查看效果用graphQL工具Insomnia查看效果，如果访问提示未登陆，则请先登陆。详见3.4.1【构建第一个Function】一文用 http://127.0.0.1:8090/pamirs/base 访问，结果我们会发现PetShopSayHelloHookBefore不起作用。是因为本次请求是以base模块作为发起模块，而我们用module={DemoModule.MODULE_MODULE}声明了该Hook只匹配由DemoModule模块为发起入口的请求图3-4-3-6 示例效果用 http://127.0.0.1:8090/pamirs/demoCore 访问，前端是以模块名作为访问入口不是模块编码这里大家要注意下图3-4-3-7 示例效果用 http://127.0.0.1:8090/pamirs/demoCore 访问，更换到petShop的子模型petShopProxy来访问sayHello函数，结果我们发现是没有效果的。因为配置model={PetShop.MODEL_MODEL}，该Hook只匹配PetShop模型三、后置拦截(举例) 增加一个后置拦截，对PetShop的sayHello函数进行后置拦截，修改函数的返回结果的shopName属性，在其后面增加"hookAfter:"字符串。并查看效果 Step1 新增PetShopSayHelloHookAfter实现HookAfter接口为run方法增加@Hook注解配置model={PetShop.MODEL_MODEL}，该Hook只匹配PetShop模型配置fun={"sayHello"}，该Hook只匹配函数编码为sayHello的函数 package pro.shushi.pamirs.demo.core.hook; import org.springframework.stereotype.Component; import pro.shushi.pamirs.demo.api.model.PetShop; import pro.shushi.pamirs.meta.annotation.Hook; import pro.shushi.pamirs.meta.api.core.faas.HookAfter; import pro.shushi.pamirs.meta.api.dto.fun.Function; @Component public class PetShopSayHelloHookAfter implements HookAfter { @Override @Hook(model = {PetShop.MODEL_MODEL},fun = {"sayHello"}) public Object run(Function function, Object ret) { if (ret == null) { return null; } PetShop result =null; if (ret instanceof Object[]) { Object[] rets = (Object[])((Object[])ret); if (rets.length == 1) { result = (PetShop)rets[0]; } } else { result = (PetShop)ret; } result.setShopName(result.getShopName()+":hookAfter"); return result; } } 3-4-3-8 新增PetShopSayHelloHookAfter实现HookAfter接口 Step2 重启查看效果用 http://127.0.0.1:8090/pamirs/base 访问，结果我们会发现PetShopSayHelloHookAfter是起作用。PetShopSayHelloHookBefore没有配置模块过滤。 3-4-3-9 示例效果用访问，结果我们会发现PetShopSayHelloHookAfte和PetShopSayHelloHookBefore同时起作用 3-4-3-10 示例效果我们会发现HookAfter只对结果做了修改，所以message中可以看到hookbefore，但看不到hookAfter 四、注意点不管前置拦截器，还是后置拦截器都可以配置多个，根据拦截器的优先级priority属性可以对拦截器的执行顺序进行调整。priority数字越小，越先执行。小伙伴们可以自行尝试拦截器必须是jar依赖，不然执行会报错。特别是有的小伙伴配置了一个没有过滤条件的拦截器，就要非常小心模块启动yml文件可以过滤不需要执行的hook，具体配置详见4.1.1【模块之yml文件结构详解】一文调用入口不是由前端发起而是后端编程中直接调用，默认不会生效，如果要生效请参考4.1.9【函数之元位指令】一文

史, 昂
2024年5月23日
1.9K000
Oinone 7天入门到精通

数据编码

1. 什么是数据编码当模型中的字段数据需要有一定的编码规定，可以在模型中设计模型或字段的数据编码。编码预览：实时展示规则设置后的编码。 2. 编码前/后缀编码前缀：必须以字母开头，且仅支持数字或字母，最多8个字符。编码后缀：必须以字母开头，且仅支持数字或字母，最多8个字符。 3. 格式化日期开关默认关闭，即数据编码中不包含日期。开关打开后，默认的日期格式为“年年年年月月日日”，也可以切换成“年年月月日日、年年月月、年年年年、年年”。序列归零周期：与格式化日期选择有关，若选择为“年年年年月月日日”，则可选“年、月、日”，选择为“年年年年”，则只可选“年”数据编码序列会按照设置的这个周期归零。 4. 编码序列编码方式：可选择连续序列或非连续序列，选择会影响后续包含哪些设置。序列长度：序列包含多少位数字，可以设置1 – 18之间的整数。序列起始值：数据编码序列的起始值，默认值为3。当编码方式设置为非连续序列时，展示其余两个配置项。步长类型：默认值为“自定义步长”，也可以设置成“1 – 10之间随机步长”。步长：当选择“自定义步长”时，设置的步长即为真实步长。当选择“1 – 10之间随机步长”时，实际步长为1 – 设置值之间的随机整数。

史, 昂
2024年6月20日
2.7K000
4.2 前端高级特性

史, 昂
Oinone 7天入门到精通 2024年5月23日
2.1K000
Oinone 7天入门到精通

构件类

1.构件类 1.1 延时当下一个节点动作需要一段时间之后再发生时，可以使用延时节点。延时节点包含两种延时方式：1、延至指定日期，2、延时一段时间。选择延至指定日期时，可以选择延至模型字段的时间或自定义时间，如果模型字段只包含日期则必填指定时辰。如果选择自定义则需要分别指定日期和时辰。选择延时一段时间时，至少需要填“天、小时、分钟”中的一项。 1.2 条件分支使不同条件的数据执行不同的分支流程。需要设置分支条件、添加满足条件的动作、也可以增删条件分支。必须将分支条件填写完整流程才能正常进行。当只有两个分支时点击删除任一分支会删除整个条件分支。 1.3 审批分支审批分支是一种特殊的条件分支。审批分支只能添加在审批节点下方。因为审批只存在通过和拒绝两种条件，所以无法添加其他条件，并且点击任意条件的叉都会删除整个条件分支。同时若审批节点被删除，审批分支也会同时删除。 1.4 子流程一些高度重复的流程节点可以创建成子流程，在主流程中引用子流程，减少流程的重复配置。选择子流程时只能选择当前流程中有用到的模型下并且在启用状态的子流程，也可以在创建子流程节点处设置新增子流程。子流程的执行方式有两种：子流程可以和后续节点同时执行，也可以设置子流程执行完后再执行后续节点。子流程与普通正常流程不同，不包含触发方式，普通流程流转到子流程节点即为子流程的触发条件，添加完节点动作之后发布即可。在不新增数据的情况下，子流程中只能使用该子流程对应模型的字段数据。

史, 昂
2024年5月23日
2.5K000

Please Login to Comment

Comments(2)

xiao3 2024年11月25日 am10:43

只支持英语吗？如何添加其他语种？

Reply
- shao 2024年11月25日 pm5:24
  
  @xiao3：支持其他的国家的语言，需要在资源里面创建，如果有其他的疑问，也可以群内联系我们哈
  
  Reply