# EXCEL Preview

**Repository Path**: bidding-M/excel-preview

## Basic Information

- **Project Name**: EXCEL Preview
- **Description**: 基于 Vue 3 + SheetJS + x-data-spreadsheet 的 Excel 文件在线预览工具，支持本地文件上传和远程 URL 加载。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

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

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Excel 文件预览

基于 **Vue 3 + SheetJS + x-data-spreadsheet** 的 Excel 文件在线预览工具，支持本地文件上传和远程 URL 加载。

## 功能特性

- 📂 **本地文件上传** — 点击按钮或拖拽上传 `.xlsx`、`.xls`、`.csv` 文件
- 🔗 **远程 URL 加载** — 输入在线 Excel 地址直接预览
- 📑 **多 Sheet 支持** — 自动识别并切换工作簿中的多个 Sheet
- 🎨 **美观 UI** — 渐变背景、卡片式布局，现代化设计
- 📱 **响应式** — 适配不同屏幕尺寸
- ⚡ **按需加载** — 依赖库动态导入，减小首屏体积

## 技术栈

| 技术 | 用途 |
|------|------|
| Vue 3 | 前端框架 |
| Vite | 构建工具 |
| SheetJS (xlsx) | Excel 文件解析 |
| x-data-spreadsheet | 在线表格渲染 |
| Less | CSS 预处理 |

## 快速开始

```bash
# 安装依赖
npm install

# 启动开发服务器
npm run dev

# 构建生产版本
npm run build

# 预览构建结果
npm run preview
```

开发服务器默认运行在 `http://localhost:1001`。

## 使用说明

1. **上传本地文件**：点击「选择本地 Excel」按钮，或直接将文件拖拽到虚线区域
2. **加载远程文件**：在输入框中填入 Excel 文件的在线地址，点击「加载」按钮
3. **切换 Sheet**：文件加载后，底部会自动显示 Sheet 标签，点击即可切换
4. 支持的格式：`.xlsx`、`.xls`、`.csv`

## 项目结构

```
excel-preview/
├── index.html          # 入口 HTML
├── package.json        # 项目配置
├── vite.config.js      # Vite 构建配置
└── src/
    ├── main.js         # 应用入口
    └── App.vue         # 主组件（包含全部业务逻辑）
```

## License

MIT