
<script lang="ts">

import { Vue, Component, Prop, Ref, Provide, Inject } from 'vue-property-decorator'
import { CreateElement } from 'vue'
import { ControlDef } from '../type'
import GridControl from './layouts/GridControl.vue'
import TextControl from './fields/TextControl.vue'
import NumberControl from './fields/NumberControl.vue'
import TextareaControl from './fields/TextareaControl.vue'
import PlainControl from './fields/PlainControl.vue'
import SelectControl from './fields/SelectControl.vue'
import CascaderControl from './fields/CascaderControl.vue'
import RadioControl from './fields/RadioControl.vue'
import CheckboxControl from './fields/CheckboxControl.vue'
import DateControl from './fields/DateControl.vue'
import TimeControl from './fields/TimeControl.vue'
import UploadControl from './fields/UploadControl.vue'
import TableControl from './fields/TableControl.vue'
import CustomControl from './fields/CustomControl.vue'
import FileLinkControl from './fields/FileLinkControl.vue'

@Component({
  components: {
    GridControl,
    TextControl,
    NumberControl,
    TextareaControl,
    SelectControl,
    CascaderControl,
    RadioControl,
    CheckboxControl,
    DateControl,
    TimeControl,
    PlainControl,
    UploadControl,
    TableControl,
    CustomControl,
    FileLinkControl
  }
})
export default class FormControl extends Vue {
  @Prop() def!: ControlDef

  @Prop() rowForm!: Record<string, any>

  @Prop() prop!: string

  @Inject({ from: 'getRowForm', default: () => () => null }) getParentRowForm!: () => Record<string, any>

  @Inject({ from: 'getProp', default: () => () => null }) getParentProp!: () => string

  @Provide() getRowForm () {
    return this.rowForm === undefined ? this.getParentRowForm() : this.rowForm
  }

  @Provide() getProp () {
    return this.prop === undefined ? this.getParentProp() : this.prop
  }

  render (h: CreateElement) {
    const props = { def: this.def }
    return h(this.def.type + 'Control', { props })
  }
}
</script>
