<!-- BPO特殊供应商 -->
<template>
  <div>
    <up-down-layout :header="$t('bpoTask.specialSupply')" :headerVisible="false" :handleFlag.sync="handleFlag">
      <search-form @clearParam="clearParam" @handleFilter="handleFilter" :formValue.sync="queryParas"
                   v-model="queryParas" :componentList="componentList" slot="query"
                   :menuCode="menuId" searchPerms="search" resetPerms="reset"></search-form>
      <template slot="table">
        <data-table :handleFlag.sync="handleFlag" :showPage="true" :showSelection="true" :type="'selection'"
                    :queryParas="queryParas" :sourceData.sync="sourceData" :selectedRows.sync="selectedRows" :api="api"
                    @onMouseOver="onMouseOver" ref="table" v-bind="elHeightObj" :tableId="tableId"
                    :loadCount.sync="loadCount" :operateBtnLayout="operateBtnLayout" :columns="columns" :headTitle="$t('bpoTask.bpoTaskTitle')">
          <template slot="headButton">
            <div class="headButton">
              <auth-button class="btn-right" size="medium" type="primary" icon="iconfont iconycxiazai"
                           :label="$t('common.downloadTemplate')" @click="downTemplate"></auth-button>
              <btn-import :btnDisplay="true" :uploadApi="uploadApi" btnSize="medium" class="btn-right" :fileType="fileType"
                          :openPerms="false" @importSuccess="importSuccess" :uploadName="$t('common.import')"></btn-import>
              <!--<auth-button :type="'primary'" :size="'medium'" :label="$t('common.import')" @click="importFile"></auth-button>-->
              <auth-button icon="iconfont iconshanchu" :type="'primary'" :size="'medium'" :label="$t('common.delete')" @click="delFile"></auth-button>
            </div>
          </template>
        </data-table>
      </template>
    </up-down-layout>
    <import-res-pop :visible.sync="visible" editModel="V" :importResultDto="ImportResultDto" :form="aa"></import-res-pop>
  </div>
</template>
<script>
import BasePage from '@/pages/basePage.js'
import { upDownLayout, searchForm, DataTable, authButton, btnImport, SelectCoreEnterprise, SelectPlanManager } from 'newepoch-components'
import ImportResPop from '@/pages/renwufenpei/importResPop.vue'
import bpoTaskDistributionListApi from '@/api/renwufenpei/bpoTaskDistributionListApi.js'
import fileApi from '@/api/fileApi.js'
import { downFile } from '@/utils/devUtils.js'
import mixin from '@/pages/mixin.js'
export default {
  name: 'specialSupply',
  extends: new BasePage(),
  mixins: [mixin],
  components: {
    ImportResPop,
    upDownLayout,
    searchForm,
    DataTable,
    authButton,
    btnImport
  },
  data () {
    const SPECIAL_SUPPLY_UPLOAD_API = process.env.BASE_URL + '/api/renwufenpei/bpo/supplier/import'
    return {
      uploadApi: SPECIAL_SUPPLY_UPLOAD_API,
      fileType: '.xlsx,.xls,.xlsm',
      tableId: 'specialSupply',
      aa: {},
      operateBtnLayout: '',
      ImportResultDto: {
        currentImportCount: 564,
        ignoreCount: 4,
        successCount: 1,
        failCount: 5
      },
      visible: false,
      sourceData: [],

      componentList: [
        // 核心企业
        {
          label: this.$i18n.messages[this.$i18n.locale].bpoTask.coreEnterprise,
          value: 'coreEnterpriseId',
          disabled: false,
          componentName: SelectCoreEnterprise,
          cols: [8, 8, 8, 8],
          labelWidth: '70px',
          prop: 'coreEnterpriseId'
        },
        // 计划管理人/再保理银行
        {
          label: this.$i18n.messages[this.$i18n.locale].bpoTask.planningManagerName,
          value: 'planningManagerId',
          disabled: false,
          componentName: SelectPlanManager,
          cols: [8, 8, 8, 8],
          labelWidth: '170px',
          prop: 'planningManagerId'
        },
        // 供应商名称
        {
          label: this.$i18n.messages[this.$i18n.locale].bpoTask.supplierName,
          value: 'suppliersName',
          disabled: false,
          componentName: 'el-input',
          cols: [8, 8, 8, 8],
          labelWidth: '90px',
          maxlength: '100',
          prop: 'suppliersName',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.input
        }
      ],
      columns: [
        // 核心企业
        {
          prop: 'coreEnterpriseName',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].complianceCheck.coreEnterprise,
          width: '100px'
        },
        // 计划管理人/再保理银行
        {
          prop: 'planningManagerName',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].complianceCheck.planningManagerName,
          width: '100px'
        },
        // 供应商名称
        {
          prop: 'suppliersName',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].complianceCheck.supplierName,
          width: '100px'
        }
      ]
    }
  },
  computed: {
    api () {
      return bpoTaskDistributionListApi.bpoSpecialSupplier
    }
  },
  mounted () {},
  methods: {
    handleFilter () {
      let _this = this
      for (let key in _this.queryParas) {
        if (_this.UtilJs.isEmpty(_this.queryParas[key])) {
          delete _this.queryParas[key]
        }
      }
      _this.$refs.table.loadTableData()
    },
    downTemplate () {
      let _this = this
      _this.api.downloadTemplate().then(fileRes => {
        if (fileRes && fileRes.data) {
          fileApi.file.download({ keyId: fileRes.data }).then(res => {
            downFile(res)
          })
        }
      })
    },
    onMouseOver (row) {
      // this.$refs.table.$refs.vueTable.toggleRowSelection(row)
    },
    importFile () {
    },
    delFile () {
      let $this = this
      if (this.selectedRows.length === 0) {
        $this.warning(this.$i18n.messages[this.$i18n.locale].common.delSelectedTip)
        return
      }
      $this.$confirm(this.$i18n.messages[this.$i18n.locale].common.confirmTip, this.$i18n.messages[this.$i18n.locale].common.tip, {
        type: 'warning'
      }).then(() => {
        var newObj = []
        this.selectedRows.forEach(item => {
          newObj.push(item.keyId)
        })
        bpoTaskDistributionListApi.bpoSpecialSupplier.deleteSpecialSupplier(newObj).then(res => {
          if (res.code === '0' && res.data) {
            this.$message.success(this.$i18n.messages[this.$i18n.locale].common.delSuccess)
            this.handleFilter()
            this.dialogVisible = !this.dialogVisible
          } else {
            if (typeof (res) === 'string') {
              this.$message.error(res)
            } else {
              this.$message.error(this.$i18n.messages[this.$i18n.locale].common.delFailure)
            }
          }
        })
      })
    },
    importSuccess (data) {
      this.ImportResultDto = data
      this.visible = true
      this.handleFilter()
    },
    showEdit () {
      this.visible = true
    }
  },
  watch: {}
}
</script>
<style lang="scss" scoped src="@/styles/renwufenpei/specialSupply.scss">
</style>
