@extends('master')
@section('css')
    <style>
        #video,
        #preview {
            width: 100% !important;
            height: auto;
            border-radius: 12px;
            object-fit: cover;
            display: block;
        }
    </style>
@endsection('css')
@section('content')
    <div class="card mb-4">
        <div class="card-body">

            <!-- Judul & Tombol site visit -->
            {{-- <div class="row mb-3">
                <div class="col-6 col-md-8">
                    <h6 class="text-capitalize">Site Visit List</h6>
                </div>
                <div class="col-6 col-md-4">
                    @if ($outstanding_sv != null)
                        <button type="button" class="btn btn-sm btn-danger w-100">close site visit</button>
                    @else
                        <button type="button" class="btn btn-sm btn-success w-100">input site visit</button>
                    @endif
                </div>
            </div> --}}
            <h6 class="text-capitalize">Site Visit List</h6>


            <!-- BAR KIRI-KANAN (Add New + Search) -->
            <div class="d-flex justify-content-between align-items-center mb-3" id="topBar">
                {{-- <button id="addNewBtn" class="btn btn-primary btn-sm">Add New</button> --}}
                @if ($outstanding_sv != null)
                    <button type="button" class="btn btn-sm btn-danger addNewBtn text-capitalize" id="btn_close_sv">close site
                        visit</button>
                @else
                    <button type="button" class="btn btn-sm btn-success addNewBtn text-capitalize" id="btn_open_sv">input
                        site visit</button>
                @endif
                <div id="searchWrapper"></div>
            </div>

            <div class="table-responsive">
                <table class="table align-items-center mb-0" id="DataTable">
                    <thead>
                        <tr>
                            <th>Status</th>
                            <th>Customer</th>
                            <th>Place</th>
                            <th>Date</th>
                            <th class="text-center">In</th>
                            <th class="text-center">Out</th>
                            <th>Remark</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($sv as $detail)
                            <tr>
                                <td>
                                    @if ($detail->jam_selesai == null)
                                        outgoing
                                    @else
                                        done
                                    @endif
                                </td>
                                <td>{{ $detail->nama_customer }}</td>
                                <td>{{ $detail->tempat_kunjungan }}</td>
                                <td>{{ $detail->tgl_kunjungan }}</td>
                                <td>{{ $detail->jam_mulai }}</td>
                                <td>{{ $detail->jam_selesai }}</td>
                                <td>{{ $detail->keterangan }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    @include('content.modal.modal_check_in')
@endsection
@section('script')
    @include('content.site_visit.script')
@endsection