Time Picker Bone

Introducción

Componente lógico.

Código fuente

<script>
import { timePickerComponentName } from '../../../constants'
import { separateValidPositions } from '../../../mixins/comportamientoPositionCheck'
const validPositions = ['append', 'append-outer', 'label', 'prepend-inner']
const props = {
  value: {
    type: undefined,
    required: true
  },
  label: {
    type: String,
    default: ''
  },
  readonly: {
    type: Boolean,
    default: false
  },
  required: {
    type: Boolean,
    default: false
  },
  hideDetails: {
    type: undefined,
    default: 'auto'
  },
  clearable: {
    type: String
  },
  id_resolver: {
    type: String
  },
  comportamientos: {
    type: Array,
    required: false
  }
}
import {
  normalizeProps,
  assignCamelToSnake
} from '../../../helpers/propsGenerator'
const mergedProps = normalizeProps(props)
export default {
  name: timePickerComponentName + 'Bone',
  props: mergedProps,
  data() {
    return {
      rulesLocal: [],
      usedPosition: [],
      error: true,
      structureError: false
    }
  },
  mounted() {
    this.structureError = this.$propError(
      props,
      this.$props,
      timePickerComponentName
    )
    if (this.structureError) {
      this.$iclstore.commit('updateSnack', {
        text: 'Ha ocurrido un error al cargar el sitio',
        active: true,
        color: 'error'
      })
    }
    this.usedPosition = separateValidPositions(
      this.comportamientos,
      validPositions,
      timePickerComponentName,
      this.id_resolver,
      this.$logError
    ) // Valida las posiciones válidas para comportamientos
  },
  created() {
    assignCamelToSnake(mergedProps, this)
    this.rulesLocal = this.$rulesGenerator(this.required, undefined)
  },
  render() {
    if (this.structureError) {
      return
    }
    return this.$scopedSlots.default({
      placeholder: this.placeholder,
      pattern: this.pattern,
      readonly: this.readonly,
      rules: this.rulesLocal,
      required: this.required,
      comportamientoEvents: {
        changeFieldValue: (e) => {
          this.$emit('input', e)
        },
        'close-dialog': (e) => {
          this.$emit('close-dialog', e)
        },
        refresh: () => {
          this.$emit('refresh')
        }
      },
      hideDetails: this.hideDetails,
      label: this.label,
      comportamientos: this.comportamientos,
      error: this.error,
      comportamientosPositions: this.usedPosition
        ? this.usedPosition.filter((x) => x !== 'append')
        : this.usedPosition,
      clearable: this.clearable
    })
  }
}
</script>