<template>
    <div class="row" v-if="company">
        <div class="col">
            <div class="row m-b-30" v-if="$store.getters.isAdmin">
                <div class="col bg-master-lightest b-rad-lg p-t-10 p-b-15">
                    <customer-profile-component :data="company"></customer-profile-component>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        props: {
            company_id: {
                type: Number,
                required: true,
            }
        },
        data(){
            return {
                section: 'orderListSection',
                isLoading: true,
                company: null
            }
        },
        computed: {
            pendingQueue () {
                return this.$store.getters.isInCompleteQueue(this.section);
            }
        },
        watch: {
            pendingQueue(inComplete){
                if(inComplete){
                    this.fetchCompany();
                }
            }
        },
        created(){
            this.$store.dispatch('updateListQueue', {'name': this.section});
        },
        methods: {
            fetchCompany(){
                this.isLoading = true;
                this.submit(route('api.company.show', this.company_id), 'get', this.section, false, false)
            },
            successHandler(response){
                this.$store.dispatch('completeList', {'name': this.section, 'data': []});
                this.isLoading = false;
                this.company = response.payload.data;
            }
        }
    }
</script>