@extends('app')

@section('content')
    <div class="row">
        <h2 class="text-right text-right text-muted">

            {{ Form::open(['route' => ['orders.destroy', $order->id], 'method' => 'delete']) }}
                <button style="margin-left: 1rem;"  type="submit" class="btn btn-danger pull-right">
                    <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>&nbsp;
                    Διαγραφή παραγγελίας
                </button>
            {{ Form::close() }}

            {{--  <a style="margin-left: 1rem;" href="{{ URL::previous() }}" class="btn btn-info pull-right"><span class="glyphicon glyphicon-menu-left" aria-hidden="true"></span> Πίσω</a>  --}}
            Στοιχεία παραγγελίας
        </h2>

        <hr>

        

            <div class="form-group">
                <div class="col-sm-10 col-sm-offset-2">
                    <ul class="list-group" id="added_products">
                    @foreach($order->orderItems as $orderItem)
                    <h4 class="text-right"><b>{{ $orderItem->getFormattedCategory() }}</b> - <em>{{ $orderItem->getFormattedSubCategory() }}</em></h4>
                    @if($orderItem->visits > 0)
                    {{ Form::open(['route' => ['orders.delete_order_item', $orderItem->id], 'method' => 'delete', 'class' => 'form-horizontal']) }}

                        <div class="form-group discount_field">
                            <div class="col-sm-10 col-sm-offset-2 text-danger text-right">{{ $errors->first('discount') }}</div>
                            
                            <div class="col-sm-10">
                                <div class="col-sm-2 col-sm-offset-7">
                                    
                                        <button type="submit" class="btn btn-danger pull-right">
                                            <span class="glyphicon glyphicon-trash" aria-hidden="true"></span>&nbsp;
                                        </button>

                                </div>
                                <div class="input-group col-sm-3">
                                    <div class="input-group-addon">Επισκέψεις</div>
                                    <input id="visits_{{ $orderItem->id }}" data-order-item-visits="{{ $orderItem->visits }}" data-order-item-id="{{ $orderItem->id }}" name="visits" value="{{ $orderItem->visits }}" min="0" max="1000" type="number" class="form-control visits" placeholder="Επισκέψεις">
                                </div>
                            </div>
                            
                            
                            <div style="padding: 6px 12px;" class="col-sm-2">
                                <b>x&nbsp;&nbsp;&nbsp;&nbsp;<span id="per_visit_{{ $orderItem->id }}" class="text-primary">{{ $orderItem->subCategory->price_per_visit * (1 - $order->discount / 100) }}</span></b>
                                <span>&nbsp;&nbsp;&nbsp;&nbsp;=&nbsp;&nbsp;&nbsp;&nbsp;<span data-order-item-initial-per-visit="{{ $orderItem->cost / $orderItem->visits }}" data-order-item-price-per-visit="{{ $orderItem->subCategory->price_per_visit * (1 - $order->discount / 100) }}" data-order-item-total="{{ $orderItem->visits * ($orderItem->subCategory->price_per_visit * (1 - $order->discount / 100)) }}" class="total_order_item" id="total_{{ $orderItem->id }}">{{ $orderItem->visits * ($orderItem->subCategory->price_per_visit * (1 - $order->discount / 100)) }}</span></span>
                            </div>
                            
                        </div>
                    {{ Form::close() }}
                    @endif
                    <hr>
                    @endforeach
                    </ul>
                </div>
            </div>

        


        <form id="orderUpdate" class="form-horizontal">
            {{-- Discount --}}
            <div class="form-group discount_field">
                <div class="col-sm-10 col-sm-offset-2 text-danger text-right">{{ $errors->first('discount') }}</div>
                <div class="col-sm-10 col-sm-offset-2"><label class="sr-only" for="discount">Έκπτωση</label>
                    <div class="input-group col-sm-3 col-sm-offset-9">
                        <div class="input-group-addon">Έκπτωση <b>%</b></div>
                        <input data-discount="{{ $order->discount }}" name="discount" value="{{ $order->discount }}" min="0" max="100" type="number" class="form-control" id="discount" placeholder="Έκπτωση">
                    </div>
                </div>
            </div>

            {{-- Advance payment --}}
            {{--  <div class="form-group">
                <div class="col-sm-10 col-sm-offset-2">
                    <label class="sr-only" for="discount">Προκαταβολή</label>
                    <div class="input-group col-sm-4 col-sm-offset-8">
                        <div class="col-sm-10 col-sm-offset-2 text-danger">{{ $errors->first('advance_payment') }}</div>
                        <div class="input-group-addon">Προκαταβολή</div>
                        <input name="advance_payment" value="{{ old('advance_payment') > 0 ? old('advance_payment') : 0 }}" min="0" max="5000" type="number" class="form-control" id="advance_payment" placeholder="Προκαταβολή">
                    </div>
                </div>
            </div>  --}}

            <div class="col-sm-10 col-sm-offset-2 checkbox">
                <div id="added_products_cost" class="pull-right" style="font-size: 21px;">
                    <span>Σύνολο: </span>
                    <b id="grandTotal" class="text-primary">{{ $order->getTotal() }}</b>&nbsp;<span class="glyphicon glyphicon-euro" aria-hidden="true"></span>
                </div>
            </div>

            {{-- Submit --}}
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-success pull-right">Ενημέρωση</button>
                </div>
            </div>
        </form>


    </div>
