Merge pull request #372 from zhu-mingye/dev

[Optimization-371][metadata-hive,docs] Optimization doc & metadata-hive pom

dlink-metadata/dlink-metadata-hive/pom.xml

@@ -55,7 +55,16 @@
 <!--            <artifactId>libfb303</artifactId>-->
 <!--            <version>0.9.3</version>-->
 <!--        </dependency>-->
-
+        <dependency>
+            <groupId>org.apache.httpcomponents</groupId>
+            <artifactId>httpclient</artifactId>
+            <scope>${scope.runtime}</scope>
+        </dependency>
+        <dependency>
+            <groupId>org.apache.httpcomponents</groupId>
+            <artifactId>httpcore</artifactId>
+            <scope>${scope.runtime}</scope>
+        </dependency>
         <dependency>
             <groupId>org.slf4j</groupId>
             <artifactId>slf4j-nop</artifactId>

dlink-web/src/pages/AlertInstance/components/EmailForm.tsx

@@ -17,7 +17,7 @@ const formLayout = {
   wrapperCol: {span: 13},
 };
 
-const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
+const EmailForm: React.FC<AlertInstanceFormProps> = (props) => {
 
   const [form] = Form.useForm();
   const [formVals, setFormVals] = useState<Partial<AlertInstanceTableListItem>>({
@@ -212,4 +212,4 @@ const FeiShuForm: React.FC<AlertInstanceFormProps> = (props) => {
   );
 };
 
-export default FeiShuForm;
+export default EmailForm;

docs/zh-CN/_sidebar.md

@@ -59,6 +59,7 @@
     - [扩展Flink版本](/zh-CN/extend/flinkversion.md)
     - [扩展连接器](/zh-CN/extend/connector.md)
     - [扩展数据源](/zh-CN/extend/datasource.md)
+    - [扩展报警插件](/zh-CN/extend/alert.md)
     - [FlinkSQL 编辑器自动补全函数](/zh-CN/extend/completion.md)
   - 实践指南
     - [Yarn提交实践指南](/zh-CN/practice/yarnsubmit.md)

docs/zh-CN/deploy/build.md

@@ -11,7 +11,7 @@
 
 ## NodeJS 安装部署
 
-### Windows版本
+### Windows 版本
 
 [下载地址]( <https://registry.npmmirror.com/-/binary/node/v14.19.0/node-v14.19.0-x64.msi>)
 
@@ -44,11 +44,11 @@ source /etc/profile #刷新环境变量
 npm install -g npm@7.19.0
 ```
 
-## MySQL部署
+## MySQL 部署
 
 MySQL版本选择5.6+
 
-### Windows版本
+### Windows 版本
 
 [下载地址](<https://dev.mysql.com/downloads/file/?id=510038>)
 
@@ -124,7 +124,7 @@ SHOW VARIABLES LIKE 'collation_%'; 排序规则
 
 ## Maven 安装部署
 
-### Windows版本
+### Windows 版本
 
 [下载地址](<https://dlcdn.apache.org/maven/maven-3/3.6.3/binaries/apache-maven-3.6.3-bin.zip>)
 
@@ -161,9 +161,9 @@ source /etc/profile
 
 以上环境准备就绪后，接下来就可以开始Dinky的编译。
 
-## Dinky编译
+## Dinky 编译
 
-### Windows编译
+### Windows 编译
 
 #### 直接编译
 
@@ -173,9 +173,9 @@ source /etc/profile
 mvn clean install -Dmaven.test.skip=true
 ```
 
-切换到Dinky根目录下得build文件夹下，即可出现编译后的安装包
+切换到 Dinky 根目录下得 build 文件夹下，即可出现编译后的安装包
 
-#### IDEA编译
+#### IDEA 编译
 
 ```
 创建 远程克隆项目 
@@ -183,9 +183,9 @@ maven ->> dlink->> 生命周期->> 跳过测试 ->> 双击install
 打包完成后 安装包见项目根下  build 文件夹下
 ```
 
-说明：如果要对dinky做二次开发，请参考[开发调试](/zh-CN/developer-guide/debug.md)
+说明：如果要对 Dinky 做二次开发，请参考[开发调试](/zh-CN/developer-guide/debug.md)
 
-### Linux编译
+### Linux 编译
 
 ```
 yum -y install git
@@ -194,9 +194,9 @@ cd dlink
 mvn clean install -Dmaven.test.skip=true
 ```
 
-切换到Dinky根目录下得build文件夹下，即可出现编译后的安装包。
+切换到 Dinky 根目录下得 build 文件夹下，即可出现编译后的安装包。
 
-以上就是Dinky源码编译的详细步骤，Dinky如何安装部署，请查看下一章节[Dinky部署](/zh-CN/quick_start/deploy.md)
+以上就是 Dinky 源码编译的详细步骤，Dinky 如何安装部署，请查看下一章节[Dinky部署](/zh-CN/quick_start/deploy.md)
 
 
 

docs/zh-CN/deploy/deploy.md

@@ -5,8 +5,8 @@
 Dinky 不依赖任何外部的 Hadoop 或者 Flink 环境，可以单独部署在 flink、 hadoop 和 K8S 集群之外，完全解耦，支持同时连接多个不同的集群实例进行运维。
 
 ```
-tar -zxvf dlink-release-0.6.1.tar.gz
-mv dlink-release-0.6.1 dlink
+tar -zxvf dlink-release-{version}.tar.gz
+mv dlink-release-{version} dlink
 cd dlink
 ```
 

docs/zh-CN/developer_guide/remote_debug.md

@@ -6,13 +6,13 @@
 - Flink on yarn
 - Flink on K8S
 
-需要说明的是远程调试不需要在服务器部署相应的Dinky安装包，在对应的IDE启动Dlink类，即可完成对作业的远程执行和Debug。到目前为止，远程调试已经打通yarn session模式，也希望有感兴趣的小伙伴贡献其他几种模式的远程调试模式。
+需要说明的是远程调试不需要在服务器部署相应的 Dinky 安装包，在对应的 IDE 启动 `dlink-admin/src/main/java/com/dlink/Dlink.java` 类，即可完成对作业的远程执行和Debug。到目前为止，远程调试已经打通yarn session模式，也希望有感兴趣的小伙伴贡献其他几种模式的远程调试模式。
 
-**前提条件：** 在进行远程调试过程中，必须要进行一次编译，这样做的原因是为了生成Dinky各个模块或者各个包的jar包文件，为远程提交到集群做准备。此方式类似与在服务器部署Dinky后，Dinky启动需要各个Dinky的包或者模块对应的jar包文件，方可正常启动。
+**前提条件：** 在进行远程调试过程中，必须要进行一次 `install`，这样做的原因是为了生成 Dinky 各个模块或者各个包的jar包文件，为远程提交到集群做准备。此方式类似与在服务器部署 Dinky 后，Dinky 启动需要各个 Dinky 的包或者模块对应的 jar 包文件，方可正常启动。
 
-对于开发者来说，如何在IDEA中对作业进行远程调试及提交。下面以yarn session模式为例。
+对于开发者来说，如何在 IDEA 中对作业进行远程调试及提交。下面以 Yarn Session 模式为例。
 
-**说明:** 环境准备及源码导入IDEA，请参考本地调试
+**说明:** 环境准备及源码导入 IDEA，请参考本地调试
 
 ## 编译
 
@@ -24,23 +24,22 @@ mvn clean package -Dmaven.test.skip=true
 
 ### 图形化编译
 
-![install](http://www.aiwenmo.com/dinky/dev/docs/install.png)
+![install](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/local_package_install.jpg)
+图形化编译，需要跳过 test ，并进行 clean ==> install。
 
-图形化编译，需要跳过test，并进行clean ==> install。
-
-**注意：**如果不执行install 生成的 jar安装不到本地 别的依赖就识别不到本地仓库这些包  所以可能导依赖的时候会报错 CustomTableEnvironmentImpl 这个类未定义 。
+**注意：**如果不执行 install 生成的 jar安装不到本地 别的依赖就识别不到本地仓库这些包  所以可能导依赖的时候会报错 CustomTableEnvironmentImpl 这个类未定义 。
 
 **说明:** 
 
-​     1.如果不想单独编译前端，在dlink-web模块的pom下有<span style="color:fuchsia">frontend-maven-plugins</span>插件，可直接前后端编译；
+​     1.如果不想单独编译前端，在 dlink-web 模块的 pom 下有``frontend-maven-plugins``，可直接前后端编译；
 
-​     2.如果要分开编译，在后端编译完成后，需要在dlink-web下执行<span style="color:fuchsia"> npm i --force </span> ;  
+​     2.如果要分开编译，在后端编译完成后，需要在 dlink-web 下执行 ``npm i --force ``;  
 
 ## 远程调试环境搭建
 
 ### 修改pom文件
 
-需要修改 dlink根目录下的pom文件，将 provied  改为 complie，修改如下：
+需要修改 dlink 根目录下的 pom 文件，将 provied  改为 complie，修改如下：
 
 ```
 <properties>
@@ -55,7 +54,7 @@ mvn clean package -Dmaven.test.skip=true
 
 ### 修改配置文件
 
-修改dlink根目录下/dlink-admin/src/main/resources/application.ym文件
+修改 dlink 根目录下 /dlink-admin/src/main/resources/application.ym文件
 
 配置数据库连接信息：
 
@@ -109,32 +108,35 @@ sa-token:
 
 ### 初始化数据库
 
-在MySQL数据库创建 dlink 用户并在 dlink 数据库中执行 dlink-doc/sql/dlink.sql 文件。此外 dlink-doc/sql/dlink_history.sql 标识了各版本的升级 sql。
+在 MySQL 数据库创建 dlink 用户并在 dlink 数据库中执行 dlink-doc/sql/dlink.sql 文件。此外 dlink-doc/sql/dlink_history.sql 标识了各版本的升级 sql。
 
-以上文件修改完成后，就可以启动Dinky。
+以上文件修改完成后，就可以启动 Dinky。
 
 ### 集群配置文件
 
-- **hadoop配置文件: ** core-site.xml   hdfs-site.xml   yarn-site.xml  hive-site.xml;
+- **hadoop配置文件:** core-site.xml   hdfs-site.xml   yarn-site.xml  hive-site.xml;
 - **Flink配置文件：** flink-conf.yaml；
 
-**注意:** hive-site.xml需要使用到hivecatalog时添加;
+**注意:** hive-site.xml 需要使用到 Hive Catalog 时添加;
 
 ### 添加plugins 插件依赖
 
-根据job的场景自行选择插件依赖jar,  注意需要将该目录添加为项目库,如下所示：
+根据 job 的场景自行选择插件依赖 jar, 选择需要的 jars , 注意需要将该目录添加为全局库,如下所示：
+
+![lib](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/jars_add_to_repo.jpg)
 
-![lib](http://www.aiwenmo.com/dinky/dev/docs/lib.png)
+![choose_addrepo_global](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/choose_addrepo_global.jpg)
 
 
 
-### 启动yarn session集群
+
+### 启动 Yarn Session 集群
 
 ```
 yarn-session.sh -n 2 -jm 1024 -tm 4096 -s 6 -d
 ```
 
-### 启动Dinky服务
+### 启动 Dinky 服务
 
 启动 dlink-admin 下的 Dlink 启动类，可见 8888 端口。
 
@@ -142,7 +144,7 @@ yarn-session.sh -n 2 -jm 1024 -tm 4096 -s 6 -d
 
 输入 admin/admin 登录。
 
-**说明：** 在dinky 0.6版本后，不需要额外启动前端，启动后端后便可访问 127.0.0.1:8888
+**说明：** 在 Dinky-0.6 版本后，不需要额外启动前端，启动后端后便可访问 `127.0.0.1:8888`
 
 
 
@@ -269,31 +271,31 @@ insert into sink_order_mysql_goods_order_pay select * from source_order_my
 
 ### 作业提交检查
 
-**SQL逻辑语法校验**
+**SQL 逻辑语法校验**
 
-![](http://www.aiwenmo.com/dinky/dev/docs/SQL%E8%AF%AD%E6%B3%95%E6%A3%80%E6%9F%A5.png)
+![check_sql](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/check_sql.jpg)
 
 **获取JobPlan**
 
-![](http://www.aiwenmo.com/dinky/dev/docs/JobPlan.png)
-
-**Flink Web UI查看作业**
+![check_sql](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/job_plan.jpg)
 
-![flinkwebui](http://www.aiwenmo.com/dinky/dev/docs/flinkwebui.png)
+**Flink Web UI 查看作业**
 
-**查看是否同步到hive**
+![job_flinkwebui](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/job_flinkwebui.png)
 
-![hive](http://www.aiwenmo.com/dinky/dev/docs/hive.png)
+**查看是否同步到 Hive**
 
-**运维中心查看JOB 提交状态**
+![is_sync_hive_table](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/is_sync_hive_table.png)
 
-![运维中心](http://www.aiwenmo.com/dinky/dev/docs/%E8%BF%90%E7%BB%B4%E4%B8%AD%E5%BF%83.png)
+**运维中心查看 JOB 提交状态**
 
+![job_davops_center](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/job_davops_center.png)
 
+**运维中心查看 JOB 详情**
+![job_davops_center](http://www.aiwenmo.com/dinky/docs/zh-CN/developer-guide/remote_debug/devops_job_detail.png)
 
-**注意事项:** 如果拉去了新代码，远程调试环境一定要检查一遍，以防各种报错。
 
-​    
+**注意事项:** 如果拉取了新代码，远程调试环境一定要检查一遍，以防各种报错。
 
 
 

docs/zh-CN/extend/alert.md

+Dinky 告警机制 遵循 SPI,可随意扩展所需要的告警机制。如需扩展可在 dlink-alert 模块中进行可插拔式扩展。现已经支持的告警机制包括如下：
+
+- DingDingTalk
+- 企业微信: 同时支持**APP** 和 **WeChat 群聊** 方式
+- Email
+- 飞书
+
+Dinky 学习了 ``Apache Dolphinscheduler`` 的插件扩展机制，可以在 Dinky 中添加自定义的告警机制。
+
+## 准备工作
+- 本地开发环境搭建
+    - 参考 [开发者本地调试手册](/zh-CN/developer_guide/local_debug.md)
+
+## 后端开发
+- 在 dlink-alert 新建子模块 , 命名规则为 `dlink-alert-{报警类型}` 在子模块中实现 `dlink-alert-{报警类型}` 的报警机制
+
+## 后端开发
+- 在 **dlink-alert** 模块中， 右键**新建子模块**, 命名规则: **dlink-alert-{报警类型}**
+- **代码层面** 根据告警场景自行实现报警逻辑 
+    - 注意事项:
+        - 不可在父类的基础上修改代码，可以在子类中进行扩展 ,或者重写父类方法
+        - 扩展告警类型需要同时提交**测试用例**
+        - 在每个告警类型的 Constants 常量类中 必须声明 ``static final String TYPE = "Email";`` 否则会报错
+- 需要在此模块的 **resource** 下 新建包 ``META-INF.services`` , 在此包中新建文件 ``com.dlink.alert.Alert`` 内容如下:
+    - ``com.dlink.alert.{报警类型}.{报警类型Alert}`` 参考其他告警类型的此文件
+- 打包相关配置 修改如下:
+    - 在 **dlink-core** 模块的 **pom.xml** 下 , 找到扩展告警相关的依赖 `放在一起方便管理` 并且新增如下内容:
+```xml
+        <dependency>
+            <groupId>com.dlink</groupId>
+            <artifactId>模块名称</artifactId>
+            <scope>${scope.runtime}</scope>
+        </dependency>
+``` 
+- 在 **dlink** 根下 **pom.xml** 中 ,新增如下内容:
+```xml
+        <dependency>
+            <groupId>com.dlink</groupId>
+            <artifactId>模块名称</artifactId>
+            <version>${project.version}</version>
+        </dependency>
+```
+
+- 在 **dlink-assembly** 模块中 , 找到 ``package.xml`` 路径: **/dlink-assembly/src/main/assembly/package.xml** , 新增如下内容:
+```xml
+        <fileSet>
+            <directory>${project.parent.basedir}/dlink-alert/模块名称/target
+            </directory>
+            <outputDirectory>lib</outputDirectory>
+            <includes>
+                <include>模块名称-${project.version}.jar</include>
+            </includes>
+        </fileSet>
+  ```
+
+
+----
+
+## 前端开发
+- **dlink-web** 为 Dinky 的前端模块
+- 扩展告警插件相关表单所在路径: `dlink-web/src/pages/AlertInstance`
+  - 修改 `dlink-web/src/pages/AlertInstance/conf.ts` 的 **ALERT_TYPE** 中 :
+    - **ALERT_TYPE** 添加如下 eg: 
+    - 
+  ```
+  EMAIL:'Email', 
+  ```
+  
+    - **ALERT_CONFIG_LIST** 添加如下 eg: 
+  ```
+   {
+      type: ALERT_TYPE.EMAIL,
+    } 
+  ```
+    - 注意: 此处属性值需要与后端 `static final String TYPE = "Email";`变量值保持一致
+如下图:
+![](http://www.aiwenmo.com/dinky/docs/zh-CN/extend/alert/extend_alert_conf.png)
+
+
+  - 修改 `dlink-web/src/pages/AlertInstance/icon.tsx` 的 **getAlertIcon** 中 添加如下:
+  eg:
+```
+  case ALERT_TYPE.EMAIL:
+      return (<Icon component={EmailSvg}/>);
+```
+同时在下方定义 SVG : `如不定义将使用默认 SVG`
+    - svg 获取: [https://www.iconfont.cn](https://www.iconfont.cn)
+```
+export const DingTalkSvg = () => (
+      {svg 相关代码}
+);
+```
+**注意:** svg 相关代码中需要将 **width**  **height** 统一更换为 **width={svgSize} height={svgSize}**
+
+如下图:
+![](http://www.aiwenmo.com/dinky/docs/zh-CN/extend/alert/extened_alert_icon.png)
+
+
+
+  - 修改 `dlink-web/src/pages/AlertInstance/components/AlertInstanceChooseForm.tsx` 追加如下:
+  eg: 其中需要修改的地方为
+    - 1. `EMAIL` 替换为上述 **dlink-web/src/pages/AlertInstance/conf.ts** 中 **ALERT_TYPE** 的新增类型
+    - 2. `EmailForm` 为新建告警表单文件 **dlink-web/src/pages/AlertInstance/components/EmailForm.tsx** 中的 **EmailForm** .
+```
+      {(values?.type == ALERT_TYPE.EMAIL || alertType == ALERT_TYPE.EMAIL)?
+        <EmailForm
+          onCancel={() => {
+            setAlertType(undefined);
+            handleChooseModalVisible();
+          }}
+          modalVisible={values?.type == ALERT_TYPE.EMAIL || alertType == ALERT_TYPE.EMAIL}
+          values={values}
+          onSubmit={(value) => {
+            onSubmit(value);
+          }}
+          onTest={(value) => {
+            onTest(value);
+          }}
+        />:undefined
+      }
+```
+如下图:
+![](http://www.aiwenmo.com/dinky/docs/zh-CN/extend/alert/extened_alert_choose_form.png)
+
+ - 需要新建表单文件 , 命名规则: ``{告警类型}Form``
+   - 该文件中除 **表单属性** 外 , 其余可参照其他类型告警 , 建议复制其他类型告警的表单 , 修改其中的表单属性即可 
+   - 注意: 
+     - 部分表单属性保存为 Json 格式
+     - 需要修改 如下的表单配置
+ ```text
+    找到如下相关代码: 
+    const [formVals, setFormVals] = useState<Partial<AlertInstanceTableListItem>>({
+    id: props.values?.id,
+    name: props.values?.name,
+    type: ALERT_TYPE.EMAIL,  # 此处需要修改为新增的告警类型
+    params: props.values?.params,
+    enabled: props.values?.enabled,
+    });
+
+```
+
+
+----
+
+
+至此 , 基于 Dinky 扩展告警完成 , 如您也有扩展需求 ,请参照 [如何 Issuse](/zh-CN/developer_guide/issue.md)    [如何提交 PR](/zh-CN/developer_guide/pull_request.md)

docs/zh-CN/extend/datasource.md

+ 
  Dinky 数据源遵循 SPI,可随意扩展所需要的数据源。数据源扩展可在 dlink-metadata 模块中进行可插拔式扩展。现已经支持的数据源包括如下：
 
    - MySQL
@@ -7,8 +8,89 @@
    - Phoenix
    - Doris(Starrocks)
    - ClickHouse 
-   - Hive
+   - Hive ``需要的jar包: hive-jdbc-2.1.1.jar && hive-service-2.1.1.jar``
 
 使用以上数据源,请查阅注册中心[数据源管理](/zh-CN/administrator-guide/registerCenter/datasource_manage.md),配置数据源连接
 
-**说明：** Dinky 不在对 Starorcks 进行额外扩展，Doris 和 Starorcks 底层并无差别，原则上只是功能区分。经社区测试验证，可采用 Doris 扩展连接 Starrocks。
\ No newline at end of file
+**说明：** Dinky 不在对 Starorcks 进行额外扩展，Doris 和 Starorcks 底层并无差别，原则上只是功能区分。经社区测试验证，可采用 Doris 扩展连接 Starrocks。
+
+----
+
+## 准备工作
+- 本地开发环境搭建
+  - 参考 [开发者本地调试手册](/zh-CN/developer_guide/local_debug.md)
+
+## 后端开发
+- 在 **dlink-metadata** 模块中， 右键**新建子模块**, 命名规则: **dlink-metadata-{数据源名称}**
+- **代码层面** 参照其他类型数据源扩展，按照相应的模板进行修改 
+  - 注意事项: 
+    - 不可在父类的基础上修改代码，可以在子类中进行扩展 ,或者重写父类方法
+    - 扩展数据源需要同时提交**测试用例**
+- 需要在此模块的 **resource** 下 新建包 ``META-INF.services`` , 在此包中新建文件 ``com.dlink.metadata.driver.Driver`` 内容如下:
+  - ``com.dlink.metadata.driver.数据源类型Driver`` 
+- 在此模块的 **pom.xml** 中，添加所需依赖, 需要注意的是 : 数据源本身的 ``JDBC``的 jar 不要包含在打包中 , 而是后续部署时,添加在 ``plugins`` 下
+- 打包相关配置 修改如下:
+  - 在 **dlink-core** 模块的 **pom.xml** 下 , 找到扩展数据源相关的依赖 `放在一起方便管理` 并且新增如下内容:
+```xml
+        <dependency>
+            <groupId>com.dlink</groupId>
+            <artifactId>模块名称</artifactId>
+            <scope>${scope.runtime}</scope>
+        </dependency>
+``` 
+  - 在 **dlink** 根下 **pom.xml** 中 ,新增如下内容:
+```xml
+        <dependency>
+            <groupId>com.dlink</groupId>
+            <artifactId>模块名称</artifactId>
+            <version>${project.version}</version>
+        </dependency>
+```
+
+  - 在 **dlink-assembly** 模块中 , 找到 ``package.xml`` 路径: **/dlink-assembly/src/main/assembly/package.xml** , 新增如下内容:
+```xml
+        <fileSet>
+            <directory>${project.parent.basedir}/dlink-metadata/模块名称/target
+            </directory>
+            <outputDirectory>lib</outputDirectory>
+            <includes>
+                <include>模块名称-${project.version}.jar</include>
+            </includes>
+        </fileSet>
+  ```
+
+----
+
+## 前端开发
+- **dlink-web** 为 Dinky 的前端模块
+- 扩展数据源相关表单所在路径: `dlink-web/src/pages/DataBase/`
+  - 修改 `dlink-web/src/pages/DataBase/components/DBForm.tsx` 的 **const data** 中 添加如下:
+eg:
+```shell
+         {
+           type: 'Hive', 
+         },
+```
+如下图:
+![](http://www.aiwenmo.com/dinky/docs/zh-CN/extend/datasource/extened_datasource_dbform.jpg)
+
+注意: ``此处数据源类型遵照大驼峰命名规则``
+
+  - 添加数据源logo图片
+    - 路径: `dlink-web/public/database/`
+    - logo图下载参考: [https://www.iconfont.cn](https://www.iconfont.cn) 
+
+  - 修改 `dlink-web/src/pages/DataBase/DB.ts` , 添加如下:
+eg:
+```shell
+    case 'hive':  
+      imageUrl += 'hive.png'; # 需要和添加的图片名称保持一致
+      break;
+```
+如下图:
+![](http://www.aiwenmo.com/dinky/docs/zh-CN/extend/datasource/extened_datasource_datasourceform.jpg)
+   - 创建数据源相关表单属性在: `dlink-web/src/pages/DataBase/components/DataBaseForm.tsx`
+
+----
+至此 , 基于 Dinky 扩展数据源完成 , 如您也有扩展需求 ,请参照 [如何 Issuse](/zh-CN/developer_guide/issue.md)    [如何提交 PR](/zh-CN/developer_guide/pull_request.md)
+