@extends('layouts.layout')
@section('body_class', 'nav-md')
@section('css')
<style>
    ul {margin:0;}

    .box_custom {
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    }

    .one-line{
        display:flex;
    }
    .table-bordered th,
    .table-striped th{
    font-size: 12px;
    }

</style>
@endsection
@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>Subscription - Offer Config</h3>
                </div>
                <div class="clearfix"></div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <ol class="breadcrumb">
                        <li><a href="{{ route('dashboard') }}">Home</a></li>
                        <li><a href="{{ route('lakuemas_elite_subscription/offer_config_list') }}">Offer Config</a></li>
                        <li class="active">List</li>
                    </ol>
                </div>

            <div class="col-xs-12 box_custom" style="margin-top:10px;border-radius:5px;">
                <div class="x_content">
                    <table class="table table-bordered table-striped">
                        <thead>
                            <tr>
                                <th class="text-center">ID</th>
                                <th class="text-center">Title</th>
                                <th class="text-center">Image</th>
                                <th class="text-center">Enable/Disable</th>
                                <th class="text-center">Status Information</th>
                                <th class="text-center">Start Date</th>
                                <th class="text-center">End Date</th>
                                <th class="text-center">Status Voucher</th>
                                <th class="text-center">Daily Offer Limit</th>
                                <th class="text-center">Voucher Active</th>
                                <th class="text-center">Show Detail</th>
                            </tr>
                        </thead>
                        <tbody>
                            @if(is_array($offer_lists) || is_object($offer_lists    ))
                                @forelse($offer_lists as $key => $list)
                                    <tr>                                                
                                        <td class="text-center" style="font-size: 12px;">{{ $key + 0 }}</td>
                                        <td class="text-center" style="font-size: 12px;">
											{{ $list->title }}
											<div>
												@if($list->voucher_type == 'special')
													<span class="badge" style="background: #BA68C8;">Special</span>
												@else
													<span class="badge" style="background: #43A047;">Reguler</span>
												@endif
											</div>
										</td>
                                        <td class="text-center">
                                            @if(!empty($list->image))
                                                <img src="{{ env('ALIYUN_OSS_IMAGE_URL') }}/{{ env('ALIYUN_OSS_FOLDER_LAKUSIMPAN_ELITE_SUBSCRIPTION') }}/{{ $list->image }}" width="100" height="60">
                                            @else
                                                <div class="cell">No Image</div>
                                            @endif
                                        </td>
                                        <td class="text-center">   
                                            @if($list->isactive == 1)                                                 
                                                <button type="button" class="btn btn-danger enable_disable_btn" value="{{ $list->id }}">Disable</button>  
                                            @else
                                                <button type="button" class="btn btn-primary enable_disable_btn" value="{{ $list->id }}">Enable</button>  
                                            @endif
                                        </td>
                                        <td class="text-center" style="font-size: 12px;">
                                            @if ($list->isactive == 0)
                                            <p>Tidak Aktif</p>
                                            @else
                                            <p>Aktif</p>
                                            @endif
                                        </td>
                                        <td class="text-center" style="font-size: 12px;">{{ $list->start_date }}</td>
                                        <td class="text-center" style="font-size: 12px;">{{ $list->end_date }}</td>
                                        <td class="text-center" style="font-size: 12px;">
                                            @if (\Carbon\Carbon::parse($list->end_date)->lt(\Carbon\Carbon::today()))
                                                <p class="text-danger"><i class="fa fa-times"></i> Expired</p>
                                            @else
                                                <p class="text-success"><i class="fa fa-check"></i> Aktif</p>
                                            @endif
                                        </td>
                                        <td class="text-center" style="font-size: 12px;">{{ $list->daily_offer_limit }}</td>
                                        <td class="text-center" style="font-size: 12px;">{{ $list->refresh_time }}</td>
                                        <td class="text-center" style="font-size: 12px;">   
                                            <a href="{{ route('lakuemas_elite_subscription/edit_offer_config', ['id'=>$list->id]) }}" target="_blank" class="btn btn-primary btn-xs btn-search docs-creator">
                                                <i class="fa fa-search"></i>
                                            </a>                                                    
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td class="text-center" colspan="6">No Data</td>
                                    </tr>
                                @endforelse
                            @endif
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        @include('includes.footer')
    </div>
</div>
@endsection

@section("scripts")
<script type="text/javascript">
    $("#form").on("submit", function() {
        $("#form").find('.loading').removeClass('hidden');
        $("#form").find('.submit').addClass('hidden');
        $.ajax({
            url: '/lakuemas_elite_subscription/price_config',
            method: "POST",            
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            data: $("#form").serialize(),
            success: function(response) {
                alert("Data saved");
                $("#form").find('.loading').addClass('hidden');
                $("#form").find('.submit').removeClass('hidden');
                setTimeout(function(){
                    window.location.reload(); 
                }, 1000); 
            },
            error: function(response) {
                var data = response.responseJSON;
                alert(data.error);
                $("#form").find('.loading').addClass('hidden');
                $("#form").find('.submit').removeClass('hidden');
            }
        });
        return false;
    });

    $(".enable_disable_btn").on("click", function() {
        var id = $(this).val()
        $.ajax({
            url: '/lakuemas_elite_subscription/enable_disable_offer_config',
            method: "POST",            
            headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
            data: { id : id},
            success: function(response) {
                alert(response.success);
                $("#form").find('.loading').addClass('hidden');
                $("#form").find('.submit').removeClass('hidden');
                setTimeout(function(){
                    window.location.reload(); 
                }, 1000); 
            },
            error: function(response) {
                var data = response.responseJSON;
                alert(data.error);
                $("#form").find('.loading').addClass('hidden');
                $("#form").find('.submit').removeClass('hidden');
            }
        });
        return false;
    });
</script>
@endsection