@extends('layouts.app')

@section('content')
<input type="hidden" name="id_otpremnice" value="" id="id_otpremnice">
{{ csrf_field() }}
<section class="panel">
    <form id="form" method="post" action="{{route('order_form.update', $order_form->id)}}" class="form-horizontal">
        <input type="hidden" name="_method" value="put">
        @csrf
        <header class="panel-heading">
            <a type="button" class="btn btn-default" href="{{route('order_form.index')}}">{{__("Discard")}} <i class="fa fa-backward"></i></a>
            <button type="submit" class="btn btn-primary">{{__("Save")}} <i class="fa fa-save"></i></button>
            <a type="button" href="#confirmModal" class="btn btn-danger modal-basic">@if($order_form->confirmed == 0){{__("Confirm")}} @else {{__("Revoke")}} @endif <i class="fa fa-check"></i></a>
            <a type="button" href="{{route('print_order_form', $order_form->id)}}" class="btn btn-default">{{__("Print")}} <i class="fa fa-print"></i></a>
            
            @if($order_form->confirmed == 1)
                <span class="label label-danger" style="float:right; font-size: 20px">{{__("Confirmed")}} 
                    @if($order_form->confirmed_date)<small> {{date('d.m.Y H:i:s', strtotime($order_form->confirmed_date))}} </small>@endif
                </span>
            @endif
        </header>
        <div class="panel-body">
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Number")}}: </p></div>
                <div class="col-sm-4">
                    <input type="text"  class="form-control" placeholder="" spellcheck="false" value="{{$order_form->id}}" readonly/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Customer")}}:  <span class="required">*</span></p></div>
                <div class="col-sm-4 @if($errors->has('customer_id')){{'has-error'}} @endif">
                    <select name="customer_id" id="customer_id" class="form-control" data-plugin-selectTwo>
                        <option value="">-- {{__("Customer")}} --</option>
                        @foreach($customers as $customer)
                            <option value="{{$customer->id}}" @if($customer->id == $order_form->customer_id) selected @endif>{{$customer->name}}</option>
                        @endforeach
                    </select>
                    @if($errors->has('customer_id'))
                        <label for="customer_id" class="error">{{$errors->first('customer_id')}}</label>
                    @endif
                </div>
                <div class="col-sm-2">
                    <a href="{{route('customer.create')}}" class="btn btn-default"> <i class="fa fa-plus"></i></a>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Date")}}: <span class="required">*</span> </p></div>
                <div class="col-sm-4  @if($errors->has('order_date')){{'has-error'}} @endif">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                        </span>
                        <input type="text" name="order_date" class="form-control date-picker" placeholder="" id="order_date"  spellcheck="" 
                        value="@if(isset($order_form->order_date)) {{date('d.m.Y', strtotime($order_form->order_date))}} @endif"/>
                    </div>
                    @if($errors->has('order_date'))
                        <label for="order_date" class="error">{{$errors->first('order_date')}}</label>
                    @endif
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Deadline")}}: <span class="required">*</span> </p></div>
                <div class="col-sm-4 @if($errors->has('deadline')){{'has-error'}} @endif">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <i class="fa fa-calendar"></i>
                        </span>
                        <input type="text" name="deadline" class="form-control date-picker" placeholder="" id="deadline"  spellcheck=""
                        value="@if(isset($order_form->deadline)) {{date('d.m.Y', strtotime($order_form->deadline))}} @endif"/>
                    </div>
                    @if($errors->has('deadline'))
                        <label for="deadline" class="error">{{$errors->first('deadline')}}</label>
                    @endif
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Area")}}: <span class="required">*</span> </p></div>
                <div class="col-sm-4 @if($errors->has('area_id')){{'has-error'}} @endif">
                    <select name="area_id" id="area_id" class="form-control">
                        @foreach($areas as $area)
                            <option value="{{$area->id}}" @if($area->id == $order_form->area_id) selected @endif>{{$area->area}}</option>
                        @endforeach
                    </select>
                    @if($errors->has('area_id'))
                        <label for="area_id" class="error">{{$errors->first('area_id')}}</label>
                    @endif
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Payment terms")}}: <span class="required">*</span> </p></div>
                <div class="col-sm-4">
                    <select name="payment_term_id" id="payment_term_id" class="form-control">
                        <option value="" selected disabled>-- {{__("Payment terms")}} --</option>
                        @foreach($paymentTerms as $pt)
                            <option value="{{$pt->id}}" @if($pt->id == $order_form->payment_term_id) selected @endif>{{$pt->days}} {{__("days")}}</option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>
    </form>
