@extends('layouts.app')

@section('css')
<!-- Plugins css-->
<link href="{{ asset('tema/plugins/switchery/switchery.min.css') }}" rel="stylesheet" />
<link href="{{ asset('tema/plugins/tagsinput/jquery.tagsinput.css') }}" rel="stylesheet" />
<link href="{{ asset('tema/plugins/clockpicker/jquery-clockpicker.min.css') }}" rel="stylesheet" />
<link href="{{ asset('tema/plugins/toggles/toggles.css') }}" rel="stylesheet" />
<link href="{{ asset('tema/plugins/timepicker/tempusdominus-bootstrap-4.css') }}" rel="stylesheet" />
<link href="{{ asset('tema/plugins/timepicker/bootstrap-material-datetimepicker.css') }}" rel="stylesheet">
<link href="{{ asset('tema/plugins/bootstrap-select/bootstrap-select.min.css') }}" rel="stylesheet" />
<link href="{{ asset('tema/plugins/colorpicker/asColorPicker.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('tema/plugins/jquery-multi-select/multi-select.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('tema/plugins/select2/select2.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('tema/plugins/sweet-alert/sweetalert2.min.css') }}" rel="stylesheet" type="text/css" />

<!-- Responsive and DataTables -->
<link href="{{ asset('tema/plugins/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('tema/plugins/datatables/buttons.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ asset('tema/plugins/datatables/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />

<link href="https://cdn.datatables.net/buttons/2.2.2/css/buttons.dataTables.min.css" rel="stylesheet" type="text/css" />

@endsection

@section('content')
<div class="page-head">
    <h4 class="mt-2 mb-2">Data Jadwal Dokter</h4>
</div>
<div class="row">
    <div class="col-lg-12 col-sm-12">
        <div class="card m-b-30">
            <div class="card-body table-responsive">

                <div class="text-center">
                    <a class="btn btn-outline-success" href="{{ route('doctor_schedule.create') }}"><i class="fa fa-plus"></i>Tambah</a>

                </div>
<br>
                <table class="table table-hover" id="tabel">
                    <thead>
                        <th>No</th>
                        <th>Nama Dokter</th>
                        <th>Hari</th>
                        <th>Jam</th>
                        <th class="text-center">Aksi</th>
                    </thead>
                    <tbody>
                     @if($doctor_schedule->count() > 0)

                        @foreach($doctor_schedule as $data)
                            <tr>
                                <td>{{ $loop->iteration }}</td>
                                <td>{{ $data->nm_doctor }}</td>
                                <td>{{ $data->day }}</td>
                                <td>{{ $data->hours }}</td>
                                <td class="text-center">
                                 <div class="btn-group" role="group" aria-label="Basic example">
                                <a href="{{ route('doctor_schedule.edit', [ 'id'=>$data->id ]) }}" class="btn btn-xs btn-outline-info">
                                        <i class="fa fa-edit"></i> Ubah
                                    </a>
                                    <a href="{{ route('doctor_schedule.delete', [ 'id'=>$data->id ]) }}" class="btn btn-xs btn-outline-danger">
                                       <i class="fa fa-trash"></i> Hapus
                                    </a>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                     @else
                        <tr>
                            <th colspan='7' class='text-center'>Tidak Ada Jadwal </th>
                        </tr>
                     @endif

                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>


@endsection

@section('js')
<script src="{{ asset('tema/plugins/timepicker/moment.js') }}"></script>
<script src="{{ asset('tema/plugins/clockpicker/jquery-clockpicker.min.js') }}"></script>
<script src="{{ asset('tema/plugins/tagsinput/jquery.tagsinput.min.js') }}"></script>
<script src="{{ asset('tema/plugins/switchery/switchery.min.js') }}"></script>
<script src="{{ asset('tema/plugins/toggles/toggles.min.js') }}"></script>
<script src="{{ asset('tema/plugins/timepicker/tempusdominus-bootstrap-4.js') }}"></script>
<script src="{{ asset('tema/plugins/timepicker/bootstrap-material-datetimepicker.js') }}"></script>
<!--colorpcker-->
<script src="{{ asset('tema/plugins/colorpicker/jquery-asColor.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/colorpicker/jquery-asGradient.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/colorpicker/jquery-asColorPicker.min.js') }}" type="text/javascript"></script>

<script src="{{ asset('tema/plugins/jquery-multi-select/jquery.multi-select.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/jquery-multi-select/jquery.quicksearch.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/bootstrap-inputmask/bootstrap-inputmask.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/bootstrap-select/bootstrap-select.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/spinner/spinner.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/select2/select2.min.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/pages/jquery.form-advance.init.js') }}" type="text/javascript"></script>
<script src="{{ asset('tema/plugins/sweet-alert/sweetalert2.min.js') }}"></script>

<!-- Responsive and datatable js -->
<script src="{{ asset('tema/plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('tema/plugins/datatables/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('tema/plugins/datatables/dataTables.responsive.min.js') }}"></script>
<script src="{{ asset('tema/plugins/datatables/responsive.bootstrap4.min.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

<script>
  $(document).ready(function() {

  });
</script>

@endsection