<template>
  <div class="app-container">
    <form-search ref="formSearch" :searchformShow="searchFormShow" :validateRules="rules" @handleQuery="handleQuery"></form-search>
    <el-row :gutter="10">
      <el-col class="evaluation-card-wrapper" v-for="(exam, idx) in searchData" :key="idx" :xs="12" :sm="8" :md="8" :lg="6" :xl="6">
        <evaluation-card @click.native="detail(exam)" :title="exam.name" :subTitle="!isSimulateTeacher&&exam.subjectName" :thirdTitle="exam.className" :stateOptions="mxGlobal.MergeEvalInspectionStates(exam.stateStr)" :state="exam.stateStr" :proportion="`${exam.valid}/${exam.total}`"></evaluation-card>
      </el-col>
    </el-row>
    <evaluation-empty v-if="!searchData || !searchData.length" />
    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" :page-size="20" @pagination="getList" />
  </div>
</template>

<script>
import {
  getEvaluationForStat,
  getEvaluationListForStat,
} from "@/api/webApi/front";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      total: 0,
      searchData: [],
      loading: true,
      // 表单参数
      searchFormShow: {},
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 20,
        //
        catalogId: "", // 分类 编码
        classId: "", // 班级
        customerCode: "", // 学生编号
        gradeId: "", // 年级
        subjectId: "", // 科目
        termId: "", // 学期
        typeId: "", // 类型 编码
      },
      rules: {}
    };
  },
  created() {
    this.resolveCatalogId();
    this.setSearchConditions();
    this.$nextTick(()=> {
      this.$refs.formSearch.validate((valid)=>{ if(valid) this.handleQuery() })
    })
  },
  computed: {
    isNonClassMode: function () {
      // 非学校类测评是没有班级的
      return this.queryParams.catalogId != 1
    },
    isSimulateTeacher: function () {
      // 直接定位至详情, 影响LIST请求方法和下级页面跳转
      // isSimulateTeacher之所以能定位至详情, 是因为上一级操作会携带classId
      if (this.$route.query.isSimulateTeacher)
        this.queryParams.classId = this.$route.query.classId
      return this.$route.query.isSimulateTeacher
    },
    isGradeMode: function () {
      return this.isFrontMaster && this.$route.name.includes('/grade-')
    },
    ...mapGetters(["isFrontStudent", "isFrontMaster"]),
  },
  methods: {
    resolveCatalogId() {
      let catalogId = "1";
      const subPaths = this.$route.path.split("/");
      const lastSubPath = subPaths[subPaths.length - 1];
      if (lastSubPath.toLowerCase().indexOf("index_") == 0) {
        const cataPaths = lastSubPath.split("_");
        if (cataPaths.length == 2) catalogId = cataPaths[1];
      }
      this.queryParams.catalogId = catalogId;
    },
    setSearchConditions() {
      const prefixObj = this.isGradeMode ? { studentGradeId: '' } : {}
      switch (this.queryParams.catalogId) {
        case "1":
          this.searchFormShow = { ...prefixObj, userSubject: "", gradeid: "", semester: "", exam: "" }
          break;
        case "3":
          this.searchFormShow = { ...prefixObj, userSubject: '', gradeid: '', exam: '' }
          break
        default:
          this.searchFormShow = { ...prefixObj, userSubject: '' }
          break;
      }
      if (this.isGradeMode) {
        this.rules = {
          studentGradeId: [{
            required: true,
            message: " ",
            trigger: "blur"
          }]
        }
      }
    },
    detail(item) {
      if (item.total == 0) {
        this.msgError('没有数据')
        return
      }

      if (this.isFrontStudent || this.isNonClassMode || this.isSimulateTeacher ||this.isGradeMode) {
        const nextParams = {
          catalogId: this.queryParams.catalogId,
          evaluationId: item.evaluationId,
          evaluationClassId: item.evaluationClassId,
          name: item.name,
          isGradeMode: this.isGradeMode,
          studentGradeId: this.queryParams.studentGradeId,
        }
        if (nextParams.studentGradeId) {
          nextParams.studentGradeName = this.$refs.formSearch.getStudentGradeName(nextParams.studentGradeId)
        }
        this.$router.push({
          path: "/idc/EvaluationDatabase/detailList",
          query: nextParams,
        });
      } else {
        const nextParams = {
          catalogId: this.queryParams.catalogId,
          evaluationId: item.evaluationId,
          name: item.name,
        }
        this.$router.push({
          path: "/idc/EvaluationDatabase/list",
          query: nextParams,
        });
      }
    },
    // 选择图标
    selected(name) {
      this.form.icon = name;
    },
    /** 查询菜单列表 */
    getList() {
      this.loading = true;
      const method = (this.isFrontStudent || this.isSimulateTeacher) && !this.isNonClassMode
        ? getEvaluationForStat
        : getEvaluationListForStat;
      const methodName = (this.isFrontStudent || this.isSimulateTeacher) && !this.isNonClassMode
        ? "getEvaluationForStat"
        : "getEvaluationListForStat";
      method(this.queryParams).then((rep) => {
        console.log(methodName + " rep =", rep);
        if (rep.code == 200 || rep.code == 0) {
          this.searchData = rep.rows;
          this.total = rep.total;
        } else {
          this.msgError(rep.msg || methodName + "请求异常");
        }
        this.loading = false;
      });
    },
    // 表单重置
    reset() {
      this.form = {};
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery(ctrlParams = {}) {
      this.queryParams.pageNum = 1;
      this.queryParams.studentGradeId = ctrlParams.studentGradeId;

      this.queryParams.termId = ctrlParams.semester;
      this.queryParams.typeId = ctrlParams.exam;
      this.queryParams.gradeId = ctrlParams.gradeid;
      this.queryParams.subjectId = ctrlParams.userSubject;
      this.getList();
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
  },
};
</script>
