本文将详细介绍如何从零搭建一个用于档案整理数据进度的软件系统。这个系统将帮助你实现档案的数字化管理、进度追踪和数据分析,无需依赖任何商业软件,完全自主可控。
一、系统核心功能与架构设计
我们构建的系统将包含以下三个核心模块:档案录入与存储模块、进度追踪与更新模块、数据查询与统计模块。系统采用B/S架构,前端使用HTML+CSS+JavaScript,后端使用Python Flask框架,数据库使用SQLite(轻量,适合起步)。
1.1 技术栈与工具准备
确保你的计算机已安装以下软件,这是后续所有操作的基础。
二、项目初始化与基础环境搭建
打开你的终端(Windows上是CMD或PowerShell,macOS/Linux是Terminal),按顺序执行以下命令。
2.1 创建项目目录与虚拟环境
虚拟环境可以隔离项目依赖,避免包冲突。
```bash
创建项目文件夹并进入
mkdir archive_progress_system
cd archive_progress_system
创建Python虚拟环境
python -m venv venv
激活虚拟环境
Windows:
venv\Scripts\activate
macOS/Linux:
source venv/bin/activate
```
激活后,命令行提示符前会出现(venv)标识。
2.2 安装核心依赖库
在激活的虚拟环境中,执行以下安装命令。
```bash
pip install flask flask-sqlalchemy
```
这里安装了Web框架Flask和数据库ORM工具Flask-SQLAlchemy。
三、数据库模型设计与实现
在项目根目录下,创建一个名为app.py的文件,这是我们的主程序文件。
3.1 定义档案数据表结构
用代码打开app.py,首先导入依赖并初始化应用,然后定义“档案”这个核心数据模型。
```python
from flask import Flask, render_template, request, redirect, url_for, jsonify
from flask_sqlalchemy import SQLAlchemy
import os
app = Flask(__name__)
配置SQLite数据库路径
basedir = os.path.abspath(os.path.dirname(__file__))
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///' + os.path.join(basedir, 'archive.db')
app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
db = SQLAlchemy(app)
定义档案数据模型(表结构)
class Archive(db.Model):
id = db.Column(db.Integer, primary_key=True)
档案编号,唯一标识
archive_id = db.Column(db.String(50), unique=True, nullable=False)
档案名称
name = db.Column(db.String(200), nullable=False)
所属部门
department = db.Column(db.String(100))
档案类型,如合同、人事、财务等
archive_type = db.Column(db.String(50))
当前状态:待整理、整理中、已归档、待复核、已完成
status = db.Column(db.String(20), default='待整理')
整理进度,0-100的整数
progress = db.Column(db.Integer, default=0)
负责人
responsible_person = db.Column(db.String(50))
创建日期,自动记录
create_date = db.Column(db.DateTime, default=db.func.current_timestamp())
最后更新日期,自动更新
update_date = db.Column(db.DateTime, default=db.func.current_timestamp(), onupdate=db.func.current_timestamp())
备注信息
remarks = db.Column(db.Text)
def to_dict(self):
将对象转换为字典,方便API返回JSON
return {c.name: getattr(self, c.name) for c in self.__table__.columns}
```
这个模型涵盖了档案管理所需的核心字段。status和progress是追踪进度的关键字段。
3.2 创建数据库表
在app.py文件末尾,添加以下代码来创建数据库和表。
```python
在应用上下文中创建所有表
with app.app_context():
db.create_all()
print("数据库表创建成功!")
```

