<template>
    <data-table :showSelection="true" :toolMenuFlag="false" :loadList="loadList" :loadCount.sync="loadCount"
                :sourceData.sync="formTableData.sourceData" :menuFlag="true" operateBtnLayout="false"
                :columns="columns" :border="true" :stripe="true">
        <!--反馈-->
        <template slot="feedbackContent" slot-scope="scope">
            <el-input rows="3" type="textarea" v-model="scope.data.row.feedbackContent" ></el-input>
        </template>
        <!--预计解决时间-->
        <template slot="estimatedFinishTime" slot-scope="scope">
            <el-date-picker  v-model="scope.data.row.estimatedFinishTime" ></el-date-picker>
        </template>
        <!--操作-->
        <template slot="operate" slot-scope="scope">
            <div v-if="scope.data.row.fileId != null &&  scope.data.row.fileId != ''">
                <btn-upload :classType="true" :uploadApi="uploadApi" @uploadFailed="uploadFailed" @uploadSuccess="uploadSuccess" :rowData="scope.row"></btn-upload>
                <btn-download :fileID="scope.data.row.fileId"  :classType="false" ></btn-download>
            </div>
            <div v-else>
                <btn-upload :classType="true" :uploadApi="uploadApi" @uploadFailed="uploadFailed" @uploadSuccess="uploadSuccess"></btn-upload>
            </div>
        </template>
    </data-table>
</template>

<script>
import { DataTable, authButton, btnUpload } from 'newepoch-components'
import tracemgrApi from '@/api/tracemgrApi'
import * as format from '@/filters/index'
import { UPLOAD_API } from '@/constant.js'

export default {
  components: {
    DataTable,
    authButton,
    btnUpload,
    tracemgrApi,
    format
  },
  props: {
    formTableData: {
      type: Object,
      default () {
        return this.sourceData
      }
    }
  },
  data () {
    return {
      uploadApi: UPLOAD_API,
      loadList: 'getList',
      loadCount: '',
      dateTime: '',
      feedbackText: '11',
      processingStatus: this.$i18n.messages[this.$i18n.locale].traceMgr.InProcessing,
      sourceData: [],
      columns: [
        // 律所反馈意见
        {
          prop: 'lawFeedbackopinion',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.lawFirmFeedback,
          showOverflowTooltip: true,
          width: 100
        },
        // 合规处理意见
        {
          prop: 'officerFeedbackOpinion',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.complianceHandlingOpinions,
          showOverflowTooltip: true,
          width: 100
        },
        // 需补资料
        {
          prop: 'supplementaryInformation',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.informationNeeded,
          showOverflowTooltip: true,
          width: 100
        },
        // 处理人员
        {
          prop: 'processingPersonnel',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.processingStaff,
          showOverflowTooltip: true,
          width: 80
        },
        // 反馈
        {
          prop: 'feedbackContent',
          label: this.$i18n.messages[this.$i18n.locale].common.feedback,
          align: 'left',
          width: 100,
          slot: true
        },
        // 预计解决时间
        {
          prop: 'estimatedFinishTime',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.possibleResolutionTime,
          align: 'center',
          width: 150,
          slot: true
        },
        // 操作
        {
          prop: 'operate',
          showOverflowTooltip: true,
          label: this.$i18n.messages[this.$i18n.locale].common.operate,
          align: 'center',
          width: 70,
          slot: true
        },
        // 处理状态
        {
          prop: 'processingStateText',
          showOverflowTooltip: true,
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.processingStatus,
          align: 'center',
          width: '60px',
          format: (row) => {
            if (row.processingStateText === '1' || row.processingStateText === undefined || row.processingStateText === null) {
              return format.formatDict('1', 'tracemgr_abnormal_status')
            } else if (row.processingStateText === '2') {
              return format.formatDict('2', 'tracemgr_abnormal_status')
            } else if (row.processingStateText === '3') {
              return format.formatDict('3', 'tracemgr_abnormal_status')
            } else if (row.processingStateText === '4') {
              return format.formatDict('4', 'tracemgr_abnormal_status')
            }
          }
        }
      ],
      billOfLadingDate: '',
      pickerOptions: {
        disabledDate (time) {
          return time.getTime() > Date.now() - 8.64e6
        }
      }
    }
  },
  computed: {
    api () {
      return tracemgrApi['lawFirmProblemList']
    }
  },
  mounted: function () {
    this.handleFilter()
  },
  methods: {
    uploadSuccess: function (returnData, rowData) {
      this.success(this.$i18n.messages[this.$i18n.locale].traceMgr.file + returnData.fileName + this.$i18n.messages[this.$i18n.locale].traceMgr.uploadSuccessfulFileIdIs + returnData.fileID)
      rowData.fileId = returnData.fileID
      rowData.fileName = returnData.fileName
    },
    uploadFailed: function (a, b, c) {
      this.error(this.$i18n.messages[this.$i18n.locale].traceMgr.fileEorro)
    },
    handleFilter () {
      this.loadCount = this.loadCount + 1
    }
  }
}
</script>
