This commit is contained in:
@@ -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 = {
|
||||
|
||||
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user