38 lines
1.4 KiB
JavaScript
38 lines
1.4 KiB
JavaScript
// static/js/modal.js
|
|
function createModal(title, content, onSave = null) {
|
|
const modal = document.createElement('div');
|
|
modal.className = 'fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center z-50';
|
|
|
|
modal.innerHTML = `
|
|
<div class="bg-white rounded-lg shadow-xl max-w-2xl w-full mx-4">
|
|
<div class="px-6 py-4 border-b border-gray-200">
|
|
<h3 class="text-lg font-medium text-gray-900">${title}</h3>
|
|
</div>
|
|
<div class="px-6 py-4">
|
|
${content}
|
|
</div>
|
|
<div class="px-6 py-4 bg-gray-50 rounded-b-lg flex justify-end gap-3">
|
|
<button onclick="closeModal(this)"
|
|
class="rounded-md bg-white px-3 py-2 text-sm font-semibold text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50">
|
|
Cancel
|
|
</button>
|
|
${onSave ? `
|
|
<button onclick="saveModal(this)"
|
|
class="rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500">
|
|
Save
|
|
</button>
|
|
` : ''}
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
document.body.appendChild(modal);
|
|
return modal;
|
|
}
|
|
|
|
function closeModal(button) {
|
|
const modal = button.closest('.fixed');
|
|
if (modal) {
|
|
modal.remove();
|
|
}
|
|
} |