<template>
  <div class="assignment-calculate-detail">
    <div class="ass-part">
      <div class="box-justify mb-2">
        <h3>开课课程考试情况总览</h3>
        <el-button type="primary" plain @click="toback">返回</el-button>
      </div>
      <div class="part-box part-box-pad ass-summary">
        <div class="ass-summary-tags">
          <div class="ass-summary-tag">
            <h6>课程</h6>
            <p>{{ detailInfo.courseName }}</p>
          </div>
          <div class="ass-summary-tag">
            <h6>有效（实考）人数</h6>
            <p>{{ detailInfo.actualCount }}</p>
          </div>
          <div class="ass-summary-tag">
            <h6>考查学院</h6>
            <p>{{ detailInfo.inspectCollege.length }}</p>
          </div>
        </div>
        <div class="ass-summary-nouns">
          <div class="ass-summary-noun">
            <div class="noun-label">开课学院：</div>
            <div class="noun-content">{{ detailInfo.openCollege }}</div>
          </div>
          <div class="ass-summary-noun">
            <div class="noun-label">考查学院：</div>
            <div class="noun-content">
              {{ detailInfo.inspectCollege.join("，") }}
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="ass-part">
      <div class="box-justify mb-2">
        <h3>赋分试算</h3>
      </div>
      <assign-config
        v-if="dataReady"
        ref="AssignConfig"
        class="part-box part-box-pad"
        :detail-info="detailInfo"
        :assign-info="curAssignInfo"
      ></assign-config>
    </div>

    <div class="ass-part">
      <div class="box-justify mb-2">
        <h3>赋分结果预览</h3>
      </div>
      <assign-result
        ref="AssignResult"
        class="part-box part-box-pad"
        :assign-info="assignData"
      ></assign-result>
    </div>
    <div class="ass-part">
      <div class="box-justify mb-2">
        <h3>赋分结果对比预览</h3>
      </div>
      <assign-compare
        ref="AssignCompare"
        class="part-box part-box-pad"
        :assign-info="assignData"
      ></assign-compare>
    </div>
  </div>
</template>

<script>
import { assignmentDetailInfo } from "../api";
import AssignCompare from "../components/assignment/AssignCompare.vue";
import AssignConfig from "../components/assignment/AssignConfig.vue";
import AssignResult from "../components/assignment/AssignResult.vue";

export default {
  name: "assignment-calculate-detail",
  components: {
    AssignConfig,
    AssignResult,
    AssignCompare,
  },
  data() {
    return {
      curAssignInfo: {},
      assignData: {},
      detailInfo: {
        semesterId: "",
        examTypeId: "",
        courseCode: "",
        courseName: "",
        actualCount: "",
        openCollege: "", // 开课学院
        formula: "FORMULA1", // 公式
        coefficient: "", // 系统json
        inspectCollege: [],
      },
      dataReady: false,
    };
  },
  created() {
    this.curAssignInfo = this.$ls.get("curAssignInfo");
    this.assignData = { ...this.curAssignInfo };
    delete this.assignData.courseName;

    this.getData();
  },
  beforeDestroy() {
    this.$ls.remove("curAssignInfo");
  },
  methods: {
    async getData() {
      const res = await assignmentDetailInfo(this.curAssignInfo);
      this.detailInfo = res || {};
      this.dataReady = true;
    },
    toback() {
      this.$router.back();
    },
  },
};
</script>