</section>
<section class="panel">
    <div class="panel-body">
        <form id="itemForm">
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Item type")}}: </p></div>
                <div class="col-sm-4">
                    <select name="item_type" id="item_type" class="form-control"  data-plugin-selectTwo>
                        <option value="" selected disabled>-- {{__("Item Type")}} --</option>
                        @foreach($itemTypes as $it)
                            <option value="{{$it->id}}">{{$it->name}}</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2"><p>{{__("Item")}}: </p></div>
                <div class="col-sm-4">
                    <select name="item" id="item" class="form-control"  data-plugin-selectTwo>
                        <option value="" selected disabled>-- {{__("Item")}} --</option>
                    </select>
                </div>
            </div>
            @csrf
            <div class="form-group">
                <div class="col-sm-3">
                    <label for="code">{{__("Code")}}</label>
                    <input type="text" name="code" class="form-control" placeholder="" id="code" spellcheck="false" style="background-color:#eeeeee">
                </div>
                <div class="col-sm-4">
                    <label for="article">{{__("Item")}}</label>
                    <input type="text" name="item_name" class="form-control" placeholder="" id="item_name" spellcheck="false" style="background-color:#eeeeee">
                </div>
                <div class="col-sm-2">
                    <label for="quantity">{{__("Quantity")}}</label>
                    <input type="text" name="quantity" class="form-control" placeholder="" id="quantity" spellcheck="false" style="background-color:#eeeeee">
                </div>
                <div class="col-sm-1">
                    <label for="discount">{{__("Discount")}}</label>    
                    <input type="text" name="discount" class="form-control" placeholder="" id="discount" spellcheck="false" style="background-color:#eeeeee">
                </div>
                <div class="col-sm-2">
                    <label for="price">{{__("Price")}}</label>
                    <input type="text" name="price" class="form-control" placeholder="" id="price" spellcheck="false" style="background-color:#eeeeee">
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-12">
                    <textarea type="text" placeholder="{{__("Description")}}" name="description" class="form-control" placeholder="" id="description" spellcheck="false" rows="6" style="background-color:#eeeeee"></textarea>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-12">
                    <button type="button" class="btn btn-primary" id="btn-prepare-items">{{__("Add row")}} <i class="fa fa-save"></i></button>
                    <button type="button" class="btn btn-default" id="btn-discard-items">{{__("Discard")}} <i class="fa fa-times"></i></button>
                </div>
            </div>
        </form>
        @if(!empty($preparedItems))
            <hr>
        <div class="form-group">
            <div class="col-sm-12">
                <h4>{{__("Prepared items")}}</h4>
            </div>
            <div class="col-sm-12">
                <table class="table table-bordered table-striped mb-none" id="datatable-default">
                    <thead>
                    <tr>
                        <th>{{__('Code')}}</th>
                        <th>{{__('Item')}}</th>
                        <th>{{__('Quantity')}}</th>
                        <th>{{__('Discount')}}</th>
                        <th>{{__('Price')}}</th>
                        <th>{{__('Total')}}</th>
                        <th>{{__('Description')}}</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($preparedItems as $item)
                        <tr class="gradeX">
                            <td>{{$item->code}}</td>
                            <td>{{$item->item_name}}</td>
                            <td>{{number_format($item->quantity, 2, ',', '.')}}</td>
                            <td>{{$item->discount}}%</td>
                            <td>{{number_format($item->price, 2, ',', '.')}}</td>
                            <td>{{number_format($item->price*$item->quantity*(1-$item->discount/100), 2, ',', '.')}}</td>
                            <td>{{$item->description}}</td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div>
        @endif
        @if(!$itemList->isEmpty())
            <hr>
        <div class="form-group">
            <div class="col-sm-12">
                <h4>{{__("Items")}}</h4>
            </div>
            <div class="col-sm-12">
                <table class="table table-bordered table-striped mb-none" id="datatable-default">
                    <thead>
                    <tr>
                        <th>{{__('Code')}}</th>
                        <th>{{__('Item')}}</th>
                        <th>{{__('Quantity')}}</th>
                        <th>{{__('Discount')}}</th>
                        <th>{{__('Price')}}</th>
                        <th>{{__('Total')}}</th>
                        <th>{{__('Description')}}</th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($itemList as $item)
                        <tr class="gradeX">
                            <td>@if($item->code_prefix){{$item->code_prefix.'-'}}@endif{{str_pad($item->code, 3, '0', STR_PAD_LEFT)}}</td>
                            <td>{{$item->name}}</td>
                            <td>{{number_format($item->quantity, 2, ',', '.')}}</td>
                            <td>{{$item->discount}}%</td>
                            <td>{{number_format($item->price, 2, ',', '.')}}</td>
                            <td>{{number_format($item->price*$item->quantity*(1-$item->discount/100), 2, ',', '.')}}</td>
                            <td>{{$item->description}}</td>
                            <td style="text-align:center; color:red"><a href="#deleteItemModal" class="modal-basic"><i class="fa fa-times btn-delete" itemId={{$item->id}}></i></a></td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div>
        @endif
    </div>