@endsection

@section('scripts')
    <script>
        $(function() {
            var visits = {};

            function changeTotal()
            {
                var grandTotal = 0;
                var orderItemTotals = $('.total_order_item');
                orderItemTotals.each(function () {
                    var subTotal = parseFloat(($(this).data('orderItemTotal') + "").replace(',','.'));
                    grandTotal += subTotal;
                });
                
                grandTotal = Math.round(grandTotal * 100) / 100;
                $('#grandTotal').text(grandTotal);
            }

            $('#discount').on('input', function () {
                var orderItemTotals = $('.total_order_item');
                var oldDiscount = $(this).data('discount');
                var discount = $(this).val();

                orderItemTotals.each(function () {
                    var orderItemPricePerVisit = parseFloat(($(this).data('orderItemPricePerVisit') + "").replace(',','.'));
                    var initialPerVisit = $(this).data("orderItemInitialPerVisit");
                    var orderItemId = $(this).prop('id').split('_').pop();
                    var orderItemVisits = parseInt($('#visits_' + orderItemId).data('orderItemVisits'));

                    var newPerVisit = Math.round(( initialPerVisit * ((100 - discount) / 100) ) * 100) / 100;
                    var newSubTotal = Math.round((newPerVisit * orderItemVisits) * 100) / 100;



                    $(this).data('orderItemTotal', newSubTotal + "");
                    $(this).text(newSubTotal);
                    $(this).data('orderItemPricePerVisit', newPerVisit + "");
                    $('#per_visit_' + orderItemId).text(newPerVisit);
                    
                    changeTotal();
                });
            });

            $('.visits').on('input', function () {
                var orderItemId = parseInt($(this).data('orderItemId'));
                var orderItemTotal = parseFloat(($('#total_' + orderItemId).data('orderItemTotal') + "").replace(',','.'));
                var orderItemVisits = parseInt($(this).data('orderItemVisits'));
                var orderItemPricePerVisit = parseFloat(($('#total_' + orderItemId).data('orderItemPricePerVisit') + "").replace(',','.'));

                var newOrderItemTotal = parseFloat($(this).val() * orderItemPricePerVisit);
                newOrderItemTotal = Math.round(newOrderItemTotal * 100) / 100; 

                
                
                $(this).data('orderItemVisits', $(this).val());
                $('#total_' + orderItemId).data('orderItemTotal', newOrderItemTotal + "");
                $('#total_' + orderItemId).text(newOrderItemTotal);
                changeTotal();
            });

            $('#orderUpdate').on('submit', function (e) {
                e.preventDefault();

                var discount = $('#discount').val();
                var orderItems = $('[data-order-item-visits]').map(function () { 
                    return {
                        id: $(this).data('orderItemId'),
                        visits: $(this).data('orderItemVisits')
                    }; 
                }).toArray();

                $.ajax({
                    url: "{{ route('orders.update', ['id' => $order->id]) }}",
                    method: 'PUT',
                    data: {
                        _token: "{{ csrf_token() }}",
                        order: {
                            discount: discount,
                            orderItems: orderItems
                        }
                    }
                }).done(function (resp) {
                    window.location = "/orders/" + resp;
                });
            });
        });
    </script>
@stop