<!--词汇-联级选中框-->
<template>
  <el-cascader
    v-model="optionValue"
    :options="options"
    :placeholder="placeholder"
    :props="props"
    @change="changeNode"
  ></el-cascader>
</template>

<script>
import { getVocabulary } from '../../api/system/vocabulary'

export default {
  name: 'VocabularyCascader',
  props: {
    value: {
      value: {}
    },
    code: {
      type: String,
      required: true
    },
    emitPath: {
      type: Boolean,
      default: false
    },
    multiple: {
      type: Boolean,
      default: false
    },
    placeholder: {
      type: String,
      default: '请选择'
    }
  },
  data() {
    return {
      optionValue: null,
      options: [],
      props: {
        value: 'id',
        label: 'name',
        emitPath: this.emitPath,
        multiple: this.multiple
      }
    }
  },
  watch: {
    value(value) {
      this.optionValue = value
    }
  },
  created() {
    this.getVocabulary()
  },
  methods: {
    getVocabulary() {
      getVocabulary(this.code).then((response) => {
        this.options = response.data
      })
    },
    changeNode(value) {
      this.$emit('input', value)
      this.$emit('change')
    }
  }
}
</script>

<style scoped>

</style>
