<template>
  <div class="app-container">
    <evaluation-title
      :title="`${routeParams.evaluationName}/${mxGlobal.TailingClassName(routeParams.className)}/选择学生`"
      :navBackButton="true"
    ></evaluation-title>
    <el-radio-group v-model="isReviewed" @change="getList">
      <el-radio-button
        v-for="item in reviewOptions"
        :key="item.value"
        :label="item.value"
        >{{ item.label }}</el-radio-button
      >
    </el-radio-group>
    <el-card
      v-if="dataList && dataList.length"
      class="box-card"
      style="margin-bottom: 30px"
    >
      <el-row>
        <el-col
          :span="99"
          v-for="(item, idx) in dataList"
          :key="idx"
          class="mb20 mt20 text-center"
        >
          <student-card
            @click.native="detail(item)"
            :name="item.customerName"
            :stateOptions="mxGlobal.MergeEvalInspectionStates(item.stateStr)"
            :state="item.stateStr"
          ></student-card>
        </el-col>
      </el-row>
    </el-card>
    <evaluation-empty v-else />
    <pagination
      v-show="total > queryParams.pageSize"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      :page-size="50"
      @pagination="getList"
    />
  </div>
</template>

<script>
import { getEvaluationStudents } from "@/api/webApi/front";
import transferMixin from '@/components/mx-transfer-mixin'

export default {
  mixins: [transferMixin],
  data() {
    return {
      total: 0,
      dataList: [],
      rules: {},
      routeParams: {},
      queryParams: { pageNum: 1, pageSize: 50 },
      evaluationClassId: "",
      isReviewed: "",
      reviewOptions: [
        { label: "全部", value: "" },
        { label: "未阅卷", value: "0" },
        { label: "已阅卷", value: "1" },
      ],
    };
  },
  created() {
    this.routeParams = this.$route.query;
    this.evaluationClassId = this.routeParams.evaluationClassId;
    this.getList();
  },
  methods: {
    detail(user) {
      const answerData = {
        evaluationClassId: this.evaluationClassId,
        examineeId: user.examineeId,
        studentName: user.customerName,
        className: this.routeParams.className,
      };
      //老师阅卷
      this.transferTo("/evaluating/answer", answerData)
    },
    // 测评班级人员
    getList() {
      this.loading = true;
      getEvaluationStudents({
        evaluationClassId: this.evaluationClassId,
        isReviewed: this.isReviewed,
      }).then((rep) => {
        if (rep.code == 200 || rep.code == 0) {
          this.dataList = rep.data;
        } else {
          this.msgError(rep.msg || "getStudents请求异常");
        }
        this.loading = false;
      });
    },
  },
};
</script>

<style scoped>
.el-col-99 {
  width: 10%;
}
</style>
