297 lines
12 KiB
HTML
297 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>All Information Form</title>
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0-alpha1/css/bootstrap.min.css">
|
||
<style>
|
||
body {
|
||
background-color: #f4f4f9;
|
||
font-family: Arial, sans-serif;
|
||
}
|
||
.container {
|
||
max-width: 900px;
|
||
}
|
||
.form-section {
|
||
background-color: #ffffff;
|
||
border-radius: 8px;
|
||
padding: 20px;
|
||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
|
||
margin-bottom: 30px;
|
||
}
|
||
.form-section h4 {
|
||
font-size: 1.25rem;
|
||
color: #333;
|
||
margin-bottom: 20px;
|
||
}
|
||
.form-section .border {
|
||
border: 1px solid #e0e0e0;
|
||
border-radius: 8px;
|
||
}
|
||
.form-section .mb-3 {
|
||
margin-bottom: 15px;
|
||
}
|
||
.form-section .form-control {
|
||
border-radius: 6px;
|
||
}
|
||
.btn-submit {
|
||
background-color: #007bff;
|
||
color: #fff;
|
||
border: none;
|
||
padding: 12px 30px;
|
||
font-size: 16px;
|
||
border-radius: 6px;
|
||
width: 100%;
|
||
}
|
||
.btn-submit:hover {
|
||
background-color: #0056b3;
|
||
cursor: pointer;
|
||
}
|
||
.empty-message {
|
||
color: #888;
|
||
font-size: 1rem;
|
||
text-align: center;
|
||
}
|
||
.alert {
|
||
margin-top: 20px;
|
||
padding: 15px;
|
||
}
|
||
|
||
/* 优化 textarea 的样式 */
|
||
textarea {
|
||
height: 150px; /* 设置合适的高度 */
|
||
resize: vertical; /* 只允许垂直调整大小 */
|
||
padding: 10px; /* 设置内边距，增加可读性 */
|
||
}
|
||
|
||
/* 如果 textarea 太长，可以设置最大高度 */
|
||
textarea {
|
||
width: 100%; /* 设置最大高度，避免过高 */
|
||
}
|
||
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
{% extends 'admin/base_site.html' %}
|
||
<!-- {% block title %}
|
||
{{ admin_site.site_title }} - {{ user.username }}'s Profile
|
||
{% endblock %} -->
|
||
|
||
{% block branding %}
|
||
<h1 id="site-name"><a href="{% url 'admin:index' %}">诊断应用后台</a></h1>
|
||
{% endblock %}
|
||
|
||
|
||
{% block content %}
|
||
|
||
<div class="container mt-5">
|
||
<h2 class="text-center mb-4">填写信息 - {{ user.name }}</h2>
|
||
|
||
<form method="POST">
|
||
<!-- 联系方式 -->
|
||
<div class="form-section">
|
||
<h4>联系方式</h4>
|
||
{{ contact_info_form.as_p }}
|
||
</div>
|
||
|
||
<!-- 就读信息 -->
|
||
<div class="form-section">
|
||
<h4>就读信息</h4>
|
||
{{ school_info_form.as_p }}
|
||
</div>
|
||
|
||
<!-- 学习情况 -->
|
||
<div class="form-section">
|
||
<h4>学习情况</h4>
|
||
<!-- <div id="gradeForm" style="border: 1px solid #ccc; padding: 10px;">
|
||
<div class="form-group">
|
||
<label for="subject1">语文</label>
|
||
<input type="text" id="subject1" name="subject1">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject2">数学</label>
|
||
<input type="text" id="subject2" name="subject2">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject3">英语</label>
|
||
<input type="text" id="subject3" name="subject3">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject4">物理</label>
|
||
<input type="text" id="subject4" name="subject4">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject5">化学</label>
|
||
<input type="text" id="subject5" name="subject5">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject6">生物</label>
|
||
<input type="text" id="subject6" name="subject6">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject7">历史</label>
|
||
<input type="text" id="subject7" name="subject7">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject8">地理</label>
|
||
<input type="text" id="subject8" name="subject8">
|
||
</div>
|
||
<div class="form-group">
|
||
<label for="subject9">政治</label>
|
||
<input type="text" id="subject9" name="subject9">
|
||
</div>
|
||
|
||
<div style="margin-top: 10px;">
|
||
<div id="grades_parse_result">生成json字符串：{}</div>
|
||
<button type="button" id="parseGrades" class="btn btn-primary">解析成绩</button>
|
||
|
||
<div>
|
||
<label for="json_encoded_grades">输入json字符串</label>
|
||
<input type="text" id="json_encoded_grades" name="json_encoded_grades">
|
||
</div>
|
||
<button type="button" id="showGrades" class="btn btn-primary">展示成绩</button>
|
||
</div>
|
||
|
||
<script>
|
||
document.getElementById('parseGrades').addEventListener('click', function(event) {
|
||
// 获取所有科目的成绩输入框
|
||
const subjects = ['subject1', 'subject2', 'subject3', 'subject4', 'subject5', 'subject6', 'subject7', 'subject8', 'subject9']
|
||
let grades = {}
|
||
let atLeastOneFilled = false
|
||
// 获取每个科目的成绩，检查是否有至少一项成绩填写
|
||
subjects.forEach(subject => {
|
||
const grade = document.getElementById(subject).value.trim()
|
||
if (grade) {
|
||
grades[subject] = grade
|
||
atLeastOneFilled = true
|
||
}
|
||
});
|
||
// 检查是否至少填写了一项成绩
|
||
if (!atLeastOneFilled) {
|
||
alert("至少填写一门成绩！")
|
||
return
|
||
}
|
||
// 将成绩数据转换为 JSON 格式
|
||
const jsonGrades = JSON.stringify(grades)
|
||
// 发送数据到后台（你可以修改为你自己的后台 API）
|
||
console.log("成绩数据:", jsonGrades)
|
||
document.getElementById('grades_parse_result').innerHTML = `生成json字符串：${jsonGrades}`
|
||
navigator.clipboard.writeText(jsonGrades).then(function() {
|
||
alert("文本已复制到剪贴板！");
|
||
}).catch(function(err) {
|
||
alert("复制失败: " + err);
|
||
});
|
||
});
|
||
|
||
document.getElementById('showGrades').addEventListener('click', function(event) {
|
||
// 获取 JSON 格式的成绩数据
|
||
const jsonGrades = document.getElementById('json_encoded_grades').value.trim()
|
||
if (!jsonGrades) {
|
||
alert("请输入 JSON 格式的成绩数据！")
|
||
return
|
||
}
|
||
// 解析 JSON 数据
|
||
const grades = JSON.parse(jsonGrades)
|
||
const subjects = ['subject1', 'subject2', 'subject3', 'subject4', 'subject5', 'subject6', 'subject7', 'subject8', 'subject9']
|
||
// 遍历每个科目，填充相应的成绩
|
||
subjects.forEach(subject => {
|
||
if (grades[subject]) {
|
||
document.getElementById(subject).value = grades[subject] // 填充成绩数据
|
||
}
|
||
})
|
||
})
|
||
</script>
|
||
</div> -->
|
||
{{ academic_info_form.as_p }}
|
||
</div>
|
||
|
||
<!-- 健康状况 -->
|
||
<div class="form-section">
|
||
<h4>健康状况</h4>
|
||
{{ health_info_form.as_p }}
|
||
</div>
|
||
|
||
<!-- 自我评价 -->
|
||
<div class="form-section">
|
||
<h4>自我评价</h4>
|
||
{{ self_evaluation_form.as_p }}
|
||
</div>
|
||
<button type="submit" class="btn-submit">提交</button>
|
||
</form>
|
||
|
||
<form method="POST" action="/ec_user/all_info_edit/{{ user.id }}/hobbies_interests/">
|
||
<!-- 兴趣爱好 -->
|
||
<div class="form-section">
|
||
<h4>兴趣爱好</h4>
|
||
{{ hobbies_interests_form.management_form }} <!-- 管理表单 -->
|
||
{% for form in hobbies_interests_form %}
|
||
<div class="border p-3 mb-3">
|
||
{{ form.as_p }}
|
||
</div>
|
||
{% empty %}
|
||
<p class="empty-message">没有兴趣爱好信息。</p>
|
||
{% endfor %}
|
||
<button type="submit" class="btn-submit">提交</button>
|
||
</div>
|
||
</form>
|
||
|
||
<form method="POST" action="/ec_user/all_info_edit/{{ user.id }}/social_practice/">
|
||
<!-- 社会实践 -->
|
||
<div class="form-section">
|
||
<h4>社会实践</h4>
|
||
{{ social_practice_form.management_form }}
|
||
{% for form in social_practice_form %}
|
||
<div class="border p-3 mb-3">
|
||
{{ form.as_p }}
|
||
</div>
|
||
{% empty %}
|
||
<p class="empty-message">没有社会实践记录。</p>
|
||
{% endfor %}
|
||
<button type="submit" class="btn-submit">提交</button>
|
||
</div>
|
||
</form>
|
||
|
||
<form method="POST" action="/ec_user/all_info_edit/{{ user.id }}/family_info/">
|
||
<!-- 家庭情况 -->
|
||
<div class="form-section">
|
||
<h4>家庭情况</h4>
|
||
{{ family_info_form.management_form }}
|
||
{% for form in family_info_form %}
|
||
<div class="border p-3 mb-3">
|
||
{{ form.as_p }}
|
||
</div>
|
||
{% empty %}
|
||
<p class="empty-message">没有家庭情况记录。</p>
|
||
{% endfor %}
|
||
<button type="submit" class="btn-submit">提交</button>
|
||
</div>
|
||
</form>
|
||
|
||
<form method="POST" action="/ec_user/all_info_edit/{{ user.id }}/awards_punishments/" >
|
||
<!-- 奖惩情况 -->
|
||
<div class="form-section">
|
||
<h4>奖惩情况</h4>
|
||
{{ awards_punishments_form.management_form }}
|
||
{% for form in awards_punishments_form %}
|
||
<div class="border p-3 mb-3">
|
||
{{ form.as_p }}
|
||
</div>
|
||
{% empty %}
|
||
<p class="empty-message">没有奖惩情况记录。</p>
|
||
{% endfor %}
|
||
<button type="submit" class="btn-submit">提交</button>
|
||
</div>
|
||
</form>
|
||
|
||
</div>
|
||
|
||
{% endblock %}
|
||
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0-alpha1/js/bootstrap.bundle.min.js"></script>
|
||
|
||
|
||
</body>
|
||
</html>
|