@extends('layouts.app')
@section('stitle', __('messages.Coupon'))
@section('title', __('messages.Coupon'))
@section('content')
    <div class="app-content content ">
        <div class="content-overlay"></div>
        <div class="header-navbar-shadow"></div>
        <div class="content-wrapper container-xxl p-0">


            <div class="content-header row">
                <div class="content-header-left col-md-6 col-12 mb-2">
                    <div class="row breadcrumbs-top">
                        <div class="col-12">
                            <h2 class="content-header-title float-left mb-0">@yield('title')</h2>
                            <div class="breadcrumb-wrapper">
                                @if ($coupon->status== 0)
                                    <span class="badge badge-glow badge-danger ml-2" style="margin-top: 5px;">{{__('messages.deactive')}}</span>
                                @else
                                    <span class="badge badge-glow badge-info ml-2" style="margin-top: 5px;">{{__('messages.active')}}</span>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
                <div class="content-header-right text-md-right col-md-6 col-12 d-md-block d-none">
                    <button class="btn btn-secondary waves-effect waves-float waves-light " type="button" onclick="location.href='{{ route('coupon.list') }}'"><i data-feather='chevron-left' class="mr-1"></i>{{__('messages.Back')}}</button>
                    @if ($coupon->status== 1)
                        <button type="button"  data-coupon_id="{{ $coupon->id }}" class="btn btn-outline-secondary mr-1 coupon_status">{{__('messages.deactivateCoupon')}}</button>
                    @else
                        <button type="button"  data-coupon_id="{{ $coupon->id }}" class="btn btn-outline-secondary coupon_status mr-1">
                            {{__('messages.activateCoupon')}}</button>
                    @endif
                </div>

            </div>
            <div class="content-body " style="margin-left: 0px; margin-right:0px">

                <!-- Table Hover Animation start -->
                <div class="row " id="table-hover-animation">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-6">
                                        <label>{{__('messages.name')}}</label>
                                        <h5 class="mt-1">{{$coupon->name}}</h5>
                                        <hr>
                                    </div>
                                    <div class="col-6">
                                        <label>{{__('messages.code')}}</label>
                                        <h5 class="mt-1">{{$coupon->code}}</h5>
                                        <hr>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <label>{{__('messages.discount')}}</label>
                                        <h5 class="mt-1">{{$coupon->discount->name}}</h5>
                                        <hr>
                                    </div>
                                    <div class="col-6">
                                        <label>{{__('messages.date')}}</label>
                                        <h5 class="mt-1">{{$coupon->start_date}} to {{$coupon->end_date}}</h5>
                                        <hr>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <label>{{__('messages.time')}}</label>
                                        <h5 class="mt-1">{{$coupon->start_time}} - {{$coupon->end_time}}</h5>
                                        <hr>
                                    </div>
                                    <div class="col-6">
                                        <label>{{__('messages.maximumUses')}}</label>
                                        <h5 class="mt-1">{{$coupon->maximum_user}}</h5>
                                        <hr>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-6">
                                        <label>{{__('messages.totalUsage')}}</label>
                                        <h5 class="mt-1">0</h5>
                                        <hr>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
    </div>
</div>
    @endsection
@push('my_scripts')
<script>

        $('.coupon_status').on('click', function(){
            var coupon_id = $(this).data('coupon_id'); // coupon_id - hidden
            const method = 'POST';
            const url = "{{ route('coupon.status') }}";
            const headers = {
                'X-CSRF-TOKEN': $('input[name="_token"]').val()
            };
            const data = {
                coupon_id,
            };

            $.ajax({
                method,
                url,
                headers,
                data, // data to be sent to server
                dataType: 'json', // type of data expecting back from server
                success: function (data) {
                    {{--location.href = "{{ route('discount.list') }}";--}}
                    window.location.reload();
                },
                error: function (data) {
                    console.log(data);
                }
            });
        });

    </script>
@endpush