<template>
  <component ref="component" :is="component" />
</template>

<script>
const map = {
  IMAGE: 'ImageInput',
  LINK: 'LinkInput',
  IMAGE_LINK: 'ImageLinkInput'
}
import ImageInput from './ImageInput'
import LinkInput from './LinkInput'
import ImageLinkInput from './ImageLinkInput'
export default {
  name: 'ResourceInput',
  components: {
    ImageInput,
    LinkInput,
    ImageLinkInput
  },
  props: {
    // 资源类型
    type: {
      required: true
    }
  },
  computed: {
    component () {
      let targetComponent = this.$options.components[map[this.type]]
      if (targetComponent == null) {
        throw new Error(`未能匹配资源类型 ${this.type}`)
      }
      return targetComponent
    }
  },
  methods: {
    // 输入验证
    validate () {
      if (this.$refs.component.validate) {
        return this.$refs.component.validate()
      }
      return Promise.resolve()
    }
  }
}
</script>
