<template>
    <div class="content">
        <div class="title m-b-md">
            <img v-if="!logo" v-bind:src="cover_logo" alt="crm-logo"  width="50%"> 
            <img v-if="logo"  v-bind:src="cover_logo" alt="crm-logo"  width="350">
            <h2 class="mt-3">Version {{ crm_version }}</h2>
            <div class="row" v-if="!file_exists">
                <div class="col-md-4 offset-md-4">
                    <h5>Keep your purchase code handy for the next step!</h5>
                    <button type="button" class="btn btn-block rounded text-light installBtnBG" @click="install"><i class="fas fa-laptop-code pr-2"></i> Install</button>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    name: 'Installer',
 
    data(){
        return {
            step:1,
            csrf: document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
            loading:false,
            logo:'',
            cover_logo:'',
            app_url:'',
            file_exists:true,
            crm_version:'',
        }
    },
    mounted(){
        // Get Basic Details for the First page, which has Install button
        this.fetch_basic_details();
        this.app_url = localStorage.getItem('tmp_url');
        
    },
    methods:{
        install(){
            this.$emit('update_step_clicked', 2);
        },
        async fetch_basic_details(){
            await axios.get('/api/install/first')
            .then((res) => {
                console.log('res.data.logo');
                console.log(res.data.logo);
                console.log(this.app_url+'/storage/adminfiles/'+res.data.logo);
                if(res.data.logo != null){
                    this.cover_logo = this.app_url+'/storage/adminfiles/'+res.data.logo
                }else{
                    this.cover_logo = this.app_url+'/images/cover.png';
                }
            this.logo = res.data.logo;
            this.file_exists = res.data.file_exists;
            this.crm_version = res.data.crm_version;
            });
        },
        async submit(){
            axios.post('api/install/submit',{
                app_name : this.app_name,
                app_env: this.app_env,
                app_debug: this.app_debug,
                app_url: this.app_url,
                db_connection: this.db_connection,
                db_host: this.db_host,
                db_port: this.db_port,
                db_database: this.db_database,
                db_username: this.db_username,
                db_password: this.db_password,
                mail_driver: this.mail_driver,
                mail_host: this.mail_host,
                mail_port: this.mail_port,
                mail_username: this.mail_username,
                mail_password: this.mail_password,
                mail_encryption: this.mail_encryption,
            }).then((res) => {
                this.step = 2;
            });
        },
        async verify_purchase_code(){
            if(this.purchase_code == ''){
                return alert('Please enter your purchase code!');
            }
            this.verifying = true;
            // data to be sent to the POST request
            let tmp_url = localStorage.getItem('tmp_url');
            let tmp = tmp_url.split("/");
            tmp.splice(0, 2);
            let requested_domain = tmp.join('/');
            let _data = {
                'purchase_code': this.purchase_code,
                'requested_domain':requested_domain
            }
            let docs_url = 'https://docs.devpremier.com/api/verify_purchase_code';
            fetch(docs_url, {
                method: "POST",
                body: JSON.stringify(_data),
                headers: {"Content-type": "application/json; charset=UTF-8"}
            })
            .then(response => response.json()) 
            .then(res => {
                if(res.verification == 'success') {
                    this.verified = true;  
                }else{
                    alert(res.verification)
                }

                this.verifying = false;
            })
            .catch(err => { 
                this.verifying = false;
            });
        },
        async fetch_server_details(){
            this.loading = true;
            await axios.get('/api/server_details')
            .then((res) => {
                this.server_details = res.data.server_details
                if (
                    (this.server_details.stg_logs_permission >= '0755') && 
                    (this.server_details.stg_framework_permission >= '0755') && 
                    (this.server_details.stg_app_permission >= '0755') && 
                    (this.server_details.bootstrap_permission >= '0755')
                    ) {
                    this.permissions = true;
                }
                this.loading = false;
            });
        },
    }
}
</script>

