st2411020120
d1066566c0
1. 优化工作坊列表布局，实现标题与按钮垂直对齐 2. 实现查看结果按钮的防抖功能和加载状态 3. 优化时间排序逻辑，默认按时间降序，点击按钮按时间升序 4. 实现多选功能，勾选框与工作坊名称高度对齐 5. 添加AI结果缓存功能，避免重复API调用 6. 优化空状态显示，居中创建第一个工作坊按钮 7. 完善README.md文档，添加新功能描述和使用指南 8. 调整字体样式，优化视觉效果
83 lines
3.4 KiB
HTML
83 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>配置角色 - {{ workshop.name }}</title>
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<!-- 页面标题 -->
|
|
<header>
|
|
<h1>配置角色 - {{ workshop.name }}</h1>
|
|
<p>为工作坊添加不同角色，每个角色将从独特的视角参与辩论</p>
|
|
</header>
|
|
|
|
<!-- 返回按钮 -->
|
|
<button onclick="window.location.href='{{ url_for('index') }}'" class="btn-secondary">返回首页</button>
|
|
|
|
<!-- 流程指示器 -->
|
|
<div class="process-indicator">
|
|
<div class="process-step">
|
|
<div class="process-step-number completed">1</div>
|
|
<div class="process-step-text completed">创建工作坊</div>
|
|
</div>
|
|
<div class="process-arrow">→</div>
|
|
<div class="process-step">
|
|
<div class="process-step-number active">2</div>
|
|
<div class="process-step-text active">配置角色</div>
|
|
</div>
|
|
<div class="process-arrow">→</div>
|
|
<div class="process-step">
|
|
<div class="process-step-number">3</div>
|
|
<div class="process-step-text">开始辩论</div>
|
|
</div>
|
|
<div class="process-arrow">→</div>
|
|
<div class="process-step">
|
|
<div class="process-step-number">4</div>
|
|
<div class="process-step-text">查看结果</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 已配置角色列表 -->
|
|
<div class="card">
|
|
<h3>已配置角色</h3>
|
|
{% if workshop.roles %}
|
|
{% for role in workshop.roles %}
|
|
<div class="role-item">
|
|
<div class="role-name">{{ role.name }}</div>
|
|
<div class="role-perspective">{{ role.perspective }}</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% else %}
|
|
<div class="empty-state">
|
|
<p>暂无角色，请添加第一个角色</p>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<!-- 添加角色表单 -->
|
|
<div class="card">
|
|
<h3>添加新角色</h3>
|
|
<form method="post">
|
|
<div class="form-group">
|
|
<label for="role_name">角色名称</label>
|
|
<input type="text" id="role_name" name="role_name" placeholder="请输入角色名称">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="role_perspective">角色视角</label>
|
|
<textarea id="role_perspective" name="role_perspective" placeholder="请描述该角色的视角和立场"></textarea>
|
|
</div>
|
|
|
|
<div class="btn-group">
|
|
<button type="submit" name="remove_current" class="btn-danger">删除此角色</button>
|
|
<button type="submit" name="add_more" class="btn-primary">添加更多角色</button>
|
|
<button type="submit" name="finish" class="btn-success">完成配置，开始辩论</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |