<template>
  <el-select v-model="selectedVal" placeholder="请选择" clearable :disabled="selectDisabled" @change="onChange">
    <el-option
      v-for="x in options"
      :key="x.value"
      :label="x.label"
      :value="x.value"
    />
  </el-select>
</template>

<script>
// import { searchView } from '@/api/dxView'
export default {
  name: 'SiteSelect',
  componentName: '站点选择器',
  props: {
    value: {
      type: [Number, String],
      default: ''
    },
    form: {
      type: Object,
      default: null
    },
    // formItem的配置项
    item: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      selectedVal: null,
      options: []
    }
  },
  computed: {
    selectDisabled() {
      return !!(this.item && this.item.component.disabled)
    }
  },
  watch: {
    value: {
      immediate: true,
      handler: function(val) {
        this.selectedVal = val || ''
      }
    },
    form: {
      immediate: true,
      deep: true,
      handler: function(val) {
        if (val.sourceId) {
          this.getData(val.sourceId)
        }
      }
    }
  },
  mounted() {

  },
  methods: {
    getData(id) {
      const searchForm = {
        'pageFrom': 0,
        'pageSize': 9999,
        'parentFilter': true,
        'searchItems': {
          'items': [
            {
              'fieldName': 'id',
              'operator': 'NEQ',
              'value': id
            }
          ],
          'operator': 'AND'
        }
      }
      this.$api.searchApi('RepoSite', searchForm).then(res => {
        this.options = res.items.content.map(r => {
          return {
            label: r.name,
            value: r.id,
            row: r
          }
        })
      }).catch(() => {
        this.$message.error('获取数据失败')
      })
    },
    onChange(val) {
      this.$emit('input', val)
    }
  }
}
</script>