mirror of
https://github.com/tenrok/vue-form-wizard.git
synced 2026-05-31 23:24:05 +03:00
cristijora
51 lines
1.0 KiB
Vue
51 lines
1.0 KiB
Vue
<template>
|
|
<div v-show="active" class="wizard-tab-container">
|
|
<slot>
|
|
</slot>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default{
|
|
name: 'tab-content',
|
|
props: {
|
|
title: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
/***
|
|
* Icon name for the upper circle corresponding to the tab
|
|
* Supports themify icons only for now.
|
|
*/
|
|
icon: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
/***
|
|
* Function to execute before tab switch. Return value must be boolean
|
|
* If the return result is false, tab switch is restricted
|
|
*/
|
|
beforeChange: {
|
|
type: Function
|
|
},
|
|
route: {
|
|
type: [String, Object]
|
|
}
|
|
},
|
|
data () {
|
|
return {
|
|
active: false,
|
|
validationError: null
|
|
}
|
|
},
|
|
mounted () {
|
|
this.$parent.addTab(this)
|
|
},
|
|
destroyed () {
|
|
if (this.$el && this.$el.parentNode) {
|
|
this.$el.parentNode.removeChild(this.$el)
|
|
}
|
|
this.$parent.removeTab(this)
|
|
}
|
|
}
|
|
</script>
|