47 KiB
47 KiB
福建水务营收系统架构设计文档
文档信息
| 项目信息 | 详情 |
|---|---|
| 项目名称 | 福建水务营收系统 |
| 文档类型 | 概要设计文档 |
| 技术框架 | RuoYi-Vue-Pro + yudao-ui-admin-vue3 |
| 文档版本 | v1.0 |
| 编写日期 | 2024-12-19 |
| 文档状态 | ✅ 基本完成 |
目录
一、系统架构概述
福建水务营收系统采用多层架构设计,旨在支持集团化的集中管理、统一资源管理的业务需求。系统架构的设计目标是实现"一个业务平台、一网通平台"的建设目标,为集团及下属各分公司提供统一的营业收费系统。
系统架构主要包括以下核心特点:
- 多租户架构:支持集团、分公司、营业站点的多层级租户管理模式
- 统一资源服务:统一的数字水务系统运行资源环境
- 统一平台应用:统一业务流程,集中汇集数据
- 统一对外接口:提供标准的接口和能力
1. 系统总体架构图
graph TB
subgraph "用户层"
A1[Web管理端<br/>yudao-ui-admin-vue3]
A2[移动抄表端<br/>uni-app]
A3[客户微信端<br/>微信小程序]
A4[客户支付宝端<br/>支付宝小程序]
end
subgraph "网关层"
B1[Nginx负载均衡]
B2[API网关<br/>统一认证/权限控制]
end
subgraph "应用层"
C1[营收管理<br/>RuoYi-Vue-Pro]
C2[客户服务<br/>RuoYi-Vue-Pro]
C3[表务管理<br/>RuoYi-Vue-Pro]
C4[统计分析<br/>RuoYi-Vue-Pro]
end
subgraph "服务层"
D1[权限服务<br/>Spring Security]
D2[工作流服务<br/>Flowable]
D3[消息服务<br/>Redis MQ]
D4[文件服务<br/>MinIO/OSS]
end
subgraph "数据层"
E1[(OpenGauss 5.0+<br/>主从架构)]
E2[(Redis 6.0<br/>集群缓存)]
E3[文件存储<br/>分布式存储]
end
subgraph "外部接口"
F1[银行接口<br/>代扣/托收]
F2[支付接口<br/>微信/支付宝]
F3[短信接口<br/>阿里云/腾讯云]
F4[物联网接口<br/>智能水表]
end
A1 --> B1
A2 --> B1
A3 --> B1
A4 --> B1
B1 --> B2
B2 --> C1
B2 --> C2
B2 --> C3
B2 --> C4
C1 --> D1
C1 --> D2
C1 --> D3
C1 --> D4
C2 --> D1
C2 --> D3
C3 --> D1
C3 --> D2
C4 --> D1
D1 --> E1
D2 --> E1
D3 --> E2
D4 --> E3
C1 --> F1
C1 --> F2
C2 --> F3
C3 --> F4
2. 物理部署架构图
graph TB
subgraph "DMZ区域"
LB1[负载均衡器<br/>Nginx Cluster]
WAF[Web应用防火墙]
end
subgraph "应用服务区"
subgraph "Web服务集群"
WEB1[Web服务器1<br/>8核32G]
WEB2[Web服务器2<br/>8核32G]
end
subgraph "应用服务集群"
APP1[应用服务器1<br/>16核64G]
APP2[应用服务器2<br/>16核64G]
end
end
subgraph "数据服务区"
subgraph "数据库集群"
DB1[OpenGauss主库<br/>32核128G]
DB2[OpenGauss从库<br/>32核128G]
end
subgraph "缓存集群"
REDIS1[Redis主节点<br/>16核32G]
REDIS2[Redis从节点<br/>16核32G]
REDIS3[Redis哨兵<br/>8核16G]
end
subgraph "文件存储"
FILE1[文件服务器1<br/>8核32G 10TB]
FILE2[文件服务器2<br/>8核32G 10TB]
end
end
subgraph "管理服务区"
MONITOR[监控服务器<br/>8核16G]
BACKUP[备份服务器<br/>8核32G 20TB]
JUMP[跳板服务器<br/>4核8G]
end
Internet --> WAF
WAF --> LB1
LB1 --> WEB1
LB1 --> WEB2
WEB1 --> APP1
WEB1 --> APP2
WEB2 --> APP1
WEB2 --> APP2
APP1 --> DB1
APP2 --> DB1
DB1 --> DB2
APP1 --> REDIS1
APP2 --> REDIS1
REDIS1 --> REDIS2
REDIS3 --> REDIS1
REDIS3 --> REDIS2
APP1 --> FILE1
APP2 --> FILE2
FILE1 --> FILE2
MONITOR --> APP1
MONITOR --> APP2
MONITOR --> DB1
MONITOR --> REDIS1
BACKUP --> DB1
BACKUP --> FILE1
二、技术架构
系统采用B/S和M/S相结合的架构模式,具体技术栈如下:
1. 技术栈总览图
graph TB
subgraph "前端技术栈"
FE1[Vue 3.2+ TypeScript]
FE2[Element Plus UI]
FE3[Vite 构建工具]
FE4[Pinia 状态管理]
FE5[Vue Router 路由]
FE6[Axios HTTP请求]
FE7[ECharts 图表]
FE8[富文本编辑器]
end
subgraph "后端技术栈"
BE1[Spring Boot 3.x]
BE2[Spring Security 6.x]
BE3[MyBatis Plus 3.x]
BE4[Redis 6.0+]
BE5[OpenGauss 5.0+]
BE6[Knife4j API文档]
BE7[Jackson JSON处理]
BE8[Maven 依赖管理]
end
subgraph "中间件技术栈"
MW1[Nginx 负载均衡]
MW2[Redis 缓存集群]
MW3[Flowable 工作流]
MW4[Quartz 定时任务]
MW5[MinIO 文件存储]
MW6[RocketMQ 消息队列]
MW7[ElasticSearch 搜索]
MW8[Sentinel 熔断限流]
end
subgraph "移动端技术栈"
MB1[uni-app 跨平台]
MB2[uView UI组件]
MB3[微信小程序]
MB4[支付宝小程序]
MB5[H5响应式]
MB6[高德地图SDK]
MB7[NFC设备接口]
end
subgraph "监控运维技术栈"
OP1[SkyWalking APM]
OP2[Spring Boot Admin]
OP3[Docker 容器化]
OP4[Kubernetes 编排]
OP5[Jenkins CI/CD]
OP6[Prometheus 监控]
OP7[Grafana 仪表盘]
OP8[ELK 日志分析]
end
FE1 --> BE1
FE6 --> BE1
BE1 --> BE2
BE1 --> BE3
BE3 --> BE5
BE1 --> BE4
BE1 --> MW3
BE1 --> MW4
MW1 --> BE1
BE1 --> MW5
BE1 --> MW6
BE1 --> MW7
MW8 --> BE1
MB1 --> BE1
MB3 --> BE1
MB4 --> BE1
OP1 --> BE1
OP2 --> BE1
OP3 --> BE1
OP4 --> OP3
OP5 --> OP4
OP6 --> BE1
OP7 --> OP6
OP8 --> BE1
2. 系统数据流向图
flowchart TD
subgraph "数据采集层"
A1[移动抄表APP<br/>数据采集]
A2[智能水表<br/>远程数据]
A3[Web管理端<br/>业务录入]
A4[客户端小程序<br/>用户数据]
A5[外部系统<br/>接口数据]
end
subgraph "数据接入层"
B1[API网关<br/>数据验证]
B2[数据清洗<br/>格式转换]
B3[消息队列<br/>异步处理]
B4[数据缓存<br/>临时存储]
end
subgraph "业务处理层"
C1[抄表服务<br/>水量计算]
C2[收费服务<br/>账单生成]
C3[账务服务<br/>财务处理]
C4[工单服务<br/>流程处理]
C5[统计服务<br/>数据分析]
end
subgraph "数据存储层"
D1[(MySQL主库<br/>核心业务数据)]
D2[(MySQL从库<br/>查询数据)]
D3[(Redis缓存<br/>热点数据)]
D4[文件存储<br/>附件图片]
D5[(备份库<br/>历史数据)]
end
subgraph "数据服务层"
E1[查询服务<br/>数据检索]
E2[报表服务<br/>统计分析]
E3[接口服务<br/>对外开放]
E4[推送服务<br/>消息通知]
end
subgraph "数据展现层"
F1[管理后台<br/>业务操作]
F2[统计大屏<br/>可视化展示]
F3[移动端<br/>现场作业]
F4[客户端<br/>自助服务]
F5[第三方系统<br/>数据集成]
end
%% 数据流向关系
A1 --> B1
A2 --> B2
A3 --> B1
A4 --> B1
A5 --> B3
B1 --> B4
B2 --> B3
B3 --> C1
B4 --> C2
C1 --> D1
C2 --> D1
C3 --> D1
C4 --> D1
C5 --> D2
D1 --> D2
D1 --> D3
D1 --> D5
D2 --> E1
D3 --> E1
D1 --> E2
D2 --> E3
E1 --> F1
E2 --> F2
E3 --> F3
E4 --> F4
E3 --> F5
%% 反向数据流
F1 -.-> C2
F3 -.-> C1
F4 -.-> C3
F5 -.-> C4
3. 服务端技术架构
- 操作系统:国产 Linux 操作系统
- 数据库:华为OpenGauss 5.0+数据库,企业级国产数据库
- 应用框架:基于RuoYi-Vue-Pro框架定制开发
- 核心框架:Spring Boot 3.x,支持JDK 17/21
- ORM框架:MyBatis Plus,增强的MyBatis
- 权限框架:Spring Security,基于RBAC的权限管理
- 数据缓存:Redis + Redisson,高性能缓存和分布式锁
- 工作流引擎:Flowable,灵活的工作流处理
- 任务调度:基于Quartz的CRON任务调度
- 服务监控:Spring Boot Admin、SkyWalking APM
- 消息队列:基于Redis的轻量级消息队列
- 文档生成:Knife4j,基于Swagger的API文档生成
- 代码生成:自动化CRUD和表单代码生成器
- 多租户:基于字段隔离的SaaS多租户设计
2.1 RuoYi-Vue-Pro框架配置示例
application.yml主配置文件:
# 服务端口配置
server:
port: 48080
servlet:
context-path: /admin-api
# Spring Boot 配置
spring:
application:
name: water-biz-server
profiles:
active: local
# 数据源配置
datasource:
druid:
url: jdbc:mysql://127.0.0.1:3306/ruoyi-vue-pro?useSSL=false&serverTimezone=Asia/Shanghai&allowPublicKeyRetrieval=true&nullCatalogMeansCurrent=true
username: root
password: ${MYSQL_PASSWORD:123456}
driver-class-name: com.mysql.cj.jdbc.Driver
# 连接池配置
initial-size: 10
min-idle: 10
max-active: 20
max-wait: 60000
time-between-eviction-runs-millis: 60000
min-evictable-idle-time-millis: 300000
validation-query: SELECT 1 FROM DUAL
test-while-idle: true
test-on-borrow: false
test-on-return: false
pool-prepared-statements: true
max-pool-prepared-statement-per-connection-size: 20
# Redis 配置
redis:
host: 127.0.0.1
port: 6379
password: ${REDIS_PASSWORD:}
database: 1
timeout: 6000ms
lettuce:
pool:
max-active: 32
max-wait: 6000ms
max-idle: 32
min-idle: 8
# MyBatis Plus 配置
mybatis-plus:
configuration:
map-underscore-to-camel-case: true
log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
global-config:
db-config:
id-type: NONE
logic-delete-field: deleted
logic-delete-value: 1
logic-not-delete-value: 0
type-aliases-package: cn.iocoder.yudao.module.*.dal.dataobject
# 水务系统多租户配置
yudao:
tenant:
enable: true
ignore-urls:
- /admin-api/water/tenant/get-id-by-name
- /admin-api/infra/file/*/get/**
ignore-tables:
- water_tenant
- water_system_config
- water_dict_data
- water_dict_type
# 水务系统安全配置
security:
permit-all-urls:
- /admin-api/water/auth/login
- /admin-api/water/auth/logout
- /admin-api/water/auth/refresh-token
- /admin-api/water/captcha/get
- /admin-api/water/sms/send
# 文件存储配置
file:
config:
type: local
local:
domain: http://127.0.0.1:48080
path: /Users/yunai/file_test
# 短信配置
sms:
alibaba:
access-key-id: ${SMS_ACCESS_KEY_ID:}
access-key-secret: ${SMS_ACCESS_KEY_SECRET:}
signature: 福建水务
template-code: SMS_123456
多租户配置实现:
@Component
@Slf4j
public class WaterTenantConfiguration {
@Resource
private TenantProperties tenantProperties;
/**
* 多租户字段处理器
*/
@Bean
public TenantLineHandler tenantLineHandler() {
return new TenantLineHandler() {
@Override
public Expression getTenantId() {
// 从当前登录用户上下文获取租户ID
Long tenantId = TenantContextHolder.getTenantId();
if (tenantId == null) {
return null;
}
return new LongValue(tenantId);
}
@Override
public String getTenantIdColumn() {
return "tenant_id";
}
@Override
public boolean ignoreTable(String tableName) {
// 忽略的表不进行多租户处理
return tenantProperties.getIgnoreTables().contains(tableName);
}
};
}
/**
* 多租户拦截器
*/
@Bean
public MybatisPlusInterceptor mybatisPlusInterceptor() {
MybatisPlusInterceptor interceptor = new MybatisPlusInterceptor();
// 多租户插件
TenantLineInnerInterceptor tenantInterceptor = new TenantLineInnerInterceptor();
tenantInterceptor.setTenantLineHandler(tenantLineHandler());
interceptor.addInnerInterceptor(tenantInterceptor);
// 分页插件
interceptor.addInnerInterceptor(new PaginationInnerInterceptor(DbType.MYSQL));
return interceptor;
}
}
权限控制配置:
@EnableWebSecurity
@EnableMethodSecurity(prePostEnabled = true, securedEnabled = true)
@Configuration
public class WaterSecurityConfiguration {
@Resource
private SecurityProperties securityProperties;
@Bean
public SecurityFilterChain filterChain(HttpSecurity httpSecurity,
@Lazy TokenAuthenticationFilter tokenAuthenticationFilter) throws Exception {
return httpSecurity
// 设置 URL 安全权限
.authorizeHttpRequests(c -> c
// 1. 静态资源,可匿名访问
.requestMatchers(HttpMethod.GET, "/*.html", "/**/*.html", "/**/*.css", "/**/*.js").permitAll()
// 2. 设置 @PermitAll 无需认证
.requestMatchers(securityProperties.getPermitAllUrls().toArray(new String[0])).permitAll()
// 3. 兜底规则,必须认证
.anyRequest().authenticated()
)
// 设置处理器
.exceptionHandling(c -> c.authenticationEntryPoint(authenticationEntryPoint)
.accessDeniedHandler(accessDeniedHandler))
// 添加 Token Filter
.addFilterBefore(tokenAuthenticationFilter, UsernamePasswordAuthenticationFilter.class)
// 不创建 SecurityContext
.sessionManagement(c -> c.sessionCreationPolicy(SessionCreationPolicy.STATELESS))
// 禁用 CSRF,因为使用 token 机制
.csrf(AbstractHttpConfigurer::disable)
// 禁用 cors
.cors(AbstractHttpConfigurer::disable)
.build();
}
}
3. 客户端技术架构
- 前端框架:基于yudao-ui-admin-vue3框架定制开发
- 核心框架:Vue 3.x + TypeScript
- 组件库:Element Plus,现代化UI组件
- 状态管理:Pinia,新一代的Vue状态管理库
- 路由管理:Vue Router
- HTTP工具:Axios,请求拦截与统一处理
- CSS框架:Tailwind CSS / UnoCSS,原子化CSS
- 图表组件:ECharts,强大的可视化图表库
- 富文本编辑器:WangEditor
- 文件上传:基于Element Plus的上传组件
- 权限控制:细粒度的按钮级权限控制
- 动态表格:支持拖拽、排序、筛选
- 代码规范:ESLint + Prettier,标准化代码风格
3.1 前端项目结构配置
package.json 依赖配置:
{
"name": "water-biz-ui-admin",
"version": "1.0.0",
"description": "福建水务营收系统管理后台",
"dependencies": {
"@element-plus/icons-vue": "^2.1.0",
"@vueuse/core": "^10.5.0",
"axios": "^1.6.0",
"echarts": "^5.4.3",
"element-plus": "^2.4.2",
"pinia": "^2.1.7",
"vue": "^3.3.8",
"vue-router": "^4.2.5",
"@wangeditor/editor": "^5.1.23",
"@wangeditor/editor-for-vue": "^5.1.12"
},
"devDependencies": {
"@types/node": "^20.8.7",
"@typescript-eslint/eslint-plugin": "^6.9.1",
"@typescript-eslint/parser": "^6.9.1",
"@vitejs/plugin-vue": "^4.4.1",
"eslint": "^8.52.0",
"eslint-plugin-vue": "^9.17.0",
"prettier": "^3.0.3",
"typescript": "^5.2.2",
"vite": "^4.5.0",
"vue-tsc": "^1.8.22"
}
}
vite.config.ts 构建配置:
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': resolve(__dirname, 'src'),
'~': resolve(__dirname, 'src'),
'#': resolve(__dirname, 'types')
}
},
server: {
host: '0.0.0.0',
port: 3000,
open: true,
proxy: {
'/admin-api': {
target: 'http://127.0.0.1:48080',
changeOrigin: true,
ws: true
}
}
},
build: {
target: 'es2015',
outDir: 'dist',
assetsDir: 'static',
sourcemap: false,
chunkSizeWarningLimit: 1500,
rollupOptions: {
output: {
chunkFileNames: 'static/js/[name]-[hash].js',
entryFileNames: 'static/js/[name]-[hash].js',
assetFileNames: 'static/[ext]/[name]-[hash].[ext]'
}
}
}
})
src/stores/user.ts 用户状态管理:
import { defineStore } from 'pinia'
import { ref, computed } from 'vue'
import { UserApi, UserVO } from '@/api/system/user'
import { getAccessToken, removeToken } from '@/utils/auth'
export const useUserStore = defineStore('user', () => {
const userInfo = ref<UserVO>()
const permissions = ref<string[]>([])
const roles = ref<string[]>([])
const nickname = computed(() => userInfo.value?.nickname ?? '')
const avatar = computed(() => userInfo.value?.avatar ?? '')
const email = computed(() => userInfo.value?.email ?? '')
// 获取用户信息
const getUserInfo = async () => {
const res = await UserApi.getUserProfile()
userInfo.value = res
permissions.value = res.permissions
roles.value = res.roles
}
// 用户登出
const logout = async () => {
try {
await UserApi.logout()
} finally {
await resetToken()
}
}
// 重置令牌
const resetToken = async () => {
userInfo.value = undefined
permissions.value = []
roles.value = []
removeToken()
}
// 检查权限
const hasPermission = (permission: string) => {
return permissions.value.includes(permission)
}
// 检查角色
const hasRole = (role: string) => {
return roles.value.includes(role)
}
return {
userInfo,
permissions,
roles,
nickname,
avatar,
email,
getUserInfo,
logout,
resetToken,
hasPermission,
hasRole
}
})
src/utils/request.ts HTTP请求封装:
import axios, { AxiosResponse, InternalAxiosRequestConfig } from 'axios'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getAccessToken, getRefreshToken, removeToken } from '@/utils/auth'
import { useUserStore } from '@/stores/user'
// 创建 axios 实例
const service = axios.create({
baseURL: import.meta.env.VITE_BASE_URL,
timeout: 50000,
withCredentials: false
})
// 请求拦截器
service.interceptors.request.use(
(config: InternalAxiosRequestConfig) => {
// 添加 token
const accessToken = getAccessToken()
if (accessToken && config.headers) {
config.headers.Authorization = `Bearer ${accessToken}`
}
// 添加租户ID
const tenantId = localStorage.getItem('tenantId')
if (tenantId && config.headers) {
config.headers['tenant-id'] = tenantId
}
return config
},
error => {
console.log(error)
return Promise.reject(error)
}
)
// 响应拦截器
service.interceptors.response.use(
(response: AxiosResponse) => {
const { data } = response
const { code, msg } = data
// 业务请求成功
if (code === 0) {
return data
}
// token 过期,尝试刷新
if (code === 401) {
return handleTokenExpired()
}
// 业务请求失败
ElMessage.error(msg || '系统未知错误,请反馈给管理员')
return Promise.reject(new Error(msg || 'Error'))
},
error => {
console.log('err' + error)
let { message } = error
if (message === 'Network Error') {
message = '后端接口连接异常'
} else if (message.includes('timeout')) {
message = '系统接口请求超时'
} else if (message.includes('Request failed with status code')) {
message = '系统接口' + message.substr(message.length - 3) + '异常'
}
ElMessage.error(message)
return Promise.reject(error)
}
)
// 处理 token 过期
const handleTokenExpired = async () => {
const userStore = useUserStore()
ElMessageBox.alert('登录状态已过期,您可以继续留在该页面,或者重新登录', '系统提示', {
confirmButtonText: '重新登录',
type: 'warning'
}).then(() => {
userStore.resetToken().then(() => {
location.reload()
})
})
}
export default service
4. 前端技术架构详细设计
4.1 Web管理端架构 (yudao-ui-admin-vue3)
技术栈组成:
graph TB
subgraph "开发框架"
A1[Vue 3.2.47 Composition API]
A2[TypeScript 4.9.4]
A3[Vite 4.0.0 构建工具]
end
subgraph "UI组件库"
B1[Element Plus 2.3.14]
B2[Element Plus Icons]
B3[自定义组件库]
end
subgraph "状态管理"
C1[Pinia 2.0.28]
C2[持久化插件]
C3[全局状态管理]
end
subgraph "路由系统"
D1[Vue Router 4.1.6]
D2[路由守卫]
D3[动态路由]
D4[权限控制]
end
subgraph "HTTP通信"
E1[Axios 1.2.2]
E2[请求拦截器]
E3[响应拦截器]
E4[错误处理]
end
subgraph "工具库"
F1[Lodash 工具函数]
F2[dayjs 时间处理]
F3[nprogress 进度条]
F4[js-cookie Cookie管理]
F5[crypto-js 加密解密]
end
A1 --> B1
A1 --> C1
A1 --> D1
A1 --> E1
B1 --> B3
C1 --> C2
D1 --> D2
E1 --> E2
项目结构设计:
yudao-ui-admin-vue3/
├── public/ # 静态资源
├── src/
│ ├── api/ # API接口定义
│ │ └── water/ # 水务业务API
│ │ ├── customer/ # 客户管理API
│ │ ├── meter/ # 抄表管理API
│ │ ├── billing/ # 收费管理API
│ │ └── workflow/ # 工单管理API
│ ├── assets/ # 静态资源
│ ├── components/ # 全局组件
│ │ ├── Dialog/ # 弹窗组件
│ │ ├── Form/ # 表单组件
│ │ ├── Table/ # 表格组件
│ │ └── Upload/ # 上传组件
│ ├── layout/ # 布局组件
│ ├── router/ # 路由配置
│ ├── stores/ # Pinia状态管理
│ ├── styles/ # 全局样式
│ ├── utils/ # 工具函数
│ ├── views/ # 页面组件
│ │ └── water/ # 水务业务页面
│ │ ├── customer/ # 客户管理
│ │ ├── meter/ # 抄表管理
│ │ ├── billing/ # 收费管理
│ │ └── workflow/ # 工单管理
│ └── App.vue
├── types/ # TypeScript类型定义
├── vite.config.ts # Vite配置
├── tsconfig.json # TypeScript配置
└── package.json # 项目依赖
核心配置示例:
// vite.config.ts - Vite构建配置
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': resolve(__dirname, 'src'),
'@/api': resolve(__dirname, 'src/api'),
'@/components': resolve(__dirname, 'src/components'),
'@/utils': resolve(__dirname, 'src/utils')
}
},
server: {
port: 80,
proxy: {
'/admin-api': {
target: 'http://127.0.0.1:48080',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/admin-api/, '/admin-api')
}
}
},
build: {
outDir: 'dist',
sourcemap: false,
rollupOptions: {
output: {
chunkFileNames: 'js/[name]-[hash].js',
entryFileNames: 'js/[name]-[hash].js',
assetFileNames: '[ext]/[name]-[hash].[ext]'
}
}
}
})
4.2 移动端架构 (uni-app)
技术栈组成:
graph TB
subgraph "跨平台框架"
M1[uni-app 3.x]
M2[Vue 3 Composition API]
M3[TypeScript支持]
end
subgraph "UI组件库"
N1[uView UI 2.0]
N2[uni-ui组件]
N3[自定义水务组件]
end
subgraph "状态管理"
O1[Vuex 4.x]
O2[uni-app存储]
O3[缓存管理]
end
subgraph "设备能力"
P1[相机API<br/>水表拍照]
P2[NFC读取<br/>水表标签]
P3[GPS定位<br/>抄表轨迹]
P4[扫码API<br/>二维码扫描]
end
subgraph "网络通信"
Q1[uni.request<br/>HTTP请求]
Q2[WebSocket<br/>实时通信]
Q3[文件上传<br/>图片处理]
end
M1 --> N1
M1 --> O1
M1 --> P1
M1 --> Q1
N1 --> N3
P1 --> P2
Q1 --> Q2
移动端项目结构:
water-mobile-app/
├── pages/ # 页面目录
│ ├── index/ # 首页
│ ├── meter/ # 抄表功能
│ │ ├── task/ # 抄表任务
│ │ ├── read/ # 抄表录入
│ │ └── history/ # 抄表历史
│ ├── workflow/ # 工单管理
│ └── personal/ # 个人中心
├── components/ # 组件目录
│ ├── meter-reader/ # 水表读数组件
│ ├── map-trace/ # 地图轨迹组件
│ └── camera-scan/ # 相机扫描组件
├── static/ # 静态资源
├── store/ # 状态管理
├── utils/ # 工具函数
├── api/ # 接口定义
├── manifest.json # 应用配置
└── pages.json # 页面配置
4.3 客户端小程序架构
微信小程序技术栈:
- 开发框架:微信小程序原生框架
- UI组件:WeUI + 自定义组件
- 状态管理:小程序全局数据管理
- 支付集成:微信支付API
- 地图服务:腾讯地图API
支付宝小程序技术栈:
- 开发框架:支付宝小程序原生框架
- UI组件:mini-antui + 自定义组件
- 状态管理:小程序全局数据管理
- 支付集成:支付宝支付API
- 地图服务:高德地图API
4.4 前端工程化配置
代码规范:
// .eslintrc.js - ESLint配置
{
"extends": [
"@vue/typescript/recommended",
"@vue/prettier",
"@vue/prettier/@typescript-eslint"
],
"rules": {
"@typescript-eslint/no-explicit-any": "warn",
"@typescript-eslint/no-unused-vars": "error",
"vue/multi-word-component-names": "off"
}
}
构建优化:
-
Vite热更新:开发环境快速构建
-
代码分割:按路由和组件懒加载
-
资源压缩:Gzip压缩和图片优化
-
CDN加速:静态资源CDN分发
-
缓存策略:浏览器缓存和Service Worker
-
移动端:
- 核心框架:uni-app(跨平台)
- 组件库:uview-ui
- 小程序支持:微信小程序、支付宝小程序等
- 移动端地图:高德地图SDK(用于抄表轨迹和导航)
- 设备接入:NFC、扫码、相机等硬件设备接口
2.3 技术特性
- 单点登录:OAuth2 + JWT实现统一认证
- 数据交换:基于RESTful API的系统内部数据交换与共享
- 统一报表平台:集成JimuReport,支持自定义报表设计与生成
- 大屏设计:集成GoView,支持可视化大屏设计
- 安全保障:满足安全等保三级要求
- 密码加密:BCrypt加密算法
- 防XSS攻击:表单数据过滤
- 防SQL注入:参数化查询
- 防CSRF攻击:Token验证
- 性能规格:支持200并发用户,50并发移动设备,系统响应时间不超过3秒
- 扩展容量:支持100万客户的业务量,满足企业3-5年的业务发展需求
- 支持功能:
- 支付管理:微信支付、支付宝支付等
- 短信服务:阿里云、腾讯云等多家短信服务商
- AI能力:
- 智能抄表:基于图像识别的水表读数
- 异常分析:基于AI的用水异常分析
- API网关:支持API权限管理、限流熔断、白名单控制
3. 应用架构
1. 微服务应用架构图
graph TB
subgraph "网关层"
GW[API网关<br/>Spring Cloud Gateway]
AUTH[认证服务<br/>OAuth2 + JWT]
end
subgraph "基础服务层"
subgraph "系统服务"
SYS[系统管理服务<br/>用户/角色/权限]
TENANT[租户管理服务<br/>多租户隔离]
FILE[文件管理服务<br/>附件存储]
MSG[消息服务<br/>短信/邮件/推送]
end
subgraph "工作流服务"
WF[工作流引擎<br/>Flowable]
TASK[任务调度服务<br/>Quartz]
end
end
subgraph "业务服务层"
subgraph "客户域服务"
CUST[客户管理服务<br/>Customer Service]
METER[水表管理服务<br/>Meter Service]
ADDR[地址管理服务<br/>Address Service]
end
subgraph "营收域服务"
READ[抄表服务<br/>Reading Service]
BILL[账单服务<br/>Billing Service]
PAY[收费服务<br/>Payment Service]
ACC[账务服务<br/>Accounting Service]
end
subgraph "运营域服务"
ORDER[工单服务<br/>Workflow Service]
RPT[报表服务<br/>Report Service]
STATS[统计分析服务<br/>Statistics Service]
end
subgraph "接口域服务"
BANK[银行接口服务<br/>Bank Service]
PAY_GW[支付网关服务<br/>Payment Gateway]
IOT[物联网服务<br/>IoT Service]
SMS[短信服务<br/>SMS Service]
end
end
subgraph "数据层"
subgraph "业务数据库"
DB_CUST[(客户库<br/>Customer DB)]
DB_BILL[(营收库<br/>Billing DB)]
DB_RPT[(报表库<br/>Report DB)]
end
subgraph "缓存与存储"
REDIS[(Redis集群<br/>缓存/会话)]
ES[(ElasticSearch<br/>搜索引擎)]
FILE_STORE[文件存储<br/>MinIO/OSS]
end
end
%% 网关层连接
GW --> AUTH
GW --> SYS
GW --> CUST
GW --> READ
GW --> ORDER
%% 服务间调用
CUST --> METER
CUST --> ADDR
READ --> METER
READ --> CUST
BILL --> READ
BILL --> CUST
PAY --> BILL
ACC --> PAY
ORDER --> WF
ORDER --> TASK
RPT --> STATS
%% 外部接口调用
PAY --> BANK
PAY --> PAY_GW
READ --> IOT
ORDER --> SMS
%% 数据层连接
CUST --> DB_CUST
METER --> DB_CUST
BILL --> DB_BILL
PAY --> DB_BILL
RPT --> DB_RPT
SYS --> REDIS
AUTH --> REDIS
CUST --> REDIS
BILL --> ES
FILE --> FILE_STORE
2. 服务治理架构
graph TB
subgraph "服务发现与注册"
NACOS[Nacos注册中心<br/>服务注册/发现/配置]
end
subgraph "服务网格层"
subgraph "负载均衡"
LB[Ribbon负载均衡<br/>客户端负载均衡]
FEIGN[OpenFeign<br/>服务间调用]
end
subgraph "容错保护"
CB[Sentinel熔断器<br/>流量控制/熔断降级]
RETRY[重试机制<br/>失败重试]
end
subgraph "链路追踪"
TRACE[SkyWalking<br/>分布式链路追踪]
METRIC[Micrometer<br/>指标收集]
end
end
subgraph "配置管理"
CONFIG[Nacos Config<br/>配置中心]
SECRET[配置加密<br/>敏感信息保护]
end
subgraph "监控告警"
MONITOR[Spring Boot Admin<br/>应用监控]
ALERT[告警系统<br/>异常通知]
LOG[ELK日志系统<br/>日志聚合分析]
end
NACOS --> LB
NACOS --> FEIGN
LB --> CB
FEIGN --> TRACE
CB --> RETRY
CONFIG --> SECRET
MONITOR --> ALERT
TRACE --> LOG
系统应用架构基于业务域划分,主要包括以下核心应用模块:
3.1 统一平台
- 单点登录:统一认证入口,支持多种登录方式
- 系统管理:组织机构、员工管理、角色权限管理、菜单配置等
- 流程节点提醒:工作流节点到期和状态变更提醒
3.2 营收系统
- 系统管理:水价管理、用户档案管理、更名过户管理等
- 抄表开账:册本管理、抄表录入、复核开账等
- 收费管理:柜台收费、特殊开账、柜台结账、批量缴费等
- 账务处理:预存调整、未销调整、已销调整、分账调整等
- 发票管理:发票查询、发票开具、电子发票等
- 代收业务:实时收费、银行代扣、银行托收等
- 环卫系统:计费核定、计费退补、计费减免等
- 业务工单:业务清单、上报清单、稽查工单、移表工单等
3.3 客户服务
- 微信、支付宝服务窗:账户绑定、用水查询、在线缴费等
- 历史账单:账单查询、用水分析、账单推送等
- 电子发票:发票申请、发票查询、发票下载等
- 营业网点:网点查询、网点导航、业务指南等
- 账户流水:流水查询、明细下载、交易统计等
- 微网厅:用户注册、信息查询、业务办理等
3.4 表务系统
- 表务工单:换表工单、移表工单、拆表工单、复装工单等
- 表务仓库:新表入库、水表检定、水表领用、水表出库等
- 水表参数与基础信息:水表厂家管理、水表型号管理等
- 物联网对接与数据同步:厂家设备信息管理、远程抄表数据同步等
3.5 报装管理
- 报装流程:报装申请、方案设计、合同签订、施工管理等
- 一户一表管理:改造计划、改造实施、用户转换等
3.6 统计分析
- 报表查询:标准报表、自定义报表、报表导出打印等
- 欠费查询:欠费情况统计、欠费用户明细、欠费分析等
- 缴费记录:缴费情况统计、缴费明细查询、缴费趋势分析等
- 用水分析:用水量统计、用水趋势分析、异常用水分析等
3.7 工程管理
- 工程申请:工程立项、材料提交、前期勘察等
- 工程施工:施工计划、施工派工、施工记录等
- 工程验收:验收申请、验收检查、验收记录等
- 工程查询:工程进度查询、工程资料查询、工程统计等
3.8 抄表APP
- 首页功能:首页展示、个人信息、快捷查询等
- 抄表功能:抄表任务、NFC抄表、扫码抄表、AI录入等
- 工单管理:问题上报、问题回填、代办工单、稽查工单等
3.9 接口服务
- API市场:API展示、API使用说明、API测试等
- API管理:API申请、API调度看板、接口服务配置管理等
- 接口权限管理:授权管理、白名单管理、安全策略等
- 系统对外接口:查询接口、业务处理接口、状态同步接口等
3.10 系统配置
- 水表参数:水表厂家、水表型号、水表量程等
- 地址参数:行政区划、地址编码、地址库等
- 价格体系:用水性质、水价标准、阶梯水价等
- 基本配置:系统参数、业务规则、打印模板等
- 催缴管理:催缴计划、催缴任务、催缴执行等
- 用户权限:菜单权限、功能权限、数据权限等
- 定时任务:任务配置、任务监控、任务日志等
4. 数据架构
系统数据架构基于客户关系数据库为核心和基础,实现客户全生命周期管理。
4.1 数据分层
- 数据采集层:负责从各业务系统和物联网设备采集原始数据
- 数据存储层:统一数据存储,实现分布式数据管理
- 数据服务层:提供数据服务接口
- 数据展现层:提供数据分析和可视化功能
4.2 OpenGauss数据库架构
4.2.1 主从高可用架构
graph TB
subgraph "OpenGauss高可用集群"
MASTER[("OpenGauss主库<br/>Primary Node<br/>读写操作")]
STANDBY[("OpenGauss备库<br/>Standby Node<br/>只读操作")]
CASCADE[("OpenGauss级联备库<br/>Cascade Standby<br/>负载分担")]
end
subgraph "应用层"
APP1[应用服务器1]
APP2[应用服务器2]
APP3[应用服务器3]
end
subgraph "连接池"
POOL[连接池<br/>HikariCP<br/>Druid]
end
subgraph "监控管理"
MON[OpenGauss Monitor<br/>性能监控]
BACKUP[定时备份<br/>gs_backup]
end
APP1 --> POOL
APP2 --> POOL
APP3 --> POOL
POOL --> MASTER
POOL --> STANDBY
POOL --> CASCADE
MASTER -.->|流复制| STANDBY
STANDBY -.->|级联复制| CASCADE
MON --> MASTER
MON --> STANDBY
BACKUP --> MASTER
4.2.2 分片存储架构
graph TB
subgraph "OpenGauss分布式架构"
subgraph "协调节点"
CN1[协调节点1<br/>Coordinator Node]
CN2[协调节点2<br/>Coordinator Node]
end
subgraph "数据节点组1"
DN1_1[数据节点1-主<br/>Datanode Primary]
DN1_2[数据节点1-备<br/>Datanode Standby]
end
subgraph "数据节点组2"
DN2_1[数据节点2-主<br/>Datanode Primary]
DN2_2[数据节点2-备<br/>Datanode Standby]
end
subgraph "GTM节点"
GTM[全局事务管理器<br/>GTM Master]
GTM_S[GTM备节点<br/>GTM Standby]
end
end
CN1 --> DN1_1
CN1 --> DN2_1
CN2 --> DN1_1
CN2 --> DN2_1
DN1_1 -.->|主备同步| DN1_2
DN2_1 -.->|主备同步| DN2_2
GTM -.->|备份| GTM_S
CN1 --> GTM
CN2 --> GTM
4.2.3 数据安全架构
graph TB
subgraph "安全防护层"
TDE[透明数据加密<br/>TDE]
RLS[行级安全<br/>Row Level Security]
MASK[动态数据脱敏<br/>Dynamic Data Masking]
AUDIT[三权分立审计<br/>Separated Audit]
end
subgraph "访问控制层"
RBAC[基于角色的访问控制<br/>RBAC]
LDAP[LDAP集成认证<br/>External Auth]
SSL[SSL/TLS加密传输<br/>Encrypted Transport]
end
subgraph "数据存储层"
ENCRYPT[存储层加密<br/>Storage Encryption]
COMPRESS[数据压缩<br/>Data Compression]
BACKUP_ENC[备份加密<br/>Backup Encryption]
end
TDE --> ENCRYPT
RLS --> RBAC
MASK --> ENCRYPT
AUDIT --> BACKUP_ENC
RBAC --> SSL
LDAP --> SSL
4.3 数据模型设计
- 客户信息模型:包含客户基础信息、表卡信息、账户信息、联系人信息等
- 业务数据模型:抄表数据、收费数据、账务数据、发票数据等
- 工单数据模型:表务工单、报装工单、业务工单等
- 配置数据模型:系统参数、水表参数、价格体系等
- 报表数据模型:统计数据、分析数据、预测数据等
- 物联网数据模型:设备信息、状态信息、实时数据等
4.4 数据集成与共享
- 统一数据标准:定义统一的数据标准和数据字典,符合OpenGauss规范
- 数据集成机制:采用OpenGauss XA事务实现系统间的数据一致性
- 数据共享机制:基于OpenGauss外部数据包装器(FDW)实现跨库数据访问
- 数据同步策略:支持实时流复制、定时数据同步、批量ETL处理等
4.5 OpenGauss特性应用
4.5.1 性能优化特性
- 向量化执行引擎:批量数据处理,提升OLAP查询性能30-50%
- 列存储引擎:统计报表类查询,压缩比高达10:1
- 分区表技术:按月份分区存储抄表数据,支持分区裁剪
- 并行查询:复杂统计查询自动并行执行
- 智能优化器:自适应查询计划,持续性能优化
4.5.2 企业级特性
- 在线扩容:支持不停机新增数据节点
- 故障自愈:主备节点故障自动切换,RTO < 10秒
- 读写分离:自动路由读请求到备节点,减轻主库压力
- 负载均衡:连接池级别的智能负载均衡
- 全量/增量备份:支持热备份,最小备份粒度到事务级
5. 安全架构
系统安全架构基于OpenGauss数据库的企业级安全特性,满足等保三级要求和国产化安全标准:
5.1 网络安全
- 边界防护:防火墙、入侵检测/防御系统
- 访问控制:基于角色的访问控制(RBAC)
- 通信安全:SSL/TLS加密传输,支持国密算法
- 安全监控:实时监控网络安全状态和异常访问
5.2 OpenGauss数据安全架构
5.2.1 数据加密安全
graph TB
subgraph "加密层级"
L1[传输层加密<br/>SSL/TLS/国密SM]
L2[存储层加密<br/>TDE透明数据加密]
L3[字段级加密<br/>敏感字段加密]
L4[备份加密<br/>备份文件加密]
end
subgraph "密钥管理"
KMS[密钥管理系统<br/>Key Management]
HSM[硬件安全模块<br/>Hardware Security]
ROT[密钥轮换<br/>Key Rotation]
end
subgraph "国密算法"
SM2[SM2椭圆曲线<br/>非对称加密]
SM3[SM3哈希算法<br/>消息摘要]
SM4[SM4分组密码<br/>对称加密]
end
L1 --> KMS
L2 --> HSM
L3 --> ROT
L4 --> KMS
KMS --> SM2
HSM --> SM3
ROT --> SM4
5.2.2 访问控制安全
graph TB
subgraph "身份认证"
AUTH1[用户名密码认证]
AUTH2[LDAP集成认证]
AUTH3[Kerberos认证]
AUTH4[证书认证]
end
subgraph "权限控制"
RBAC[基于角色的权限控制<br/>Role-Based Access Control]
RLS[行级安全策略<br/>Row Level Security]
CLS[列级安全控制<br/>Column Level Security]
TENANT[多租户数据隔离<br/>Multi-Tenant Isolation]
end
subgraph "审计监控"
AUDIT[操作审计日志<br/>Audit Logging]
MONITOR[实时安全监控<br/>Security Monitoring]
ALERT[安全告警<br/>Security Alert]
REPORT[合规报告<br/>Compliance Report]
end
AUTH1 --> RBAC
AUTH2 --> RLS
AUTH3 --> CLS
AUTH4 --> TENANT
RBAC --> AUDIT
RLS --> MONITOR
CLS --> ALERT
TENANT --> REPORT
5.3 数据安全特性
- 透明数据加密(TDE):自动加密存储数据,支持SM4国密算法
- 行级安全(RLS):基于用户角色的行级数据访问控制
- 列级权限:敏感字段的精细化访问控制
- 动态脱敏:查询时自动脱敏显示敏感信息
- 数据备份安全:备份文件自动加密,支持增量备份
- 审计日志:完整记录所有数据库操作,支持合规审计
5.4 多租户安全隔离
- 逻辑隔离:基于tenant_id的数据隔离
- 连接隔离:租户间连接池隔离
- 权限隔离:租户级别的权限管理
- 资源隔离:CPU、内存、IO资源限制
5.5 应用安全
- 身份认证:多因素认证,支持短信验证码、邮箱验证等
- 授权管理:细粒度的权限控制,支持菜单、按钮、数据权限
- 安全审计:用户操作审计,关键业务操作全程记录
- 密码策略:密码复杂度、定期更换、失败锁定等安全策略
- 会话管理:会话超时、并发限制、单点登录等
5.6 接口安全
- 接口认证:基于JWT Token的接口认证
- 接口授权:基于角色的接口授权和权限验证
- 接口加密:敏感数据的加密传输,支持国密算法
- 接口防护:防重放、防篡改、防SQL注入等安全措施
- 接口限流:基于IP、用户、应用的多维度限流策略
6. 部署架构
系统采用集中部署的模式,基于集团私有云环境进行部署。
6.1 物理部署
- 生产环境:高可用集群部署
- 应用服务器:2台或以上服务器,负载均衡
- OpenGauss数据库集群:主从+级联备架构,支持自动故障切换
- 缓存服务器:Redis集群
- 文件服务器:冗余存储
- 灾备环境:异地灾备,定期数据同步,支持OpenGauss流复制
- 测试环境:用于系统测试和验证,单节点OpenGauss部署
- 开发环境:用于系统开发和集成测试,单节点OpenGauss部署
6.2 逻辑部署
- 应用服务器集群:负责业务逻辑处理,支持水平扩展
- OpenGauss数据库集群:负责数据存储和管理,提供高可用保障
- 文件服务器:负责文档和附件存储,支持分布式存储
- 缓存服务器:Redis集群提高系统性能
- 负载均衡服务器:实现请求分发和负载均衡
- 移动应用服务:提供移动端API服务
- API网关:统一的接口管理和控制
6.3 容器部署
- 基于Docker容器技术实现微服务部署
- 使用Kubernetes进行容器编排和管理
- 支持容器的自动扩缩容和故障转移
- 实现服务的灰度发布和版本控制
7. 接口架构
系统提供标准化的接口,实现与外部系统的集成和数据交换。
7.1 外部接口
- 银行接口:实现与银行系统的对接,支持代扣、托收等功能
- 支付宝/微信接口:支持在线支付功能
- 短信接口:支持短信通知和验证码功能
- 集抄系统接口:实现与智能水表集中抄表系统的对接
- 政务系统接口:实现与地方政务平台和政务APP的对接
- 消火栓系统接口:实现与消火栓系统的对接
- 环卫系统接口:实现与环卫系统的对接
- OA系统接口:实现与OA系统的工作流对接
7.2 内部接口
- ESB服务接口:系统内部模块间的数据交换
- 报表接口:提供报表数据查询和生成功能
- 查询接口:提供数据查询功能
- 业务处理接口:提供业务处理功能
- 消息通知接口:提供消息推送和通知功能
- 工作流接口:提供工作流处理和状态查询功能
7.3 接口标准
- 接口协议:RESTful API、WebService、消息队列等
- 数据格式:JSON、XML等
- 接口安全:身份认证、授权、加密传输等
- 接口文档:统一的接口文档和示例代码
- 接口测试:提供接口测试工具和环境
7.4 接口服务管理
- API网关:统一的接口入口和管理
- 服务注册与发现:服务的自动注册和发现
- 服务路由:根据请求参数进行服务路由
- 服务降级:在服务不可用时提供降级策略
- 服务监控:实时监控服务的可用性和性能