<template>
  <div>
    <h2>序列码导入</h2>
    <hr>
    <div class="alert alert-primary">
    从文本文件导入序列码，格式：每行一个序列码。
    </div>
    <input class="form-control" type="file" ref="file"/>
    <div class="my-4">
      <div class="alert alert-info" v-if="message" id="alert-div">
        {{ message }}
      </div>
      <div class="my-2">
        <button class="btn btn-primary" @click="do_import" id="import-btn">导入</button>
        <button class="btn btn-secondary mx-2" @click="$router.go(-1)" id="return-btn">返回</button>
      </div>
    </div>
  </div>
  <JobModal ref="jobmodal" />
</template>

<script>
import JobModal from '../components/job-modal';

export default {
  name: 'CodeBatchImport',
  props: ['id'],
  components: {
    JobModal,
  },
  data: function () {
    return {
      data: '',
      message: null,
    };
  },
  computed: {
  },
  methods: {
    do_import: async function() {
      var fs = this.$refs.file.files;
      if (!fs || !fs.length) {
        this.message = "请选择文件";
        return;
      }
      var fd = new FormData();
      fd.append('file', fs[0]);
      fd.append('batch', this.id);
      var r = await this.$root.api_post("/api/v1/import-code/", fd);
      this.$refs.jobmodal.show(r.data.job);
    },
  },
  mounted() {
  },
}
</script>

<style scoped>
</style>

