<template>
  <div>
<!--    @visible-change="getreMoteData"-->
    <el-select v-model="currentValue" @change="selectChanged" ref="select" @visible-change="openClose">
      <el-option v-for="item in valueOptions" :key="item[keyName]" :label="item[valueName]" :value="item[keyName]"></el-option>
    </el-select>
  </div>
</template>

<script>
import components from 'newepoch-components'
import uninvoiceApi from '@/api/uninvoiceApi'
export default {
  name: 'SelectKdFileName',
  components: {
    BaseSelect: components.BaseSelect
  },
  props: {
    // v-model绑定的数据
    value: {
      type: [Array, String],
      default: function () {
        return null
      }
    },
    // option: {
    //   type: [Object, Array],
    //   default: function () {
    //     return []
    //   }
    // },
    exPend: {
      type: [Object, Array],
      default: function () {
        return []
      }
    }
  },
  data () {
    return {
      queryParas: {},
      selectedField: ['keyId', 'materialFileName'],
      valueOptions: null
    }
  },
  computed: {
    valueName () {
      return this.selectedField[1]
    },
    keyName () {
      return this.selectedField[0]
    },
    // valueOptions: {
    //   get: function () {
    //     return this.option
    //   },
    //   set: function (newVal) {
    //     this.$emit('update:option', newVal)
    //   }
    // },
    currentValue: {
      get: function () {
        return this.value
      },
      set: function (newVal) {
        this.$emit('update:value', newVal)
      }
    },
    api () {
      return uninvoiceApi.materialFile
    }
  },
  methods: {
    openClose (isOpen) {
      if (isOpen) {
        let temp = this.valueOptions.filter(it => {
          return !this.exPend.some(it1 => it1 !== it.keyId)
        })
        this.valueOptions = temp
      }
    },
    selectChanged (selectItems) {
      let that = this
      let row = {}
      let rows = that.valueOptions.filter(it => {
        return it.keyId === selectItems
      })
      row = rows.length === 1 ? rows[0] : []
      that.$emit('selectChanged', that.$attrs, selectItems, row)
    },
    // 供外部调用
    setQueryParas (queryParas) {
      this.queryParas = queryParas
      this.getreMoteData()
    },
    getreMoteData () {
      let that = this
      this.api.kuaidiFileGet(that.queryParas).then((res) => {
        if (res.data) {
          let data = []
          res.data.forEach((it) => {
            data.push({
              fileCode: it.projectMaterialFileDTO.fileCode,
              fileName: it.projectMaterialFileDTO.fileName,
              fileSource: it.projectMaterialFileDTO.fileSource,
              materialFileId: it.projectMaterialGroupDetailDTO.materialFileId,
              keyId: it.projectMaterialGroupDetailDTO.keyId,
              materialFileName: it.projectMaterialGroupDetailDTO.materialFileName,
              materialGroupId: it.projectMaterialGroupDetailDTO.materialGroupId
            })
          })
          that.valueOptions = data
        }
      }).finally((res) => {
        if (this.valueOptions.length === 0) {
          this.noDataText = '无数据'
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
