<template>
  <div class="exam_plan_kw_hz pg-main">
    <div class="pg-title">
      <span>查询统计</span>
    </div>
    <div class="pg-select-infos">
      <Form ref="kj_progress_queryform_one" :label-width="80" inline>
        <Row>
          <Col span="12">
            <FormItem label="考试任务" style="width: 80%">
              <Select @on-change="selectExam" v-model="query.examCode">
                <Option value="">全部</Option>
                <Option
                  v-for="item in xldata.examCodeList"
                  :value="item.examCode"
                  :key="item.examCode"
                  >{{ item.name }}</Option
                >
              </Select>
            </FormItem>
          </Col>
          <Col span="12">
            <FormItem label="请选择批次" style="width: 80%">
              <Select v-model="query.batchId">
                <Option value="">全部</Option>
                <Option
                  v-for="item in xldata.batchs"
                  :value="item.value"
                  :key="item.value"
                  >{{ item.name }}</Option
                >
              </Select>
            </FormItem>
          </Col>
          <Col span="12">
            <FormItem label="考点" style="width: 80%">
              <Select @on-change="selectPlace" v-model="query.placeCode">
                <Option value="">全部</Option>
                <Option
                  v-for="item in xldata.placeCodeList"
                  :value="item.value"
                  :key="item.value"
                  >{{ item.name }}</Option
                >
              </Select>
            </FormItem>
          </Col>
          <Col span="12">
            <FormItem label="考场" style="width: 80%">
              <Select v-model="query.roomCode">
                <Option value="">全部</Option>
                <Option
                  v-for="item in xldata.roomCodeList"
                  :value="item.value"
                  :key="item.value"
                  >{{ item.name }}</Option
                >
              </Select>
            </FormItem>
          </Col>
          <Col span="12">
            <FormItem label="考点名称" style="width: 80%">
              <Input
                v-model="query.placeName"
                placeholder="考点名称模糊查询"
              ></Input>
            </FormItem>
          </Col>
          <Col span="8">
            <FormItem style="width: 100%">
              <Button @click="doQuery" type="primary" icon="md-search"
                >查询</Button
              >
              <Button
                @click="exportData"
                :loading="loading"
                type="primary"
                icon="md-document"
                >导出统计报表</Button
              >
            </FormItem>
          </Col>
        </Row>
      </Form>
    </div>
    <Tabs type="card" v-model="active_tab">
      <TabPane label="情况统计" name="situation">
        <Table
          ref="situation_table"
          :columns="columns.situation"
          :data="list.situation.list"
        ></Table>
        <h4 class="table-tip-info">
          共计应考{{ list.situation.total.full || 0 }}人，实考{{
            list.situation.total.real || 0
          }}人，缺考{{ list.situation.total.absent || 0 }}人
        </h4>
        <Page
          placement="top"
          :current="query.situation.pageNo"
          :loading="true"
          :page-size="query.situation.pageSize"
          :total="query.situation.totalElements"
          show-total
          show-sizer
          @on-change="changesituationPageNo"
          @on-page-size-change="changesituationPageSize"
        ></Page>
      </TabPane>
      <TabPane label="缺考名单" name="absent" ref="absent_tab">
        <Table
          ref="absent_table"
          :columns="columns.absent"
          :data="list.absent"
        ></Table>
        <Page
          placement="top"
          :current="query.absent.pageNo"
          :loading="true"
          :page-size="query.absent.pageSize"
          :total="query.absent.totalElements"
          show-total
          show-sizer
          @on-change="changeabsentPageNo"
          @on-page-size-change="changeabsentPageSize"
        ></Page>
      </TabPane>
      <TabPane label="异常处理明细" name="abort">
        <Table
          ref="abort_table"
          :columns="columns.abort"
          :data="list.abort"
        ></Table>
        <Page
          placement="top"
          :current="query.abort.pageNo"
          :loading="true"
          :page-size="query.abort.pageSize"
          :total="query.abort.totalElements"
          show-total
          show-sizer
          @on-change="changeabortPageNo"
          @on-page-size-change="changeabortPageSize"
        ></Page>
      </TabPane>
      <TabPane label="重考处理明细" name="repeat">
        <Table
          ref="repeat_table"
          :columns="columns.repeat"
          :data="list.repeat"
        ></Table>
        <Page
          placement="top"
          :current="query.repeat.pageNo"
          :loading="true"
          :page-size="query.repeat.pageSize"
          :total="query.repeat.totalElements"
          show-sizer
          @on-change="changerepeatPageNo"
          @on-page-size-change="changerepeatPageSize"
        ></Page>
      </TabPane>
      <TabPane label="违纪名单" name="cheat">
        <Table
          ref="cheat_table"
          :columns="columns.cheat"
          :data="list.cheat"
        ></Table>
        <Page
          placement="top"
          :current="query.cheat.pageNo"
          :loading="true"
          :page-size="query.cheat.pageSize"
          :total="query.cheat.totalElements"
          show-total
          show-sizer
          @on-change="changecheatPageNo"
          @on-page-size-change="changecheatPageSize"
        ></Page>
      </TabPane>
    </Tabs>
  </div>
