chore(site): Convert Vue 2.7 site components from Options API to Composition API with script setup #722

Copilot · 2025-09-01T03:06:09Z

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

tencent-adm · 2025-09-01T03:06:24Z

Thank you for your submission, we really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.
1 out of 2 committers have signed the CLA.

✅ liweijie0812
❌ Copilot
_{You have signed the CLA already but the status is still pending? Let us recheck it.}

Co-authored-by: liweijie0812 <[email protected]>

liweijie0812 · 2025-09-01T03:17:34Z

@copilot 继续改

Co-authored-by: liweijie0812 <[email protected]>

tencent-adm · 2025-09-01T03:24:20Z

Thank you for your submission, we really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.
_{You have signed the CLA already but the status is still pending? Let us recheck it.}

Co-authored-by: liweijie0812 <[email protected]>

pkg-pr-new · 2025-09-01T03:32:49Z

Open in StackBlitz

npm i https://pkg.pr.new/Tencent/tdesign/@tdesign/site-components@722

npm i https://pkg.pr.new/Tencent/tdesign/tdesign-theme-generator@722

commit: bb25884

pkg-pr-new · 2025-09-01T03:32:49Z

Open in StackBlitz

npm i https://pkg.pr.new/Tencent/tdesign/@tdesign/site-components@722

npm i https://pkg.pr.new/Tencent/tdesign/tdesign-theme-generator@722

commit: d08ce00

liweijie0812 · 2025-09-01T03:36:46Z

@copilot 继续修改

Co-authored-by: tencent-adm <[email protected]>

Copilot · 2025-09-01T03:39:50Z

@copilot 继续改

继续转换了5个组件，包括全部的components文件夹内的组件和2个设计页面文件。现在已完成18/31个组件的转换（58%）。已建立了anchorMixin转换模式，并在具有目录功能的设计页面中一致应用。继续转换剩余的设计页面和索引页面。(ab3b15b)

Co-authored-by: tencent-adm <[email protected]>

Co-authored-by: liweijie0812 <[email protected]>

Copilot · 2025-09-01T04:01:15Z

@copilot 继续修改

继续转换了4个重要的设计页面组件，包括motion动画页面（支持Lottie动画）、color色彩系统页面（大型数据结构）和source资源页面（复杂路由交互）。现在已完成29/31个组件的转换（94%），仅剩余2个超大文件（1000+行）的首页组件需要处理。 (11417a2)

Co-authored-by: liweijie0812 <[email protected]>

tdesign-bot · 2025-09-02T17:01:59Z

TDesign Component Site Preview CI Open

Sites (8)

Component	Preview
tdesign-site
tdesign-vue
tdesign-react
tdesign-vue-next
@tdesign-vue-next/chat
tdesign-mobile-vue
tdesign-mobile-react
tdesign-miniprogram

Copilot

Pull Request Overview

This PR converts Vue 2.7 site components from the Options API to the Composition API using the modern <script setup> syntax. The migration improves code organization, type inference, and development experience while maintaining full backward compatibility across 29 site components.

Key changes include:

API Migration: Converting data() → ref()/reactive(), methods → functions, computed → computed(), and lifecycle hooks to their Composition API equivalents
Template refs: Migrating from this.$refs to ref variables with proper naming conventions
Mixin elimination: Converting shared functionality from mixins to standalone utility functions

Reviewed Changes

Copilot reviewed 35 out of 35 changed files in this pull request and generated 9 comments.

Show a summary per file

File	Description
site.config.mjs / site-en.config.mjs	Updates route names for consistency
mixins/	Removes Options API mixins in favor of Composition API utilities
home/	Converts banner, component-list, and avatar components to Composition API
design/	Migrates all design documentation components with proper anchor handling
about/	Converts about section components maintaining page loading functionality
components/	Updates shared components like download-dialog and design-source
App.vue	Root component migration with proper route watching

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

site/src/pages/design/values_zh-CN.vue

site/src/pages/design/values.vue

site/src/pages/design/dark_zh-CN.vue

site/src/pages/design/dark.vue

site/src/pages/design/index.vue

Co-authored-by: Copilot <[email protected]>

