<template>
  <div>
    <BaseDialog
      width="400px"
      :isShow.sync="isDialog"
      title="添加学员"
      @close="close"
      :appendToBody="true"
      :confirmStatus="false"
      :isShowFooter="false"
    >
      <div class="content">
        <div class="student">
          <el-button type="primary" size="medium" @click="goGoodsMatching('default')"
            >默认学员</el-button
          >
          <div style="color: #999999; margin-top: 15px;">默认说明：数据来源于“企业管理 - 员工信息”；</div>
        </div>
        <div style="margin-top: 50px">
          <el-button type="primary" size="medium" @click="goGoodsMatching('import')"
            >导入学员</el-button
          >
          <input
            id="importData"
            type="file"
            ref="importData"
            style="display: none"
            accept=".xlsx, .xls"
            @change="handleImport"
          />

          <div class="down" @click="downloadTemplate">下载导入模板</div>
        </div>
      </div>
    </BaseDialog>
  </div>
</template>
    
<script>
export default {
  props: {
    api: {
      type: Function,
      default: () => {},
    },
    id: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      ruleForm: {},
      isDialog: false,
    };
  },

  mounted() {},

  methods: {
    openBoxs(row) {
      this.isDialog = true;
      console.log(row, '--------立即下单---------')
      localStorage.setItem('goodsItem', JSON.stringify(row))
    },
    goGoodsMatching(type) {
      this.$router.push({ name: '/goodsMatching', query: { type: type } })
    },
    clickHandleImport() {
      this.$refs.importData.click();
    },
    // 下载导入模版
    downloadTemplate() {
      let str = "oss/images/file/20240516/1715831007066.xlsx";
      this.$methodsTools.exportData(str, false)
    },
    // 导入操作
    handleImport(e) {
      var file = e.target.files[0];
      if (file === undefined) {
        return;
      }
      const type = file.name.toLowerCase().split(".").splice(-1);
      const fileType = ["xlsx", "xls"].some((item) => item == type);
      if (!fileType) {
        this.$message.error("上传格式需为：.xlsx/.xls");
        e.target.value = "";
        return;
      }
      if (file.size > 0) {
        let formData = new FormData();
        formData.append("file", file);
        if (this.id) formData.append("certificateType", this.id);
        this.api(formData)
          .then((res) => {
            this.$message.success("导入成功！");
            this.isImportDialog = false;
          })
          .finally(() => {
            e.target.value = "";
            this.loading = false;
          });
      }
    },
    close() {},
  },
};
</script>
    
  <style lang="scss" scoped>
.content {
  font-size: 14px;
  text-align: center;

  .student {
    padding: 30px 0 50px;
    border-bottom: 1px dashed #ebebeb;
  }
  .down {
    margin: 10px;
    color: dodgerblue;
    text-decoration: underline;
    &:hover {
      text-decoration: underline;
      // border-bottom: 1px solid #3498db;
    }
    cursor: pointer;
  }
}
</style>
    