c2e7b2c70f
功能增强： 为首页项目列表中的ProjectCard添加了丰富的统计信息展示和便捷的文件夹操作功能， 让用户能够快速了解项目状态并方便地访问项目文件。 新增功能： 1. 项目统计信息展示： - 自动加载项目素材统计数据 - 显示素材总数和总文件大小 - 按类型分类显示（视频、音频、图片、其他） - 使用颜色编码区分不同文件类型 2. 打开文件夹功能： - 底部按钮栏新增文件夹图标按钮 - 下拉菜单中添加'打开文件夹'选项 - 支持Windows长路径格式处理 - 双重备用机制确保兼容性 3. 加载状态优化： - 统计信息加载时显示加载状态 - 静默处理加载失败，不影响卡片显示 - 优雅的动画效果 技术实现： 1. 统计数据获取： - 使用get_project_material_stats命令 - React hooks管理状态 - useEffect自动加载数据 2. 文件夹操作： - 集成@tauri-apps/plugin-opener - 路径标准化处理 - 错误处理和用户提示 3. UI设计： - 统计信息卡片式展示 - 图标+数字的直观显示 - 响应式布局适配 4. 数据格式化： - formatFileSize函数处理文件大小 - 智能单位转换（B/KB/MB/GB/TB） 视觉效果： 项目统计信息一目了然 文件类型分布清晰展示 便捷的文件夹访问按钮 加载状态友好提示 颜色编码增强可读性 用户体验： - 快速了解项目规模和内容 - 一键打开项目文件夹 - 直观的文件类型分布 - 流畅的交互体验 现在首页的项目卡片功能更加完善，用户可以快速了解项目状态并便捷地进行文件管理！ |
||
|---|---|---|
| .. | ||
| public | ||
| src | ||
| src-tauri | ||
| .gitignore | ||
| README.md | ||
| index.html | ||
| package.json | ||
| postcss.config.js | ||
| tailwind.config.js | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||
| vitest.config.ts | ||
README.md
@mixvideo/desktop
MixVideo 桌面应用 - 基于 Tauri + React + TypeScript 构建的跨平台桌面应用。
🚀 快速开始
开发环境要求
- Node.js 18+
- Rust 1.70+
- PNPM 8+
安装依赖
pnpm install
开发模式
pnpm dev
# 或
pnpm tauri:dev
构建应用
pnpm tauri:build
📁 项目结构
apps/desktop/
├── src/ # React 前端源码
│ ├── components/ # React 组件
│ ├── pages/ # 页面组件
│ ├── hooks/ # 自定义 Hooks
│ ├── services/ # API 服务
│ ├── types/ # TypeScript 类型
│ └── utils/ # 工具函数
├── src-tauri/ # Rust 后端源码
│ ├── src/ # Rust 源码
│ ├── Cargo.toml # Rust 依赖配置
│ └── tauri.conf.json # Tauri 配置
├── public/ # 静态资源
└── package.json # 前端依赖配置
🛠️ 技术栈
- 前端: React 18 + TypeScript + Vite
- 后端: Rust + Tauri 2.0
- UI: 待定 (可选择 Ant Design、Material-UI 等)
- 状态管理: 待定 (可选择 Zustand、Redux Toolkit 等)