feat: s2-vue支持分析组件（与 s2-react-components对齐） #3301

Alexzjt · 2026-01-25T07:12:43Z

👀 PR includes

✨ Feature

New feature s2-vue支持周边组件（与 s2-react-components对齐）

🎨 Enhance

🐛 Bugfix

Solve the issue and close 求支持Vue版本趋势分析表和维度切换组件🙏 #1749

🔧 Chore

📝 Description

🧩 Components Extra (分析组件库)

该目录封装了一系列开箱即用的分析组件，用于增强 S2 表格的交互能力：

核心组件

🔽 drill-down (维度下钻)
提供维度下钻交互能力，支持点击表格单元格后展示下钻菜单，并触发相应的数据下钻操作。
📶 advanced-sort (高级排序)
提供高级排序入口及配置面板，支持对维度值进行“手动排序”或基于字段的“规则排序”。
📤 export (导出)
提供表格数据导出功能，支持常规数据导出及策略导出 (StrategyExport)，方便数据二次分析。
❄️ frozen-panel (冻结配置)
提供行头与列头的冻结配置面板，支持动态设置冻结数量，优化长表格的阅读体验。
🔄 switcher (行列切换)
提供维度切换器，允许用户通过直观的拖拽或勾选操作，动态调整行、列、值维度的配置。
📏 text-align-panel (对齐设置)
提供文字对齐设置面板，用于便捷控制单元格文本的水平或垂直对齐方式。
🎨 theme-panel (主题设置)
提供主题配置面板，支持快速切换或自定义表格主题色系，满足个性化视觉需求。

通用模块

🛠️ common (通用组件)
包含内部复用的通用 UI 组件，例如：
- ResetButton: 重置按钮
- TooltipWrapper: Tooltip 包装器
- RadioGroup: 单选组

🖼️ Screenshot

🔗 Related issue link

🔍 Self-Check before the merge

Add or update relevant docs.
Add or update relevant demos.
Add or update test case.
Add or update relevant TypeScript definitions.

github-actions · 2026-01-25T07:12:51Z

你好 @Alexzjt，非常感谢你的贡献.
为了让代码更健壮, 请根据贡献指南补充相应单元测试 (文档改动或其他特殊场景除外), 如果有 API 改动, 请修改相应的文档.
同时请检查 lint 和 test 相关 CI 是否通过, 如果失败, 请点击 [Details] 按钮查看, 并根据日志修复.

Hello, @Alexzjt, Thanks for your contribution. In order to make the code more robust, please add the corresponding unit tests, and update the docs if there are API changes.
At the same time, please check whether the CI related to lint and test passes. If the CI fails, please click [Details] button to check and repair according to the log.

gemini-code-assist · 2026-01-25T07:13:30Z

Summary of Changes

Hello @Alexzjt, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

此拉取请求通过引入一套与 s2-react-components 对齐的分析组件，显著增强了 s2-vue 库的功能。这些新增的组件为用户提供了更强大的数据交互和自定义能力，例如动态排序、数据导出、表格布局调整和视觉主题管理，从而全面提升了 Vue 应用中 S2 表格的用户体验和分析效率。

Highlights

新增分析组件: 为 s2-vue 引入了一套全面的分析组件，包括维度下钻、高级排序、数据导出、冻结配置、行列切换、文字对齐和主题设置，与 s2-react-components 的功能保持一致。
依赖更新: 新增了 @ant-design/icons-vue、tinycolor2、tinygradient 和 vuedraggable 等依赖，以支持新组件的 UI 和交互功能。
组件演示集成: 在 s2-vue 的 playground 中添加了新的 '组件扩展' 演示页面，方便查看和测试所有新增的分析组件。
问题修复: 解决了求支持Vue版本趋势分析表和维度切换组件🙏 #1749 提及的问题。
代码规范和文档: 对 .agent/skills 目录下的 lint 和单元测试文档进行了细微的格式调整，并更新了 s2-vue 的导出模块，以包含新的 common-extra 和 components-extra。

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	`/gemini review`	Performs a code review for the current pull request in its current state.
Pull Request Summary	`/gemini summary`	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	`/gemini help`	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

gemini-code-assist

Code Review

本次 PR 为 s2-vue 带来了与 s2-react-components 对齐的一系列分析组件，是一次非常大的功能增强。整体实现质量很高，代码结构清晰，充分利用了 Vue 3 的特性（如 <script setup> 和 computed）。
我发现了一些可以改进的地方：

在 AdvancedSort 组件中，存在一个严重的类型安全问题，可能会导致运行时错误。
在 Switcher 组件的工具函数中，发现了一些未使用的代码，可以进行清理。

具体的修改建议请见我的评论。除此之外，新增加的组件和功能都看起来很棒！

packages/s2-vue/src/components-extra/advanced-sort/AdvancedSort.vue

packages/s2-vue/src/components-extra/switcher/util.ts

codecov-commenter · 2026-01-25T07:16:51Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 78.86%. Comparing base (ecdc9c8) to head (9d51b0e).
⚠️ Report is 771 commits behind head on next.

Additional details and impacted files

@@            Coverage Diff             @@
##             next    #3301      +/-   ##
==========================================
+ Coverage   75.77%   78.86%   +3.09%     
==========================================
  Files         257      223      -34     
  Lines       11994    12269     +275     
  Branches     2464     2759     +295     
==========================================
+ Hits         9088     9676     +588     
+ Misses       1398      928     -470     
- Partials     1508     1665     +157

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

github-actions · 2026-01-25T07:19:16Z

Size Change: +33.6 kB (+4.63%) 🔍

Total Size: 759 kB

