<!--导入-->
<template>
  <div>
    <dialog-edit ref="dialog" :visible.sync="dialogVisible" :title="$t('common.import')" width="600px" :api="api" :form="form" :editModel="editModel"
                 :formRules="formRules" @onSaved="save" :autoSave="false" :loading="okBtnloading">
      <dym-form :formValue.sync="form" :componentList="componentList" @selectChanged="selectChanged"></dym-form>
      <el-form-item :label="$t('ladingPlanManageList.importFile')" prop="fileName" label-width="170px" :rules="[{ required: true, message: '请导入文件' }]">
        <el-row>
          <el-col :xs="17" :sm="17" :md="17" :lg="17">
            <el-input :disabled="true" v-model="form.fileName" class="importCss"></el-input>
          </el-col>
          <el-col :xs="7" :sm="7" :md="7" :lg="7" class="center-div">
            <btn-auto-import size="" :importName="$t('ladingManageList.importFile')"
                             :menuCode="menuCode" perms="ImportFile" :openPerms="true"
                             @upload="upload"></btn-auto-import>
          </el-col>
        </el-row>
      </el-form-item>
    </dialog-edit>
    <import-result-edit :visible.sync="resultFlag" :editModel="resultModel" :form="resultItem"></import-result-edit>
  </div>
</template>

<script>
import { DialogEdit, dymForm, authButton, SelectProductName, SelectCoreEnterpriseCascade, SelectFinancialInstitutionsCascade,
  SelectAssetsServiceCascade, SelectPrimitiveRightsHolderCascade,
  btnAutoImport, SelectPeriodsCascade } from 'newepoch-components'
import BaseEditPage from '@/pages/baseEditPage'
import ladingManageApi from '@/api/ladingManageApi'
import ImportResultEdit from '@/pages/shouji/ladingManage/importResultEdit.vue'
import componentsApi from '@/api/componentsApi'
import qs from 'qs'

