@extends('layouts.master')

@section('content')

<div class="page-header mb-3">

    <div class="row">

        <div class="col-lg-12 col-md-12 col-12">

            <ul class="breadcrumb">

                <li class="breadcrumb-item">

                    <a href="#">{{ $title }}</a>

                </li>

                <li class="breadcrumb-item active">{{ $subtitle }}</li>

            </ul>

        </div>

    </div>

</div>

    <div class="row">

        <div class="col-sm-12">

            <div class="card">

                <div class="card-header d-md-flex border-bottom-1">

                    <div class="flex-grow-1">

                        <a href="{{ route('pegawai/create') }}" class="btn btn-primary"><i class="feather-16" data-feather="plus-circle"></i> Tambah Pegawai</a>

                    </div>

                    {{-- <div class="mt-3 mt-md-0">

                        <a href="#!" class="btn  btn-white ms-2"><i class="featherbtn-16" data-feather="download"></i>

                            Import</a>

                        <a href="#!" class="btn  btn-white ms-2"><i class="featherbtn-16" data-feather="upload"></i>

                            Export</a>

                    </div> --}}

                </div>

                <div class="card-body">

                    <div class="table-responsive">

                        <table class="datatable table table-stripped">

                            <thead>

                                <tr>

                                    <th>No</th>

                                    <th>Nama Pegawai</th>

                                    <th>Email</th>

                                    <th>Telepon</th>

                                    <th>Status</th>

                                    {{-- <th>Date Join</th> --}}

                                    <th class="text-center">Action</th>

                                </tr>

                            </thead>

                            <tbody>

                                @foreach ($listPegawai as $item)

                                <tr>

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

                                    <td>{{ $item->name }}</td>

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

                                    <td>{{ $item->hp }}</td>

                                    @if ($item->is_active == 1)

                                        <td><span class="badge badge-success"><i class="featherbtn-16 text-white" data-feather="check-circle"></i></span>

                                        </td>

                                    @else

                                        <td><span class="badge badge-danger"><i class="featherbtn-16 text-white" data-feather="x-circle"></i></span>

                                        </td>

                                    @endif

                                    {{-- <td>2011/04/25</td> --}}

                                    <td class="text-center">

                                        <div class="dropdown">

                                            <a data-bs-toggle="dropdown">

                                                <i class="featherbtn-16" data-feather="more-vertical"

                                                    class="icon-xs"></i>

                                            </a>

                                            <div class="dropdown-menu">

                                                <a class="dropdown-item" href="{{ route('pegawai/edit', Crypt::encrypt($item->id)) }}"><i class="featherbtn-16" data-feather="edit"></i> Edit</a>

                                                <a href="#" name="{{ $item->name }}" id="{{ $item->id }}" class="dropdown-item deleteIcon"><i class="featherbtn-16" data-feather="trash"></i> Delete</a>

                                            </div>

                                        </div>

                                    </td>

                                </tr>

                            @endforeach

                            </tbody>

                        </table>

                    </div>

                </div>

            </div>

        </div>

    </div>

    @section('script')

        <script>

        $(function(){

            // delete user ajax request

        $(document).on('click', '.deleteIcon', function(e) {

            e.preventDefault();

            let id = $(this).attr('id');

            let name = $(this).attr('name');

            let csrf = '{{ csrf_token() }}';

            Swal.fire({

            title: 'Apakah anda yakin?',

            text: "Menghapus data pegawai : "+name+" !!",

            icon: "warning",

            showCancelButton: true,

            confirmButtonColor: "#3085d6",

            cancelButtonColor: "#d33",

            confirmButtonText: "Delete pegawai!"

            }).then((result) => {

            if (result.isConfirmed) {

                $.ajax({

                url: '{{ route('pegawai/delete') }}',

                method: 'delete',

                data: {

                    id: id,

                    _token: csrf

                },

                success: function(response) {

                    console.log(response);

                    let timerInterval;

                        Swal.fire({

                        title: response.title,

                        text: response.message,

                        icon: response.icon,

                        timer: 2500,

                        timerProgressBar: true,

                        showConfirmButton:false,

                        willClose: () => {

                            clearInterval(timerInterval);

                        }

                        }).then((result) => {

                            window.location.reload();

                        });

                }

            })

            }

            });

        });



        });

        </script>

    @endsection

@endsection