<template>
  <div>
    <el-select :clearable="clearable" v-model="currentValue"
               :collapse-tags="tags"
               :filterable="filterable"
               :multiple="multiple"
               :style="{ width : width}"
               :size="size"
               @change="selectChanged"
               :disabled="currentDisabled" :placeholder="placeholder" no-data-text="无数据">
      <el-option v-for="item in options" :key="item.dictId" :label="item.dictName" :value="item.dictId" :disabled="item.disabled">
      </el-option>
    </el-select>
  </div>
</template>

<script>
export default {
  props: {
    tags: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    value: {
      type: [Number, String, Array],
      default: function () {
        return null
      }
    },
    size: {
      type: String,
      default: function () {
        return 'medium'
      }
    },
    disabled: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    // 是否可搜索
    filterable: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    clearable: {
      type: Boolean,
      default: function () {
        return true
      }
    },
    multiple: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    addItems: {
      type: Array,
      default: function () {
        return null
      }
    },
    exclude: {
      type: Array,
      default: function () {
        return []
      }
    },
    placeholder: {
      type: String,
      default: function () {
        return '请选择'
      }
    },
    dictTypeCode: {
      type: [String, Number],
      default: function () {
        return ''
      }
    },
    sys: { // TODO 子系统，目前未区分
      type: [String, Number],
      default: function () {
        return null
      }
    },
    // 重新加载数据（每次取非即可）
    reload: {
      type: Boolean,
      default: function () {
        return false
      }
    },
    width: {
      type: String,
      default: function () {
        return '100%'
      }
    },
    name: {
      type: String
    },
    // 缓存调用组件传递的数据，change事件抛出
    bufferParams: {
      type: Object,
      default: function () {
        return null
      }
    },
    disabledOptions: {
      type: Array,
      default: function () {
        return []
      }
    }
  },
  data: function () {
    return {
      currentDisabled: this.disabled,
      options: null,
      count: 0,
      oldValue: null
    }
  },
  mounted () {
    this.$nextTick(function () {
      this.loadOptions()
    })
  },
  computed: {
    optionValues: {
      get: function () {
        return this.options
      },
      set: function (options) {
        let exclueds = this.exclude || []
        // 过滤要排除的
        let tmpOpts
        if (options) {
          if (exclueds && exclueds.length > 0) {
            tmpOpts = options.filter(item => {
              return !exclueds.some(e => e.dictId === item.dictId)
            })
          } else {
            tmpOpts = options
          }
        } else {
          this.options = []
          return
        }
        // 先添加要追加的
        if (this.addItem && this.addItem.length > 0) {
          tmpOpts.push(this.addItem)
        }
        tmpOpts.forEach(it => {
          if (this.disabledOptions.length > 0) {
            if (this.disabledOptions.some(it1 => it1.dictId === it.dictId)) {
              this.$set(it, 'disabled', false)
            } else {
              this.$set(it, 'disabled', true)
            }
          } else {
            this.$set(it, 'disabled', false)
          }
        })
        this.options = tmpOpts
      }
    },
    currentValue: {
      get: function () {
        return this.buildCurrentValue(this.value)
      },
      set: function (value) {
        this.$emit('input', value)
      }
    }
  },
  methods: {
    loadOptions: function () {
      let $this = this
      if (this.dictTypeCode && this.dictTypeCode !== '') {
        this.$store.dispatch('GetDictionary', { sys: this.sys, dictTypeCode: this.dictTypeCode }).then(res => {
          res.sort((a, b) => a.sortNo - b.sortNo)
          $this.optionValues = JSON.parse(JSON.stringify(res))
          this.getSelectChange(res)
        })
      }
    },
    buildCurrentValue: function (value) {
      if (this.multiple && !this.UtilJs.isEmpty(value)) {
        return value
      }
      if (this.multiple && this.UtilJs.isEmpty(value)) {
        return []
      }
      return value
    },
    selectChanged: function (key) {
      var $this = this
      var selectItems = null
      if (this.count === 0) {
        $this.oldValue = $this.currentValue
        $this.count++
      }
      if (!this.multiple) {
        selectItems = this.optionValues.find(it => {
          return key === it['dictId']
        })
      } else {
        selectItems = []
        key.forEach(dictId => {
          let selectItem = this.optionValues.find(it => {
            return dictId === it['dictId']
          })
          selectItems.push(selectItem)
        })
      }
      if (!$this.UtilJs.isEmpty($this.name)) {
        $this.$emit('selectChanged', key, $this.name, selectItems, this.bufferParams)
      }
    },
    getSelectChange (val) {
      let $this = this
      let selectItems = null
      if (val.length > 0) {
        if (!this.multiple) {
          selectItems = val.find(it => {
            return $this.currentValue === it['dictId']
          })
        } else {
          selectItems = val.filter(it => {
            var isTrue = false
            $this.currentValue.forEach(kit => {
              if (kit === it['dictId']) {
                isTrue = true
              }
            })
            return isTrue
          })
        }
        if (!$this.UtilJs.isEmpty($this.name)) {
          this.$emit('selectChanged', '', this.name, selectItems, this.bufferParams)
        }
      }
    }
  },
  watch: {
    disabled: function (value) {
      this.currentDisabled = value
    },
    // 重载数据
    reload: function () {
      this.loadOptions()
    }
  }
}
</script>

<style scoped>

</style>
