<template>
    <div class="col-12">
        <div class="b-b b-dashed b-grey p-b-25" v-show="!this.show_details">
            <div class="row align-items-center m-b-5 parentContainer">
                <div class="col">
                    <div class="font-heading fs-10 muted all-caps">Company</div>
                </div>
                <div class="col-2 text-center">
                    <div class="font-heading fs-10 muted all-caps">Booking</div>
                </div>
                <div class="col-3 text-right pull-right">
                    <div class="font-heading fs-10 muted all-caps">Action</div>
                </div>
            </div>
            <list-component  key="2" :section="this.section" :endpoint="route('api.company.list')" :options="{'business_type': 2, with_bookings:true}">
                <template slot="list" slot-scope="{data}">
                    <company-list-component :data="data"></company-list-component>
                </template>
            </list-component>
        </div>
        <company-details-component  v-show="this.show_details" :company_details="company_details"></company-details-component>
    </div>
</template>

<script>
    import componentHandler from '../../../general/mixins/componentHandler';
    export default {
        data(){
            return {
                section: 'companyQuickViewSection',
                show_details: false,
                company_details: {},
                minWidth:{
                    minWidth:'100px',
                },
                minWidth150:{
                    minWidth:'150px',
                },
            }
        },
        mounted() {
            this.$root.$on('backToCompanyList', () => {
                this.show_details=false;
                this.$store.dispatch('reloadList', {'name': this.section});
            });
            this.$root.$on('viewCompany', (company_details) => {
                this.show_details=true;
                this.company_details=company_details;
            });
        },
        mixins: [componentHandler]
    }
</script>