现在,在终端中运行一次这个文件来初始化数据库。
```bash
python app.py
```
运行后,项目目录下会生成一个archive.db的数据库文件。
四、后端API接口开发
API是前端与后端通信的桥梁。我们在app.py中继续添加以下路由(接口)。
4.1 添加新档案接口
此接口接收前端表单数据,创建一条新的档案记录。
```python
@app.route('/api/archive', methods=['POST'])
def add_archive():
data = request.get_json()
检查必要字段
if not data or not data.get('archive_id') or not data.get('name'):
return jsonify({'error': '缺少必要字段(档案编号和名称)'}), 400
new_archive = Archive(
archive_id=data['archive_id'],
name=data['name'],
department=data.get('department', ''),
archive_type=data.get('archive_type', ''),
responsible_person=data.get('responsible_person', ''),
remarks=data.get('remarks', '')
)
try:
db.session.add(new_archive)
db.session.commit()
return jsonify({'message': '档案添加成功', 'id': new_archive.id}), 201
except Exception as e:
db.session.rollback()
return jsonify({'error': f'添加失败: {str(e)}'}), 500
```
4.2 更新档案进度接口
这是核心功能,用于更新档案的状态和进度百分比。
```python
@app.route('/api/archive/
/progress', methods=['PUT'])
def update_progress(archive_id):
data = request.get_json()
archive = Archive.query.get_or_404(archive_id)
更新进度和状态
if 'progress' in data:
progress_val = int(data['progress'])
if 0 <= progress_val <= 100:
archive.progress = progress_val
根据进度自动建议状态(可自定义规则)
if progress_val == 0:
archive.status = '待整理'
elif 0 < progress_val < 100:
archive.status = '整理中'
elif progress_val == 100:
archive.status = '已完成'
else:
return jsonify({'error': '进度值必须在0-100之间'}), 400
允许直接更新状态
if 'status' in data:
archive.status = data['status']
try:
db.session.commit()
return jsonify({'message': '进度更新成功'}), 200
except Exception as e:
db.session.rollback()
return jsonify({'error': f'更新失败: {str(e)}'}), 500
```
4.3 查询与统计接口
提供按条件查询档案列表和整体进度统计的功能。
```python
@app.route('/api/archives', methods=['GET'])
def get_archives():
获取查询参数,如部门、类型、状态
department = request.args.get('department')
archive_type = request.args.get('type')
status = request.args.get('status')
query = Archive.query
if department:
query = query.filter_by(department=department)
if archive_type:
query = query.filter_by(archive_type=archive_type)
if status:
query = query.filter_by(status=status)
archives = query.all()
return jsonify([archive.to_dict() for archive in archives])
@app.route('/api/statistics', methods=['GET'])
def get_statistics():
统计各状态档案数量及总平均进度
total = Archive.query.count()
status_counts = {}
for status in ['待整理', '整理中', '已归档', '待复核', '已完成']:
count = Archive.query.filter_by(status=status).count()
status_counts[status] = count
avg_progress = db.session.query(db.func.avg(Archive.progress)).scalar() or 0
return jsonify({
'total_archives': total,
'status_distribution': status_counts,
'average_progress': round(float(avg_progress), 2)
})
```
五、前端界面开发
在项目根目录下创建一个templates文件夹,并在其中创建index.html。这是一个功能完整的单页面应用。
5.1 基础HTML结构与样式
由于篇幅,这里给出核心HTML结构和一个极简的CSS内联样式,确保界面清晰可用。实际开发中可将CSS放入独立文件。
```html
档案整理进度管理系统
档案整理数据进度管理软件
1. 新增档案
```
5.2 核心JavaScript逻辑
在static文件夹(需创建)或项目根目录下创建main.js,实现与后端API的交互。
```javascript
// 定义API基础地址
const API_BASE = 'http://127.0.0.1:5000/api';
// 1. 添加档案
async function addArchive() {
const data = {
archive_id: document.getElementById('archiveId').value,
name: document.getElementById('archiveName').value,
department: document.getElementById('department').value,
archive_type: document.getElementById('archiveType').value,
responsible_person: document.getElementById('responsiblePerson').value
};
const resp = await fetch(`${API_BASE}/archive`, {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify(data)
});
const result = await resp.json();
alert(result.message || result.error);
if(resp.ok) {
// 清空表单并刷新列表
document.getElementById('archiveId').value = '';
document.getElementById('archiveName').value = '';
loadArchives();
loadStatistics();
}
}
// 2. 加载并渲染档案列表
async function loadArchives(deptFilter='', statusFilter='') {
let url = `${API_BASE}/archives`;
const params = new URLSearchParams();
if(deptFilter) params.append('department', deptFilter);
if(statusFilter) params.append('status', statusFilter);
if(params.toString()) url += '?' + params.toString();
const resp = await fetch(url);
const archives = await resp.json();
const tbody = document.querySelector('archiveTable tbody');
tbody.innerHTML = '';
archives.forEach(arch => {
const row = tbody.insertRow();
row.innerHTML = `
${arch.archive_id} |
${arch.name} |
${arch.department} |
${arch.status} |
|
|
`;
});
}
// 3. 更新进度(核心功能)
async function updateProgress(archiveId, progressValue) {
const resp = await fetch(`${API_BASE}/archive/${archiveId}/progress`, {
method: 'PUT',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({progress: progressValue})
});
if(resp.ok) {
loadArchives(); // 刷新列表显示新进度
loadStatistics(); // 刷新统计
}
}
// 4. 加载统计数据
async function loadStatistics() {
const resp = await fetch(`${API_BASE}/statistics`);
const stats = await resp.json();
const board = document.getElementById('statisticsBoard');
let html = `档案总数:${stats.total_archives}
`;
html += `平均进度:${stats.average_progress}%
`;
html += `状态分布:
`;
for(const [status, count] of Object.entries(stats.status_distribution)) {
html += `- ${status}: ${count} 份
`;
}
html += `
`;
board.innerHTML = html;
}
// 5. 表格筛选函数
function filterTable() {
const dept = document.getElementById('filterDept').value;
const status = document.getElementById('filterStatus').value;
loadArchives(dept, status);
}
// 6. 删除档案(可选功能)
async function deleteArchive(archiveId) {
if(!confirm('确定要删除这条档案记录吗?')) return;
// 注意:需要在app.py中实现DELETE接口,此处为示例,请先补充接口。
// const resp = await fetch(`${API_BASE}/archive/${archiveId}`, {method: 'DELETE'});
// if(resp.ok) loadArchives();
alert('请在app.py中实现DELETE /api/archive/接口后启用此功能');
}
// 页面加载时初始化
window.onload = function() {
loadArchives();
loadStatistics();
};
```
六、系统运行与部署
6.1 启动本地开发服务器
在app.py文件末尾,添加启动代码,并确保它不在创建数据库的上下文块中。
```python