@extends('admin.layouts.master')

@section('title', __('admin.accounts'))
@section('page_title', __('admin.accounts'))

@section('breadcrumbs')
    <li class="breadcrumb-item"><a href="{{ route('admin.dashboard') }}">{{ __('admin.dashboard') }}</a></li>
    <li class="breadcrumb-item active">{{ __('admin.accounts') }}</li>
@endsection

@section('content')
<div class="card">
    <div class="card-header">
        <h3 class="card-title"><i class="fas fa-wallet"></i> {{ __('admin.accounts') }}</h3>
        <div class="card-tools">
            @can('accounts.create')
                <a href="{{ route('admin.accounts.transfer.form') }}" class="btn btn-warning btn-sm">
                    <i class="fas fa-exchange-alt"></i> تحويل بين الحسابات
                </a>
                <button type="button" class="btn btn-primary btn-sm" id="addAccountBtn">
                    <i class="fas fa-plus"></i> {{ __('admin.add') }}
                </button>
            @endcan
        </div>
    </div>
    <div class="card-body">
        <table id="accountsTable" class="table table-bordered table-striped table-hover" style="width:100%">
            <thead><tr>
                <th>#</th><th>الكود</th><th>الاسم</th><th>النوع</th>
                <th>العملة</th><th>الرصيد الافتتاحي</th><th>الرصيد الحالي</th>
                <th>افتراضي</th><th>الحالة</th><th>عمليات</th><th>{{ __('admin.actions') }}</th>
            </tr></thead>
        </table>
    </div>
</div>

@include('admin.accounts._modal')
@endsection

@push('scripts')
@include('admin._partials.crud_scripts')
<script>
$(function () {
    const t = $('#accountsTable').DataTable({
        processing: true, serverSide: true, responsive: true, order: [[0, 'desc']],
        ajax: '{{ route('admin.accounts.data') }}',
        language: { url: OFP.dtLanguage },
        columns: [
            { data: 'id', name: 'id', width: '50px' },
            { data: 'code', name: 'code' },
            { data: 'name', name: 'name' },
            { data: 'type', name: 'type' },
            { data: 'currency_code', name: 'currency_code' },
            { data: 'opening_balance', name: 'opening_balance' },
            { data: 'current_balance', name: 'current_balance' },
            { data: 'is_default', name: 'is_default', orderable: false, searchable: false },
            { data: 'is_active', name: 'is_active' },
            { data: 'payments_badge', name: 'payments_count', orderable: false, searchable: false },
            { data: 'actions', name: 'actions', orderable: false, searchable: false }
        ]
    });

    $('#addAccountBtn').on('click', function () {
        $('#accountForm').trigger('reset')[0].action = '{{ route('admin.accounts.store') }}';
        $('#accountMethod').val('POST');
        $('#accountModalLabel').text('{{ __('admin.add') }}');
        $('#accountModal').modal('show');
    });

    $('#accountsTable tbody').on('click', '.edit-account-btn', function () {
        const id = $(this).data('id');
        $.get('{{ url('admin/accounts') }}/' + id, function (a) {
            OFP.populateForm($('#accountForm'), a);
            $('#accountForm')[0].action = '{{ url('admin/accounts') }}/' + a.id;
            $('#accountMethod').val('PUT');
            $('#accountModalLabel').text('{{ __('admin.edit') }} ' + a.name);
            $('#accountModal').modal('show');
        });
    });

    @if($errors->any()) $('#accountModal').modal('show'); @endif
});
</script>
@endpush