@extends('adminlte::page')

@section('title', 'Kullanıcılar')

@section('css')
    <link href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap5.min.css" rel="stylesheet">
    <link rel="stylesheet" href="{{ asset('build/assets/datatable-B_fUXaNs.css') }}">
    
    <link rel="stylesheet" href="{{ asset('build/assets/form-CQWj5XmD.css') }}">
@endsection

@section('js')
    <!-- jQuery -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>

    <!-- DataTables -->
    <script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>

    <script src="{{ asset('build/assets/datatable-RX_jKVpA.js') }}"></script>

    <script src="{{ asset('build/assets/form-SgYMX6OZ.js') }}"></script>

@endsection

@section('content')
<div class="container-fluid pt-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2 class="fw-bold">Kullanıcı Listesi</h2>
        <button type="button" class="btn btn-success shadow-sm" data-bs-toggle="modal" data-bs-target="#categoryModal">
            <i class="fas fa-plus me-2"></i> Yeni Kullanıcı Ekle
        </button>
    </div>

    @if(session('success'))
        <div class="alert alert-success">{{ session('success') }}</div>
    @endif
    @if(session('error'))
        <div class="alert alert-danger">{{ session('error') }}</div>
    @endif

    <div class="card border-0 shadow-sm">
        <div class="card-body p-0 table-responsive">
            <table id="categoriesTable" class="table table-striped table-hover mb-0 datatable" style="width:100%">
                <thead class="table-success">
                    <tr>
                        <th>TC Kimilk Numarası</th>
                        <th>Adı</th>
                        <th>e-mail</th>
                        <th>Telefon numarası</th>
                        <th class="text-center">İşlemler</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($users as $user)
                        <tr>
                            <td class="align-middle">{{ $user->tc_identity ?? 'Yok' }} </td>
                            <td class="align-middle">{{ $user->name }}</td>
                            <td class="align-middle">{{ $user->email }}</td>
                            <td class="align-middle">{{ $user->phone ?? 'Yok' }} </td>
                            <td class="text-center align-middle">

                                <button type="button" class="btn btn-sm btn-outline-info me-1" data-bs-toggle="modal" data-bs-target="#showModal{{ $user->id }}" title="Görüntüle">
                                    <i class="fas fa-eye"></i>
                                </button>

                                <button type="button" class="btn btn-sm btn-outline-warning me-1" data-bs-toggle="modal" data-bs-target="#editModal{{ $user->id }}" title="Düzenle">
                                    <i class="fas fa-edit"></i>
                                </button>

                                <!-- Sil -->
                                <form action="{{ route('users.destroy', $user->id) }}" method="POST" class="d-inline" onsubmit="return confirm('Silmek istediğine emin misin?');">
                                    @csrf
                                    @method('DELETE')
                                    <button class="btn btn-sm btn-outline-danger" title="Sil">
                                        <i class="fas fa-trash"></i>
                                    </button>
                                </form>
                            </td>
                        </tr>

                        <!-- DÜZENLE MODAL -->
                        <div class="modal fade" id="editModal{{ $user->id }}" tabindex="-1" aria-labelledby="editModalLabel{{ $user->id }}" aria-hidden="true">
                            <div class="modal-dialog modal-xl">
                                <div class="modal-content">
                                <form class="ajax-form" action="{{ route('users.update', $user->id) }}" method="POST" enctype="multipart/form-data">
                                    @csrf
                                    @method('PUT')
                                    <div class="modal-header bg-warning text-dark">
                                    <h5 class="modal-title" id="editModalLabel{{ $user->id }}">Kullanıcıyı Düzenle</h5>
                                    <button type="button" class="btn btn-light" data-bs-dismiss="modal" aria-label="Kapat">
                                        <i class="fas fa-times"></i>
                                    </button>
                                    </div>

                                    <div class="modal-body custom-form-style row g-3 p-4">
                                    <div class="col-md-6">
                                        <label>Kullanıcı Adı</label>
                                        <input type="text" name="edit_name" id="edit_name" class="form-control" value="{{ $user->name }}" required>
                                        <div class="invalid-feedback d-none" id="error-edit_name"></div>
                                    </div>
                                    <div class="col-md-6">
                                        <label>E-mail</label>
                                        <input type="text" name="edit_email" id="email" class="form-control" value="{{ $user->email }}" required>
                                        <div class="invalid-feedback d-none" id="error-email"></div>
                                    </div>
                                    <div class="col-md-6">
                                        <label>TC Kimlik Numarası</label>
                                        <input type="number" name="edit_tc_identity" id="edit_tc_identity" class="form-control" value="{{ $user->tc_identity }}">
                                        <div class="invalid-feedback d-none" id="error-edit_tc_identity"></div>
                                    </div>
                                    <div class="col-md-6">
                                        <label>Telefon Numarası</label>
                                        <input type="number" name="edit_phone" id="edit_phone" class="form-control" value="{{ $user->phone }}">
                                        <div class="invalid-feedback d-none" id="error-edit_phone"></div>
                                    </div>
                                    </div>

                                    <div class="modal-footer">
                                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">İptal</button>
                                    <button type="submit" class="btn btn-warning">Güncelle</button>
                                    </div>
                                </form>
                                </div>
                            </div>
                        </div>

                        <!-- Show Modal -->
                        <div class="modal fade" id="showModal{{ $user->id }}" tabindex="-1" aria-labelledby="showModalLabel{{ $user->id }}" aria-hidden="true">
                            <div class="modal-dialog modal-lg">
                                <div class="modal-content">
                                <div class="modal-header bg-info text-white">
                                    <h5 class="modal-title" id="showModalLabel{{ $user->id }}">Kullanıcı Detayları</h5>
                                    <button type="button" class="btn btn-light" data-bs-dismiss="modal" aria-label="Kapat">
                                        <i class="fas fa-times"></i>
                                    </button>
                                </div>
                                <div class="modal-body">
                                    <div class="row g-3">
                                        <div class="col-md-8">
                                            <p><strong>Id :</strong> {{ $user->id }}</p>
                                            <p><strong>Adı :</strong> {{ $user->name }}</p>
                                            <p><strong>e-mail :</strong> {{ $user->email }}</p>
                                            <p><strong>e-mail onaylanma tarihi :</strong> {{ $user->email_verified_at ?? 'Onaylanmadı' }}</p>
                                            <p><strong>TC kimlik numarası :</strong> {{ $user->tc_identity ?? 'Yok'}} </p>
                                            <p><strong>Telefon Numarası:</strong> {{$user->phone ?? 'Yok' }}</p>
                                            <p><strong>Oluşturulma Tarihi:</strong> {{ $user->created_at }}</p>
                                            <p><strong>Güncellenme Tarihi:</strong> {{ $user->updated_at }}</p>
                                        </div>
                                    </div>
                                </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
