update data

app/pages/sections/[id].vue

@@ -5,7 +5,7 @@
       <div class="container mx-auto px-4">
         <div class="flex items-center justify-between h-16">
           <div class="flex items-center gap-4">
             <UButton icon="i-lucide-arrow-left" color="gray" variant="ghost" to="/sections" />
             <h2 class="text-xl font-bold text-slate-800">
               ตารางเรียน - {{ section?.section_name || 'Loading...' }}
             </h2>
@@ -20,7 +20,7 @@
         <!-- Profile Card -->
         <div class="flex-1 bg-white p-6 rounded-2xl border border-slate-200 shadow-sm flex items-center gap-6">
           <div
             class="w-20 h-20 rounded-full bg-blue-100 text-slate-800 font-bold flex items-center justify-center text-3xl shadow-sm border border-blue-200">
             <!-- Show initial of section -->
             {{ section?.section_name ? section.section_name.substring(0, 2) : 'S' }}
           </div>
@@ -977,7 +977,8 @@
     const extSubj = externalSubjects.value?.find(e => e.id_ext_subject === extId)
     const roomText = roomId ? ` [${rooms.value?.find(r => r.id_room == roomId)?.room_name || ''}]` : ''
     if (!extSubj) return `Unknown (ถูกลบ)${roomText}`
-    return `${extSubj.name_subject} [นอกสาขา]${roomText}`
+    const instructor = extSubj.instructor_name ? ` (${extSubj.instructor_name})` : ''
+    return `${extSubj.name_subject}${instructor} [นอกสาขา]${roomText}`
   }
 
   const subj = allSubjects.value?.find(s => s.id_subject == val)
@@ -1002,7 +1003,12 @@
     if (r) roomName = r.room_name
   }
 
-  return `${subj.name_subject} ${sectionDisplay} ${roomName ? `[${roomName}]` : ''}`
+  let teacherName = ''
+  if (subj.first_name || subj.last_name) {
+    teacherName = ` (${[subj.prefix, subj.first_name, subj.last_name].filter(Boolean).join(' ').trim()})`
+  }
+
+  return `${subj.name_subject}${teacherName} ${sectionDisplay} ${roomName ? `[${roomName}]` : ''}`
 }
 
 const clearSchedule = (noConfirm = false) => {

server/api/Subjects/index.get.js

@@ -8,6 +8,7 @@ export default defineEventHandler((event) => {
   let subjects
   let baseQuery = `
     SELECT s.*,
+    t.prefix, t.first_name, t.last_name,
     (
       SELECT GROUP_CONCAT(sec.section_name, ', ')
       FROM SubjectSections ss
@@ -22,6 +23,7 @@ export default defineEventHandler((event) => {
       WHERE ss.id_subject = s.id_subject
     ) as sections_json
     FROM Subjects s
+    LEFT JOIN teachers t ON s.id_teacher = t.id_teacher
   `
 
   let whereClauses = []