feat: add enabledButtons new props (all true by default) which can

enable or disable the buttons of vue tour
pulsardev · Nov 18, 2019 · 1354557 · 1354557
1 parent c704b5e
commit 1354557
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 4 deletions.
diff --git a/src/components/VStep.vue b/src/components/VStep.vue
@@ -15,10 +15,10 @@
 
     <slot name="actions">
       <div class="v-step__buttons">
-        <button @click.prevent="stop" v-if="!isLast" class="v-step__button">{{ labels.buttonSkip }}</button>
-        <button @click.prevent="previousStep" v-if="!isFirst" class="v-step__button">{{ labels.buttonPrevious }}</button>
-        <button @click.prevent="nextStep" v-if="!isLast" class="v-step__button">{{ labels.buttonNext }}</button>
-        <button @click.prevent="stop" v-if="isLast" class="v-step__button">{{ labels.buttonStop }}</button>
+        <button @click.prevent="stop" v-if="!isLast && checkEnabledButtons('buttonSkip')" class="v-step__button">{{ labels.buttonSkip }}</button>
+        <button @click.prevent="previousStep" v-if="!isFirst && checkEnabledButtons('buttonPrevious')" class="v-step__button">{{ labels.buttonPrevious }}</button>
+        <button @click.prevent="nextStep" v-if="!isLast && checkEnabledButtons('buttonNext')" class="v-step__button">{{ labels.buttonNext }}</button>
+        <button @click.prevent="stop" v-if="isLast && checkEnabledButtons('buttonStop')" class="v-step__button">{{ labels.buttonStop }}</button>
       </div>
     </slot>
 
@@ -55,6 +55,9 @@ export default {
     },
     labels: {
       type: Object
+    },
+    enabledButtons: {
+      type: Object
     }
   },
   data () {
@@ -104,6 +107,9 @@ export default {
         console.error('[Vue Tour] The target element ' + this.step.target + ' of .v-step[id="' + this.hash + '"] does not exist!')
         this.$emit('targetNotFound', this.step)
       }
+    },
+    checkEnabledButtons (name) {
+      return this.enabledButtons.hasOwnProperty(name) ? this.enabledButtons[name] : true
     }
   },
   mounted () {

diff --git a/src/components/VTour.vue b/src/components/VTour.vue
@@ -9,6 +9,7 @@
       :is-first="isFirst"
       :is-last="isLast"
       :labels="customOptions.labels"
+      :enabled-buttons="customOptions.enabledButtons"
     >
       <!--Default slot {{ currentStep }}-->
       <v-step
@@ -22,6 +23,7 @@
         :is-first="isFirst"
         :is-last="isLast"
         :labels="customOptions.labels"
+        :enabled-buttons="customOptions.enabledButtons"
       >
         <!--<div v-if="index === 2" slot="actions">
           <a @click="nextStep">Next step</a>

diff --git a/src/shared/constants.js b/src/shared/constants.js
@@ -13,6 +13,12 @@ export const DEFAULT_OPTIONS = {
     buttonPrevious: 'Previous',
     buttonNext: 'Next',
     buttonStop: 'Finish'
+  },
+  enabledButtons: {
+    buttonSkip: true,
+    buttonPrevious: true,
+    buttonNext: true,
+    buttonStop: true
   }
 }