<template>
  <div>
    <data-table class="relationdatatable" :sourceData.sync="ybtable" :columns="ybcolumns" :loadCount="loadCount"
     :queryParas.sync="queryParas" :api="api" v-bind="{maxHeight:400}" :loadPage="'getDefaultSame'">
      <el-table-column :label="$t('common.operate')" align="center" width="100px">
        <template slot-scope="scope">
          <auth-button size="small" class="iconCircle"
                      :title="$t('effectDealFeedBackMain.select')" icon="iconfont iconxuanze" @click="select(scope.row)"></auth-button>
        </template>
      </el-table-column>
      <!-- 律所意见 -->
      <template #feedbackQuestionContent="scope">
        <span-plus :index="scope.data.$index" :text="scope.data.row.feedbackQuestionContent"></span-plus>
      </template>
    </data-table>
  </div>
</template>

<script>
import * as format from '@/filters/index'
import effectDealFeedBackApi from '@/api/assetoutfeedback/effectDealFeedBack/effectDealFeedBackApi'
import { DataTable, authButton, SpanPlus } from 'newepoch-components'
import { mapGetters } from 'vuex'
export default {
  components: { DataTable, authButton, SpanPlus },
  props: {
    form: {
      type: Object,
      default () {
        return {}
      }
    },
    editModel: {
      type: String,
      default () {
        return ''
      }
    },
    code: {
      type: String,
      default () {
        return ''
      }
    }
  },
  computed: {
    // 关联问题
    api () {
      return effectDealFeedBackApi.getRelationQust
    },
    ...mapGetters(['userId'])
  },
  data () {
    return {
      queryParas: {
        pageIndex: 1,
        pageSize: 10
      },
      ybtable: [],
      loadCount: 0,
      ybcolumns: [
        {
          // 付款确认书编号
          prop: 'assetCode',
          align: 'left',
          width: '80px',
          label: this.$i18n.messages[this.$i18n.locale].common.payCode
        }, {
          // 反馈来源
          prop: 'feedbackResource',
          align: 'center',
          width: '60px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.feedbackResource,
          format (row) {
            return format.formatDict(row.feedbackResource, 'FEEDBACK_RESOURCE')
          }
        }, {
          // 律所意见
          prop: 'feedbackQuestionContent',
          align: 'left',
          slot: true,
          width: '160px',
          label: this.$i18n.messages[this.$i18n.locale].effectDealFeedBackMain.replyLawContent
        }
      ]
    }
  },
  mounted () {
    // 单笔落实或者批量落实的情况(抛出单笔可审核和想法正在的情况)
    if ((this.editModel === 'I' || this.editModel === 'IS') && this.code !== 'SH' && this.form.code !== 'XGF') {
      // 整合问题ID字段
      this.form.qstDetailKeyId = this.form.keyId
    }
    Object.assign(this.queryParas, this.form)
    Object.assign(this.queryParas, { 'userId': this.userId })
    // 查询
    this.$nextTick(() => {
      this.myhandleFilter()
    })
  },
  methods: {
    // 更新表数据
    myhandleFilter () {
      this.loadCount = this.loadCount + 1
    },
    // 选择
    select (row) {
      // console.log(this.form.keyIdList, row.keyId)
      if (this.form.keyIdList.map(item => {
        return item.keyId
      }).includes(row.keyId)) {
        this.warning('被关联的问题不能再关联其他问题')
        return
      }
      this.success('关联问题选择成功')
      row = Object.assign(row, { 'relationQuestionType': '1' })
      this.$emit('update:qustData', row)
    }
  }
}
</script>

<style>

</style>
