Upload 10 files

src/main.js

@@ -3,8 +3,6 @@ import { renderInstructorView, setupInstructorEvents } from './views/InstructorV
 import { renderStudentView, setupStudentEvents } from './views/StudentView.js';
 import { renderAdminView, setupAdminEvents } from './views/AdminView.js';
 
-import { renderInstructorAdminView, setupInstructorAdminEvents } from './views/InstructorAdminView.js';
-
 const app = document.querySelector('#app');
 
 function navigateTo(view) {
@@ -22,10 +20,6 @@ function navigateTo(view) {
                 setupInstructorEvents();
             });
             break;
-        case 'instructors': // Manage Instructors
-            app.innerHTML = renderInstructorAdminView();
-            setupInstructorAdminEvents();
-            break;
         case 'student':
             app.innerHTML = '載入中...';
             // Async render because Student view fetches challenges
@@ -62,10 +56,6 @@ function handleRoute() {
         navigateTo('instructor');
         return;
     }
-    if (hash === 'instructors') {
-        navigateTo('instructors');
-        return;
-    }
 
 
 

src/views/InstructorView.js

@@ -791,9 +791,14 @@ export function setupInstructorEvents() {
     }
 
     if (navInstBtn) {
-        navInstBtn.addEventListener('click', () => {
-            if (confirm("即將離開儀表板前往講師管理頁面，確定嗎？")) {
-                window.location.hash = 'instructors';
+        navInstBtn.addEventListener('click', async () => {
+            const currentUser = auth.currentUser;
+            const instData = await checkInstructorPermission(currentUser);
+            if (instData?.permissions?.includes('manage_instructors')) {
+                document.getElementById('instructor-modal').classList.remove('hidden');
+                loadInstructorList();
+            } else {
+                alert("無此權限");
             }
         });
     }
@@ -1271,6 +1276,76 @@ export function setupInstructorEvents() {
                     };
 
 
+
+
+                    // --- Instructor Management Logic ---
+                    async function loadInstructorList() {
+                        const tbody = document.getElementById('instructor-list-body');
+                        tbody.innerHTML = '<tr><td colspan="4" class="p-4 text-center">載入中...</td></tr>';
+                        try {
+                            const list = await getInstructors();
+                            tbody.innerHTML = list.map(i => `
+                                <tr class="border-b border-gray-700 hover:bg-gray-700/50">
+                                    <td class="p-3">${i.name || '-'}</td>
+                                    <td class="p-3 font-mono text-sm text-gray-400">${i.email}</td>
+                                    <td class="p-3">
+                                        <div class="flex flex-wrap gap-1">
+                                            ${(i.permissions || []).map(p => `<span class="text-xs bg-indigo-900 text-indigo-300 px-1 rounded">${p}</span>`).join('')}
+                                        </div>
+                                    </td>
+                                    <td class="p-3">
+                                        ${i.role !== 'admin' ?
+                                    `<button onclick="window.removeInst('${i.email}')" class="text-red-400 hover:text-white px-2 py-1 bg-red-900/30 rounded">移除</button>` :
+                                    '<span class="text-xs text-gray-600">Admin</span>'
+                                }
+                                    </td>
+                                </tr>
+                            `).join('');
+                        } catch (e) {
+                            console.error(e);
+                            tbody.innerHTML = '<tr><td colspan="4" class="p-4 text-center text-red-500">載入失敗</td></tr>';
+                        }
+                    }
+
+                    const btnAddInst = document.getElementById('btn-add-inst');
+                    if (btnAddInst) {
+                        btnAddInst.addEventListener('click', async () => {
+                            const email = document.getElementById('new-inst-email').value.trim();
+                            const name = document.getElementById('new-inst-name').value.trim();
+                            const perms = [];
+                            if (document.getElementById('perm-room').checked) perms.push('create_room');
+                            if (document.getElementById('perm-q').checked) perms.push('add_question');
+                            if (document.getElementById('perm-inst').checked) perms.push('manage_instructors');
+
+                            if (!email || !name) {
+                                alert("請輸入 Email 和姓名");
+                                return;
+                            }
+
+                            try {
+                                await addInstructor(email, name, perms);
+                                alert("新增成功");
+                                document.getElementById('new-inst-email').value = '';
+                                document.getElementById('new-inst-name').value = '';
+                                loadInstructorList();
+                            } catch (e) {
+                                console.error(e);
+                                alert("新增失敗: " + e.message);
+                            }
+                        });
+                    }
+
+                    window.removeInst = async (email) => {
+                        if (confirm(`確定要移除 ${email} 嗎？`)) {
+                            try {
+                                await removeInstructor(email);
+                                loadInstructorList();
+                            } catch (e) {
+                                console.error(e);
+                                alert("移除失敗");
+                            }
+                        }
+                    };
                     // Snapshot Logic
                     snapshotBtn.addEventListener('click', async () => {
                         if (isSnapshotting || typeof htmlToImage === 'undefined') {