教室班级详情

src/types/classroom.ts

@@ -107,6 +107,9 @@ export interface Classroom {
     /** 绑定班级 id（null=未绑定） */
     classId?: number | null;
     className?: string | null;
+    /** 绑定班级的年级（1=高一 2=高二 3=高三） */
+    grade?: GradeValue | null;
+    gradeName?: string | null;
     studentCount?: number | null;
     headTeacher?: string | null;
 }

src/views/classroom/ClassroomManage.vue

@@ -17,6 +17,9 @@ import type {
     Equipment,
 } from "@/types/classroom";
 
+/** 年级值 → 展示名（绑定班级详情行用） */
+const GRADE_LABELS: Record<number, string> = { 1: "高一", 2: "高二", 3: "高三" };
+
 /**
  * 教室管理（核心页）· 三栏布局
  *
@@ -500,6 +503,27 @@ const focusBuildingName = computed(
     () => buildings.value.find((b) => b.serID === focusRoom.value?.buildingId)?.buildingName ?? ""
 );
 
+/**
+ * 详情面板的绑定班级行。树回退行没有班级字段（classId 为 undefined）→ 全部显示"—"；
+ * 未绑定（classId 为 null）→ 班级行显示"未绑定"；已绑定 → 年级/班级/班主任/人数。
+ */
+const focusClassRows = computed(() => {
+    const fr = focusRoom.value;
+    const dash = "—";
+    if (!fr || fr.classId === undefined) {
+        return { grade: dash, className: dash, headTeacher: dash, studentCount: dash };
+    }
+    if (fr.classId == null) {
+        return { grade: dash, className: "未绑定", headTeacher: dash, studentCount: dash };
+    }
+    return {
+        grade: fr.gradeName || (fr.grade != null ? GRADE_LABELS[fr.grade] ?? dash : dash),
+        className: fr.className || dash,
+        headTeacher: fr.headTeacher || dash,
+        studentCount: fr.studentCount == null ? dash : `${fr.studentCount} 人`,
+    };
+});
+
 /** 布局示意图几何（按座位数生成课桌网格；多媒体区按设备名判断） */
 const plan = computed(() => {
     const fr = focusRoom.value;
@@ -1225,6 +1249,22 @@ onMounted(async () => {
                                     </Tag>
                                 </span>
                             </div>
+                            <div class="detail-row">
+                                <span class="detail-row__label">年级</span>
+                                <span class="detail-row__value">{{ focusClassRows.grade }}</span>
+                            </div>
+                            <div class="detail-row">
+                                <span class="detail-row__label">班级</span>
+                                <span class="detail-row__value">{{ focusClassRows.className }}</span>
+                            </div>
+                            <div class="detail-row">
+                                <span class="detail-row__label">班主任</span>
+                                <span class="detail-row__value">{{ focusClassRows.headTeacher }}</span>
+                            </div>
+                            <div class="detail-row">
+                                <span class="detail-row__label">人数</span>
+                                <span class="detail-row__value">{{ focusClassRows.studentCount }}</span>
+                            </div>
                         </div>
 
                         <!-- 布局示意图（按座位数/设备生成的示意，非实际测绘图） -->