BI模块
...大约 2 分钟
BI模块
1.系统设计
BI的核心流程:用户上传文件=》后台智能分析处理(调用AI接口)=》生成图表信息=》前端渲染
核心构建说明:
1)用户文件上传内容、格式限定(初定xls)
2)AI接口调用处理响应时长问题解决方案:
- 方案1:同步(按顺序执行,请求=》调用AI接口=》响应成功生成报表=》渲染报表数据)
- 方案2:异步(CompleteableFeature异步编程):异步处理,先创建报表信息并创建一个任务在后台执行,然后提示用户后台正在处理(待处理完成后更新报表状态并通知用户可查阅)
- 方案3:RabbitMQ消息队列:任务编排,提升响应性能
3)扩展:后续BI模块的优化还可进一步结合其他模型去完善,接入其他好玩的AI模型
模块介绍 | 说明 |
---|---|
后台 | 核心:关注图表信息内容、AI模块的异常 |
1)图表信息 ❌ | 图表信息由用户上传解析触发生成,不需要特别的额外后台管理支持(且如果存在一些敏感数据是需要考虑业务场景的,需要屏蔽一些内容) |
2)限流控制 | AI接口调用次数有限,需进行限流,并监控调用异常的一些信息,以持续优化AI模型的策略设计 |
前台 | 核心:智能分析模块 |
1)智能分析 | 提供三种方案进行智能分析操作 |
2)我的图表 | 智能分析的结果会存储在图表数据中,可跟踪图表生成情况 |
2.系统实现
前端设计
智能分析模块涉及图表渲染,需引入npm install echarts-for-react
插件
智能分析:左侧提交表单内容,右侧展示图表信息
基础构建框架(选用基础组件构建+栅栏格式构建即可)
import React from 'react';
import {PageContainer} from '@ant-design/pro-components';
import { Col, Card, Row } from 'antd';
const Index: React.FC = () => {
return (
<PageContainer>
<Row
gutter={24}
style={{
marginTop: 24,
}}
>
<Col xl={12} lg={24} md={24} sm={24} xs={24}>
<Card>
提交表单
</Card>
</Col>
<Col xl={12} lg={24} md={24} sm={24} xs={24}>
<Card>
图表
</Card>
</Col>
</Row>
</PageContainer>
);
};
export default Index;
后端设计
Powered by Waline v3.1.3