@extends('layouts.main')

@section('title')
    Daftar Hadir
@endsection
@section('content')
    <div class="nk-block nk-block-lg">
        <div class="nk-block-head">
            <div class="nk-block-head-content">
                <h4 class="nk-block-title">Daftar Hadir</h4>
            </div>
        </div>
        <div class="card card-preview">
            <div class="card-inner">
                <table class="datatable-init nk-tb-list nk-tb-ulist" data-auto-responsive="false">
                    <thead>
                        <tr class="nk-tb-item nk-tb-head">
                            <th class="nk-tb-col"><span class="sub-text">#</span></th>
                            <th class="nk-tb-col"><span class="sub-text">Nama</span></th>
                            <th class="nk-tb-col tb-col-md"><span class="sub-text">Nomor HP</span></th>
                            <th class="nk-tb-col tb-col-md"><span class="sub-text">Acara</span></th>
                            <th class="nk-tb-col tb-col-md"><span class="sub-text">Keterangan</span></th>
                            <th class="nk-tb-col tb-col-md"><span class="sub-text">Panitia</span></th>
                            <th class="nk-tb-col tb-col-md"><span class="sub-text">Waktu Hadir</span></th>
                            <th class="nk-tb-col nk-tb-col-tools text-end"></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($models as $item)
                            <tr class="nk-tb-item">
                                <td class="nk-tb-col">{{ $loop->iteration }}</td>
                                <td class="nk-tb-col">
                                    <div class="user-card">
                                        <div class="user-avatar bg-dim-primary d-none d-sm-flex">
                                            <span>{{ $item->participant->initials }}</span>
                                        </div>
                                        <div class="user-info">
                                            <span class="tb-lead">{{ $item->participant->name }} <span
                                                    class="dot dot-success d-md-none ms-1"></span>
                                            </span>
                                        </div>
                                    </div>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{ $item->participant->phone_number }}</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{ $item->program }}</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{ $item->participant->description }}</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{ $item->user->name }}</span>
                                </td>
                                <td class="nk-tb-col tb-col-md">
                                    <span>{{ $item->created_at }}</span>
                                </td>
                                <td class="nk-tb-col nk-tb-col-tools">
                                    <ul class="nk-tb-actions gx-1">
                                        <li class="nk-tb-action-hidden">
                                            <a href="#" class="btn btn-trigger btn-icon" data-bs-toggle="tooltip"
                                                data-bs-placement="top" title="Hapus">
                                                <em class="icon ni ni-trash"></em>
                                            </a>
                                        </li>
                                        <li>
                                            <div class="drodown">
                                                <a href="#" class="dropdown-toggle btn btn-icon btn-trigger"
                                                    data-bs-toggle="dropdown"><em class="icon ni ni-more-h"></em></a>
                                                <div class="dropdown-menu dropdown-menu-end">
                                                    <ul class="link-list-opt no-bdr">
                                                        <li>
                                                            <a href="#">
                                                                <em class="icon ni ni-trash"></em>
                                                                <span>Hapus</span>
                                                            </a>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                </td>
                            </tr><!-- .nk-tb-item  -->
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div><!-- .card-preview -->
    </div> <!-- nk-block -->
@endsection