一款用.net core实现的BI工具
第1章 系统概述与登录
1.1 系统功能模块
本平台提供数据可视化大屏的设计、预览、发布能力，主要模块包括：大屏管理、模板管理、数据源、数据集、Excel 报表、数据字典、文件管理、用户管理。
模块 | 路径 | 作用 |
大屏管理 | /screens | 创建、编辑、发布可视化大屏 |
模板管理 | /templates | 管理可复用的大屏模板 |
数据源 | /datasources | 配置 SQL 数据库或 HTTP 接口连接 |
数据集 | /datasets | 定义查询逻辑与查询参数、字段格式 |
Excel 报表 | /excel | 表格类报表设计与发布 |
数据字典 | /dicts | 下拉筛选等控件的选项数据 |
设计器 | /designer/:id | 拖拽式大屏编排与联动配置 |
1.2 登录系统
1. 打开浏览器，访问系统地址（本地开发默认为 http://localhost:8080）。
2. 若未登录，自动跳转至登录页，输入用户名和密码。
3. 点击「登录」进入管理后台，默认进入「大屏管理」页面。
图1-1系统登录页
1.3 大屏列表
1. 点击左侧菜单「大屏管理」进入列表页。
2. 可执行：新建大屏、编辑、预览、发布、分享、删除等操作。
3. 点击「设计」或「编辑」进入大屏设计器。
图1-2大屏管理列表
第2章 数据源与数据集管理
2.1 数据源管理
1. 进入「数据源管理」，点击「新增数据源」。
2. 选择类型：SQL（MySQL/SQL Server 等）或 HTTP。
3. 填写连接信息（主机、端口、库名、账号密码等），保存后可用于数据集绑定。
图2-1数据源管理
2.2 数据集管理
1. 进入「数据集管理」，点击「新增数据集」。
2. 填写名称、选择类型 SQL 或 HTTP。
3. SQL 类型：选择数据源，编写查询语句；HTTP 类型：配置 URL、Method、Body。
4. 配置「查询参数」「字段格式」「数据转换」后保存。
5. 点击「预览」可在不绑定大屏的情况下验证数据与格式。
图2-2数据集列表
图2-3新增/编辑数据集对话框
第3章 查询参数配置（核心）
查询参数是连接「筛选控件↔数据集↔图表/表格」的纽带。参数名在全链路中必须保持一致。
3.1 参数占位符语法
位置 | 写法 | 示例 |
SQL 语句 | ${paramName} 或 #{paramName} | WHERE region='${region}' |
HTTP URL | ${paramName} | https://api.example.com/data?date=${date} |
HTTP Body | ${paramName} | {"dept":"${dept}"} |
大屏全局参数 | 与筛选组件 paramName 一致 | region、startDate 等 |
3.2 数据集「查询参数」JSON 配置
在数据集编辑对话框的「查询参数」文本框中，填写 JSON 数组，用于声明参数元数据：
[{"name":"region","label":"区域","default":"华东"},{"name":"startDate","label":"开始日期","default":"2026-01-01"}]
1. name：参数名，必须与 SQL/HTTP 中 ${name} 占位符一致。
2. label：中文说明，在设计器属性面板中提示设计人员。
3. default：默认值；大屏未传参时使用该默认值执行预览/查询。
4. 保存数据集后，设计器绑定该数据集时会在「数据」标签页显示参数列表。
说明：SQL与HTTP类型数据集均支持查询参数JSON。HTTP数据集会在执行时将default与全局参数合并后替换URL/Body中的占位符。
3.3 字段格式（可选）
同一对话框中的「字段格式」可配置日期格式、小数位数、计算字段（加减乘除），大屏图表与数据集预览会自动继承并格式化显示。
第4章 数据字典
1. 进入「数据字典」，新增字典及字典项（编码、标签、值）。
2. 在大屏设计器中添加「下拉筛选」组件，在属性中填写 dictCode 与 paramName，即可从字典加载选项。
3. 用户选择后，paramName 对应的值写入全局查询参数。
图4-1数据字典管理
第5章 大屏设计器
5.1 设计器界面布局
区域 | 说明 |
左侧组件面板 | 基础/筛选/图表/地图/三维/装饰组件，点击或拖拽添加到画布 |
中间画布 | 1920×1080 设计区域，支持缩放、对齐、分布、图层 |
右侧选项卡 | 属性（组件配置）、画布（页面与默认参数）、联动/传参 |
顶部工具栏 | 撤销重做、缩放、预览、保存、发布、联动调试开关 |
图5-1大屏设计器总览
5.2 添加与配置组件
1. 在左侧选择分类（如「查询筛选」），点击「下拉筛选」「日期筛选」「树形面板」等。
2. 选中画布上的组件，在右侧「属性 → 定制」中配置标签、参数名等。
3. 在「属性 → 数据」中绑定数据集，配置字段映射（X/Y/名称/值字段）。
4. 在「属性 → 样式」中配置容器样式；图表类组件可配置可视化样式与样式代码。
图5-2筛选组件属性配置（参数名paramName）
第6章 查询参数与联动（重点）
6.1 筛选组件与参数名
每种筛选控件的 paramName 即写入全局参数的键名：
组件 | paramName作用 | 特殊说明 |
下拉筛选 selectFilter | 选中项的值 | 可绑定 dictCode 或选项数据集 |
输入筛选 inputFilter | 输入文本 | 可设「变更联动」即时/按钮触发 |
日期筛选 dateFilter | 单个日期值 | 支持年/月/日/周精度 |
日期范围 dateRangeFilter | startParam、endParam 两个参数 | 默认 startDate、endDate |
树形下拉/树形面板 | 选中节点 value | 多选时为逗号分隔 |
查询按钮 queryButton | 不直接产生参数 | 绑定多个筛选组件后统一触发查询 |
6.2 画布「默认参数」
1. 在设计器右侧切换到「画布」选项卡，找到「页面参数 → 默认参数」。
2. 可填写简单 JSON 对象：{"region":"华东","startDate":"2026-01-01"}
3. 或数组形式（带 label）：[{"name":"region","default":"华东","label":"区域"}]
4. 预览、联动调试时以默认参数为初始值；URL 中同名参数会覆盖默认值。
5. 开启「URL 同步」后，预览页会把当前参数写入地址栏，便于分享带参链接。
图6-1画布默认参数与URL同步
6.3 联动/传参面板
1. 右侧切换到「联动/传参」：查看当前大屏所有参数名、传参检查、联动关系。
2. 「参数模拟器」可手动输入参数值，点击「应用参数」测试图表刷新。
3. 为图表启用联动：选择目标图表，配置点击/查询事件的目标组件与参数映射。
4. 「传参检查」会列出各组件所需参数与当前是否已配置筛选来源。
图6-2联动/传参面板
6.4 联动调试模式
1. 打开顶部工具栏「联动调试」开关。
2. 画布上方出现参数调试栏，可实时修改参数并刷新数据组件。
3. 用于设计阶段验证 SQL/HTTP 占位符与筛选控件是否正确传参。
4. 调试完成后关闭开关，保存大屏。
图6-3联动调试与参数栏
6.5 完整传参流程示例
目标：按区域、日期范围查询销售柱状图。
1. 数据集 SQL：SELECT name, value FROM sales WHERE region='${region}' AND dt>='${startDate}' AND dt<='${endDate}'
2. 数据集查询参数 JSON：[{"name":"region","label":"区域","default":""},{"name":"startDate","label":"开始","default":""},{"name":"endDate","label":"结束","default":""}]
3. 大屏添加：下拉筛选 paramName=region；日期范围 startParam=startDate, endParam=endDate；查询按钮绑定上述筛选；柱状图绑定该数据集。
4. 柱状图 interaction.query 目标设为自身或关联表格，启用查询联动。
5. 画布默认参数可设：{"region":"华东","startDate":"2026-01-01","endDate":"2026-01-31"}
6. 预览：修改筛选 → 点击查询（或即时联动）→ 图表按新参数请求数据。
6.6 预览页 URL 传参
预览地址示例：http://localhost:8080/preview/1?region=华南&startDate=2026-02-01&endDate=2026-02-28
说明：分享页/share/:code同样支持URL参数（shareCode除外）。参数会合并画布defaultParams后传给所有数据集请求。
第7章 图表样式与预览发布
7.1 图表可视化样式
1. 选中图表组件，右侧「属性 → 样式」：配置容器透明度、圆角等。
2. 图表样式面板分「可视化」与「样式代码」两个子页。
3. 可视化可配置：标题、图例、坐标轴、Tooltip、配色、柱线样式、动画等。
4. 「样式代码」可编写 ECharts option JSON 片段，与可视化样式深度合并，用于复杂效果。
图7-1图表样式与样式代码
7.2 预览与发布
1. 点击工具栏「预览」在新标签页查看真实比例效果。
2. 确认数据、联动、参数无误后返回设计器，点击「保存」。
3. 点击「发布」使大屏对外可见；可在列表配置分享码、访问密码。
图7-2大屏预览页
第8章 Excel 报表
1. 进入「Excel 报表」，新建报表并进入 Excel 设计器。
2. 绑定数据集，在侧边栏配置查询条件（参数名与数据集占位符一致）。
3. 设计单元格绑定与表头，预览/发布报表。
4. 查询条件支持日期精度（年/月/日/周）配置。