<template>
  <base-model :config="model_cfg">
    <div slot="dialog-body">
      <div class="top">
        <el-button type="primary" size="small" class="el-icon-upload2">
          <label for="file">
            {{ $t("trials:uploadImage:button:selectFolder") }}
          </label>
        </el-button>
        <input
          type="file"
          name="file"
          id="file"
          ref="file"
          style="display: none"
          webkitdirectory
          multiple
          @change="beginScanFiles($event)"
        />
      </div>
      <el-table
        :data="list"
        border
        style="width: 100%"
        height="300"
        :loading="loading"
      >
        <!--受试者-->
        <el-table-column
          prop="subjectCode"
          :label="$t('trials:uploadImage:table:subjectCode')"
        />
        <!--任务名称-->
        <el-table-column
          prop="taskBlindName"
          :label="$t('trials:uploadImage:table:taskBlindName')"
        />
        <!--原始检查数-->
        <el-table-column
          prop="orginalStudyList"
          :label="$t('trials:uploadImage:table:orginalStudyListNum')"
        >
          <template slot-scope="scope">{{
            scope.row.orginalStudyList.length
          }}</template>
        </el-table-column>
        <!--后处理检查数-->
        <el-table-column
          prop="uploadStudyList"
          :label="$t('trials:uploadImage:table:uploadStudyListNum')"
        >
          <template slot-scope="scope">{{
            scope.row.orginalStudyList.length
          }}</template>
        </el-table-column>
        <!--上传进度-->
        <el-table-column
          prop="schedule"
          :label="$t('trials:uploadImage:table:schedule')"
        >
          <template slot-scope="scope">{{
            scope.row.orginalStudyList.length
          }}</template>
        </el-table-column>
        <!--上传状态-->
        <el-table-column
          prop="status"
          :label="$t('trials:uploadImage:table:status')"
        >
          <template slot-scope="scope">{{
            scope.row.orginalStudyList.length
          }}</template>
        </el-table-column>
        <!--已有/成功/失败-->
        <el-table-column
          prop="scheduleNum"
          :label="$t('trials:uploadImage:table:scheduleNum')"
        >
          <template slot-scope="scope">{{
            scope.row.orginalStudyList.length
          }}</template>
        </el-table-column>
        <el-table-column
          :label="$t('common:action:action')"
          width="250"
          fixed="right"
        >
          <template slot-scope="scope">
            <el-button
              circle
              icon="el-icon-delete"
              :title="$t('trials:uploadImage:button:delete')"
              @click.stop="remove(scope.row, item)"
            />
          </template>
        </el-table-column>
      </el-table>
    </div>
  </base-model>
</template>
<script>
import baseModel from "@/components/BaseModel";
import { getSubjectImageUploadList } from "@/api/load.js";
export default {
  name: "uploadImage",
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    SubjectId: {
      type: String,
      default: "",
    },
    Criterion: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  components: {
    "base-model": baseModel,
  },
  data() {
    return {
      model_cfg: {
        visible: false,
        showClose: true,
        width: "1000px",
        title: this.$t("trials:uploadImage:title:uploadImages"),
        appendToBody: true,
      },
      list: [],
    };
  },
  watch: {
    visible: {
      handler() {
        this.model_cfg.visible = this.visible;
      },
      immediate: true,
      deep: true,
    },
    "model_cfg.visible": {
      handler() {
        this.$emit("update:visible", this.model_cfg.visible);
      },
      deep: true,
    },
  },
  created() {
    this.getList();
  },
  methods: {
    // 获取列表
    async getList() {
      try {
        let params = {
          SubjectId: this.SubjectId,
        };
        this.loading = true;
        let res = await getSubjectImageUploadList(params);
        this.loading = false;
        if (res.IsSuccess) {
          this.list = res.Result;
        }
      } catch (err) {
        console.log(err);
        this.loading = false;
      }
    },
    // 删除
    remove(item) {},
  },
};
</script>
<style lang="scss" scoped>
label {
  cursor: pointer;
}
</style>