@extends('layouts.erp_theme_01')
@section('content')
    
    <div class="row">
        <div class="col-md-3  mt-3">
            @if(session("cno"))
                <div class="card mb-3">
                    <div class='card-header'>
                        <h3>Active Card</h3>
                        <hr/>
                        <p>Cart No.: {{ session("cno")  }}</p>
                        <a href="{{ URL::to('/erp/order/view-cart')  }}" class="btn btn-success rounded-pill btn-sm">View</a>
                        <a href="{{ URL::to('/erp/order/reset-cart')  }}" class="btn btn-danger rounded-pill btn-sm">Reset</a>
                    </div>
                </div>
            @endif

            <div class="card ">
                <div class='card-header'>

                    <div class="row">
                        <div class="col-6">
                            <h3 class="title">Product</h3>
                        </div>
                        <div class="col-6 text-end">
                            <button class="btn btn-sm btn-success rounded-pill" data-bs-toggle="modal"
                                    data-bs-target="#modal_add_source">
                                <i class="fa fa-plus"></i> Add Source
                            </button>
                        </div>
                    </div>


                    <hr/>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item">SKU: {{ $data['product']['product_sku'] }}</li>
                        <li class="list-group-item">{{ $data['product']['product_name'] }}</li>
                        <li class="list-group-item">Category: <span
                                    class='badge bg-success rounded-pill'>{{ $data['product']['category'] }}</span></li>
                        <li class="list-group-item">Sub-category: {{ $data['product']['sub_category'] }}</li>
                        <li class="list-group-item">{{ $data['product']['description'] }}</li>

                        @if($data['product']['source_from_idp'] )

                            <li class="list-group-item">Source from <span class='badge bg-info rounded-pill'>IDP</span>
                            </li>
                            <li class="list-group-item">Beneficiary
                                No.: {{ $data['product']['idp_beneficiary_no'] }}</li>
                            <li class="list-group-item">Beneficiary Name: {{ $data['product']['idp_fullname'] }}</li>
                            <li class="list-group-item">Address/Details: {{ $data['product']['idp_address'] }}</li>
                        @endif


                    </ul>

                    @if(count( $data['images'] ) == 0)
                        <p class='alert alert-info white'>No product image has been uploaded!</p>
                    @else
                        <hr/>
                        <div class="gallery">
                            @foreach( $data['images'] as $image)
                                <a href="{{ $image['image_url'] }}" class="big">
                                    <img src="{{ $image['image_url'] }}" width="80"/>
                                </a>
                            @endforeach
                        </div>
                    @endif

                </div>
            </div>


            <div class="card mt-3">
                <div class='card-header'>
                    <h3 class="title">Enterprise Details</h3>
                    <hr/>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item">EIDN: {{ $data['enterprise']['eidn'] }}</li>
                        <li class="list-group-item">{{ $data['enterprise']['enterprise_name'] }}</li>
                        <li class="list-group-item">{{ $data['enterprise']['address1'] }}</li>
                        <li class="list-group-item">
                            Phone: {{ $data['enterprise']['phone1'] }} {{ $data['enterprise']['phone2'] }}</li>
                    </ul>

                </div>
            </div>

        </div>
        <div class="col-md-8  mt-3">

            <div class="card ">
                <div class='card-header'>

                    <div class="row">
                        <div class="col-9">
                            <h3 class="titled">Product Stocks</h3>
                        </div>
                        <div class="col-3 text-end">
                            <button class="btn btn-sm btn-primary rounded-pill" data-bs-toggle="modal"
                                    data-bs-target="#modal_add_stock"><i class="fa fa-plus"></i> Add Stock
                            </button>
                        </div>
                    </div>

                    <hr/>

                    @if ( count($data['stocks']) == 0)
                        <div class="col-md-12">
                            <div class="alert alert-info">
                                No product stock added yet!
                            </div>
                        </div>
                    @else

                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th scope="col">Batch No.</th>
                                <th scope="col">Unit Cost</th>
                                <th scope="col">Package Cost</th>
                                <th scope="col">CGST+SGST</th>
                                <th scope="col">Discount</th>
                                <th scope="col">Size</th>
                                <th scope="col">Color</th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($data['stocks'] as $item)
                                <tr>
                                    <td>{{ $item['batch_no']??"na" }}</td>
                                    <td>{{ $item['unit_cost'] }}</td>
                                    <td>{{ $item['package_cost'] }}</td>
                                    <td>{{ $item['cgst'] }} + {{ $item['sgst'] }}</td>
                                    <td>{{ $item['discount'] }}</td>
                                    <td>{{ $item['size']??"na" }}</td>
                                    <td>{{ $item['color']??"na" }}</td>
                                    <td>
                                        @if($item['ready_for_sale'] === "YES")
                                            <button class="btn btn-sm btn-success rounded-pill addtocart"
                                                    data-data='{!! json_encode($item) !!}'
                                                    data-cartno="{{ session("cno")  }}">Add To Cart
                                            </button>
                                        @else
                                            <button class="btn btn-sm btn-warning disabled rounded-pill">Add To Cart
                                            </button>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>

                    @endif

                </div>
            </div>
        </div>
    </div>

    <form method="post" action="{{ URL::to('/erp/order/add-product') }}">
        {{ csrf_field() }}
        <div id="modal_add_product" class="modal" tabindex="-1">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Add Product To Order</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">

                        <div class="card-body ">
                            <div class="form-group row mt-2">
                                <div class="col-md-4">
                                    <label class="control-label" id="tbbatch">Stock Batch:</label>
                                    <input type="text" name='tbbatch' id='tbbatch' class="form-control boxed"
                                           placeholder="Stock batch">
                                </div>

                                <div class="col-md-4">
                                    <label class="control-label" id="tbdiscount">Discount (in ₹):</label>
                                    <input type="text" name='tbdiscount' id='tbdiscount' class="form-control boxed"
                                           value="0.00">
                                </div>

                                <div class="col-md-4">
                                    <label class="control-label" id="tbpayable">Actual Payable (in ₹):</label>
                                    <input type="text" name='tbpayable' id='tbpayable' class="form-control boxed"
                                           value="0.00">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <input type="hidden" value="{{ $data['product']['product_id'] }}" name="unid">
                        <button type="submit" class="btn btn-success rounded-pill">Save changes</button>
                        <button type="button" class="btn btn-danger rounded-pill" data-bs-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    </form>



    <form method="post" action="{{ URL::to('/erp/inventory/save-product-stock') }}">
        {{ csrf_field() }}
        <div id="modal_add_stock" class="modal" tabindex="-1">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Add Product Stock</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">

                        <div class="card-body ">
                            <div class="form-group row mt-2">
                                <div class="col-md-3">
                                    <label class="control-label" id="tbbatch">Stock Batch:</label>
                                    <input type="text" name='tbbatch' id='tbbatch' class="form-control boxed"
                                           placeholder="Stock batch">
                                </div>

                                <div class="col-md-3">
                                    <label class="control-label" id="tbunitcost">Unit Cost (in ₹):</label>
                                    <input type="text" name='tbunitcost' id='tbunitcost' class="form-control boxed"
                                           value="0.00">
                                </div>
                                <div class="col-md-3">
                                    <label class="control-label" id="tbpackcost">Package Cost (in ₹):</label>
                                    <input type="text" name='tbpackcost' id='tbpackcost' class="form-control boxed"
                                           value="0.00">
                                </div>

                                <div class="col-md-3">
                                    <label class="control-label" id="tbdiscount">Discount (in ₹):</label>
                                    <input type="text" name='tbdiscount' id='tbdiscount' class="form-control boxed"
                                           value="0.00">
                                </div>
                            </div>
                            <div class="form-group row mt-2">
                                <div class="col-md-3">
                                    <label class="control-label" id="tbcgst">CGST (in ₹):</label>
                                    <input type="text" name='tbcgst' id='tbcgst' class="form-control boxed"
                                           value="0.00">
                                </div>

                                <div class="col-md-3">
                                    <label class="control-label" id="tbsgst">SGST (in ₹):</label>
                                    <input type="text" name='tbsgst' id='tbsgst' class="form-control boxed"
                                           value="0.00">
                                </div>


                            </div>


                            <div class="form-group row mt-2">
                                <div class="col-md-3">
                                    <label class="control-label" id="tbweight">Net Weight:</label>
                                    <div class="input-group flex-nowrap">
                                        <input type="text" name='tbweight' id='tbweight' class="form-control boxed"
                                               value="0.00">
                                        <select class="form-control" name="dbweightunit">
                                            <option value="mg">mg</option>
                                            <option value="g">g</option>
                                            <option value="kg">kg</option>
                                            <option value="lb">lb</option>
                                            <option value="ch">channing</option>
                                            <option value="san">san</option>
                                            <option value="tola">tola</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <label class="control-label" id="tbvolume">Volume:</label>

                                    <div class="input-group flex-nowrap">
                                        <input type="text" name='tbvolume' id='tbvolume' class="form-control boxed"
                                               value="0.00">
                                        <select class="form-control" name="dbvolunit">
                                            <option value="ml">ml</option>
                                            <option value="l">l</option>
                                            <option value="pack">pack</option>
                                            <option value="box">box</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <label class="control-label" id="dbsize">Size:</label>
                                    <select type="text" name='dbsize' id='dbsize' class="form-control boxed">
                                        <option value="SM">Small</option>
                                        <option value="M">Medium</option>
                                        <option value="L">Large</option>
                                        <option value="XL">Extra Large</option>
                                        <option value="2XL">Double Extra Large</option>
                                        <option value="3XL">Triple Extra Large</option>
                                    </select>
                                </div>
                                <div class="col-md-3">
                                    <label class="control-label" id="tbcolor">Color:</label>
                                    <input type="text" name='tbcolor' id='tbcolor' class="form-control boxed">
                                </div>
                            </div>
                            <div class="form-group row mt-2">
                                <div class="col-md-3">
                                    <label class="control-label" id="dbsaleready">Ready for sale:</label>
                                    <div class="input-group flex-nowrap">
                                        <select class="form-control" name="dbsaleready">
                                            <option value="YES">Yes</option>
                                            <option value="NO">No</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <label class="control-label" id="dbpoaccept">Pre-order Accepted?</label>
                                    <div class="input-group flex-nowrap">
                                        <select class="form-control" name="dbpoaccept">
                                            <option value="1">Yes</option>
                                            <option value="0">No</option>
                                        </select>
                                        <input type="text" name='tbpocost' id='tbpocost' class="form-control boxed"
                                               value="0.00">
                                    </div>
                                </div>

                                <div class="col-md-3">
                                    <label class="control-label" id="tbdelcost">Delivery Available:</label>
                                    <div class="input-group flex-nowrap">
                                        <input type="text" name='tbdelcost' id='tbdelcost' class="form-control boxed"
                                               value="0.00">
                                        <select class="form-control" name="dbshippable">
                                            <option value="1">Yes</option>
                                            <option value="0">No</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <input type="hidden" value="{{ $data['product']['product_id'] }}" name="unid">
                        <button type="submit" class="btn btn-success rounded-pill">Save changes</button>
                        <button type="button" class="btn btn-danger rounded-pill" data-bs-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    </form>




    <form method="post" action="{{ URL::to('/erp/inventory/save-product-source') }}">
        {{ csrf_field() }}
        <div id="modal_add_source" class="modal" tabindex="-1">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Save Product Source</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">

                        <div class="card-body ">
                            <div class="form-group row mt-2">
                                <div class="col-md-3">
                                    <label class="control-label" id="tbidpbenefno">IDP Beneficiary No:</label>
                                    <input type="text" required name='tbidpbenefno' id='tbidpbenefno'
                                           class="form-control boxed">
                                </div>
                                <div class="col-md-6">
                                    <label class="control-label" id="tbidpfullname">IDP Full Name:</label>
                                    <input type="text" required name='tbidpfullname' id='tbidpfullname'
                                           class="form-control boxed">
                                </div>

                                <div class="col-md-12">
                                    <label class="control-label" id="tbidpdets">IDP Address/additional details:</label>
                                    <input type="text" required name='tbidpdets' id='tbidpdets'
                                           class="form-control boxed">
                                </div>

                                <div class="col-md-12 mt-3">
                                    <div class="form-check">
                                        <input class="form-check-input" type="checkbox" id="cbidpsource"
                                               name="cbidpsource" value="1">
                                        <label class="form-check-label" for="cbidpsource">
                                            I acknowledge that this product is sourced from a genuine Internally
                                            Displaced Person (IDP)?
                                        </label>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                    <div class="modal-footer">
                        <input type="hidden" value="{{ $data['product']['product_id'] }}" name="unid">
                        <button type="submit" class="btn btn-success rounded-pill">Save changes</button>
                        <button type="button" class="btn btn-danger rounded-pill" data-bs-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>
    </form>

@endsection


@section('script')

    <script>

        (function () {
            var $gallery = new SimpleLightbox('.gallery a', {});
        })();
        $(".addtocart").on("click", function () {
            var jsonString = $(this).attr("data-data");
            var jsonData = JSON.parse(jsonString);
            jsonData.cartno = $(this).attr('data-cartno');
            var apiUrl = window.location.origin + '/api/order/add-product';
            $.ajax({
                url: apiUrl,
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
                },
                contentType: 'application/json',
                data: JSON.stringify(jsonData),
                success: function (response) {
                    console.log('Success:', response);
                },
                error: function (xhr, status, error) {
                    console.error('Error:', error);
                },
            });
        });

    </script>
@endsection