fix: add showNewDocModal and showNewFolderModal to projectView

This commit is contained in:
Hiro
2026-03-28 13:52:35 +00:00
parent 906b01248c
commit c090cd3a71

View File

@@ -478,3 +478,126 @@ window.showMoveToFolderModal = async function(documentId) {
if (e.target === backdrop) backdrop.remove(); if (e.target === backdrop) backdrop.remove();
}; };
}; };
// Global function: Show modal to create new document in project
window.showNewDocModal = async function(projectId, folderId = '') {
const backdrop = document.createElement('div');
backdrop.className = 'modal-backdrop';
backdrop.innerHTML = `
<div class="modal" style="min-width: 450px;">
<div class="modal-header">
<span>📄</span>
<h3>Create New Document</h3>
<button class="modal-close" onclick="this.closest('.modal-backdrop').remove()">✕</button>
</div>
<div class="modal-body">
<div class="form-group">
<label for="new-doc-title">Title</label>
<input type="text" id="new-doc-title" class="form-control" placeholder="Document title">
</div>
<div class="form-group" style="margin-top: 16px;">
<label for="new-doc-type">Type</label>
<select id="new-doc-type" class="form-control">
<option value="general">General</option>
<option value="requirement">Requirement</option>
<option value="spec">Spec</option>
<option value="note">Note</option>
</select>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-ghost" onclick="this.closest('.modal-backdrop').remove()">Cancel</button>
<button class="btn btn-primary" id="create-doc-btn">Create</button>
</div>
</div>
`;
document.body.appendChild(backdrop);
const titleInput = document.getElementById('new-doc-title');
const typeSelect = document.getElementById('new-doc-type');
const createBtn = document.getElementById('create-doc-btn');
titleInput.focus();
createBtn.onclick = async () => {
const title = titleInput.value.trim();
if (!title) {
window.app.showToast('Please enter a title', 'error');
return;
}
try {
const doc = await api.createDocument({
title,
type: typeSelect.value,
projectId,
folderId: folderId || null
});
backdrop.remove();
window.app.showToast('Document created', 'success');
window.app.navigate('editor', { id: doc.id, projectId, folderId: folderId || null });
} catch (e) {
window.app.showToast('Failed to create document: ' + e.message, 'error');
}
};
backdrop.onclick = (e) => {
if (e.target === backdrop) backdrop.remove();
};
};
// Global function: Show modal to create new folder in project
window.showNewFolderModal = async function(projectId, parentFolderId = null) {
const backdrop = document.createElement('div');
backdrop.className = 'modal-backdrop';
backdrop.innerHTML = `
<div class="modal" style="min-width: 450px;">
<div class="modal-header">
<span>📁</span>
<h3>Create New Folder</h3>
<button class="modal-close" onclick="this.closest('.modal-backdrop').remove()">✕</button>
</div>
<div class="modal-body">
<div class="form-group">
<label for="new-folder-name">Folder Name</label>
<input type="text" id="new-folder-name" class="form-control" placeholder="e.g., Backend">
</div>
</div>
<div class="modal-footer">
<button class="btn btn-ghost" onclick="this.closest('.modal-backdrop').remove()">Cancel</button>
<button class="btn btn-primary" id="create-folder-btn">Create</button>
</div>
</div>
`;
document.body.appendChild(backdrop);
const nameInput = document.getElementById('new-folder-name');
const createBtn = document.getElementById('create-folder-btn');
nameInput.focus();
createBtn.onclick = async () => {
const name = nameInput.value.trim();
if (!name) {
window.app.showToast('Please enter a folder name', 'error');
return;
}
try {
await api.createFolder({
name,
projectId,
parentId: parentFolderId
});
backdrop.remove();
window.app.showToast('Folder created', 'success');
window.app.navigate('project', { id: projectId });
} catch (e) {
window.app.showToast('Failed to create folder: ' + e.message, 'error');
}
};
backdrop.onclick = (e) => {
if (e.target === backdrop) backdrop.remove();
};
};