export default {
  extends: new BaseEditPage(''),
  components: {
    DialogEdit,
    dymForm,
    authButton,
    btnAutoImport,
    ImportResultEdit
  },
  props: {
    code: {
      type: String
    },
    menuCode: {
      type: String,
      default: null
    }
  },
  data () {
    return {
      resultFlag: false,
      resultModel: '',
      resultItem: {},
      okBtnloading: false, // 保存按钮转圈圈
      // formdata 块
      fm: new FormData(),
      formRules: {
        projectId: [{
          required: true,
          // message: '请选择产品名称',
          message: this.$i18n.messages[this.$i18n.locale].ladingNoticeManage.selectproductName,
          trigger: 'change'
        }],
        specialPlanId: [{
          required: true,
          message: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          trigger: 'change'
        }],
        coreEnterpriseId: [{
          required: true,
          // message: '请选择核心企业',
          message: this.$i18n.messages[this.$i18n.locale].ladingNoticeManage.selectcoreEnterprise,
          trigger: 'change'
        }],
        planningManagerId: [{
          required: true,
          // message: '请选择计划管理人/再保理银行',
          message: this.$i18n.messages[this.$i18n.locale].ladingNoticeManage.selectplanningManagerName,
          trigger: 'change'
        }],
        ladingType: [{
          required: true,
          // message: '请选择提单类型',
          message: this.$i18n.messages[this.$i18n.locale].ladingNoticeManage.selectladingType,
          trigger: 'change'
        }],
        assetServiceId: [{
          required: true,
          // message: '请选择资产服务机构',
          message: this.$i18n.messages[this.$i18n.locale].ladingNoticeManage.selectassetServiceOrgan,
          trigger: 'change'
        }],
        initialOwnersId: [{
          required: true,
          // message: '请选择原始权益人',
          message: this.$i18n.messages[this.$i18n.locale].ladingNoticeManage.selectrightsHolder,
          trigger: 'change'
        }]
      },
      componentList: [
        // 产品名称
        {
          label: this.$i18n.messages[this.$i18n.locale].common.productName,
          value: 'projectId',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          cols: [24, 24, 24, 24],
          componentName: SelectProductName,
          prop: 'projectId',
          name: 'projectId',
          labelWidth: '170px'
        },
        // 期数
        {
          label: this.$i18n.messages[this.$i18n.locale].common.periodsNum,
          value: 'specialPlanId',
          disabled: false,
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          cols: [24, 24, 24, 24],
          componentName: SelectPeriodsCascade,
          queryName: 'projectId',
          queryValue: 'projectId',
          prop: 'specialPlanId',
          name: 'specialPlanId',
          labelWidth: '170px'
        },
        // 核心企业
        {
          label: this.$i18n.messages[this.$i18n.locale].common.coreEnterprises,
          value: 'coreEnterpriseId',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          cols: [24, 24, 24, 24],
          componentName: SelectCoreEnterpriseCascade,
          queryName: 'projectId',
          queryValue: 'projectId',
          prop: 'coreEnterpriseId',
          name: 'coreEnterpriseId',
          labelWidth: '170px'
        },
        // 计划管理人/再保理银行
        {
          label: this.$i18n.messages[this.$i18n.locale].common.refactorBank,
          value: 'planningManagerId',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          cols: [24, 24, 24, 24],
          queryName: 'projectId',
          queryValue: 'projectId',
          componentName: SelectFinancialInstitutionsCascade,
          prop: 'planningManagerId',
          name: 'planningManagerId',
          labelWidth: '170px'
        },
        // 提单类型
        {
          label: this.$i18n.messages[this.$i18n.locale].ladingPlanManageList.ladingType,
          value: 'ladingType',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          cols: [24, 24, 24, 24],
          componentName: 'SelectDictionary',
          dictTypeCode: 'ZD0100',
          store: this.$store,
          prop: 'ladingType',
          labelWidth: '170px'
        },
        // 资产服务机构
        {
          label: this.$i18n.messages[this.$i18n.locale].ladingPlanManageList.assetServiceOrgan,
          value: 'assetServiceId',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          cols: [24, 24, 24, 24],
          componentName: SelectAssetsServiceCascade,
          queryName: 'projectId',
          queryValue: 'projectId',
          prop: 'assetServiceId',
          name: 'assetServiceId',
          labelWidth: '170px'
        },
        // 原始权益人
        {
          label: this.$i18n.messages[this.$i18n.locale].ladingPlanManageList.rightsHolder,
          value: 'initialOwnersId',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseSelect,
          cols: [24, 24, 24, 24],
          componentName: SelectPrimitiveRightsHolderCascade,
          queryName: 'projectId',
          queryValue: 'projectId',
          prop: 'initialOwnersId',
          name: 'initialOwnersId',
          labelWidth: '170px'
        },
        // 批次信息
        {
          label: this.$i18n.messages[this.$i18n.locale].ladingPlanManageList.batchInfo,
          value: 'batchNo',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          cols: [24, 24, 24, 24],
          componentName: 'el-input',
          prop: 'batchNo',
          labelWidth: '170px'
        }
      ]
    }
  },
  mounted () {
  },
  computed: {
    api: function () {
      return ladingManageApi.ladingManageList
    }
  },
  methods: {
    selectChanged (obj, index) {
      if (obj.projectIdInfo) {
        this.form.projectName = obj.projectIdInfo.projectName
        this.clearInfoList()
      }
      if (obj.specialPlanIdInfo) {
        this.form.specialPlanPeriods = obj.specialPlanIdInfo.specialPlanPeriods
      }
      if (obj.coreEnterpriseIdInfo) {
        this.form.coreEnterpriseName = obj.coreEnterpriseIdInfo.enterpriseName
      }
      if (obj.planningManagerIdInfo) {
        this.form.planningManagerName = obj.planningManagerIdInfo.enterpriseName
      }
      if (obj.assetServiceIdInfo) {
        this.form.assetServiceName = obj.assetServiceIdInfo.enterpriseName
      }
      if (obj.initialOwnersIdInfo) {
        this.form.initialOwnersName = obj.initialOwnersIdInfo.enterpriseName
      }
      if (Object.keys(obj).some(it => it === 'projectIdInfo')) {
        this.clearInfoList()
        if (this.form.projectId) {
          this.getTypeById()
        } else {
          this.formRules.specialPlanId[0].required = true
          this.componentList[1].disabled = false
        }
      }
    },
    upload (file) {
      this.fm = new FormData()
      // this.form.fileName = file.name
      this.$set(this.form, 'fileName', file.name)
      // this.form.importSource = '10' // 导入来源
      this.$set(this.form, 'importSource', 10)
      this.fm.append('file', file)
      // this.form.file = file
    },
    save () {
      this.okBtnloading = true
      this.form.noticeStatus = '0'
      let $this = this
      delete this.form.file
      if (!this.form.specialPlanPeriods) {
        this.form.specialPlanPeriods = '0'
      }
      this.form.importSource = this.code
      this.form.userName = this.$store.state.user.user.userName
      let parmas = qs.stringify(this.form)
      ladingManageApi.ladingManageList.import(this.fm, parmas).then(res => {
        if (res && res.success && res.data) {
          $this.resultItem = Object.assign({}, res.data)
          $this.resultFlag = true
          $this.dialogVisible = false
          $this.$emit('close')
        } else {
          this.okBtnloading = false
          $this.error(this.$i18n.messages[this.$i18n.locale].ladingManageList.importFileFaile)
        }
      }).catch(res => {
        this.okBtnloading = false
      })
    },
    // 根据ID获取产品类别
    getTypeById () {
      componentsApi.productenterprise.getclassify({ projectId: this.form.projectId }).then(res => {
        this.form.isAbs = res.data ? res.data.productType : '2'
        this.formRules.specialPlanId[0].required = this.form.isAbs === '1'
        this.componentList[1].disabled = this.form.isAbs !== '1'
      })
    },
    clearInfoList () {
      delete this.form.specialPlanId
      delete this.form.coreEnterpriseId
      delete this.form.planningManagerId
      delete this.form.assetServiceId
      delete this.form.initialOwnersId
      this.$nextTick(() => {
        console.log('清空1')
        if (this.$refs.dialog && this.$refs.dialog.$refs.editForm) {
          this.$refs.dialog.$refs.editForm.clearValidate()
        }
      })
    }
  },
  watch: {
    dialogVisible (newVal) {
      if (newVal) {
        this.okBtnloading = false
      } else {
      }
    }
  }
}
</script>

<style lang="scss" scoped src="@/styles/shouji/ladingManage/importEdit.scss">
</style>
