262 lines
13 KiB
HTML
262 lines
13 KiB
HTML
{% extends "base.html" %}
|
||
{% block title %}申请转课 - 学生课程管理系统{% endblock %}
|
||
{% block content %}
|
||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||
<h4><i class="bi bi-arrow-left-right"></i> 申请转课</h4>
|
||
<a href="{{ url_for('transfer_list') }}" class="btn btn-outline-secondary"><i class="bi bi-arrow-left"></i> 返回</a>
|
||
</div>
|
||
<div class="card shadow-sm">
|
||
<div class="card-body">
|
||
<form method="POST" id="transferForm">
|
||
<div class="row g-3">
|
||
<div class="col-md-6">
|
||
<label class="form-label">学员 <span class="text-danger">*</span></label>
|
||
<select class="form-select" name="from_student_id" id="from_student_id" required>
|
||
<option value="">请选择学员</option>
|
||
{% for s in students %}
|
||
<option value="{{ s.id }}">{{ s.name }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div class="col-md-6">
|
||
<label class="form-label">课程 <span class="text-danger">*</span></label>
|
||
<select class="form-select" name="from_course_id" id="from_course_id" required>
|
||
<option value="">请选择课程</option>
|
||
{% for c in courses %}
|
||
<option value="{{ c.id }}" data-price="{{ c.price_per_hour }}">{{ c.name }}(¥{{ c.price_per_hour }}/课时)</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 转课类型选择 -->
|
||
<div class="col-12">
|
||
<label class="form-label">转课类型 <span class="text-danger">*</span></label>
|
||
<div class="btn-group w-100" role="group">
|
||
<input type="radio" class="btn-check" name="transfer_class_type" id="type_class" value="class_transfer" checked>
|
||
<label class="btn btn-outline-primary" for="type_class"><i class="bi bi-people"></i> 班级转课</label>
|
||
|
||
<input type="radio" class="btn-check" name="transfer_class_type" id="type_transfer" value="transfer">
|
||
<label class="btn btn-outline-primary" for="type_transfer"><i class="bi bi-arrow-repeat"></i> 换课转课</label>
|
||
|
||
<input type="radio" class="btn-check" name="transfer_class_type" id="type_upgrade" value="upgrade">
|
||
<label class="btn btn-outline-primary" for="type_upgrade"><i class="bi bi-arrow-up-circle"></i> 升阶转课</label>
|
||
|
||
<input type="radio" class="btn-check" name="transfer_class_type" id="type_gift" value="gift">
|
||
<label class="btn btn-outline-primary" for="type_gift"><i class="bi bi-gift"></i> 转赠课时</label>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 班级转课选项 -->
|
||
<div class="col-md-6" id="classTransferSection">
|
||
<label class="form-label">目标班级 <span class="text-danger">*</span></label>
|
||
<select class="form-select" name="to_class_id" id="to_class_id">
|
||
<option value="">请选择目标班级</option>
|
||
{% for c in classes %}
|
||
<option value="{{ c.id }}" data-teacher="{{ c.teacher_id }}">{{ c.name }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div class="col-md-6" id="teacherSelectSection">
|
||
<label class="form-label">目标授课老师</label>
|
||
<select class="form-select" name="to_teacher_id" id="to_teacher_id">
|
||
<option value="">跟随班级老师</option>
|
||
{% for t in teachers %}
|
||
<option value="{{ t.id }}">{{ t.name }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
|
||
<!-- 班级转课-单价变更选项 -->
|
||
<div class="col-12" id="priceChangeSection" style="display:none;">
|
||
<div class="card bg-light">
|
||
<div class="card-body">
|
||
<div class="row g-3">
|
||
<div class="col-md-12">
|
||
<label class="form-label">单价变更类型</label>
|
||
<div class="btn-group" role="group">
|
||
<input type="radio" class="btn-check" name="price_change_type" id="price_no_change" value="no_change" checked>
|
||
<label class="btn btn-outline-secondary" for="price_no_change">无单价变更</label>
|
||
|
||
<input type="radio" class="btn-check" name="price_change_type" id="price_changed" value="price_changed">
|
||
<label class="btn btn-outline-warning" for="price_changed">有单价变更</label>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4" id="newUnitPriceSection" style="display:none;">
|
||
<label class="form-label">新单价(元/课时)</label>
|
||
<input type="number" step="0.01" class="form-control" name="new_unit_price" id="new_unit_price" placeholder="请输入新单价">
|
||
</div>
|
||
<div class="col-md-4" id="priceChangeReasonSection" style="display:none;">
|
||
<label class="form-label">变更原因 <span class="text-danger">*</span></label>
|
||
<input type="text" class="form-control" name="price_change_reason" id="price_change_reason" placeholder="必填">
|
||
</div>
|
||
<div class="col-md-4" id="effectiveDateSection" style="display:none;">
|
||
<label class="form-label">生效时间</label>
|
||
<input type="date" class="form-control" name="effective_date" id="effective_date" value="">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 换课/升阶/转赠选项 -->
|
||
<div class="col-md-4" id="toCourseGroup" style="display:none;">
|
||
<label class="form-label">转入课程</label>
|
||
<select class="form-select" name="to_course_id" id="to_course_id">
|
||
<option value="">请选择转入课程</option>
|
||
{% for c in courses %}
|
||
<option value="{{ c.id }}" data-price="{{ c.price_per_hour }}">{{ c.name }}(¥{{ c.price_per_hour }}/课时)</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div class="col-md-4" id="toStudentGroup" style="display:none;">
|
||
<label class="form-label">转入学员</label>
|
||
<select class="form-select" name="to_student_id">
|
||
<option value="">请选择转入学员</option>
|
||
{% for s in students %}
|
||
<option value="{{ s.id }}">{{ s.name }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div class="col-md-4" id="transferHoursGroup" style="display:none;">
|
||
<label class="form-label">转出课时数</label>
|
||
<input type="number" step="1" class="form-control" name="transfer_hours" id="transfer_hours" min="1">
|
||
</div>
|
||
<div class="col-12">
|
||
<label class="form-label">备注</label>
|
||
<input type="text" class="form-control" name="remark" placeholder="可选">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mt-3" id="accountInfo"></div>
|
||
<div class="mt-3" id="transferCalc"></div>
|
||
<div class="mt-3">
|
||
<button type="submit" class="btn btn-primary" onclick="return confirm('确认转课操作？')"><i class="bi bi-check-lg"></i> 确认</button>
|
||
<a href="{{ url_for('transfer_list') }}" class="btn btn-outline-secondary">取消</a>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
{% endblock %}
|
||
|
||
{% block extra_js %}
|
||
<script>
|
||
// 显示/隐藏不同转课类型的选项
|
||
function toggleTransferType() {
|
||
var type = document.querySelector('input[name="transfer_class_type"]:checked').value;
|
||
|
||
// 班级转课
|
||
var classSection = document.getElementById('classTransferSection');
|
||
var teacherSection = document.getElementById('teacherSelectSection');
|
||
var priceSection = document.getElementById('priceChangeSection');
|
||
// 换课/升阶/转赠
|
||
var toCourse = document.getElementById('toCourseGroup');
|
||
var toStudent = document.getElementById('toStudentGroup');
|
||
var transferHours = document.getElementById('transferHoursGroup');
|
||
|
||
// 重置所有
|
||
classSection.style.display = 'none';
|
||
teacherSection.style.display = 'none';
|
||
priceSection.style.display = 'none';
|
||
toCourse.style.display = 'none';
|
||
toStudent.style.display = 'none';
|
||
transferHours.style.display = 'none';
|
||
|
||
if (type === 'class_transfer') {
|
||
classSection.style.display = '';
|
||
teacherSection.style.display = '';
|
||
priceSection.style.display = '';
|
||
} else if (type === 'gift') {
|
||
toStudent.style.display = '';
|
||
transferHours.style.display = '';
|
||
} else {
|
||
toCourse.style.display = '';
|
||
if (type === 'transfer') {
|
||
transferHours.style.display = '';
|
||
}
|
||
}
|
||
}
|
||
|
||
// 监听转课类型变化
|
||
document.querySelectorAll('input[name="transfer_class_type"]').forEach(function(radio) {
|
||
radio.addEventListener('change', toggleTransferType);
|
||
});
|
||
|
||
// 监听单价变更类型
|
||
document.querySelectorAll('input[name="price_change_type"]').forEach(function(radio) {
|
||
radio.addEventListener('change', function() {
|
||
var isChanged = this.value === 'price_changed';
|
||
document.getElementById('newUnitPriceSection').style.display = isChanged ? '' : 'none';
|
||
document.getElementById('priceChangeReasonSection').style.display = isChanged ? '' : 'none';
|
||
document.getElementById('effectiveDateSection').style.display = isChanged ? '' : 'none';
|
||
});
|
||
});
|
||
|
||
// 加载学员课时信息
|
||
document.getElementById('from_student_id').addEventListener('change', loadFromAccount);
|
||
document.getElementById('from_course_id').addEventListener('change', loadFromAccount);
|
||
|
||
function loadFromAccount() {
|
||
var sid = document.getElementById('from_student_id').value;
|
||
var cid = document.getElementById('from_course_id').value;
|
||
if (!sid || !cid) {
|
||
document.getElementById('accountInfo').innerHTML = '';
|
||
return;
|
||
}
|
||
fetch('/api/student_account/' + sid + '/' + cid)
|
||
.then(r => r.json())
|
||
.then(data => {
|
||
if (data.success) {
|
||
var d = data.data;
|
||
document.getElementById('accountInfo').innerHTML =
|
||
'<div class="alert alert-info"><strong>当前课时：</strong>正课 ' + d.normal_hours + ' 课时，赠课 ' + d.gifted_hours + ' 课时，合计 ' + d.total_hours + ' 课时</div>';
|
||
} else {
|
||
document.getElementById('accountInfo').innerHTML =
|
||
'<div class="alert alert-warning">未找到该学员的课时账户</div>';
|
||
}
|
||
});
|
||
}
|
||
|
||
// 目标班级变更时自动填充老师
|
||
document.getElementById('to_class_id').addEventListener('change', function() {
|
||
var selected = this.options[this.selectedIndex];
|
||
var teacherId = selected.dataset.teacher;
|
||
if (teacherId) {
|
||
document.getElementById('to_teacher_id').value = teacherId;
|
||
}
|
||
});
|
||
|
||
// 表单提交验证
|
||
document.getElementById('transferForm').addEventListener('submit', function(e) {
|
||
var type = document.querySelector('input[name="transfer_class_type"]:checked').value;
|
||
|
||
if (type === 'class_transfer') {
|
||
var toClassId = document.getElementById('to_class_id').value;
|
||
if (!toClassId) {
|
||
alert('请选择目标班级');
|
||
e.preventDefault();
|
||
return;
|
||
}
|
||
|
||
var priceChange = document.querySelector('input[name="price_change_type"]:checked').value;
|
||
if (priceChange === 'price_changed') {
|
||
var newPrice = document.getElementById('new_unit_price').value;
|
||
var reason = document.getElementById('price_change_reason').value;
|
||
if (!newPrice || parseFloat(newPrice) <= 0) {
|
||
alert('有单价变更时，新单价必须大于0');
|
||
e.preventDefault();
|
||
return;
|
||
}
|
||
if (!reason) {
|
||
alert('有单价变更时，必须填写变更原因');
|
||
e.preventDefault();
|
||
return;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
|
||
// 初始化
|
||
toggleTransferType();
|
||
</script>
|
||
{% endblock %}
|