<template>
    <!--供应商信息维护-->
    <div>
        <up-down-layout :handleFlag.sync="handleFlag">

            <!--搜索表单-->
            <search-form
                    :componentList="searchList"
                    :formValue.sync="queryParas"
                    searchPerms="search"
                    resetPerms="reset"
                    slot="query"
                    v-model="queryParas"
                    @handleFilter="handleFilter"
                    @clearParam="clearParam">
            </search-form>
            <!--数据列表-->
            <template slot="table">
                <data-table :menuCode="menuId"
                            :api="api"
                            :border="true" :stripe="true"
                            :menuFlag="true"
                            :handleFlag.sync="handleFlag"
                            :showSelection="true"
                            :queryParas="queryParas"
                            v-bind="elHeightObj"
                            :sourceData.sync="formTableData.sourceData"
                            :loadCount.sync="loadCount"
                            :columns="columns"
                            :operateBtnLayout="operateBtnLayout">

                    <!--操作-->
                    <el-table-column :label="$t('common.operate')" align="center" fixed="right" :width="180">
                        <template slot-scope="scope">
                          <el-tooltip class="item" effect="dark" :content="$t('common.view')" placement="top" v-if="scope.row.status === '0'">
                            <el-button circle size="mini" @click="handle(scope.row)" class="iconfont iconzuopintoupiao"></el-button>
                          </el-tooltip>
                          <el-tooltip class="item" effect="dark" :content="$t('approval.columnName')" placement="top" v-else>
                            <el-button circle size="mini" @click="handle(scope.row)" class="iconfont iconbanli-active"></el-button>
                          </el-tooltip>
                        </template>
                    </el-table-column>
                </data-table>
            </template>
        </up-down-layout>
      <contact-info-edit :visible.sync="showContact" :menuId="menuId" :form="contactItem" @createSuccess="success" :editModel="contactModel" :regMsg="regMsg"></contact-info-edit>
      <contactor-maintain :visible.sync="contactorVisible" :form="contactorForm" :closeContactor="closeContactor"></contactor-maintain>
      <edit-contact-edit :visible.sync="showEditContact" :menuId="menuId" :regMsg="regMsg" :form="contactItem" :editModel="contactModel" @createSuccess="createSuccess"></edit-contact-edit>
    </div>
</template>

