From 87e6cb636fa72deeef0fb1ecf3dc994468373ba8 Mon Sep 17 00:00:00 2001
From: Jeffrey Hsu <xfj12@outlook.com>
Date: Sat, 22 Mar 2025 19:57:14 +0800
Subject: [PATCH] Changes

---
 .../assessment/CourseInfoDisplay.vue          |  12 +-
 .../src/components/common/SectionHeader.vue   |  39 ++++
 src/renderer/src/views/panel/PanelFinal.vue   |   8 +-
 src/renderer/src/views/panel/PanelIndex.vue   | 166 ++----------------
 src/renderer/src/views/panel/PanelPaper.vue   |   8 +-
 src/renderer/src/views/panel/PanelScore.vue   |   8 +-
 src/renderer/src/views/panel/PanelStudent.vue |  15 +-
 7 files changed, 80 insertions(+), 176 deletions(-)
 create mode 100644 src/renderer/src/components/common/SectionHeader.vue

diff --git a/src/renderer/src/components/assessment/CourseInfoDisplay.vue b/src/renderer/src/components/assessment/CourseInfoDisplay.vue
index 30073ed..3155936 100644
--- a/src/renderer/src/components/assessment/CourseInfoDisplay.vue
+++ b/src/renderer/src/components/assessment/CourseInfoDisplay.vue
@@ -44,27 +44,27 @@ defineExpose({ showEditor })
 <template>
   <el-descriptions class="mx-auto px-8 py-4" border>
     <el-descriptions-item>
-      <template #label> 课程名称 </template>
+      <template #label> 课程名称</template>
       {{ course.name }}
     </el-descriptions-item>
     <el-descriptions-item>
-      <template #label> 开课学院 </template>
+      <template #label> 开课学院</template>
       {{ course.campus }}
     </el-descriptions-item>
     <el-descriptions-item>
-      <template #label> 任课教师 </template>
+      <template #label> 任课教师</template>
       {{ course.teacher }}
     </el-descriptions-item>
     <el-descriptions-item>
-      <template #label> 课程负责人 </template>
+      <template #label> 课程负责人</template>
       {{ course.master }}
     </el-descriptions-item>
     <el-descriptions-item>
-      <template #label> 学分 </template>
+      <template #label> 学分</template>
       {{ course.credit }}
     </el-descriptions-item>
     <el-descriptions-item>
-      <template #label> 教学班级 </template>
+      <template #label> 教学班级</template>
       {{ course.className }}
     </el-descriptions-item>
   </el-descriptions>
