{{--
    Danh sách thu chi (nạp lại bằng AJAX khi submit #gridForm / bấm phân trang).
    Style bảng dùng chung: .crm-list-table (public/css/crm-2026/components.css).
    Giữ hook JS: #registration-form (layout/_script.blade.php thay nội dung khi submit #gridForm),
    công tắc duyệt .change_status[data-id], a.page-link (index), nút xoá .delete[data-url].
--}}
<div class="crm-list" id="registration-form">
    <div class="table-responsive">
        <table class="table crm-list-table">
            <thead>
            <tr>
                <th class="crm-list-table__no">STT</th>
                <th>Đề xuất</th>
                <th>Lý do</th>
                <th class="text-right">Số tiền</th>
                <th>Người duyệt</th>
                <th>Loại</th>
                <th>Ghi chú</th>
                <th>Trạng thái</th>
                <th>Chi nhánh</th>
                <th class="crm-list-table__actions">Thao tác</th>
            </tr>
            </thead>
            <tbody>
            {{-- Dòng tổng tiền (dính dưới header, xem style .tr-n ở index) --}}
            <tr class="tr-n">
                <td class="bold" colspan="3">Tổng:</td>
                <td class="text-right bold">{{number_format($allPrice)}}</td>
                <td colspan="6"></td>
            </tr>
            @if(count($docs))
                @foreach($docs as $k => $s)
                    <tr>
                        {{-- STT liên tục theo trang (trang 2 bắt đầu từ 21 ...) --}}
                        <td class="crm-list-table__no">{{ $docs->firstItem() + $k }}</td>
                        <td>
                            {{@$s->thucHien->full_name}}
                            <br>
                            <span class="small-tip">( {{date("d-m-Y", strtotime($s->created_at))}} )</span>
                        </td>
                        <td>{{@$s->lyDoThuChi->name}}</td>
                        <td class="text-right">{{number_format($s->so_tien)}}</td>
                        <td>{{@$s->duyet->full_name}}</td>
                        <td>{{$s->type == 0?'Tiền mặt' : 'Chuyển khoản'}}</td>
                        <td>{{str_limit($s->note,70)}}</td>
                        <td>
                            <label class="switch">
                                <input class="change_status" data-id="{{$s->id}}" type="checkbox" {{$s->status == 1? 'checked' : ''}}>
                                <span class="slider round"></span>
                            </label>
                        </td>
                        <td>{{@$s->branch->name}}</td>
                        <td class="crm-list-table__actions">
                            <a class="crm-action-btn crm-action-btn--edit" href="{{ url('thu-chi/' . $s->id . '/edit') }}"
                               data-toggle="tooltip" title="Sửa" aria-label="Sửa">
                                <i class="fas fa-pen"></i>
                            </a>
                            <a class="crm-action-btn crm-action-btn--delete delete" href="javascript:void(0)"
                               data-url="{{ url('thu-chi/' . $s->id) }}" data-toggle="tooltip" title="Xoá" aria-label="Xoá">
                                <i class="fas fa-trash-alt"></i>
                            </a>
                        </td>
                    </tr>
                @endforeach
            @else
                <tr>
                    <td id="no-data" colspan="10">
                        <div class="crm-list-empty">
                            <i class="fas fa-folder-open"></i>
                            <span>Không tồn tại dữ liệu</span>
                        </div>
                    </td>
                </tr>
            @endif
            </tbody>
        </table>
    </div>
    <div class="crm-list-footer">
        <span class="crm-list-footer__total">Tổng số <b>{{ number_format($docs->total()) }}</b> bản ghi</span>
        {{ $docs->appends(['search' => request()->search ])->links() }}
    </div>
</div>
<script>
    // Tooltip cho nút thao tác (nội dung được nạp lại bằng AJAX nên khởi tạo lại mỗi lần)
    if ($.fn.tooltip) {
        $('#registration-form [data-toggle="tooltip"]').tooltip({trigger: 'hover', placement: 'top'});
    }
</script>