@extends('layouts.app')

@section('content')
<div class="container">

    <div class="d-flex justify-content-between align-items-center mb-3">
        <h2>Data Customer</h2>

        <a href="{{ route('customers.create') }}" class="btn btn-primary">
            + Tambah Customer
        </a>
    </div>

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

    <table class="table table-bordered table-striped">

        <thead class="table-dark">
            <tr>
                <th>No</th>
                <th>Nama</th>
                <th>Email</th>
                <th>No HP</th>
                <th>Alamat</th>
                <th width="180">Aksi</th>
            </tr>
        </thead>

        <tbody>

        @forelse($customers as $customer)

        <tr>

            <td>{{ $loop->iteration }}</td>

            <td>{{ $customer->nama }}</td>

            <td>{{ $customer->email }}</td>

            <td>{{ $customer->no_hp }}</td>

            <td>{{ $customer->alamat }}</td>

            <td>

                <a href="{{ route('customers.edit',$customer->id) }}" class="btn btn-warning btn-sm">
                    Edit
                </a>

                <form action="{{ route('customers.destroy',$customer->id) }}"
                      method="POST"
                      style="display:inline">

                    @csrf
                    @method('DELETE')

                    <button class="btn btn-danger btn-sm"
                            onclick="return confirm('Yakin ingin menghapus data ini?')">
                        Hapus
                    </button>

                </form>

            </td>

        </tr>

        @empty

        <tr>

            <td colspan="6" class="text-center">
                Belum ada data customer
            </td>

        </tr>

        @endforelse

        </tbody>

    </table>

</div>
@endsection