<!--区域单选列表，懒加载-->
<template>
  <div>
    <el-input
      :value="text"
      :size="size"
      type="text"
      placeholder="请选择所在区域"
      suffix-icon="el-icon-arrow-down"
      @focus="openAreaSelect"/>
    <area-select-dialog ref="areaSelect" :need-full="needFull" @selectDone="changeParent"/>
  </div>
</template>

<script>
import AreaSelectDialog from './areaSelectDialog'
export default {
  name: 'AreaSelectInput',
  components: { AreaSelectDialog },
  props: {
    size: {
      type: String,
      default: ''
    },
    needFull: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      text: ''
    }
  },
  methods: {
    openAreaSelect() {
      setTimeout(this.$refs.areaSelect.initDialog(), 200)
    },
    changeParent(node) {
      // this.node = node
      this.text = node.fullName
      this.$emit('selectnode', node)
    }
  }
}
</script>

<style scoped>

</style>

<style rel="stylesheet/scss" lang="scss">
  .area-select-dialog{
    width: 400px;
    .el-scrollbar__wrap{
      overflow-x: hidden !important;
    }
  }
</style>