@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">

            <div class="card">
                <div class="card-header">
                    <h3>Stores</h3>
                </div>

                <div class="card-body">

                    <div class="letters">
                        @foreach(range('a','z') as $v)
                            <a href="{{ Request::url().'?alphabet='.$v }}"
                               class="{{ request()->get('alphabet') == $v ? 'active' : '' }}">
                                {{ $v }}
                            </a>
                        @endforeach

                        <a href="{{ Request::url().'?alphabet=number' }}"
                           class="{{ request()->get('alphabet') == 'number' ? 'active' : '' }} number">
                            0-9
                        </a>
                    </div>

                    <div class="row my-4">
                        <div class="col-md-8">
                            <a class="btn btn-success" href="{{ route('stores.add') }}">Add new</a>

                            <a class="btn btn-info" href="{{ route('stores.export') }}?{{ request()->getQueryString() }}">
                                Export
                            </a>

                            <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
                                Import
                            </button>

                            <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#seoModal">
                                Change SEO
                            </button>

                            <a class="btn btn-info" href="{{ Request::url() }}?is_deindex=1">
                                DeIndex Stores
                            </a>
                        </div>

                        <div class="col-md-4">
                            <form action="{{ Request::url() }}" method="get">
                                <div class="input-group">
                                    <input type="text"
                                           class="form-control"
                                           value="{{ request()->get('search') }}"
                                           name="search"
                                           placeholder="Search this store">

                                    <button class="btn btn-secondary" type="submit">
                                        <i class="fa fa-search"></i>
                                    </button>
                                </div>
                            </form>
                        </div>
                    </div>

                    <table class="table">
                        <thead>
                            <tr>
                                <th scope="col">#</th>
                                <th scope="col">Store Title</th>
                                <th scope="col">Action</th>
                            </tr>
                        </thead>

                        <tbody>
                            @foreach($stores as $store)
                                <tr>
                                    <th scope="row">
                                        {{ $loop->iteration + (($stores->currentPage() - 1) * 15) }}
                                    </th>

                                    <td>{{ $store->term->name }}</td>

                                    <td>
                                        <a href="{{ route('stores.edit', $store->term_taxonomy_id) }}" class="btn btn-primary">
                                            Edit
                                        </a>

                                        <a target="_blank" class="btn btn-info" href="https://scoopcoupons.com/store/{{ $store->term->slug }}">
                                            Go
                                        </a>

                                        <a class="btn btn-danger"
                                           onclick="return confirm('Are you sure?')"
                                           href="{{ route('stores.delete', $store->term_taxonomy_id) }}">
                                            Delete
                                        </a>

                                        <a class="btn btn-warning"
                                           target="_blank"
                                           href="{{ $store->term->meta->_wpc_store_aff_url }}">
                                            Affiliate URL
                                        </a>

                                        <button type="button"
                                                class="indexingButton btn btn-secondary"
                                                data-term="{{ $store->term->term_id }}"
                                                data-url="https://scoopcoupons.com/store/{{ $store->term->slug }}">
                                            {{ $store->term->meta->is_deindex == true ? 'Index' : 'DeIndex' }}
                                        </button>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>

                    <div class="d-flex justify-content-center">
                        {!! $stores->withQueryString()->links('pagination::bootstrap-4') !!}
                    </div>

                </div>
            </div>

        </div>
    </div>
</div>


{{-- Import Modal --}}
<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">

            <form method="post" enctype="multipart/form-data" action="{{ route('stores.import') }}">
                @csrf

                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Upload File</h5>

                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>

                <div class="modal-body">

                    <input type="file" class="form-control" name="csv" required>

                    <div class="mb-3 mt-3">
                        <label for="slug_type" class="form-label">Slug Type</label>

                        <select id="slug_type" class="form-control" name="slug_type">
                            <option selected>URL</option>
                            <option>URL.com-coupons</option>
                            <option>URL-coupons</option>
                        </select>
                    </div>

                    <div class="mb-3">
                        <label for="seo_title" class="form-label">SEO Title</label>

                        <select id="seo_title" class="form-control" name="seo_title_format">
                            <option selected>% OFF Storename Coupons &amp; Promo Codes %%Year%%</option>
                        </select>
                    </div>

                    <div class="mb-3">
                        <label for="seo_description" class="form-label">
                            SEO Description

                            <button type="button" class="btn btn-sm btn-primary" id="custom-desc-button">
                                Add Custom
                            </button>
                        </label>

                        <select id="seo_description" class="form-control" name="seo_description_format">
                            <option selected>
                                CouponCount verified Storename Coupon Code, Promo Codes and free shipping offers. Get a % off discount on xx.
                            </option>

                            <option>
                                CouponCount verified Storename Coupon Code &amp; Promo Codes. Get a % off on xx with our discount code + free shipping.
                            </option>
                        </select>
                    </div>

                </div>

                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">Save</button>

                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                        Close
                    </button>
                </div>

            </form>

        </div>
    </div>
</div>


{{-- Change SEO Modal --}}
<div class="modal fade" id="seoModal" tabindex="-1" aria-labelledby="seoModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">

            <form method="post" enctype="multipart/form-data" action="{{ route('stores.change_seo') }}">
                @csrf

                <div class="modal-header">
                    <h5 class="modal-title" id="seoModalLabel">Upload File</h5>

                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>

                <div class="modal-body">
                    <input type="file" class="form-control" name="csv" required>
                </div>

                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">Save</button>

                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                        Close
                    </button>
                </div>

            </form>

        </div>
    </div>
</div>


<script>
document.addEventListener('DOMContentLoaded', function () {
    document.querySelectorAll('.indexingButton').forEach(function (button) {
        button.addEventListener('click', function () {
            let url = this.getAttribute('data-url');
            let termId = this.getAttribute('data-term');

            this.textContent = this.textContent.trim() === 'DeIndex' ? 'Index' : 'DeIndex';

            fetch("{{ route('stores.handle.indexing') }}", {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                    "Accept": "application/json",
                    "X-CSRF-TOKEN": "{{ csrf_token() }}"
                },
                body: JSON.stringify({
                    action: "deindex",
                    url: url,
                    term_id: termId
                })
            })
            .then(response => response.json())
            .then(data => {
                alert(data.msg);
            })
            .catch(error => {
                console.log(error);
                alert('An error occurred. Please try again.');
            });
        });
    });
});
</script>
@endsection