上传文件至 /

This commit is contained in:
2025-12-29 14:00:46 +08:00
commit ec7f6d5d2e
5 changed files with 1482 additions and 0 deletions

76
README.md Normal file
View File

@@ -0,0 +1,76 @@
# 报销单数据提取插件
一个Chrome浏览器插件用于从胜意费控云报销单页面提取数据并生成PDF文件。
## 功能特点
- 自动提取报销单页面的基本信息、费用明细和审批信息
- 根据指定模板生成PDF文件
- 支持自定义输出路径
## 安装方法
1. 克隆或下载本项目
2. 在Chrome浏览器中打开 `chrome://extensions/`
3. 启用"开发者模式"
4. 点击"加载已解压的扩展程序"
5. 选择本项目的根目录
## 使用说明
1. 打开胜意费控云报销单页面,例如:`https://djrj.easyfees.cn/fcc/fcecf/entry/index.html?czlx=C&djlx=99006&bxdh=FYBX20251226164`
2. 点击浏览器右上角的插件图标
3. 点击"提取数据并生成PDF"按钮
4. 等待数据提取和PDF生成完成
5. 下载生成的PDF文件
## 项目结构
```
.
├── dist/ # 构建后的文件
├── icons/ # 插件图标
├── src/ # 源代码
│ ├── content.js # 内容脚本,用于提取页面数据
│ └── popup.js # 弹窗脚本用于生成PDF
├── manifest.json # 插件配置文件
├── package.json # 项目依赖配置
├── vite.config.js # Vite配置文件
└── README.md # 项目说明
```
## 技术栈
- Vue 3 + Vite
- Chrome Extension API
- pdf-lib
## 注意事项
1. 请确保已正确配置manifest.json中的权限
2. 请确保模板PDF文件路径正确
3. 若页面结构发生变化可能需要更新content.js中的选择器
## 开发说明
### 安装依赖
```bash
npm install
```
### 构建项目
```bash
npm run build
```
### 开发模式
```bash
npm run dev
```
## 许可证
MIT

17
manifest.json Normal file
View File

@@ -0,0 +1,17 @@
{
"manifest_version": 3,
"name": "报销单数据提取插件",
"version": "1.0",
"description": "提取报销单网页数据并生成PDF",
"permissions": ["activeTab", "tabs", "scripting"],
"host_permissions": ["https://djrj.easyfees.cn/*"],
"action": {
"default_popup": "dist/popup.html"
},
"content_scripts": [
{
"matches": ["https://djrj.easyfees.cn/fcc/fcecf/entry/index.html*"],
"js": ["dist/assets/content.js"]
}
]
}

1322
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

19
package.json Normal file
View File

@@ -0,0 +1,19 @@
{
"name": "baoxiaochajian",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"vue": "^3.5.13",
"pdf-lib": "^1.17.1"
},
"devDependencies": {
"@vitejs/plugin-vue": "^5.2.1",
"vite": "^6.0.3"
}
}

48
popup.html Normal file
View File

@@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>报销单数据提取</title>
<style>
body {
width: 300px;
height: 200px;
padding: 10px;
font-family: Arial, sans-serif;
}
button {
width: 100%;
padding: 10px;
margin: 10px 0;
background-color: #4CAF50;
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
}
button:hover {
background-color: #45a049;
}
.status {
margin-top: 10px;
padding: 10px;
border-radius: 4px;
}
.success {
background-color: #d4edda;
color: #155724;
}
.error {
background-color: #f8d7da;
color: #721c24;
}
</style>
</head>
<body>
<h2>报销单数据提取</h2>
<button id="extractBtn">提取数据并生成PDF</button>
<div id="status" class="status"></div>
<script type="module" src="src/popup.js"></script>
</body>
</html>