@props([
    'company' => null,
])

@php
    $class = $company && ($company->has_bonus_bank || $company->has_bonus_insurance || $company->has_bonus_volume || $company->has_bonus_quality) ? '' : 'd-none';
    $tab = $company->has_bonus_bank ? 1 : null;
    $tab = $tab == null && $company->has_bonus_insurance ? 2 : $tab;
    $tab = $tab == null && $company->has_bonus_volume ? 3 : $tab;
    $tab = $tab == null && $company->has_bonus_quality ? 4 : $tab;
@endphp
<div class="card card-inner mt-4 pt-1 {{ $class }}" x-data="{
        bonusTab: {{ $tab ?? 1 }},
    }"
    @set-bonus-tab.window="bonusTab = $event.detail.tab"    
>
    <ul class="nav nav-tabs">
        <li class="nav-item">
            <a @class(["nav-link", "d-none" => ! $company->has_bonus_bank])
                x-bind:class="{'active': bonusTab == 1}"
                x-on:click="bonusTab = 1">
                Bonus de base
            </a>
            <a @class(["nav-link ms-4", "d-none" => ! $company->has_bonus_insurance]) 
                x-bind:class="{'active': bonusTab == 2}"
                x-on:click="bonusTab = 2">
                Bonus assurance 100/200%
            </a>
            <a @class(["nav-link ms-4", "d-none" => ! $company->has_bonus_volume])
                x-bind:class="{'active': bonusTab == 3}"
                x-on:click="bonusTab = 3">
                Bonus volume
            </a>
            <a @class(["nav-link ms-4", "d-none" => ! $company->has_bonus_quality])
                x-bind:class="{'active': bonusTab == 4}"
                x-on:click="bonusTab = 4">
                Bonus qualité
            </a>
            <a @class(["nav-link ms-4", "d-none" => ! $company->has_bonus_animation_credit])
                x-bind:class="{'active': bonusTab == 5}"
                x-on:click="bonusTab = 5">
                Bonus animation crédit
            </a>
            <a @class(["nav-link ms-4", "d-none" => ! $company->has_bonus_animation_insurance])
                x-bind:class="{'active': bonusTab == 6}"
                x-on:click="bonusTab = 6">
                Bonus animation assurance
            </a>
        </li>    
    </ul>
    <div class="tab-content">
        <div class="tab-pane" x-bind:class="{'active': bonusTab == 1}">
            @livewire('commissions.bonus-commissions-table', [
                'restrict' => [
                    'company_id' => $company->id, 
                    'transaction_type' => TransactionType::BONUS_BANK()
                ],
                'loader' => false,
                'deferLoad' => true
            ], key('bonus-bank'))

            @if(auth()->user()->can('companies.update'))
            <x-ui.button 
                :label="__('Regenerate commissions') . ' '. TransactionType::BONUS_BANK->label()" 
                class="btn-sm btn-dim mt-2"
                icon="reload"
                click="regenCommissions({{ TransactionType::BONUS_BANK() }})"
                :confirm="__('regenerate commissions')"
            />
            @endif
        </div>
        <div class="tab-pane" x-bind:class="{'active': bonusTab == 2}">
            @livewire('commissions.bonus-commissions-table', [
                'restrict' => [
                    'company_id' => $company->id, 
                    'transaction_type' => TransactionType::BONUS_INSURANCE()
                ],
                'loader' => false,
                'deferLoad' => true
            ], key('bonus-insurance'))

            @if(auth()->user()->can('companies.update'))
            <x-ui.button 
                :label="__('Regenerate commissions') . ' '. TransactionType::BONUS_INSURANCE->label()" 
                class="btn-sm btn-dim mt-2"
                icon="reload"
                click="regenCommissions({{ TransactionType::BONUS_INSURANCE() }})"
                :confirm="__('regenerate commissions')"
            />
            @endif
        </div>
        <div class="tab-pane" x-bind:class="{'active': bonusTab == 3}">
            @livewire('commissions.bonus-commissions-table', [
                'restrict' => [
                    'company_id' => $company->id, 
                    'transaction_type' => TransactionType::BONUS_VOLUME()
                ],
                'loader' => false,
                'deferLoad' => true
            ], key('bonus-volume'))
        </div>
        <div class="tab-pane" x-bind:class="{'active': bonusTab == 4}">
            @livewire('commissions.bonus-commissions-table', [
                'restrict' => [
                    'company_id' => $company->id, 
                    'transaction_type' => TransactionType::BONUS_QUALITY()
                ],
                'loader' => false,
                'deferLoad' => true
            ], key('bonus-quality'))
        </div>
        <div class="tab-pane" x-bind:class="{'active': bonusTab == 5}">
            @livewire('commissions.bonus-commissions-table', [
                'restrict' => [
                    'company_id' => $company->id, 
                    'transaction_type' => TransactionType::BONUS_ANIMATION_CREDIT()
                ],
                'loader' => false,
                'deferLoad' => true
            ], key('bonus-animation-credit'))
        </div>
        <div class="tab-pane" x-bind:class="{'active': bonusTab == 6}">
            @livewire('commissions.bonus-commissions-table', [
                'restrict' => [
                    'company_id' => $company->id, 
                    'transaction_type' => TransactionType::BONUS_ANIMATION_INSURANCE()
                ],
                'loader' => false,
                'deferLoad' => true
            ], key('bonus-animation-insurance'))
        </div>
    </div>
</div>