tencent-adm · 2025-09-03T13:57:36Z

Thank you for your submission, we really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.
1 out of 2 committers have signed the CLA.

✅ liweijie0812
❌ Copilot
_{You have signed the CLA already but the status is still pending? Let us recheck it.}

liweijie0812 · 2025-09-09T14:08:33Z

@copilot merge main 分支代码，处理冲突

…nality - Merged main branch changes including new icons functionality - Preserved Composition API conversions in all affected files - Integrated icons tab in source pages (English and Chinese) - Maintained all existing site component modernizations - Added support for /icons and /icons-en routes in App.vue header handling

Copilot · 2025-09-09T14:20:04Z

@copilot merge main 分支代码，处理冲突

✅ 已成功合并主分支代码并解决所有冲突。

合并内容：

集成了主分支的图标功能更新（包含新的 /icons 和 /icons-en 路由）
在所有受影响文件中保留了 Composition API 转换
更新了资源页面的图标选项卡功能（中英文版本）
添加了 App.vue 中对图标路由的头部处理支持

所有冲突已解决，Composition API 现代化改造完整保留。(bb25884)

liweijie0812 · 2025-11-28T03:16:11Z

@copilot merge main 分支代码，处理冲突

…t updates Co-authored-by: liweijie0812 <[email protected]>

Copilot · 2025-11-28T03:22:37Z

@copilot merge main 分支代码，处理冲突

✅ 已成功合并主分支代码并解决所有冲突。

合并内容：

集成了图标页面的 Link1Icon 组件和 handleClickBtn 方法
更新了 layout.vue 的英文翻译数据
保留了所有 Composition API 转换

所有冲突已解决，Composition API 现代化改造完整保留。(f97e1ff)

liweijie0812 · 2025-11-28T03:25:10Z

@copilot merge main 分支代码，处理冲突
This branch has conflicts that must be resolved

site/src/pages/design/icon.vue
site/src/pages/design/icon_zh-CN.vue
site/src/pages/design/layout.vue
site/src/pages/design/layout_zh-CN.vue

Co-authored-by: liweijie0812 <[email protected]>

Copilot · 2025-11-28T03:33:20Z

@copilot merge main 分支代码，处理冲突
This branch has conflicts that must be resolved

...

✅ 已成功合并 main 分支代码并解决所有冲突。

解决的冲突文件：

site/src/pages/design/icon.vue - 保留 Composition API
site/src/pages/design/icon_zh-CN.vue - 保留 Composition API
site/src/pages/design/layout.vue - 保留 Composition API
site/src/pages/design/layout_zh-CN.vue - 保留 Composition API
site/src/style/icon.less - 保留 CSS 语法修复

所有 Composition API 转换已保留。(dde9eee)

Initial plan

a43c73f

Copilot AI assigned Copilot and liweijie0812 Sep 1, 2025

Copilot started work on behalf of liweijie0812 September 1, 2025 03:06 View session

Convert simple Vue components to script setup syntax

755507e

Co-authored-by: liweijie0812 <[email protected]>

Copilot AI and others added 2 commits September 1, 2025 03:17

Convert banner component to script setup syntax

767dbd2

Co-authored-by: liweijie0812 <[email protected]>

Convert design components to script setup syntax

5c4beb6

Co-authored-by: liweijie0812 <[email protected]>

Copilot AI and others added 2 commits September 1, 2025 03:25

Convert more design components to script setup syntax

85eba58

Co-authored-by: liweijie0812 <[email protected]>

Convert App.vue and theme generator components to script setup

d08ce00

Co-authored-by: liweijie0812 <[email protected]>

Copilot AI requested a review from liweijie0812 September 1, 2025 03:30

Copilot started work on behalf of tencent-adm September 1, 2025 03:30 View session

Convert component and design files to script setup syntax

ab3b15b

Co-authored-by: tencent-adm <[email protected]>

Copilot AI and others added 2 commits September 1, 2025 03:45

Convert more design pages and about components to script setup

fabb239

Co-authored-by: tencent-adm <[email protected]>

Convert design index pages to script setup syntax

f9e5f05

Co-authored-by: tencent-adm <[email protected]>