Filename	Size	Change
`./packages/s2-vue/dist/s2-vue.min.css`	3.8 kB	+1.81 kB (+90.44%)	🆘
`./packages/s2-vue/dist/s2-vue.min.js`	75.3 kB	+31.8 kB (+72.89%)	🆘

ℹ️ View Unchanged

Filename	Size
`./packages/s2-core/dist/s2-extends.min.js`	207 kB
`./packages/s2-core/dist/s2.min.css`	581 B
`./packages/s2-core/dist/s2.min.js`	306 kB
`./packages/s2-react-components/dist/s2-react-components.min.css`	2.55 kB
`./packages/s2-react-components/dist/s2-react-components.min.js`	123 kB
`./packages/s2-react/dist/s2-react.min.css`	1.3 kB
`./packages/s2-react/dist/s2-react.min.js`	38.5 kB

_{compressed-size-action}

github-actions · 2026-01-25T07:19:18Z

你好, @Alexzjt CI 执行失败, 请点击 [Details] 按钮查看, 并根据日志修复

Hello, @Alexzjt CI run failed, please click the [Details] button for detailed log information and fix it.

Alexzjt · 2026-01-25T10:35:12Z

/gemini review

gemini-code-assist

Code Review

这个 PR 是一次重大的功能增强，为 s2-vue 引入了一系列分析组件，使其与 s2-react-components 的功能对齐。新增的组件包括下钻、高级排序、导出、冻结面板、行列切换、文本对齐和主题设置等，极大地丰富了 s2-vue 的能力。代码实现上，大部分是直接从 React 版本移植而来，这有助于保持跨框架的一致性。

整体来看，代码结构清晰，组件划分合理。不过，在一些实现细节上还有提升空间，例如可以加强类型安全、避免使用有潜在问题的深拷贝方式等。此外，package.json 中包体积限制从 38kB 增加到 65kB，这是一个显著的增长，但考虑到新增了大量功能，这是可以预期的。

我已经在代码中提出了一些具体的改进建议，希望能帮助提升代码质量。

packages/s2-vue/src/components-extra/export/Export.vue

packages/s2-vue/src/components-extra/advanced-sort/AdvancedSort.vue

packages/s2-vue/src/components-extra/drill-down/DrillDown.vue

packages/s2-vue/src/components-extra/switcher/SwitcherContent.vue

packages/s2-vue/src/components-extra/theme-panel/ThemePanel.vue

Alexzjt and others added 13 commits January 9, 2026 17:15

feat: 更新s2-vue

c3878c0

Merge branch 'next' of github.com:antvis/S2 into s2-vue

0b56c94

feat: 功能补全

3af18d4

chore: 编辑表用例

e94a64e

test: 更新单测和 Playground

732b40f

fix: drag-copy 功能异常

cda3a04

docs: 去掉 vue 不维护的说明

a112342

feat: s2-vue-components init

59116c5

Merge branch 'next' into s2-vue

0ff1afb

fix(s2-vue): fix TypeScript errors for Ant Design Vue 4 compatibility

bde6b3c

Merge branch 'next' of github.com:antvis/S2 into s2-vue-components

791574b

fix: 文本对齐组件不生效

511710f

feat: 提供Switcher、Advanced Sort、Drill Down、Export

8976dd8

github-actions bot added the pr(feature) new feature label Jan 25, 2026

github-actions bot assigned Alexzjt Jan 25, 2026

github-actions bot added the next 2.0-next 版本的问题 label Jan 25, 2026

gemini-code-assist bot reviewed Jan 25, 2026

View reviewed changes

packages/s2-vue/src/components-extra/advanced-sort/AdvancedSort.vue Show resolved Hide resolved

packages/s2-vue/src/components-extra/switcher/util.ts Outdated Show resolved Hide resolved

github-actions bot added the 🚨 lint failed 静态检查失败 label Jan 25, 2026

refactor: 按照 CR 意见重构

9d51b0e

github-actions bot removed the 🚨 lint failed 静态检查失败 label Jan 25, 2026

gemini-code-assist bot reviewed Jan 25, 2026

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: s2-vue支持分析组件（与 s2-react-components对齐） #3301

feat: s2-vue支持分析组件（与 s2-react-components对齐） #3301

Alexzjt commented Jan 25, 2026

Uh oh!

github-actions bot commented Jan 25, 2026

Uh oh!

gemini-code-assist bot commented Jan 25, 2026

Uh oh!

gemini-code-assist bot left a comment

Uh oh!

Uh oh!

Uh oh!

codecov-commenter commented Jan 25, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Jan 25, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Jan 25, 2026

Uh oh!

Alexzjt commented Jan 25, 2026

Uh oh!

gemini-code-assist bot left a comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

feat: s2-vue支持分析组件（与 s2-react-components对齐） #3301

Are you sure you want to change the base?

feat: s2-vue支持分析组件（与 s2-react-components对齐） #3301

Conversation

Alexzjt commented Jan 25, 2026

👀 PR includes

📝 Description

🧩 Components Extra (分析组件库)

核心组件

通用模块

🖼️ Screenshot

🔗 Related issue link

🔍 Self-Check before the merge

Uh oh!

github-actions bot commented Jan 25, 2026

Uh oh!

gemini-code-assist bot commented Jan 25, 2026

Summary of Changes

Highlights

Footnotes

Uh oh!

gemini-code-assist bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

Uh oh!

Uh oh!

codecov-commenter commented Jan 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

github-actions bot commented Jan 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jan 25, 2026

Uh oh!

Alexzjt commented Jan 25, 2026

Uh oh!

gemini-code-assist bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

codecov-commenter commented Jan 25, 2026 •

edited

Loading

github-actions bot commented Jan 25, 2026 •

edited

Loading