FlathubCN Apps - Linux 应用商店

一个现代化的 Flathub 中文前端界面，为中文用户提供更好的 Linux 应用浏览、搜索和管理体验。

✨ 主要特性

🎨 现代化界面: 基于 Bootstrap 5 的响应式设计
🔍 智能搜索: 快速搜索和浏览 Flathub 应用
📦 应用管理: 支持安装、卸载、更新 Flatpak 应用
🎯 任务队列: 异步任务管理，支持多任务并发和取消
📊 实时日志: 操作过程中的实时日志输出
🌐 本地化: 完整的中文界面支持
⚡ 性能优化: 使用 Vite 构建，快速加载
📱 PWA 支持: 可安装为桌面应用

技术栈

框架: Vue 3 (Composition API)
路由: Vue Router 4
UI 框架: Bootstrap 5
图标: Bootstrap Icons
构建工具: Vite
语言: JavaScript (ES6+)

快速开始

环境要求

Node.js >= 16
npm >= 8

安装依赖


npm install

开发模式

启动开发服务器（支持热重载）：


npm run dev

访问 http://localhost:5173

构建生产版本


npm run build

构建产物位于 dist/ 目录。

预览生产构建


npm run preview

项目结构


Flathub-Website/
├── public/              # 静态资源
│   └── logo.png        # 项目 Logo
├── src/
│   ├── components/     # Vue 组件
│   │   ├── AppCard.vue           # 应用卡片组件
│   │   ├── CategoryAppList.vue   # 分类应用列表组件
│   │   ├── CodeBlock.vue         # 代码块组件
│   │   ├── SkeletonLoader.vue    # 骨架屏组件
│   │   └── TaskFloatingButton.vue # 任务队列浮动按钮
│   ├── composables/    # 组合式函数
│   │   ├── useAppManager.js  # 应用管理逻辑
│   │   └── useTaskQueue.js   # 任务队列管理
│   ├── router/         # 路由配置
│   │   └── index.js    # 路由定义和标题管理
│   ├── services/       # API 服务
│   │   ├── api.js      # Flathub API 封装
│   │   └── localApi.js # 本地 API 服务封装
│   ├── utils/          # 工具函数
│   │   ├── imageUtils.js # 图片处理工具
│   │   └── message.js    # 消息提示工具
│   ├── views/          # 页面组件
│   │   ├── Home.vue         # 首页
│   │   ├── Category.vue     # 分类页
│   │   ├── Search.vue       # 搜索页
│   │   ├── Detail.vue       # 应用详情页
│   │   ├── About.vue        # 关于页
│   │   ├── Status.vue       # 状态监控页
│   │   ├── PackageManager.vue # 包管理器页面
│   │   ├── Settings.vue     # 设置页面
│   │   └── NotFound.vue     # 404 页面
│   ├── App.vue         # 根组件
│   ├── main.js         # 应用入口
│   └── style.css       # 全局样式
├── index.html          # HTML 入口
├── vite.config.js      # Vite 配置
└── package.json        # 项目配置