@props(['payments'])

<div class="tab-pane fade" id="nav-payments" role="tabpanel" aria-labelledby="nav-payments-tab">
    <div class="panel myshadow">
        <div class="mypanel">
            <div class="table-responsive">
                <table id="payments-table" class="table dt-responsive nowrap w-100">
                    <thead class="table-brand">
                        <tr>
                            <th>N° Pago</th>
                            <th>Fecha</th>
                            <th>Póliza</th>
                            <th>Método</th>
                            <th>Referencia</th>
                            <th>Monto</th>
                            <th>Estado</th>
                            <th>Acciones</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($payments as $payment)
                        <tr>
                            <td>
                                @if(getPermission(Auth::user()->permissions, 'payment_edit'))
                                    <a href="{{url('/payments/edit/'.$payment->id)}}" target="_blank">
                                        P-{{$payment->id}}
                                    </a>
                                @else
                                    <p>P-{{$payment->id}}</p>
                                @endif
                            </td>
                            <td>{{$payment->created_at->format('d-m-Y')}}</td>
                            <td>
                                @if(getPermission(Auth::user()->permissions, 'policy_edit'))
                                    <a href="{{url('/policy/edit/'.optional($payment->getPolicy)->id)}}" target="_blank">
                                        {{optional($payment->getPolicy)->policy_id}}
                                    </a>
                                @else
                                    <p>{{optional($payment->getPolicy)->policy_id}}</p>
                                @endif
                            </td>
                            <td>{{$payment->payment_method}}</td>
                            <td>{{$payment->reference}}</td>
                            <td>
                                <span class="float-start">{{$payment->currency}}</span>
                                <span class="float-end">{{number_format($payment->amount, 2, '.', ',')}}</span>
                            </td>
                            <td>
                                @if($payment->status == 1)
                                    <span class="badge bg-warning">Pendiente</span>
                                @elseif($payment->status == 2)
                                    <span class="badge bg-success">Aprobado</span>
                                @elseif($payment->status == 3)
                                    <span class="badge bg-danger">Rechazado</span>
                                @endif
                            </td>
                            <td>
                                <div class="dropdown">
                                    <a class="dropdown-toggle" type="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-expanded="false">
                                        <i class="bi bi-three-dots-vertical"></i>
                                    </a>
                                    <ul class="dropdown-menu" aria-labelledby="dropdownMenuLink">
                                        @if(getPermission(Auth::user()->permissions, 'payment_edit'))
                                            <li>
                                                <a href="{{url('/payments/edit/'.$payment->id)}}" class="dropdown-item">
                                                    <i class="bi bi-pencil-square"></i> Editar pago
                                                </a>
                                            </li>
                                        @endif
                                    </ul>
                                </div>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>