@alanwang-merit/meritdata-platform-skill-package 1.0.0

package/skills/meritdata-dev-docs-file-finder/references/dev-docs/.bak//345/272/224/347/224/250/345/274/200/345/217/221/345/271/263/345/217/260-/345/237/272/347/241/200/345/271/263/345/217/260-/344/275/277/347/224/250/346/224/273/347/225/245/357/274/210/345/215/201/344/270/200/357/274/211/357/274/232/350/260/203/345/272/246/347/274/226/346/216/222/344/272/214/345/274/200/350/257/264/346/230/216.md

@@ -0,0 +1,244 @@
+```xml
+title: 应用开发平台使用攻略（十一）：调度编排二开指导说明
+date: 2025.05.27
+categories:
+  - 开发攻略
+  - 6.13.2
+```
+
+#                                   调度编排二开指导说明
+
+背景说明：应用开发平台从 6.6 开始提供了调度编排功能，调度编排的功能使用需要和业务系统进行数据对接，因此编写这份文档指导业务侧按照规则进行二开。
+
+开发步骤：
+
+## 1.依赖包引入
+
+基础依赖包中定义了接口的入参，返参，及接口定义
+
+```xml
+<dependency>
+    <groupId>com.meritdata.cloud</groupId>
+    <artifactId>cloud-starter-schedule</artifactId>
+    <version>6.13.2</version>
+</dependency>
+```
+
+## 2.配置文件中添加配置
+
+在 bootstrap.properties 中添加配置
+
+| 配置名称                           | 值说明及示例                                                                                                      |
+| ---------------------------------- | ----------------------------------------------------------------------------------------------------------------- |
+| meritdata.cloud.schedule-sync.name | 前端业务系统展示名称 如：Tempo DF 若为中文则需要编码是 unicode 防止中文乱码 （\u7F16\u8F91\u4EFB\u52A1 ）这种格式 |
+
+## 3.实现接口
+
+调度编排不直接执行任务，需要调用业务侧的接口，因此业务侧需要实现如下接口。接口的抽象层已经在 cloud-starter-schedule 包中了，因此业务系统只需要实现 ICloudClient 接口并重写方法即可。
+
+```java
+    /**
+     提交任务
+    **/
+    @PostMapping(value = "/schedule/sync/job-exec-url", consumes = MediaType.APPLICATION_JSON_UTF8_VALUE)
+    ResultBody submit(@RequestBody TaskSyncVO taskSyncVO);
+
+    /**
+     查询任务状态
+    **/
+    @PostMapping(value = "/schedule/sync/job-status-url", consumes = MediaType.APPLICATION_JSON_UTF8_VALUE)
+    ResultBody<StatusEnum> status(@RequestBody TaskSyncVO taskSyncVO);
+
+    /**
+     查询实例日志
+    **/
+    @PostMapping(value = "/schedule/sync/job-log-url", consumes = MediaType.APPLICATION_JSON_UTF8_VALUE)
+    ResultBody log(@RequestBody TaskSyncVO taskSyncVO);
+
+    /**
+     获取任务列表
+    **/
+    @PostMapping(value = "/schedule/sync/job-list-url", consumes = MediaType.APPLICATION_JSON_UTF8_VALUE)
+    ResultBody<GridView<TaskResult>> getTaskList(@RequestBody TaskVO vo);
+
+    /**
+     获取任务参数
+    **/
+    @PostMapping(value = "/schedule/sync/job-param-url", consumes = MediaType.APPLICATION_JSON_UTF8_VALUE)
+    ResultBody<List<TaskParamVO>> getParamList(@RequestBody TaskSyncVO taskSyncVO);
+
+    /**
+     取消任务
+    **/
+    @PostMapping(value = "/schedule/sync/job-cancel-url", consumes = MediaType.APPLICATION_JSON_UTF8_VALUE)
+    ResultBody cancelJob(@RequestBody TaskSyncVO taskSyncVO);
+```
+
+接口实现实例
+
+```java
+package com.meritdata.cloud.controller;
+
+import cn.hutool.json.JSONObject;
+import com.meritdata.cloud.api.ICloudClient;
+import com.meritdata.cloud.base.mvc.entity.GridView;
+import com.meritdata.cloud.enums.StatusEnum;
+import com.meritdata.cloud.vo.TaskParamVO;
+import com.meritdata.cloud.vo.TaskResult;
+import com.meritdata.cloud.vo.TaskSyncVO;
+import com.meritdata.cloud.vo.TaskVO;
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.web.bind.annotation.RestController;
+
+import java.util.*;
+import java.util.stream.IntStream;
+
+
+@RestController
+@Slf4j
+public class TaskSyncController implements ICloudClient {
+
+
+
+    /**
+     提交任务
+    **/
+    @Override
+    public ResultBody submit(TaskSyncVO taskSyncVO) {
+        log.info("执行任务已经到业务系统, 任务id: {}, 任务参数：{}",taskSyncVO.getTaskId(), taskSyncVO.getTaskParamVO());
+        taskSyncVO.getTaskParamVO().forEach(item->{
+            log.info("执行任务已经到业务系统, 任务id: {}, 任务参数明细：{},{}",taskSyncVO.getTaskId(), item.getName(), item.getValue());
+        });
+        log.info("执行任务已经到业务系统, 任务id: {}, type：{},execId:{},cycTime:{},jobId:{},execType:{},metaInfo:{}",
+                taskSyncVO.getTaskId(), taskSyncVO.getType(), taskSyncVO.getExecId(), taskSyncVO.getCycTime(),taskSyncVO.getJobId,taskSyncVO.getExecType,taskSyncVO.getMetaInfo);
+        //添加新的三个参数，jobId：job实例，execType：任务执行类型,11编排、12补数据任务、13重跑任务、20，定时任务，metaInfo：扩展字段
+        //添加三个新字段是为了调度编排二开任务适配调度监控，进行任务的监控。
+        JSONObject jsonObject = new JSONObject();
+        jsonObject.putOpt("monResult", "success");
+        return ResultBody.success(jsonObject.toString());
+    }
+
+    /**
+     任务状态
+
+    */
+    static StatusEnum[] statusEnums = new StatusEnum[]{
+            StatusEnum.RUNNING, // 运行中
+            StatusEnum.RUNNING_FAIL, // 运行失败
+            StatusEnum.RUNNING_FAIL_RETRY, // 运行失败重试
+            StatusEnum.SUCCESS // 运行成功
+    };
+    /**
+     获取任务状态
+    **/
+    @Override
+    public ResultBody<StatusEnum> status(TaskSyncVO taskSyncVO) {
+        log.info("获取业务系统任务状态, 任务id: {}, 业务系统任务id：{}， 任务的运行返回的参数：{}",taskSyncVO.getTaskId(), taskSyncVO.getSyncTaskId(), taskSyncVO.getExecData());
+        return ResultBody.success(statusEnums[0]);
+
+    }
+
+    /**
+     获取任务日志
+    **/
+    @Override
+    public ResultBody log(TaskSyncVO taskSyncVO) {
+        log.info("获取业务系统的日志, 任务id: {}",taskSyncVO.getTaskId());
+        String   log = '执行成功';
+        //通过任务id和实例id获取任务执行日志
+        return ResultBody.success(log);
+    }
+
+    /**
+     获取任务列表
+     入参有分页 任务名称 时间 创建者
+    **/
+    @Override
+    public ResultBody<GridView<TaskResult>> getTaskList(TaskVO vo) {
+        List<TaskResult> list = new ArrayList<>();
+        return ResultBody.success(new GridView(list, list.size()));
+    }
+
+
+    /**
+     获取任务参数
+    **/
+    @Override
+    public ResultBody<List<TaskParamVO>> getParamList(TaskSyncVO taskSyncVO) {
+        log.info("获取任务参数已经到业务系统, 任务id: {}",taskSyncVO.getTaskId());
+        TaskParamVO taskParamVO = new TaskParamVO();
+        taskParamVO.setName("memory");         // 页面展示展示参数名
+        taskParamVO.setDisplay("内存");        // 页面展示名称
+        taskParamVO.setGroup("system");        // 参数分组
+        taskParamVO.setGroupName("系统参数");  // 页面展示分组标签名
+        taskParamVO.setDesc("参数1的描述");
+        taskParamVO.setValue("1");             // 参数值
+        taskParamVO.setKey("1G");              // 参数key，参数为下拉时用
+        taskParamVO.setType(ParamTypeEnum.SELECT_INPUT);   // 参数类型，TEXT（文本类型）、SELECT（下拉框）、SELECT_INPUT（下拉输入框）
+        taskParamVO.setMeta("[{'key':'1G','value':'1'},{'key':'2G','value':'2'},{'key':'3G','value':'3'}]");   // 参数类型为下拉框或下拉输入框的时候，下拉框里可选值的来源，key为页面显示的值，value为参数的值
+        taskParamVO.setGroupOrder(0);   // 参数组的排序
+        taskParamVO.setOrder(0);        // 参数的排序
+        return ResultBody.success(Arrays.asList(taskParamVO));
+    }
+
+    /**
+     杀死任务实例
+    **/
+    @Override
+    public ResultBody cancelJob(TaskSyncVO taskSyncVO) {
+        log.info("杀死任务已经到业务系统, 任务id: {}, 任务参数：{}",taskSyncVO.getTaskId(), taskSyncVO.getTaskParamVO());
+        taskSyncVO.getTaskParamVO().forEach(item->{
+            log.info("杀死任务已经到业务系统, 任务id: {}, 任务参数明细：{},{}",taskSyncVO.getTaskId(), item.getName(), item.getValue());
+        });
+        return ResultBody.success("取消成功");
+    }
+}
+
+```
+
+## 4.任务是否编排
+
+调度编排提供了接口查询业务侧的任务是否在调度侧进行编排，返回值中 TaskResult 的 isScheduled 为 true 时为被调度编排、为 false 时没有被调度编排。
+
+```java
+import com.meritdata.cloud.config.CloudFeignConfiguration;
+import com.meritdata.cloud.resultmodel.ResultBody;
+import com.meritdata.cloud.vo.TaskResult;
+import com.meritdata.cloud.vo.TaskStatusVO;
+import org.springframework.cloud.openfeign.FeignClient;
+import org.springframework.http.MediaType;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestBody;
+
+import java.util.List;
+
+/**
+ * 调度编排的FeignClient
+ */
+@FeignClient(value ="cloud-system-schedule", configuration = CloudFeignConfiguration.class)
+public interface IScheduleClient {
+
+    /**
+     * 获取业务系统的任务是否在被编排
+     * @param taskStatusVO
+     * @return
+     */
+    @PostMapping(value = "/taier/schedule/sync/job-schedule-status", consumes = MediaType.APPLICATION_JSON_UTF8_VALUE)
+    ResultBody<List<TaskResult>> getScheduleStatus(@RequestBody TaskStatusVO taskStatusVO);
+}
+```
+
+## 5.通过人员姓名查询userId 和 empId
+
+接口地址：http://ip:8080/gateway/cloud-system-manage/api/ou/user/get-by-empname
+
+| 参数名称 | 类型   | 值         | 说明           |
+| -------- | ------ | ---------- | -------------- |
+| name     | String | 例如：张三 | 查询人员的姓名 |
+
+返回值：
+
+List\<User>
+
+返回值中id 对应 userId ,userId  对应 empId   
+

