Breadcrumb Bone

Introducción

Éste componente no está encargado de renderizar, es de uso interno del componente IrBreadcrumb. Guía de uso parte lógica

Código fuente

<!-- eslint-disable vue/prop-name-casing -->
<script>
import { ref, watch, onMounted, h } from 'vue'
import {
  normalizeProps,
  assignCamelToSnake
} from '../../helpers/propsGenerator'
import { IrBreadcrumbName, externalDBEndpoint } from '../../constants'
import Vue from 'vue'
import fcnResponseHandler from '../../mixins/fcnResponseHandler' //mixin que importa handleError

const propsLocal = {
  sites_fcn: {
    type: String,
    required: false,
    default: ''
  },
  args_sites_fcn: {
    type: Array,
    default: () => []
  },
  sites: {
    type: Array,
    required: false,
    default: () => []
  },
  disabled: {
    type: Boolean,
    default: false
  },
  id_resolver: {
    type: String,
    default: ''
  },
  id_usuario: {
    type: String,
    default: ''
  }
}

const mergedProps = normalizeProps(propsLocal)

export default {
  name: IrBreadcrumbName + 'Bone',
  props: mergedProps,
  setup(props, { slots }) {
    const propError = Vue.prototype.$propError
    const iclAxios = Vue.prototype.$iclAxios
    const iclStore = Vue.prototype.$iclstore
    const detectResponseStructErrors = Vue.prototype.$detectResponseStructErrors
    const routeSites = ref([])
    const errored = ref(false)
    const getBreadcrumbSites = () => {
      iclAxios
        .post(externalDBEndpoint + props.sites_fcn, [
          JSON.stringify({
            args: props.args_sites_fcn,
            id_usuario: props.id_usuario
              ? props.id_usuario
              : iclStore.state.id_usuario,
            id_resolver: props.id_resolver
          })
        ])
        .then((r) => {
          detectResponseStructErrors(
            r,
            props.sites_fcn,
            ['text', 'value'],
            IrBreadcrumbName,
            '{text: String, value: String}',
            'https://icl.iridiumrobotics.com.ar/components/ir-breadcrumb.html#uso',
            props.id_resolver
          ) //En caso de detección de errores en la respuesta NO interrumpe la ejecución del componente, solo loguea.
          routeSites.value = r
        })
        .catch((error) => {
          console.log(error)
          errored.value = true
          fcnResponseHandler.methods.handleError(error, iclStore)
        })
    }

    watch(
      () => props.id_resolver,
      () => {
        getBreadcrumbSites()
      }
    )
    watch(
      () => props.id_usuario,
      () => {
        getBreadcrumbSites()
      }
    )

    assignCamelToSnake(mergedProps, props)

    onMounted(() => {
      propError(propsLocal, props, IrBreadcrumbName)
      if (props.sites_fcn && typeof props.sites_fcn === 'string')
        getBreadcrumbSites()
      else if (props.sites && Array.isArray(props.sites)) {
        routeSites.value = props.sites
      } else {
        console.log('No se encontraron datos válidos para ir-breadcrumb')
      }
    })
    return () => {
      return h('div', [
        slots.default({
          sites: props.sites,
          disabled: props.disabled
        })
      ])
    }
  }
}
</script>