<template>
  <div>
    <tree-select :value.sync="inputValue" :size="size" :items="items" :placeholder="placeholder" :inputName="inputName" :clearable="clearable" :disabled="disabled" :width="width" @click-change="clickChange"></tree-select>
  </div>
</template>

<script>
// 树形选择器
import TreeSelect from '@src/components/TreeSelect.vue'
export default {
  data() {
    return {
      isOpenTree: false,
      items: []
    }
  },
  watch: {
    async contentType(val) {
      let params = {
        siteID: this.siteID,
        contentType: this.contentType,
        parentID: this.parentID,
        type: this.type
      }
      let bindEditorTree = await axios.get('/ui/catalog/bindeditortree', {
        params: params
      })
      this.items = bindEditorTree.data.data
    }
  },
  methods: {
    wrapClickHandler() {
    // console.log("aaa")
      if (this.disabled) {
        return
      }
      this.isOpenTree = !this.isOpenTree
    },
    clickChange(val) {
      this.$emit('click-change', val)
    }
  },
  props: [
    'size', // 大小
    'value', // key值，一般为Id
    'placeholder', // 占位符
    'disabled', // 是否可用
    'inputName', // 输入框默认显示的数据
    'siteID', // 站点ID
    'contentType', // 内容类型
    'parentID', // 父节点id
    'type', // 类型
    'clearable', // 是否可以情空
    'width'
  ],
  components: {
    'tree-select': TreeSelect
  },
  computed: {
    inputValue: {
      get() {
        return this.value
      },
      set(val) {
        this.$emit('update:value', val)
      }
    }
  }
}
</script>
