sunpayus/templates/configure_roles.html

83 lines
3.4 KiB
HTML
Raw Normal View History

<!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>