<template>
  <el-dialog
    v-dialogDrag
    :visible.sync="visible"
    :close-on-click-modal="false"
    custom-class="upload-dialog"
    :before-close="beforeClosePitentDig"
  >
    <span slot="title">{{ this.$t("trials:subject:title:studyList") }}</span>
    <el-table
      ref="patientStudyList"
      v-loading="loading"
      :data="list"
      stripe
      height="300px"
    >
      <el-table-column type="index" width="40" />
      <!--患者ID-->
      <el-table-column
        prop="PatientIdStr"
        :label="$t('trials:uploadDicomList:table:pId')"
        show-overflow-tooltip
        min-width="140"
        sortable="custom"
      ></el-table-column>
      <!--患者姓名-->
      <el-table-column
        prop="PatientName"
        :label="$t('trials:uploadDicomList:table:patientName')"
        show-overflow-tooltip
        min-width="140"
        sortable="custom"
      ></el-table-column>
      <!--出生日期-->
      <el-table-column
        prop="PatientBirthDate"
        :label="$t('trials:inspection:table:birthdate')"
        show-overflow-tooltip
        min-width="140"
        sortable="custom"
      ></el-table-column>
      <!--性别-->
      <el-table-column
        prop="PatientSex"
        :label="$t('trials:trials-myinfo:form:gender')"
        show-overflow-tooltip
        min-width="140"
        sortable="custom"
      >
        <template slot-scope="scope">
          <span>{{ $fd("sex", scope.row.PatientSex) }}</span>
        </template>
      </el-table-column>
      <!--操作-->
      <el-table-column :label="$t('common:action:action')" width="80">
        <template slot-scope="scope">
          <el-button
            circle
            icon="el-icon-delete"
            :title="$t('trials:subject:patientStudyList:button:delete')"
            @click.stop="remove(scope.row)"
          />
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>
<script>
import { deleteSubjectPatientBinding } from "@/api/inspection.js";
export default {
  name: "patientStudyList",
  props: {
    visible: {
      required: true,
      default: false,
    },
    list: {
      required: true,
      default: () => {
        return [];
      },
    },
    SubjectId: {
      required: true,
      default: "",
    },
  },
  data() {
    return {
      loading: false,
    };
  },
  methods: {
    beforeClosePitentDig() {
      this.$emit("update:visible", false);
    },
    async remove(item) {
      try {
        let confirm = await this.$confirm(
          this.$t("trials:sitesList:message:removeSite"),
          {
            type: "warning",
            distinguishCancelAndClose: true,
            confirmButtonText: this.$t("common:button:confirm"),
            cancelButtonText: this.$t("recompose:button:cancel"),
          }
        );
        if (confirm !== "confirm") return;
        let params = {
          PatientId: item.PatientId,
          SubjectId: this.SubjectId,
          TrialId: this.$route.query.trialId,
        };
        this.loading = true;
        let res = await deleteSubjectPatientBinding(params);
        this.loading = false;
        if (res.IsSuccess) {
          this.$message.success(this.$t("common:message:removeSuccessfully"));
          //   this.$emit("update:visible", false);
          this.$emit("getList");
          let index = this.list.findIndex(
            (i) => i.PatientId === item.PatientId
          );
          let list = [...this.list];
          list.splice(index, 1);
          this.$emit("update:list", list);
        }
      } catch (err) {
        this.btnLoading = false;
        console.log(err);
      }
    },
  },
};
</script>