ThingsBoard 功能扩展，二次开发，个性化，一起搞定！
本文所有内容都来自原创，思路开阔，敢想敢做，经过不懈努力，终于成功扩展 ThingsBoard 功能模块
如果你有 ThingsBoard 服务需求或二次开发需求，请与我们联系： 18616669123
先来看一段视频，体验一下新增的功能，前端增加的菜单和功能演示。
关注我们
关注 ThingsBoard 微信公众号
手动增加微信公众号：thingsboard_cn
访问 ThingsBoard 中文社区网站
访问网址：http://www.thingsboard.club
前言
此次二次开发，主要是针对 ThingsBoard 新增功能模块，以报表功能为目的，提供一个可以独立与原有功能的 Report/报表 模块，咱们先这么来定义。就像 Device/设备、Asset/资产模块，增删改查必不可少，还需要兼容 ThingsBoard 原有操作习惯，还可以将 Report/报表 分配给特定的 Customer/客户。上图，这是开始的设想：
后端
代码结构
modified: application/src/main/java/org/thingsboard/server/controller/BaseController.java
new file: application/src/main/java/org/thingsboard/server/controller/ReportController.java
modified: application/src/main/java/org/thingsboard/server/service/security/permission/CustomerUserPermissions.java
modified: application/src/main/java/org/thingsboard/server/service/security/permission/Resource.java
modified: application/src/main/java/org/thingsboard/server/service/security/permission/TenantAdminPermissions.java
modified: application/src/main/resources/thingsboard.yml
new file: common/dao-api/src/main/java/org/thingsboard/server/dao/report/ReportService.java
modified: common/data/src/main/java/org/thingsboard/server/common/data/CacheConstants.java
modified: common/data/src/main/java/org/thingsboard/server/common/data/EntityType.java
new file: common/data/src/main/java/org/thingsboard/server/common/data/Report.java
new file: common/data/src/main/java/org/thingsboard/server/common/data/ReportInfo.java
modified: common/data/src/main/java/org/thingsboard/server/common/data/id/EntityIdFactory.java
new file: common/data/src/main/java/org/thingsboard/server/common/data/id/ReportId.java
modified: common/data/src/main/java/org/thingsboard/server/common/data/query/EntityFilterType.java
new file: common/data/src/main/java/org/thingsboard/server/common/data/query/ReportSearchQueryFilter.java
new file: common/data/src/main/java/org/thingsboard/server/common/data/query/ReportTypeFilter.java
new file: common/data/src/main/java/org/thingsboard/server/common/data/report/ReportSearchQuery.java
new file: dao/src/main/java/org/thingsboard/server/dao/model/sql/AbstractReportEntity.java
new file: dao/src/main/java/org/thingsboard/server/dao/model/sql/ReportEntity.java
new file: dao/src/main/java/org/thingsboard/server/dao/model/sql/ReportInfoEntity.java
new file: dao/src/main/java/org/thingsboard/server/dao/report/ReportDao.java
new file: dao/src/main/java/org/thingsboard/server/dao/report/ReportServiceImpl.java
modified: dao/src/main/java/org/thingsboard/server/dao/sql/query/DefaultEntityQueryRepository.java
modified: dao/src/main/java/org/thingsboard/server/dao/sql/query/EntityKeyMapping.java
new file: dao/src/main/java/org/thingsboard/server/dao/sql/report/JpaReportDao.java
new file: dao/src/main/java/org/thingsboard/server/dao/sql/report/ReportRepository.java
modified: pom.xml根据 git 提供的log，看出来新增文件比修改文件多，也是此次二次开发的难点所在。
- 新增文件：新增的文件主要以扩展功能模块为主，大概是这样：POJO（DTO，ID），Entity，Repository，Dao，Service/Impl，Controller，基本都是依葫芦画瓢；
- 修改文件：因为要达到 ThingsBoard 原有的一些功能体验，势必要满足其实现逻辑，那就是找到所有的 Device 功能模块的做法，在所有需要的地方增加 Report 功能，无非就是一些新增枚举值，方法调用，新增 case 判断；
这个开发过程中，我发现，频繁读取一些 API，且都是需要数据库交互，如果用户数量大，不是一个好方法，这里举一个例子：
-
获取实体类型频繁数据库交互
调用后台 API 为： /api/report/types，追查代码发现其实是一次 SELECT，瞬间尴尬了@Query("SELECT DISTINCT d.type FROM ReportEntity d WHERE d.tenantId = :tenantId") List<String> findTenantReportTypes(@Param("tenantId") UUID tenantId); -
WEB API，大概就是把 device 都替换成了 report，其他逻辑上没有做更改，为了配合前端的调用，这些都是必不可少的内容。因为用 device 衍生过来，把 cridentail 相关内容删除了。
数据表
CREATE TABLE public.report
(
id uuid NOT NULL,
created_time bigint NOT NULL,
additional_info character varying COLLATE pg_catalog."default",
customer_id uuid,
type character varying(255) COLLATE pg_catalog."default",
name character varying(255) COLLATE pg_catalog."default",
label character varying(255) COLLATE pg_catalog."default",
search_text character varying(255) COLLATE pg_catalog."default",
tenant_id uuid,
CONSTRAINT report_pkey PRIMARY KEY (id),
CONSTRAINT report_name_unq_key UNIQUE (tenant_id, name)
)- 如果你观察仔细，发现跟 device 表几乎一样，那是因为我们以 device 为原型做的二次开发。开发自己功能时，表的定义请随意啊。不过，name, type, search_text, id, customer_id, tenant_id, create_time 都是不能少的，因为框架业务逻辑有代码实现一些功能；
- 建议增加几个不影响 ThingsBoard 框架工作的“扩展字段”，也可以直接使用 additional_info 来存储自己的数据，这个字段最长可以有 1G，足够放你需要的结构化或非结构化数据；类似：
{ "hello": "world", "thingsboard": "iot", "company": "yiqisoft", "location": "shanghai", "protocol": ["coap", "mqtt", "http"] } - 自由业务逻辑，针对“扩展字段”的操作，请随意，数据频繁修改的还是用自己的业务表，不要混为一谈。
业务逻辑实现
对于自己的业务逻辑开发方面，建议不要改动 ThingsBoard 的代码结构，可以使用外挂一个 jar，来独立实现业务功能，这个具体要看业务复杂度，是不是需要与 ThingsBoard 耦合，可以查看前期我们发布的文章：如何无缝扩展 ThingsBoard 功能？原来二次开发如此简单！ ， 如何无缝扩展 ThingsBoard 功能？原来二次开发如此简单！【续】
前端
代码结构
modified: ui-ngx/src/app/core/http/entity.service.ts
new file: ui-ngx/src/app/core/http/report.service.ts
modified: ui-ngx/src/app/core/services/menu.service.ts
modified: ui-ngx/src/app/modules/home/components/widget/lib/entities-hierarchy-widget.models.ts
modified: ui-ngx/src/app/modules/home/dialogs/add-entities-to-customer-dialog.component.ts
modified: ui-ngx/src/app/modules/home/dialogs/assign-to-customer-dialog.component.ts
modified: ui-ngx/src/app/modules/home/dialogs/home-dialogs.service.ts
modified: ui-ngx/src/app/modules/home/pages/customer/customer-routing.module.ts
modified: ui-ngx/src/app/modules/home/pages/customer/customer.component.html
modified: ui-ngx/src/app/modules/home/pages/customer/customers-table-config.resolver.ts
modified: ui-ngx/src/app/modules/home/pages/home-pages.module.ts
new file: ui-ngx/src/app/modules/home/pages/report/report-routing.module.ts
new file: ui-ngx/src/app/modules/home/pages/report/report-table-header.component.html
new file: ui-ngx/src/app/modules/home/pages/report/report-table-header.component.scss
new file: ui-ngx/src/app/modules/home/pages/report/report-table-header.component.ts
new file: ui-ngx/src/app/modules/home/pages/report/report-tabs.component.html
new file: ui-ngx/src/app/modules/home/pages/report/report-tabs.component.ts
new file: ui-ngx/src/app/modules/home/pages/report/report.component.html
new file: ui-ngx/src/app/modules/home/pages/report/report.component.scss
new file: ui-ngx/src/app/modules/home/pages/report/report.component.ts
new file: ui-ngx/src/app/modules/home/pages/report/report.module.ts
new file: ui-ngx/src/app/modules/home/pages/report/reports-table-config.resolver.ts
modified: ui-ngx/src/app/shared/components/entity/entity-autocomplete.component.ts
modified: ui-ngx/src/app/shared/components/entity/entity-subtype-autocomplete.component.ts
modified: ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.ts
modified: ui-ngx/src/app/shared/components/entity/entity-subtype-select.component.ts
modified: ui-ngx/src/app/shared/components/footer.component.html
modified: ui-ngx/src/app/shared/models/alias.models.ts
modified: ui-ngx/src/app/shared/models/entity-type.models.ts
new file: ui-ngx/src/app/shared/models/id/report-id.ts
new file: ui-ngx/src/app/shared/models/report.models.ts
modified: ui-ngx/src/assets/locale/locale.constant-en_US.json
modified: ui-ngx/src/assets/locale/locale.constant-zh_CN.json
modified: ui-ngx/src/assets/logo_title_white.svg
modified: ui-ngx/src/environments/environment.prod.ts
modified: ui-ngx/src/environments/environment.ts
modified: ui-ngx/src/index.html
new file: ui-ngx/src/yiqisoft.ico- 先复制一份 ui-ngx/src/app/modules/home/pages/device 到 ui-ngx/src/app/modules/home/pages/report，就是组件要完整，文件名都改掉，内部都是替换操作： Device -> Report, device -> report, DEVICE -> REPORT，这样我们的 ReportModule 就做好了；
- 在 home-pages.module.ts 载入 ReportModule ；
- 在 ui-ngx/src/app/core/services/menu.service.ts 增加需要的菜单；
- 根据 report 目录里面的内容，需要从 device 功能模块复制一些组件和 service，挺多的，自己慢慢找，也算是熟悉一下前端代码；
- 汉化，就是修改 ui-ngx/src/assets/locale/ 目录下相应的语言包，很容易；
功能扩展过程
前期，我们发布了文章，如何进行 ThingsBoard 前端二次开发？超强 Angular 框架帮你忙。，介绍如果用 Angular 二次开发的要点，具体看开发者对于 Angular 框架掌握程度。
功能扩展建议
-
像上面的实体类型获取，增加功能特别不容易，因为代码实现是通过枚举值来 switch/case 来判断，那么新增功能模块时，需要改动太大了，如果能够独立到每个功能模块的组件中，那就方便多了。但是，前端代码就会有很多重复。为了扩展 REPORT，必须要找到所有的 case，上代码：
switch (entity.id.entityType as EntityType | string) { case 'function': materialIcon = 'functions'; break; case EntityType.DEVICE: materialIcon = 'devices_other'; break; case EntityType.REPORT: materialIcon = 'equalizer'; break; case EntityType.ASSET: materialIcon = 'domain'; break; } -
更改 LOGO，需要使用工具做一个 svg 矢量图，替换 ui-ngx/src/assets/logo_title_white.svg 即可；
-
更改 Swagger 显示内容需要改 thingsboard.yml；