<template>
  <div>
    <div class="tw-bg-white tw-p-5 tw-rounded-xl tw-mb-5">
      <a-input v-model:value="curProject.name" disabled style="width: 200px" />
      <span class="tw-mr-4"></span>
      <ProjectCourseSelect
        v-model:value="courseId"
        :projectId="projectId"
        disabled
      />
      <span class="tw-mr-4"></span>
      <PaperTypeSelect v-model:value="paperType" disabled />
      <span class="tw-mr-4"></span>
      <!-- 试卷名称: <a-input disabled :value="paperName" style="width: 120px" />
      <span class="tw-mr-4"></span> -->
      <a-button class="query-btn" @click="search">查询</a-button>

      <div class="tw-float-right">
        <a-button @click="goBack">返回</a-button>
      </div>
    </div>

    <div class="tw-bg-white tw-p-5 tw-rounded-xl">
      <div class="tw-flex tw-items-center tw-justify-between">
        <a-radio-group v-model:value="activeTab">
          <a-radio-button value="6">科目频数分布</a-radio-button>
          <a-radio-button value="1">试卷题目编排</a-radio-button>
          <a-radio-button value="2">试题特征量数</a-radio-button>
          <a-radio-button value="5">试题难度分组分布</a-radio-button>
          <a-radio-button value="3">题型难度分布</a-radio-button>
          <a-radio-button value="4">题型区分度分布</a-radio-button>
        </a-radio-group>

        <a-button
          :type="activeTab === '7' ? 'primary' : 'default'"
          class="tw-mr"
          @click="toViewReport"
          >报告预览</a-button
        >
      </div>

      <a-divider />

      <div v-if="activeTab === '1'">
        <QuestionBianPai :questions="paperQuestions" />
      </div>
      <div v-if="activeTab === '2'">
        <QuestionAttr :questions="paperQuestions" />
      </div>
      <div v-if="activeTab === '3'">
        <QuestionTypeDifficulty
          :projectId="projectId"
          :questions="paperQuestionGroups"
        />
      </div>
      <div v-if="activeTab === '4'">
        <QuestionTypeDiscrimination
          :projectId="projectId"
          :questions="paperQuestionGroups"
        />
      </div>
      <div v-if="activeTab === '5'">
        <QuestionDifficultyGroup
          :questions="paperQuestions"
          :totalScore="paper.totalScore"
          :projectId="projectId"
          :courseId="courseId"
          :paperId="paperId"
          :startScore="startScore"
          :rangeConfig="paper.difficulityRangeConfig"
        />
      </div>
      <div v-if="activeTab === '6'">
        <ScoreRate v-if="courseId" :courseId="courseId" />
      </div>
      <div v-if="activeTab === '7'">
        <PaperReport
          :projectId="projectId"
          viewType="view"
          :paperId="paperId"
          :compareProjectId="compareProjectId"
        />
      </div>
    </div>

    <SelectProject ref="selectProjectRef" @confirm="projectSelected" />
  </div>
</template>

<script setup lang="ts">
import { useMainStore } from "@/store";
import { goBack } from "@/utils/utils";
import { watch, onMounted } from "vue";
import { useRoute } from "vue-router";
// import ProjectSelect from "@/components/ProjectSelect.vue";
import {
  getPaper,
  getPaperQuestionGroups,
  getPaperQuestions,
  getSasPaper,
} from "@/api/paperAnalysisPage";
import { getProjectList } from "@/api/projectManagementPage";
import QuestionBianPai from "./QuestionBianPai.vue";
import QuestionAttr from "./QuestionAttr.vue";
import QuestionDifficultyGroup from "./QuestionDifficultyGroup.vue";
import QuestionTypeDifficulty from "./QuestionTypeDifficulty.vue";
import QuestionTypeDiscrimination from "./QuestionTypeDiscrimination.vue";
import ScoreRate from "../allAnalysis/ScoreRate.vue";
import SelectProject from "./SelectProject.vue";
import PaperReport from "../report/ReportMain.vue";
import { Paper, SASQuestion, SASQuestionGroup, Project } from "@/types";
import { message } from "ant-design-vue";