package/skills/meritdata-dev-docs-file-finder/references/dev-docs/.bak//345/272/224/347/224/250/345/274/200/345/217/221/345/271/263/345/217/260-/345/237/272/347/241/200/345/271/263/345/217/260-/344/275/277/347/224/250/346/224/273/347/225/245/357/274/210/345/215/201/344/272/214/357/274/211/357/274/232VUE/345/211/215/347/253/257/345/205/254/345/205/261/345/274/271/346/241/206/347/273/204/344/273/266/344/275/277/347/224/250.md

@@ -0,0 +1,136 @@
+---
+title: 应用开发平台使用攻略（十二）：VUE前端公共弹框组件使用
+date: 2023.03.30
+categories:
+  - 开发攻略
+  - C.6.9.0
+---
+
+#                        应用开发平台使用攻略（十二）：VUE前端公共弹框组件使用
+
+## 1. 基础组件
+
+### 1.1 引入
+
+前端工程引入cloud-module-base 基础插件包
+
+ 执行npm install [cloud-module-base@6.9.0](mailto:cloud-module-base@6.9.0)(这里版本号对应使用项目引用应用开发平台版本)
+
+引入公共组件：
+
+在业务模块的main.js中添加以下代码：
+
+import ModulBase from 'cloud-module-base';
+
+Vue.use(ModulBase);
+
+### 1.2 人员选择对话框
+
+引入示例：
+
+人员选择对话框一
+
+![image-20220614160509351](.\imgs\弹框组件\image-20220614160509351.png)
+
+ 
+
+```vue
+ <user-select 
+         :dialogVisible="dialogVisible" 
+         :options="options" 
+         @dialog-close="dialogClose"
+         @dialog-save="dialogSave">
+</user-select>
+```
+
+| 参数          | 说明                                                         |
+| ------------- | ------------------------------------------------------------ |
+| dialogVisible | 控制人员选择对话框是否展示                                   |
+| options       | 传入的参数，示例如下：   options: {      title: '自定义title名称',       id: '1', *//**部门树根节点*selectedUsers: [] *//**已选择的人员的id或则编码的集合*  }, |
+| dialog-close  | 人员选择对话框关闭的事件                                     |
+| dialog-save   | 人员选择对话框保存事件，传入的参数是选择的角色的对象   dialogSave(selectedUser) {     this.selectedUser= selectedUser;    } |
+
+人员选择对话框二
+
+![image-20220614160711499](.\imgs\弹框组件\image-20220614160711499.png)
+
+```vue
+ <user-select-multi
+      :dialogVisible="editDialogVisible"
+     :options="options"
+     @dialog-close="editDialogClose"
+      @dialog-save="editDialogSave"
+ \></user-select-multi>
+```
+
+| 参数          | 说明                                                         |
+| ------------- | ------------------------------------------------------------ |
+| dialogVisible | 控制人员选择对话框是否展示                                   |
+| options       | 传入的参数，示例如下：   options: {      title: '自定义title名称', selectedUsers: [], //已选择的人员的id或则编码的集合,userIds: [], // userIds 需要过滤的已选人员列表,secertFlag: false, //密级开关,radioFlag: false // 单选，多选标签}, |
+| dialog-close  | 人员选择对话框关闭的事件                                     |
+| dialog-save   | 人员选择对话框保存事件，传入的参数是选择的角色的对象   dialogSave(selectedUser) {     this.selectedUser= selectedUser;    } |
+
+### 1.3 角色选择对话框
+
+角色选择对话框标签引入示例： 
+
+```vue
+ <role-select :dialogVisible="roleSelectionDialog" :options="options" @dialog-close="roleDialogClose" @dialog-save="roleSelection"></role-select>
+```
+
+ 
+
+| 参数          | 说明                                                         |
+| ------------- | ------------------------------------------------------------ |
+| dialogVisible | 控制角色选择对话框是否展示                                   |
+| options       | 传入的参数，示例如下：   options: {      title: '自定义title名称',       treeUrl:’使用默认接口地址时，不要写为空字符串会报错’,      checkedIds: []//默认选中的角色id     }, |
+| dialog-close  | 角色选择对话框关闭的事件                                     |
+| dialog-save   | 角色选择对话框保存事件，传入的参数是选择的角色的对象   dialogSave(selectedRole) {     this.selectedRole = selectedRole;    } |
+
+### 1.4 部门选择对话框
+
+部门选择对话框标签引入示例：  
+
+```vue
+<dept-select :dialogVisible="deptSelectionDialog" :options="options" @dialog-close="deptDialogClose" @dialog-save="deptSelection"></dept-select>
+```
+
+ 
+
+| 参数          | 说明                                                         |
+| ------------- | ------------------------------------------------------------ |
+| dialogVisible | 控制部门选择对话框是否展示                                   |
+| options       | 传入的参数，示例如下：   options: {      title: '自定义title名称',       treeUrl:’使用默认接口地址时，不要写为空字符串会报错’,      checkedIds: []//默认选中的部门id     }, |
+| dialog-close  | 部门选择对话框关闭的事件                                     |
+| dialog-save   | 部门选择对话框保存事件，传入的参数是选择的部门的对象   dialogSave(selectedDept) {     this.selectedDept= selectedDept;    } |
+|               |                                                              |
+
+### 1.5 资源权限组件
+
+页面权限组件维护：资源维护->组件 (需要在菜单下维护)
+
+![img](.\imgs\弹框组件\clip_image002.jpg)
+
+创建后在资源授权页面对组件进行授权。
+
+页面开发使用：    
+
+```vue
+<resource-code-auth url="/system-manage/ou/org.html" resourceCode="testCode">resource-code-auth</resource-code-auth>
+```
+
+ url:菜单实际访问地址，对应资源维护菜单的实际访问地址属性
+
+resourceCode:对应资源维护中维护的资源编码属性字段 
+
+### 1.6 三员管理标签
+
+```vue
+<three-member-auth roleCode="XTGLY">页面内容</three-member-auth>
+```
+
+roleCode="XTGLY"
+
+roleCode="AQGLY"
+
+roleCode="AQSJY"

package/skills/meritdata-dev-docs-file-finder/references/dev-docs/.bak//345/272/224/347/224/250/345/274/200/345/217/221/345/271/263/345/217/260-/345/237/272/347/241/200/345/271/263/345/217/260-/344/275/277/347/224/250/346/224/273/347/225/245/357/274/210/345/215/201/345/233/233/357/274/211/357/274/232/346/225/260/346/215/256/346/272/220/346/250/241/345/235/227/346/211/251/345/261/225.md

@@ -0,0 +1,197 @@
+```xml
+title: 应用开发平台使用攻略（十四）：数据源模块扩展指导说明
+date: 2023.03.30
+categories:
+  - 开发攻略
+  - C6.9.0
+```
+
+#                                   数据源模块扩展二开指导说明
+
+背景说明：此文档适用于应用开发平台C.6.6.0以上版本及后续分支。
+
+开发步骤：
+
+## 1.数据源XML配置
+
+apps\system\server\manage\WEB-INF\classes\datasource目录下的datasourceConfig.xml新增数据源种类
+
+```xml
+<datasource name="Test" type="test"
+   genre="RDB" category=”jdbc” defaultConfigPage=”true” >
+	  <image>mysql.svg</image> // 大图片
+    <version>5.5</version>  // 数据库版本
+	<url><![CDATA[jdbc:mysql://<host>:<port>/<sid>?characterEncoding=UTF-8&useSSL=false&serverTimezone=UTC]]</url>
+ </datasource>
+```
+
+可变更的字段
+
+| 字段  | 含义       |
+| ----- | ---------- |
+| name  | 名称       |
+| type  | 数据源类型 |
+| genre | 数据库分类 |
+| image | 数据库图标 |
+| Url   | Jdbc模板   |
+
+附：数据库分类(genre)枚举值
+
+| 数据库分类 | 类型值       |
+| ---------- | ------------ |
+| RDB        | 关系型数据   |
+| MPP        | MPP数据      |
+| API        | 接口数据     |
+| BDQE       | 大数据引擎   |
+| MMDB       | 内存数据     |
+| TS         | 时序数据库   |
+| NOSQL      | Nosql        |
+| MQ         | 消息队列     |
+| FS         | 半结构化存储 |
+
+## 2.数据源图片替换
+
+将设计完后的数据源svg图标放到apps\system\page\manage\img目录下即可，名称对应configdatasource.xml中的image标签
+
+## 3.Nacos配置项配置
+
+common-datasource-config.properties 添加配置
+
+```java
+#mysql配置(不允许删除和注释，若不支持请修改对应的enable属性为false),适用模块单个只支持最多8个字符，超出的部分不显示
+meritdata.datasource.config.type[x].name=test
+meritdata.datasource.config.type[x].enable=true
+meritdata.datasource.config.type[x].module=AI,BI,DF,数据中台
+meritdata.datasource.config.type[x].purpose=0:业务源,1:数据源
+```
+
+| meritdata.datasource.config.type[0].name    | test                | 支持mysql，对应xml中的type          |
+| ------------------------------------------- | ------------------- | ----------------------------------- |
+| meritdata.datasource.config.type[0].module  | ai,bi               | 支持MySQL，适用模块有ai,bi,数据中台 |
+| meritdata.datasource.config.type[0].purpose | 0:业务源,1:数据源   | mysql默认数据库用途                 |
+| meritdata.datasource.config.type[0].delApp  | cloud-system-manage | 删除校验服务                        |
+| meritdata.datasource.config.type[0].enable  | true                | 数据源是否生效                      |
+
+附：数组下标，需看下配置文件中的最大值,下标为最大值+1;
+
+以上配置设置完成后，重新启动系统管理（manage）可在页面上看到对应的数据源信息，
+
+在配置完成后点击测试连接会提示：**数据源未适配**。
+
+## 4.数据源链接适配
+
+- 新建工程
+
+  GroupId:com.meritdata.cloud
+
+  Artifactld:cloud-datasource-test
+
+- pom.xml引入cloud-starter-datasource包
+
+  ```
+  <dependency>
+      <groupId>com.meritdata.cloud</groupId>
+      <artifactId>cloud-starter-datasource</artifactId>
+      <version>C.6.9.0</version>
+  </dependency>
+  ```
+
+- 新建数据源测试类
+
+  ```
+  package com.meritdata.cloud;
+  import cn.hutool.core.util.StrUtil;
+  import com.alibaba.fastjson.JSON;
+  import com.alibaba.fastjson.TypeReference;
+  import com.meritdata.cloud.base.entity.DataSourceModel;
+  import org.slf4j.Logger;
+  import org.slf4j.LoggerFactory;
+  import org.springframework.stereotype.Component;
+  import java.sql.*;
+  import java.util.HashMap;
+  import java.util.Map;
+  import java.util.Properties;
+  
+  //对于datasourceConfig.xml中的数据源类型
+  @Component("test")
+  public class RDBTestJdbc implements ICloudJDdbcManage {
+  
+      private static final Logger LOGGER = LoggerFactory.getLogger(RDBTestJdbc.class);
+  
+      //测试连接方法
+      @Override
+      public Map<String, String> testConnect(DataSourceModel properties) throws Exception {
+          String userName = properties.getUserName();
+          String passWord = properties.getPassword();
+          String url = properties.getUrl();
+          HashMap<String,String> result= new HashMap<>();
+          Connection conn = null;
+          Properties prop =  new Properties();
+          prop.put("user",userName);
+          prop.put("password",passWord);
+          // 设置入参
+          String otherParams = properties.getOtherParams();
+          if (StrUtil.isNotBlank(otherParams)){
+              HashMap<String,String>  map = setProper(otherParams);
+              prop.putAll(map);
+          }
+          try {
+              getDriverClass();
+              DriverManager.setLoginTimeout(5);
+              conn = DriverManager.getConnection(url, prop);
+              String checkSql = getValidationQuery();
+              PreparedStatement preparedStatement = conn.prepareStatement(checkSql);
+              preparedStatement.execute();
+  
+          } catch (SQLException e) {
+              e.printStackTrace();
+              LOGGER.error(properties.getName()+"测试test连接错误:" + e.getMessage());
+              LOGGER.error(properties.getName()+"测试test连接错误：", e);
+              result.put("res", "false");
+              result.put("message", e.getMessage());
+              return result;
+          } finally {
+              if (conn != null) {
+                  try {
+                      conn.close();
+                  } catch (SQLException s) {
+                      s.printStackTrace();
+                  }
+  
+              }
+          }
+          result.put("res","true");
+          return result;
+      }
+  
+      //忽略可不管
+      public  HashMap<String,String>  setProper(String otherParams){
+          HashMap<String,String>  map = JSON.parseObject(otherParams, new TypeReference<HashMap<String,String>>(){});
+          return map;
+      }
+      //加载驱动类
+      public  void getDriverClass() throws ClassNotFoundException, IllegalAccessException, InstantiationException{
+          Class<Driver> driverClass = (Class<Driver>) Class.forName("com.mysql.cj.jdbc.Driver");
+          Driver instance = driverClass.newInstance();
+      };
+  
+      //数据源校验sql
+      public String getValidationQuery() {
+          return "SELECT 1";
+      }
+  }
+  ```
+
+- 部署工程
+
+  执行 mvn install 命令 生成 cloud-datasource-test-1.0-SNAPSHOT.jar
+
+  将cloud-datasource-test-1.0-SNAPSHOT.jar和**对应的数据源驱动包**放入：
+
+  apps\system\server\manage\WEB-INF\lib下
+
+  重新启动系统管理（manage）即可生效。
+
+  
+
+  

package/skills/meritdata-dev-docs-file-finder/references/dev-docs/.bak//345/272/224/347/224/250/345/274/200/345/217/221/345/271/263/345/217/260-/345/237/272/347/241/200/345/271/263/345/217/260-/344/275/277/347/224/250/346/224/273/347/225/245/357/274/210/345/215/201/357/274/211/357/274/232/345/233/275/351/231/205/345/214/226/351/233/206/346/210/220.md

@@ -0,0 +1,116 @@
+---
+title: 应用开发平台使用攻略（十）：国际化集成
+date: 2023.03.30
+categories:
+  - 开发攻略
+  - C.6.9.0
+---
+
+# 应用开发平台使用攻略（十）：国际化集成
+
+## 1.前端 Vue 工程
+
+前端 vue 工程集成 vue-i18n 插件，提供统一的前端国际化机制,
+`cloud-module-base`插件中提供系统基础的国际化文件(需要提前执行 `npm install cloud-module-base`安装插件)，各个功能模块之间引入即可。国际化示例文件如下：
+<img src="/imgs/国际化集成/1-1.png" />
+
+在应用模块中新增 `i18n` 目录，在该目录下新增 `langs` 目录维护国际化属性文件，示例文件格式如下:
+
+```js
+import en_Locale from 'element-ui/lib/locale/lang/en';
+import en_USLocale from 'cloud-module-base/packages/i18n/langs/en_US';
+const en = {
+  online: {
+    title: 'online number'
+  },
+  ...en_Locale,
+  ...en_USLocale
+};
+export default en;
+```
+
+在 `langs` 目录下新增 `index.js`。对维护的属性文件进行封装导出, `Index.js` 内容如下：
+
+```js
+import en_US from '/en_US';
+import zh_CN from '/zh_CN';
+export default {
+  zh: zh_CN,
+  en: en_US
+};
+```
+
+在 `i18n` 目录下新建 `i18n.js` 文件。对 `vue-i18n` 进行集成封装。内容如下：
+
+```js
+import Vue from 'vue';
+import locale from 'element-ui/lib/locale'; //elementUI 的国际化
+import VueI18n from 'vue-i18n';
+import messages from '/langs';
+Vue.use(VueI18n);
+
+const i18n = new VueI18n({
+  //从 localStorage 中取，没有就默认的中文
+  locale: window.localStorage.getItem('qinLang') || 'zh',
+  messages
+});
+locale.i18n((key, value) => i18n.t(key, value)); //elementui 多语言切换
+
+export default i18n;
+```
+
+在应用的 `main.js` 中引入国际化`i18n.js`。示例如下：
+<img src="/imgs/国际化集成/1-2.png" />
+
+### 1.1国际化语法
+
+| 展现形式 | 语法                  | 示例                                                                                                              |
+| -------- | --------------------- | ----------------------------------------------------------------------------------------------------------------- |
+| 直接输出 | `{{$t(“key”)}}`       | `$t('base.button.enable')`                                                                                        |
+| 属性绑定 | `:label=”\$t(‘key’)”` | `:placeholder="\$t('comm.please_enter')"`                                                                         |
+| js 脚本  | `this.$t(“key”)`      | `this.$t('base.operation.success')` <br> 传参形式 `this.$t('key',{param})`<br>key 的格式为：`key:’{param} value’` |
+
+## 2.后端国际化集成
+
+国际化控制通过 header 头中的`qinLang`进行控制，默认为中文显示。
+
+```java
+request.getHeader("qinLang").equals("zh")?Locale.SIMPLIFIED_CHINESE:Locale.US;
+```
+
+### 2.1 配置项维护
+
+涉及的配置项在应用的 `bootstrap.properties` 中：
+|参数| 示例| 说明|
+|--|--|--|
+|spring.messages.basename| i18n.system| 国际化属性文件，多个文件用“,”隔开。因所有国际化文件维护在 i18n 目录下，所以需要添加前缀 i18n |
+|spring.messages.encoding |UTF-8|编码格式|
+
+### 2.2 国际化属性文件维护
+
+在应用或依赖包的 `resources` 目录下新建 `i18n` 目录，在该目录下维护配置文件。
+New->resource Bundle,生成后示例如下：
+<img src="/imgs/国际化集成/1-3.png" />
+
+### 2.3 国际化使用方式：
+
+#### 2.3.1 freemarker 模板页面使用：
+
+```html
+<@spring.message "system_title"/>
+```
+
+#### 2.3.2 java 内使用
+
+```java
+//注入 MessageSource 对象
+@Autowired
+private MessageSource messageSource;
+
+//语法： 1.无参数格式：
+messageSource.getMessage("system_name",null, RequestContextUtils.getLocale(request))
+
+//2.传参格式：属性文件示例：param=你好：{0},传入的参数是：{1}
+messageSource.getMessage("param",newObject[]
+{"测试","测试"},RequestContextUtils.getLocale(request))
+```