@extends('layouts.layout')

@section('body_class', 'nav-md')

@section('body_content')
<div class="container body">
    <div class="main_container">
        @include('includes.sidebar')

        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <h3>Config Laku Cicil</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <ol class="breadcrumb">
                        <li>
                            <a href="{{ route('dashboard') }}">Dashboard</a>
                        </li>
                        <li>
                            <a href="{{ route('laku_cicil_config') }}">Laku Cicil</a>
                        </li>
                        <li class="active">Config</li>
                    </ol>
                </div>
            </div>

            <div class="row">
                <div class="col-xs-12 col-sm-12">
                    <div class="x_panel">
                        <div class="x_content">
                            <table id="table" class="table table-bordered table-striped">
                                <thead>
                                    <tr>
                                        <th class="text-center">No</th>
                                        <th class="text-center">Type</th>
                                        <th class="text-center">Last Updated</th>
                                        <th class="text-center">Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php $no = 1; @endphp
                                    @foreach ($configs as $config)
                                        <tr>
                                            <td class="text-center">{{ $no++ }}</td>
                                            <td class="text-center">{{ $config->name_config }}</td>
                                            <td class="text-center">{{ $config->latest_log->updated_at ?? '' }}</td>
                                            <td class="text-center">
                                                <button type="button"
                                                    class="btn btn-warning btn-view"
                                                    data-id="{{ $config->id }}">
                                                    <i class="fa fa-eye"></i>
                                                </button>
                                                <button type="button"
                                                    class="btn btn-success fetch-data"
                                                    data-id="{{ $config->id }}">
                                                <i class="fa fa-edit"></i>
                                                </button>
                                                <button type="button"
                                                class="btn btn-primary btn-log"
                                                    data-id="{{ $config->id }}">
                                                    <i class="fa fa-book"></i>
                                                
                                                </button>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div> 
</div>


@include('pages.lakucicil.lakucicil_modal_view')
@include('pages.lakucicil.lakucicil_modal_edit')
@include('pages.lakucicil.lakucicil_modal_log')

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>


@section('scripts')
<script>
    $(document).on('click', '.btn-view', function() {
        var id = $(this).data('id');
        $.ajax({
            url : 'config_view/id/' + id,
            type: 'GET',
            data: {
                type: id
            },
            success: function(response) {
                $('#modal_view').html(response);
                $('#modalView').modal('show');
            }
        })
    });

     $(document).on('click', '.btn-log', function() {
        var id = $(this).data('id');
        $.ajax({
            url : 'config_log/id/' + id,
            type: 'GET',
            data: {
                type: id
            },
            success: function(response) {
                $('#modal_log').html(response);
                $('#modallog').modal('show');
            }
        })
    });

    
    
    $(document).on('click', '.fetch-data', function() {
				// alert(123); buat cek js jalan atau tidak
                var id = $(this).data('id');
                $.ajax({
					url: '/lakucicil/config/type',
                    type: 'GET',
                    data: {
                        id: id,
                        _token: '{{ csrf_token() }}'
                    },
                    success: function(response) {
                        $('#modal_content').html(response);
                        $('#exampleModal').modal('show');
                    },
                    error: function(xhr, status, error) {
                        console.error('AJAX request failed:', error);
                    }
                });
            });

       
</script>
@endsection