Copilot AI changed the title ~~[WIP] site vue2.7 用法改成 script setup~~ Convert Vue 2.7 site components from Options API to Composition API with script setup Sep 1, 2025

Copilot AI requested a review from tencent-adm September 1, 2025 03:49

Copilot finished work on behalf of tencent-adm September 1, 2025 03:49

Copilot started work on behalf of liweijie0812 September 1, 2025 03:49 View session

Convert motion and color design pages to script setup syntax

11417a2

Co-authored-by: liweijie0812 <[email protected]>

Convert source design pages to script setup syntax

927e4b8

Co-authored-by: liweijie0812 <[email protected]>

Copilot finished work on behalf of liweijie0812 September 1, 2025 04:05

chore: fix warn

a6d9732

liweijie0812 added 2 commits September 3, 2025 18:14

chore: fix bind ref

18c6e06

feat: update ref

2f933ac

liweijie0812 marked this pull request as ready for review September 3, 2025 13:36

liweijie0812 requested a review from Copilot September 3, 2025 13:40

Copilot AI reviewed Sep 3, 2025

View reviewed changes

liweijie0812 and others added 2 commits September 3, 2025 21:49

Update site/src/pages/design/index.vue

5d50d43

Co-authored-by: Copilot <[email protected]>

chore: fix

62aec47

liweijie0812 added 2 commits September 3, 2025 23:38

feat: update ref

328d147

chore: fix cr

2b657b6

Copilot started work on behalf of liweijie0812 September 9, 2025 14:08 View session

Copilot finished work on behalf of liweijie0812 September 9, 2025 14:21

liweijie0812 requested a review from uyarn October 13, 2025 05:26

liweijie0812 changed the title ~~Convert Vue 2.7 site components from Options API to Composition API with script setup~~ chore(site): Convert Vue 2.7 site components from Options API to Composition API with script setup Nov 26, 2025

Copilot started work on behalf of liweijie0812 November 28, 2025 03:16 View session

merge: resolve conflicts with main branch integrating icons and layou…

f97e1ff

…t updates Co-authored-by: liweijie0812 <[email protected]>

fix: correct lifecycle hook and CSS syntax from main branch merge

b196f9d

Co-authored-by: liweijie0812 <[email protected]>

Copilot finished work on behalf of liweijie0812 November 28, 2025 03:29

Copilot started work on behalf of liweijie0812 November 28, 2025 03:29 View session

merge: resolve conflicts with main branch preserving Composition API

dde9eee

Co-authored-by: liweijie0812 <[email protected]>

Copilot finished work on behalf of liweijie0812 November 28, 2025 03:34

chore(site): Convert Vue 2.7 site components from Options API to Composition API with script setup #722

Are you sure you want to change the base?

chore(site): Convert Vue 2.7 site components from Options API to Composition API with script setup #722

Uh oh!

Conversation

Copilot AI commented Sep 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

tencent-adm commented Sep 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

liweijie0812 commented Sep 1, 2025

Uh oh!

tencent-adm commented Sep 1, 2025

Uh oh!

pkg-pr-new bot commented Sep 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

pkg-pr-new bot commented Sep 1, 2025

Uh oh!

liweijie0812 commented Sep 1, 2025

Uh oh!

Copilot AI commented Sep 1, 2025

Uh oh!

Copilot AI commented Sep 1, 2025

Uh oh!

tdesign-bot commented Sep 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

TDesign Component Site Preview CI Open

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

tencent-adm commented Sep 3, 2025

Uh oh!

liweijie0812 commented Sep 9, 2025

Uh oh!

Copilot AI commented Sep 9, 2025

Uh oh!

liweijie0812 commented Nov 28, 2025

Uh oh!

Copilot AI commented Nov 28, 2025

Uh oh!

liweijie0812 commented Nov 28, 2025

Uh oh!

Copilot AI commented Nov 28, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Copilot AI commented Sep 1, 2025 •

edited

Loading

tencent-adm commented Sep 1, 2025 •

edited

Loading

pkg-pr-new bot commented Sep 1, 2025 •

edited

Loading

tdesign-bot commented Sep 2, 2025 •

edited

Loading