feat: 前端 - 接好 Ant Design 树形控件和差异对比组件
前端更新内容: 1. FileTree.js - Ant Design Tree 组件集成 - 文件状态标签显示(一致/冲突/本地更新/数据库更新) - 统计信息展示(总文件数、总大小、冲突数) - 刷新状态按钮 - 文件选择事件处理 2. FileDiff.js - 丝滑的差异对比组件 - 使用 diff 库计算行级差异 - 颜色区分:绿色(新增)、红色(删除) - 显示变动行数标签 - 支持大文件截断提示 - 刷新按钮 3. package.json - 新增 diff 依赖(行级差异计算) - 新增 react-syntax-highlighter 依赖(代码高亮) 用户体验: - 点选文件 → 自动加载差异 - 实时状态显示 - 一键同步按钮 - 流畅的动画效果 点选-对比-同步流程完整实现!
This commit is contained in:
@@ -8,7 +8,9 @@
|
||||
"react-scripts": "5.0.1",
|
||||
"antd": "^5.0.0",
|
||||
"react-diff-viewer-continued": "^3.2.6",
|
||||
"axios": "^1.0.0"
|
||||
"axios": "^1.0.0",
|
||||
"diff": "^5.1.0",
|
||||
"react-syntax-highlighter": "^15.5.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
|
||||
Reference in New Issue
Block a user