server/ShengShengBuXi
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

213

Browse Source
This commit is contained in:
zpc 2025-03-30 01:20:02 +08:00
parent 9f9381de9a
commit 3407cb4169
1 changed files with 196 additions and 71 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

267
ShengShengBuXi/Pages/Admin.cshtml
View File

@ -42,12 +42,12 @@
<!-- <li class="nav-item" role="presentation">
<button class="nav-link" id="recognition-tab" data-bs-toggle="tab" data-bs-target="#recognition" type="button" role="tab" aria-controls="recognition" aria-selected="false">识别结果</button>
</li>-->
</li>
<li class="nav-item" role="presentation"></li>
<button class="nav-link" id="display-config-tab" data-bs-toggle="tab"
data-bs-target="#display-config" type="button" role="tab" aria-controls="display-config"
aria-selected="false">显示配置</button>
</li>
</li>-->
<li class="nav-item" role="presentation">
<button class="nav-link" id="user-records-tab" data-bs-toggle="tab"
data-bs-target="#user-records" type="button" role="tab" aria-controls="user-records"
@ -293,7 +293,14 @@
<!-- 录音管理 -->
<div class="tab-pane fade show active" id="recordings" role="tabpanel" aria-labelledby="recordings-tab">
<div class="mt-3">
<button class="btn btn-primary mb-3" onclick="getRecentRecordings()">刷新录音列表</button>
<div class="d-flex justify-content-between mb-3">
<button class="btn btn-primary" onclick="getRecentRecordings()">刷新录音列表</button>
<!-- 添加搜索功能 -->
<div class="d-flex">
<input type="text" class="form-control me-2" id="recording-search" placeholder="输入文件名搜索...">
<button class="btn btn-outline-primary" onclick="searchRecordings()">搜索</button>
</div>
</div>
<!-- 音频播放器（将不再全局显示，而是嵌入到表格行中） -->
<div class="card mb-3" id="audioPlayerCard" style="display: none;">
@ -327,6 +334,26 @@
</tbody>
</table>
</div>
<!-- 分页控制 -->
<div class="d-flex justify-content-between align-items-center mt-3">
<div>
每页显示：
<select id="page-size" class="form-select form-select-sm d-inline-block w-auto" onchange="changePageSize()">
<option value="10">10条</option>
<option value="20" selected>20条</option>
<option value="50">50条</option>
<option value="100">100条</option>
</select>
</div>
<div>
<span id="pagination-info">显示 1-20，共 0 条</span>
</div>
<div>
<button class="btn btn-sm btn-outline-secondary" id="prev-page" onclick="prevPage()" disabled>上一页</button>
<button class="btn btn-sm btn-outline-secondary" id="next-page" onclick="nextPage()" disabled>下一页</button>
</div>
</div>
</div>
</div>
@ -1080,6 +1107,13 @@
URL.revokeObjectURL(url);
}
// 分页和搜索相关变量
let currentPage = 1;
let pageSize = 20;
let totalRecordings = 0;
let filteredRecordings = [];
let searchKeyword = '';
// 获取最近录音
function getRecentRecordings() {
if (!connection || connection.state !== signalR.HubConnectionState.Connected) {
@ -1088,17 +1122,162 @@
}
log("正在获取最近录音列表...");
// 重置分页和搜索
currentPage = 1;
searchKeyword = '';
document.getElementById('recording-search').value = '';
connection.invoke("GetRecentRecordings", 100)
.then(() => {
log("已成功发送获取录音列表请求");
// 获取第一页数据和总记录数
fetchRecordingsPage(currentPage);
}
// 获取指定页的录音数据
function fetchRecordingsPage(page) {
const skip = (page - 1) * pageSize;
const take = pageSize;
log(`请求第${page}页录音，跳过${skip}条，获取${take}条`);
connection.invoke("GetRecordingsPage", skip, take, searchKeyword)
.then(response => {
if (response && response.items && response.totalCount) {
log(`收到第${page}页录音，共${response.items.length}条，总计${response.totalCount}条`);
totalRecordings = response.totalCount;
updateRecordingsList(response.items);
updatePaginationInfo();
} else {
log("收到的录音数据格式不正确");
showMessage("获取录音数据格式不正确", "warning");
}
})
.catch(err => {
log("获取录音失败: " + err);
showMessage("获取录音失败: " + err, "danger");
// 如果新方法不存在，回退到旧方法
log("GetRecordingsPage方法不存在，回退到旧方法: " + err);
// 兼容旧方法，获取所有录音后在前端筛选
connection.invoke("GetRecentRecordings", 100)
.then(() => {
log("已成功发送获取录音列表请求（旧方法）");
})
.catch(err => {
log("获取录音失败: " + err);
showMessage("获取录音失败: " + err, "danger");
});
});
}
// 更新分页信息
function updatePaginationInfo() {
const start = (currentPage - 1) * pageSize + 1;
const end = Math.min(start + pageSize - 1, totalRecordings);
document.getElementById('pagination-info').textContent =
totalRecordings > 0 ? `显示 ${start}-${end}，共 ${totalRecordings} 条` : `共 0 条`;
// 更新按钮状态
document.getElementById('prev-page').disabled = currentPage <= 1;
document.getElementById('next-page').disabled = end >= totalRecordings;
}
// 搜索录音
function searchRecordings() {
const keyword = document.getElementById('recording-search').value.toLowerCase().trim();
searchKeyword = keyword;
// 重置到第一页并请求数据
currentPage = 1;
fetchRecordingsPage(currentPage);
log(`搜索关键词: "${keyword}"`);
}
// 更改每页显示数量
function changePageSize() {
pageSize = parseInt(document.getElementById('page-size').value);
currentPage = 1;
fetchRecordingsPage(currentPage);
log(`每页显示数量改为: ${pageSize}`);
}
// 上一页
function prevPage() {
if (currentPage > 1) {
currentPage--;
fetchRecordingsPage(currentPage);
}
}
// 下一页
function nextPage() {
const maxPage = Math.ceil(totalRecordings / pageSize);
if (currentPage < maxPage) {
currentPage++;
fetchRecordingsPage(currentPage);
}
}
// 更新录音列表
function updateRecordingsList(recordings) {
log("接收到录音列表，数量：" + (recordings ? recordings.length : 0));
filteredRecordings = recordings || [];
const tableBody = document.getElementById("recording-list");
// 清空列表
tableBody.innerHTML = "";
if (!recordings || recordings.length === 0) {
const row = document.createElement("tr");
row.innerHTML = `<td colspan="5" class="text-center">暂无录音</td>`;
tableBody.appendChild(row);
log("录音列表为空");
return;
}
// 添加录音
recordings.forEach((filePathOrName, index) => {
// 获取文件名（如果传入的已经是文件名则直接使用）
const fileName = filePathOrName.includes("/") || filePathOrName.includes("\\")
? filePathOrName.split('\\').pop().split('/').pop()
: filePathOrName;
log("添加录音文件: " + fileName);
// 从文件名中尝试提取创建日期（格式如recording_20230326_185637.wav）
let createDate = "未知";
const dateMatch = fileName.match(/(\d{4})(\d{2})(\d{2})_(\d{2})(\d{2})(\d{2})/);
if (dateMatch) {
// 组成年-月-日 时:分:秒格式
createDate = `${dateMatch[1]}-${dateMatch[2]}-${dateMatch[3]} ${dateMatch[4]}:${dateMatch[5]}:${dateMatch[6]}`;
}
// 创建新行
const row = document.createElement("tr");
// 序号为当前页面索引+1
const sequenceNumber = ((currentPage - 1) * pageSize) + index + 1;
row.innerHTML = `
<td>${sequenceNumber}</td>
<td>${fileName}</td>
<td>获取中...</td>
<td>${createDate}</td>
<td>
<button class="btn btn-sm btn-primary" onclick="playRecordingInPage('${fileName}', this)">播放</button>
<a href="/recordings/${fileName}" class="btn btn-sm btn-secondary" download>下载</a>
</td>
`;
tableBody.appendChild(row);
// 异步获取文件大小
getFileSize(fileName);
});
log(`显示第${currentPage}页录音，${recordings.length}条结果`);
}
// 在页面中播放录音
function playRecordingInPage(fileName, rowElement) {
// 关闭任何已打开的播放器
@ -1214,10 +1393,17 @@
}
});
// 接收录音列表
// 接收录音列表（旧方法兼容）
connection.on("RecentRecordings", (recordings) => {
log("接收到录音列表，数量：" + (recordings ? recordings.length : 0));
updateRecordingsList(recordings);
// 使用旧方法收到的数据，设置总数
totalRecordings = recordings ? recordings.length : 0;
// 根据当前页筛选数据
const start = (currentPage - 1) * pageSize;
const end = Math.min(start + pageSize, totalRecordings);
const pageItems = recordings ? recordings.slice(start, end) : [];
updateRecordingsList(pageItems);
updatePaginationInfo();
});
// 客户端列表
@ -1418,67 +1604,6 @@
}
}
// 更新录音列表
function updateRecordingsList(recordings) {
log("接收到录音列表，数量：" + (recordings ? recordings.length : 0));
const tableBody = document.getElementById("recording-list");
// 清空列表
tableBody.innerHTML = "";
if (!recordings || recordings.length === 0) {
const row = document.createElement("tr");
row.innerHTML = `<td colspan="5" class="text-center">暂无录音</td>`;
tableBody.appendChild(row);
log("录音列表为空");
return;
}
// 添加录音
recordings.forEach((filePathOrName, index) => {
// 获取文件名（如果传入的已经是文件名则直接使用）
const fileName = filePathOrName.includes("/") || filePathOrName.includes("\\")
? filePathOrName.split('\\').pop().split('/').pop()
: filePathOrName;
log("添加录音文件: " + fileName);
// 从文件名中尝试提取创建日期（格式如recording_20230326_185637.wav）
let createDate = "未知";
const dateMatch = fileName.match(/(\d{4})(\d{2})(\d{2})_(\d{2})(\d{2})(\d{2})/);
if (dateMatch) {
// 组成年-月-日 时:分:秒格式
createDate = `${dateMatch[1]}-${dateMatch[2]}-${dateMatch[3]} ${dateMatch[4]}:${dateMatch[5]}:${dateMatch[6]}`;
}
// 创建新行
const row = document.createElement("tr");
// 序号为当前索引+1
const sequenceNumber = index + 1;
row.innerHTML = `
<td>${sequenceNumber}</td>
<td>${fileName}</td>
<td>获取中...</td>
<td>${createDate}</td>
<td>
<button class="btn btn-sm btn-primary" onclick="playRecordingInPage('${fileName}', this)">播放</button>
<a href="/recordings/${fileName}" class="btn btn-sm btn-secondary" download>下载</a>
</td>
`;
tableBody.appendChild(row);
// 异步获取文件大小
getFileSize(fileName);
});
log("录音列表已更新，共" + recordings.length + "个文件");
showMessage("成功获取" + recordings.length + "个录音文件", "success");
}
// 获取录音文件大小
function getFileSize(fileName) {
if (!connection || connection.state !== signalR.HubConnectionState.Connected) {