@extends('admin.layouts.master')
@section('title', 'Stock')
@section('content')
    <style>
        .some-text {
            color: red;
            font-style: italic;
            font-size: 15px;
        }

        .help-block {
            color: red;
            font-size: 13px;
            font-weight: normal;
        }
    </style>

    <!-- Page Wrapper -->
    <div class="page-wrapper">
        <div class="content container-fluid">

            <!-- Page Header -->
            <div class="page-header">
                <div class="row">
                    <div class="col">
                        <h3 class="page-title">Assign Retailer Product</h3>
                        <ul class="breadcrumb">
                            <li class="breadcrumb-item active"> @if($data ?? '') Update @else Retailer Product @endif Retailer Product</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- /Page Header -->

            <div class="row">

                <div class="col-md-12">

                    <div class="card">
                        <div class="card-body">
                            <form method="POST" action="{{ route('retailer.product.store') }}" enctype="multipart/form-data" id="admin-form">
                                {{ csrf_field() }}
                                @if($data ?? '')
                                    <input type="hidden" name="id" value="{{ $data->id }}">
                                @else
                                    <input type="hidden" name="retailersId" value="{{ $retailersId }}">
                                @endif

                                <style>
                                    .select2 {
                                        width: 100% !important;
                                    }

                                    .select2-selection--single {
                                        height: 36px !important;
                                        width: 100%;
                                    }

                                    .select2-container--default .select2-selection--single .select2-selection__rendered {
                                        height: 36px !important;
                                        line-height: 36px !important;
                                    }

                                </style>

                                <table class="table stocktable">
                                    <tr>
                                        <th>#</th>
                                        <th width="40%">Product</th>
                                        <th>Norm</th>
                                        <th>Lower Limit</th>
                                        <th>Upper Limit</th>

                                    </tr>
                                    @foreach($product as $p)
                                    <tr>
                                        <td><input type="checkbox" class="chk" name="productId[]" value="{{$p->id}}" checked></td>
                                        <td> {{$p->productName}} </td>
                                        <td><input class="form-control"
                                                   placeholder="Norm" name="norm[]" @if($data ?? '') value="{{$data->norm}}" @else value="{{$p->default_norm}}" @endif></td>
                                        <td><input class="form-control"
                                                   placeholder="Lower Limit" name="lower_limit[]" @if($data ?? '') value="{{$data->lower_limit}}" @else value="{{$p->default_min_stock}}"   @endif></td>
                                        <td><input class="form-control"
                                                   placeholder="Upper Limit" name="upper_limit[]" @if($data ?? '') value="{{$data->upper_limit}}" @else value="{{$p->default_max_stock}}"  @endif></td>
                                    </tr>
                                    @endforeach
                                </table>
                                <div class="form-group row">

                                    <div class="col-form-label col-md-12 text-right">
                                        <button type="submit" class="btn btn-primary"  id="submit">Submit</button>
                                        <a class="btn btn-primary" href="javascript:history.back()">Back</a>
                                    </div>
                                </div>

                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <!-- /Main Wrapper -->
    </div>
    <script>
        $(document).ready(function () {
            $(".chk").click(function () {
                $("#submit").show();
                $(this).parent('td').parent('tr').toggleClass('bg-green');
            });
        });
    </script>

@endsection