用户系统

This commit is contained in:
2025-10-04 11:51:08 +08:00
parent 657365f9de
commit 5575370621
11 changed files with 4043 additions and 96 deletions

View File

@@ -1,9 +1,8 @@
from elasticsearch import Elasticsearch
import os
import json
# import os
# import json
import hashlib
import requests
import json
# Elasticsearch连接配置
ES_URL = "http://localhost:9200"
@@ -15,14 +14,16 @@ AUTH = None # 如需认证则改为("用户名","密码")
es = Elasticsearch(["http://localhost:9200"])
# 定义索引名称和类型名称
index_name = "wordsearch2666"
data_index_name = "wordsearch266666"
users_index_name = "users"
def create_index_with_mapping():
"""修正后的索引映射配置"""
# 修正映射结构移除keyword字段的非法参数
mapping = {
# 新增一个用户mapping
data_mapping = {
"mappings": {
"properties": {
"writer_id":{"type": "text"},
"data": {
"type": "text", # 存储转换后的字符串,支持分词搜索
"analyzer": "ik_max_word",
@@ -33,13 +34,32 @@ def create_index_with_mapping():
}
}
# 检查索引是否存在,不存在则创建
if not es.indices.exists(index=index_name):
es.indices.create(index=index_name, body=mapping)
print(f"创建索引 {index_name} 并设置映射")
else:
print(f"索引 {index_name} 已存在")
users_mapping = {
"mappings": {
"properties": {
"user_id":{"type":"long"}, #由系统分配的用户唯一id
"username":{"type":"keyword"}, #可修改的用户名
"password":{"type":"keyword"}, #密码
"premission":{"type":"integer"},#权限组分配比方说0就是管理员1是普通用户以此类推
}
}
}
# 检查数据索引是否存在,不存在则创建
if not es.indices.exists(index=data_index_name):
es.indices.create(index=data_index_name, body=data_mapping)
print(f"创建索引 {data_index_name} 并设置映射")
else:
print(f"索引 {data_index_name} 已存在")
# 检查用户索引是否存在,不存在则创建
if not es.indices.exists(index=users_index_name):
es.indices.create(index=users_index_name, body=users_mapping)
print(f"创建索引 {users_index_name} 并设置映射")
admin={"user_id":0000000000,"username": "admin", "password": "admin", "premission": 0}
write_user_data(admin)
else:
print(f"索引 {users_index_name} 已存在")
def get_doc_id(data):
@@ -85,7 +105,7 @@ def search_data(query):
list: 包含搜索结果的列表,每个元素是一个文档的源数据
"""
# 执行多字段匹配搜索
result = es.search(index=index_name, body={"query": {"multi_match": {"query": query, "fields": ["*"]}}})
result = es.search(index=data_index_name, body={"query": {"multi_match": {"query": query, "fields": ["*"]}}})
# 返回搜索结果的源数据部分
return [hit["_source"] for hit in result['hits']['hits']]
@@ -97,7 +117,7 @@ def search_all():
list: 包含所有文档的列表每个元素包含文档ID和源数据
"""
# 执行匹配所有文档的查询
result = es.search(index=index_name, body={"query": {"match_all": {}}})
result = es.search(index=data_index_name, body={"query": {"match_all": {}}})
# 返回包含文档ID和源数据的列表
return [{
"_id": hit["_id"],
@@ -116,7 +136,7 @@ def delete_by_id(doc_id):
"""
try:
# 执行删除操作
es.delete(index=index_name, id=doc_id)
es.delete(index=data_index_name, id=doc_id)
return True
except Exception as e:
print("删除失败:", str(e))
@@ -125,9 +145,9 @@ def delete_by_id(doc_id):
def search_by_any_field(keyword):
"""全字段模糊搜索(支持拼写错误)"""
try:
# update_mapping()
# update_data_mapping()
response = requests.post(
f"{ES_URL}/{index_name}/_search",
f"{ES_URL}/{data_index_name}/_search",
auth=AUTH,
json={
"query": {
@@ -163,7 +183,7 @@ def batch_write_data(data):
"""批量写入获奖数据"""
try:
response = requests.post(
f"{ES_URL}/{index_name}/_doc",
f"{ES_URL}/{data_index_name}/_doc",
json=data,
auth=AUTH,
headers={"Content-Type": "application/json"}
@@ -175,3 +195,538 @@ def batch_write_data(data):
except requests.exceptions.HTTPError as e:
print(f"文档写入失败: {e.response.text}, 数据: {data}")
return False
def write_user_data(data):
"""写入用户数据"""
try:
response = requests.post(
f"{ES_URL}/{users_index_name}/_doc",
json=data,
auth=AUTH,
headers={"Content-Type": "application/json"}
)
response.raise_for_status()
doc_id = response.json()["_id"]
print(f"文档写入成功ID: {doc_id}, 内容: {data}")
return True
except requests.exceptions.HTTPError as e:
print(f"文档写入失败: {e.response.text}, 数据: {data}")
return False
def verify_user(username, password):
"""
验证用户登录信息
参数:
username (str): 用户名
password (str): 密码
返回:
dict or None: 验证成功返回用户信息失败返回None
"""
try:
# 搜索用户名匹配的用户
response = requests.post(
f"{ES_URL}/{users_index_name}/_search",
auth=AUTH,
json={
"query": {
"term": {
"username": username
}
}
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
if results:
user_data = results[0]["_source"]
# 验证密码
if user_data.get("password") == password:
print(f"用户 {username} 登录成功")
return user_data
else:
print(f"用户 {username} 密码错误")
return None
else:
print(f"用户 {username} 不存在")
return None
except requests.exceptions.HTTPError as e:
print(f"用户验证失败: {e.response.text}")
return None
def get_user_by_username(username):
"""
根据用户名查询用户信息
参数:
username (str): 用户名
返回:
dict or None: 查询成功返回用户信息失败返回None
"""
try:
response = requests.post(
f"{ES_URL}/{users_index_name}/_search",
auth=AUTH,
json={
"query": {
"term": {
"username": username
}
}
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
if results:
return results[0]["_source"]
else:
return None
except requests.exceptions.HTTPError as e:
print(f"用户查询失败: {e.response.text}")
return None
def create_user(username, password, permission=1):
"""
创建新用户
参数:
username (str): 用户名
password (str): 密码
permission (int): 权限级别默认为1普通用户
返回:
bool: 创建成功返回True失败返回False
"""
# 检查用户名是否已存在
if get_user_by_username(username):
print(f"用户名 {username} 已存在")
return False
# 生成新的用户ID
import time
user_id = int(time.time() * 1000) # 使用时间戳作为用户ID
user_data = {
"user_id": user_id,
"username": username,
"password": password,
"premission": permission
}
return write_user_data(user_data)
def get_all_users():
"""
获取所有用户信息
返回:
list: 包含所有用户信息的列表
"""
try:
response = requests.post(
f"{ES_URL}/{users_index_name}/_search",
auth=AUTH,
json={
"query": {
"match_all": {}
},
"size": 1000 # 限制返回数量,可根据需要调整
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
users = []
for hit in results:
user_data = hit["_source"]
user_data["_id"] = hit["_id"] # 添加文档ID用于后续操作
users.append(user_data)
return users
except requests.exceptions.HTTPError as e:
print(f"获取用户列表失败: {e.response.text}")
return []
def update_user_password(username, new_password):
"""
更新用户密码
参数:
username (str): 用户名
new_password (str): 新密码
返回:
bool: 更新成功返回True失败返回False
"""
try:
# 先查找用户
response = requests.post(
f"{ES_URL}/{users_index_name}/_search",
auth=AUTH,
json={
"query": {
"term": {
"username": username
}
}
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
if not results:
print(f"用户 {username} 不存在")
return False
# 获取用户文档ID
doc_id = results[0]["_id"]
user_data = results[0]["_source"]
# 更新密码
user_data["password"] = new_password
# 更新文档
update_response = requests.post(
f"{ES_URL}/{users_index_name}/_doc/{doc_id}",
auth=AUTH,
json=user_data,
headers={"Content-Type": "application/json"}
)
update_response.raise_for_status()
print(f"用户 {username} 密码更新成功")
return True
except requests.exceptions.HTTPError as e:
print(f"更新用户密码失败: {e.response.text}")
return False
def delete_user(username):
"""
删除用户
参数:
username (str): 要删除的用户名
返回:
bool: 删除成功返回True失败返回False
"""
try:
# 防止删除管理员账户
if username == "admin":
print("不能删除管理员账户")
return False
# 先查找用户
response = requests.post(
f"{ES_URL}/{users_index_name}/_search",
auth=AUTH,
json={
"query": {
"term": {
"username": username
}
}
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
if not results:
print(f"用户 {username} 不存在")
return False
# 获取用户文档ID
doc_id = results[0]["_id"]
# 删除用户
delete_response = requests.delete(
f"{ES_URL}/{users_index_name}/_doc/{doc_id}",
auth=AUTH
)
delete_response.raise_for_status()
print(f"用户 {username} 删除成功")
return True
except requests.exceptions.HTTPError as e:
print(f"删除用户失败: {e.response.text}")
return False
def update_user_permission(username, new_permission):
"""
更新用户权限
参数:
username (str): 用户名
new_permission (int): 新权限级别
返回:
bool: 更新成功返回True失败返回False
"""
try:
# 防止修改管理员权限
if username == "admin":
print("不能修改管理员权限")
return False
# 先查找用户
response = requests.post(
f"{ES_URL}/{users_index_name}/_search",
auth=AUTH,
json={
"query": {
"term": {
"username": username
}
}
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
if not results:
print(f"用户 {username} 不存在")
return False
# 获取用户文档ID
doc_id = results[0]["_id"]
user_data = results[0]["_source"]
# 更新权限
user_data["premission"] = new_permission
# 更新文档
update_response = requests.post(
f"{ES_URL}/{users_index_name}/_doc/{doc_id}",
auth=AUTH,
json=user_data,
headers={"Content-Type": "application/json"}
)
update_response.raise_for_status()
print(f"用户 {username} 权限更新成功")
return True
except requests.exceptions.HTTPError as e:
print(f"更新用户权限失败: {e.response.text}")
return False
def search_data_by_user(user_id, keyword=None):
"""
根据用户ID查询该用户的数据支持关键词搜索
参数:
user_id (str): 用户ID
keyword (str, optional): 搜索关键词
返回:
list: 包含文档ID和源数据的列表
"""
try:
if keyword:
# 带关键词的搜索
query = {
"bool": {
"must": [
{"term": {"user_id": user_id}},
{
"multi_match": {
"query": keyword,
"fields": ["*"],
"fuzziness": "AUTO"
}
}
]
}
}
else:
# 只按用户ID搜索
query = {
"term": {"user_id": user_id}
}
response = requests.post(
f"{ES_URL}/{data_index_name}/_search",
auth=AUTH,
json={
"query": query,
"size": 1000 # 限制返回数量
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
# 返回包含文档ID和源数据的列表
return [{
"_id": hit["_id"],
**hit["_source"]
} for hit in results]
except requests.exceptions.HTTPError as e:
print(f"查询用户数据失败: {e.response.text}")
return []
def update_data_by_id(doc_id, updated_data, user_id):
"""
根据文档ID更新数据仅允许数据所有者修改
参数:
doc_id (str): 文档ID
updated_data (dict): 更新的数据
user_id (str): 当前用户ID
返回:
bool: 更新成功返回True失败返回False
"""
try:
# 先查询文档,验证所有权
response = requests.get(
f"{ES_URL}/{data_index_name}/_doc/{doc_id}",
auth=AUTH
)
response.raise_for_status()
doc = response.json()
# 检查文档是否存在
if not doc.get("found"):
print(f"文档 {doc_id} 不存在")
return False
# 检查用户权限(只能修改自己的数据)
if doc["_source"].get("user_id") != user_id:
print(f"用户 {user_id} 无权修改文档 {doc_id}")
return False
# 保持用户ID不变
updated_data["user_id"] = user_id
# 更新文档
update_response = requests.post(
f"{ES_URL}/{data_index_name}/_doc/{doc_id}",
auth=AUTH,
json=updated_data,
headers={"Content-Type": "application/json"}
)
update_response.raise_for_status()
print(f"文档 {doc_id} 更新成功")
return True
except requests.exceptions.HTTPError as e:
print(f"更新文档失败: {e.response.text}")
return False
def delete_data_by_id(doc_id, user_id):
"""
根据文档ID删除数据仅允许数据所有者或管理员删除
参数:
doc_id (str): 文档ID
user_id (str): 当前用户ID
返回:
bool: 删除成功返回True失败返回False
"""
try:
# 先查询文档,验证所有权
response = requests.get(
f"{ES_URL}/{data_index_name}/_doc/{doc_id}",
auth=AUTH
)
response.raise_for_status()
doc = response.json()
# 检查文档是否存在
if not doc.get("found"):
print(f"文档 {doc_id} 不存在")
return False
# 检查用户权限(只能删除自己的数据,管理员可以删除所有数据)
doc_user_id = doc["_source"].get("user_id")
if doc_user_id != user_id:
# 检查是否为管理员
user_info = get_user_by_username(user_id) # 这里需要用户名,稍后会修改
if not user_info or user_info.get("premission") != 0:
print(f"用户 {user_id} 无权删除文档 {doc_id}")
return False
# 删除文档
delete_response = requests.delete(
f"{ES_URL}/{data_index_name}/_doc/{doc_id}",
auth=AUTH
)
delete_response.raise_for_status()
print(f"文档 {doc_id} 删除成功")
return True
except requests.exceptions.HTTPError as e:
print(f"删除文档失败: {e.response.text}")
return False
def update_user_own_password(user_id, old_password, new_password):
"""
用户修改自己的密码
参数:
user_id (str): 用户ID
old_password (str): 旧密码
new_password (str): 新密码
返回:
bool: 修改成功返回True失败返回False
"""
try:
# 先查找用户
response = requests.post(
f"{ES_URL}/{users_index_name}/_search",
auth=AUTH,
json={
"query": {
"term": {
"user_id": user_id
}
}
}
)
response.raise_for_status()
results = response.json()["hits"]["hits"]
if not results:
print(f"用户 {user_id} 不存在")
return False
user_data = results[0]["_source"]
doc_id = results[0]["_id"]
# 验证旧密码
if user_data.get("password") != old_password:
print("旧密码错误")
return False
# 更新密码
user_data["password"] = new_password
# 更新文档
update_response = requests.post(
f"{ES_URL}/{users_index_name}/_doc/{doc_id}",
auth=AUTH,
json=user_data,
headers={"Content-Type": "application/json"}
)
update_response.raise_for_status()
print(f"用户 {user_id} 密码修改成功")
return True
except requests.exceptions.HTTPError as e:
print(f"修改密码失败: {e.response.text}")
return False

479
app.py
View File

@@ -1,19 +1,62 @@
import base64
from flask import Flask, request, render_template, redirect, url_for, jsonify
from flask import Flask, request, render_template, redirect, url_for, jsonify, session, flash, send_from_directory
from werkzeug.utils import secure_filename
import os
import uuid
from PIL import Image
import re
import json
import requests
from ESConnect import *
from json_converter import json_to_string, string_to_json
from openai import OpenAI
from functools import wraps
# import config
# 创建Flask应用实例
app = Flask(__name__)
# 设置会话密钥,用于加密会话数据
app.secret_key = 'your-secret-key-change-this-in-production'
# app.config.from_object(config.Config)
# 权限装饰器
def login_required(f):
"""要求用户登录的装饰器"""
@wraps(f)
def decorated_function(*args, **kwargs):
if 'user_id' not in session:
flash('请先登录', 'error')
return redirect(url_for('login'))
return f(*args, **kwargs)
return decorated_function
def admin_required(f):
"""要求管理员权限的装饰器"""
@wraps(f)
def decorated_function(*args, **kwargs):
if 'user_id' not in session:
flash('请先登录', 'error')
return redirect(url_for('login'))
if session.get('permission', 1) != 0:
flash('权限不足,需要管理员权限', 'error')
return redirect(url_for('index'))
return f(*args, **kwargs)
return decorated_function
def user_or_admin_required(f):
"""要求普通用户或管理员权限的装饰器"""
@wraps(f)
def decorated_function(*args, **kwargs):
if 'user_id' not in session:
flash('请先登录', 'error')
return redirect(url_for('login'))
permission = session.get('permission', 1)
if permission not in [0, 1]:
flash('权限不足', 'error')
return redirect(url_for('index'))
return f(*args, **kwargs)
return decorated_function
# OCR和信息提取函数使用大模型API处理图片并提取结构化信息
def ocr_and_extract_info(image_path):
"""
@@ -138,8 +181,249 @@ def ocr_and_extract_info(image_path):
"""
# 登录页面路由
@app.route('/login', methods=['GET', 'POST'])
def login():
"""
处理用户登录
GET: 显示登录页面
POST: 处理登录表单提交
"""
if request.method == 'POST':
username = request.form.get('username')
password = request.form.get('password')
if not username or not password:
flash('请输入用户名和密码', 'error')
return render_template('login.html')
# 验证用户
user_data = verify_user(username, password)
if user_data:
# 登录成功,设置会话
session['user_id'] = user_data['user_id']
session['username'] = user_data['username']
session['permission'] = user_data['premission']
flash(f'欢迎回来,{username}', 'success')
return redirect(url_for('index'))
else:
flash('用户名或密码错误', 'error')
return render_template('login.html')
return render_template('login.html')
# 登出路由
@app.route('/logout')
def logout():
"""
处理用户登出
"""
session.clear()
flash('已成功登出', 'info')
return redirect(url_for('login'))
# 用户管理页面路由
@app.route('/user_management')
@admin_required
def user_management():
"""
显示用户管理页面(仅管理员可访问)
"""
users = get_all_users()
return render_template('user_management.html', users=users)
# 注册新用户路由
@app.route('/register', methods=['GET', 'POST'])
@admin_required
def register():
"""
注册新用户(仅管理员可访问)
GET: 显示注册页面
POST: 处理注册表单提交
"""
if request.method == 'POST':
username = request.form.get('username')
password = request.form.get('password')
confirm_password = request.form.get('confirm_password')
permission = int(request.form.get('permission', 1))
# 验证输入
if not username or not password:
flash('请输入用户名和密码', 'error')
return render_template('register.html')
if password != confirm_password:
flash('两次输入的密码不一致', 'error')
return render_template('register.html')
if len(password) < 6:
flash('密码长度至少6位', 'error')
return render_template('register.html')
# 检查用户名是否已存在
existing_user = get_user_by_username(username)
if existing_user:
flash('用户名已存在', 'error')
return render_template('register.html')
# 创建新用户
success = create_user(username, password, permission)
if success:
flash(f'用户 {username} 创建成功', 'success')
return redirect(url_for('user_management'))
else:
flash('创建用户失败', 'error')
return render_template('register.html')
return render_template('register.html')
# 修改用户密码路由
@app.route('/change_password/<username>', methods=['POST'])
@admin_required
def change_password(username):
"""
修改用户密码(仅管理员可访问)
"""
new_password = request.form.get('new_password')
confirm_password = request.form.get('confirm_password')
if not new_password or not confirm_password:
flash('请输入新密码', 'error')
return redirect(url_for('user_management'))
if new_password != confirm_password:
flash('两次输入的密码不一致', 'error')
return redirect(url_for('user_management'))
if len(new_password) < 6:
flash('密码长度至少6位', 'error')
return redirect(url_for('user_management'))
success = update_user_password(username, new_password)
if success:
flash(f'用户 {username} 密码修改成功', 'success')
else:
flash(f'修改用户 {username} 密码失败', 'error')
return redirect(url_for('user_management'))
# 修改用户权限路由
@app.route('/change_permission/<username>', methods=['POST'])
@admin_required
def change_permission(username):
"""
修改用户权限(仅管理员可访问)
"""
new_permission = int(request.form.get('permission', 1))
success = update_user_permission(username, new_permission)
if success:
flash(f'用户 {username} 权限修改成功', 'success')
else:
flash(f'修改用户 {username} 权限失败', 'error')
return redirect(url_for('user_management'))
# 删除用户路由
@app.route('/delete_user/<username>', methods=['POST'])
@admin_required
def delete_user_route(username):
"""
删除用户(仅管理员可访问)
"""
success = delete_user(username)
if success:
flash(f'用户 {username} 删除成功', 'success')
else:
flash(f'删除用户 {username} 失败', 'error')
return redirect(url_for('user_management'))
# 个人设置页面路由
@app.route('/profile')
@login_required
def profile():
"""
显示个人设置页面
"""
return render_template('profile.html')
# 修改个人密码路由
@app.route('/change_own_password', methods=['POST'])
@login_required
def change_own_password():
"""
用户修改自己的密码
"""
old_password = request.form.get('old_password')
new_password = request.form.get('new_password')
confirm_password = request.form.get('confirm_password')
# 验证输入
if not old_password or not new_password or not confirm_password:
flash('请填写所有密码字段', 'error')
return redirect(url_for('profile'))
if new_password != confirm_password:
flash('两次输入的新密码不一致', 'error')
return redirect(url_for('profile'))
if len(new_password) < 6:
flash('新密码长度至少6位', 'error')
return redirect(url_for('profile'))
# 调用修改密码函数
success = update_user_own_password(session['user_id'], old_password, new_password)
if success:
flash('密码修改成功', 'success')
else:
flash('密码修改失败,请检查旧密码是否正确', 'error')
return redirect(url_for('profile'))
# 个人数据页面路由
@app.route('/my_data')
@login_required
def my_data():
"""
显示用户自己的数据
"""
user_id = session['user_id']
keyword = request.args.get('keyword', '')
# 查询用户自己的数据
if keyword:
data = search_data_by_user(user_id, keyword)
else:
data = search_data_by_user(user_id)
# 将data字段从字符串转换回JSON格式以便显示
processed_data = []
for item in data:
if 'data' in item and item['data']:
try:
# 将data字段的字符串转换回JSON
original_data = string_to_json(item['data'])
# 合并原始数据和其他字段
display_item = {
'_id': item['_id'],
'image': item.get('image', ''),
**original_data # 展开原始数据字段
}
processed_data.append(display_item)
except Exception as e:
# 如果转换失败,保持原始格式
processed_data.append(item)
else:
processed_data.append(item)
return render_template('my_data.html', data=processed_data, keyword=keyword)
# 首页路由
@app.route('/')
@login_required
def index():
"""
渲染首页模板
@@ -151,12 +435,13 @@ def index():
# 图片上传路由
@app.route('/upload', methods=['POST'])
@user_or_admin_required
def upload_image():
"""
处理图片上传请求调用OCR识别存储结果
处理图片上传请求调用OCR识别但不存储结果
返回:
JSON: 上传成功或失败的响应
JSON: 识别结果,供用户编辑确认
"""
# 获取上传的文件
file = request.files.get('file')
@@ -173,20 +458,13 @@ def upload_image():
print(f"开始处理图片: {image_path}")
original_data = ocr_and_extract_info(image_path) # 获取原始JSON数据
if original_data:
# 使用json_converter将JSON数据转换为字符串
data_string = json_to_string(original_data)
print(f"转换后的数据字符串: {data_string}")
# 构造新的数据结构只包含data和image字段
processed_data = {
"data": data_string,
"image": filename # 存储图片文件名
}
print(f"准备存储的数据: {processed_data}")
insert_data(processed_data) # 存入ES
print("✓ 数据成功存储到Elasticsearch")
return jsonify({"message": "成功录入", "data": original_data, "processed": processed_data})
print(f"识别成功: {original_data}")
# 返回识别结果和图片文件名,供用户编辑确认
return jsonify({
"message": "识别成功,请确认数据后点击录入",
"data": original_data,
"image": filename
})
else:
print("✗ 无法识别图片内容")
return jsonify({"error": "无法识别图片内容"}), 400
@@ -194,8 +472,54 @@ def upload_image():
print(f"✗ 处理过程中发生错误: {str(e)}")
return jsonify({"error": str(e)}), 500
# 确认录入路由
@app.route('/confirm', methods=['POST'])
@user_or_admin_required
def confirm_data():
"""
确认并录入用户编辑后的数据
返回:
JSON: 录入成功或失败的响应
"""
try:
# 获取前端提交的数据
request_data = request.get_json()
if not request_data:
return jsonify({"error": "没有接收到数据"}), 400
# 获取编辑后的数据和图片文件名
edited_data = request_data.get('data', {})
image_filename = request_data.get('image', '')
if not edited_data:
return jsonify({"error": "数据不能为空"}), 400
# 使用json_converter将JSON数据转换为字符串
data_string = json_to_string(edited_data)
print(f"转换后的数据字符串: {data_string}")
# 构造新的数据结构只包含data和image字段并添加用户ID
processed_data = {
"data": data_string,
"image": image_filename, # 存储图片文件名
"user_id": session['user_id'] # 添加用户ID关联
}
print(f"准备存储的数据: {processed_data}")
# 存入ES
insert_data(processed_data)
print("✓ 数据成功存储到Elasticsearch")
return jsonify({"message": "数据录入成功", "data": edited_data})
except Exception as e:
print(f"✗ 录入过程中发生错误: {str(e)}")
return jsonify({"error": str(e)}), 500
# 搜索路由
@app.route('/search')
@user_or_admin_required
def search():
"""
处理搜索请求从Elasticsearch中检索匹配的数据
@@ -235,6 +559,7 @@ def search():
# 结果页面路由
@app.route('/results')
@user_or_admin_required
def results_page():
"""
渲染搜索结果页面
@@ -246,6 +571,7 @@ def results_page():
# 显示所有数据路由
@app.route('/all')
@admin_required
def show_all():
"""
获取所有数据并渲染到页面
@@ -276,23 +602,134 @@ def show_all():
return render_template('all.html', data=processed_data)
# 添加图片路由
@app.route('/image/<filename>')
def serve_image(filename):
"""
提供图片文件服务
参数:
filename (str): 图片文件名
返回:
Response: 图片文件响应
"""
from flask import send_from_directory
return send_from_directory('image', filename)
# 删除数据路由
@app.route('/delete/<doc_id>', methods=['POST'])
@login_required
def delete_entry(doc_id):
"""
根据文档ID删除数据
根据文档ID删除数据(用户只能删除自己的数据,管理员可以删除所有数据)
参数:
doc_id (str): 要删除的文档ID
返回:
重定向到所有数据页面或错误信息
重定向到相应页面或错误信息
"""
if delete_by_id(doc_id):
return redirect(url_for('show_all'))
user_id = session['user_id']
user_permission = session.get('permission', 1)
# 管理员可以删除所有数据,普通用户只能删除自己的数据
if user_permission == 0: # 管理员
success = delete_by_id(doc_id)
redirect_url = 'show_all'
else: # 普通用户
success = delete_data_by_id(doc_id, user_id)
redirect_url = 'my_data'
if success:
return redirect(url_for(redirect_url))
else:
return "删除失败", 500
# 编辑数据路由
@app.route('/edit/<doc_id>', methods=['GET', 'POST'])
@login_required
def edit_entry(doc_id):
"""
编辑数据条目(用户只能编辑自己的数据)
"""
if request.method == 'GET':
# 获取要编辑的数据
try:
# 先获取文档检查权限
response = requests.get(
f"{ES_URL}/{data_index_name}/_doc/{doc_id}",
auth=AUTH
)
response.raise_for_status()
doc = response.json()
if not doc.get("found"):
flash('数据不存在', 'error')
return redirect(url_for('my_data'))
# 检查权限
user_id = session['user_id']
user_permission = session.get('permission', 1)
doc_user_id = doc["_source"].get("user_id")
# 管理员可以编辑所有数据,普通用户只能编辑自己的数据
if user_permission != 0 and doc_user_id != user_id:
flash('您无权编辑此数据', 'error')
return redirect(url_for('my_data'))
# 解析数据
data_str = doc["_source"].get("data", "{}")
original_data = string_to_json(data_str)
edit_data = {
'_id': doc_id,
'image': doc["_source"].get('image', ''),
**original_data
}
return render_template('edit.html', data=edit_data)
except Exception as e:
flash('获取数据失败', 'error')
return redirect(url_for('my_data'))
else: # POST 请求 - 保存编辑
try:
# 获取编辑后的数据
edited_data = {}
for key, value in request.form.items():
if key != '_id' and key != 'image':
edited_data[key] = value
# 转换为字符串格式
data_string = json_to_string(edited_data)
# 构造更新数据
updated_data = {
"data": data_string,
"image": request.form.get('image', ''),
"user_id": session['user_id']
}
# 更新数据
success = update_data_by_id(doc_id, updated_data, session['user_id'])
if success:
flash('数据更新成功', 'success')
else:
flash('数据更新失败', 'error')
# 根据用户权限重定向
if session.get('permission', 1) == 0:
return redirect(url_for('show_all'))
else:
return redirect(url_for('my_data'))
except Exception as e:
flash('保存数据失败', 'error')
return redirect(url_for('my_data'))
# 主程序入口

View File

@@ -35,6 +35,9 @@
box-shadow: var(--shadow);
position: relative;
overflow: hidden;
display: flex;
justify-content: space-between;
align-items: center;
}
.header:before {
@@ -62,6 +65,51 @@
text-shadow: 0 0 5px rgba(0,0,0,0.2);
}
.user-info {
position: relative;
z-index: 1;
display: flex;
align-items: center;
gap: 15px;
}
.user-info .username {
font-size: 14px;
opacity: 0.9;
}
.user-info .permission-badge {
background: rgba(255, 255, 255, 0.2);
padding: 4px 8px;
border-radius: 12px;
font-size: 12px;
font-weight: 500;
}
.user-info .permission-badge.admin {
background: var(--accent);
}
.user-info .permission-badge.user {
background: var(--success);
}
.logout-btn {
background: rgba(255, 255, 255, 0.2);
border: 1px solid rgba(255, 255, 255, 0.3);
color: white;
padding: 6px 12px;
border-radius: 4px;
text-decoration: none;
font-size: 12px;
transition: var(--transition);
}
.logout-btn:hover {
background: rgba(255, 255, 255, 0.3);
color: white;
}
.sidebar {
width: 240px;
height: calc(100vh - 60px);
@@ -152,6 +200,15 @@
<body>
<div class="header">
<h1><span>紫金</span> 稷下薪火·云枢智海师生成果共创系统</h1>
<div class="user-info">
<span class="username">{{ session.username }}</span>
{% if session.permission == 0 %}
<span class="permission-badge admin">管理员</span>
{% elif session.permission == 1 %}
<span class="permission-badge user">普通用户</span>
{% endif %}
<a href="{{ url_for('logout') }}" class="logout-btn">登出</a>
</div>
</div>
<div class="sidebar">
@@ -161,12 +218,53 @@
<a href="{{ url_for('results_page') }}" {% if request.endpoint == 'results_page' %}class="active"{% endif %}>
<i>📈</i> 查询统计
</a>
<a href="{{ url_for('my_data') }}" {% if request.endpoint == 'my_data' or request.endpoint == 'edit_entry' %}class="active"{% endif %}>
<i>📋</i> 我的数据
</a>
{% if session.permission == 0 %}
<a href="{{ url_for('show_all') }}" {% if request.endpoint == 'show_all' %}class="active"{% endif %}>
<i>📁</i> 数据操作
</a>
{% endif %}
<a href="{{ url_for('profile') }}" {% if request.endpoint == 'profile' %}class="active"{% endif %}>
<i>⚙️</i> 个人设置
</a>
{% if session.permission == 0 %}
<a href="{{ url_for('user_management') }}" {% if request.endpoint == 'user_management' or request.endpoint == 'register' %}class="active"{% endif %}>
<i>👥</i> 用户管理
</a>
{% endif %}
</div>
<div class="content">
<!-- Flash消息显示 -->
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
<div class="flash-messages" style="margin-bottom: 20px;">
{% for category, message in messages %}
<div class="flash-message {{ category }}" style="padding: 10px; border-radius: 5px; margin-bottom: 10px;">{{ message }}</div>
{% endfor %}
</div>
<style>
.flash-message.error {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
.flash-message.success {
background-color: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.flash-message.info {
background-color: #d1ecf1;
color: #0c5460;
border: 1px solid #bee5eb;
}
</style>
{% endif %}
{% endwith %}
{% block content %}
{% endblock %}
</div>

316
templates/edit.html Normal file
View File

@@ -0,0 +1,316 @@
{% extends "base.html" %}
{% block title %}编辑数据{% endblock %}
{% block content %}
<div class="edit-container">
<div class="edit-header">
<h1>编辑数据</h1>
<p>修改您的数据信息</p>
</div>
<form method="POST" class="edit-form" id="editForm">
<!-- 隐藏字段 -->
<input type="hidden" name="_id" value="{{ data._id }}">
<input type="hidden" name="image" value="{{ data.image }}">
<!-- 图片显示 -->
{% if data.image %}
<div class="image-preview">
<h3>关联图片</h3>
<img src="{{ url_for('serve_image', filename=data.image) }}" alt="数据图片" onclick="openImageModal('{{ url_for('serve_image', filename=data.image) }}')">
</div>
{% endif %}
<!-- 数据字段编辑 -->
<div class="fields-container">
<h3>数据字段</h3>
{% for key, value in data.items() %}
{% if key not in ['_id', 'image', 'user_id'] %}
<div class="form-group">
<label for="{{ key }}">{{ key }}:</label>
<input type="text" id="{{ key }}" name="{{ key }}" value="{{ value }}" class="form-input">
</div>
{% endif %}
{% endfor %}
</div>
<!-- 操作按钮 -->
<div class="form-actions">
<button type="submit" class="btn btn-primary">
<i class="icon">💾</i>
保存修改
</button>
<a href="{{ url_for('my_data') }}" class="btn btn-secondary">
<i class="icon">↩️</i>
取消
</a>
</div>
</form>
</div>
<!-- 图片预览模态框 -->
<div id="imageModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeImageModal()">&times;</span>
<img id="modalImage" src="" alt="图片预览">
</div>
</div>
<style>
.edit-container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
.edit-header {
text-align: center;
margin-bottom: 30px;
padding: 30px;
background: white;
border-radius: 12px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.edit-header h1 {
color: #333;
font-size: 28px;
margin-bottom: 10px;
}
.edit-header p {
color: #666;
font-size: 16px;
}
.edit-form {
background: white;
border-radius: 12px;
padding: 30px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.image-preview {
margin-bottom: 30px;
text-align: center;
}
.image-preview h3 {
color: #333;
margin-bottom: 15px;
font-size: 18px;
}
.image-preview img {
max-width: 100%;
max-height: 300px;
border-radius: 8px;
cursor: pointer;
transition: transform 0.3s ease;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}
.image-preview img:hover {
transform: scale(1.02);
}
.fields-container {
margin-bottom: 30px;
}
.fields-container h3 {
color: #333;
margin-bottom: 20px;
font-size: 18px;
padding-bottom: 10px;
border-bottom: 2px solid #e9ecef;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
margin-bottom: 8px;
color: #555;
font-weight: 600;
font-size: 14px;
text-transform: capitalize;
}
.form-input {
width: 100%;
padding: 12px 16px;
border: 2px solid #e9ecef;
border-radius: 8px;
font-size: 16px;
transition: all 0.3s ease;
background: #f8f9fa;
}
.form-input:focus {
outline: none;
border-color: #667eea;
background: white;
box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}
.form-actions {
display: flex;
gap: 15px;
justify-content: center;
padding-top: 20px;
border-top: 1px solid #e9ecef;
}
.btn {
padding: 12px 24px;
border: none;
border-radius: 8px;
cursor: pointer;
font-size: 16px;
font-weight: 600;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.3s ease;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.btn-primary {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(102, 126, 234, 0.3);
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #5a6268;
transform: translateY(-2px);
}
/* 模态框样式 */
.modal {
display: none;
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
}
.modal-content {
position: relative;
margin: 5% auto;
padding: 20px;
width: 90%;
max-width: 800px;
background: white;
border-radius: 12px;
text-align: center;
}
.close {
position: absolute;
top: 15px;
right: 25px;
font-size: 28px;
font-weight: bold;
cursor: pointer;
color: #666;
}
.close:hover {
color: #333;
}
#modalImage {
max-width: 100%;
max-height: 70vh;
border-radius: 8px;
}
@media (max-width: 768px) {
.edit-container {
padding: 10px;
}
.edit-form {
padding: 20px;
}
.form-actions {
flex-direction: column;
}
.btn {
width: 100%;
justify-content: center;
}
}
</style>
<script>
// 图片预览功能
function openImageModal(imageSrc) {
document.getElementById('modalImage').src = imageSrc;
document.getElementById('imageModal').style.display = 'block';
}
function closeImageModal() {
document.getElementById('imageModal').style.display = 'none';
}
// 点击模态框外部关闭
window.onclick = function(event) {
const imageModal = document.getElementById('imageModal');
if (event.target === imageModal) {
closeImageModal();
}
}
// 表单验证
document.getElementById('editForm').addEventListener('submit', function(e) {
const inputs = this.querySelectorAll('.form-input');
let hasEmptyFields = false;
inputs.forEach(input => {
if (!input.value.trim()) {
hasEmptyFields = true;
input.style.borderColor = '#dc3545';
} else {
input.style.borderColor = '#e9ecef';
}
});
if (hasEmptyFields) {
e.preventDefault();
alert('请填写所有字段!');
return false;
}
});
// 输入时清除错误状态
document.querySelectorAll('.form-input').forEach(input => {
input.addEventListener('input', function() {
if (this.value.trim()) {
this.style.borderColor = '#e9ecef';
}
});
});
</script>
{% endblock %}

View File

@@ -20,72 +20,255 @@
</button>
</form>
<div id="result" class="mt-4"></div>
<!-- 编辑确认区域 -->
<div id="edit-section" class="mt-4" style="display: none;">
<div class="card">
<h3 style="color: var(--primary); border-bottom: 2px solid var(--primary); padding-bottom: 10px;">
<i class="fas fa-edit"></i> 识别结果 - 请确认并编辑数据
</h3>
<p class="mb-4">系统已识别出以下信息,您可以修改字段名和对应的数据值,确认无误后点击录入按钮</p>
<form id="edit-form">
<div id="edit-fields"></div>
<div class="mt-4 text-center">
<button type="button" id="confirm-btn" class="btn btn-success btn-lg">
<i class="fas fa-check"></i> 确认录入
</button>
<button type="button" id="cancel-btn" class="btn btn-secondary btn-lg ml-3">
<i class="fas fa-times"></i> 取消
</button>
</div>
</form>
</div>
</div>
</div>
<script>
let currentData = null;
let currentImage = null;
document.getElementById("upload-form").addEventListener("submit", function (e) {
e.preventDefault();
let formData = new FormData(this);
const resultDiv = document.getElementById("result");
const editSection = document.getElementById("edit-section");
// 显示上传进度动画
resultDiv.innerHTML = `
<div class="progress-container">
<div class="progress-bar"></div>
<p class="progress-text">正在处理图片,请稍候...</p>
editSection.innerHTML = `
<div class="card">
<div class="progress-container">
<div class="progress-bar"></div>
<p class="progress-text">正在处理图片,请稍候...</p>
</div>
</div>
`;
editSection.style.display = "block";
fetch("/upload", { method: "POST", body: formData })
.then(res => res.json())
.then(data => {
if(data.error) {
resultDiv.innerHTML = `
<div class="alert alert-danger">
<i class="fas fa-exclamation-circle"></i> 错误: ${data.error}
editSection.innerHTML = `
<div class="card">
<div class="alert alert-danger">
<i class="fas fa-exclamation-circle"></i> 错误: ${data.error}
</div>
</div>
`;
} else {
const resultHtml = `
<div class="result-card">
<div class="result-header">
<h3><i class="fas fa-check-circle"></i> 识别成功</h3>
<p class="timestamp">${new Date().toLocaleString()}</p>
</div>
<div class="result-content">
${Object.entries(data.data).map(([key, value]) => `
<div class="result-item">
<span class="result-label">${key.replace(/_/g, ' ')}</span>
<span class="result-value">${value}</span>
</div>
`).join('')}
</div>
<div class="result-footer">
<p class="success-message">${data.message}</p>
<button class="btn btn-outline-primary copy-btn" data-clipboard-text="${JSON.stringify(data.data)}">
<i class="fas fa-copy"></i> 复制结果
</button>
</div>
</div>
`;
resultDiv.innerHTML = resultHtml;
// 添加复制按钮功能
document.querySelector('.copy-btn').addEventListener('click', function() {
navigator.clipboard.writeText(this.getAttribute('data-clipboard-text'));
alert('结果已复制到剪贴板!');
});
// 存储当前数据
currentData = data.data;
currentImage = data.image;
// 生成编辑表单
generateEditForm(data.data);
}
})
.catch(error => {
resultDiv.innerHTML = `
<div class="alert alert-danger">
<i class="fas fa-exclamation-circle"></i> 上传失败: ${error}
editSection.innerHTML = `
<div class="card">
<div class="alert alert-danger">
<i class="fas fa-exclamation-circle"></i> 上传失败: ${error}
</div>
</div>
`;
});
});
function generateEditForm(data) {
const editSection = document.getElementById("edit-section");
let fieldsHtml = "";
Object.entries(data).forEach(([key, value], index) => {
fieldsHtml += `
<div class="field-row mb-3">
<div class="row">
<div class="col-md-4">
<label class="form-label">字段名</label>
<input type="text" class="form-control field-name" value="${key}" data-original-key="${key}">
</div>
<div class="col-md-6">
<label class="form-label">数据值</label>
<input type="text" class="form-control field-value" value="${value}">
</div>
<div class="col-md-2 d-flex align-items-end">
<button type="button" class="btn btn-danger btn-sm delete-field" title="删除此字段">
<i class="fas fa-trash"></i>
</button>
</div>
</div>
</div>
`;
});
editSection.innerHTML = `
<div class="card">
<h3 style="color: var(--primary); border-bottom: 2px solid var(--primary); padding-bottom: 10px;">
<i class="fas fa-edit"></i> 识别结果 - 请确认并编辑数据
</h3>
<p class="mb-4">系统已识别出以下信息,您可以修改字段名和对应的数据值,确认无误后点击录入按钮</p>
<form id="edit-form">
<div id="edit-fields">
${fieldsHtml}
</div>
<div class="mb-3">
<button type="button" id="add-field-btn" class="btn btn-outline-primary">
<i class="fas fa-plus"></i> 添加字段
</button>
</div>
<div class="mt-4 text-center">
<button type="button" id="confirm-btn" class="btn btn-success btn-lg">
<i class="fas fa-check"></i> 确认录入
</button>
<button type="button" id="cancel-btn" class="btn btn-secondary btn-lg ml-3">
<i class="fas fa-times"></i> 取消
</button>
</div>
</form>
</div>
`;
// 绑定删除按钮事件
document.querySelectorAll('.delete-field').forEach(btn => {
btn.addEventListener('click', function() {
this.closest('.field-row').remove();
});
});
// 绑定添加字段按钮事件
document.getElementById('add-field-btn').addEventListener('click', function() {
const editFields = document.getElementById('edit-fields');
const newFieldHtml = `
<div class="field-row mb-3">
<div class="row">
<div class="col-md-4">
<label class="form-label">字段名</label>
<input type="text" class="form-control field-name" value="" data-original-key="">
</div>
<div class="col-md-6">
<label class="form-label">数据值</label>
<input type="text" class="form-control field-value" value="">
</div>
<div class="col-md-2 d-flex align-items-end">
<button type="button" class="btn btn-danger btn-sm delete-field" title="删除此字段">
<i class="fas fa-trash"></i>
</button>
</div>
</div>
</div>
`;
editFields.insertAdjacentHTML('beforeend', newFieldHtml);
// 为新添加的删除按钮绑定事件
const newDeleteBtn = editFields.lastElementChild.querySelector('.delete-field');
newDeleteBtn.addEventListener('click', function() {
this.closest('.field-row').remove();
});
});
// 绑定确认和取消按钮事件
bindConfirmCancelEvents();
}
function bindConfirmCancelEvents() {
// 确认录入按钮事件
document.getElementById("confirm-btn").addEventListener("click", function() {
const fieldRows = document.querySelectorAll('.field-row');
const editedData = {};
// 收集编辑后的数据
fieldRows.forEach(row => {
const fieldName = row.querySelector('.field-name').value.trim();
const fieldValue = row.querySelector('.field-value').value.trim();
if (fieldName && fieldValue) {
editedData[fieldName] = fieldValue;
}
});
if (Object.keys(editedData).length === 0) {
alert('请至少保留一个有效的字段!');
return;
}
// 发送确认请求
fetch("/confirm", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({
data: editedData,
image: currentImage
})
})
.then(res => res.json())
.then(data => {
const editSection = document.getElementById("edit-section");
if(data.error) {
editSection.innerHTML = `
<div class="card">
<div class="alert alert-danger">
<i class="fas fa-exclamation-circle"></i> 录入失败: ${data.error}
</div>
</div>
`;
} else {
editSection.innerHTML = `
<div class="card">
<div class="alert alert-success">
<i class="fas fa-check-circle"></i> ${data.message}
</div>
</div>
`;
// 重置表单
document.getElementById("upload-form").reset();
// 3秒后隐藏成功消息
setTimeout(() => {
editSection.style.display = "none";
}, 3000);
}
})
.catch(error => {
const editSection = document.getElementById("edit-section");
editSection.innerHTML = `
<div class="card">
<div class="alert alert-danger">
<i class="fas fa-exclamation-circle"></i> 录入失败: ${error}
</div>
</div>
`;
});
});
// 取消按钮事件
document.getElementById("cancel-btn").addEventListener("click", function() {
const editSection = document.getElementById("edit-section");
editSection.style.display = "none";
currentData = null;
currentImage = null;
});
}
</script>
<style>
@@ -222,6 +405,12 @@
margin-bottom: 15px;
}
.info-message {
color: var(--primary);
font-weight: 500;
margin-bottom: 15px;
}
.btn-outline-primary {
border: 1px solid var(--primary);
color: var(--primary);
@@ -234,5 +423,195 @@
background-color: var(--primary);
color: white;
}
.btn-success {
background: linear-gradient(135deg, #28a745, #20c997);
border: none;
border-radius: 30px;
padding: 12px 24px;
font-weight: 500;
transition: var(--transition);
box-shadow: 0 4px 8px rgba(40, 167, 69, 0.2);
color: white;
}
.btn-success:hover {
background: linear-gradient(135deg, #20c997, #28a745);
transform: translateY(-2px);
box-shadow: 0 6px 12px rgba(40, 167, 69, 0.3);
}
.btn-secondary {
background: linear-gradient(135deg, #6c757d, #495057);
border: none;
border-radius: 30px;
padding: 12px 24px;
font-weight: 500;
transition: var(--transition);
box-shadow: 0 4px 8px rgba(108, 117, 125, 0.2);
color: white;
}
.btn-secondary:hover {
background: linear-gradient(135deg, #495057, #6c757d);
transform: translateY(-2px);
box-shadow: 0 6px 12px rgba(108, 117, 125, 0.3);
}
.btn-danger {
background-color: #dc3545;
border-color: #dc3545;
color: white;
}
.btn-danger:hover {
background-color: #c82333;
border-color: #bd2130;
}
.btn-sm {
padding: 0.25rem 0.5rem;
font-size: 0.875rem;
border-radius: 0.2rem;
}
.ml-3 {
margin-left: 1rem;
}
.btn-outline-primary {
color: var(--primary);
border-color: var(--primary);
background-color: transparent;
padding: 8px 16px;
border-radius: 4px;
border: 1px solid var(--primary);
transition: all 0.3s ease;
}
.btn-outline-primary:hover {
background-color: var(--primary);
border-color: var(--primary);
color: white;
}
.alert-danger {
color: #721c24;
background-color: #f8d7da;
border-color: #f5c6cb;
padding: 0.75rem 1.25rem;
margin-bottom: 1rem;
border: 1px solid transparent;
border-radius: 0.25rem;
}
.alert-success {
background-color: #d4edda;
color: #155724;
border-left: 4px solid #28a745;
}
#edit-section .card {
border-left: 4px solid var(--primary);
}
.form-label {
font-weight: 500;
color: #495057;
margin-bottom: 8px;
}
.field-row {
background-color: white;
padding: 15px;
border-radius: 5px;
border: 1px solid #e0e0e0;
margin-bottom: 10px;
}
.field-row:hover {
border-color: var(--primary);
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.row {
display: flex;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}
.col-md-4, .col-md-6, .col-md-2 {
position: relative;
width: 100%;
padding-right: 15px;
padding-left: 15px;
}
.col-md-2 {
flex: 0 0 16.666667%;
max-width: 16.666667%;
}
.col-md-4 {
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.col-md-6 {
flex: 0 0 50%;
max-width: 50%;
}
.d-flex {
display: flex;
}
.align-items-end {
align-items: flex-end;
}
.text-center {
text-align: center;
}
.mb-3 {
margin-bottom: 1rem;
}
.mb-4 {
margin-bottom: 1.5rem;
}
.mt-4 {
margin-top: 1.5rem;
}
.btn-lg {
padding: 0.5rem 1rem;
font-size: 1.25rem;
border-radius: 0.3rem;
}
@media (max-width: 768px) {
.col-md-2, .col-md-4, .col-md-6 {
flex: 0 0 100%;
max-width: 100%;
margin-bottom: 10px;
}
.field-row .row {
flex-direction: column;
}
.btn-lg {
width: 100%;
margin-bottom: 10px;
}
.ml-3 {
margin-left: 0;
}
}
</style>
{% endblock %}

162
templates/login.html Normal file
View File

@@ -0,0 +1,162 @@
<!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>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Microsoft YaHei', Arial, sans-serif;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
.login-container {
background: white;
padding: 40px;
border-radius: 10px;
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
}
.login-header {
text-align: center;
margin-bottom: 30px;
}
.login-header h1 {
color: #333;
font-size: 28px;
margin-bottom: 10px;
}
.login-header p {
color: #666;
font-size: 14px;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
margin-bottom: 5px;
color: #333;
font-weight: 500;
}
.form-group input {
width: 100%;
padding: 12px;
border: 2px solid #ddd;
border-radius: 5px;
font-size: 16px;
transition: border-color 0.3s;
}
.form-group input:focus {
outline: none;
border-color: #667eea;
}
.login-btn {
width: 100%;
padding: 12px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
transition: transform 0.2s;
}
.login-btn:hover {
transform: translateY(-2px);
}
.flash-messages {
margin-bottom: 20px;
}
.flash-message {
padding: 10px;
border-radius: 5px;
margin-bottom: 10px;
}
.flash-message.error {
background-color: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
.flash-message.success {
background-color: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.flash-message.info {
background-color: #d1ecf1;
color: #0c5460;
border: 1px solid #bee5eb;
}
.login-footer {
text-align: center;
margin-top: 20px;
color: #666;
font-size: 12px;
}
</style>
</head>
<body>
<div class="login-container">
<div class="login-header">
<h1>用户登录</h1>
<p>成果录入系统</p>
</div>
<!-- Flash消息显示 -->
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
<div class="flash-messages">
{% for category, message in messages %}
<div class="flash-message {{ category }}">{{ message }}</div>
{% endfor %}
</div>
{% endif %}
{% endwith %}
<form method="POST">
<div class="form-group">
<label for="username">用户名</label>
<input type="text" id="username" name="username" required>
</div>
<div class="form-group">
<label for="password">密码</label>
<input type="password" id="password" name="password" required>
</div>
<button type="submit" class="login-btn">登录</button>
</form>
<div class="login-footer">
<p>默认管理员账号admin / admin</p>
</div>
</div>
</body>
</html>

486
templates/my_data.html Normal file
View File

@@ -0,0 +1,486 @@
{% extends "base.html" %}
{% block title %}我的数据{% endblock %}
{% block content %}
<div class="content-header">
<h1>我的数据</h1>
<p>查看和管理您录入的所有数据</p>
</div>
<!-- 搜索框 -->
<div class="search-container">
<form method="GET" action="{{ url_for('my_data') }}" class="search-form">
<div class="search-input-group">
<input type="text" name="keyword" value="{{ keyword }}" placeholder="搜索我的数据..." class="search-input">
<button type="submit" class="search-btn">
<i class="search-icon">🔍</i>
搜索
</button>
</div>
</form>
{% if keyword %}
<div class="search-info">
<span>搜索关键词: "{{ keyword }}"</span>
<a href="{{ url_for('my_data') }}" class="clear-search">清除搜索</a>
</div>
{% endif %}
</div>
<!-- 数据统计 -->
<div class="data-stats">
<div class="stat-item">
<span class="stat-number">{{ data|length }}</span>
<span class="stat-label">条记录</span>
</div>
</div>
<!-- 数据列表 -->
<div class="data-container">
{% if data %}
<div class="data-grid">
{% for item in data %}
<div class="data-card">
<!-- 图片显示 -->
{% if item.image %}
<div class="card-image">
<img src="{{ url_for('serve_image', filename=item.image) }}" alt="数据图片" onclick="openImageModal('{{ url_for('serve_image', filename=item.image) }}')">
</div>
{% endif %}
<!-- 数据内容 -->
<div class="card-content">
{% for key, value in item.items() %}
{% if key not in ['_id', 'image', 'user_id'] %}
<div class="data-field">
<span class="field-label">{{ key }}:</span>
<span class="field-value">{{ value }}</span>
</div>
{% endif %}
{% endfor %}
</div>
<!-- 操作按钮 -->
<div class="card-actions">
<a href="{{ url_for('edit_entry', doc_id=item._id) }}" class="btn btn-edit">
<i class="icon">✏️</i>
编辑
</a>
<button onclick="confirmDelete('{{ item._id }}')" class="btn btn-delete">
<i class="icon">🗑️</i>
删除
</button>
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="empty-state">
<div class="empty-icon">📝</div>
<h3>暂无数据</h3>
<p>{% if keyword %}没有找到匹配 "{{ keyword }}" 的数据{% else %}您还没有录入任何数据{% endif %}</p>
<a href="{{ url_for('index') }}" class="btn btn-primary">开始录入数据</a>
</div>
{% endif %}
</div>
<!-- 图片预览模态框 -->
<div id="imageModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeImageModal()">&times;</span>
<img id="modalImage" src="" alt="图片预览">
</div>
</div>
<!-- 删除确认模态框 -->
<div id="deleteModal" class="modal">
<div class="modal-content modal-small">
<h3>确认删除</h3>
<p>您确定要删除这条数据吗?此操作不可撤销。</p>
<div class="modal-actions">
<button onclick="closeDeleteModal()" class="btn btn-secondary">取消</button>
<form id="deleteForm" method="POST" style="display: inline;">
<button type="submit" class="btn btn-danger">确认删除</button>
</form>
</div>
</div>
</div>
<style>
.content-header {
margin-bottom: 30px;
text-align: center;
}
.content-header h1 {
color: #333;
font-size: 28px;
margin-bottom: 10px;
}
.content-header p {
color: #666;
font-size: 16px;
}
.search-container {
background: white;
border-radius: 12px;
padding: 20px;
margin-bottom: 20px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.search-form {
margin-bottom: 15px;
}
.search-input-group {
display: flex;
gap: 10px;
max-width: 500px;
margin: 0 auto;
}
.search-input {
flex: 1;
padding: 12px 16px;
border: 2px solid #e9ecef;
border-radius: 8px;
font-size: 16px;
transition: border-color 0.3s ease;
}
.search-input:focus {
outline: none;
border-color: #667eea;
}
.search-btn {
padding: 12px 20px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border: none;
border-radius: 8px;
cursor: pointer;
font-weight: 600;
display: flex;
align-items: center;
gap: 8px;
transition: transform 0.2s ease;
}
.search-btn:hover {
transform: translateY(-2px);
}
.search-info {
text-align: center;
color: #666;
font-size: 14px;
}
.clear-search {
color: #667eea;
text-decoration: none;
margin-left: 10px;
}
.clear-search:hover {
text-decoration: underline;
}
.data-stats {
background: white;
border-radius: 12px;
padding: 20px;
margin-bottom: 20px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
text-align: center;
}
.stat-item {
display: inline-flex;
flex-direction: column;
align-items: center;
}
.stat-number {
font-size: 32px;
font-weight: 700;
color: #667eea;
}
.stat-label {
font-size: 14px;
color: #666;
margin-top: 5px;
}
.data-container {
background: white;
border-radius: 12px;
padding: 20px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
.data-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
gap: 20px;
}
.data-card {
border: 2px solid #e9ecef;
border-radius: 12px;
overflow: hidden;
transition: all 0.3s ease;
background: #f8f9fa;
}
.data-card:hover {
border-color: #667eea;
transform: translateY(-2px);
box-shadow: 0 8px 25px rgba(102, 126, 234, 0.15);
}
.card-image {
height: 200px;
overflow: hidden;
background: #f0f0f0;
}
.card-image img {
width: 100%;
height: 100%;
object-fit: cover;
cursor: pointer;
transition: transform 0.3s ease;
}
.card-image img:hover {
transform: scale(1.05);
}
.card-content {
padding: 20px;
}
.data-field {
margin-bottom: 12px;
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.field-label {
font-weight: 600;
color: #555;
min-width: 80px;
}
.field-value {
color: #333;
flex: 1;
word-break: break-word;
}
.card-actions {
padding: 15px 20px;
background: white;
border-top: 1px solid #e9ecef;
display: flex;
gap: 10px;
justify-content: flex-end;
}
.btn {
padding: 8px 16px;
border: none;
border-radius: 6px;
cursor: pointer;
font-size: 14px;
font-weight: 500;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 6px;
transition: all 0.2s ease;
}
.btn-edit {
background: #28a745;
color: white;
}
.btn-edit:hover {
background: #218838;
transform: translateY(-1px);
}
.btn-delete {
background: #dc3545;
color: white;
}
.btn-delete:hover {
background: #c82333;
transform: translateY(-1px);
}
.btn-primary {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 12px 24px;
font-size: 16px;
}
.btn-primary:hover {
transform: translateY(-2px);
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #5a6268;
}
.btn-danger {
background: #dc3545;
color: white;
}
.btn-danger:hover {
background: #c82333;
}
.empty-state {
text-align: center;
padding: 60px 20px;
color: #666;
}
.empty-icon {
font-size: 64px;
margin-bottom: 20px;
}
.empty-state h3 {
font-size: 24px;
margin-bottom: 10px;
color: #333;
}
.empty-state p {
font-size: 16px;
margin-bottom: 30px;
}
/* 模态框样式 */
.modal {
display: none;
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
}
.modal-content {
position: relative;
margin: 5% auto;
padding: 20px;
width: 90%;
max-width: 800px;
background: white;
border-radius: 12px;
text-align: center;
}
.modal-small {
max-width: 400px;
margin: 15% auto;
}
.close {
position: absolute;
top: 15px;
right: 25px;
font-size: 28px;
font-weight: bold;
cursor: pointer;
color: #666;
}
.close:hover {
color: #333;
}
#modalImage {
max-width: 100%;
max-height: 70vh;
border-radius: 8px;
}
.modal-actions {
display: flex;
gap: 10px;
justify-content: center;
margin-top: 20px;
}
@media (max-width: 768px) {
.data-grid {
grid-template-columns: 1fr;
}
.search-input-group {
flex-direction: column;
}
.card-actions {
justify-content: center;
}
}
</style>
<script>
// 图片预览功能
function openImageModal(imageSrc) {
document.getElementById('modalImage').src = imageSrc;
document.getElementById('imageModal').style.display = 'block';
}
function closeImageModal() {
document.getElementById('imageModal').style.display = 'none';
}
// 删除确认功能
function confirmDelete(docId) {
document.getElementById('deleteForm').action = '/delete/' + docId;
document.getElementById('deleteModal').style.display = 'block';
}
function closeDeleteModal() {
document.getElementById('deleteModal').style.display = 'none';
}
// 点击模态框外部关闭
window.onclick = function(event) {
const imageModal = document.getElementById('imageModal');
const deleteModal = document.getElementById('deleteModal');
if (event.target === imageModal) {
closeImageModal();
}
if (event.target === deleteModal) {
closeDeleteModal();
}
}
</script>
{% endblock %}

538
templates/profile.html Normal file
View File

@@ -0,0 +1,538 @@
{% extends "base.html" %}
{% block title %}个人设置{% endblock %}
{% block content %}
<div class="content-header">
<h1>个人设置</h1>
<p>管理您的个人信息和账户设置</p>
</div>
<!-- 用户信息卡片 -->
<div class="card">
<h3 style="margin-bottom: 20px; color: var(--primary); font-size: 18px;">
<i style="margin-right: 8px;">👤</i>
用户信息
</h3>
<div class="info-grid">
<div class="info-item">
<span class="info-label">用户名:</span>
<span class="info-value">{{ session.username }}</span>
</div>
<div class="info-item">
<span class="info-label">权限级别:</span>
<span class="permission-badge {{ 'admin' if session.permission == 0 else 'user' }}">
{{ '管理员' if session.permission == 0 else '普通用户' }}
</span>
</div>
</div>
</div>
<!-- 修改密码卡片 -->
<div class="card">
<h3 style="margin-bottom: 20px; color: var(--primary); font-size: 18px;">
<i style="margin-right: 8px;">🔒</i>
修改密码
</h3>
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
{% for category, message in messages %}
<div class="alert alert-{{ 'success' if category == 'success' else 'error' }}">
{{ message }}
</div>
{% endfor %}
{% endif %}
{% endwith %}
<form method="POST" action="{{ url_for('change_own_password') }}" class="password-form" id="passwordForm">
<div class="form-group">
<label for="old_password">当前密码:</label>
<input type="password" id="old_password" name="old_password" required class="form-input">
</div>
<div class="form-group">
<label for="new_password">新密码:</label>
<input type="password" id="new_password" name="new_password" required class="form-input" minlength="6">
<small class="form-help">密码长度至少6位</small>
</div>
<div class="form-group">
<label for="confirm_password">确认新密码:</label>
<input type="password" id="confirm_password" name="confirm_password" required class="form-input">
<small class="form-help" id="password-match-msg"></small>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary" id="submitBtn">
<i style="margin-right: 5px;">💾</i>
修改密码
</button>
</div>
</form>
</div>
<style>
.content-header {
margin-bottom: 30px;
}
.content-header h1 {
color: var(--primary);
font-size: 28px;
margin-bottom: 8px;
font-weight: 600;
}
.content-header p {
color: #666;
font-size: 16px;
margin: 0;
}
.info-grid {
display: grid;
gap: 15px;
}
.info-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 0;
border-bottom: 1px solid #f0f0f0;
}
.info-item:last-child {
border-bottom: none;
}
.info-label {
font-weight: 500;
color: #555;
}
.info-value {
color: #333;
font-weight: 600;
}
.permission-badge {
padding: 4px 12px;
border-radius: 20px;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
}
.permission-badge.admin {
background: var(--accent);
color: white;
}
.permission-badge.user {
background: var(--success);
color: white;
}
.password-form {
max-width: 400px;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-weight: 500;
color: #333;
}
.form-input {
width: 100%;
padding: 12px;
border: 2px solid #e1e5e9;
border-radius: var(--radius);
font-size: 14px;
transition: var(--transition);
}
.form-input:focus {
outline: none;
border-color: var(--primary);
box-shadow: 0 0 0 3px rgba(67, 97, 238, 0.1);
}
.form-help {
display: block;
margin-top: 5px;
font-size: 12px;
color: #666;
}
.form-actions {
margin-top: 25px;
}
.btn {
padding: 12px 24px;
border: none;
border-radius: var(--radius);
font-size: 14px;
font-weight: 500;
cursor: pointer;
text-decoration: none;
display: inline-flex;
align-items: center;
transition: var(--transition);
}
.btn-primary {
background: var(--primary);
color: white;
}
.btn-primary:hover {
background: var(--secondary);
transform: translateY(-1px);
}
.btn:disabled {
opacity: 0.6;
cursor: not-allowed;
}
.alert {
padding: 12px 16px;
border-radius: var(--radius);
margin-bottom: 20px;
font-size: 14px;
}
.alert-success {
background: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.alert-error {
background: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
@media (max-width: 768px) {
.password-form {
max-width: none;
}
.info-item {
flex-direction: column;
align-items: flex-start;
gap: 5px;
}
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function() {
const newPassword = document.getElementById('new_password');
const confirmPassword = document.getElementById('confirm_password');
const submitBtn = document.getElementById('submitBtn');
const matchMsg = document.getElementById('password-match-msg');
function checkPasswordMatch() {
if (confirmPassword.value === '') {
matchMsg.textContent = '';
matchMsg.style.color = '#666';
return;
}
if (newPassword.value === confirmPassword.value) {
matchMsg.textContent = '✓ 密码匹配';
matchMsg.style.color = '#28a745';
submitBtn.disabled = false;
} else {
matchMsg.textContent = '✗ 密码不匹配';
matchMsg.style.color = '#dc3545';
submitBtn.disabled = true;
}
}
newPassword.addEventListener('input', checkPasswordMatch);
confirmPassword.addEventListener('input', checkPasswordMatch);
// 表单验证
document.getElementById('passwordForm').addEventListener('submit', function(e) {
if (newPassword.value !== confirmPassword.value) {
e.preventDefault();
alert('新密码和确认密码不匹配!');
}
if (newPassword.value.length < 6) {
e.preventDefault();
alert('密码长度至少6位');
}
});
});
</script>
{% endblock %}
.permission-admin {
background: #e3f2fd;
color: #1976d2;
}
.permission-user {
background: #f3e5f5;
color: #7b1fa2;
}
.password-form {
background: white;
border: 2px solid #e9ecef;
border-radius: 12px;
padding: 25px;
}
.password-form h3 {
color: #333;
margin-bottom: 20px;
font-size: 18px;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
margin-bottom: 8px;
color: #555;
font-weight: 500;
}
.form-group input {
width: 100%;
padding: 12px 16px;
border: 2px solid #e9ecef;
border-radius: 8px;
font-size: 16px;
transition: all 0.3s ease;
background: #f8f9fa;
}
.form-group input:focus {
outline: none;
border-color: #667eea;
background: white;
box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}
.btn {
width: 100%;
padding: 12px 24px;
border: none;
border-radius: 8px;
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.btn-primary {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(102, 126, 234, 0.3);
}
.btn-secondary {
background: #6c757d;
color: white;
margin-top: 15px;
}
.btn-secondary:hover {
background: #5a6268;
transform: translateY(-2px);
}
.flash-messages {
margin-bottom: 20px;
}
.flash-message {
padding: 12px 16px;
border-radius: 8px;
margin-bottom: 10px;
font-weight: 500;
}
.flash-error {
background: #f8d7da;
color: #721c24;
border: 1px solid #f5c6cb;
}
.flash-success {
background: #d4edda;
color: #155724;
border: 1px solid #c3e6cb;
}
.flash-info {
background: #d1ecf1;
color: #0c5460;
border: 1px solid #bee5eb;
}
.navigation-links {
text-align: center;
margin-top: 30px;
padding-top: 20px;
border-top: 1px solid #e9ecef;
}
.nav-link {
display: inline-block;
margin: 0 15px;
color: #667eea;
text-decoration: none;
font-weight: 500;
transition: color 0.3s ease;
}
.nav-link:hover {
color: #764ba2;
text-decoration: underline;
}
@media (max-width: 600px) {
.profile-container {
padding: 30px 20px;
margin: 10px;
}
.profile-header h1 {
font-size: 24px;
}
.info-item {
flex-direction: column;
align-items: flex-start;
gap: 5px;
}
}
</style>
</head>
<body>
<div class="profile-container">
<!-- Flash Messages -->
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
<div class="flash-messages">
{% for category, message in messages %}
<div class="flash-message flash-{{ category }}">
{{ message }}
</div>
{% endfor %}
</div>
{% endif %}
{% endwith %}
<div class="profile-header">
<h1>个人设置</h1>
<p>管理您的账户信息和密码</p>
</div>
<!-- 用户信息显示 -->
<div class="user-info">
<h3>账户信息</h3>
<div class="info-item">
<span class="info-label">用户名:</span>
<span class="info-value">{{ session.user_id }}</span>
</div>
<div class="info-item">
<span class="info-label">权限级别:</span>
<span class="permission-badge {{ 'permission-admin' if session.permission == 0 else 'permission-user' }}">
{{ '管理员' if session.permission == 0 else '普通用户' }}
</span>
</div>
</div>
<!-- 修改密码表单 -->
<form method="POST" action="{{ url_for('change_own_password') }}" class="password-form" id="passwordForm">
<h3>修改密码</h3>
<div class="form-group">
<label for="old_password">当前密码:</label>
<input type="password" id="old_password" name="old_password" required>
</div>
<div class="form-group">
<label for="new_password">新密码:</label>
<input type="password" id="new_password" name="new_password" required minlength="6">
</div>
<div class="form-group">
<label for="confirm_password">确认新密码:</label>
<input type="password" id="confirm_password" name="confirm_password" required minlength="6">
</div>
<button type="submit" class="btn btn-primary">更新密码</button>
</form>
<!-- 导航链接 -->
<div class="navigation-links">
<a href="{{ url_for('index') }}" class="nav-link">返回首页</a>
<a href="{{ url_for('my_data') }}" class="nav-link">我的数据</a>
{% if session.permission == 0 %}
<a href="{{ url_for('user_management') }}" class="nav-link">用户管理</a>
{% endif %}
</div>
</div>
<script>
// 密码确认验证
document.getElementById('passwordForm').addEventListener('submit', function(e) {
const newPassword = document.getElementById('new_password').value;
const confirmPassword = document.getElementById('confirm_password').value;
if (newPassword !== confirmPassword) {
e.preventDefault();
alert('新密码和确认密码不一致,请重新输入!');
return false;
}
if (newPassword.length < 6) {
e.preventDefault();
alert('新密码长度至少6位');
return false;
}
});
// 输入实时验证
document.getElementById('confirm_password').addEventListener('input', function() {
const newPassword = document.getElementById('new_password').value;
const confirmPassword = this.value;
if (confirmPassword && newPassword !== confirmPassword) {
this.style.borderColor = '#dc3545';
this.style.background = '#fff5f5';
} else {
this.style.borderColor = '#e9ecef';
this.style.background = '#f8f9fa';
}
});
</script>
</body>
</html>

440
templates/register.html Normal file
View File

@@ -0,0 +1,440 @@
{% extends "base.html" %}
{% block title %}注册新用户{% endblock %}
{% block content %}
<div class="register-container">
<div class="register-card">
<div class="register-header">
<h1>注册新用户</h1>
<p>创建新的系统用户账户</p>
</div>
<form method="POST" class="register-form">
<div class="form-group">
<label for="username">
<i class="fas fa-user"></i>
用户名
</label>
<input type="text"
id="username"
name="username"
required
minlength="3"
maxlength="20"
placeholder="请输入用户名3-20个字符">
<small class="form-text">用户名长度为3-20个字符只能包含字母、数字和下划线</small>
</div>
<div class="form-group">
<label for="password">
<i class="fas fa-lock"></i>
密码
</label>
<input type="password"
id="password"
name="password"
required
minlength="6"
placeholder="请输入密码至少6位">
<small class="form-text">密码长度至少6位建议包含字母和数字</small>
</div>
<div class="form-group">
<label for="confirm_password">
<i class="fas fa-lock"></i>
确认密码
</label>
<input type="password"
id="confirm_password"
name="confirm_password"
required
minlength="6"
placeholder="请再次输入密码">
<small class="form-text">请再次输入相同的密码进行确认</small>
</div>
<div class="form-group">
<label for="permission">
<i class="fas fa-user-cog"></i>
权限级别
</label>
<select id="permission" name="permission" required>
<option value="">请选择权限级别</option>
<option value="1">普通用户 - 可以录入和查询数据</option>
<option value="0">管理员 - 拥有所有权限</option>
</select>
<small class="form-text">
<strong>普通用户:</strong>可以上传图片、录入数据、查询数据<br>
<strong>管理员:</strong>拥有所有权限,包括用户管理和数据管理
</small>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary">
<i class="fas fa-user-plus"></i>
创建用户
</button>
<a href="{{ url_for('user_management') }}" class="btn btn-secondary">
<i class="fas fa-arrow-left"></i>
返回用户管理
</a>
</div>
</form>
</div>
</div>
<style>
.register-container {
display: flex;
justify-content: center;
align-items: center;
min-height: calc(100vh - 200px);
padding: 20px;
}
.register-card {
background: white;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0,0,0,0.1);
padding: 40px;
width: 100%;
max-width: 500px;
}
.register-header {
text-align: center;
margin-bottom: 30px;
}
.register-header h1 {
color: #333;
margin-bottom: 10px;
font-size: 28px;
}
.register-header p {
color: #666;
font-size: 16px;
margin: 0;
}
.register-form {
width: 100%;
}
.form-group {
margin-bottom: 25px;
}
.form-group label {
display: block;
margin-bottom: 8px;
font-weight: 600;
color: #333;
font-size: 14px;
}
.form-group label i {
margin-right: 8px;
color: #007bff;
width: 16px;
}
.form-group input,
.form-group select {
width: 100%;
padding: 12px 16px;
border: 2px solid #e0e0e0;
border-radius: 8px;
font-size: 14px;
transition: all 0.3s ease;
box-sizing: border-box;
}
.form-group input:focus,
.form-group select:focus {
outline: none;
border-color: #007bff;
box-shadow: 0 0 0 3px rgba(0,123,255,0.1);
}
.form-group input:invalid {
border-color: #dc3545;
}
.form-group input:valid {
border-color: #28a745;
}
.form-text {
display: block;
margin-top: 5px;
font-size: 12px;
color: #666;
line-height: 1.4;
}
.form-actions {
display: flex;
gap: 15px;
margin-top: 30px;
}
.btn {
padding: 12px 24px;
border: none;
border-radius: 8px;
cursor: pointer;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 14px;
font-weight: 600;
transition: all 0.3s ease;
flex: 1;
}
.btn i {
margin-right: 8px;
}
.btn-primary {
background-color: #007bff;
color: white;
}
.btn-primary:hover {
background-color: #0056b3;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0,123,255,0.3);
}
.btn-secondary {
background-color: #6c757d;
color: white;
}
.btn-secondary:hover {
background-color: #545b62;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(108,117,125,0.3);
}
/* 响应式设计 */
@media (max-width: 768px) {
.register-container {
padding: 10px;
}
.register-card {
padding: 30px 20px;
}
.form-actions {
flex-direction: column;
}
.btn {
width: 100%;
}
}
/* 密码强度指示器 */
.password-strength {
margin-top: 5px;
height: 4px;
background-color: #e0e0e0;
border-radius: 2px;
overflow: hidden;
}
.password-strength-bar {
height: 100%;
width: 0%;
transition: all 0.3s ease;
}
.strength-weak {
background-color: #dc3545;
width: 33%;
}
.strength-medium {
background-color: #ffc107;
width: 66%;
}
.strength-strong {
background-color: #28a745;
width: 100%;
}
/* 表单验证样式 */
.form-group.error input,
.form-group.error select {
border-color: #dc3545;
box-shadow: 0 0 0 3px rgba(220,53,69,0.1);
}
.form-group.success input,
.form-group.success select {
border-color: #28a745;
box-shadow: 0 0 0 3px rgba(40,167,69,0.1);
}
.error-message {
color: #dc3545;
font-size: 12px;
margin-top: 5px;
display: none;
}
.success-message {
color: #28a745;
font-size: 12px;
margin-top: 5px;
display: none;
}
</style>
<script>
// 表单验证
document.addEventListener('DOMContentLoaded', function() {
const form = document.querySelector('.register-form');
const username = document.getElementById('username');
const password = document.getElementById('password');
const confirmPassword = document.getElementById('confirm_password');
const permission = document.getElementById('permission');
// 用户名验证
username.addEventListener('input', function() {
const value = this.value;
const formGroup = this.closest('.form-group');
if (value.length < 3) {
setFieldError(formGroup, '用户名至少需要3个字符');
} else if (value.length > 20) {
setFieldError(formGroup, '用户名不能超过20个字符');
} else if (!/^[a-zA-Z0-9_]+$/.test(value)) {
setFieldError(formGroup, '用户名只能包含字母、数字和下划线');
} else {
setFieldSuccess(formGroup, '用户名格式正确');
}
});
// 密码验证
password.addEventListener('input', function() {
const value = this.value;
const formGroup = this.closest('.form-group');
if (value.length < 6) {
setFieldError(formGroup, '密码至少需要6个字符');
} else {
setFieldSuccess(formGroup, '密码长度符合要求');
}
// 检查确认密码
if (confirmPassword.value) {
validateConfirmPassword();
}
});
// 确认密码验证
confirmPassword.addEventListener('input', validateConfirmPassword);
function validateConfirmPassword() {
const formGroup = confirmPassword.closest('.form-group');
if (confirmPassword.value !== password.value) {
setFieldError(formGroup, '两次输入的密码不一致');
} else if (confirmPassword.value.length >= 6) {
setFieldSuccess(formGroup, '密码确认正确');
}
}
// 权限选择验证
permission.addEventListener('change', function() {
const formGroup = this.closest('.form-group');
if (this.value === '') {
setFieldError(formGroup, '请选择权限级别');
} else {
setFieldSuccess(formGroup, '权限级别已选择');
}
});
// 表单提交验证
form.addEventListener('submit', function(e) {
let isValid = true;
// 验证用户名
if (username.value.length < 3 || username.value.length > 20 || !/^[a-zA-Z0-9_]+$/.test(username.value)) {
isValid = false;
setFieldError(username.closest('.form-group'), '用户名格式不正确');
}
// 验证密码
if (password.value.length < 6) {
isValid = false;
setFieldError(password.closest('.form-group'), '密码长度至少6位');
}
// 验证确认密码
if (password.value !== confirmPassword.value) {
isValid = false;
setFieldError(confirmPassword.closest('.form-group'), '两次输入的密码不一致');
}
// 验证权限选择
if (permission.value === '') {
isValid = false;
setFieldError(permission.closest('.form-group'), '请选择权限级别');
}
if (!isValid) {
e.preventDefault();
}
});
function setFieldError(formGroup, message) {
formGroup.classList.remove('success');
formGroup.classList.add('error');
let errorMsg = formGroup.querySelector('.error-message');
if (!errorMsg) {
errorMsg = document.createElement('div');
errorMsg.className = 'error-message';
formGroup.appendChild(errorMsg);
}
errorMsg.textContent = message;
errorMsg.style.display = 'block';
const successMsg = formGroup.querySelector('.success-message');
if (successMsg) {
successMsg.style.display = 'none';
}
}
function setFieldSuccess(formGroup, message) {
formGroup.classList.remove('error');
formGroup.classList.add('success');
let successMsg = formGroup.querySelector('.success-message');
if (!successMsg) {
successMsg = document.createElement('div');
successMsg.className = 'success-message';
formGroup.appendChild(successMsg);
}
successMsg.textContent = message;
successMsg.style.display = 'block';
const errorMsg = formGroup.querySelector('.error-message');
if (errorMsg) {
errorMsg.style.display = 'none';
}
}
});
</script>
{% endblock %}

View File

@@ -82,6 +82,7 @@
box-shadow: 0 2px 10px rgba(0,0,0,0.05);
border-left: 4px solid #3498db;
transition: transform 0.3s;
cursor: pointer;
}
.result-item:hover {
@@ -89,14 +90,119 @@
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.result-item p {
margin-bottom: 10px;
line-height: 1.6;
.result-preview {
margin-bottom: 15px;
}
.result-preview .field-item {
display: inline-block;
margin-right: 20px;
margin-bottom: 8px;
padding: 5px 10px;
background: #f8f9fa;
border-radius: 4px;
border: 1px solid #e9ecef;
}
.result-preview .field-label {
font-weight: bold;
color: #2c3e50;
margin-right: 5px;
}
.result-preview .field-value {
color: #34495e;
}
.result-item strong {
.result-details {
display: none;
border-top: 1px solid #e9ecef;
padding-top: 15px;
margin-top: 15px;
}
.result-details.expanded {
display: block;
}
.result-details .field-item {
margin-bottom: 10px;
padding: 8px 12px;
background: #f8f9fa;
border-radius: 4px;
border-left: 3px solid #3498db;
}
.result-details .field-label {
font-weight: bold;
color: #2c3e50;
display: inline-block;
min-width: 120px;
}
.result-details .field-value {
color: #34495e;
}
.expand-indicator {
float: right;
color: #3498db;
font-size: 14px;
transition: all 0.3s;
}
.result-item.expanded .expand-indicator {
color: #2c3e50;
}
.image-container {
margin-top: 15px;
text-align: center;
}
.result-image {
max-width: 100%;
max-height: 300px;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
cursor: pointer;
transition: transform 0.3s;
}
.result-image:hover {
transform: scale(1.05);
}
.image-modal {
display: none;
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.8);
cursor: pointer;
}
.image-modal img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-width: 90%;
max-height: 90%;
border-radius: 8px;
}
.close-modal {
position: absolute;
top: 20px;
right: 30px;
color: white;
font-size: 30px;
font-weight: bold;
cursor: pointer;
}
/* 加载状态 */
@@ -152,22 +258,47 @@
return;
}
const html = realData.map(item => {
const html = realData.map((item, index) => {
const source = item._source || {};
const students = Array.isArray(source.students)
? source.students.join(', ')
: (source.students || '无');
const allFields = Object.entries(source).filter(([key, value]) => key !== 'image' && value);
const teacher = Array.isArray(source.teacher)
? source.teacher.join(', ')
: (source.teacher || '无');
// 获取前3个字段作为预览
const previewFields = allFields.slice(0, 3);
const hasMoreFields = allFields.length > 3;
// 生成预览字段HTML
const previewHtml = previewFields.map(([key, value]) => `
<div class="field-item">
<span class="field-label">${key}:</span>
<span class="field-value">${Array.isArray(value) ? value.join(', ') : value}</span>
</div>
`).join('');
// 生成详细字段HTML
const detailsHtml = allFields.map(([key, value]) => `
<div class="field-item">
<span class="field-label">${key}:</span>
<span class="field-value">${Array.isArray(value) ? value.join(', ') : value}</span>
</div>
`).join('');
// 图片HTML
const imageHtml = source.image ? `
<div class="image-container">
<img src="/image/${source.image}" alt="相关图片" class="result-image" onclick="openImageModal('/image/${source.image}')">
</div>
` : '';
return `
<div class="result-item">
<p><strong>比赛/论文名称:</strong>${source.id || '无'}</p>
<p><strong>项目名称:</strong>${source.name || '无'}</p>
<p><strong>学生:</strong>${students}</p>
<p><strong>指导老师:</strong>${teacher}</p>
<div class="result-item" onclick="toggleDetails(${index})" data-index="${index}">
<div class="result-preview">
${previewHtml}
${hasMoreFields ? '<span class="expand-indicator">▼ 点击查看更多</span>' : ''}
</div>
<div class="result-details" id="details-${index}">
${detailsHtml}
${imageHtml}
</div>
</div>
`;
}).join('');
@@ -178,5 +309,54 @@
resultsContainer.innerHTML = '<div class="error">搜索过程中发生错误</div>';
});
});
function toggleDetails(index) {
const resultItem = document.querySelector(`[data-index="${index}"]`);
const detailsDiv = document.getElementById(`details-${index}`);
if (detailsDiv.classList.contains('expanded')) {
detailsDiv.classList.remove('expanded');
resultItem.classList.remove('expanded');
} else {
detailsDiv.classList.add('expanded');
resultItem.classList.add('expanded');
}
}
function openImageModal(imageSrc) {
event.stopPropagation(); // 阻止事件冒泡
// 创建模态框
const modal = document.createElement('div');
modal.className = 'image-modal';
modal.innerHTML = `
<span class="close-modal" onclick="closeImageModal()">&times;</span>
<img src="${imageSrc}" alt="图片预览">
`;
document.body.appendChild(modal);
modal.style.display = 'block';
// 点击模态框背景关闭
modal.addEventListener('click', function(e) {
if (e.target === modal) {
closeImageModal();
}
});
}
function closeImageModal() {
const modal = document.querySelector('.image-modal');
if (modal) {
modal.remove();
}
}
// ESC键关闭模态框
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape') {
closeImageModal();
}
});
</script>
{% endblock %}

View File

@@ -0,0 +1,356 @@
{% extends "base.html" %}
{% block title %}用户管理{% endblock %}
{% block content %}
<div class="container">
<div class="header-section">
<h1>用户管理</h1>
<a href="{{ url_for('register') }}" class="btn btn-primary">
<i class="fas fa-user-plus"></i> 注册新用户
</a>
</div>
<div class="users-table">
<table class="table">
<thead>
<tr>
<th>用户ID</th>
<th>用户名</th>
<th>权限级别</th>
<th>操作</th>
</tr>
</thead>
<tbody>
{% for user in users %}
<tr>
<td>{{ user.user_id }}</td>
<td>{{ user.username }}</td>
<td>
<span class="permission-badge {% if user.premission == 0 %}admin{% else %}user{% endif %}">
{% if user.premission == 0 %}管理员{% else %}普通用户{% endif %}
</span>
</td>
<td class="actions">
{% if user.username != 'admin' %}
<!-- 修改密码按钮 -->
<button class="btn btn-sm btn-warning" onclick="showPasswordModal('{{ user.username }}')">
<i class="fas fa-key"></i> 修改密码
</button>
<!-- 修改权限按钮 -->
<button class="btn btn-sm btn-info" onclick="showPermissionModal('{{ user.username }}', {{ user.premission }})">
<i class="fas fa-user-cog"></i> 修改权限
</button>
<!-- 删除用户按钮 -->
<button class="btn btn-sm btn-danger" onclick="confirmDelete('{{ user.username }}')">
<i class="fas fa-trash"></i> 删除
</button>
{% else %}
<span class="text-muted">系统管理员</span>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
<!-- 修改密码模态框 -->
<div id="passwordModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('passwordModal')">&times;</span>
<h2>修改用户密码</h2>
<form id="passwordForm" method="POST">
<div class="form-group">
<label for="new_password">新密码:</label>
<input type="password" id="new_password" name="new_password" required minlength="6">
</div>
<div class="form-group">
<label for="confirm_password">确认密码:</label>
<input type="password" id="confirm_password" name="confirm_password" required minlength="6">
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary">确认修改</button>
<button type="button" class="btn btn-secondary" onclick="closeModal('passwordModal')">取消</button>
</div>
</form>
</div>
</div>
<!-- 修改权限模态框 -->
<div id="permissionModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('permissionModal')">&times;</span>
<h2>修改用户权限</h2>
<form id="permissionForm" method="POST">
<div class="form-group">
<label for="permission">权限级别:</label>
<select id="permission" name="permission" required>
<option value="0">管理员</option>
<option value="1">普通用户</option>
</select>
</div>
<div class="form-actions">
<button type="submit" class="btn btn-primary">确认修改</button>
<button type="button" class="btn btn-secondary" onclick="closeModal('permissionModal')">取消</button>
</div>
</form>
</div>
</div>
<!-- 删除确认模态框 -->
<div id="deleteModal" class="modal">
<div class="modal-content">
<span class="close" onclick="closeModal('deleteModal')">&times;</span>
<h2>确认删除</h2>
<p>确定要删除用户 <strong id="deleteUsername"></strong> 吗?此操作不可撤销。</p>
<div class="form-actions">
<form id="deleteForm" method="POST">
<button type="submit" class="btn btn-danger">确认删除</button>
<button type="button" class="btn btn-secondary" onclick="closeModal('deleteModal')">取消</button>
</form>
</div>
</div>
</div>
<style>
.container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}
.header-section {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
padding-bottom: 20px;
border-bottom: 2px solid #e0e0e0;
}
.header-section h1 {
color: #333;
margin: 0;
}
.users-table {
background: white;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
overflow: hidden;
}
.table {
width: 100%;
border-collapse: collapse;
}
.table th,
.table td {
padding: 15px;
text-align: left;
border-bottom: 1px solid #e0e0e0;
}
.table th {
background-color: #f8f9fa;
font-weight: 600;
color: #333;
}
.permission-badge {
padding: 4px 12px;
border-radius: 20px;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
}
.permission-badge.admin {
background-color: #dc3545;
color: white;
}
.permission-badge.user {
background-color: #28a745;
color: white;
}
.actions {
white-space: nowrap;
}
.btn {
padding: 8px 16px;
border: none;
border-radius: 4px;
cursor: pointer;
text-decoration: none;
display: inline-block;
margin-right: 5px;
font-size: 14px;
transition: all 0.3s ease;
}
.btn-primary {
background-color: #007bff;
color: white;
}
.btn-warning {
background-color: #ffc107;
color: #212529;
}
.btn-info {
background-color: #17a2b8;
color: white;
}
.btn-danger {
background-color: #dc3545;
color: white;
}
.btn-secondary {
background-color: #6c757d;
color: white;
}
.btn-sm {
padding: 6px 12px;
font-size: 12px;
}
.btn:hover {
opacity: 0.8;
transform: translateY(-1px);
}
/* 模态框样式 */
.modal {
display: none;
position: fixed;
z-index: 1000;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.5);
}
.modal-content {
background-color: white;
margin: 10% auto;
padding: 30px;
border-radius: 8px;
width: 90%;
max-width: 500px;
position: relative;
}
.close {
position: absolute;
right: 15px;
top: 15px;
font-size: 28px;
font-weight: bold;
cursor: pointer;
color: #aaa;
}
.close:hover {
color: #000;
}
.form-group {
margin-bottom: 20px;
}
.form-group label {
display: block;
margin-bottom: 5px;
font-weight: 600;
color: #333;
}
.form-group input,
.form-group select {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
font-size: 14px;
}
.form-actions {
display: flex;
gap: 10px;
justify-content: flex-end;
margin-top: 20px;
}
.text-muted {
color: #6c757d;
font-style: italic;
}
</style>
<script>
function showPasswordModal(username) {
document.getElementById('passwordForm').action = `/change_password/${username}`;
document.getElementById('passwordModal').style.display = 'block';
}
function showPermissionModal(username, currentPermission) {
document.getElementById('permissionForm').action = `/change_permission/${username}`;
document.getElementById('permission').value = currentPermission;
document.getElementById('permissionModal').style.display = 'block';
}
function confirmDelete(username) {
document.getElementById('deleteUsername').textContent = username;
document.getElementById('deleteForm').action = `/delete_user/${username}`;
document.getElementById('deleteModal').style.display = 'block';
}
function closeModal(modalId) {
document.getElementById(modalId).style.display = 'none';
// 清空表单
const forms = document.querySelectorAll(`#${modalId} form`);
forms.forEach(form => form.reset());
}
// 点击模态框外部关闭
window.onclick = function(event) {
const modals = document.querySelectorAll('.modal');
modals.forEach(modal => {
if (event.target === modal) {
modal.style.display = 'none';
}
});
}
// 密码确认验证
document.getElementById('passwordForm').addEventListener('submit', function(e) {
const password = document.getElementById('new_password').value;
const confirmPassword = document.getElementById('confirm_password').value;
if (password !== confirmPassword) {
e.preventDefault();
alert('两次输入的密码不一致!');
return false;
}
if (password.length < 6) {
e.preventDefault();
alert('密码长度至少6位');
return false;
}
});
</script>
{% endblock %}