<template>
  <!-- 保理业务信息管理 -->
  <div class="factoringBusinessInfoManagerList">
    <up-down-layout :header="$t('factoringBusinessInfoManagerList.head')" :handleFlag.sync="handleFlag">
      <search-form
        @handleFilter="handleFilter"
        @clearParam="clearParam"
        :menuCode="menuId"
        searchPerms="searchPerms"
        :formValue.sync="queryParas"
        :componentList="componentList"
        resetPerms="resetPerms"
        slot="query">
      </search-form>
      <template slot="table">
        <data-table
          :headTitle="$t('factoringBusinessInfoManagerList.headCenter')"
          :toolMenuFlag="true"
          :btnCreate="false"
          :queryParas="queryParas"
          :btnDels="false"
          operateBtnLayout="E"
          :columns="columns"
          :sourceData="sourceData"
          :api="api"
          @onEditRow="onEditRow"
          operatWidth="200"
          :loadCount="loadCount">
          <template slot="button" slot-scope="scope">
            <auth-button icon="iconfont iconzhongxinjieru" :size="'small'"
                         class="iconCircle"
                         :title="$t('factoringBusinessInfoManagerList.reMake')"
                         @click="recreate(scope)"></auth-button>
          </template>
        </data-table>
      </template>
    </up-down-layout>
<!--    <factoring-business-info-manager-edit :visible.sync="showDetail" :form="item" :editModel="editModel"></factoring-business-info-manager-edit>-->
  </div>
</template>

<script>
import BasePage from '@/pages/basePage'
import { upDownLayout, searchForm, DataTable, authButton } from 'newepoch-components'
import SelectFinancialInstitutions from '@/components/element/shourang/SelectFinancialInstitutions'
// import factoringBusinessInfoManagerEdit from '@/pages/shouji/factoringBusinessInfoManager/factoringBusinessInfoManagerEdit'
import SelectArea from '@/components/element/shourang/SelectArea'
import * as format from '@/filters/index'

export default {
  extends: new BasePage('guideSheetManage'),
  name: 'factoringBusinessInfoManagerList',
  components: {
    upDownLayout,
    searchForm,
    DataTable,
    authButton,
    SelectFinancialInstitutions,
    SelectArea
    // factoringBusinessInfoManagerEdit
  },
  computed: {
    api () {
      return {}
    }
  },
  methods: {
    recreate (data) {
    },
    onEditRow (rowIndex, rowData, editModel) {
      this.item = rowData
      this.editModel = editModel
      this.showDetail = true
    }
  },
  data () {
    return {
      sourceData: [{}],
      componentList: [
        // 付款确认书编号
        {
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.payCode,
          value: 'productName',
          clearable: true,
          componentName: 'el-input',
          placeholder: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.inputpayCode,
          labelWidth: '160px'
        },
        // 供应商名称
        {
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.suppliersName,
          value: 'productName',
          clearable: true,
          componentName: 'el-input',
          placeholder: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.inputsuppliersName,
          labelWidth: '160px'
        },
        // 计划管理人/再保理银行
        {
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.planningManagerName,
          value: 'productName',
          clearable: true,
          componentName: SelectFinancialInstitutions,
          placeholder: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.selectplanningManagerName,
          labelWidth: '160px'
        },
        // 项目公司名称
        {
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.projectCompanyName,
          value: 'productName',
          clearable: true,
          componentName: 'el-input',
          placeholder: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.inputprojectCompanyName,
          labelWidth: '160px'
        },
        // 区域
        {
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.region,
          value: 'productName',
          clearable: true,
          componentName: SelectArea,
          placeholder: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.selectregion,
          labelWidth: '160px'
        }
      ],
      columns: [
        // 付款确认书编号
        {
          prop: 'payCode',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.payCode,
          width: '150px'
        },
        // 核心企业
        {
          prop: 'coreEnterprise',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.coreEnterprise,
          width: '150px'
        },
        // 供应商名称
        {
          prop: 'suppliersName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.suppliersName,
          width: '150px'
        },
        // 签约主体
        {
          prop: 'signingSubject',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.signingSubject,
          width: '150px'
        },
        // 计划管理人/再保理银行
        {
          prop: 'planningManagerName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.planningManagerName,
          width: '150px'
        },
        // 应收账款金额
        {
          prop: 'accountReceivableLabel',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.accountReceivableLabel,
          width: '150px',
          format: (row) => {
            if (row.loanAmount === 0) {
              return ''
            }
            return format.thousandFilter(row.loanAmount)
          }
        },
        // 账款到期日
        {
          prop: 'dueDate',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.dueDate,
          width: '150px',
          format: (row) => {
            return format.formatDateNull(row.loanDate)
          }
        },
        // 项目公司名称
        {
          prop: 'projectCompanyName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.projectCompanyName,
          width: '150px'
        },
        // 区域
        {
          prop: 'region',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].factoringBusinessInfoManagerList.region,
          width: '150px'
        }
      ]
    }
  }
}
</script>

<style scoped>

</style>
