<template>
  <div class="trackScheduleHisPop">
    <dialog-edit :visible.sync="dialogVisible" :closeLabel="$t('common.close')" :editModel="editModel" :form="form"  :title="$t('trackScheduleHisPopList.title')" width="70%">
      <data-table :columns="columns"
                  :span-method="objectSpanMethod"
                  :api="coordManageApi"
                  loadPage="getDefaultHistory"
                  @handleFilter="handleFilter"
                  :queryParas="queryParas"
                  :sourceData.sync="sourceData"
                  :loadCount.sync="loadCount"
                  @getTableData="getTableData"
                  :showPage="true"
                  class="pagination-setting" stripe>
        <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="relationResolution" slot-scope="scope">
          <span-plus :index="scope.data.$index" :text="scope.data.row.relationResolution"></span-plus>
        </template>
        <el-table-column fixed="right"
                       align="center" :resizable="false"
                       :label="$t('trackScheduleHisPopList.relationAnnex')" :width="100">
        <template slot-scope="scope">
          <btn-batch-download :fileID="scope.row.fileOssids" :disabled="scope.row.fileOssids.length===0"></btn-batch-download>
        </template>
      </el-table-column>
      </data-table>
    </dialog-edit>
  </div>
</template>

<script>
import BasePage from '@/pages/baseEditPage'
import { DialogEdit, dymForm, DataTable, btnBatchDownload, SpanPlus } from 'newepoch-components'
import coordManageApi from '@/api/assetoutfeedback/coordManage/coordManageApi'
import * as format from '@/filters/index'
export default {
  extends: new BasePage(),
  components: { DialogEdit, dymForm, DataTable, btnBatchDownload, SpanPlus },
  name: 'trackScheduleHisPop.vue',
  props: {
    form: {
      type: Object,
      default: function () {
        return {}
      }
    },
    editModel: {
      type: String,
      default: function () {
        return 'V'
      }
    }
  },
  data () {
    return {
      disabled: false,
      queryParas: {
        pageIndex: 0,
        pageSize: 10
      },
      loadCount: 0,
      columns: [
        {
          prop: 'feedbackTimes',
          align: 'center',
          width: '50px',
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.feedbackTimes,
          format: row => {
            return '第' + row.feedbackTimes + '次'
          }
        },
        {
          prop: 'feedbackQuestionContent',
          align: 'left',
          width: '120px',
          slot: true,
          label: this.$i18n.messages[this.$i18n.locale].trackScheduleHisPopList.auditOpinion
        },
        {
          prop: 'replyLawContent',
          align: 'left',
          width: '120px',
          slot: true,
          label: this.$i18n.messages[this.$i18n.locale].trackScheduleHisPopList.complianceOpinion
        },
        {
          prop: 'practicableSuggestion',
          align: 'left',
          width: '120px',
          slot: true,
          label: this.$i18n.messages[this.$i18n.locale].trackScheduleHisPopList.complianceImplement
        },
        {
          prop: 'relationType',
          align: 'center',
          width: '80px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.relation,
          format: (row) => {
            return format.formatDict(row.relationType, 'AUDIT_OUT_RELATION_TYPE')
          }
        },
        {
          prop: 'relationResolution',
          align: 'center',
          width: '150px',
          slot: true,
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.relationResolution
        }],
      sourceData: [],
      rowSpanArr: []
    }
  },
  mounted () {
    Object.assign(this.queryParas, this.form)
    // this.queryParas.keyId = '2003271743383406374'
    // this.queryParas.qusetionNumber = '1'
    this.$nextTick(() => {
      this.handleFilter()
    })
  },
  computed: {
    coordManageApi () {
      return coordManageApi.getTrclistQust
    }
  },
  methods: {
    handleCancle () {
      this.dialogVisible = false
    },
    handleFilter () {
      this.loadCount = this.loadCount + 1
    },
    getTableData () {
      this.getRowSpan()
    },
    // 获取合并
    getRowSpan () {
      this.rowSpanArr = []
      this.sourceData.forEach((item, index) => {
        if (index === 0) {
          this.rowSpanArr.push(1)
          this.position = 0
        } else {
          if (this.sourceData[index].feedbackTimes === this.sourceData[index - 1].feedbackTimes &&
            this.sourceData[index].feedbackQuestionContent === this.sourceData[index - 1].feedbackQuestionContent) {
            this.rowSpanArr[this.position] += 1 // 项目名称相同，合并到同一个数组中
            this.rowSpanArr.push(0)
            this.sourceData[index].feedbackTimes = this.sourceData[index - 1].feedbackTimes
            this.sourceData[index].feedbackQuestionContent = this.sourceData[index - 1].feedbackQuestionContent
          } else {
            this.rowSpanArr.push(1)
            this.position = index
          }
        }
      })
    },
    // 行合并
    objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0 || columnIndex === 1) {
        let $row = this.rowSpanArr[rowIndex]
        return {
          rowspan: $row, // 行
          colspan: 1 // 列
        }
      }
    }
  }
}
</script>
<style lang="scss" scoped>
@import '~@/styles/assetoutfeedback/common.scss'
</style>
