import Vue from 'vue'
import Config from '../config'
const { formFileds, defaultFormFiled } = Config
const filedObj = formFileds.reduce((prev, item) => {
  const name = item.name.toLocaleLowerCase()
  if ('cmp' in item) {
    prev[name] = item.cmp
  } else {
    prev[name] = item
  }
  return prev
}, {})

export default Vue.extend({
  props: {
    type: {
      type: String,
      default: ''
    },
    props: {
      type: Object,
      default: () => ({})
    },
    value: undefined
  },
  render: function(h) {
    const self = this
    let cmp = defaultFormFiled
    if (self.type) cmp = filedObj[self.type.toLocaleLowerCase()]
    // console.log(self)
    return h(cmp, {
      props: { value: self.value, ...self.props },
      // attrs: {
      //   placeholder: self.props.placeholder
      // },
      // on: self.$listeners,
      attrs: self.props,
      on: {
        // ...self.$listeners,
        input: function(val) {
          self.$emit('input', val)
        },
        change: function(e) {
          self.$emit('change', e)
        }
      },
      nativeOn: {
        change: function(e) {
          self.$emit('change', e)
        }
      }
      // nativeOn: self.$listeners
    })
  }
})
