@extends('layouts.erp_theme_01')
@section('content')
    
    <div class="row">

        <div class="col-md-4  mt-3">

            <div class="card ">
                <div class='card-header'>
                    <div class="title-block">
                        <h3 class="title">Product Details</h3>
                    </div>
                </div>
                <div class='card-body'>

                    <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>
                    </ul>

                </div>
            </div>


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

            <div class="card ">
                <div class='card-header'>
                    <div class="title-block">
                        <div class="row">
                            <div class="col-md-7">
                                <h3 class="title">Product Images</h3>
                            </div>
                            <div class="col-md-5 text-end">

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

                <div class="card-body ">

                    @if(count( $data['images'] ) == 0)
                        <p class='alert alert-info white'>No product image has been uploaded!</p>
                    @endif
                    <form method="post" action="{{ URL::to('/erp/inventory/upload-product-photo')  }}" class="dropzone"
                          id="product-image-uploader" enctype="multipart/form-data">
                        {{ csrf_field() }}
                        <input type="hidden" name="punid" value="{{ $data['product']['product_id']}}"/>
                    </form>

                    <hr/>
                    <div class='text-start'>
                        <div class="gallery">
                            @foreach( $data['images'] as $image)
                                <a href="{{ $image['image_url'] }}" class="big">
                                    <img src="{{ $image['image_url'] }}" width="120"/>
                                </a>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection


@section('script')

    <script>

        Dropzone.options.productImageUploader = {
            paramName: "file",
            maxFilesize: 10, // MB

        };

        (function () {
            var $gallery = new SimpleLightbox('.gallery a', {});
        })();

    </script>

@endsection