<template>
  <dialog-edit :visible.sync="dialogVisible"
               :width="'1000px'"
               :editModel="editModel" :form="form" :title="$t('documentSealingTaskManage.productName')"
               :api="api" :footerBtnShow="false" :appendToBody="true">
    <search-form
      @handleFilter="handleFilter"
      @clearParam="clearParam"
      :formValue.sync="queryParas"
      :menuCode="menuId"
      searchPerms="searchPerms"
      :componentList="componentList"
      resetPerms="resetPerms">
    </search-form>
    <data-table
      :queryParas="queryParas"
      @selectRowChange="selectRowChange"
      operateBtnLayout=""
      :showSelection="true"
      :columns="columns"
      :sourceData="sourceData"
      :api="api"
      :loadCount="loadCount">
    </data-table>
    <template slot="footer">
      <auth-button size="medium" type="primary" :label="$t('documentSealingTaskManage.saveBtn')" @click="save"></auth-button>
      <auth-button size="medium" :label="$t('common.close')" @click="dialogVisible = false" :openPerms="false"></auth-button>
    </template>
  </dialog-edit>
</template>

<script>
import BasePage from '@/pages/baseEditPage'
import { searchForm, DataTable, DialogEdit, authButton } from 'newepoch-components'
import uninvoiceApi from '@/api/uninvoiceApi'
import componentsApi from '@/api/componentsApi'

export default {
  extends: new BasePage(),
  name: 'documentSealingTaskManageSelect',
  components: {
    searchForm,
    DataTable,
    DialogEdit,
    authButton
  },
  computed: {
    api () {
      return uninvoiceApi.customconfigpage
    }
  },
  props: {
    value: {
      type: Object,
      default: function () {
        return {}
      }
    }
  },
  data () {
    return {
      selectedRows: [],
      formValue: {},
      sourceData: [],
      loadCount: 0,
      queryParas: {
        pageIndex: 1,
        pageSize: 10
      },
      componentList: [
        {
          label: this.$i18n.messages[this.$i18n.locale].documentSealingTaskManage.productName,
          value: 'coreEnterpriseIds',
          componentName: 'el-input',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '160px',
          clearable: true
        }
      ],
      columns: [
        {
          prop: 'itemValue',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].documentSealingTaskManage.productName,
          format: (row) => {
            return row.itemValue
          }
        }
      ]
    }
  },
  methods: {
    selectRowChange (val) {
      if (val.length > 1) {
        this.warning('数据只能选择一条！')
      } else {
        this.selectedRows = val
      }
    },
    clearParam () {
      this.queryParas = {
        pageIndex: 1,
        pageSize: 10
      }
    },
    handleFilter () {
      this.loadCount = this.loadCount + 1
    },
    save () {
      if (this.selectedRows.length === 1) {
        this.$emit('selectedRows', this.form.prop, this.selectedRows)
        this.dialogVisible = false
      } else {
        this.warning('必须只能选择一条')
      }
    },
    loadAssestName () {
      uninvoiceApi.customconfigpage.getList().then(res => {
        res.data.forEach(it => {
          this.$set(it, 'itemValue', it.assetName)
        })
        this.sourceData = res.data
      })
    },
    loadcoreEnterprises () {
      componentsApi.productenterprise.getList({ enterpriseTypeList: ['60'] }).then(res => {
        res.data.forEach(it => {
          this.$set(it, 'itemValue', it.enterpriseName)
        })
        this.sourceData = res.data
      })
    },
    loadplanningManagerName () {
      componentsApi.productenterprise.getList({ enterpriseTypeList: ['110', '130'] }).then(res => {
        res.data.forEach(it => {
          this.$set(it, 'itemValue', it.enterpriseName)
        })
        this.sourceData = res.data
      })
    },
    loadperiods () {
      componentsApi.specialplaninfo.getInvoices(this.query).then(res => {
        res.data.forEach(it => {
          this.$set(it, 'itemValue', it.specialPlanPeriods)
        })
        this.sourceData = res.data
      })
    }
  },
  watch: {
    dialogVisible: {
      deep: true,
      immediate: true,
      handler (n, o) {
        if (n) {
          this.$nextTick(() => {
            this.sourceData = []
            if (this.form.prop === 'assetName') {
              console.log('加载资料')
              this.loadAssestName()
            }
            if (this.form.prop === 'coreEnterpriseName') {
              console.log('核心企业')
              this.loadcoreEnterprises()
            }
            if (this.form.prop === 'planningManagerName') {
              console.log('计划管理人/再保理银行')
              this.loadplanningManagerName()
            }
            if (this.form.prop === 'specialPlanPeriods') {
              console.log('期数')
              this.loadperiods()
            }
            this.columns.forEach(it => {
              this.$set(it, 'label', this.form.label)
            })
            this.componentList.forEach(it => {
              this.$set(it, 'label', this.form.label)
            })
          })
        }
      }
    }
  }
}
</script>

<style scoped>
</style>
