<template>
  <div>
    <el-dialog
      v-if="type === 102"
      :model-value="type === 102"
      :title="title"
      :before-close="fnClose"
    >
      <el-space wrap>
        <el-button type="primary" v-print="'#printContent'">打印</el-button>
      </el-space>
      <div id="printContent">
        <div style="text-align: center">
          <el-text size="large">安全培训教育记录及签字表</el-text>
        </div>
        <div style="text-align: center">
          (
          <el-checkbox>岗前三级培训</el-checkbox>
          <el-checkbox>专项培训</el-checkbox>
          <el-checkbox>再培训</el-checkbox>
          <el-checkbox>日常培训</el-checkbox>
          )
        </div>
        <el-descriptions :column="3" border>
          <el-descriptions-item label="日期">
            {{ data.taskInfo.CREATTIME }}
          </el-descriptions-item>
          <el-descriptions-item label="培训地点">
            <!-- todo 原项目为空 -->
          </el-descriptions-item>
          <el-descriptions-item label="人数">
            {{ data.studentList.length }}
          </el-descriptions-item>
          <el-descriptions-item label="学时">
            {{ class_hours }}
          </el-descriptions-item>
          <el-descriptions-item label="培训对象" :span="2">
            <!-- todo 原项目为空 -->
          </el-descriptions-item>
          <el-descriptions-item label="培训教师" :span="3">
            {{ teachers }}
          </el-descriptions-item>
          <el-descriptions-item label="培训内容:" :span="3">
            {{ coursewares }}
          </el-descriptions-item>
        </el-descriptions>
        <div style="text-align: center">
          <el-text>受培训人</el-text>
        </div>
        <layout-table :data="data.studentList" :show-pagination="false">
          <el-table-column prop="USER_NAME" label="姓名" />
          <el-table-column prop="DEPARTMENT_NAME" label="部门" />
        </layout-table>
      </div>
      <template #footer>
        <el-button @click="fnClose">关闭</el-button>
      </template>
    </el-dialog>
  </div>
</template>

<script setup>
import {
  getAllCourseware,
  getStudyTaskInfo,
  getStudentByTaskId,
} from "@/request/archives.js";
import { computed, reactive } from "vue";
import { useVModels } from "@vueuse/core";
import LayoutTable from "@/components/table/index.vue";

const props = defineProps({
  title: {
    type: String,
    required: false,
    default: "",
  },
  year: {
    type: String,
    required: false,
    default: "",
  },
  type: {
    type: Number,
    required: true,
  },
  studyTaskId: {
    type: String,
    required: false,
    default: "",
  },
});
const { title, type, studyTaskId } = useVModels(props);

const data = reactive({
  taskInfo: {},
  coursewareList: [],
  studentList: [],
});

const class_hours = computed(() => {
  let result = 0;
  if (data.coursewareList && data.coursewareList.length > 0) {
    data.coursewareList.forEach((item) => {
      result += item.CLASSHOUR;
    });
  }
  return ((result || 0) / 45).toFixed(2);
});

const teachers = computed(() => {
  const result = [];
  if (data.coursewareList && data.coursewareList.length > 0) {
    data.coursewareList.forEach((item) => {
      result.push(item.SPEAKER);
    });
  }
  return result.length > 0 ? result.join(",") : "";
});

const coursewares = computed(() => {
  const result = [];
  if (data.coursewareList && data.coursewareList.length > 0) {
    data.coursewareList.forEach((item) => {
      result.push(item.COURSEWARENAME);
    });
  }
  return result.length > 0 ? result.join(",") : "";
});

const emits = defineEmits(["update:visible"]);

const fnClose = () => {
  emits("update:current", undefined);
};

const fnGetStudyTaskInfo = async () => {
  if (studyTaskId && studyTaskId.value && studyTaskId.value.length > 0) {
    const respData = await getStudyTaskInfo({
      STUDYTASK_ID: studyTaskId.value,
    });
    if (respData && respData.pd) {
      data.taskInfo = respData.pd;
    }
  }
};
await fnGetStudyTaskInfo();

const fnGetAllCoursewareByHandout = async () => {
  if (studyTaskId && studyTaskId.value && studyTaskId.value.length > 0) {
    const respData = await getAllCourseware({
      STUDYTASK_ID: studyTaskId.value,
    });
    if (respData && respData.varList) {
      data.coursewareList = respData.varList;
    }
  }
};
await fnGetAllCoursewareByHandout();

const fnGetStudentByTaskId = async () => {
  if (studyTaskId && studyTaskId.value && studyTaskId.value.length > 0) {
    const respData = await getStudentByTaskId({
      STUDYTASK_ID: studyTaskId.value,
    });
    if (respData && respData.varList) {
      data.studentList = respData.varList;
    }
  }
};
await fnGetStudentByTaskId();
</script>

<style scoped lang="scss"></style>
