@extends('admin.layout.master')
@section('title','ORDER MANAGEMENT')
@section('custom_style')
<style>
    input[type=text],
    input[type=file],
    input[type=number] {
        height: 35px !important;
    }

</style>
@endsection
@section ('content')
<div class="card sina-card">
    <div class="card-header card-header-s d-flex flex-wrap align-items-center">
        <h4 class="col-6 pl-0">Cake Order Invoice Details</h4>
        <div  class="col-6 d-flex justify-content-end">
            {{-- <a href="{{route('order.cart_create')}}" class="btn-sina-title-add d-flex align-items-center" type="button" name="button">
                <div class="col pl-0 pr-2">
                    <i class="fas fa-plus-circle"></i>
                </div>
                <div class=""> Add New </div>
            </a> --}}
        </div>
    </div> 
    
    <div class="card-body">
         
        <input type="hidden" name="" id="csrf-token" value="{{ Session::token() }}" />
        <form id="form" method="post" action="{{ route('order.cake_update') }}" name="form" enctype="multipart/form-data">
            @csrf
            <div class="table-responsive">
                <table class="table table-bordered table-hover" id="datatable_apply">
                    <thead>
                        <tr>
                            <th width="10%">#</th>
                            <th width="10%">COLOR</th>
                            <th width="10%">SHAPE</th>
                            <th width="10%">WEIGHT</th>
                            <th width="10%">DESIGN</th>
                            <th width="20%">TITLE</th>
                            <th width="10%">NAME</th>
                            <th width="10%">D DATE</th>
                            <th width="10%">D TIME</th>
                            <th width="10%">NOTE</th>
                            <th width="3%">X</th>
                        </tr>
                    </thead>
                    <tbody id="tbl_body">
                        @php
                            $i=1;
                        @endphp
                        {{-- @for ($i = 0; $i < 12; $i++) --}}
                        @forelse ($orderInvoice->details as $item)
                        
                        <tr id="tr{{$item->id}}">
                            <td>{{ ($i++) }}</td>
                            <td>
                               <select name="color_id[{{$item->id}}]" class="select_2" onchange="updateCartValue('{{$item->id}}',this.value,'color_id')">
                                @forelse ($products as $key=>$product)
                                    <option value="{{$product->id}}" {{$item->color_id==$product->id?'selected':''}}>{{$product->name_eng}} ({{$product->name_local}})</option>
                                @empty
                                    
                                @endforelse
                                </select>
                            </td>
                            <td>
                                <select name="shape_id[{{$item->id}}]" class="select_2" onchange="updateCartValue('{{$item->id}}',this.value,'shape_id')">
                                    @forelse (config('default.shapes') as $s=>$shape)
                                    <option value="{{$s}}" {{$item->shape_id==$s?'selected':''}}>{{$shape}}</option>
                                    @empty
                                        
                                    @endforelse
                                </select>
                            </td>
                            <td><input type="number" name="weight[{{$item->id}}]" class="form-control" id="" step=".01" onchange="updateCartValue('{{$item->id}}',this.value,'weight')" value="{{$item->weight}}"></td>
                            <td><input type="text" name="design[{{$item->id}}]" class="form-control" id="" onchange="updateCartValue('{{$item->id}}',this.value,'design')"  value="{{$item->design}}"></td>

                            <td>
                                <select name="heading[{{$item->id}}]" class="form-control select_2" onchange="updateCartValue('{{$item->id}}',this.value,'heading_id')" >
                                    @forelse (config('default.headings') as $h=>$heading)
                                    <option value="{{$h}}" {{$item->heading_id==$h?'selected':''}}>{{$heading}}</option>
                                    @empty
                                        
                                    @endforelse
                                   
                                </select>
                            </td>
                            <td><input type="text" name="name[{{$item->id}}]" class="form-control" id="" value="{{$item->heading_name}}" onchange="updateCartValue('{{$item->id}}',this.value,'heading_name')"></td>
                            <td><input type="date" name="delivery_date[{{$item->id}}]" class="form-control" id="" value="{{date('Y-m-d',strtotime($item->delivery_date))}}" onchange="updateCartValue('{{$item->id}}',this.value,'delivery_date')"></td>
                            <td>
                                <select name="delivery_time[{{$item->id}}]" class="form-control select_2" onchange="updateCartValue('{{$item->id}}',this.value,'delivery_time')">
                                    @forelse (config('default.delivery_time') as $dt=>$dtime)
                                    <option value="{{$dt}}" {{$item->delivery_time==$dt?'selected':''}}>{{$dtime}}</option>
                                    @empty
                                        
                                    @endforelse
                                </select>
                        </td>
                        <td><input type="text" name="note[{{$item->id}}]" class="form-control" id="note{{$item->id}}" value="{{$item->note}}" onchange="updateCartValue('{{$item->id}}',this.value,'note')"></td>
                        <td><button type="button" class="btn btn-danger btn-sm" onclick="cakeDeleteRow({{$item->id}})"><i class="fa fa-minus"></i></button><a href="{{route('order.cake_print',['order_detail_id'=>$item->id])}}" class="btn btn-dark btn-sm"><i class="fa fa-print"></i></a></td>
                        </tr>
                        
                        @empty
                            
                        @endforelse   
                    </tbody>
                    <input type="hidden" name="" id="index_num" value="{{($i)}}">
                    <input type="hidden" name="order_id" id="index_num" value="{{($orderInvoice->id)}}">
                </table>
            </div>
            
            <hr>
            
            <div class="row pb-0  modal-footer">
                <div class="" style="position:fixed; bottom: 5%; right:20px;">
                    <input class="btn-sina-submit" type="submit" id="save" style="display:none" value="save" onclick="return confirm('are you sure?');"> 
                    <button class="btn btn-sm btn-warning btn-pill" onclick="addRow()" type="button"
                            name="add_Row" id="add_Row"><i class="fas fa-plus"></i></button>
                
                </div>
            </div>
        </form>
    </div>
