@extends('cms.layout.app')

@section('content')
<div class="page-wrapper">
    <div class="page-header card">
        <div class="row align-items-end">
            <div class="col-lg-8">
                <div class="page-header-title">
                    @if (isset($store))
                    <img src="{{asset('storage/'.$store->logo)}}" height="90" class="mr-4" alt="">
                    <div class="d-inline">
                        <h4>{{$store->name . ' Offers'}}</h4>
                    </div>
                    @else
                    <i class="icofont icofont-star brown-colors"></i>
                    <div class="d-inline">
                        <h4>All Offers 123</h4>
                    </div>
                    @endif


                </div>
            </div>
            <div class="col-lg-4">
                <div class="page-header-breadcrumb">
                    <ul class="breadcrumb-title">
                        <li class="breadcrumb-item">
                            <a href="{{route('cms.dashboard')}}">
                                <i class="icofont icofont-home"></i>
                            </a>
                        </li>
                        <li class="breadcrumb-item"><a href="#!">{{$store->name ?? ''}} Offers</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="page-body">

        <div class="card">
            <div class="card-header">
                <h5>Offer List</h5>
                <div class="card-header-right">
                    <a href="{{route('cms.offers.add' , isset($store) ? ['store_id' => $store->id] : null)}}" class="btn btn-sm btn-success"><i class="icofont icofont-plus text-light"></i> </a>
                </div>
            </div>
            <div class="card-block table-border-style">
                <div class="table-responsive p-4">
                    @if (isset($store))
                    <table class="table datatable">
                        <thead>
                            <tr>
                                <th>Short Title</th>
                                <th>Headline</th>
                                <th>Type</th>
                                <th>Code</th>
                                <th>Expire Date</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody data-ajax="{{route('cms.offers.resort' , ['store_id' => $store->id])}}" id="sortable">
                            @foreach ($store->offers()->orderBy('order' , 'ASC')->get() as $offer)
                            <tr data-id="{{$offer->id}}">
                                <td>{{$offer->short_title}}</td>
                                <td>{{$offer->headline}}</td>
                                <td>{{$offer->type == 'coupon' ? 'Coupon' : 'Deal'}}</td>
                                <td>
                                    @if ($offer->type == "coupon")
                                    <input type="text" id="copyValue" value="{{$offer->coupon_code}}">
                                    | <a href="javascript:void(0);" onclick="copyText()">Copy</a>
                                    @endif
                                </td>
                                <td>{{$offer->expire_date ?? '-'}}</td>
                                <td>
                                    <a href="{{route('cms.offers.edit' , ['id' => $offer->id,'store_id' => $store->id] )}}" class="btn btn-sm btn-warning"><i class="icofont icofont-ui-edit"></i></a>
                                    <a href="#" class="btn btn-sm btn-danger delete-row" data-href="{{route('cms.offers.delete' , $offer->id)}}"><i class="icofont icofont-delete-alt"></i></a>
                                </td>
                            </tr>
                            @endforeach

                        </tbody>
                    </table>
                    @else

                    <table class="table datatable">
                        <thead>
                            <tr>
                                <th>Store</th>
                                <th>Short Title</th>
                                <th>Headline</th>
                                <th>Type</th>
                                <th>Code</th>
                                <th>Expire Date</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($offers as $offer)
                            <tr>
                                <td>{{$offer->store->name}}</td>
                                <td>{{$offer->short_title}}</td>
                                <td>{{$offer->headline}}</td>
                                <td>{{$offer->type == 'coupons' ? 'Coupon' : 'Deal'}}</td>
                                <td>{{$offer->coupon_code}}</td>
                                <td>{{$offer->expire_date ?? '-'}}</td>
                                <td>
                                    <a href="{{route('cms.offers.edit' , ['id' => $offer->id] )}}" class="btn btn-sm btn-warning"><i class="icofont icofont-ui-edit"></i></a>
                                    <a href="#" class="btn btn-sm btn-danger delete-row" data-href="{{route('cms.offers.delete' , $offer->id)}}"><i class="icofont icofont-delete-alt"></i></a>
                                </td>
                            </tr>
                            @endforeach

                        </tbody>
                    </table>

                    @endif

                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('page-script')
<script>
    function copyText() {
        /* Get the text field */
        var copyText = document.getElementById("copyValue");

        /* Select the text field */
        copyText.select();
        copyText.setSelectionRange(0, 99999); /* For mobile devices */

        /* Copy the text inside the text field */
        document.execCommand("copy");

        /* Alert the copied text */
        alert("Copied the text: " + copyText.value);
    }
</script>
@endsection