@extends('panel.components.sidbar')

@section('content')

<div class="uk-width-larg-1-3" style="margin-bottom:10px; ">
    <div class="md-card" data-uk-grid-margin>
        @isset($pay)
        <form action="{{route('payment.plans.update',$pay)}}" method="POST">
            @method('put')
            @else
            <form action="{{route('payment.plans.store')}}" method="POST">
                @endisset
                @csrf

                <div class="md-card-content">
                    <h3 class="heading_a">Create New Payment Plan</h3>
                    <div class="uk-grid" data-uk-grid-margin>
                        <div class="uk-width-medium-1-3">
                            <label for="masked_currency">Price</label>

                            @isset($pay)

                            <input name="price" class="md-input masked_input label-fixed"
                                value="{{old('price',$pay->price)}}" id="masked_currency" type="text"
                                data-inputmask="'alias': 'currency', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'"
                                data-inputmask-showmaskonhover="false" />
                            @else

                            <input name="price" class="md-input masked_input label-fixed" value="{{old('price')}}"
                                id="masked_currency" type="text"
                                data-inputmask="'alias': 'currency', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'"
                                data-inputmask-showmaskonhover="false" />
                            @endisset

                            @error('price')
                            <p class="md-color-red-400">{{$message}}</p>
                            @enderror
                        </div>
                        <div class="uk-width-medium-1-3">
                            <label for="masked_period">Period</label>
                            @isset($pay)

                            <input name="period" class="md-input masked_input label-fixed"
                                value="{{old('period',$pay->period)}}" id="masked_period" type="text"
                                data-inputmask="'alias': 'currency', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'"
                                data-inputmask-showmaskonhover="false" />
                            @else
                            <input name="period" class="md-input masked_input label-fixed" value="{{old('period')}}"
                                id="masked_period" type="text"
                                data-inputmask="'alias': 'currency', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'"
                                data-inputmask-showmaskonhover="false" />
                            @endisset
                            @error('period')
                            <p class="md-color-red-400">{{$message}}</p>
                            @enderror
                            <small> <strong> Per Month </strong></small>
                        </div>
                        {{-- start type --}}
                        <div class="uk-width-medium-1">

                            {{-- 

                            @isset($pay)

                            <input name="type" class="md-input masked_input label-fixed"
                                value="{{old('type',$pay->type)}}" id="masked_currency" type="text"
                            data-inputmask="'alias': 'currency', 'groupSeparator': ',', 'autoGroup': true, 'digits':
                            2,
                            'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'"
                            data-inputmask-showmaskonhover="false" />
                            @else

                            <input name="type" class="md-input masked_input label-fixed" value="{{old('type')}}"
                                id="masked_currency" type="text"
                                data-inputmask="'alias': 'currency', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'"
                                data-inputmask-showmaskonhover="false" />
                            @endisset

                            @error('type')
                            <p class="md-color-red-400">{{$message}}</p>
                            @enderror --}}
                            <div class="uk-grid uk-grid-divider" style="margin-left:0px" data-uk-grid-margin>
                                <div class="uk-width-medium-1-2">
                                    <div class="uk-grid uk-grid-medium" data-uk-grid-margin>
                                        <div class="" style="margin-left: -100px">
                                            <ul class="uk-tab uk-tab-left" data-uk-tab="{connect:'#tabs_6'}">
                                                <li><a href="#">En</a></li>
                                                <li><a href="#">Ar</a></li>
                                            </ul>
                                        </div>
                                        <div class="uk-width-2-3">
                                            <ul id="tabs_6" class="uk-switcher uk-margin-small-top">
                                                <li>
                                                    <div class="uk-form-row">
                                                        <textarea name="type_en" cols="30" rows="4" placeholder="Type"
                                                            class="md-input">@isset($pay){{ old('type_en',$pay->getTranslation('type','en'))}}@endisset</textarea>

                                                    </div>
                                                </li>
                                                <li>
                                                    <div class="uk-form-row">
                                                        <textarea name="type_ar" cols="30" rows="4" placeholder="النوع"
                                                            class="md-input">@isset($pay){{ old ('type_ar',$pay->getTranslation('type','ar'))}}@endisset</textarea>

                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                    @error('type_en')
                                    <p class="md-color-red-400">{{$message}}</p>
                                    @enderror
                                    @error('type_ar')
                                    <p class="md-color-red-400">{{$message}}</p>
                                    @enderror
                                </div>
                            </div>

                        </div>
                        {{-- end type --}}
                        <div class="uk-width-medium-1">
                            {{-- <div class="uk-form-row">
                                <label>Description</label>
                                @isset($pay)

                                <textarea name="description" cols="30" rows="4" class="md-input no_autosize"
                                    placeholder="">{{old('description',$pay->description)}}</textarea>
                            @else

                            <textarea name="description" cols="30" rows="4" class="md-input no_autosize"
                                placeholder="">{{old('description')}}</textarea>
                            @endisset
                            @error('description')
                            <p class="md-color-red-400">{{$message}}</p>
                            @enderror
                        </div> --}}
                        <div class="uk-grid uk-grid-divider" style="margin-left:0px" data-uk-grid-margin>
                            <div class="uk-width-medium-1">
                                <div class="uk-grid uk-grid-medium" data-uk-grid-margin>
                                    <div class="" style="margin-left: -100px">
                                        <ul class="uk-tab uk-tab-left" data-uk-tab="{connect:'#tabs_7'}">
                                            <li><a href="#">En</a></li>
                                            <li><a href="#">Ar</a></li>
                                        </ul>
                                    </div>
                                    <div class="uk-width-2-3">
                                        <ul id="tabs_7" class="uk-switcher uk-margin-small-top">
                                            <li>
                                                <div class="uk-form-row">
                                                    {{-- {!! $pay->getTranslation('description','en') !!} --}}
                                                    <textarea name="description_en" cols="30" rows="4"
                                                        placeholder="Description"
                                                        class="md-input">@isset($pay){{ old('description_en',strip_tags($pay->getTranslation('description','en'))) }}@endisset</textarea>

                                                </div>
                                            </li>
                                            <li>
                                                <div class="uk-form-row">
                                                    <textarea name="description_ar" cols="30" rows="4"
                                                        placeholder="الوصف"
                                                        class="md-input">@isset($pay){{ old('description_ar',strip_tags($pay->getTranslation('description','ar'))) }}@endisset</textarea>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                @error('description_en')
                                <p class="md-color-red-400">{{$message}}</p>
                                @enderror
                                @error('description_ar')
                                <p class="md-color-red-400">{{$message}}</p>
                                @enderror
                            </div>
                        </div>
                    </div>
                    <div style="text-align:center;padding-bottom:10px;">

                        <button type="submit"
                            class="md-btn md-btn-primary md-btn-large md-btn-wave-light waves-effect waves-button waves-light">
                            @isset($pay) Update @else Create @endisset</button>
                    </div>
                </div>
            </form>

    </div>
