TabManager
A simple TabManager
component.
We will be using the following options:
js
const tabs = [
{ name: 'money', description: 'Yearly salary' },
{ name: 'personal', description: 'Personal information' }
]
- Yearly salary
- Personal information
html
<Card>
<TabManager :tabs="tabs" :defaultActive="0">
<template v-slot:money>
<InputNumber
class="mb-xs-4"
name="money"
label="Yearly salary"
placeholder="Enter your salary in € gross per year"
:validations="moneyValidations"
/>
</template>
<template v-slot:personal>
<InputText class="mb-xs-4" name="name" label="Name" :validations="['not-empty']" />
<InputText class="mb-xs-4" name="lastName" label="Last name" :validations="['not-empty']" />
</template>
</TabManager>
</Card>