mirror of
https://github.com/VueFileManager/vuefilemanager.git
synced 2026-04-24 18:00:40 +00:00
setup wizard update
This commit is contained in:
carodej
@@ -113,7 +113,7 @@
|
||||
},
|
||||
computed: {
|
||||
submitButtonText() {
|
||||
return this.isLoading ? 'Testing Database Connection' : 'Test your Connection and Continue'
|
||||
return this.isLoading ? 'Testing and Installing Database' : 'Test Connection and Install Database'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@@ -170,7 +170,7 @@
|
||||
this.isLoading = false
|
||||
|
||||
// Redirect to next step
|
||||
this.$router.push({name: 'SubscriptionService'})
|
||||
this.$router.push({name: 'InstallationDisclaimer'})
|
||||
})
|
||||
.catch(error => {
|
||||
|
||||
|
||||
@@ -0,0 +1,165 @@
|
||||
<template>
|
||||
<AuthContentWrapper ref="auth">
|
||||
|
||||
<!--Database Credentials-->
|
||||
<AuthContent name="database-credentials" :visible="true">
|
||||
<div class="content-headline">
|
||||
<settings-icon size="40" class="title-icon"></settings-icon>
|
||||
<h1>Setup Wizard</h1>
|
||||
<h2>Database was installed successfully. Let's set up application, Make sure you have these informations before continue:</h2>
|
||||
</div>
|
||||
|
||||
<div id="loader" v-if="isLoading">
|
||||
<Spinner></Spinner>
|
||||
</div>
|
||||
|
||||
<div class="form block-form" v-if="! isLoading">
|
||||
<InfoBox>
|
||||
<ul v-if="isExtended" style="margin-top: 0" class="information-list">
|
||||
<li>
|
||||
1. Stripe API Credentials
|
||||
</li>
|
||||
<li>
|
||||
2. Billing details for Stripe Subscription Service
|
||||
</li>
|
||||
<li>
|
||||
3. You will create your subscription plans
|
||||
</li>
|
||||
<li>
|
||||
4. Email Account Credentials for sending emails to your users
|
||||
</li>
|
||||
<li>
|
||||
5. If you use external storage service, then you will need set your API credentials
|
||||
</li>
|
||||
<li>
|
||||
6. Some general settings for VueFileManager like Google Analytics, logo, favicon and application name
|
||||
</li>
|
||||
<li>
|
||||
7. You will create admin account
|
||||
</li>
|
||||
</ul>
|
||||
<ul v-else style="margin-top: 0" class="information-list">
|
||||
<li>
|
||||
1. Email Account Credentials for sending emails to your users
|
||||
</li>
|
||||
<li>
|
||||
2. If you use external storage service, then you will need set your API credentials
|
||||
</li>
|
||||
<li>
|
||||
3. Some general settings for VueFileManager like Google Analytics, logo, favicon and application name
|
||||
</li>
|
||||
<li>
|
||||
4. You will create admin account
|
||||
</li>
|
||||
</ul>
|
||||
</InfoBox>
|
||||
|
||||
<router-link v-if="isExtended" :to="{name: 'SubscriptionService'}" tag="div" class="submit-wrapper">
|
||||
<AuthButton icon="chevron-right" text="I Get It! Let's Set Up Application" :loading="isLoading" :disabled="isLoading"/>
|
||||
</router-link>
|
||||
|
||||
<router-link v-if="! isExtended" :to="{name: 'EnvironmentSetup'}" tag="div" class="submit-wrapper">
|
||||
<AuthButton icon="chevron-right" text="I Get It! Let's Set Up Application" :loading="isLoading" :disabled="isLoading"/>
|
||||
</router-link>
|
||||
</div>
|
||||
</AuthContent>
|
||||
</AuthContentWrapper>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {ValidationProvider, ValidationObserver} from 'vee-validate/dist/vee-validate.full'
|
||||
import AuthContentWrapper from '@/components/Auth/AuthContentWrapper'
|
||||
import SelectInput from '@/components/Others/Forms/SelectInput'
|
||||
import FormLabel from '@/components/Others/Forms/FormLabel'
|
||||
import InfoBox from '@/components/Others/Forms/InfoBox'
|
||||
import AuthContent from '@/components/Auth/AuthContent'
|
||||
import AuthButton from '@/components/Auth/AuthButton'
|
||||
import Spinner from '@/components/FilesView/Spinner'
|
||||
import { SettingsIcon } from 'vue-feather-icons'
|
||||
import {required} from 'vee-validate/dist/rules'
|
||||
import {mapGetters} from 'vuex'
|
||||
import axios from 'axios'
|
||||
|
||||
export default {
|
||||
name: 'InstallationDisclaimer',
|
||||
components: {
|
||||
AuthContentWrapper,
|
||||
ValidationProvider,
|
||||
ValidationObserver,
|
||||
SettingsIcon,
|
||||
SelectInput,
|
||||
AuthContent,
|
||||
AuthButton,
|
||||
FormLabel,
|
||||
required,
|
||||
Spinner,
|
||||
InfoBox,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isLoading: true,
|
||||
isError: false,
|
||||
isExtended: undefined
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
// Send request to get verify account
|
||||
axios
|
||||
.post('/api/setup/purchase-code', {
|
||||
purchaseCode: localStorage.getItem('purchase_code'),
|
||||
})
|
||||
.then(response => {
|
||||
|
||||
var container = document.getElementById('vue-file-manager')
|
||||
container.scrollTop = 0
|
||||
|
||||
// End loading
|
||||
this.isLoading = false
|
||||
|
||||
if (response.data === 'b6896a44017217c36f4a6fdc56699728') {
|
||||
this.isExtended = true
|
||||
} else {
|
||||
this.isExtended = false
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
|
||||
// End loading
|
||||
this.isLoading = false
|
||||
|
||||
if (error.response.status == 400) {
|
||||
this.$router.push({name: 'PurchaseCode'})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
//@import '@assets/vue-file-manager/_auth-form';
|
||||
@import '@assets/vue-file-manager/_forms';
|
||||
@import '@assets/vue-file-manager/_auth';
|
||||
@import '@assets/vue-file-manager/_setup_wizard';
|
||||
|
||||
#loader {
|
||||
position: relative;
|
||||
margin-top: 80px;
|
||||
}
|
||||
|
||||
.information-list {
|
||||
li {
|
||||
padding: 8px 0;
|
||||
@include font-size(17);
|
||||
font-weight: 600;
|
||||
|
||||
&:first-child {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -7,7 +7,7 @@
|
||||
<div class="content-headline">
|
||||
<settings-icon size="40" class="title-icon"></settings-icon>
|
||||
<h1>Setup Wizard</h1>
|
||||
<h2>Please verify your purchase code before continue to set up your application.</h2>
|
||||
<h2>Please set your purchase code before continue to set up your application.</h2>
|
||||
</div>
|
||||
|
||||
<ValidationObserver @submit.prevent="verifyPurchaseCode" ref="verifyPurchaseCode" v-slot="{ invalid }" tag="form" class="form inline-form">
|
||||
@@ -56,7 +56,7 @@
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
purchaseCode: 'e3420e63-ce6f-4d04-9b3e-f7f5cc6af7c6'
|
||||
purchaseCode: 'e3420e63-ce6f-4d04-9b3e-f7f5cc6af7c6',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@@ -80,6 +80,8 @@
|
||||
// End loading
|
||||
this.isLoading = false
|
||||
|
||||
localStorage.setItem('purchase_code', this.purchaseCode)
|
||||
|
||||
// Redirect to next step
|
||||
this.$router.push({name: 'Database'})
|
||||
})
|
||||
|
||||
@@ -662,10 +662,10 @@
|
||||
},
|
||||
],
|
||||
stripeCredentials: {
|
||||
key: '',
|
||||
secret: '',
|
||||
webhookSecret: '',
|
||||
currency: '',
|
||||
key: 'pk_test_51GsACaCBETHMUxzVsYkeApHtqb85paMuye7G77PDDQ28kXqDJ5HTmqLi13aM6xee81OQK1fhkTZ7vmDiWLStU9160061Yb2MtL',
|
||||
secret: 'sk_test_51GsACaCBETHMUxzVviYCrv0CeZMyWAOfBPe4uH5rkKJcJxrXhIciWQTr7UB1sgw9geoJMkNDVSWBQW36tuAsVznd00zhNHXhok',
|
||||
webhookSecret: 'whsec_eKrDhqtpbMUXOKqrUHf78SrZxHHYOdrf',
|
||||
currency: 'USD',
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user