nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-19 00:22:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

setup wizard refactoring

Browse Source
This commit is contained in:
Čarodej
2022-02-09 14:04:51 +01:00
parent a9e4daed35
commit a6940379cb
34 changed files with 548 additions and 1856 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
resources/js/views/SetupWizard/PurchaseCode.vue
View File

@@ -1,37 +1,36 @@
<template>
<AuthContentWrapper ref="auth">
<AuthContentWrapper ref="auth" class="h-screen bg-white">
<!--Licence Verify-->
<AuthContent name="licence-verify" :visible="true">
<Headline class="container mx-auto max-w-screen-sm" title="Setup Wizard" description="Please set your purchase code before continue to set up your application.">
<settings-icon size="40" class="title-icon text-theme mx-auto" />
<Headline title="Setup Wizard" description="Please set your purchase code before continue to set up your application.">
<settings-icon size="40" class="vue-feather text-theme mx-auto animate-[spin_5s_linear_infinite] mb-3" />
</Headline>
<ValidationObserver @submit.prevent="verifyPurchaseCode" ref="verifyPurchaseCode" v-slot="{ invalid }" tag="form" class="form inline-form">
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Purchase Code" rules="required" v-slot="{ errors }">
<input v-model="purchaseCode" placeholder="Paste your purchase code" type="text" :class="{ 'border-red': errors[0] }" />
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
<ValidationObserver @submit.prevent="verifyPurchaseCode" ref="verifyPurchaseCode" v-slot="{ invalid }" tag="form" class="mb-12 items-start space-y-4 md:flex md:space-x-4 md:space-y-0">
<ValidationProvider tag="div" mode="passive" class="w-full text-left" name="Purchase Code" rules="required" v-slot="{ errors }">
<input v-model="purchaseCode" placeholder="Paste your purchase code" type="text" class="focus-border-theme w-full appearance-none rounded-lg border border-transparent bg-light-background px-5 py-3.5 font-bold dark:bg-2x-dark-foreground" :class="{ 'border-red': errors[0] }" />
<span class="text-left text-xs text-red-600" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
<AuthButton icon="chevron-right" text="Verify" :loading="isLoading" :disabled="isLoading" />
<AuthButton icon="chevron-right" text="Verify" class="w-full justify-center md:w-min" :loading="isLoading" :disabled="isLoading" />
</ValidationObserver>
<p class="additional-link">
<a href="https://help.market.envato.com/hc/en-us/articles/202822600-Where-Is-My-Purchase-Code-" target="_blank"> Where I can find purchase code? </a>
<a class="black-link" href="https://codecanyon.net/item/vue-file-manager-with-laravel-backend/25815986" target="_blank"> Don’t have purchase code? </a>
<p class="block">
<a href="https://help.market.envato.com/hc/en-us/articles/202822600-Where-Is-My-Purchase-Code-" target="_blank" class="text-theme font-bold">Where I can find purchase code? </a>
<a class="black-link" href="https://codecanyon.net/item/vue-file-manager-with-laravel-backend/25815986" target="_blank">Don’t have purchase code? </a>
</p>
</AuthContent>
</AuthContentWrapper>
</template>
<script>
import AuthContentWrapper from '../../components/Auth/AuthContentWrapper'
import { ValidationProvider, ValidationObserver } from 'vee-validate/dist/vee-validate.full'
import AuthContentWrapper from '../../components/Auth/AuthContentWrapper'
import InfoBox from '../../components/Others/Forms/InfoBox'
import AuthContent from '../../components/Auth/AuthContent'
import AuthButton from '../../components/Auth/AuthButton'
import { SettingsIcon } from 'vue-feather-icons'
import { required } from 'vee-validate/dist/rules'
import Headline from '../Auth/Headline'
import { mapGetters } from 'vuex'
import axios from 'axios'
export default {
@@ -55,6 +54,10 @@ export default {
},
methods: {
async verifyPurchaseCode() {
if (this.$root.$data.config.isSetupWizardDemo) {
this.$router.push({name: 'Database'})
}
// Validate fields
const isValid = await this.$refs.verifyPurchaseCode.validate()
@@ -68,7 +71,7 @@ export default {
.post('/api/setup/purchase-code', {
purchaseCode: this.purchaseCode,
})
.then((response) => {
.then(() => {
// End loading
this.isLoading = false
@@ -81,11 +84,11 @@ export default {
// End loading
this.isLoading = false
if (error.response.status == 400) {
if (error.response.status === 400) {
this.$refs.verifyPurchaseCode.setErrors({
'Purchase Code': ['Purchase code is invalid.'],
})
} else if (error.response.status == 404) {
} else if (error.response.status === 404) {
this.$refs.verifyPurchaseCode.setErrors({
'Purchase Code': ['You may have misconfigured the app, please read the readme file and try it again.'],
})
@@ -99,26 +102,3 @@ export default {
},
}
</script>
<style scoped lang="scss">
@import '../../../sass/vuefilemanager/auth';
@import '../../../sass/vuefilemanager/setup_wizard';
.additional-link {
.black-link {
color: $text;
}
}
.auth-form input {
min-width: 380px;
}
.dark {
.additional-link {
.black-link {
color: $dark_mode_text_primary;
}
}
}
</style>