vuefilemanager/resources/js/views/SetupWizard/InstallationDisclaimer.vue

<template>
    <AuthContentWrapper ref="auth">
        <!--Database Credentials-->
        <AuthContent name="database-credentials" :visible="true">
            <Headline
                class="container mx-auto max-w-screen-sm"
                title="Setup Wizard"
                description="Database was installed successfully. Let's set up application, Make sure you have these informations before continue:"
            >
                <settings-icon size="40" class="title-icon text-theme mx-auto" />
            </Headline>
            <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 Headline from '../Auth/Headline'
import { mapGetters } from 'vuex'
import axios from 'axios'

export default {
    name: 'InstallationDisclaimer',
    components: {
        AuthContentWrapper,
        ValidationProvider,
        ValidationObserver,
        SettingsIcon,
        SelectInput,
        AuthContent,
        AuthButton,
        FormLabel,
        required,
        Spinner,
        InfoBox,
        Headline,
    },
    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) => {
                this.$scrollTop()

                // End loading
                this.isLoading = false

                if (response.data === 'b6896a44017217c36f4a6fdc56699728') {
                    this.isExtended = true
                    localStorage.setItem('license', 'Extended')
                } else {
                    this.isExtended = false
                    localStorage.setItem('license', 'Regular')
                }
            })
            .catch((error) => {
                // End loading
                this.isLoading = false

                if (error.response.status == 400) {
                    this.$router.push({ name: 'PurchaseCode' })
                }
            })
    },
}
</script>

<style scoped lang="scss">
@import '../../../sass/vuefilemanager/forms';
@import '../../../sass/vuefilemanager/auth';
@import '../../../sass/vuefilemanager/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>