const store = useMainStore();
store.currentLocation = "项目管理 / 项目列表 / 详情";

let activeTab = $ref("6");

// let rootOrgId = computed(() => {
//   return store.userInfo.rootOrgId;
// });
let courseId = $ref(undefined as unknown as number);
let startScore = $ref(undefined as unknown as number);
let paperType = $ref(undefined as undefined | string);
// let paperName = $ref(undefined as undefined | string);
const route = useRoute();
const projectId = +route.params.projectId;
const paperId = +route.params.paperId;

let paper = $ref<Paper>({} as Paper);
let pageSize = $ref(10);
let pageNo = $ref(1);

let paperQuestions = $ref<SASQuestion[]>([]);
let paperQuestionGroups = $ref<SASQuestionGroup[]>([]);
let curProject = $ref<Project>({} as Project);
let compareProjectId = $ref<number>();
// let sasPaper = $ref<SASPaper>({} as SASPaper);

async function search() {
  pageNo = 1;
  await fetchData();
}

watch(() => [pageNo, pageSize], fetchData);

async function fetchData() {
  const res = await getPaper(paperId);
  // console.log(res);
  paperType = res.data.paperType;
  // paperName = res.data.paperName;
  courseId = res.data.courseId;
  paper = res.data;

  const res2 = await getPaperQuestions(paperId);
  res2.data = res2.data.map((q) => {
    q.difficulityLevel = JSON.parse(
      <string>(<unknown>q.difficulityLevel) || "[]"
    );
    q.difficulityGroupLevel = JSON.parse(
      <string>(<unknown>q.difficulityGroupLevel) || "[]"
    );
    q.avgScore = Math.round(q.avgScore * 100) / 100;
    q.stdev = Math.round(q.stdev * 100) / 100;
    q.coefficient = Math.round(q.coefficient * 100) / 100;
    q.difficulty = Math.round(q.difficulty * 100) / 100;
    q.discrimination = Math.round(q.discrimination * 100) / 100;
    return q;
  });
  paperQuestions = res2.data;

  const res4 = await getSasPaper(paperId);
  res4.data.difficulityLevel = JSON.parse(
    <string>(<unknown>res4.data.difficulityLevel) || "[]"
  );
  res4.data.discriminationLevel = JSON.parse(
    <string>(<unknown>res4.data.discriminationLevel) || "[]"
  );
  startScore = res4.data.startScore || 0;
  // // console.log(res4.data);
  // sasPaper = res4.data;

  const res3 = await getPaperQuestionGroups(projectId, paperId);
  res3.data = res3.data.map((q) => {
    q.difficulityLevel = JSON.parse(
      <string>(<unknown>q.difficulityLevel) || "[]"
    );
    q.discriminationLevel = JSON.parse(
      <string>(<unknown>q.discriminationLevel) || "[]"
    );
    return q;
  });
  res3.data.push(<SASQuestionGroup>(<unknown>res4.data));
  paperQuestionGroups = res3.data;
}

onMounted(async () => {
  await getProject();
  await search();
});

let selectProjectRef = $ref(null);

async function getProject() {
  const res = await getProjectList({
    id: projectId,
    rootOrgId: -1,
    pageNo: 1,
    pageSize: 1,
  });
  curProject = res.data.content[0];
}
function toViewReport() {
  if (curProject && curProject.needCompute) {
    void message.info("有数据更新请重新计算");
    return;
  }
  // @ts-ignore
  // eslint-disable-next-line @typescript-eslint/no-unsafe-call
  selectProjectRef.showModal();
}
function projectSelected(projectId: number) {
  compareProjectId = projectId;
  activeTab = "7";
}
</script>
