<!--
  -
  - 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">
import { ref } from 'vue'
import { useGlobalStore } from '@renderer/store'
import { Operation } from '@renderer/types/share'

const store = useGlobalStore()
const course = ref(store.doc.course)

const tempCourse = ref(store.doc.course.getCurrImpl())
const isShowEditor = ref(false)

const handleEditorAction = (action: Operation) => {
  if (action === 'save') {
    course.value.setFromImpl(tempCourse.value)
  }
  tempCourse.value = store.doc.course.getCurrImpl()
  isShowEditor.value = false
}

const handleShowEditor = () => (isShowEditor.value = true)

defineExpose({ handleShowEditor })
</script>

<template>
  <el-descriptions class="mx-auto px-8 py-4" border>
    <el-descriptions-item>
      <template #label> 课程名称</template>
      {{ course.name }}
    </el-descriptions-item>
    <el-descriptions-item>
      <template #label> 开课学院</template>
      {{ course.campus }}
    </el-descriptions-item>
    <el-descriptions-item>
      <template #label> 任课教师</template>
      {{ course.teacher }}
    </el-descriptions-item>
    <el-descriptions-item>
      <template #label> 课程负责人</template>
      {{ course.master }}
    </el-descriptions-item>
    <el-descriptions-item>
      <template #label> 学分</template>
      {{ course.credit }}
    </el-descriptions-item>
    <el-descriptions-item>
      <template #label> 教学班级</template>
      {{ course.className }}
    </el-descriptions-item>
  </el-descriptions>

  <el-dialog
    v-model="isShowEditor"
    title="编辑课程信息"
    :show-close="false"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
  >
    <el-form :model="tempCourse" label-width="auto">
      <el-form-item label="课号">
        <el-input
          v-model="tempCourse.id"
          type="text"
          placeholder="(xxxx-xxxx-x)-xxxxxxxxxx-xxxxx-x"
        />
      </el-form-item>
      <el-form-item label="课程名称">
        <el-input v-model="tempCourse.name" type="text" placeholder="课程名称" />
      </el-form-item>
      <el-form-item label="开课学院">
        <el-input v-model="tempCourse.campus" type="text" placeholder="开课学院" />
      </el-form-item>
      <el-form-item label="任课教师">
        <el-input v-model="tempCourse.teacher" type="text" placeholder="任课教师" />
      </el-form-item>
      <el-form-item label="课程负责人" class="relative">
        <el-input v-model="tempCourse.master" type="text" placeholder="课程负责人" />
      </el-form-item>
      <el-form-item label="学分">
        <el-input v-model="tempCourse.credit" type="number" placeholder="学分" />
      </el-form-item>
      <el-form-item label="教学班级">
        <el-input v-model="tempCourse.className" type="text" placeholder="教学班级" />
      </el-form-item>
    </el-form>
    <template #footer>
      <el-button type="primary" @click="handleEditorAction('save')">确认</el-button>
      <el-button @click="handleEditorAction('cancel')">取消</el-button>
    </template>
  </el-dialog>
</template>

<style scoped></style>