</template>

<script>
import { axios, baseUrl } from "../../libs/http";
import expandRow from "./exam-abort-table-expand.vue";
import util from "../../libs/util";

export default {
  // eslint-disable-next-line vue/no-unused-components
  components: { expandRow },
  name: "exam_plan_kw_hz",
  data() {
    return {
      active_tab: "situation",
      xldata: {
        batchs: [],
        examCodeList: [],
        placeCodeList: [],
        roomCodeList: [],
      },
      query: {
        examCode: null,
        batchId: null,
        placeName: null,
        situation: {
          pageNo: 1,
          pageSize: 10,
          totalElements: 0,
          totalPages: 0,
        },
        absent: {
          pageNo: 1,
          pageSize: 10,
          totalElements: 0,
          totalPages: 0,
        },
        abort: {
          pageNo: 1,
          pageSize: 10,
          totalElements: 0,
          totalPages: 0,
        },
        cheat: {
          pageNo: 1,
          pageSize: 10,
          totalElements: 0,
          totalPages: 0,
        },
        repeat: {
          pageNo: 1,
          pageSize: 10,
          totalElements: 0,
          totalPages: 0,
        },
      },
      columns: {
        situation: [
          {
            type: "index_seq",
            title: "序号",
            width: 80,
            render: (h, params) => {
              let index =
                (this.query.situation.pageNo - 1) *
                  this.query.situation.pageSize +
                params.index +
                1;
              return h("span", index);
            },
          },
          {
            title: "批次",
            key: "batchName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "场次",
            key: "stageId",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点代码",
            key: "placeCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点名称",
            key: "placeName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场代码",
            key: "roomCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场名称",
            key: "roomName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "应考(考次)",
            key: "fullStudentNum",
            width: 150,
            align: "center",
          },
          {
            title: "实考",
            key: "realityStudentNum",
            width: 150,
            align: "center",
          },
          {
            title: "缺考",
            width: 150,
            key: "absentStudentNum",
            align: "center",
          },
        ],
        absent: [
          {
            type: "index_seq",
            title: "序号",
            align: "center",
            width: 65,
            render: (h, params) => {
              let index =
                (this.query["absent"].pageNo - 1) *
                  this.query["absent"].pageSize +
                params.index +
                1;
              return h("span", index);
            },
          },
          {
            title: "批次",
            key: "batchName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "场次",
            key: "stageId",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点代码",
            key: "placeCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点名称",
            key: "placeName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场代码",
            key: "roomCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场名称",
            key: "roomName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "准考证号",
            key: "ticketNo",
            minWidth: 150,
            align: "center",
          },
          {
            title: "姓名",
            key: "name",
            minWidth: 150,
            align: "center",
          },
          {
            title: "科目(科目代码)",
            key: "name",
            minWidth: 150,
            align: "center",
            render: (h, params) => {
              let a = params.row.courseName + "(" + params.row.courseCode + ")";
              return h("span", a);
            },
          },
        ],
        abort: [
          {
            type: "expand",
            width: 50,
            render: (h, params) => {
              return h(expandRow, {
                props: {
                  aborts: params.row.aborts,
                },
              });
            },
          },
          {
            type: "index_seq",
            title: "序号",
            align: "center",
            width: 80,
            render: (h, params) => {
              let b =
                (this.query["abort"].pageNo - 1) *
                  this.query["abort"].pageSize +
                params.index +
                1;
              return h("span", b);
            },
          },
          {
            title: "批次",
            key: "batchName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "场次",
            key: "stageId",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点代码",
            key: "placeCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点名称",
            key: "placeName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场代码",
            key: "roomCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场名称",
            key: "roomName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "准考证号",
            key: "ticketNo",
            minWidth: 150,
            align: "center",
          },
          {
            title: "姓名",
            key: "name",
            minWidth: 150,
            align: "center",
          },
          {
            title: "科目(科目代码)",
            key: "name",
            minWidth: 150,
            align: "center",
            render: (h, params) => {
              let c = params.row.courseName + "(" + params.row.courseCode + ")";
              return h("span", c);
            },
          },
        ],
        repeat: [
          {
            type: "index_seq",
            title: "序号",
            align: "center",
            width: 80,
            render: (h, params) => {
              let a =
                (this.query["repeat"].pageNo - 1) *
                  this.query["repeat"].pageSize +
                params.index +
                1;
              return h("span", a);
            },
          },
          {
            title: "批次",
            key: "batchName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "场次",
            key: "stageId",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点代码",
            key: "placeCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点名称",
            key: "placeName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场代码",
            key: "roomCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场名称",
            key: "roomName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "准考证号",
            key: "ticketNo",
            minWidth: 150,
            align: "center",
          },
          {
            title: "姓名",
            key: "name",
            minWidth: 150,
            align: "center",
          },
          {
            title: "科目(科目代码)",
            key: "name",
            minWidth: 150,
            align: "center",
            render: (h, params) => {
              let m = params.row.courseName + "(" + params.row.courseCode + ")";
              return h("span", m);
            },
          },
          {
            title: "重考批次",
            key: "newBatchName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "重考场次",
            key: "newStageId",
            minWidth: 150,
            align: "center",
          },
          {
            title: "重考理由",
            key: "remark",
            minWidth: 150,
            maxWidth: 300,
            align: "center",
          },
          {
            title: "处理时间",
            key: "time",
            width: 200,
            align: "center",
            render: (h, params) => {
              if (params.row.time) {
                return h("span", util.dateFormat(params.row.time));
              } else {
                return h("span", "");
              }
            },
          },
        ],
        cheat: [
          {
            type: "index_seq",
            title: "序号",
            align: "center",
            width: 80,
            render: (h, params) => {
              let c =
                (this.query["cheat"].pageNo - 1) *
                  this.query["cheat"].pageSize +
                params.index +
                1;
              return h("span", c);
            },
          },
          {
            title: "批次",
            key: "batchName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "场次",
            key: "stageId",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点代码",
            key: "placeCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考点名称",
            key: "placeName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场代码",
            key: "roomCode",
            minWidth: 150,
            align: "center",
          },
          {
            title: "考场名称",
            key: "roomName",
            minWidth: 150,
            align: "center",
          },
          {
            title: "准考证号",
            key: "ticketNo",
            minWidth: 150,
            align: "center",
          },
          {
            title: "姓名",
            key: "name",
            minWidth: 150,
            align: "center",
          },
          {
            title: "科目(科目代码)",
            key: "name",
            minWidth: 150,
            align: "center",
            render: (h, params) => {
              let c = params.row.courseName + "(" + params.row.courseCode + ")";
              return h("span", c);
            },
          },
          {
            title: "违纪操作",
            key: "remark",
            minWidth: 150,
            align: "center",
          },
          {
            title: "操作时间",
            key: "time",
            width: 200,
            align: "center",
            render: (h, params) => {
              if (params.row.time) {
                return h("span", util.dateFormat(params.row.time));
              } else {
                return h("span", "");
              }
            },
          },
        ],
      },
      list: {
        situation: {
          list: [],
          total: {},
        },
        absent: [],
        abort: [],
        cheat: [],
        repeat: [],
      },
      loading: false,
    };
  },
  created() {
    let a = this.query.examCode;
    this.xldata.examCodeList = [];
    axios.post("/system/kj/hz/getPlans", {}).then((response) => {
      let data = response.data.data;
      if (data) {
        this.xldata.examCodeList = data;
        this.query.examCode = a;
      }
    });
  },
  methods: {
    selectPlace() {
      if (this.query.placeCode && this.query.placeCode.length > 0) {
        axios
          .post("/system/kj/hz/getRoomByPlaceCode", this.query)
          .then((response) => {
            let data = response.data.data;
            if (data) {
              this.query.roomCode = null;
              this.xldata.roomCodeList = [];
              this.xldata.roomCodeList = data;
            }
          });
      } else {
        this.xldata.roomCodeList = [];
      }
    },
    selectExam() {
      if (this.query.examCode && this.query.examCode.length > 0) {
        axios
          .post("/system/examPlan/findBatch", { examCode: this.query.examCode })
          .then((response) => {
            let data = response.data.data;
            if (data) {
              this.xldata.batchs = data;
            }
          });
        axios
          .post("/system/kj/hz/getPlaceByExamCode", this.query)
          .then((response) => {
            let data = response.data.data;
            if (data) {
              this.xldata.placeCodeList = data;
            }
          });
      }
    },
    loadtab(tab) {
      if (!tab) {
        return;
      }
      if (tab == "situation") {
        this.query.situation.pageNo = 1;
        this.loadSituation();
      }
      if (tab == "absent") {
        this.query.absent.pageNo = 1;
        this.load("absent");
      }
      if (tab == "cheat") {
        this.query.cheat.pageNo = 1;
        this.load("cheat");
      }
      if (tab == "abort") {
        this.query.abort.pageNo = 1;
        this.load("abort");
      }
      if (tab == "repeat") {
        this.query.repeat.pageNo = 1;
        this.load("repeat");
      }
    },
    exportData() {
      if (!this.query.examCode) {
        this.$Notice.error({
          title: "系统提示",
          desc: "<p>请先选择一个考试任务</p>",
        });
        return false;
      }
      if (this.loading) return;
      this.loading = true;
      let url =
        baseUrl +
        "/system/kwhz/export?examCode=" +
        this.query.examCode +
        "&A-P-T_v_auth=" +
        localStorage.encryptToken;
      axios({
        method: "post",
        url: url, // 请求地址
        data: {}, // 参数
        responseType: "blob", // 表明返回服务器返回的数据类型
        timeout: 30 * 60 * 1000,
      })
        .then((res) => {
          this.loading = false;
          // 处理返回的文件流
          let content = res.data;
          let blob = new Blob([content]);
          let fileName = "考务数据汇总.xlsx";
          if ("download" in document.createElement("a")) {
            let elink = document.createElement("a");
            elink.download = fileName;
            elink.style.display = "none";
            elink.href = URL.createObjectURL(blob);
            document.body.appendChild(elink);
            elink.click();
            URL.revokeObjectURL(elink.href); // 释放URL 对象
            document.body.removeChild(elink);
          } else {
            navigator.msSaveBlob(blob, fileName);
          }
        })
        .catch(() => {
          this.loading = false;
        });
    },
    loadSituation() {
      this.list.situation.list = [];
      this.query["situation"].totalElements = 0;
      this.query["situation"].totalPages = 0;
      this.list.situation.total = 0;
      axios
        .post("/system/kwhz/normal_utest/countStuats", {
          examCode: this.query.examCode,
          batchId: this.query.batchId,
          placeCode: this.query.placeCode,
          placeName: this.query.placeName,
          roomCode: this.query.roomCode,
          pageNo: this.query["situation"].pageNo,
          pageSize: this.query["situation"].pageSize,
        })
        .then((response) => {
          let data = response.data.data;
          if (data) {
            this.list.situation.list = data.list.content || [];
            this.query["situation"].totalElements = data.list.totalElements;
            this.query["situation"].totalPages = data.list.totalPages;
            this.list.situation.total = data.total;
          }
        });
    },
    load(type) {
      this.list[type] = [];
      this.query[type].totalElements = 0;
      this.query[type].totalPages = 0;
      axios
        .post("/system/kwhz/details", {
          examCode: this.query.examCode,
          batchId: this.query.batchId,
          placeCode: this.query.placeCode,
          roomCode: this.query.roomCode,
          placeName: this.query.placeName,
          condition: type,
          pageNo: this.query[type].pageNo,
          pageSize: this.query[type].pageSize,
        })
        .then((response) => {
          let data = response.data.data;
          if (data) {
            this.list[type] = data.content || [];
            this.query[type].totalElements = data.totalElements;
            this.query[type].totalPages = data.totalPages;
          }
        });
    },
    doQuery() {
      if (!this.query.examCode) {
        this.$Notice.error({
          title: "系统提示",
          desc: "<p>请先选择一个考试任务</p>",
        });
        return false;
      }
      this.loadtab("situation");
      this.loadtab("cheat");
      this.loadtab("abort");
      this.loadtab("absent");
      this.loadtab("repeat");
    },
    changeabsentPageNo(p) {
      //切换页码
      this.query.absent.pageNo = p;
      this.load("absent");
    },
    changeabsentPageSize(pageSize) {
      //切换每一页显示多少条
      if (this.query.examCode) {
        this.query.absent.pageSize = pageSize;
        this.load("absent");
      }
    },
    changesituationPageNo(p) {
      //切换页码
      this.query.situation.pageNo = p;
      this.loadSituation();
    },
    changesituationPageSize(pageSize) {
      //切换每一页显示多少条
      if (this.query.examCode) {
        this.query.situation.pageSize = pageSize;
        this.loadSituation();
      }
    },
    changeabortPageNo(p) {
      //切换页码
      this.query.abort.pageNo = p;
      this.load("abort");
    },
    changeabortPageSize(pageSize) {
      //切换每一页显示多少条
      if (this.query.examCode) {
        this.query.abort.pageSize = pageSize;
        this.load("abort");
      }
    },
    changecheatPageNo(p) {
      //切换页码
      this.query.cheat.pageNo = p;
      this.load("cheat");
    },
    changecheatPageSize(pageSize) {
      //切换每一页显示多少条
      if (this.query.examCode) {
        this.query.cheat.pageSize = pageSize;
        this.load("cheat");
      }
    },
    changerepeatPageNo(p) {
      //切换页码
      this.query.abort.pageNo = p;
      this.load("repeat");
    },
    changerepeatPageSize(pageSize) {
      //切换每一页显示多少条
      if (this.query.examCode) {
        this.query.abort.pageSize = pageSize;
        this.load("repeat");
      }
    },
  },
};
</script>
