#39 add langs

Author: Arenukvern

src/App.vue

@@ -16,7 +16,78 @@
 			:steps="steps"
 			:options="{ highlight: true }"
 			:callbacks="tourCallbacks"
-		></v-tour>
+		>
+			<template slot-scope="tour">
+				<v-step
+					v-for="(step, index) of tour.steps"
+					v-if="tour.currentStep === index"
+					:key="index"
+					:step="step"
+					:previous-step="tour.previousStep"
+					:next-step="tour.nextStep"
+					:stop="tour.stop"
+					:is-first="tour.isFirst"
+					:is-last="tour.isLast"
+					:labels="tour.labels"
+					:highlight="tour.highlight"
+				>
+					<template v-if="tour.isFirst">
+						<div slot="actions">
+							<button
+								@click="tour.stop"
+								class="v-step__button v-step__button-skip"
+							>
+								{{ $t('buttons.skipTutorial') }}
+							</button>
+							<button
+								@click="tour.nextStep"
+								class="v-step__button v-step__button-next"
+							>
+								{{ $t('buttons.nextStep') }}
+							</button>
+						</div>
+					</template>
+					<template v-if="!tour.isFirst && !tour.isLast">
+						<div slot="actions">
+							<button
+								@click="tour.stop"
+								class="v-step__button v-step__button-skip"
+							>
+								{{ $t('buttons.skipTutorial') }}
+							</button>
+							<button
+								@click="tour.previousStep"
+								class="v-step__button v-step__button-previous"
+							>
+								{{ $t('buttons.previousStep') }}
+							</button>
+							<button
+								@click="tour.nextStep"
+								class="v-step__button v-step__button-next"
+							>
+								{{ $t('buttons.nextStep') }}
+							</button>
+						</div>
+					</template>
+					<template v-if="tour.isLast">
+						<div slot="actions">
+							<button
+								@click="tour.previousStep"
+								class="v-step__button v-step__button-previous"
+							>
+								{{ $t('buttons.previousStep') }}
+							</button>
+							<button
+								@click="tour.stop"
+								class="v-step__button v-step__button-stop"
+							>
+								{{ $t('buttons.finishTour') }}
+							</button>
+						</div>
+					</template>
+				</v-step>
+			</template>
+		</v-tour>
 	</div>
 </template>
 <script lang="ts">

src/LogicCore/Languages/Languages.ts

@@ -59,7 +59,11 @@ export interface LangFile extends LocaleMessageObject{
     },
 	buttons: {
 		yes: string
-		no: string
+        no: string
+        skipTutorial: string
+        previousStep: string
+        nextStep: string
+        finishTour: string
     }
     alerts: {
         successfulSync: string

src/LogicCore/Languages/_eng.ts

@@ -66,7 +66,11 @@ export const eng: LangFile = {
 	},
 	buttons: {
 		yes: 'Yes',
-		no: 'No'
+		no: 'No',
+		skipTutorial: 'Skip tutorial',
+        previousStep: 'Previous',
+        nextStep: 'Next',
+        finishTour: 'Finish',
 	},
 	alerts: {
 		successfulSync: 'Synced successfully!', 

src/LogicCore/Languages/_rus.ts

@@ -67,7 +67,11 @@ export const rus: LangFile = {
 	},
 	buttons: {
 		yes: 'Да',
-		no: 'Нет'
+		no: 'Нет',
+		skipTutorial: 'Пропустить обучение',
+        previousStep: 'Назад',
+        nextStep: 'Дальше',
+        finishTour: 'Завершить',
 	},
 	alerts: {
 		successfulSync: 'Успешно синхронизировано!',