${doc.content.substring(0, 100)}
By ${doc.author}
${new Date(doc.createdAt).toLocaleDateString()}
`;
list.appendChild(card);
});
}
}
function showListView() {
document.getElementById('detail-view').classList.add('hidden');
document.getElementById('list-view').classList.remove('hidden');
}
function showDetailView(id) {
const doc = documents.find(d => d.id === id);
if (!doc) return;
const detailContainer = document.getElementById('detail-view');
detailContainer.innerHTML = `
${doc.title}
Author: ${doc.author}
Category: ${doc.category}
Created: ${new Date(doc.createdAt).toLocaleString()}
${doc.content}
`;
document.getElementById('list-view').classList.add('hidden');
detailContainer.classList.remove('hidden');
detailContainer.querySelector('#back-btn').onclick = showListView;
detailContainer.querySelector('.action-btn-edit').onclick = () => openModal(doc.id);
detailContainer.querySelector('.action-btn-delete').onclick = () => openDeleteModal(doc.id);
detailContainer.querySelector('.action-btn-pdf').onclick = () => generatePdf(doc);
}
// --- Modals and Forms ---
function openModal(id = null) {
const modal = document.getElementById('doc-modal');
const form = document.getElementById('doc-form');
form.reset();
if (id) {
const doc = documents.find(d => d.id === id);
document.getElementById('modal-title').textContent = 'Edit Document';
document.getElementById('doc-id').value = doc.id;
document.getElementById('doc-title').value = doc.title;
document.getElementById('doc-author').value = doc.author;
document.getElementById('doc-category').value = doc.category;
document.getElementById('doc-content').value = doc.content;
} else {
document.getElementById('modal-title').textContent = 'Add New Document';
document.getElementById('doc-id').value = '';
}
modal.classList.remove('hidden');
}
function closeModal() {
document.getElementById('doc-modal').classList.add('hidden');
}
document.getElementById('doc-form').addEventListener('submit', (e) => {
e.preventDefault();
const id = document.getElementById('doc-id').value;
const docData = {
title: document.getElementById('doc-title').value,
author: document.getElementById('doc-author').value,
category: document.getElementById('doc-category').value,
content: document.getElementById('doc-content').value,
};
if (id) { // Editing existing doc
const index = documents.findIndex(d => d.id === parseInt(id));
documents[index] = { ...documents[index], ...docData };
} else { // Creating new doc
docData.id = Date.now();
docData.createdAt = new Date().toISOString();
documents.push(docData);
}
saveState();
renderDocumentsList();
closeModal();
if(id) showDetailView(parseInt(id)); // Refresh detail view if editing
});
function openDeleteModal(id) {
document.getElementById('delete-doc-id').value = id;
document.getElementById('delete-modal').classList.remove('hidden');
}
function closeDeleteModal() {
document.getElementById('delete-modal').classList.add('hidden');
}
document.getElementById('confirm-delete-btn').addEventListener('click', () => {
const id = parseInt(document.getElementById('delete-doc-id').value);
documents = documents.filter(d => d.id !== id);
saveState();
closeDeleteModal();
showListView();
renderDocumentsList();
});
// --- Event Listeners ---
document.getElementById('add-doc-btn').addEventListener('click', () => openModal());
document.getElementById('cancel-btn').addEventListener('click', closeModal);
document.getElementById('cancel-delete-btn').addEventListener('click', closeDeleteModal);
document.getElementById('search-box').addEventListener('input', (e) => {
currentFilter.search = e.target.value.toLowerCase();
renderDocumentsList();
});
// --- PDF Generation ---
function generatePdf(doc) {
const { jsPDF } = window.jspdf;
const pdf = new jsPDF();
pdf.setFont('helvetica', 'bold');
pdf.setFontSize(22);
pdf.text(doc.title, 15, 20);
pdf.setFontSize(10);
pdf.setFont('helvetica', 'normal');
pdf.setTextColor(100);
pdf.text(`By ${doc.author}`, 15, 28);
pdf.text(`Category: ${doc.category}`, 15, 33);
pdf.text(`Created: ${new Date(doc.createdAt).toLocaleString()}`, 15, 38);
const content = pdf.splitTextToSize(doc.content, 180);
pdf.setTextColor(0);
pdf.text(content, 15, 50);
pdf.save(`${doc.title.replace(/\s+/g, '_')}.pdf`);
}
// --- Initial Load ---
function loadInitialData() {
documents = [
{ id: 1, title: 'Q3 Financial Report', author: 'Alice Johnson', category: 'Reports', createdAt: '2025-09-08T10:00:00Z', content: 'The third quarter showed a 15% increase in revenue, driven by strong performance in the North American market. Key metrics and detailed analysis are included within.' },
{ id: 2, title: 'Project Phoenix MSA', author: 'Legal Team', category: 'Contracts', createdAt: '2025-09-05T14:30:00Z', content: 'This Master Service Agreement outlines the terms and conditions for Project Phoenix, including deliverables, payment schedules, and intellectual property rights.' },
{ id: 3, title: 'Server Upgrade Invoice #8432', author: 'IT Department', category: 'Invoices', createdAt: '2025-08-20T11:00:00Z', content: 'Invoice for the procurement and installation of new server hardware. Total amount: $12,500. Payment due by Oct 1, 2025.' },
{ id: 4, title: 'Weekly Standup Notes', author: 'Bob Williams', category: 'Meeting Notes', createdAt: '2025-09-09T09:15:00Z', content: '- Team Alpha: Blocked by API access. ETA Friday.\n- Team Bravo: On track for sprint completion.\n- Marketing: A/B test results are positive.' }
];
renderCategories();
renderDocumentsList();
}
loadInitialData();
});