<template>
  <div>
    <up-down-layout :header="$t('economyLendingInfoList.head')" :handleFlag.sync="handleFlag">
      <search-form :formValue.sync="queryParas"
                   searchPerms="search"
                   @handleFilter="handleFilter"
                   @clearParam="clearParam"
                   slot="query"
                   resetPerms="reset"
                   :componentList="componentList"></search-form>
      <template slot="table">
        <data-table :api="api" :deleteApi="api"
                    :headTitle = "$t('economyLendingInfoList.tableHead')"
                    selectable="false"
                    :handleFlag.sync="handleFlag"
                    :menuFlag="true"
                    :queryParas="queryParas"
                    :sourceData.sync="sourceData"
                    :loadCount.sync="loadCount"
                    :columns="columns"
                    operateBtnLayout=""
                    v-bind="elHeightObj">
          <template>
            <el-table-column fixed="right" align="center" :label="$t('common.operate')" width="120px">
              <template slot-scope="scope">
                <!--处理放款信息-->
                <auth-button class="iconCircle" size="small" icon="iconfont iconyifangkuanzichanguanli"
                             :openPerms="true" :menuCode="menuId" perms="clfkBtn"
                             :title="$t('economyLendingInfoList.clfkBtn')" @click="handleClick(scope.row)"></auth-button>
              </template>
            </el-table-column>
          </template>
          <template slot="headButton">
          </template>
        </data-table>
      </template>
    </up-down-layout>
    <lending-info-edit :visible.sync="editVisible" :menuCode="menuId" :form="formItem" :editModel="editModel" @audit-success="handleFilter"></lending-info-edit>
  </div>
</template>
<script>
import { upDownLayout, searchForm, DataTable, authButton, SelectCoreEnterprise, SelectFinancialInstitutions } from 'newepoch-components'
import economyLendingApi from '@/api/economyLendingApi'
import * as format from '@/filters/index'
import BasePage from '@/pages/basePage'
import LendingInfoEdit from '@/pages/shourang/economyLendingInfo/lendingInfoEdit'
import mixin from '@/pages/mixin.js'

export default {
  extends: new BasePage(),
  mixins: [mixin],
  name: 'economyLendingInfo',
  components: {
    LendingInfoEdit,
    searchForm,
    upDownLayout,
    DataTable,
    authButton,
    SelectCoreEnterprise,
    SelectFinancialInstitutions
  },
  data () {
    return {
      handleFlag: true,
      loadCount: 0,
      formItem: {},
      queryParas: {},
      editModel: 'E',
      editVisible: false,
      componentList: [
        {
          // 供应商名称
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.suppliersName,
          disabled: false,
          value: 'creditor',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '160px',
          clearable: true,
          componentName: 'el-input'
        },
        {
          // 核心企业
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.coreEnterpriseName,
          disabled: false,
          value: 'coreEnterpriseId',
          labelWidth: '160px',
          clearable: true,
          componentName: SelectCoreEnterprise
        },
        {
          // 计划管理人/再保理银行
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.planningManagerName,
          disabled: false,
          value: 'planningManagerId',
          labelWidth: '160px',
          clearable: true,
          componentName: SelectFinancialInstitutions
        },
        {
          // 付款确认书编号
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.payCode,
          disabled: false,
          value: 'assetCode',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '160px',
          clearable: true,
          componentName: 'el-input'
        }
      ],
      columns: [
        {
          // 付款确认书编号
          prop: 'assetCode',
          align: 'left',
          width: '200px',
          sortable: true,
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.payCode
        },
        {
          // 项目公司名称
          prop: 'debtor',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.projectCompanyName
        },
        {
          // 供应商名称
          prop: 'creditor',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.suppliersName
        },
        {
          // 计划管理人/再保理银行
          prop: 'planningManagerName',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.planningManagerName
        },
        {
          // 核心企业
          prop: 'coreEnterpriseName',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.coreEnterpriseName
        },
        {
          // 区域
          prop: 'coreAreaName',
          align: 'left',
          width: '150px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.region
        },
        {
          // 应收账款金额（元）
          prop: 'factoringMoney',
          align: 'right',
          width: '160px',
          sortable: true,
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.accountsReceivable,
          format: (row) => {
            return format.thousandFilter(row.factoringMoney)
          }
        },
        {
          // 账款到期日
          prop: 'dueDate',
          align: 'center',
          width: '130px',
          sortable: true,
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.dueDate,
          format: (row) => {
            return format.formatDate(row.dueDate)
          }
        },
        {
          // 实际放款日期
          prop: 'loanDateFactoring',
          align: 'center',
          width: '130px',
          sortable: true,
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.loanDate,
          format: (row) => {
            return format.formatDate(row.loanDateFactoring)
          }
        },
        {
          // 审核人
          prop: 'auditor',
          align: 'center',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.auditor
        },
        {
          // 审核时间
          prop: 'auditDate',
          align: 'center',
          width: '180px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.auditDate,
          format: (row) => {
            return format.formatDatetime(row.auditDate)
          }
        },
        {
          // 审核意见
          prop: 'auditOpinions',
          align: 'left',
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].economyLendingInfoList.auditOpinions
        }
      ],
      sourceData: []
    }
  },
  computed: {
    api () {
      return economyLendingApi.economyLending
    }
  },
  mounted () {
  },
  methods: {
    handleFilter () {
      Object.keys(this.queryParas).forEach(it => {
        if (this.UtilJs.isEmpty(this.queryParas[it])) delete this.queryParas[it]
      })
      this.loadCount = this.loadCount + 1
    },
    handleClick (value) {
      this.formItem = Object.assign({}, value)
      this.editVisible = true
    }
  }
}
</script>
<style scoped>
</style>
