<template>
  <div>
    <dialog-edit :visible.sync="dialogVisible" :editModel="editModel" :form="form" :saveFlag="false" :title="$t('assetFlowStatusPopList.title')" width="50%">
      <el-form :model="queryParas">
        <el-row :gutter="10">
          <el-col class="assetSelect" :xs="12" :sm="12" :md="12" :lg="12">
            <el-form-item :label="$t('coordManageMain.fileType')" style="margin-bottom:0;">
              <file-select-list :fileQueryType="4" v-model="queryParas.auditFileType" :stampWay="'3'" ref="fileList" @selectChanged="selectChanged" :clearable="false"></file-select-list>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div v-if="isOtherFile()" style="margin-top:10px;">
        <span>{{$t('assetFlowStatusPopList.accountVindicate')}}
           <i>{{otherFileInfo.uphold}}</i></span>
        <span style="margin-left:10%">{{$t('assetFlowStatusPopList.factorNote1')+fileName+$t('assetFlowStatusPopList.factorNote2')+otherFileInfo.pointNumber+$t('assetFlowStatusPopList.count')}}
          <i>{{otherFileInfo.seal}}</i></span>
      </div>
      <data-table :sourceData.sync="sourceData"
                  :columns="columns"
                  :loadCount.sync="loadCount"
                  :queryParas="queryParas"
                  :showPage="true"
                  stripe
                  max-height="400"
                  ref="dataTable"></data-table>
      <template slot="footer">
        <auth-button :disabled="disabled" :label="downLabel" size="medium"  type="primary" @click="download"></auth-button>
      </template>
    </dialog-edit>
  </div>
</template>

<script>
import BasePage from '@/pages/baseEditPage'
import { DialogEdit, DataTable, authButton } from 'newepoch-components'
import fileSelectList from '@/components/element/assetoutfeedback/fileSelectList'
import coordManageApi from '@/api/assetoutfeedback/coordManage/coordManageApi'
import fileApi from '@/api/fileApi.js'
import { downFile } from '@/utils/devUtils'
export default {
  extends: new BasePage(),
  components: { DialogEdit, DataTable, authButton, fileSelectList },
  name: 'assetFlowStatusPop',
  props: {
    form: {
      type: Object,
      default () {
        return {}
      }
    },
    editModel: {
      type: String,
      default () {
        return ''
      }
    },
    downLabel: {
      type: String,
      default () {
        return this.$i18n.messages[this.$i18n.locale].assetFlowStatusPopList.loadReport
      }
    },
    fileType: {
      type: String,
      default () {
        return ''
      }
    },
    stampType: {
      type: String,
      default () {
        return '2'
      }
    }
  },
  data () {
    return {
      disabled: false,
      classType: true,
      loadCount: 0,
      fileName: '',
      sourceData: [],
      otherFileInfo: {},
      columns: [
        {
          prop: 'bizProcessStatusName',
          align: 'left',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].assetFlowStatusPopList.processStatus
        },
        {
          prop: 'number',
          align: 'center',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].assetFlowStatusPopList.numAmount,
          format: row => {
            return row.number ? row.number : '0'
          }
        },
        {
          prop: 'elecNumber',
          align: 'center',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].assetFlowStatusPopList.sealTotal,
          format: row => {
            return row.elecNumber ? row.elecNumber : '0'
          }
        }
      ],
      queryParas: { pageSize: 10, pageIndex: 1, auditFileType: '' },
      uuidSwitch: false
    }
  },
  mounted () {
    Object.assign(this.queryParas, this.form)
    if (this.fileType === '1') {
      this.queryParas.auditFileType = '1001'
    } else {
      if (this.stampType === '2') {
        this.queryParas.auditFileType = '2002'
      } else {
        this.queryParas.auditFileType = '2001'
      }
    }
    this.$nextTick(() => {
      this.handleFilter()
      this.loadData(this.queryParas)
    })
  },
  watch: {
    'queryParas.auditFileType': function () {
      this.loadData(this.queryParas)
    },
    'queryParas.pageSize': function () {
      this.loadData(this.queryParas)
    },
    'queryParas.pageIndex': function () {
      this.loadData(this.queryParas)
    }
  },
  computed: {
    listApi () {
      return coordManageApi.assetStatusList
    },
    downloadApi () {
      return coordManageApi.assetStatusDown
    }
  },
  methods: {
    handleCancle () {
      this.dialogVisible = false
    },
    handleFilter () {
      this.loadCount = this.loadCount + 1
    },
    // 下拉框选中回调
    selectChanged (a, b, c) {
      // 产品名称
      if (c) { this.fileName = c.fileName }
    },
    // 加载数据
    loadData (data) {
      if (!this.UtilJs.isEmpty(data.auditFileType)) {
        this.listApi.getPage(data).then(res => {
          if (res.success) {
            this.$refs.dataTable.buildTableData(res.data.bizProcessListDtoPage.datas, res.data.bizProcessListDtoPage.totalRow)
            this.otherFileInfo = res.data
            this.otherFileInfo.pointNumber = this.otherFileInfo.pointNumber ? this.otherFileInfo.pointNumber : '0'
          }
        })
      } else {
        this.error('文件类型不能为空')
      }
    },
    // 是否为保理通知书
    isOtherFile () {
      var reg = new RegExp('300')
      if (this.queryParas.auditFileType.match(reg)) {
        return true
      } else {
        return false
      }
    },
    // 下载报表
    download () {
      this.downloadApi.getDefault(this.queryParas).then((res) => {
        if (res.success) {
          if (res.data) {
            this.downloadSuccess(res.data)
          } else {
            this.warning('没有可以下载的数据')
          }
        }
      })
    },
    // 下载
    downloadSuccess (fileID) {
      if (this.UtilJs.isEmpty(fileID)) {
        this.warning(this.noDownloadFileMsg)
      } else {
        if (this.uuidSwitch) {
          fileApi.file.downloadByUUID(this.$xhr, { uuid: fileID }).then(res => {
            downFile(res)
          })
        } else {
          fileApi.file.download({ keyId: fileID }).then(res => {
            downFile(res)
          })
        }
      }
    }
  }
}
</script>
<style  lang="scss">
.assetSelect .el-form-item__content .baseSelect{
  width: 66%!important;
}
</style>
