<template>
  <div class="cjfx_jstj">
    <NavHeader />
    <bread-crumb />

    <div class="w-1200px m-auto flex flex-row justify-between">
      <div class="w-188px">
        <leftSider :ykjId="ykjId" :activeIndex="activeIndex"  @parentClick="parentClick"/>
      </div>

      <div class="w-1012px p-4 blueBg">

        <div class="w-full py-8 marstReview">
          <div class="normalTit">
            <span>整体成绩分析</span>
          </div>

          <el-table :data="tableDataZtcjfx" style="width: 100%">
            <el-table-column prop="mx" label="满分" show-overflow-tooltip />
            <el-table-column prop="pjf" label="平均分" width="120" />
            <el-table-column prop="ykrs" label="应考人数" />
            <el-table-column prop="skrs" label="实考人数" />
            <el-table-column prop="nd" label="难度" />
            <el-table-column prop="qfd" label="区分度"/>
            <el-table-column prop="bzc" label="标准差" />
            <el-table-column prop="qkrs" label="缺考人数" />
            <el-table-column prop="zgf" label="最高分" />
            <el-table-column prop="zdf" label="最低分" />
            <el-table-column prop="gfzjf" label="高分组均分" width="100" />
            <el-table-column prop="zfzjf" label="中分组均分" width="100" />
            <el-table-column prop="dfzjf" label="低分组均分" width="100" />
          </el-table>
        </div>

        <div class="flex mt-20px items-center">

          <el-select class="mr-10px" v-model="normal_school" placeholder="请选择学校" size="large">
            <el-option label="全部" value="0" />
            <el-option v-for="item in school_list" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>

          <el-select class="mr-10px" v-model="normal_classroom" placeholder="请选择班级" size="large">
            <el-option label="全部" value="0" />
            <el-option v-for="item in classroom_list" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>

          <el-select class="mr-10px" v-model="normal_subject" placeholder="请选择学科" size="large">
            <el-option label="全部" value="0" />
            <el-option v-for="item in subject_list" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>

        </div>
        <div class="flex justify-between mt-4 exportBtn">
          <div>
            <el-button color="#003eee" type="primary" size="large">导出</el-button>
          </div>

        </div>

        <div class="h-auto mt-20px">
          <div class="normalTit">
            <span>题目分析</span>
          </div>

          <el-table :data="tableDataTmfx" style="width: 100%">
            <el-table-column prop="tm" label="题目" />
            <el-table-column prop="tmlx" label="题目类型" />
            <el-table-column prop="mf" label="满分" />
            <el-table-column prop="pjf" label="平均分" />
            <el-table-column prop="nd" label="难度" />
            <el-table-column prop="qfd" label="区分度"  />
            <el-table-column prop="bzc" label="标准差" />
            <el-table-column prop="gfzjf" label="高分组均分" />
            <el-table-column prop="zdzjf" label="中等组均分" />
            <el-table-column prop="dfzjf" label="低分组均分" />
          </el-table>

        </div>

        <div class="h-auto mt-20px ">
          <div class="normalTit">
            <span>整体成绩分析</span>
          </div>
          <el-table :data="tableData" style="width: 100%">
            <el-table-column prop="xm" label="姓名" show-overflow-tooltip width="100" />
            <el-table-column prop="xh" label="学号" show-overflow-tooltip width="100" />
            <el-table-column prop="bj" label="班级" show-overflow-tooltip width="100" />
            <el-table-column prop="zf" label="总分" />
            <el-table-column prop="fir_0" label="1" />
            <el-table-column prop="fir_1" label="2"  />
            <el-table-column prop="fir_2" label="17-19" />
            <el-table-column prop="sec_0" label="1" />
            <el-table-column prop="sec_1" label="2"  />
            <el-table-column prop="sec_2" label="17-19" />
            <el-table-column prop="thr_0" label="1" />
            <el-table-column prop="thr_1" label="2"  />
            <el-table-column prop="thr_2" label="17-19" />

          </el-table>

        </div>

      </div>

    </div>

    <commonFooter />
  </div>
</template>
<route lang="json">
{
  "meta": {
    "title": "考试分析",
    "breadcrumb": true
  }
}
</route>
<script lang="ts" setup>
import {normalSchool_list,normalSubject_list,normalClassroom_list,cjfx_ztfx_list } from '../apiItem';
import { useRouter } from "vue-router";
const router = useRouter();
const route = useRoute();

let normal_subject = $ref("");
let normal_school = $ref("");
let normal_classroom = $ref("");

let subject_list = [{
  value: '1',
  label: '语文'
}, {
  value: '2',
  label: '数学'
}]

let school_list = [{
  value: '1',
  label: '学校1'
}, {
  value: '2',
  label: '学校2'
}]

let classroom_list = [{
  value: '1',
  label: '英语'
}, {
  value: '2',
  label: '体育'
}, {
  value: '3',
  label: '音乐'
}
];




const activeIndex =ref('2-1');
const ykjId = ref();
const parentClick = (val) => {
  activeIndex.value = val;
  ykjId.value = route.params.ykj_id;
}

const tableDataZtcjfx = ref([]);


const tableDataTmfx = ref()
// [
//   {
//     tm:1,
//     tmlx:"单选",
//     mf:23,
//     pjf:12,
//     nd:0.54,
//     qfd:0.54,
//     bzc:0.54,
//     gfzjf:0.13,
//     zdzjf:0.13,
//     dfzjf:0.13,
//   },
//   {
//     tm:1,
//     tmlx:"多选",
//     mf:23,
//     pjf:12,
//     nd:0.54,
//     qfd:0.54,
//     bzc:0.54,
//     gfzjf:0.13,
//     zdzjf:0.13,
//     dfzjf:0.13,
//   },
//   {
//     tm:1,
//     tmlx:"主观题",
//     mf:23,
//     pjf:12,
//     nd:0.54,
//     qfd:0.54,
//     bzc:0.54,
//     gfzjf:0.13,
//     zdzjf:0.13,
//     dfzjf:0.13,
//   },

// ];


const tableData = ref();
ykjId.value = route.params.ykj_id;
onMounted(() => {
  initData()
})

const initData = () => {
  let transObj = {
    xueke_id: '',
    grade_id: '',
    school_id:''
  }
  cjfx_ztfx_list(transObj)
    .then(res => {
      if (res.code == "1") {
        tableDataZtcjfx.value = res.data.data.tableDataZtcjfx;
        tableDataTmfx.value = res.data.data.tableDataTmfx;
        tableData.value = res.data.data.tableData;
      }
    })
  .catch(error=>{console.log(error)})
}

</script>


<style lang="scss" scoped>
@import '@/styles/ksfx.css';

</style>
