<template>
  <dialog-edit :visible.sync="dialogVisible" :title="$t('taskManage.todoTask.processActivityTitle')" width="1480px"
               :form="form" :api="api" :editModel="editModel" :append-to-body="true">
    <data-table :showPage="false" :sourceData.sync="sourceData" operateBtnLayout="" :columns="columns"
                :headTitle="$t('taskManage.todoTask.processActivityTitle')"></data-table>
    <el-row class="pagination-container" type="flex">
      <el-col :span=12>
        <slot name="paginationLeft">
          <span>{{$t('common.viewTip1')}}{{startNum}}{{$t('common.viewTip2')}}{{endNum}}{{$t('common.viewTip3')}}{{endNum}}{{$t('common.viewTip4')}}</span>
        </slot>
      </el-col>
    </el-row>
  </dialog-edit>
</template>
<script>
import BaseEdit from '@/pages/baseEditPage.js'
import { DialogEdit, DataTable } from 'newepoch-components'
import taskManageApi from '@/api/dataAudit/taskManageApi.js'
import * as format from '@/filters/index'
export default {
  name: 'processActivityEdit',
  extends: new BaseEdit(),
  components: {
    DialogEdit,
    DataTable
  },
  data () {
    return {
      handleFlag: false,
      queryParas: {},
      sourceData: [],
      startNum: 0,
      endNum: 0,
      columns: [
        // 任务名称
        {
          prop: 'taskName',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].taskManage.todoTask.taskName
        },
        // 对应人
        {
          prop: 'assigneeName',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].taskManage.todoTask.counterPerson
        },
        // 任务状态
        {
          prop: 'status',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].taskManage.todoTask.taskStatus,
          format: (row) => { return format.formatDict(row.status, 'bpm_task_status') }
        },
        // 开始时间
        {
          prop: 'createTime',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].taskManage.todoTask.beginDate,
          format: (row) => { return this.UtilJs.isEmpty(row.createTime) ? '-' : format.formatDate(row.createTime, 'yyyy-MM-dd hh:mm:ss') }
        },
        // 领取时间
        {
          prop: 'claimTime',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].taskManage.todoTask.receiveDate,
          format: (row) => { return this.UtilJs.isEmpty(row.claimTime) ? '-' : format.formatDate(row.claimTime, 'yyyy-MM-dd hh:mm:ss') }
        },
        // 完成时间
        {
          prop: 'finishTime',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].taskManage.todoTask.finishDate,
          format: (row) => { return this.UtilJs.isEmpty(row.finishTime) ? '-' : format.formatDate(row.finishTime, 'yyyy-MM-dd hh:mm:ss') }
        }
      ]
    }
  },
  computed: {
    api () {
      return taskManageApi.offLine
    }
  },
  methods: {
    loadProcessList (assetInfoId) {
      let _this = this
      _this.api.getProcessInfo({ assetInfoId: assetInfoId }).then(res => {
        if (res && res.data) {
          if (res.data.length === 0) {
            _this.startNum = 0
            _this.endNum = 0
          } else {
            _this.startNum = 1
            _this.endNum = res.data.length
          }
          _this.sourceData = res.data
        }
      })
    }
  },
  watch: {
    visible (val) {
      let _this = this
      if (val) {
        _this.loadProcessList(_this.form.assetInfoId)
      }
    }
  }
}
</script>
