# Doc_Viewer

**Repository Path**: liaojunkun/Doc_Viewer

## Basic Information

- **Project Name**: Doc_Viewer
- **Description**: 基于 Vue 3 + Vite 构建的文档预览测试平台，集成 `@flyfish-group/file-viewer3` 组件，提供多种文档预览、管理和测试功能。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-06-10
- **Last Updated**: 2026-06-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Doc Viewer - 文档预览测试平台

基于 Vue 3 + Vite 构建的文档预览测试平台，集成 `@flyfish-group/file-viewer3` 组件，提供多种文档预览、管理和测试功能。

## 功能特性

- **文档预览**：支持 PDF、Word、Excel、PPT、TXT 等格式的本地文件预览
- **URL 预览**：通过输入文档 URL 进行在线预览
- **批量管理**：多文件上传、列表管理、拖拽排序，LRU 缓存策略控制内存
- **标注注笔记**：预览档时添加审阅笔记，支持搜索、编辑，localStorage 持久化
- **格式转换测试**：模拟文档格式转换流程，含进度条和转换历史记录
- **全局暗黑/日间主题**：一键切换，所有页面同步响应，偏好自动持久化
- **标签页系统**：类浏览器标签页体验，支持拖拽排序、右键右键菜单、KeepAlive态保持
- **可折叠导航栏**：收起时显示图标 + Tooltip，展开时显示完整标签

## 技术栈

| 类别 | 技术 |
|------|------|
| 框架 | Vue 3.5 (Composition API) |
| 构建工具 | Vite 8 |
| 路由 | Vue Router 5 |
| 状态管理 | Pinia 3 |
| 文档预览 | @flyfish-group/file-viewer3 |
| 代码规范 | ESLint + OxLint + Prettier |
| Node 版本 | ^20.19.0 \|\| >=22.12.0 |

## 项目结构



## 快速开始



## 页面说明

| 路由 | 页面 | 说明 |
|------|------|------|
| `/` | 文档档预览 | 首页，固定标签不可闭，支持拖拽上传 |
| `/about` | URL 预览 | 输入文档 URL 或拖拽文件进行预览 |
| `/batch` | 批量管理 | 多文件管理，拖拽排序，LRU 缓存（最多5个 viewerr） |
|`/annotation` | 标注笔记 | 文档预览 + 右侧笔记面板，支持搜索和编辑 |
| `/format-test` | 格式转换 | 模拟转换换流程，含进度示和历史记录 |
| `/test` || Test | 基础文件预览测试页 |
| `/est2` | Test2 | 赛博朋克风格文件预览，独立主题切换 |

## 标签页功能

- **点击导航项**：自动新建标签页并切换
- ****拖拽排序**：鼠标拖拽签改变序（首页固定固定不可拖拽） **右键菜单**：刷新 / 关闭 / 关闭其他 / 全部关闭 / 当前页全屏
- **中键关闭**：鼠标中键点击标签直接关闭
- **状态保持**：KeepAlive 缓存已打开页面，切换不丢失内容
- **全屏模式**：右上角四分之一圆形按钮退出全屏

## 主题系统系统

通过 CSS量实现全局主题切换，覆盖以下维度：

- 导航栏背景/文字/激活态
-
- 页面/卡片/工具栏
--输入框/按钮/边框
- 滚动条/阴影/遮罩
-- 标签页指示条激活背景

主题偏好存储在 `localStorage`，刷新后自动恢复。