</div>
</div>
<div class="pricing_table pricing_table_b uk-grid uk-grid-small uk-grid-width-medium-1-2 uk-grid-width-large-1-4 uk-margin-large-bottom"
    data-uk-grid-margin data-uk-grid-match="{target:'.md-card-content'}">
    @foreach($plans as $plan)
    <div>
        <div class="md-card">
            <div class="md-card-content padding-reset">
                <div style="float: right">

                    <form action="{{route('payment.plans.delete',$plan)}}" method="POST" id="delete">
                        @csrf
                        @method('DELETE')
                        @if(empty($pay) || $pay->id != $plan->id)
                        <a href="{{route('payment.plans.edit',$plan)}}"><span class="menu_icon"><i
                                    class="material-icons">edit</i></span> </a>
                        @endif

                        <a onclick="document.getElementById('delete').submit();"><span class="menu_icon"><i
                                    class="material-icons">delete</i></span> </a>
                    </form>
                </div>
                <div class="pricing_table_plan">
                    <div> {{ $plan->type }} Plan</div>

                    <div class="pricing_table_price">
                        <span class="currency">EGP</span>{{$plan->price}}
                        <span class="period">{{$plan->period}} month</span>
                    </div>
                    <div class="pricing_table_features" style="padding-bottom:10px; ">
                        {!! $plan->getTranslation('description','en') !!}
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endforeach
</div>
@endsection