<template>
  <div style="margin-top:20px">
    <external-transition :isCollapse="true" :title="title" ref="dataTable">
      <template slot="transition">
        <data-table :span-method="objectSpanMethod"
                    :columns='columns'
                    :showPage="false"
                    :sourceData="tableData">
          <template slot="feedbackQuestionContent" slot-scope="scope">
            <span-plus :index="scope.data.$index" :text="scope.data.row.feedbackQuestionContent"></span-plus>
          </template>
          <template slot="replyLawContent" slot-scope="scope">
            <span-plus :index="scope.data.$index" :text="scope.data.row.replyLawContent"></span-plus>
          </template>
          <template slot="practicableSuggestion" slot-scope="scope">
            <span-plus :index="scope.data.$index" :text="scope.data.row.practicableSuggestion"></span-plus>
          </template>
           <template slot="supplementNoFile" slot-scope="scope">
            <span-plus :index="scope.data.$index" :text="scope.data.row.supplementNoFile"></span-plus>
          </template>
          <template slot="relationResolution" slot-scope="scope">
            <span-plus :index="scope.data.$index" :text="scope.data.row.relationResolution"></span-plus>
          </template>
          <template slot="fileOssids" slot-scope="scope">
            <btn-batch-download :title="$t('common.downLoad')" :fileID="scope.data.row.fileOssids" :disabled="scope.data.row.fileOssids.length===0"></btn-batch-download>
          </template>
          <template slot="relationFileIds" slot-scope="scope">
            <btn-batch-download :title="$t('common.downLoad')" :fileID="scope.data.row.relationFileIds" :disabled="scope.data.row.relationFileIds.length===0"></btn-batch-download>
          </template>
        </data-table>
      </template>
    </external-transition>
  </div>
</template>
<script>
import { dymForm, authButton, btnBatchDownload, DataTable, SpanPlus } from 'newepoch-components'
import externalTransition from '@/components/element/assetoutfeedback/externalTransition'
import * as format from '@/filters/index'
export default {
  name: 'trackScheduleQustDetailForm',
  components: {
    dymForm,
    authButton,
    btnBatchDownload,
    DataTable,
    externalTransition,
    SpanPlus
  },
  props: {
    // 标题
    title: {
      type: String,
      require: false,
      default () {
        return ''
      }
    },
    tableData: {
      type: Array,
      require: false,
      default () {
        return []
      }
    },
    isFold: {
      type: Boolean,
      require: false,
      default () {
        return false
      }
    }
  },
  data () {
    return {
      formValue: {},
      columns: [
        {
          // 反馈次数
          prop: 'feedbackTimes',
          align: 'center',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.feedbackTimes,
          format: row => {
            return '第' + row.feedbackTimes + '次'
          }
        },
        {
          // 律所意见
          prop: 'feedbackQuestionContent',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.replyLawContent,
          slot: true
        },
        {
          // 合规回复律所意见
          prop: 'replyLawContent',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.feedbackQuestionContent,
          slot: true
        },
        {
          // 合规附件
          prop: 'fileOssids',
          align: 'center',
          slot: true,
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.fileOssids
        },
        {
          // 疑难问题
          prop: 'difficultQustionFlag',
          align: 'center',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.difficultQustion,
          format: (row) => {
            return row.difficultQustionFlag === '2' ? '是' : '否'
          }
        },
        {
          // 通用问题
          prop: 'commonQustionFlag',
          align: 'center',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.commonQuestionContent,
          format: (row) => {
            return row.commonQustionFlag === '2' ? '是' : '否'
          }
        },
        {
          // 合规落实
          prop: 'practicableSuggestion',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.practicableSuggeste,
          slot: true
        },
        {
          // 未补回资料
          prop: 'supplementNoFile',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.supplementNoFile,
          slot: true
        },
        {
          // 相关方
          prop: 'relationType',
          align: 'center',
          width: '150px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.relation,
          format: (row) => {
            if (row.relationChargeUserName && row.relationChargeUserName !== '') {
              return format.formatDict(row.relationType, 'AUDIT_OUT_RELATION_TYPE') + '—' + row.relationChargeUserName
            } else {
              return format.formatDict(row.relationType, 'AUDIT_OUT_RELATION_TYPE')
            }
          }
        },
        {
          // 相关方意见
          prop: 'relationResolution',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.relationResolution,
          slot: true
        },
        {
          // 相关方附件
          prop: 'relationFileIds',
          align: 'center',
          slot: true,
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.relation + this.$i18n.messages[this.$i18n.locale].common.attachment
        }
      ],
      spanArr: []
    }
  },
  mounted () {
    if (this.isFold) { this.$refs.dataTable.visible = true }
    this.getOrderNumber()
  },
  methods: {
    // 获取相同编号的数组
    getOrderNumber () {
      let data = this.tableData
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1)
          this.pos = 0
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].feedbackTimes === data[i - 1].feedbackTimes &&
              data[i].firmOpnion === data[i - 1].firmOpnion &&
              data[i].hgFirmOpnion === data[i - 1].hgFirmOpnion) {
            this.spanArr[this.pos] += 1
            this.spanArr.push(0)
          } else {
            this.spanArr.push(1)
            this.pos = i
          }
        }
      }
    },
    // 行合并
    objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
      if (columnIndex >= 0 && columnIndex <= 5) {
        const _row = this.spanArr[rowIndex]
        return {
          rowspan: _row, // 行
          colspan: 1 // 列
        }
      }
    }
  }
}
</script>
