<template>
  <div :class="[componentClass, getFormatTypeClass]">
    {{value}}
  </div>
</template>

<script>
const props = {
  text: {
    type: String,
    default: null
  },
  dataFieldIdent: {
    type: String,
    default: null
  },
  formatType: {
    type: String,
    default: "none"
  }
}
import controlUtils from '../classes/controlUtils'
import base from './c-base'
export default {
  extends: base,
  data: function () {
    return {
      componentClass: 'c-textblock'
    }
  },
  props,
  computed: {
    getFormatTypeClass: function () {
      return this.formatType !== "none" ? controlUtils.checkFormatType(this.formatType).formatTypeClass : null
    },
    getType: function () {
      if (this.type == null) {
        let formatType = controlUtils.checkFormatType(this.formatType)
        return formatType.type
      }
      return this.type
    },
    value: function () {
      if (this.text !== null) {
        return this.text
      }
      if(this.formatType) {
        return this.formatValue(this.dataFieldValue, this.formatType)
      } else {
        return this.dataFieldValue
      }
    }
  }
}</script>