@extends("Kitchen-Owner.layout.app")
@section("title","Kitchen Dashboard")
@section("content")
<div class="nk-content ">
                    <div class="container-fluid">
                        <div class="nk-content-inner">
                            <div class="nk-content-body">
                                <div class="components-preview mx-auto">
                                    
                                    <div class="nk-block nk-block-lg">
                                        <div class="nk-block-head">
                                            <div class="row g-4">
                                                <div class="col-lg-6">
                                                    <div class="nk-block-head-content">
                                                        <h4 class="title nk-block-title">Update Payment Detail.</h4>
                                                        <div class="nk-block-des">
                                                            <p>Here, You Can Update Payment QR Code Using This Form.</p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group float-right">
                                                        <a href="{{route('kitchen.dashboard')}}" class="btn btn-lg btn-primary">Back To Dashboard</a>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                        </div>
                                        
                                        <div class="card card-bordered">
                                            <div class="card-inner">
                                                
                                                
                                                <form action="{{route('kitchen.updatePaymentDetail')}}" method="POST" enctype="multipart/form-data">
                                                    @csrf
                                                    <div class="row g-4 justify-content-center">
                                                        <div class="col-lg-6">
                                                            <div class="row g-4">
                                                                <div class="col-lg-12 mt-2">
                                                                     
                                                                    <div class="form-group">
                                                                <label class="form-label" for="user_qrcode">Photo</label>
                                                                <div class="form-control-wrap">
                                                                    <div class="custom-file payment_file">
                                                                        <input type="file" class="custom-file-input " name="user_qrcode" id="user_qrcode">
                                                                        <label class="custom-file-label" for="user_qrcode">Choose file</label>
                                                                        @error('user_qrcode')
                                                                        <p style="color:red;">{{$message}}</p>
                                                                        @enderror
                                                                    </div>
                                                                </div>
                                                            </div>
                                                                    
                                                                </div>
                                                                <div class="col-12">
                                                            <div class="form-group">
                                                                <button type="submit" class="btn btn-lg btn-primary">Update Payment Detail</button>
                                                            </div>
                                                        </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <div class="kitchen-image">
                                                                <img src="{{ !empty($user_qrcode->user_qrcode) ? asset('backend/KitchenPaymentImage/'.$user_qrcode->user_qrcode):''}}" alt="img...." class="img-fluid">
                                                            </div>
                                                        </div>
                                                        
                                                        
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div><!-- .nk-block -->
                                </div><!-- .components-preview -->
                            </div>
                        </div>
                    </div>
                </div>  
@endsection
@push("script")
@if(Session::has('msg'))
        @switch(Session::get('status'))
        
        @case('success')
        <script>
            toastr.options = {
            "closeButton": true,
            "progressBar": true,
            "positionClass": "toast-top-center"
            }
            toastr.success("{{ Session::get('msg') }}");
        </script>
        @break

        @case('error')
        <script>
            toastr.options = {
            "closeButton": true,
            "progressBar": true,
            "positionClass": "toast-top-center"
            }
            toastr.error("{{ Session::get('msg') }}");
        </script>
        @break

        @endswitch
@endif

<script>
$(document).ready(function() {
    $(document).on('click', '.add', function(){
        var html = '';
        html += '<tr>';
        html += '<td><select class="form-select item_name" data-search="on" name="item_name[]"> <option value="Tawa Roti">Tawa Roti</option> <option value="Tawa Roti Butter">Tawa Roti Butter</option><option value="Tawa Paratha">Tawa Paratha</option> <option value="Aalu Paratha">Aalu Paratha</option><option value="Matar Paratha">Matar Paratha</option><option value="Gobhi Paratha">Gobhi Paratha</option><option value="Onian Paratha">Onian Paratha</option><option value="Paneer Paratha">Paneer Paratha</option><option value="Daal Tadka">Daal Tadka</option> <option value="Daal Fry">Daal Fry</option><option value="Daal Makhni">Daal Makhni</option><option value="Raita">Raita</option> <option value="Green Veg Mix">Green Veg Mix</option> <option value="Green Veg (Seasonal)">Green Veg (Seasonal)</option> <option value="Salad">Salad</option> <option value="Chicken">Chicken</option> <option value="Matar Paneer">Matar Paneer</option> <option value="Palak Paneer">Palak Paneer</option> <option value="Matar Aloo">Matar Aloo</option> <option value="White Channa">White Channa</option> <option value="Kaala Channa">Kaala Channa</option></select></td>';
        html += '<td><input type="text" name="item_quantity[]" class="form-control item_quantity" placeholder="Enter Quantity"/></td>';
        html += '<td><textarea class="form-control form-control-sm item_remark" name="item_remark[]" placeholder="Enter Remark" style="height: 47px; min-height: 47px;">{{old('user_address')}}</textarea></td>';
        html += '<td><button type="button" name="remove" class="btn btn-danger btn-sm remove"><em class="icon ni ni-trash"></em></button></td></tr>';
        $('#item_table').append(html);

        // Initialize Select2 on the newly added select element
        $('.form-select').select2();
    });

    $(document).on('click', '.remove', function(){
        $(this).closest('tr').remove();
    });
    
    $(document).on('click', '.add_price', function(){
        var html = '';
        html += '<tr>';
        html += '<td><select class="form-select" data-search="on" name="item_day_time[]"> <option value="1">1 Day</option> <option value="7">7 Days</option> <option value="15">15 Days</option> <option value="30">30 Days</option> </select></td>';
        html += '<td><input type="number" name="tiffine_price[]" class="form-control tiffine_price" placeholder="Enter Price"/></td>';
        html += '<td><button type="button" name="remove" class="btn btn-danger btn-sm remove"><em class="icon ni ni-trash"></em></button></td></tr>';
        $('#price_table').append(html);

        // Initialize Select2 on the newly added select element
        $('.form-select').select2();
    });

    $(document).on('click', '.remove_price', function(){
        $(this).closest('tr').remove();
    });
    
});
        
</script>

@endpush