逐字稿
All checks were successful
Deploy to Server / deploy (push) Successful in 20s

This commit is contained in:
jeremygan2021
2026-03-17 21:11:19 +08:00
parent 4d6f98080e
commit afab4933b4
2 changed files with 94 additions and 3 deletions

View File

@@ -313,7 +313,8 @@ def project_detail_api(request, project_id):
if latest_task:
ai_data = {
'transcription': latest_task.transcription,
'summary': latest_task.summary
'summary': latest_task.summary,
'auto_chapters_data': latest_task.auto_chapters_data
}
data = {

View File

@@ -99,8 +99,13 @@
<p class="text-xs font-semibold text-gray-500 uppercase mb-1">AI 总结</p>
<p class="text-sm text-gray-800" id="modalAiSummary"></p>
</div>
<div class="border-t border-gray-100 pt-3">
<p class="text-xs font-semibold text-gray-500 uppercase mb-1">逐字稿片段</p>
<div class="border-t border-gray-100 pt-3 relative">
<div class="flex justify-between items-center mb-1">
<p class="text-xs font-semibold text-gray-500 uppercase">逐字稿片段</p>
<button type="button" onclick="openFullTranscriptionModal()" class="text-xs text-blue-600 hover:text-blue-800 focus:outline-none flex items-center">
<i class="fas fa-expand-arrows-alt mr-1"></i> 查看完整逐字稿与章节
</button>
</div>
<p class="text-sm text-gray-600 italic" id="modalAiTrans"></p>
</div>
</div>
@@ -202,6 +207,37 @@
</div>
</div>
<!-- Full Transcription Modal -->
<div id="fullTranscriptionModal" class="modal fixed inset-0 z-[60] flex items-center justify-center p-4 sm:p-6" style="background-color: rgba(0,0,0,0.6);">
<div class="bg-white rounded-2xl shadow-2xl w-full max-w-4xl max-h-[90vh] flex flex-col relative animate-fade-in">
<button class="absolute top-4 right-4 text-gray-400 hover:text-gray-600 z-10 p-2 rounded-full hover:bg-gray-100 transition-colors" onclick="closeModal('fullTranscriptionModal')">
<i class="fas fa-times text-xl"></i>
</button>
<div class="px-8 py-5 border-b border-gray-100 bg-gray-50 rounded-t-2xl flex justify-between items-center">
<h2 class="text-xl font-bold text-gray-900 flex items-center"><i class="fas fa-file-alt text-blue-500 mr-2"></i>完整逐字稿与章节</h2>
</div>
<div class="flex-1 overflow-y-auto p-8">
<div class="space-y-8">
<!-- Chapters Section -->
<div id="chaptersSection" style="display:none;">
<h3 class="text-lg font-bold text-gray-800 mb-4 flex items-center border-b pb-2"><i class="fas fa-list-ul mr-2 text-indigo-500"></i>章节内容</h3>
<div id="modalChaptersContent" class="space-y-4">
<!-- Chapters rendered here -->
</div>
</div>
<!-- Full Transcription Section -->
<div>
<h3 class="text-lg font-bold text-gray-800 mb-4 flex items-center border-b pb-2"><i class="fas fa-align-left mr-2 text-green-500"></i>完整逐字稿</h3>
<div id="modalFullTrans" class="text-gray-700 text-sm leading-relaxed bg-gray-50 p-6 rounded-xl border border-gray-100 whitespace-pre-wrap"></div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block extra_js %}
@@ -223,6 +259,56 @@ function openUploadModal() {
document.getElementById('uploadModal').classList.add('active');
}
function openFullTranscriptionModal() {
if (!window.currentAiData) return;
document.getElementById('modalFullTrans').innerText = window.currentAiData.transcription || '暂无完整逐字稿';
let chaptersData = window.currentAiData.auto_chapters_data;
const chaptersSection = document.getElementById('chaptersSection');
const chaptersContent = document.getElementById('modalChaptersContent');
// Check if chaptersData is a string and parse it if necessary
if (typeof chaptersData === 'string') {
try {
chaptersData = JSON.parse(chaptersData);
} catch (e) {
console.error('Failed to parse auto_chapters_data:', e);
chaptersData = null;
}
}
if (chaptersData && chaptersData.AutoChapters && chaptersData.AutoChapters.length > 0) {
chaptersSection.style.display = 'block';
chaptersContent.innerHTML = chaptersData.AutoChapters.map(chapter => {
// Convert ms to mm:ss format
const formatTime = ms => {
const totalSeconds = Math.floor(ms / 1000);
const minutes = Math.floor(totalSeconds / 60);
const seconds = totalSeconds % 60;
return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
};
const start = formatTime(chapter.Start);
const end = formatTime(chapter.End);
return `
<div class="bg-white p-4 rounded-lg border border-gray-100 shadow-sm">
<div class="flex items-center justify-between mb-2">
<h4 class="font-bold text-gray-800 text-sm">${chapter.Headline || '未命名章节'}</h4>
<span class="text-xs font-mono text-indigo-600 bg-indigo-50 px-2 py-1 rounded">${start} - ${end}</span>
</div>
<p class="text-sm text-gray-600">${chapter.Summary || '无摘要'}</p>
</div>
`;
}).join('');
} else {
chaptersSection.style.display = 'none';
}
document.getElementById('fullTranscriptionModal').classList.add('active');
}
async function viewProject(id) {
try {
// Show loading state or skeleton if possible, for now just fetch
@@ -240,8 +326,12 @@ async function viewProject(id) {
aiSection.style.display = 'block';
document.getElementById('modalAiSummary').innerText = (data.ai_result.summary || '暂无总结').substring(0, 300) + (data.ai_result.summary && data.ai_result.summary.length > 300 ? '...' : '');
document.getElementById('modalAiTrans').innerText = (data.ai_result.transcription || '暂无内容').substring(0, 150) + '...';
// Store full data for full transcription modal
window.currentAiData = data.ai_result;
} else {
aiSection.style.display = 'none';
window.currentAiData = null;
}
// Render History Comments