diff --git a/src/renderer/src/components/common/SectionHeader.vue b/src/renderer/src/components/common/SectionHeader.vue
new file mode 100644
index 0000000..fe5c888
--- /dev/null
+++ b/src/renderer/src/components/common/SectionHeader.vue
@@ -0,0 +1,39 @@
+<!--
+  -
+  - Copyright (c) 2025. Jeffery Hsu - Achievement Report Generator
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU General Public License as published by
+  - the Free Software Foundation, either version 3 of the License, or
+  - (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  - GNU General Public License for more details.
+  -
+  - You should have received a copy of the GNU General Public License
+  - along with this program. If not, see <https://www.gnu.org/licenses/>.
+  -
+  -->
+
+<script setup lang="ts">
+defineProps<{
+  title?: string
+}>()
+</script>
+
+<template>
+  <div
+    class="sticky top-0 flex h-14 items-center justify-between border-b border-gray-300 bg-white px-8 font-bold"
+  >
+    <slot name="title">
+      <p>{{ title }}</p>
+    </slot>
+    <div class="flex items-center">
+      <slot />
+    </div>
+  </div>
+</template>
+
+<style scoped></style>
diff --git a/src/renderer/src/views/panel/PanelFinal.vue b/src/renderer/src/views/panel/PanelFinal.vue
index d9a8458..5ea950c 100644
--- a/src/renderer/src/views/panel/PanelFinal.vue
+++ b/src/renderer/src/views/panel/PanelFinal.vue
@@ -17,10 +17,14 @@
   -
   -->
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import SectionHeader from '@renderer/components/common/SectionHeader.vue'
+</script>
 
 <template>
-  <div class="panel">完成录入</div>
+  <div>
+    <section-header title="完成录入" />
+  </div>
 </template>
 
 <style scoped></style>
diff --git a/src/renderer/src/views/panel/PanelIndex.vue b/src/renderer/src/views/panel/PanelIndex.vue
index c2ba9ba..9f8afbc 100644
--- a/src/renderer/src/views/panel/PanelIndex.vue
+++ b/src/renderer/src/views/panel/PanelIndex.vue
@@ -19,64 +19,28 @@
 
 <script setup lang="ts">
 import { useGlobalStore } from '@renderer/store'
-// import { storeToRefs } from 'pinia'
-import { computed, onMounted, ref } from 'vue'
-import { IGoalRef } from '@renderer/types'
+import { onMounted, ref } from 'vue'
 import { InfoFilled, Plus } from '@element-plus/icons-vue'
-import AssessmentStage from '@renderer/components/assessment/AssessmentStage.vue'
 import CourseInfoDisplay from '@renderer/components/assessment/CourseInfoDisplay.vue'
 import { ElMessage } from 'element-plus'
 import router from '@renderer/router'
+import SectionHeader from '@renderer/components/common/SectionHeader.vue'
 
-type Parent = 'n' | 'p' | 'f'
 type CourseInfoDisplayExposed = {
   showEditor: () => boolean
 }
 
 const store = useGlobalStore()
-// const { normalStage, processStage, finalStage } = storeToRefs(store)
 
 const course = ref(store.doc.course)
 const courseInfoDisplay = ref<CourseInfoDisplayExposed | null>(null)
-const tempGoal = ref<IGoalRef>(store.goalFactory())
-const tempGoalList = ref<IGoalRef[]>(store.goals)
-// const tempAssessmentMethod = ref<IAssessmentMethod>({ method: '', weight: 0 })
-// const tempAssessment = ref<IAssessment>({ method: [], stage: '', weight: 0 })
 const showAddGoal = ref(false)
-// const showEditCourse = ref(false)
-// const showEditStage = ref(false)
-// const showAddAssessmentMethod = ref(false)
-// const assessmentStageList = ref<{ title: string; parent: Parent; assessment: Ref<IAssessment> }[]>([
-//   {
-//     title: '平时考核',
-//     parent: 'n',
-//     assessment: ref(store.doc.assessment.daily)
-//   },
-//   {
-//     title: '过程考核',
-//     parent: 'p',
-//     assessment: ref(store.doc.assessment.progress)
-//   },
-//   {
-//     title: '期末考核',
-//     parent: 'f',
-//     assessment: finalStage
-//   }
-// ])
-
-// let assessmentParent: Parent | null = null
-
-const addGoalSubmit = computed(() => !Object.values(tempGoal.value).every((v) => v))
-// const checkAllStageWeightSum = computed(() => {
-//   return normalStage.value.weight + processStage.value.weight + finalStage.value.weight === 100
-// })
 
 const handleEditCourse = () => {
   if (courseInfoDisplay.value === null) {
     ElMessage.error({
       message: '组件错误：COURSE_INFO_DISPLAY 为 null'
     })
-
     return
   }
 
@@ -87,60 +51,6 @@ const handleAddNewGoal = () => {
   showAddGoal.value = true
 }
 
-const clearTempGoal = () => {
-  tempGoal.value = store.goalFactory()
-}
-
-const handleAddGoalCancel = () => {
-  clearTempGoal()
-  showAddGoal.value = false
-}
-
-const handleAddGoalSubmit = () => {
-  tempGoalList.value.push(tempGoal.value)
-  console.log(tempGoal.value.weight)
-  clearTempGoal()
-  showAddGoal.value = false
-}
-
-const handleDeleteGoal = (idx: number) => {
-  tempGoalList.value.splice(idx, 1)
-}
-
-// const handleShowAddAssessmentMethodDialog = (parent: Parent) => {
-//   assessmentParent = parent
-//   showAddAssessmentMethod.value = true
-// }
-
-// const handleEditAssessmentMethod = (item: IAssessmentMethod, parent: Parent) => {
-//   tempAssessmentMethod.value = item
-//   assessmentParent = parent
-//   showAddAssessmentMethod.value = true
-// }
-
-// const handleEditAssessment = (stage: Parent) => {
-//   showEditStage.value = true
-//   if (stage === 'n') {
-//     tempAssessment.value = { ...store.normalStage }
-//     assessmentParent = 'n'
-//   } else if (stage === 'p') {
-//     tempAssessment.value = { ...store.processStage }
-//     assessmentParent = 'p'
-//   } else if (stage === 'f') {
-//     tempAssessment.value = { ...store.finalStage }
-//     assessmentParent = 'f'
-//   }
-// }
-
-// const handleEditAssessmentSubmit = (action: 'save' | 'cancel', stage: 'n' | 'p' | 'f') => {
-//   if (action === 'save') {
-//     store.saveStage(tempAssessment.value, stage)
-//   }
-
-//   tempAssessment.value = { method: [], weight: 0, stage: '' }
-//   showEditStage.value = false
-// }
-
 onMounted(async () => {
   if (store.doc.course.isEmpty()) {
     await router.push({ name: 'start' })
@@ -150,69 +60,17 @@ onMounted(async () => {
 
 <template>
   <div>
-    <div
-      class="sticky top-0 flex h-14 items-center justify-between border-b border-gray-300 bg-white px-8 font-bold"
-    >
-      <p>课程信息：{{ course.name }}</p>
-      <div class="flex items-center">
-        <el-button type="primary" :icon="InfoFilled" @click="handleEditCourse">
-          编辑课程信息
-        </el-button>
-        <el-button :icon="Plus" @click="handleAddNewGoal">添加课程目标</el-button>
-      </div>
-    </div>
+    <section-header>
+      <template #title>
+        <p>课程信息：{{ course.name }}</p>
+      </template>
+      <el-button type="primary" :icon="InfoFilled" @click="handleEditCourse">
+        编辑课程信息
+      </el-button>
+      <el-button :icon="Plus" @click="handleAddNewGoal">添加课程目标</el-button>
+    </section-header>
 
-    <course-info-display ref="courseInfoDisplay" />
-
-    <!-- <assessment-stage /> -->
-
-    <el-divider content-position="left">课程目标</el-divider>
-    <div class="mx-auto w-full max-w-lg">
-      <div class="my-4">
-        <div
-          v-for="(item, index) in tempGoalList"
-          :key="index"
-          class="mb-4 rounded-md border border-gray-200"
-        >
-          <div class="border-b border-b-gray-200 p-4 font-bold">
-            <p>目标 {{ index + 1 }}（{{ item.importance }}）</p>
-          </div>
-          <div class="p-4">
-            <p class="mb-1">课程目标：</p>
-            <p class="indent-8 text-sm">{{ item.target }}</p>
-            <p class="my-1">目标支撑的毕业要求指标点：</p>
-            <p class="indent-8 text-sm">{{ item.indicator }}</p>
-          </div>
-          <div class="flex justify-end border-t border-gray-200 p-4">
-            <el-button type="danger" @click="handleDeleteGoal">删除</el-button>
-          </div>
-        </div>
-
-        <el-dialog v-model="showAddGoal" title="添加课程目标">
-          <el-form v-show="showAddGoal" v-model="tempGoal">
-            <el-form-item label="强弱支撑" label-position="top">
-              <el-select v-model="tempGoal.importance">
-                <el-option label="H" value="H">H</el-option>
-                <el-option label="M" value="M">M</el-option>
-                <el-option label="L" value="L">L</el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="课程目标" label-position="top">
-              <el-input v-model="tempGoal.target" type="textarea" />
-            </el-form-item>
-            <el-form-item label="目标支撑的毕业要求指标点" label-position="top">
-              <el-input v-model="tempGoal.indicator" type="textarea" />
-            </el-form-item>
-          </el-form>
-          <template #footer>
-            <el-button :disabled="addGoalSubmit" type="primary" @click="handleAddGoalSubmit"
-              >添加</el-button
-            >
-            <el-button @click="handleAddGoalCancel">取消</el-button>
-          </template>
-        </el-dialog>
-      </div>
-    </div>
+    <CourseInfoDisplay ref="courseInfoDisplay" />
   </div>
 </template>
 
diff --git a/src/renderer/src/views/panel/PanelPaper.vue b/src/renderer/src/views/panel/PanelPaper.vue
index 95305d0..eb28af1 100644
--- a/src/renderer/src/views/panel/PanelPaper.vue
+++ b/src/renderer/src/views/panel/PanelPaper.vue
@@ -17,10 +17,14 @@
   -
   -->
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import SectionHeader from '@renderer/components/common/SectionHeader.vue'
+</script>
 
 <template>
-  <div>试卷录入</div>
+  <div>
+    <section-header title="试卷录入" />
+  </div>
 </template>
 
 <style scoped></style>
diff --git a/src/renderer/src/views/panel/PanelScore.vue b/src/renderer/src/views/panel/PanelScore.vue
index 27c1646..f5e0fcf 100644
--- a/src/renderer/src/views/panel/PanelScore.vue
+++ b/src/renderer/src/views/panel/PanelScore.vue
@@ -17,10 +17,14 @@
   -
   -->
 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import SectionHeader from '@renderer/components/common/SectionHeader.vue'
+</script>
 
 <template>
-  <div class="panel">成绩录入</div>
+  <div>
+    <section-header title="成绩录入" />
+  </div>
 </template>
 
 <style scoped></style>
diff --git a/src/renderer/src/views/panel/PanelStudent.vue b/src/renderer/src/views/panel/PanelStudent.vue
index 0a21a9a..b8e8a1a 100644
--- a/src/renderer/src/views/panel/PanelStudent.vue
+++ b/src/renderer/src/views/panel/PanelStudent.vue
@@ -21,23 +21,18 @@
 import { useGlobalStore } from '@renderer/store'
 import { storeToRefs } from 'pinia'
 import { Plus } from '@element-plus/icons-vue'
+import SectionHeader from '@renderer/components/common/SectionHeader.vue'
 
 const store = useGlobalStore()
 const { studentList } = storeToRefs(store)
-
-//const showStudentAdd = ref(false)
 </script>
 
 <template>
   <div>
-    <div
-      class="sticky top-0 z-10 flex h-14 items-center justify-between border-b border-gray-300 bg-white px-8 font-bold"
-    >
-      <p>学生管理</p>
-      <div class="flex items-center">
-        <el-button type="primary" :icon="Plus">手动添加</el-button>
-      </div>
-    </div>
+    <section-header title="学生管理">
+      <el-button type="primary" :icon="Plus">手动添加</el-button>
+    </section-header>
+
     <el-table :data="studentList" class="w-full" stripe>
       <el-table-column type="index" width="55" />
       <el-table-column prop="serialNumber" label="学号" sortable />