<template>
  <div
    class="dev-main-item"
    :data-ref="itemObj.ref"
    :data-type="itemObj.type"
    :style="{ width: (100/24*itemObj.options.span).toFixed(5) + '%'}"
    @click.stop="itemClick(itemObj)"
  >
    {{ itemObj.options.labelName }}
    <el-input
      v-model="itemObj.options.vModel"
      :type="itemObj.options.type"
      :name="itemObj.options.name"
      :label="itemObj.options.label"
      :placeholder="itemObj.options.placeholder"
      :clearable="itemObj.options.clearable"
      :disabled="itemObj.options.disabled"
      :readonly="itemObj.options.readonly"
      :show-word-limit="itemObj.options.showWordLimit"
    />
  </div>
</template>

<script>
import ApDevItemBase from './base/ApDevItemBase'

export default {
  name: 'ApDevInput',
  extends: ApDevItemBase,
  data() {
    return {}
  },
  created() {
    // 默认参数
    this.defaultOptions = {
      span: 12
    }
  },
  methods: {
    test() {
      console.log('item click')
    }
  }
}
</script>

<style scoped>

</style>