</section>
<script>
    $(document).ready(function() {
        $('#item').on('change', function() {
            var selectedOption = $(this).find('option:selected');
            var code = selectedOption.data('code');
            var name = selectedOption.data('name');
            
            $('#code').val(code || '');
            $('#item_name').val(name || '');
        });
    });

    $('#btn-prepare-items').click(function(){
        var _token = $('input[name="_token"]').val();
        $.ajax({
            method  :   'POST',
            cache   :   false,
            '_token' : _token,
            url     :   "{{route('prepare_items')}}",
            data    :   $('#itemForm').serialize(),
            success :   function(result){
                $('#code').val('');
                $('#item_name').val('');
                $('#quantity').val('');
                $('#discount').val('');
                $('#price').val('');
                document.location.reload();
                $('#item_type').val(null).trigger('change');
            }
        });
    });
    $('#btn-discard-items').click(function(){
        var _token = $('input[name="_token"]').val();
        $.ajax({
            method  :   'GET',
            cache   :   false,
            '_token' : _token,
            url     :   "{{route('discard_items')}}",
            success :   function(result){
                document.location.reload();
            }
        });
    });
    $('.btn-delete').click(function () {
        var id = $(this).attr("itemId");
        $('#id_item').val(id);
    });
    $('#item_type').on('change', function() {

        let typeId = $(this).val();

        $.ajax({
            url: '/order_form/populate_items/' + typeId,
            type: 'POST',
            data: {
                _token: '{{ csrf_token() }}'
            },
            success: function(response) {

                let $itemSelect = $('#item');
                $itemSelect.empty();

                $itemSelect.append('<option value="" disabled selected>-- Select Item --</option>');

                $.each(response, function(index, item) {
                    $itemSelect.append(
                        `<option value="${item.id}" 
                            data-code="${item.code}" 
                            data-name="${item.name}">
                            (${item.code}) ${item.name}
                        </option>`
                    );
                });

                $itemSelect.val(null).trigger('change');
            }
        });
    });
</script>

<div id="deleteItemModal" class="modal-block modal-header-color modal-block-danger mfp-hide">
    <form name="delete-form" id="delete-form" method="post" action="{{route('destroy_item')}}">
        <input type="hidden" name="id_item" id="id_item">
        {{ method_field('delete') }}
        {{ csrf_field() }}
        <section class="panel">
            <header class="panel-heading">
                <h2 class="panel-title">{{__("Notice")}}!</h2>
            </header>
            <div class="panel-body">
                <div class="modal-wrapper">
                    <div class="modal-icon">
                        <i class="fa fa-times-circle"></i>
                    </div>
                    <div class="modal-text">
                        <h4>{{__("Deletion")}}</h4>
                        <p>{{__("Are you sure you want to delete data?")}}</p>
                    </div>
                </div>
            </div>
            <footer class="panel-footer">
                <div class="row">
                    <div class="col-md-12 text-right">
                        <button class="btn btn-danger" type="submit">{{__('YES')}}</button>
                        <button class="btn btn-default modal-dismiss">{{__('NO')}}</button>
                    </div>
                </div>
            </footer>
        </section>
    </form>
</div>

<div id="confirmModal" class="modal-block modal-header-color modal-block-danger mfp-hide">
    <form name="delete-form" id="delete-form" method="post" action="{{route('confirm_order_form', $order_form->id)}}">
        @csrf
        <section class="panel">
            <header class="panel-heading">
                <h2 class="panel-title">{{__("Notice")}}!</h2>
            </header>
            <div class="panel-body">
                <div class="modal-wrapper">
                    <div class="modal-icon">
                        <i class="fa fa-exclamation"></i>
                    </div>
                    <div class="modal-text">
                        @if($order_form->confirmed == 1) 
                            <h4>{{__("Revoke")}}</h4>
                        @else
                            <h4>{{__("Confirm")}}</h4>
                        @endif
                        <p>
                            @if($order_form->confirmed == 1) 
                                {{__('Are you sure you want to revoke order note?')}} 
                            @else
                                {{__('Are you sure you want to confirm order note?')}} 
                            @endif
                        </p>
                    </div>
                </div>
            </div>
            <footer class="panel-footer">
                <div class="row">
                    <div class="col-md-12 text-right">
                        <button class="btn btn-danger" type="submit">{{__('YES')}}</button>
                        <button class="btn btn-default modal-dismiss">{{__('NO')}}</button>
                    </div>
                </div>
            </footer>
        </section>
    </form>
</div>
@endsection