<script>
import {
  DataTable,
  searchForm,
  SelectProductName,
  upDownLayout,
  SelectAddress,
  authButton,
  btnImport,
  btnBatchUpload,
  btnDownload,
  btnUpload,
  SelectFlag,
  SelectDictionary,
  BaseSelect, SelectCoreEnterprise
} from 'newepoch-components'
import taskDialog from '@/components/tracemgr/regionalCommissioner/TaskTable/confirmRightSealNotice/taskDialog.vue'
import batchOperationDaterange from '@/components/tracemgr/regionalCommissioner/workbench/orderTrack/batchOperationDaterange.vue'
import BasePage from '@/pages/basePage'
import tracemgrApi from '@/api/tracemgrApi'
import * as format from '@/filters/index'
import mixin from '@/pages/mixin'
import contactInfoEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/contactInfoEdit/contactInfoEdit'
import contactorMaintain from '@/components/tracemgr/regionalCommissioner/TaskTable/customerInfoMainte/contactorMaintain'
import EditContactEdit from '@/pages/enterpriseInfoManage/supplierInfoManage/editContactEdit'
export default {
  extends: new BasePage(),
  mixins: [mixin],
  components: {
    SelectDictionary,
    EditContactEdit,
    BaseSelect,
    format,
    DataTable,
    batchOperationDaterange,
    searchForm,
    SelectProductName,
    upDownLayout,
    SelectAddress,
    taskDialog,
    tracemgrApi,
    authButton,
    btnImport,
    btnBatchUpload,
    btnDownload,
    btnUpload,
    SelectFlag,
    contactInfoEdit,
    contactorMaintain
  },
  name: 'supplierInformationMaintenanceDialog',
  data () {
    return {
      searchList: [
        // 核心企业
        {
          value: 'coreEnterpriseName',
          componentName: SelectCoreEnterprise,
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.coreEnterprise,
          store: this.$store,
          labelWidth: '70px'
        },
        // 供应商名称
        {
          value: 'enterpriseName',
          componentName: 'el-input',
          label: this.$i18n.messages[this.$i18n.locale].common.supplierName,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.input + this.$i18n.messages[this.$i18n.locale].common.supplierName,
          clearable: true,
          labelWidth: '110px'
        },
        // 任务处理状态
        {
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.status,
          value: 'taskStatus',
          dictTypeCode: 'tracemgr_supplier_maintenance_task_status',
          componentName: 'SelectDictionary',
          store: this.$store,
          labelWidth: '110px'
        }
      ],
      contactModel: '',
      contactorForm: {},
      contactItem: {
        keyId: ''
      },
      showEditContact: false,
      contactorVisible: false,
      showContact: false,
      handleFlag: true,
      formTableData: {
        sourceData: []
      },
      loadCount: 0,
      operateBtnLayout: '',
      // 表头
      columns: [
        {
          prop: 'enterpriseName',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.supplierName,
          showOverflowTooltip: true
        },
        {
          prop: 'coreEnterpriseName',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].common.coreEnterprise,
          showOverflowTooltip: true
        },
        {
          prop: 'maitainCount',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.waitMaintenanceData,
          showOverflowTooltip: true
        },
        {
          prop: 'status',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.status,
          showOverflowTooltip: true,
          format: function (row) {
            if (parseInt(row.status) >= 1) {
              return format.formatDict('0', 'tracemgr_supplier_maintenance_task_status')
            }
            if (row.status === '0') {
              return format.formatDict('1', 'tracemgr_supplier_maintenance_task_status')
            }
          }
        },
        {
          prop: 'startDate',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].common.taskInitiationTime,
          showOverflowTooltip: true,
          format: function (row) {
            if (row.startDate === '1900-01-01 00:00:00') {
              return ''
            } else {
              return row.startDate
            }
          }
        },
        {
          prop: 'endDate',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.taskEndTime,
          showOverflowTooltip: true,
          format: function (row) {
            if (row.endDate === '1900-01-01 00:00:00') {
              return ''
            } else {
              return row.endDate
            }
          }
        },
        {
          prop: 'taskSpendTime',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].traceMgr.taskSpendTime,
          showOverflowTooltip: true,
          format: function (row) {
            if (row.status === '0') {
              return '——'
            } else {
              var startDate = new Date(row.startDate)
              var endDate = new Date(row.endDate)
              var startTime = startDate.getTime()
              var endTime = endDate.getTime()
              var total = (endTime - startTime) / 1000
              var day = parseInt(total / (24 * 60 * 60))// 计算整数天数
              var afterDay = total - day * 24 * 60 * 60// 取得算出天数后剩余的秒数
              var hour = parseInt(afterDay / (60 * 60))// 计算整数小时数
              var afterHour = total - day * 24 * 60 * 60 - hour * 60 * 60// 取得算出小时数后剩余的秒数
              var min = parseInt(afterHour / 60)// 计算整数分
              var residueTime = (day === 0 ? '' : (day + row.day)) + (hour === 0 ? '' : (hour + row.hour)) + (min === 0 ? '' : (min + row.min))
              return residueTime
            }
          }
        }
      ],
      queryParas: {
        pageSize: 10,
        pageIndex: 1,
        type: '140'
      },
      saveObject: {
        keyId: '',
        status: '1'
      }
    }
  },
  methods: {
    // 保存成功查询
    createSuccess () {
      this.handleFilter()
    },
    clearParam () {
      this.queryParas = {
        pageIndex: 1,
        pageSize: 10,
        type: '140'
      }
    },
    success () {
      // 保存完成 更新此联系人账号的所有联系人为已完成
      tracemgrApi['contactor'].updateContact(this.saveObject).then(res => {
        if (res.data) {
          this.handleFilter()
        }
      })
    },
    closeContactor () {
      this.handleFilter()
    },
    // 办理
    handle (row) {
      this.saveObject.keyId = row.keyId
      if (row.maitainCount === '1') {
        // 登录账号数量为1时，直接跳转办理页面
        if (row.status === '0') {
          this.contactModel = 'V'
        } else {
          this.contactModel = 'E'
        }
        this.contactItem.enterpriseId = row.enterpriseId
        this.contactItem.tagCode = '140'
        if (row.accountId === '0') {
          this.contactModel = 'E'
          this.showEditContact = true
          return
        }
        this.contactItem.keyId = row.accountId
        this.showContact = true
      } else if (parseInt(row.maitainCount) > 1) {
        // 登录账号数量大于1时，跳转需要维护的联系人列表
        this.contactorForm = Object.assign({}, row)
        this.contactorForm.pageType = 2
        this.contactorForm.type = '140'
        this.contactorVisible = !this.contactorVisible
      }
    }
  },
  mounted () {
    this.handleFilter()
  },
  computed: {
    api () {
      return tracemgrApi['customerMaintance']
    }
  }
}
</script>
