<template>
  <el-dialog title="详情" v-dialogDrag ref="diaFrom" :close-on-click-modal="false" :visible.sync="detailStatus"
    width="90%" top="10px" :before-close="cancel">
    <el-row style="padding:20px 0">
      <el-col :span="12">
        <label>档案盒编号：</label>
        <el-input v-model="detailRow.labelId" clearable size="small" style="width:50%" disabled></el-input>
      </el-col>
      <el-col :span="12" v-if="itemName">
        <label>项目名称：</label>
        <span style="line-height: 32px">{{itemName}}</span>
      </el-col>
    </el-row>
    <el-table :data='tableData' border tooltip-effect="dark" key="table-1">
      <el-table-column show-overflow-tooltip align="center" prop="caseNo" label="盒号" width="150"></el-table-column>
      <el-table-column v-if="detailRow.boxType===2" show-overflow-tooltip width="250" prop="archiveNo" label="案卷级档号"
        align="center">
      </el-table-column>
      <el-table-column v-if="detailRow.boxType===1" show-overflow-tooltip width="250" prop="archiveNo" label="档号"
        align="center">
      </el-table-column>
      <el-table-column show-overflow-tooltip align="center" prop="maintitle" label="题名"></el-table-column>
      <el-table-column show-overflow-tooltip align="center" prop="retention" width="150" label="保管期限"></el-table-column>
      <el-table-column show-overflow-tooltip align="center" prop="filingYear" width="150" label="年度"></el-table-column>
      <el-table-column align="center" label="操作" width="150">
        <template slot-scope="scope">
          <el-button @click="delectFile(scope.row)" type="text" style="color:#FF4949">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div v-if="detailRow.boxType===2 && tableDataTwo.length" size="mini" style="padding:10px 0">
      <el-table :data='tableDataTwo' border tooltip-effect="dark" key="table-2">
        <el-table-column show-overflow-tooltip prop="folder_no" label="案卷级档号" width="250" align="center">
        </el-table-column>
        <el-table-column show-overflow-tooltip width="250" prop="archive_no" label="文件级档号" align="center">
        </el-table-column>
        <el-table-column show-overflow-tooltip align="center" prop="maintitle" label="题名"></el-table-column>
        <el-table-column show-overflow-tooltip align="center" prop="retention" width="120" label="保管期限"></el-table-column>
        <el-table-column show-overflow-tooltip align="center" prop="filing_year" label="年度" width="100"></el-table-column>
        <el-table-column show-overflow-tooltip align="center" prop="archive_ctg_no" label="机构"></el-table-column>
      </el-table>
    </div>
  </el-dialog>
</template>
<script>
  export default {
    props: {
      itemName: {
        type: String,
        default: () => '',
      },
      tableData: {
        type: Array,
        default: () => [],
      },
      tableDataTwo: {
        type: Array,
        default: () => [],
      },
      detailRow: {
        type: Object,
        default: () => {},
      },
      detailStatus: {
        type: Boolean,
        default: () => false,
      }
    },
    data() {
      return {}
    },
    methods: {
      cancel() {
        this.$emit('cancel')
      },
      delectFile(row) {
        let data = {
          boxId: this.detailRow.id,
          fileBoxArchiveId: row.id,
          labelId: row.labelId,
        }
        this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$store.dispatch('fileBoxManagement/detailDelete', data).then(res => {
            this.$emit('detail', this.detailRow)
            this.$emit('getData')
          })
        }).catch(() => {});
      }
    }
  }

</script>
