huhao/drl_2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 消课添加页面添加学员搜索功能

Browse Source 
Coze-Commit-Type: user
Coze-User-ID: 3722323274763196
Coze-Conversation-ID: 5260473
This commit is contained in:
user9994793890
2026-05-29 11:16:16 +08:00
parent fa29412794
commit e8b980539a
4 changed files with 101 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
xuexiao/templates/consumption_form.html
View File

@@ -22,12 +22,14 @@
{% else %}
<div class="col-md-4">
<label class="form-label">选择学员 <span class="text-danger">*</span></label>
<select class="form-select" name="student_id" id="student_id" required>
<option value="">请选择学员</option>
{% for s in students %}
<option value="{{ s.id }}">{{ s.name }}</option>
{% endfor %}
</select>
<div class="input-group">
<input type="text" class="form-control" id="student_search" placeholder="输入学员姓名搜索" autocomplete="off">
<select class="form-select" name="student_id" id="student_id" required style="display:none;">
<option value="">请选择学员</option>
</select>
<button class="btn btn-outline-secondary" type="button" id="clear_student">清除</button>
</div>
<div id="student_suggestions" class="list-group position-absolute w-100" style="z-index:1000; max-height:200px; overflow-y:auto;"></div>
</div>
<div class="col-md-4">
<label class="form-label">选择班级</label>
@@ -101,6 +103,79 @@
<script>
document.getElementById('student_id').addEventListener('change', loadAccount);
document.getElementById('course_id').addEventListener('change', loadAccount);
// 学员搜索功能
var searchTimeout = null;
document.getElementById('student_search').addEventListener('input', function(e) {
var keyword = e.target.value.trim();
var suggestions = document.getElementById('student_suggestions');
var studentSelect = document.getElementById('student_id');
if (keyword.length < 1) {
suggestions.innerHTML = '';
return;
}
clearTimeout(searchTimeout);
searchTimeout = setTimeout(function() {
fetch('/api/students/search?q=' + encodeURIComponent(keyword))
.then(r => r.json())
.then(data => {
suggestions.innerHTML = '';
if (data.data.length === 0) {
suggestions.innerHTML = '<div class="list-group-item text-muted">未找到学员</div>';
return;
}
data.data.forEach(function(s) {
var item = document.createElement('a');
item.href = '#';
item.className = 'list-group-item list-group-item-action';
item.textContent = s.name;
item.dataset.id = s.id;
item.addEventListener('click', function(e) {
e.preventDefault();
selectStudent(s.id, s.name);
});
suggestions.appendChild(item);
});
});
}, 200);
});
function selectStudent(id, name) {
var studentSelect = document.getElementById('student_id');
var searchInput = document.getElementById('student_search');
var suggestions = document.getElementById('student_suggestions');
// 设置select的值
studentSelect.innerHTML = '<option value="' + id + '" selected>' + name + '</option>';
studentSelect.style.display = 'block';
searchInput.value = name;
suggestions.innerHTML = '';
// 触发账户信息加载
loadAccount();
}
document.getElementById('clear_student').addEventListener('click', function() {
var studentSelect = document.getElementById('student_id');
var searchInput = document.getElementById('student_search');
var suggestions = document.getElementById('student_suggestions');
studentSelect.innerHTML = '<option value="">请选择学员</option>';
studentSelect.style.display = 'block';
searchInput.value = '';
suggestions.innerHTML = '';
document.getElementById('accountInfo').style.display = 'none';
});
// 点击其他地方关闭建议列表
document.addEventListener('click', function(e) {
if (!e.target.closest('#student_search') && !e.target.closest('#student_suggestions')) {
document.getElementById('student_suggestions').innerHTML = '';
}
});
function loadAccount() {
var sid = document.getElementById('student_id').value;
var cid = document.getElementById('course_id').value;