@extends('layouts.app')

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-8">
                <div class="mt-5">
                    <a href="{{ route('showListShop') }}" class="text-dark"><i class="fa fa-arrow-circle-left "></i> Tiendas</a>
                    <hr>
                </div>
                <div class="card mt-2">
                    <div class="card-header">
                        <span v-if="!canChangeSection && sectionNameSelected !== ''">@{{ sectionNameSelected }}</span>
                        <span v-if="!canChangeSection && sectionNameSelected === ''">{{ $shop->sectionContent->first()->section->name }}</span>
                        <select v-if="canChangeSection" name="allSection" id="allSection" v-model="sectionSelected">
                            <option value="">--Seleccione--</option>
                            <option v-for="(section, keySection) in allSection" :value="section.id" :key="keySection">@{{ section.name }}</option>
                        </select>
                        <a href="#" v-if="!canChangeSection" @click.prevent="getSection({{ $shop->sectionContent->first()->section->id }})" title="Actualiza la tienda"><i class="fa fa-edit"></i></a>
                        <span v-if="canChangeSection">
                    <a href="#" @click.prevent="saveChangeSection({{ $shop->id }})" title="Actualiza la seccion de tienda"><i class="fa fa-save text-success"></i></a>&nbsp;
                    <a href="#" @click.prevent="canChangeSection = false" title="Actualiza la tienda"><i class="fa fa-times text-danger"></i></a>
                </span>
                        <form action="" method="get">
                            <div class="input-group mb-3">
                                <input type="search" class="form-control" name="search" placeholder="Nombre del producto a buscar..." aria-label="Nombre del producto a buscar..." aria-describedby="button-addon2">
                                <div class="input-group-append">
                                    <button class="btn btn-outline-secondary" type="submit" id="button-addon2">Buscar</button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="card-body">
                        <h4>
                            <span>{{ $shop->name }}</span>
                            <a href="{{ route('formProduct', ['id' => $shopId]) }}" title="add new" class="float-right btn btn-primary btn-sm"><i class="fa fa-plus"></i> {{ __('general.new product') }}</a>
                        </h4>
                        <div class="clearfix"></div>
                        {!! $Products->render() !!}
                        <table class="table table-condensed">
                            <thead>
                            <tr>
                                <th>Nombre</th>
                                <th>Stock</th>
                                <th>Precio</th>
                                <th>Precio anterior</th>
                                <th>Activo</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($Products as $Product)
                                <tr>
                                    <td><a href="{{ route('productShortEdit', ['id' => $Product->id]) }}">{{ ucfirst($Product->name) }}</a></td>
                                    <td>{{ $Product->stock }}</td>
                                    <td>{{ $Product->price }}</td>
                                    <td>{{ $Product->discount_price }}</td>
                                    <td>
                                        <table border="0" cellspacing="0" cellpadding="0">
                                            <tr>
                                                <td style="border: none;">
                                                    <a class="text-danger" @click="deleteResource(`{{ route('deleteProduct', ['id' => $Product->id]) }}`)" href="#"><i class="fa fa-trash"></i> Eliminar</a>
                                                </td>
                                                <td style="border: none;">
                                                    <div class="custom-control custom-switch">
                                                        <input @click="changeProductActive({{$Product->id}})" type="checkbox" class="custom-control-input" id="isActive{{$Product->id}}" {{ $Product->active ? ' checked' : '' }}>
                                                        <label class="custom-control-label" for="isActive{{$Product->id}}"></label>
                                                    </div>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                        {!! $Products->render() !!}
                    </div>
                </div>
            </div>
            <div class="col-md-4">
                <div class="mt-5">
                    &nbsp;
                    <hr>
                </div>
                <div class="card mt-2">
                    <div class="card-header">
                        Cupon
                        <div class="float-right"><button class="btn btn-success btn-sm" data-toggle="modal" data-target="#couponModal"><i class="fa fa-plus"></i></button></div>
                    </div>
                    <div class="card-body">
                        <table class="table table-condensed">
                            <thead>
                            <tr>
                                <th width="45%">Código</th>
                                <th><span title="valor aplicado">Valor</span></th>
                                <th>Fecha</th>
                                <th>Activo</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($shop->coupons()->orderBy('id', 'desc')->get() as $coupon)
                                <tr>
                                    <td><b>{{ $coupon->name }}</b></td>
                                    <td align="right">{{ $coupon->getValueWithLabel() }}</td>
                                    <td><i title="{{ $coupon->date_from }} - {{ $coupon->date_to }}" class="fa fa-clock-o"></i></td>
                                    <td>
                                        <div class="custom-control custom-switch">
                                            <input @click="changeCouponActive({{ $coupon->id }})" type="checkbox" class="custom-control-input" id="isCuponActive_{{ $coupon->id }}" {{ $coupon->active ? ' checked' : '' }}>
                                            <label class="custom-control-label" for="isCuponActive_{{ $coupon->id }}"></label>
                                        </div>
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                        @if(count($errors) > 0)
                            @foreach($errors->all() as $error)
                                <div class="alert alert-danger">{{ $error }}</div>
                            @endforeach
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Modal -->
    <div class="modal" id="couponModal" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">Cupon</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    @include('product.cupon.form', ['shop_id' => $shop->id])
                </div>
            </div>
        </div>
    </div>
@endsection