31 lines
1.2 KiB
Vue
31 lines
1.2 KiB
Vue
|
<template>
|
||
|
|
<component v-if="template" :is="template" :index="index" :active="active" :highlighted="highlighted" :class="cx('stepper.action')" :clickCallback="(event) => clickCallback(event, index)" />
|
||
|
|
<button v-else :id="id" :class="cx('stepper.action')" role="tab" :tabindex="disabled ? -1 : undefined" :aria-controls="ariaControls" @click="clickCallback($event, index)" v-bind="getStepPT(stepperpanel, 'action', index)">
|
||
|
|
<span :class="cx('stepper.number')" v-bind="getStepPT(stepperpanel, 'number', index)">{{ index + 1 }}</span>
|
||
|
|
<span :class="cx('stepper.title')" v-bind="getStepPT(stepperpanel, 'title', index)">{{ getStepProp(stepperpanel, 'header') }}</span>
|
||
|
|
</button>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import BaseComponent from 'primevue/basecomponent';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'StepperHeader',
|
||
|
|
hostName: 'Stepper',
|
||
|
|
extends: BaseComponent,
|
||
|
|
props: {
|
||
|
|
id: null,
|
||
|
|
template: null,
|
||
|
|
stepperpanel: null,
|
||
|
|
index: null,
|
||
|
|
disabled: null,
|
||
|
|
active: null,
|
||
|
|
highlighted: null,
|
||
|
|
ariaControls: null,
|
||
|
|
clickCallback: null,
|
||
|
|
getStepPT: null,
|
||
|
|
getStepProp: null
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|