<template>
  <div>
    <!--内容-->
    <Modal v-model="showModal" :width="100" @on-visible-change="_visibleChange" class="modal-footer-none modal-top-0">
      <p slot="header">{{modalTitle}}</p>
      <div>
        <el-tabs v-model="activeName" @tab-click="_changeTabs">
          <el-tab-pane label="汇总报告台账" name="summary">
            <SummaryInfo ref="summaryTabs"></SummaryInfo>
          </el-tab-pane>
        </el-tabs>
      </div>
    </Modal>
  </div>
</template>
<script>
import SummaryInfo from './SummaryInfo'

export default {
  components: {
    SummaryInfo
  },
  data() {
    return {
      showModal: false,
      modalTitle: '',
      activeName: '',
      contractId: '',
      entrustId: '',
      type: '',
      personal: ''
    }
  },
  computed: {
    tableHeight: function() {
      return document.documentElement.clientHeight - 135
    }
  },
  methods: {
    _open(entrustId) {
      this.modalTitle = '查看汇总报告'
      this.showModal = true
      this.activeName = 'summary'
      this.entrustId = entrustId
      this.$refs.summaryTabs._open(this.entrustId)
    },
    _report() {
      this.$refs.reportTabs._open(this.entrustId)
    },
    _sample() {
      console.log(this.entrustId)
      this.$refs.sampleTabs._open(this.entrustId)
    },
    _summary() {
      this.$refs.summaryTabs._open(this.entrustId)
    },
    _changeTabs(tab, event) {
      switch (tab.name) {
        case 'sample':
          this._sample()
          break
        case 'report':
          this._report()
          break
        case 'summary':
          this._summary()
          break
      }
    },
    _visibleChange() {
      this.$emit('on-result-change')
    }
  }
}
</script>
