@extends('company.layout.content')

@section('customTitle')
{{__('company.Offers.fields.Add A New Offer')}}
@endsection

@section('customStyle')
<link href='{{ asset("company/$locale/assets/css/elements/alert.css") }}' rel="stylesheet" type="text/css" />
<link href='{{ asset("company/$locale/plugins/flatpickr/flatpickr.css") }}' rel="stylesheet" type="text/css" />
<link href='{{ asset("company/$locale/plugins/flatpickr/custom-flatpickr.css") }}' rel="stylesheet" type="text/css" />
@endsection

@section('customBody')
<div id="content" class="main-content">
    <div class="container">
        <div class="container">
            <div class="row">
                <div id="flStackForm" class="col-12 layout-spacing layout-top-spacing">
                    <div class="statbox widget box box-shadow">
                        <div class="widget-header">
                            <div class="row">
                                <div class="col-12 uroad-section">
                                    <h4>{{__('company.Offers.fields.Add A New Offer')}}</h4>
                                </div>
                            </div>
                        </div>

                        <div class="widget-content widget-content-area">
                            <form action="{{ route('company.offer.store') }}" method="POST" enctype="multipart/form-data">
                                @csrf
                                <div class="form-row mb-4">

                                    <div class="form-group col-md-4">
                                        <label for="from_branch">{{ __('company.car_transport.fields.current_branch') }}</label>
                                        <select id="from_branch" class="form-control basic" name="branch_id" required @if(auth()->user()->is_senior_management != true) readonly @endif>
                                            @if (auth()->user()->is_senior_management == true)
                                                @if($branches_count > 0)
                                                    <option value="all_branches">{{ __('general.all_branches') }}</option>    
                                                @endif

                                                @foreach ($branches as $branch)
                                                    <option value="{{ $branch->id }}">{{ $branch->name }}</option>
                                                @endforeach
                                            @else
                                            <option value="{{ auth()->user()->branch_id ?? null }}" selected>
                                                {{ auth()->user()->branch->name ?? null }}
                                            </option>
                                            @endif
                                        </select>
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="car_type">{{ __('company.car_transport.fields.car_type') }}</label>
                                        <select required id="car_type" class="form-control basic" name="car_id">
                                            <option value="" selected>
                                                {{ __('company.car_transport.fields.car_type') }}</option>
                                        </select>
                                    </div>

                                    {{-- <div class="form-group col-md-4">
                                        <label for="is_the_offer_unlimited">{{__('company.Offers.fields.is_the_offer_unlimited')}}</label>
                                        <select id="is_the_offer_unlimited" class="form-control basic" name="is_the_offer_unlimited" required>
                                            <option value="1">{{ __('general.yes') }}</option>
                                            <option value="0">{{ __('general.no') }}</option>
                                        </select>
                                    </div> --}}

                                    <div class="form-group col-md-4">
                                        <label for="start-date">{{__('company.Offers.fields.Offer Start Date')}}</label>
                                        <input type="date" class="form-control basicFlatpickrStartDate flatpickr flatpickr-input" id="start-date" placeholder="{{__('company.Offers.fields.Offer Start Date')}}" onchange="MinDateDependsOnStartDate('offer-expiry-date', this)" name="start_date">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="end-date">{{__('company.Offers.fields.Offer End Date')}}</label>
                                        <input type="date" class="form-control offer-expiry-date basicFlatpickr flatpickr flatpickr-input" id="end-date" placeholder="{{__('company.Offers.fields.Offer End Date')}}" name="end_date">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="daily_percentage">{{__('company.Offers.fields.daily_percentage')}}</label>
                                        <input type="number" class="form-control" id="daily_percentage" placeholder="{{__('company.Offers.fields.daily_percentage')}}" name="daily_percentage">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="weekly_percentage">{{__('company.Offers.fields.weekly_percentage')}}</label>
                                        <input type="number" class="form-control" id="weekly_percentage" placeholder="{{__('company.Offers.fields.weekly_percentage')}}" name="weekly_percentage">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="monthly_percentage">{{__('validation.attributes.monthly_percentage')}}</label>
                                        <input type="number" class="form-control" id="monthly_percentage" placeholder="{{__('validation.attributes.monthly_percentage')}}" name="monthly_percentage">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="three_month_percentage">{{__('validation.attributes.three_month_percentage')}}</label>
                                        <input type="number" class="form-control" id="three_month_percentage" placeholder="{{__('validation.attributes.three_month_percentage')}}" name="three_month_percentage">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="six_month_percentage">{{__('validation.attributes.six_month_percentage')}}</label>
                                        <input type="number" class="form-control" id="six_month_percentage" placeholder="{{__('validation.attributes.six_month_percentage')}}" name="six_month_percentage">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="nine_month_percentage">{{__('validation.attributes.nine_month_percentage')}}</label>
                                        <input type="number" class="form-control" id="nine_month_percentage" placeholder="{{__('validation.attributes.nine_month_percentage')}}" name="nine_month_percentage">
                                    </div>

                                    <div class="form-group col-md-4">
                                        <label for="twelve_month_percentage">{{__('validation.attributes.twelve_month_percentage')}}</label>
                                        <input type="number" class="form-control" id="twelve_month_percentage" placeholder="{{__('validation.attributes.twelve_month_percentage')}}" name="twelve_month_percentage">
                                    </div>
                                </div>

                                <input type="submit" class="btn btn-primary mt-3" value="{{__('general.submit')}}">
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('customScript')
<script src='{{ asset("company/$locale/plugins/flatpickr/flatpickr.js") }}'></script>
<script src='{{ asset("company/$locale/plugins/flatpickr/custom-flatpickr.js") }}'></script>

<script>
    $("#offers-menu-box").attr("data-active", "true");
</script>

    <script>
    $('#from_branch').attr('selected', function() {
        ajaxSelect2('#car_type', '/company/select2/carsInBranch', {'branch_id': $(this).val(), 'withAll': true});
    });

    $('#from_branch').on('change', function() {
        ajaxSelect2('#car_type', '/company/select2/carsInBranch', {'branch_id': $(this).val(), 'withAll': true});
    });

    $("#is_the_offer_unlimited").on('change input', function(){
            if($(this).val() == false)
            {
                $("#start-date").prop("disabled", true);
                $("#end-date").prop("disabled", true);
                $("#start-date").prop("required", false);
                $("#end-date").prop("required", false);
            }else{
                $("#start-date").prop("disabled", false);
                $("#end-date").prop("disabled", false);
                $("#start-date").prop("required", true);
                $("#end-date").prop("required", true);
            }
        });

        $("#is_the_offer_unlimited").attr('selected', function(){
            if($(this).val() == false)
            {
                $("#start-date").prop("disabled", true);
                $("#end-date").prop("disabled", true);
                $("#start-date").prop("required", false);
                $("#end-date").prop("required", false);
            }else{
                $("#start-date").prop("disabled", false);
                $("#end-date").prop("disabled", false);
                $("#start-date").prop("required", true);
                $("#end-date").prop("required", true);
            }
        });
</script>

@endsection