Relation

Props

Prop name	Description	Type	Values	Default	Required
right		string()			true
route-fn		func()			true
icon		string()			false
fa		bool()			false
far		bool()			false
fas		bool()			false
fab		bool()			false

Slots

Name	Description	Bindings
icon	Use the icon-slot to override the icon	icon string - Returns the icon prop
default	Use the default slot for the text inside the Relation-component

---

edit on github

Relation

Example (dynamic) Recommended

In the following example you can see an implementation based on the useEntityObject data. It will automatically use the icon from the entities.json.

<template>
  <Relation :icon="usersIcon" fas />
  <Relation :icon="projectsIcon" fas />
</template>

<script>
import { defineRelation } from '@jdi/backoffice-library'
export default {
  setup(_, context) {
    const [usersIcon] = defineRelation(context, 'users')
    const [projectsIcon] = defineRelation(context, 'projects')

    return {
      usersIcon,
      projectsIcon
    }
  }
}
</script>

Example (manually, not recommended)

<template>
  <Relation> <i class="fas fa-user-card"></i> {{ $t('customers.relation.users') }} </Relation>
</template>

Example (static, not recommended)

<template>
  <Relation icon="fa-user-card" fas />
</template>