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

fix: 修复实体管理模块，使用 checkbox 列表替代 select 下拉框

Browse Source 
Coze-Commit-Type: user
Coze-User-ID: 3722323274763196
Coze-Conversation-ID: 9894087
This commit is contained in:
user9994793890
2026-07-13 15:51:40 +08:00
parent 8c6e6d7137
commit 5beb9ed6bb
3 changed files with 121 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
public/static/js/entity.js
View File

@@ -1,23 +1,29 @@
// 加载企业/用户列表（支持分页和搜索）
// 当前选中的实体ID集合
let selectedEntityIds = new Set();
// 加载企业/用户/场站列表（checkbox 列表）
async function loadEntities(page = 1, search = '') {
const splitType = document.getElementById('split-type').value;
const select = document.getElementById('split-value');
// 显示/隐藏合并特来电选项（仅按企业拆分时显示）
const mergeTelecomGroup = document.getElementById('merge-telecom-group');
if (mergeTelecomGroup) {
mergeTelecomGroup.style.display = splitType === 'company_id' ? 'block' : 'none';
if (splitType !== 'company_id') {
document.getElementById('merge-telecom').checked = false;
toggleTelecomVehicleNo();
}
}
const container = document.getElementById('entity-list');
if (!splitType) {
select.innerHTML = '<option value="">请先选择拆分方式</option>';
container.innerHTML = '<div class="empty">请先选择拆分方式</div>';
return;
}
// 显示/隐藏合并特来电选项（仅按企业拆分时显示）
const mergeTelecomSection = document.getElementById('telecom-vehicle-section');
const mergeTelecomCheckbox = document.getElementById('merge-telecom');
if (mergeTelecomSection && mergeTelecomCheckbox) {
if (splitType === 'company_id') {
mergeTelecomCheckbox.parentElement.style.display = 'block';
} else {
mergeTelecomCheckbox.parentElement.style.display = 'none';
mergeTelecomCheckbox.checked = false;
toggleTelecomVehicleNo();
}
}
// 保存当前状态
currentEntityType = splitType === 'company_id' ? 'company' :
splitType === 'user_id' ? 'user' :
@@ -25,7 +31,7 @@ async function loadEntities(page = 1, search = '') {
entityPage = page;
currentSearch = search;
select.innerHTML = '<option value="">加载中...</option>';
container.innerHTML = '<div class="loading">加载中...</div>';
try {
const response = await fetch(`/api/entities?type=${currentEntityType}&page=${page}&page_size=${entityPageSize}&search=${encodeURIComponent(search)}`);
@@ -37,9 +43,9 @@ async function loadEntities(page = 1, search = '') {
const totalPages = Math.ceil(total / entityPageSize);
if (entities.length === 0) {
select.innerHTML = '<option value="">无数据</option>';
container.innerHTML = '<div class="empty">无数据</div>';
} else {
select.innerHTML = entities.map(e => {
container.innerHTML = entities.map(e => {
let value = '';
let name = '';
let typeLabel = '';
@@ -59,31 +65,85 @@ async function loadEntities(page = 1, search = '') {
name = e.station_name;
}
return `<option value="${value}" data-name="${name}">${name} ${typeLabel}</option>`;
const isChecked = selectedEntityIds.has(String(value)) ? 'checked' : '';
return `
<div class="checkbox-item ${isChecked}" onclick="toggleEntityCheckbox(this, '${value}')">
<input type="checkbox" value="${value}" ${isChecked} onclick="event.stopPropagation()">
<span>${name} ${typeLabel}</span>
</div>
`;
}).join('');
}
// 更新分页UI
updatePagination(totalPages, total);
updateEntityPagination(totalPages, total);
updateSelectedCount();
}
} catch (error) {
console.error('加载列表失败:', error);
select.innerHTML = '<option value="">加载失败</option>';
container.innerHTML = '<div class="empty">加载失败</div>';
}
}
// 更新分页UI
function updatePagination(totalPages, total) {
// 切换实体 checkbox
function toggleEntityCheckbox(item, value) {
const checkbox = item.querySelector('input[type="checkbox"]');
checkbox.checked = !checkbox.checked;
if (checkbox.checked) {
item.classList.add('checked');
selectedEntityIds.add(String(value));
} else {
item.classList.remove('checked');
selectedEntityIds.delete(String(value));
}
updateSelectedCount();
}
// 更新已选数量显示
function updateSelectedCount() {
const countSpan = document.getElementById('selected-count');
if (countSpan) {
countSpan.textContent = `已选：${selectedEntityIds.size} 个`;
}
}
// 全选/取消全选实体
function toggleSelectAllEntities() {
const container = document.getElementById('entity-list');
const checkboxes = container.querySelectorAll('input[type="checkbox"]');
const allChecked = Array.from(checkboxes).every(cb => cb.checked);
checkboxes.forEach(cb => {
cb.checked = !allChecked;
const item = cb.closest('.checkbox-item');
if (cb.checked) {
item.classList.add('checked');
selectedEntityIds.add(cb.value);
} else {
item.classList.remove('checked');
selectedEntityIds.delete(cb.value);
}
});
updateSelectedCount();
}
// 更新实体分页UI
function updateEntityPagination(totalPages, total) {
const paginationDiv = document.getElementById('entity-pagination');
if (!paginationDiv) return;
if (totalPages <= 1) {
paginationDiv.innerHTML = `<small class="text-muted">共 ${total} 条</small>`;
paginationDiv.innerHTML = `<small style="color: var(--muted-foreground);">共 ${total} 条</small>`;
return;
}
let html = `<small class="text-muted">共 ${total} 条</small>`;
html += `<button type="button" class="btn btn-sm btn-secondary" onclick="loadEntities(${entityPage - 1}, currentSearch)" ${entityPage <= 1 ? 'disabled' : ''}>上一页</button>`;
let html = `<small style="color: var(--muted-foreground);">共 ${total} 条</small>`;
html += `<button type="button" class="btn btn-sm" onclick="loadEntities(${entityPage - 1}, currentSearch)" ${entityPage <= 1 ? 'disabled' : ''}>上一页</button>`;
html += `<span>${entityPage}/${totalPages}</span>`;
html += `<button type="button" class="btn btn-sm btn-secondary" onclick="loadEntities(${entityPage + 1}, currentSearch)" ${entityPage >= totalPages ? 'disabled' : ''}>下一页</button>`;
html += `<button type="button" class="btn btn-sm" onclick="loadEntities(${entityPage + 1}, currentSearch)" ${entityPage >= totalPages ? 'disabled' : ''}>下一页</button>`;
paginationDiv.innerHTML = html;
}
@@ -106,3 +166,8 @@ document.addEventListener('DOMContentLoaded', function() {
}
});
// 拆分方式变化时重新加载实体列表
function onSplitTypeChange() {
selectedEntityIds.clear();
loadEntities(1, '');
}