Your IP : 216.73.217.77


Current Path : /home/users/unlimited/www/whatsapp-crm/resources/js/Pages/Installer/
Upload File :
Current File : /home/users/unlimited/www/whatsapp-crm/resources/js/Pages/Installer/Update.vue

<template>
    <div class="flex h-screen justify-center">
        <div class="flex justify-center">
            <div class="mt-20">
                <div class="flex justify-center mb-5">
                    <div>
                        <h4 class="text-2xl mb-2 text-center">Swiftchats</h4>
                        <h1 class="text-2xl text-center">{{ $t('Proceed to update') }}</h1>
                    </div>
                </div>
                <div v-if="step === null" class="md:w-[20em] p-2">
                    <form v-if="!isValidPurchaseCode" @submit.prevent="validateCode()">
                        <h4 class="text-center text-xl mb-4">{{ $t('Enter Purchase Code') }}</h4>
                        <div v-if="purchaseCodeError != null" class="mt-4 p-2 bg-slate-200 border-l-[2px] border-red-500 my-4 max-w-[28em] text-sm">{{ purchaseCodeError }}</div>
                        <FormInput v-model="form4.purchase_code" :name="$t('Purchase Code')" :type="'text'" :placeholder="'Purchase code'" :class="'sm:col-span-6 mb-2'"/>
                        <div class="mt-2">
                            <button v-if="!isLoading" href="/install/database" type="submit" class="mt-4 rounded-md bg-primary px-3 py-2 text-sm text-white shadow-sm w-full">{{ $t('Next Step') }}</button>
                            <button v-else type="button" class="mt-4 rounded-md bg-primary px-3 py-2 text-sm text-white shadow-sm w-full flex justify-center">
                                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2A10 10 0 1 0 22 12A10 10 0 0 0 12 2Zm0 18a8 8 0 1 1 8-8A8 8 0 0 1 12 20Z" opacity=".5"/><path fill="currentColor" d="M20 12h2A10 10 0 0 0 12 2V4A8 8 0 0 1 20 12Z"><animateTransform attributeName="transform" dur="1s" from="0 12 12" repeatCount="indefinite" to="360 12 12" type="rotate"/></path></svg>
                            </button>
                        </div>
                    </form>
                </div>
                <div v-else-if="step === 'migrate'" class="md:w-[30em] p-2">
                    <div class="bg-slate-200 p-2 border-l-[3px] border-red-800 text-sm">
                        <p>{{ $t('When you click proceed, your script will be updated automatically! Do not navigate away from the page while this process is ongoing.') }}</p>
                    </div>
                    <form @submit.prevent="runMigration()">
                        <div class="flex justify-center gap-x-2">
                            <button v-if="!isLoading" type="submit" class="w-[10em] mt-4 rounded-md bg-primary px-3 py-2 text-sm text-white shadow-sm">{{ $t('Proceed') }}</button>
                            <button v-else type="button" class="w-[10em] mt-4 rounded-md bg-primary px-3 py-2 text-sm text-white shadow-sm flex justify-center">
                                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2A10 10 0 1 0 22 12A10 10 0 0 0 12 2Zm0 18a8 8 0 1 1 8-8A8 8 0 0 1 12 20Z" opacity=".5"/><path fill="currentColor" d="M20 12h2A10 10 0 0 0 12 2V4A8 8 0 0 1 20 12Z"><animateTransform attributeName="transform" dur="1s" from="0 12 12" repeatCount="indefinite" to="360 12 12" type="rotate"/></path></svg>
                            </button>
                        </div>
                    </form>
                </div>
                <div v-else-if="step === 'finish'" class="md:w-[30em] p-2">
                    <p class="text-center text-xl mb-4">{{ $t('Update Successfull!') }}</p>
                    <div class="bg-green-50 p-2 border-l-[3px] border-green-800 mb-2">
                        <p>{{ $t('The application has been updated successfully!') }}</p>
                    </div>
                    <div class="bg-slate-100 rounded p-4">
                        <div class="bg-slate-200 p-2 rounded-md mt-2">
                            <p class="mb-2">{{ $t('Website Url') }}</p>
                            <div class="text-sm">
                                <div class="flex gap-x-1">
                                    <Link href="/" class="underline">{{ props.path }}</Link>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="flex justify-between gap-x-2">
                        <Link href="/" class="mt-4 rounded-md bg-primary px-3 py-2 text-sm text-white shadow-sm w-full text-center">{{ $t('Proceed To Main Site') }}</Link>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script setup>
    import { Link, useForm } from "@inertiajs/vue3";
    import { defineProps, ref } from 'vue';
    import FormInput from '@/Components/FormInput.vue';
    import axios from 'axios';

    const props = defineProps(['path']);
    const step = ref(null);
    const isLoading = ref(false);
    const purchaseCodeError = ref(null);

    const runMigration = async () => {
        isLoading.value = true;

        const response = await axios.post('/update', { purchase_code: form4.value.purchase_code });

        //console.log(response.data)
        if(response.data.statusCode === 200){
            step.value = 'finish';
        }
    };

    const form4 = ref({
        purchase_code: null,
    })

    const validateCode = async () => {
        isLoading.value = true;
        try {
            const response = await axios.post('https://axis96.xyz/api/install/51790966/item', {
                purchase_code: form4.value.purchase_code
            });
            
            if (response.status === 200) {
                step.value = 'migrate'; // Set isValidPurchaseCode to true on success
                purchaseCodeError.value = null;
            }
        } catch (error) {
            if (error.response) {
                if (error.response.status === 404) {
                    purchaseCodeError.value = error.response.data.message;
                } else {
                    purchaseCodeError.value = error.response.data.message || 'An error occurred';
                }
            } else if (error.request) {
                purchaseCodeError.value = 'Error: No response received';
            } else {
                purchaseCodeError.value = error.message;
            }
            step.value = null; // Optionally handle error case
        } finally {
            isLoading.value = false;
        }
    };
</script>