</div>

@endsection
@section('script')
<script>
    $('.select_2').select2();
 $(document).ready(function() {
        $('#datatable_apply').dataTable({
            "paging": false,
            "columnDefs": [ {
                "orderable": false,
                // "visible": false, 
                'targets': 2,
            } ]
        });
    });
function updateCartValue(id,data_value,field){
    if(confirm('are you sure?')){
        $.ajax({
                type: "POST",
                url: "{{route('order.cake_update')}}",
                data: {
                    _token: "{{ csrf_token() }}",
                    cod_id:id,
                    data_value:data_value,
                    field:field,
                },
                success: function (data) {
                //location.reload();
                },
                error: function (response) {
                },
            });
    }
}
function addRow(){
    var index=parseInt($('#index_num').val())+1;
    var returnData='';
        returnData+=`<tr id="trn`+index+`" class="new_row">
                                <td>`+(index)+`</td>
                            <td>
                               <select name="new_color_id[`+index+`]" class="select_2">
                                @forelse (config('default.colors') as $key=>$color)
                                    <option value="{{$key}}">{{$color}}</option>
                                @empty
                                    
                                @endforelse
                                </select>
                            </td>
                            <td>
                                <select name="new_shape_id[`+index+`]" class="select_2">
                                    @forelse (config('default.shapes') as $s=>$shape)
                                    <option value="{{$s}}">{{$shape}}</option>
                                    @empty
                                        
                                    @endforelse
                                </select>
                            </td>
                            <td><input type="number" name="new_weight[`+index+`]" class="form-control" id="" step=".01"></td>
                            <td><input type="text" name="new_design[`+index+`]" class="form-control" id=""></td>

                            <td>
                                <select name="new_heading[`+index+`]" class="form-control select_2">
                                    @forelse (config('default.headings') as $h=>$heading)
                                    <option value="{{$h}}">{{$heading}}</option>
                                    @empty
                                        
                                    @endforelse
                                   
                                </select>
                            </td>
                            <td><input type="text" name="new_name[`+index+`]" class="form-control" id=""></td>
                            <td><input type="date" name="new_delivery_date[`+index+`]" class="form-control" id="" value="{{date('Y-m-d')}}"></td>
                            <td>
                                <select name="new_delivery_time[`+index+`]" class="form-control select_2">
                                    @forelse (config('default.delivery_time') as $dt=>$dtime)
                                    <option value="{{$dt}}">{{$dtime}}</option>
                                    @empty
                                        
                                    @endforelse
                                </select>
                        </td>
                        <td><input type="text" name="new_note[`+index+`]" class="form-control" id=""></td>
                        <td><button type="button" onclick="deleteRow('n`+index+`')" class="btn btn-danger btn-sm">
                                <span class="fa fa-minus"></span><span class="btn_text-`+index+`"></span>
                            </button>
                        </td>
                    </tr>`;
                                            $('#index_num').val((index));
                                    $('#tbl_body').append(returnData);
                                    $('.select_2').select2();
                                    $('#save').show();
}
function deleteRow(row_id){
    $('#tr'+row_id).remove();
    if(!$("tr").hasClass("new_row")){
        $('#save').hide();
    }
}
function cakeDeleteRow(row_id){
    if(confirm('are you sure?')){
        $.ajax({
                type: "POST",
                url: "{{route('order.cake_update')}}",
                data: {
                    _token: "{{ csrf_token() }}",
                    cod_id:row_id,
                    delete:1,
                },
                success: function (data) {
                $('#tr'+row_id).remove();
                //location.reload();
                },
                error: function (response) {
                },
            });
    }
}
</script>
@stop