866 lines
42 KiB
HTML
866 lines
42 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>福建水务营收系统整体架构图 v1.7</title>
|
||
<style>
|
||
* {
|
||
margin: 0;
|
||
padding: 0;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
body {
|
||
font-family: 'Microsoft YaHei', '宋体', Arial, sans-serif;
|
||
background: #f5f7fa;
|
||
padding: 10px;
|
||
min-height: 100vh;
|
||
}
|
||
|
||
.container {
|
||
margin: 0 auto;
|
||
background: white;
|
||
border-radius: 8px;
|
||
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
|
||
overflow: hidden;
|
||
border: 1px solid #e0e6ed;
|
||
}
|
||
|
||
.header {
|
||
background: #2c3e50;
|
||
color: white;
|
||
text-align: center;
|
||
padding: 20px;
|
||
border-bottom: 3px solid #34495e;
|
||
}
|
||
|
||
.header h1 {
|
||
font-size: 2.5rem;
|
||
margin-bottom: 12px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.header p {
|
||
font-size: 1.2rem;
|
||
opacity: 0.9;
|
||
}
|
||
|
||
.architecture {
|
||
padding: 15px;
|
||
background: #fafbfc;
|
||
}
|
||
|
||
.layer {
|
||
margin-bottom: 15px;
|
||
background: white;
|
||
border-radius: 4px;
|
||
padding: 12px;
|
||
box-shadow: 0 2px 6px rgba(0,0,0,0.06);
|
||
border: 1px solid #e1e8ed;
|
||
border-left: 4px solid;
|
||
}
|
||
|
||
.layer.presentation { border-left-color: #8b5a3c; }
|
||
.layer.gateway { border-left-color: #5a5a5a; }
|
||
.layer.business { border-left-color: #2c5282; }
|
||
.layer.infrastructure { border-left-color: #2d5016; }
|
||
.layer.data { border-left-color: #553c9a; }
|
||
|
||
.layer-title {
|
||
font-size: 1.6rem;
|
||
font-weight: bold;
|
||
margin-bottom: 12px;
|
||
color: #2c3e50;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.layer-icon {
|
||
width: 32px;
|
||
height: 32px;
|
||
margin-right: 12px;
|
||
border-radius: 4px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: white;
|
||
font-weight: bold;
|
||
font-size: 1rem;
|
||
}
|
||
|
||
.presentation .layer-icon { background: #8b5a3c; }
|
||
.gateway .layer-icon { background: #5a5a5a; }
|
||
.business .layer-icon { background: #2c5282; }
|
||
.infrastructure .layer-icon { background: #2d5016; }
|
||
.data .layer-icon { background: #553c9a; }
|
||
|
||
.layer-description {
|
||
color: #666;
|
||
margin-bottom: 15px;
|
||
font-size: 1.1rem;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.components {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
|
||
gap: 10px;
|
||
}
|
||
|
||
.components.subsystems {
|
||
grid-template-columns: repeat(3, 1fr);
|
||
}
|
||
|
||
.component {
|
||
background: #f8f9fa;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 3px;
|
||
padding: 6px;
|
||
text-align: center;
|
||
}
|
||
|
||
.component-title {
|
||
font-weight: bold;
|
||
color: #2c3e50;
|
||
margin-bottom: 8px;
|
||
font-size: 1.1rem;
|
||
}
|
||
|
||
.component-desc {
|
||
color: #666;
|
||
font-size: 0.95rem;
|
||
line-height: 1.4;
|
||
}
|
||
|
||
.connections {
|
||
margin-top: 10px;
|
||
padding: 12px;
|
||
background: #34495e;
|
||
border-radius: 3px;
|
||
color: white;
|
||
}
|
||
|
||
.connections h3 {
|
||
text-align: center;
|
||
margin-bottom: 12px;
|
||
font-size: 1.3rem;
|
||
}
|
||
|
||
.flow-diagram {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 4px;
|
||
}
|
||
|
||
.flow-item {
|
||
background: rgba(255,255,255,0.1);
|
||
padding: 8px 12px;
|
||
border-radius: 4px;
|
||
border: 1px solid rgba(255,255,255,0.2);
|
||
font-size: 1rem;
|
||
}
|
||
|
||
.arrow {
|
||
color: #bdc3c7;
|
||
font-size: 1.2rem;
|
||
margin: 0 8px;
|
||
}
|
||
|
||
.tech-stack {
|
||
margin-top: 10px;
|
||
background: white;
|
||
border-radius: 3px;
|
||
padding: 12px;
|
||
border: 1px solid #e1e8ed;
|
||
}
|
||
|
||
.tech-stack h3 {
|
||
text-align: center;
|
||
color: #2c3e50;
|
||
margin-bottom: 12px;
|
||
font-size: 1.3rem;
|
||
}
|
||
|
||
.tech-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
|
||
gap: 8px;
|
||
}
|
||
|
||
.tech-category {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
padding: 8px;
|
||
border-left: 3px solid #2c5282;
|
||
}
|
||
|
||
.tech-category h4 {
|
||
color: #2c3e50;
|
||
margin-bottom: 8px;
|
||
font-size: 1rem;
|
||
}
|
||
|
||
.tech-list {
|
||
list-style: none;
|
||
}
|
||
|
||
.tech-list li {
|
||
color: #666;
|
||
margin-bottom: 3px;
|
||
padding-left: 12px;
|
||
position: relative;
|
||
font-size: 0.85rem;
|
||
}
|
||
|
||
.tech-list li::before {
|
||
content: '▪';
|
||
color: #2c5282;
|
||
position: absolute;
|
||
left: 0;
|
||
}
|
||
|
||
.footer {
|
||
background: #2c3e50;
|
||
color: white;
|
||
text-align: center;
|
||
padding: 12px;
|
||
font-size: 0.9rem;
|
||
}
|
||
|
||
@media (max-width: 768px) {
|
||
.components {
|
||
grid-template-columns: repeat(2, 1fr);
|
||
}
|
||
|
||
.header h1 {
|
||
font-size: 2rem;
|
||
}
|
||
|
||
.architecture {
|
||
padding: 8px;
|
||
}
|
||
|
||
.flow-diagram {
|
||
flex-direction: column;
|
||
}
|
||
|
||
.arrow {
|
||
transform: rotate(90deg);
|
||
}
|
||
|
||
.components.subsystems {
|
||
grid-template-columns: repeat(2, 1fr);
|
||
}
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<div class="header">
|
||
<h1>福建水务营收系统整体架构图</h1>
|
||
<p>基于微服务架构的现代化水务营收管理平台 | 七大业务子系统 + 三大基础服务子系统（简化版） | v1.7</p>
|
||
</div>
|
||
|
||
<div class="architecture">
|
||
<!-- 表现层 -->
|
||
<div class="layer presentation">
|
||
<div class="layer-title">
|
||
<div class="layer-icon">UI</div>
|
||
表现层 (Presentation Layer)
|
||
</div>
|
||
<div class="layer-description">
|
||
负责用户交互和界面展示，包含多种客户端形态，采用前后端分离架构，提高开发效率和用户体验
|
||
</div>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">Web管理端</div>
|
||
<div class="component-desc">Vue3 + Element Plus<br/>后台管理系统</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">手机抄表APP</div>
|
||
<div class="component-desc">uni-app跨平台<br/>移动端现场作业</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title"> SYS-004 微网厅子系统</div>
|
||
<div class="component-desc">微信公众号H5页面<br/>账户绑定、在线缴费<br/>客户自助服务平台</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">移动收费端</div>
|
||
<div class="component-desc">移动POS终端<br/>现场收费工具</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 网关层 -->
|
||
<div class="layer gateway">
|
||
<div class="layer-title">
|
||
<div class="layer-icon">GW</div>
|
||
网关层 (Gateway Layer)
|
||
</div>
|
||
<div class="layer-description">
|
||
统一入口，负责请求路由和负载均衡，集中处理认证授权、基础保护、监控日志
|
||
</div>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">API网关</div>
|
||
<div class="component-desc">Spring Cloud Gateway<br/>统一入口管理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">负载均衡</div>
|
||
<div class="component-desc">Nginx<br/>请求分发</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">统一认证中心</div>
|
||
<div class="component-desc">OAuth2.0 + CAS协议<br/>JWT令牌认证<br/>单点登录(SSO)</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">监控日志</div>
|
||
<div class="component-desc">ELK Stack<br/>日志收集分析</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 业务服务层 -->
|
||
<div class="layer business">
|
||
<div class="layer-title">
|
||
<div class="layer-icon">BS</div>
|
||
业务服务层 (Business Service Layer)
|
||
</div>
|
||
<div class="layer-description">
|
||
核心业务逻辑处理层，包含七个业务子系统，按业务域划分微服务，实现高内聚低耦合
|
||
</div>
|
||
|
||
<!-- SYS-001 统一平台 -->
|
||
<div style="margin-bottom: 12px;">
|
||
<h4 style="color: #2c3e50; margin-bottom: 10px; font-size: 1.3rem; border-bottom: 2px solid #2c5282; padding-bottom: 6px;">
|
||
■ SYS-001 统一平台
|
||
</h4>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">UP-001 单点登录模块</div>
|
||
<div class="component-desc">OAuth2.0+CAS协议<br/>JWT令牌认证<br/>多种登录方式</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">UP-002 系统管理模块</div>
|
||
<div class="component-desc">用户角色管理<br/>部门组织架构<br/>菜单权限配置</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">UP-003 权限控制模块</div>
|
||
<div class="component-desc">RBAC权限模型<br/>菜单权限<br/>数据权限</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">UP-004 租户管理模块</div>
|
||
<div class="component-desc">多租户数据隔离<br/>租户配置管理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">UP-005 系统监控模块</div>
|
||
<div class="component-desc">在线用户<br/>性能监控<br/>操作日志</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SYS-002 营收业务系统 -->
|
||
<div style="margin-bottom: 12px;">
|
||
<h4 style="color: #2c3e50; margin-bottom: 10px; font-size: 1.3rem; border-bottom: 2px solid #8b5a3c; padding-bottom: 6px;">
|
||
■ SYS-002 营收业务子系统
|
||
</h4>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">营收核心模块群</div>
|
||
<div class="component-desc">客户管理、抄表开账、营业收费<br/>账务处理、发票管理、催缴管理<br/>统计分析、代收业务</div>
|
||
</div>
|
||
|
||
<div class="component">
|
||
<div class="component-title">客户服务模块群</div>
|
||
<div class="component-desc">账户绑定、信息查询、在线缴费、柜面扫码支付<br/>电子发票、营业网点、业务办理</div>
|
||
</div>
|
||
|
||
<div class="component">
|
||
<div class="component-title">REV-001 客户资料管理</div>
|
||
<div class="component-desc">客户档案<br/>分组管理<br/>信息变更</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-002 抄表开账</div>
|
||
<div class="component-desc">抄表录入<br/>复核开账<br/>异常处理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-003 营业收费</div>
|
||
<div class="component-desc">柜台收费<br/>移动收费<br/>在线缴费</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-004 账务处理</div>
|
||
<div class="component-desc">调账<br/>退款<br/>坏账处理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-005 发票管理</div>
|
||
<div class="component-desc">开票/查询/作废<br/>（经SYS-008）</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-006 催缴管理</div>
|
||
<div class="component-desc">欠费统计<br/>催缴通知<br/>停水管理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-007 统计分析</div>
|
||
<div class="component-desc">多维统计<br/>报表分析</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-008 代收业务</div>
|
||
<div class="component-desc">银行代扣<br/>聚合支付（经SYS-009）</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">REV-009 业务参数配置</div>
|
||
<div class="component-desc">水价体系<br/>水表参数<br/>基础配置</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">CS-001 账户绑定管理</div>
|
||
<div class="component-desc">微信/支付宝绑定<br/>解绑与多账户</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">CS-002 信息查询服务</div>
|
||
<div class="component-desc">账单查询、用水历史<br/>缴费记录、停水公告</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">CS-003 在线缴费服务</div>
|
||
<div class="component-desc">快捷缴费、充值、代缴<br/>结果查询（经SYS-009）</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">CS-004 电子发票服务</div>
|
||
<div class="component-desc">查看/推送/下载<br/>（经SYS-008）</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">CS-005 营业网点服务</div>
|
||
<div class="component-desc">网点查询<br/>地图导航/预约</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">CS-006 业务办理服务</div>
|
||
<div class="component-desc">联系方式/开票方式/更名过户<br/>低保/换表/自主抄表</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">CS-007 柜面扫码支付</div>
|
||
<div class="component-desc">二维码收款<br/>票据关联/结果回传（经SYS-009）</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SYS-003 手机抄表APP -->
|
||
<div style="margin-bottom: 12px;">
|
||
<h4 style="color: #2c3e50; margin-bottom: 10px; font-size: 1.3rem; border-bottom: 2px solid #2d5016; padding-bottom: 6px;">
|
||
■ SYS-003 手机抄表APP
|
||
</h4>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">MOBILE-001 登录认证</div>
|
||
<div class="component-desc">机构编号、用户名/密码<br/>自动登录、令牌管理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">MOBILE-002 首页搜索</div>
|
||
<div class="component-desc">多维度搜索、最近记录<br/>任务快捷入口</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">MOBILE-003 采集任务管理</div>
|
||
<div class="component-desc">任务列表、批量下载、单户采集<br/>调用外部AI识别、读数校验</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">MOBILE-004 现场上报</div>
|
||
<div class="component-desc">异常上报、图片与定位采集<br/>提交至SYS-005工单系统</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">MOBILE-005 个人与设置</div>
|
||
<div class="component-desc">个人资料、偏好设置<br/>缓存管理、安全退出</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">MOBILE-006 数据同步</div>
|
||
<div class="component-desc">任务包增量同步、离线数据包上传<br/>冲突处理</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SYS-004 微网厅系统 -->
|
||
<div style="margin-bottom: 12px;">
|
||
<h4 style="color: #2c3e50; margin-bottom: 10px; font-size: 1.3rem; border-bottom: 2px solid #9c27b0; padding-bottom: 6px;">
|
||
■ SYS-004 微网厅子系统
|
||
</h4>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-001 账户绑定管理</div>
|
||
<div class="component-desc">微信授权、账户绑定与解绑<br/>多账户管理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-002 信息查询服务</div>
|
||
<div class="component-desc">账单查询、用水历史<br/>缴费记录、停水公告</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-003 在线缴费服务</div>
|
||
<div class="component-desc">快捷缴费、充值服务<br/>多种支付方式（经SYS-009）</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-004 电子发票服务</div>
|
||
<div class="component-desc">发票查看、发票推送<br/>电子发票管理（经SYS-008）</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-005 营业网点服务</div>
|
||
<div class="component-desc">网点查询、地图导航<br/>距离计算、预约服务</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-006 业务办理服务</div>
|
||
<div class="component-desc">联系方式变更、开票方式变更<br/>更名过户、水价变更、低保申请<br/>换表申请、自主抄表</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-007 账户流水</div>
|
||
<div class="component-desc">账户历史缴费流水查询与导出<br/>流水列表、筛选与导出</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WECHAT-008 账号与机构管理</div>
|
||
<div class="component-desc">切换机构、添加/解绑客户<br/>设置默认客户、客户详情</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SYS-005 工单管理系统 -->
|
||
<div style="margin-bottom: 12px;">
|
||
<h4 style="color: #2c3e50; margin-bottom: 10px; font-size: 1.3rem; border-bottom: 2px solid #2c5282; padding-bottom: 6px;">
|
||
■ SYS-005 工单管理子系统
|
||
</h4>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">WORK-001 工单中心</div>
|
||
<div class="component-desc">统一受理、路由、分派、跟踪<br/>支持工单分类、优先级与SLA策略</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WORK-002 流程引擎</div>
|
||
<div class="component-desc">可视化编排、条件路由、并行/互斥网关<br/>支持子流程与回退重审</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WORK-003 监控预警</div>
|
||
<div class="component-desc">实时看板、超时预警、积压监控<br/>异常拦截与通知</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">WORK-004 绩效统计</div>
|
||
<div class="component-desc">处理时长与环节分析<br/>达成率统计与考核报表导出</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SYS-006 表务管理系统 -->
|
||
<div style="margin-bottom: 12px;">
|
||
<h4 style="color: #2c3e50; margin-bottom: 10px; font-size: 1.3rem; border-bottom: 2px solid #2d5016; padding-bottom: 6px;">
|
||
■ SYS-006 表务管理子系统
|
||
</h4>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">METER-001 表务基础管理</div>
|
||
<div class="component-desc">厂家、型号、口径、量程、检定周期<br/>等基础参数标准化</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">METER-002 仓库与库存管理</div>
|
||
<div class="component-desc">入库/出库/盘点/调拨/库存预警<br/>与工单联动领用回填</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">METER-003 设备档案管理</div>
|
||
<div class="component-desc">唯一电子档案、状态流转<br/>批次与质检记录追溯</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- SYS-007 报装业务系统 -->
|
||
<div style="margin-bottom: 12px;">
|
||
<h4 style="color: #2c3e50; margin-bottom: 10px; font-size: 1.3rem; border-bottom: 2px solid #8b5a3c; padding-bottom: 6px;">
|
||
■ SYS-007 报装业务子系统
|
||
</h4>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">INST-001 报装流程管理</div>
|
||
<div class="component-desc">端到端阶段流转<br/>里程碑控制</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">INST-002 工程管理</div>
|
||
<div class="component-desc">进度/资源/质量/安全管理<br/>支持调用泛微进行合同签订、电子签章</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">INST-003 档案管理</div>
|
||
<div class="component-desc">资料归档、过程留痕、竣工档案<br/>CA签章/验章/存证</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 基础服务层 -->
|
||
<div class="layer infrastructure">
|
||
<div class="layer-title">
|
||
<div class="layer-icon">IS</div>
|
||
基础服务层 (Infrastructure Service Layer)
|
||
</div>
|
||
<div class="layer-description">
|
||
提供通用的技术服务能力，为业务服务提供统一的技术支撑
|
||
</div>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">权限服务</div>
|
||
<div class="component-desc">RBAC权限控制<br/>多租户数据隔离</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">工作流引擎</div>
|
||
<div class="component-desc">Flowable<br/>业务流程管理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">消息队列</div>
|
||
<div class="component-desc">RabbitMQ<br/>异步消息处理</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">注册/配置中心</div>
|
||
<div class="component-desc">统一配置/注册<br/>服务发现</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">任务调度</div>
|
||
<div class="component-desc">定时任务<br/>批处理调度</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">文件服务</div>
|
||
<div class="component-desc">MinIO<br/>分布式文件存储</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">SYS-008 发票服务子系统</div>
|
||
<div class="component-desc">统一开票网关、供应商适配器（航天优先）<br/>基础路由处理、回执存证、作废/红冲</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">SYS-009 支付与银行结算子系统</div>
|
||
<div class="component-desc">聚合支付/退款、渠道适配（微信/支付宝/银联）<br/>银行代扣送回盘、夜间批量代扣、对账/加解密</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">SYS-010 消息服务子系统</div>
|
||
<div class="component-desc">统一短信/邮件/站内信<br/>固定模板管理、微信通知、对接数科系统</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">摄像表AI系统（外部）</div>
|
||
<div class="component-desc">基于计算机视觉的水表读数自动识别<br/>图像预处理与数字识别、API接口服务</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 数据层 -->
|
||
<div class="layer data">
|
||
<div class="layer-title">
|
||
<div class="layer-icon">DB</div>
|
||
数据层 (Data Layer)
|
||
</div>
|
||
<div class="layer-description">
|
||
数据持久化和缓存层，支持读写分离、分库分表、数据备份，提供高性能、高可用的数据服务
|
||
</div>
|
||
<div class="components">
|
||
<div class="component">
|
||
<div class="component-title">达梦数据库主库</div>
|
||
<div class="component-desc">DM 8.0+<br/>核心业务数据</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">达梦数据库从库</div>
|
||
<div class="component-desc">读写分离<br/>查询负载均衡</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">Redis缓存</div>
|
||
<div class="component-desc">Redis 6.0+<br/>热点数据缓存</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">MinIO对象存储</div>
|
||
<div class="component-desc">分布式对象存储<br/>附件/票据存证</div>
|
||
</div>
|
||
<div class="component">
|
||
<div class="component-title">备份存储</div>
|
||
<div class="component-desc">定期备份<br/>历史数据归档</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 数据流向 -->
|
||
<div class="connections">
|
||
<h3>📊 数据流向关系</h3>
|
||
<div class="flow-diagram">
|
||
<div class="flow-item">用户操作</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">表现层</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">网关层</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">业务服务层</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">基础服务层</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">数据层</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="connections">
|
||
<h3>🔗 关键系统集成关系</h3>
|
||
<div class="flow-diagram">
|
||
<div class="flow-item">营收（SYS-002）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">发票服务（SYS-008）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">发票供应商</div>
|
||
</div>
|
||
<div class="flow-diagram" style="margin-top:6px;">
|
||
<div class="flow-item">营收（SYS-002）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">支付与银行结算（SYS-009）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">银行/支付渠道</div>
|
||
</div>
|
||
<div class="flow-diagram" style="margin-top:6px;">
|
||
<div class="flow-item">营收（SYS-002）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">消息服务（SYS-010）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">短信/邮件/推送</div>
|
||
</div>
|
||
<div class="flow-diagram" style="margin-top:6px;">
|
||
<div class="flow-item">报装（SYS-007）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">CA电子签章</div>
|
||
</div>
|
||
<div class="flow-diagram" style="margin-top:6px;">
|
||
<div class="flow-item">手机抄表APP（SYS-003）</div>
|
||
<div class="arrow">→</div>
|
||
<div class="flow-item">摄像表AI系统（外部）</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 技术栈 -->
|
||
<div class="tech-stack">
|
||
<h3>🛠️ 核心技术栈</h3>
|
||
<div class="tech-grid">
|
||
<div class="tech-category">
|
||
<h4>后端技术</h4>
|
||
<ul class="tech-list">
|
||
<li>Java 17+</li>
|
||
<li>Spring Boot 3.1+</li>
|
||
<li>Spring Cloud Gateway</li>
|
||
<li>MyBatis-Plus</li>
|
||
<li>Spring Security</li>
|
||
</ul>
|
||
</div>
|
||
<div class="tech-category">
|
||
<h4>前端技术</h4>
|
||
<ul class="tech-list">
|
||
<li>Vue 3</li>
|
||
<li>Element Plus</li>
|
||
<li>TypeScript</li>
|
||
<li>uni-app</li>
|
||
<li>微信小程序</li>
|
||
</ul>
|
||
</div>
|
||
<div class="tech-category">
|
||
<h4>数据存储</h4>
|
||
<ul class="tech-list">
|
||
<li>达梦数据库 8.0+</li>
|
||
<li>Redis 6.0+</li>
|
||
<li>MinIO</li>
|
||
<li>分布式架构</li>
|
||
<li>读写分离</li>
|
||
</ul>
|
||
</div>
|
||
<div class="tech-category">
|
||
<h4>中间件</h4>
|
||
<ul class="tech-list">
|
||
<li>RabbitMQ 3.9+</li>
|
||
<li>Flowable</li>
|
||
<li>OAuth2.0 + CAS</li>
|
||
<li>ELK Stack</li>
|
||
<li>Prometheus</li>
|
||
</ul>
|
||
</div>
|
||
<div class="tech-category">
|
||
<h4>部署运维</h4>
|
||
<ul class="tech-list">
|
||
<li>Docker</li>
|
||
<li>Kubernetes</li>
|
||
<li>Nginx</li>
|
||
<li>Jenkins</li>
|
||
<li>Grafana</li>
|
||
</ul>
|
||
</div>
|
||
<div class="tech-category">
|
||
<h4>外部集成</h4>
|
||
<ul class="tech-list">
|
||
<li>微信公众号平台</li>
|
||
<li>微信支付 JSAPI（经SYS-009）</li>
|
||
<li>支付宝支付（经SYS-009）</li>
|
||
<li>银行代扣</li>
|
||
<li>集抄系统</li>
|
||
<li>短信平台/邮件服务（经SYS-010）</li>
|
||
<li>电子发票/CA电子签章</li>
|
||
<li>摄像表AI系统（外部API接口）</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 基础服务详细功能模块 -->
|
||
<div class="details-section" style="background: #f8f9fa; padding: 30px; margin: 30px 0; border-radius: 8px;">
|
||
<h3 style="color: #2c3e50; margin-bottom: 25px; font-size: 1.5rem; text-align: center;">三大基础服务子系统详细功能模块</h3>
|
||
|
||
<div class="service-detail" style="margin-bottom: 25px; background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
|
||
<h4 style="color: #2d5016; border-bottom: 2px solid #2d5016; padding-bottom: 8px;">SYS-008 发票服务子系统</h4>
|
||
<div class="module-list" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; margin-top: 15px;">
|
||
<div class="module-item" style="background: #f1f8e9; padding: 12px; border-radius: 6px; border-left: 4px solid #2d5016;">
|
||
<strong>统一开票网关</strong>：支持增值税电子普通发票、电子专用发票
|
||
</div>
|
||
<div class="module-item" style="background: #f1f8e9; padding: 12px; border-radius: 6px; border-left: 4px solid #2d5016;">
|
||
<strong>供应商适配器</strong>：优先对接航天信息，支持多厂商扩展
|
||
</div>
|
||
<div class="module-item" style="background: #f1f8e9; padding: 12px; border-radius: 6px; border-left: 4px solid #2d5016;">
|
||
<strong>发票管理</strong>：开票、作废、红冲、补开
|
||
</div>
|
||
<div class="module-item" style="background: #f1f8e9; padding: 12px; border-radius: 6px; border-left: 4px solid #2d5016;">
|
||
<strong>回执处理</strong>：开票回执、存证管理、状态同步
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="service-detail" style="margin-bottom: 25px; background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
|
||
<h4 style="color: #2c5282; border-bottom: 2px solid #2c5282; padding-bottom: 8px;">SYS-009 支付与银行结算子系统</h4>
|
||
<div class="module-list" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; margin-top: 15px;">
|
||
<div class="module-item" style="background: #e6f2ff; padding: 12px; border-radius: 6px; border-left: 4px solid #2c5282;">
|
||
<strong>聚合支付网关</strong>：微信支付、支付宝、银联云闪付
|
||
</div>
|
||
<div class="module-item" style="background: #e6f2ff; padding: 12px; border-radius: 6px; border-left: 4px solid #2c5282;">
|
||
<strong>代扣业务</strong>：银行代扣送回盘、夜间批量代扣
|
||
</div>
|
||
<div class="module-item" style="background: #e6f2ff; padding: 12px; border-radius: 6px; border-left: 4px solid #2c5282;">
|
||
<strong>资金清算</strong>：对账处理、退款管理、分润处理
|
||
</div>
|
||
<div class="module-item" style="background: #e6f2ff; padding: 12px; border-radius: 6px; border-left: 4px solid #2c5282;">
|
||
<strong>安全加密</strong>：数据加解密、签名验证、证书管理
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="service-detail" style="margin-bottom: 25px; background: white; padding: 20px; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);">
|
||
<h4 style="color: #8b5a3c; border-bottom: 2px solid #8b5a3c; padding-bottom: 8px;">SYS-010 消息服务子系统</h4>
|
||
<div class="module-list" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; margin-top: 15px;">
|
||
<div class="module-item" style="background: #fdf6f0; padding: 12px; border-radius: 6px; border-left: 4px solid #8b5a3c;">
|
||
<strong>统一消息网关</strong>：短信、邮件、站内信
|
||
</div>
|
||
<div class="module-item" style="background: #fdf6f0; padding: 12px; border-radius: 6px; border-left: 4px solid #8b5a3c;">
|
||
<strong>模板管理</strong>：固定模板配置、多渠道适配
|
||
</div>
|
||
<div class="module-item" style="background: #fdf6f0; padding: 12px; border-radius: 6px; border-left: 4px solid #8b5a3c;">
|
||
<strong>微信通知</strong>：微信模板消息、服务号推送
|
||
</div>
|
||
<div class="module-item" style="background: #fdf6f0; padding: 12px; border-radius: 6px; border-left: 4px solid #8b5a3c;">
|
||
<strong>外部集成</strong>：数科系统对接、第三方渠道扩展
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="footer">
|
||
<p>© 2024 福建水务营收系统 - 基于微服务架构的现代化水务管理平台（简化版） | v1.7</p>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|