</div>

<div class="modal-body category-modal-body row g-3 p-4">
        <!--Kayetmek için modal-->
        <div class="modal fade" id="categoryModal" tabindex="-1" aria-labelledby="categoryModalLabel" aria-hidden="true">
            <div class="modal-dialog modal-xl">
                <div class="modal-content">
                <form id="createUserForm" action="{{ route('users.store') }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    <div class="modal-header">
                    <h5 class="modal-title w-100 text-center" id="categoryModalLabel">Yeni Kullanıcı Ekle</h5>
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal" aria-label="Kapat">
                        <i class="fas fa-times"></i>
                    </button>

                    </div>

                    <div class="modal-body custom-form-style row g-3 p-4">
                    <div class="col-md-6">
                        <label>İsim Soyisim</label>
                        <input type="text" name="create_name" id="create_name" class="form-control">
                        <div class="invalid-feedback d-none" id="error-create_name"></div>
                    </div>


                    <div class="col-md-6">
                        <label>TC kimlik numarası</label>
                        <input type="number" name="create_tc_identity"  id="create_tc_identity" class="form-control">
                        <div class="invalid-feedback d-none" id="error-create_tc_identity"></div>
                    </div>


                    <div class="col-md-6">
                        <label>e-mail</label>
                        <input type="email" name="create_email"  id="create_email" class="form-control">
                        <div class="invalid-feedback d-none" id="error-create_email"></div>
                    </div>

                    <div class="col-md-6">
                        <label>Telefon numarası</label>
                        <input type="text" name="create_phone" id="create_phone" class="form-control">
                        <div class="invalid-feedback d-none" id="error-create_phone"></div>
                    </div>

                    </div>

                    <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">İptal</button>
                    <button type="submit" class="btn btn-success">Kaydet</button>
                    </div>
                </form>
                </div>
            </div>
        </div>
</div>

@endsection