primevue-mirror/components/lib/stepper/Stepper.vue

51 lines
1.2 KiB
Vue
Raw Normal View History

2024-02-13 06:22:45 +00:00
<template>
<div :class="cx('root')" role="tablist" v-bind="ptmi('root')">
<slot v-if="$slots.start" name="start" />
<slot />
2024-02-13 06:22:45 +00:00
<slot v-if="$slots.end" name="end" />
</div>
</template>
<script>
import { UniqueComponentId } from 'primevue/utils';
import BaseStepper from './BaseStepper.vue';
export default {
name: 'Stepper',
extends: BaseStepper,
2024-02-21 09:05:55 +00:00
inheritAttrs: false,
emits: ['update:value'],
2024-02-13 06:22:45 +00:00
data() {
return {
id: this.$attrs.id,
d_value: this.value
2024-02-13 06:22:45 +00:00
};
},
watch: {
'$attrs.id'(newValue) {
2024-04-16 09:35:02 +00:00
this.id = newValue || UniqueComponentId();
2024-02-13 06:22:45 +00:00
},
value(newValue) {
this.d_value = newValue;
2024-02-13 06:22:45 +00:00
}
},
2024-04-16 09:35:02 +00:00
mounted() {
this.id = this.id || UniqueComponentId();
},
2024-02-13 06:22:45 +00:00
methods: {
updateValue(newValue) {
if (this.d_value !== newValue) {
this.d_value = newValue;
this.$emit('update:value', newValue);
2024-02-13 06:22:45 +00:00
}
},
isStepActive(value) {
return this.d_value === value;
2024-02-13 06:22:45 +00:00
},
isStepDisabled() {
return this.linear;
2024-02-13 06:22:45 +00:00
}
}
};
</script>