@extends('voyager::master')
@section('content')
@include('layout_datatable.header')
<div class="container-fluid">
    <div class="padding-top" style="margin-left: -2%;">
        <h1 class="page-title">
            <i class="voyager-documentation"></i> Service Employment History
        </h1>
        <a href="/admin/add_service_employment_history/{{$getdata->id}}" class="btn btn-success btn-add-new">
            <i class="voyager-plus"></i> <span>Add New</span>
        </a>
        {{-- <a href="#" class="btn btn-danger btn-add-new">
      <i class="voyager-trash"></i> <span>Bulk Delete</span>
    </a> --}}
    </div>
    <div style="margin-bottom: 15px;">
        <a class="btn-sm" style="background-color:white;" href="/admin/data_driver"><i class="voyager-double-left"></i> <span>Back To List Data Driver</span></a>
    </div>
    <div class="panel panel-bordered">
        <div class="container-fluid">
            {{-- <div><i class="voyager-list" style="font-size:10px;font-weight:bold;"></i> <span style="font-weight:bold;">Lihat IWO</span></div> --}}
            <hr style="margin-top: -0.1px;">
            <div class="row">
                <div class="col-md-2">
                    <h5>Full Name</h5>
                </div>
                <div class="col-md-8">
                    <h5>: {{$getdata->full_name}}</h5>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-bordered">
                <div class="panel-body">
                    <div class="table-responsive">
                        <table id="example" class="table table-responsive  table-hover table-striped" style="width:100%">
                            <thead>
                                <tr>
                                    <th>No</th>
                                    <th>From</th>
                                    <th>To</th>
                                    <th>Company Name</th>
                                    <th>Job Title History </th>
                                    <th>Description </th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>1</td>
                                    <td>-</td>
                                    <td>-</td>
                                    <td>-</td>
                                    <td>-</td>
                                    <td>-</td>
                                    <td class="no-sort no-click bread-actions">
                                        <a href="javascript:;" title="Delete" class="btn btn-sm btn-danger pull-right delete" data-id="2" id="delete-2">
                                            <i class="voyager-trash"></i>
                                        </a>
                                        <a href="/admin/edit_service_employment_history/1" title="edit" class="btn btn-sm btn-info pull-right delete" data-id="2" id="delete-2">
                                            <i class="voyager-edit"></i>
                                        </a>

                                        <a href="http://localhost:8000/admin/tb-internal-companies/2" title="View" class="btn btn-sm btn-warning pull-right view">
                                            <i class="voyager-eye"></i>
                                        </a>
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th>No</th>
                                    <th>From</th>
                                    <th>To</th>
                                    <th>Company Name</th>
                                    <th>Job Title History </th>
                                    <th>Description </th>
                                    <th>Action</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@include('layout_datatable.footer')
<script type="text/javascript">
    $('#example').DataTable({
        timeout: 10000,
        processing: false,
        serverSide: false,
        fixedHeader: true,
        ajax: '/admin/json_service_employment_history/{{$id}}',
        columns: [{
                render: function(data, type, row, meta) {
                    return meta.row + meta.settings._iDisplayStart + 1;
                    // return '<td><input type="checkbox" name="items[]" value="'+row.id_master_companies+'"></td>';
                }
            },
            {
                data: 'from'
            },
            {
                data: 'to'
            },
            {
                data: 'company_name'
            },
            {
                data: 'job_title_history'
            },
            {
                data: 'description'
            },
            {
                data: ''
            }
        ],
        columnDefs: [{
            targets: -1,
            render: function(data, type, row) {
                let opsi;
                opsi = '<a href="#" title="Delete" class="btn btn-sm btn-danger pull-right delete" data-id="' + row.id + '"><i class="voyager-trash"></i></a>';
                opsi += '<a href="/admin/edit_service_employment_history/' + row.id + '/' + row.service_drivers_id + '" title="Edit" class="btn btn-sm btn-info pull-right edit"><i class="voyager-edit"></i></a>';
                return opsi;
            },
        }],
    });

    $('#example').on('click', '.delete', function(e) {
        e.preventDefault();
        var id = $(this).data('id');
        // Tampilkan SweetAlert untuk konfirmasi
        Swal.fire({
            title: 'Apa kamu yakin?',
            text: 'Anda akan menghapus data ini',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6',
            confirmButtonText: 'Yes'
        }).then((result) => {
            if (result.isConfirmed) {
                location.href = '/admin/delete_service_employment_history/' + id;
            }
        });
    });

    $('#check_all').on('click', function() {
        $('input[type="checkbox"]').prop('checked', $(this).prop('checked'));
    });
</script>
@endsection