<template>
  <el-select
    slot="prepend"
    v-model="value"
    :placeholder="title"
    :multiple="multiple"
    clearable
    filterable
    :size="size"
    @change="updateValue"
  >
    <el-option
      v-for="item in data"
      :key="item.Id"
      :label="item.Name"
      :value="item.Id"
    />
  </el-select>
</template>
<script>
import { GetByUrl } from '@/api/enum/enums'
export default {
  name: 'Enums',
  props: ['model', 'title', 'enumName', 'multiple', 'size', 'url'],
  data() {
    return {
      data: [],
      value: ''
    }
  },
  watch: {
    'model'(newVal, oldVal) {
      this.value = newVal
    }
  },
  mounted() {
    this.value = this.model
    GetByUrl(this.url, this.enumName).then(r => { this.data = r })
  },
  methods: {
    updateValue(v) {
      this.$emit('update:model', v)
      this.$emit('change', v)
    }

  }
}
</script>
