Skip to main content

AdminForthFieldComponents

Properties​

create?​

optional create: AdminForthComponentDeclaration

Create component is used to redefine input field in create view. Component accepts next properties: [record, column, resource, adminUser].

edit?​

optional edit: AdminForthComponentDeclaration

Edit component is used to redefine input field in edit view. Component accepts next properties: [record, column, resource, adminUser].

list?​

optional list: AdminForthComponentDeclaration

List component is used to redefine cell which renders field value in list view. Component accepts next properties: [record, column, resource, adminUser]. Component can emit events:

  • update:value - to update record value.
  • update:inValidity - emit true once entered value became not valid (e.g. emit('update:inValidity', true) ). Emit false once entered value became valid. Emit default value in mounted hook.
  • update:emptiness - emit true once entered value became empty (e.g. emit('update:emptiness', true) ). Emit false once entered value became not empty. Emit default value in mounted hook. emptiness emit is optional and required for complex cases. For example for virtual columns where initial value is not set.

show?​

optional show: AdminForthComponentDeclaration

Show component is used to redefine cell which renders field value in show view. Component accepts next properties: [record, column, resource, adminUser, meta].

Example: FullName.vue

<template>
  {{ record.firstName }} {{ record.lastName }}
</template>

<script setup>
defineProps(['record']);
</script>

```ts
{
 label: 'Full Name',
 virtual: true,
 showIn: [AdminForthResourcePages.SHOW, AdminForthResourcePages.LIST],
 components: {
  show: '@@/FullName.vue',
  list: '@@/FullName.vue',
 },
}

showRow?​

optional showRow: AdminForthComponentDeclaration

showRow component is similar to AdminForthFieldComponent.show but rewrites full table row (both <td> tags) Accepts next properties: [record, column, resource, adminUser]