@extends('tenant.accounting.accounting-tabs')

@section('style')
    <link rel="stylesheet" href="{{ asset('css/accounting/accounts-tree/index.css') }}">
    <link rel="stylesheet" href="{{ asset('css/layouts/custom-tabs.css') }}">
    <link rel="stylesheet" href="{{ asset('css/components/rounding.css') }}">
@endsection

@section('breadcrumb')
    @include('tenant.layouts.breadcrumb', [
        'items' => [
            __('home.home') => '/',
            __('navbar.accounting') => '/accounting/accounts',
            __('navbar.general_ledger_index') => '#',
        ],
    ])
@endsection

@section('sidebar')
    @include('tenant.layouts.sidebar', ['activeItem' => 'accounting.accounts-tree'])
@endsection

@section('content-field')
    @php $view = request('view')?? 'table'; @endphp

    <div>
        <div class="d-flex justify-content-end align-items-center">
            <div class="btn-group" role="group" aria-label="types of accounts views">
                <button type="button" class="btn toggle-accounts-view-btn {{ $view == 'table' ? 'active-btn' : '' }}"
                    data-accountsView="table">
                    @lang('accounting/accounts.show_table')
                </button>

                <button type="button" class="btn toggle-accounts-view-btn {{ $view == 'tree' ? 'active-btn' : '' }}"
                    data-accountsView="tree">
                    @lang('accounting/accounts.show_tree')
                </button>

                @if (!$has_previous_year)
                    @can('accounting-initialBalances')
                        <div class="pipe"></div>

                        <form method="get" action="{{ route('tenant.accounting.initial-balance') }}" class="d-inline-block">
                            @csrf
                            <button type="submit" class="btn">
                                <i class="fas fa-balance-scale"></i> @lang('accounting/accounts.initial_balances')
                            </button>
                        </form>
                    @endcan
                @endif
            </div>
        </div> <br>

        <div>
            <div class="accounts-tree-view" style="display: {{ $view == 'tree' ? 'block' : 'none' }}">
                <div class="dsip">
                    <button class="btn orange-btn btn-sm print-tree-view-btn">
                        <i class="fas fa-print"></i> @lang('general.print')
                    </button>
                    <button class="btn orange-btn btn-sm " id="toggleCollapseExpandBtn">
                        <i class="fas fa-plus" id="toggleCollapseExpandIcon"></i> @lang('general.expandAll')
                    </button>

                    <input type="search" name="accounts-tree-searcher" id="accounts-tree-searcher"
                        placeholder="{{ __('general.search') }}" class="form-control my-1 w-25"
                        style="display: flex; justify-content: center;">
                </div>

                <ul class="root-accounts-layout">
                    @foreach ($accounts as $account)
                        @php $children_count = count($account->sub_accounts); @endphp
                        <li>
                            <button class="account-btn" title="{{ $account->number }}"
                                data-account="{{ json_encode($account) }}" data-childrenCount="{{ $children_count }}">
                                <div class="d-flex align-items-center">
                                    <b>{{ $account->name }}</b>
                                    <span class="mx-1"> - </span>
                                    <span>{{ $account->number }}</span>
                                    @if ($children_count > 0)
                                        <i class="fas fa-list-ul me-2"></i>
                                    @endif
                                </div>
                            </button>

                            {{-- Operations --}}
                            @if ($account->sterile == false)
                                @can('accounting-accountsTree-add')
                                    <button class="add-account-btn" type="button" title="{{ __('general.add') }}"
                                        data-bs-toggle="modal" data-bs-target="#addAccountModal"
                                        data-account="{{ json_encode($account) }}" data-childrenCount="{{ $children_count }}">
                                        <i class="fas fa-plus-circle"></i>
                                    </button>
                                @endcan
                            @endif

                            @can('accounting-accountsTree-edit')
                                <button class="edit-account-btn" type="button" title="{{ __('general.edit') }}"
                                    data-bs-toggle="modal" data-bs-target="#editAccountModal"
                                    data-account="{{ json_encode($account) }}">
                                    <i class="fas fa-edit"></i>
                                </button>
                            @endcan

                            @if ($account->removable)
                                @can('accounting-accountsTree-delete')
                                    <button class="delete-account-btn" type="button" title="{{ __('general.delete') }}"
                                        data-accountId="{{ $account->id }}">
                                        <i class="fas fa-trash-alt"></i>
                                    </button>
                                @endcan
                            @endif

                            <ul class="sub-accounts-list" style="display:none;">
                                @include('tenant.accounting.accounts.accounts-list', [
                                    'children' => $account->sub_accounts,
                                    'level' => $account->level,
                                ])
                            </ul>
                        </li>
                    @endforeach
                </ul>

                {{-- Add New Account Modal --}}
                @include('tenant.accounting.accounts.modals.add-new-account')

                {{-- Edit Account Modal --}}
                @include('tenant.accounting.accounts.modals.edit-account')

                {{-- Delete Account Modal --}}
                <form action="" method="post" id="deleteAccountForm">
                    @csrf
                    @method('DELETE')
                </form>
            </div>

            <div class="col-lg accounts-table-view" style="display: {{ $view == 'table' ? 'block' : 'none' }}">
                <x-filter-form :title="__('navbar.general_ledger_index')" :link="route('tenant.accounting.accounts.index')">
                    <div class="row my-1">
                        <div class="col-2">
                            <span class="fw-bolder"> @lang('accounting/accounts/add-new-account.account_balance') :</span>
                            <div class="d-flex">
                                <div class="mx-3">
                                    <label for="is_debit"> @lang('accounting/accounts/add-new-account.debit')</label>
                                    <input type="checkbox" name="is_debit" id="is_debit" class="custom-checkbox"
                                        value="1" {{ request('is_debit') ? 'checked' : '' }}>
                                </div>

                                <div class="mx-3">
                                    <label for="is_debit"> @lang('accounting/accounts/add-new-account.credit')</label>
                                    <input type="checkbox" name="is_credit" id="is_credit" class="custom-checkbox"
                                        value="1" {{ request('is_credit') ? 'checked' : '' }}>
                                </div>

                                <div class="mx-3">
                                    <label for="is_zero"> @lang('accounting/accounts/add-new-account.zero')</label>
                                    <input type="checkbox" name="is_zero" id="is_zero" class="custom-checkbox"
                                        value="1" {{ request('is_zero') ? 'checked' : '' }}>
                                </div>
                            </div>
                        </div>

                        <div class="col-3">
                            <label for="account_name"> @lang('accounting/accounts/add-new-account.account_name')</label>
                            <input type="text" name="name" id="account_name" class="form-control"
                                value="{{ request('name') }}"
                                placeholder="{{ __('accounting/accounts/add-new-account.account_name') }}">
                        </div>

                        {{-- <div class="col-2">
                            <label for="from_date">من تاريخ</label>
                            @php $from_date = (request()->from_date)?? $active_year->from; @endphp
                            <x-input-date identifier="from_date" name="from_date" :value="$from_date"></x-input-date>
                        </div>

                        <div class="col-2">
                            <label for="to_date">إلى تاريخ</label>
                            @php $to_date = (request()->to_date)?? $active_year->to; @endphp
                            <x-input-date identifier="to_date" name="to_date" :value="$to_date"></x-input-date>
                        </div> --}}
                    </div>
                </x-filter-form>

                <div class="d-flex my-1 gap-2">
                    <button class="btn orange-btn btn-sm print-table-view-btn">
                        <i class="fas fa-print"></i>
                        @lang('general.print')
                    </button>

                    <a href="{{ route('tenant.accounting.accounts.export_all_excel' , request()->query()) }}"
                        id="export_excel_btn" class="btn green-btn btn-sm">
                        <i class="fas fa-file-excel"></i> @lang('accounting/accounts/add-new-account.export_excel')
                    </a>
                </div>

                <div style="width: 855px; margin:auto;" class="full-table-layout">
                    <div id="printable-table-layout">
                        @php
                            $table_options = [
                                'enableSumValuesOnColumns' => [1, 2, 3],
                                'sumValuesCell' => 'b',
                                'columnResizer' => false,
                                'hideColumn' => false,
                            ];

                            $diff_sum_data = [
                                'target_col_index' => 0,
                                'first_col_index' => [1, 3],
                                'second_col_index' => 2,
                            ];
                        @endphp

                        <v-table :options="{{ json_encode($table_options) }}"
                            :diff_sum_data="{{ json_encode($diff_sum_data) }}">
                            <table class="table table-bordered table-hover sticky-table no-fixed-layout"
                                data-editableKey="accounts">
                                <thead>
                                    <tr>
                                        <th class="sm-td"> @lang('accounting/accounts/add-new-account.current_balance')</th>
                                        <th class="sm-td"> @lang('accounting/accounts/add-new-account.debtor')</th>
                                        <th class="sm-td">@lang('accounting/accounts/add-new-account.creditor')</th>
                                        <th class="sm-td">@lang('accounting/accounts/add-new-account.opening_balance')</th>
                                        <th class="md-td"> @lang('accounting/accounts/add-new-account.account_name')</th>
                                        <th class="sm-td"> @lang('accounting/accounts/add-new-account.account_number')</th>
                                    </tr>
                                </thead>

                                <tbody>
                                    @php $debit_sum = $credit_sum = $initial_balance_sum = 0; @endphp

                                    @foreach ($leaf_accounts as $account)
                                        @php $balance = $account->balance + $account->initial_balance; @endphp
                                        @php
                                            $statement_data = $statement_items[$account->id] ?? [
                                                'credit_sum' => 0,
                                                'debit_sum' => 0,
                                                'initial_balance' => 0,
                                            ];
                                        @endphp
                                        <tr>
                                            <td class="sm-td" title="{{ $balance }}">
                                                {{ dn($statement_data['initial_balance'] + $statement_data['debit_sum'] - $statement_data['credit_sum']) }}
                                            </td>
                                            <td class="sm-td" title=" {{ dn($statement_data['debit_sum']) }}">
                                                {{ dn($statement_data['debit_sum']) }}</td>
                                            <td class="sm-td" title=" {{ dn($statement_data['credit_sum']) }}">
                                                {{ dn($statement_data['credit_sum']) }}</td>
                                            <td class="sm-td" title=" {{ dn($statement_data['initial_balance']) }}">
                                                {{ dn($statement_data['initial_balance']) }}</td>
                                            <td class="md-td">
                                                <a href="{{ route('tenant.accounting.accounts.show', ['account' => $account->encrypted_id]) }}"
                                                    class="account-name-style">
                                                    {{ $account->name }}
                                                </a>
                                            </td>
                                            <td class="sm-td">{{ $account->number }}</td>
                                        </tr>
                                        @php
                                            $debit_sum += abs($account->debit_balance);
                                            $credit_sum += abs($account->credit_balance);
                                            $initial_balance_sum += $account->initial_balance;
                                        @endphp
                                    @endforeach
                                </tbody>

                                <tfoot>
                                    <tr id="tFooteTarget" class="bordered-top">
                                        <td> @lang('accounting/accounts/add-new-account.net_balance') : <br><b
                                                class="fw-bold">{{ dn($debit_sum - $credit_sum) }}</b></td>
                                        <td> @lang('accounting/accounts/add-new-account.debtor') : <br><b>{{ dn($debit_sum) }}</b></td>
                                        <td>@lang('accounting/accounts/add-new-account.creditor') : <br><b>{{ dn($credit_sum) }}</b></td>
                                        <td><b>{{ dn($initial_balance_sum) }}</b></td>
                                        <td></td>
                                        <td></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </v-table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('script')
    <script>
        const print_data = @json(Session::get('print_data'));
    </script>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            const toggleBtn = document.getElementById('toggleCollapseExpandBtn');
            const toggleIcon = document.getElementById('toggleCollapseExpandIcon');
            const subAccountsLists = document.querySelectorAll('.sub-accounts-list');

            toggleBtn.addEventListener('click', function() {
                const isExpanded = toggleIcon.classList.contains('fa-minus');

                if (isExpanded) {
                    // Collapse all sub-accounts
                    subAccountsLists.forEach(list => {
                        list.style.display = 'none'; // Hide sub-accounts
                    });
                    toggleIcon.classList.remove('fa-minus');
                    toggleIcon.classList.add('fa-plus');
                    toggleBtn.innerHTML =
                        '<i class="fas fa-plus" id="toggleCollapseExpandIcon"></i> @lang('general.expandAll')';
                } else {
                    // Expand all sub-accounts
                    subAccountsLists.forEach(list => {
                        list.style.display = 'block'; // Show sub-accounts
                    });
                    toggleIcon.classList.remove('fa-plus');
                    toggleIcon.classList.add('fa-minus');
                    toggleBtn.innerHTML =
                        '<i class="fas fa-minus" id="toggleCollapseExpandIcon"></i>  @lang('general.collapseAll')';
                }
            });
        });
    </script>
    <script src="{{ asset('js/accounting/accounts-tree/index.js') }}" type="module"></script>
@endpush