<template>
  <div id="otherPlatformsChild">
    <div style="margin-bottom: 20px">
      筛选：
      <el-select
        v-model="formData.trainOrgId"
        placeholder="请选择平台"
        style="margin: 0px 10px"
        size="medium"
        clearable
      >
        <el-option
          v-for="item in orgNameList"
          :key="item.orgId"
          :label="item.orgName"
          :value="item.orgId"
        >
        </el-option>
      </el-select>
      <el-input
        clearable
        style="width: 230px; margin: 5px 10px"
        v-model.trim="formData.name"
        placeholder="学员姓名"
      ></el-input>
      <el-input
        clearable
        style="width: 230px; margin: 5px 10px"
        v-model.trim="formData.idNum"
        placeholder="学员身份证"
      ></el-input>
      <el-input
        clearable
        style="width: 230px; margin: 5px 10px"
        v-model.trim="formData.mobile"
        placeholder="学员手机号码"
      ></el-input>
      <el-button type="primary" @click="search(3)">搜索</el-button>
      <el-button @click="search(2)">重置</el-button>
    </div>
    <table-list
      ref="tableList"
      :tableSets="tableSet"
      :tableData="tableReplace(tableData)"
      :navText="navText"
      :studentTable="true"
      :loading="loading"
    >
      <template slot="customize">
        <el-button size="medium" @click="exportDataAll"
          >导出学员数据</el-button
        >
      </template>
      <!-- <template slot="btn" slot-scope="props">
        <el-button type="text" @click="exportData(props.scope.row)"
          >导出数据</el-button
        >
      </template> -->
    </table-list>
    <pagination
      :total="total"
      :pageSize="formData.pageSize"
      :currentPage="formData.pageNum"
      @handleSizeChange="handleSizeChange"
      @handleCurrentChange="handleCurrentChange"
    />
  </div>
</template>

<script>
import tableList from "@/components/tableList";
import pagination from "@/components/pagination";
import * as baseUrls from "@/utils/request.js";
export default {
  name: "OtherPlatformsChild",
  components: { tableList, pagination },
  data() {
    return {
      loading: false, //当前表单加载是否加载动画
      navText: {
        title: "班级人数：",
        index: 0,
        ch: "位",
        num: false,
        choice: false,
        border: true,
        addHide: true,
        rowKey: "id",
        gftsStatus: false,
        gfUserStatus: false,
        xssbStatus: false,
        tableHide:true,
        backFatherBtn: {
          status: false,
          title: "未定义",
        },
      },
      // 表单
      tableSet: [
        {
          label: "平台",
          prop: "orgName",
          hidden: true,
        },
        {
          label: "项目",
          prop: "platformName",
          hidden: true,
        },
        {
          label: "专业",
          prop: "majorName",
          hidden: true,
        },
        {
          label: "班级",
          prop: "categoryName",
          hidden: true,
        },
        {
          label: "学员",
          prop: "name",
          hidden: true,
        },
        {
          label: "学员身份证",
          prop: "idNum",
          hidden: true,
        },
        {
          label: "学员手机",
          prop: "mobile",
          hidden: true,
        },
        {
          label: "学员单位",
          prop: "orgName",
          hidden: true,
        },
        {
          label: "下单时间",
          prop: "orderTime",
          hidden: true,
        },
        {
          label: "报名时间",
          prop: "periodStatus",
          hidden: true,
        },
        {
          label: "上传报名时间",
          prop: "doTime",
          hidden: true,
        },
        {
          label: "学习开始时间",
          prop: "beginTime",
          hidden: true,
        },
        {
          label: "学习结束时间",
          prop: "applyTime",
          hidden: true,
        },
        {
          label: "是否上传中心",
          prop: "reportStatu",
          hidden: true,
          scope: "isOptions",
          options: [
            {
              label: "是",
              value: 1,
            },
            {
              label: "否",
              value: 0,
            },
          ],
        },
        {
          label: "学时是否申报中心",
          prop: "studyQueueStatus",
          hidden: true,
          scope: "isOptions",
          options: [
            {
              label: "已申报",
              value: 1,
            },
            {
              label: "未申报",
              value: 0,
            },
          ],
        },
      ],

      tableData: [], //表单数据
      formData: {
        pageSize: 10,
        pageNum: 1,
      },
      total: 0,
      orgNameList: [],
    };
  },
  created() {
    this.search();
    //平台列表
    this.$api.inquiresystemoldorglist().then((res) => {
      this.orgNameList = res.data;
    });
  },
  computed:{
    tableReplace:function(){
      return function(array){
        return array.slice((this.formData.pageNum - 1)* this.formData.pageSize,this.formData.pageNum * this.formData.pageSize,)
      }
    }
  },
  methods: {
    search(int) {
      this.loading = true;
      if (int === 2) {
        this.formData = {
          pageSize: 10,
          pageNum: 1,
        };
      }
      if (int === 3) {
        this.$refs.tableList.clearMoreActive();
        this.formData.pageSize = 10;
        this.formData.pageNum = 1;
      }
      this.formData.gradeId = this.$route.query.id;
      this.$api
        .inquireGradegradeotherClassuser(this.formData)
        .then((res) => {
          this.tableData = res.data;
          this.navText.index = res.data.length;
          this.total = res.data.length;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    //导出
    exportData(item) {
      this.$api.inquireGradegradeotherClassuserexport(item).then((res) => {
        if (res.msg) {
          let url = baseUrls.baseURL + "common/download?fileName=" + res.msg;
          let link = document.createElement("a");
          let fileName = "班级学员数据" + ".xlsx";
          document.body.appendChild(link);
          link.href = url;
          link.dowmload = fileName;
          link.click();
          link.remove();
          this.$message.success("导出成功");
        } else {
          this.$message.error("导出失败");
        }
      });
    },
    exportDataAll(){
      this.$api.inquireGradegradeotherClassuserexport(this.formData).then((res) => {
        if (res.msg) {
          let url = baseUrls.baseURL + "common/download?fileName=" + res.msg;
          let link = document.createElement("a");
          let fileName = "班级学员数据" + ".xlsx";
          document.body.appendChild(link);
          link.href = url;
          link.dowmload = fileName;
          link.click();
          link.remove();
          this.$message.success("导出成功");
        } else {
          this.$message.error("导出失败");
        }
      });
    },
    handleSizeChange(v) {
      this.formData.pageSize = v;
      this.formData.pageNum = 1;
      // this.search();
    },
    handleCurrentChange(v) {
      this.formData.pageNum = v;
      // this.search();
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
