@extends('layouts.admin')

@section('content')

<div class="card">
    <div class="card-header">
        {{ trans('global.create') }} {{ trans('global.offer.title_singular') }}
    </div>
    <div class="card-body">
        {!! Form::open(['method' => 'POST', 'route' => 'admin.offers.store', 'class' => 'form-horizontal', 'enctype' => 'multipart/form-data']) !!}

            <div class="row">
                
                <div class="col-lg-6">
                    <div class="form-group{{ $errors->has('title') ? ' has-error' : '' }}">
                        <label for="title">{{ trans('global.offer.fields.title') }}</label>
                        {!! Form::text('title', null, ['class' => 'form-control','required']) !!}
                        <small class="text-danger">{{ $errors->first('title') }}</small>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="form-group {{ $errors->has('category') ? 'has-error' : '' }}">
                        <label for="category">{{ trans('global.offer.fields.category') }}</label>
                        <select name="category_id" id="category_id" class="form-control" required>
                            <option value="">Choose</option>
                            @foreach($categories as $id => $value)
                                <option value="{{ $value->id }}">{{ $value->name_en }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>
            

            <div class="row">
                <div class="col-lg-6">
                    <div class="form-group{{ $errors->has('image') ? ' has-error' : '' }}">
                        <label for="image">{{ trans('global.offer.fields.offer_image') }}</label><br>
                        {!! Form::file('image', ['class' => 'form-control','required', 'accept' => 'image/*']) !!} <br>
                        <small class="text-danger">{{ $errors->first('image') }}</small>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="form-group {{ $errors->has('dis_product') ? 'has-error' : '' }}">
                        <label for="dis_product">Please choose discount products*</label>
                        <select class="dis_product" name="dis_product[]" multiple="multiple" style="width: 100%">
                            @foreach ($products as $product)
                            <option value="{{ $product->product_price_id }}">{{ $product->name_en }} ( {{ $product->color_name ?? $product->name }} )</option>
                            @endforeach
                        </select>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-12">
                    <div class="form-group{{ $errors->has('description') ? ' has-error' : '' }}">
                        <label for="description">{{ trans('global.offer.fields.description') }}</label>
                        {!! Form::textarea('description', null, ['class' => 'form-control', 'required']) !!}
                        <small class="text-danger">{{ $errors->first('description') }}</small>
                    </div>
                </div>
            </div>
            <div class="checkbox">
            <label>
                <input name="active" type="checkbox" {!! old("active") ? 'checked="checked"' : '' !!} > Active
            </label>
            </div>
            <div class="text-right">
                {!! Form::submit('Save', ['class' => 'btn btn-info pull-right']) !!}
            </div>
        {!! Form::close() !!}
    </div>
</div>

@endsection
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        var placeholder = "Select Products"
        $(".dis_product").select2({
            placeholder: placeholder,
            allowClear: false,
            minimumResultsForSearch: 5
        });
    });
    
</script>