<!-- 律所下拉框 -->
<template>
  <el-select v-model="currentValue" :placeholder="placeholder" @change="selectChanged" filterable :disabled="disabled"
             size="mini">
    <el-option v-for="item in options" :key="item.userId" :label="item.nickName" :value="item.userId"
    ></el-option>
  </el-select>
</template>

<script>
import chargebackApi from '@/api/chargeback'

export default {
  props: {
    // v-model绑定的数据
    value: {
      type: [Array, String],
      default: function () {
        return null
      }
    },
    currentCode: {
      type: String,
      default: () => null
    },
    // 是否禁用修改
    disabled: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    // 是否可搜索
    filterable: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    // 是否可清除
    clearable: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    // 默认提示语
    placeholder: {
      type: String,
      default: function () {
        return '请选择'
      }
    }
  },
  data () {
    return {
      checkedCode: null
    }
  },
  computed: {
    sourceData () {
      return this.$store.getters.sourceUSer
    },
    // 转换绑定的选中数据，与v-model同步
    options () {
      if (this.checkedCode !== this.currentCode && this.checkedCode !== null) {
        this.$emit('set-null')
      }
      let newArray = []
      let index = this.sourceData.findIndex(item => {
        return item.roleName === this.currentCode
      })
      if (index !== -1) {
        return this.sourceData[index].userList
      }
      return newArray
    },
    currentValue: {
      get: function () {
        return this.value
      },
      set: function (value) {
        this.$emit('input', value)
      }
    },
    api: function () {
      return chargebackApi.dataApi
    }
  },
  methods: {
    selectChanged: function (key) {
      let selectItem = this.options.find(it => {
        return key === it.userId
      })
      this.checkedCode = this.currentCode
      this.$emit('select-changed', key, this.currentCode, selectItem)
    }
  }
}
</script>
