@extends('admin.layouts.master')

@section('page_title', __('admin.Add New :name', ['name' => __('admin.Configration')]))

@section('page_heading', __('admin.Add New :name', ['name' => __('admin.Configration')]))

@section('page_text', __('admin.Add New :name', ['name' => __('admin.Configration')]))

@section('page_breadcrumb_icon') <i class="ki-duotone ki-home fs-3 text-gray-500 me-n1"></i> @endsection

@section('page_breadcrumb_item', 'Configration')

@section('page_breadcrumb_item2', 'Add Configration')

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="card card-flush">
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-8">
                            {!! Form::open(['novalidate' => 'novalidate', 'id' => 'signupForm', 'route' => 'configration.store', 'method' => 'POST','enctype'=>"multipart/form-data"]) !!}
                            <div class="d-flex flex-column mb-7 fv-row">
                                <label for="name" class="fs-6 fw-semibold mb-2">@lang('admin.Title')</label>
                                {!! Form::text('title', null, ['required' => 'required', 'placeholder' => 'Enter title', 'class' => 'form-control']) !!}
                            </div>
                            <div class="d-flex flex-column mb-7 fv-row ">
                                <label class="fs-6 fw-semibold mb-2">@lang('admin.Type')</label>
                                <div class="id_100">
                                    {!! Form::select('type', $type, [], ['class' => 'form-select hh','data-control'=>"select2"]) !!}
                                </div>
                            </div>
                            <div class="d-flex flex-column mb-7 fv-row box">

                            </div>
                            <div class="d-flex flex-column mb-7 fv-row">
                                <div class="divider"></div>
                                <div class="clearfix">

                                    <button type="submit" id="next-btn"
                                        class="btn-shadow btn-wide float-right   btn-hover-shine btn btn-primary">
                                        @lang('admin.Submit')
                                    </button>
                                    <a href="{{ route('configration.index') }}" id="prev-btn"
                                        class="btn-shadow float-right btn-wide  mr-3 btn btn-outline-secondary">
                                        @lang('admin.Cancel')
                                    </a>
                                </div>
                            </div>
                            {!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('js')
    <script>
        $(document).ready(function() {
            $("select").change(function() {
                var value = $(this).children("option:selected").val();
                console.log(value);
                if (value == 1) {
                    $('.box').empty();
                    var data = '<label class="fs-6 fw-semibold mb-2">@lang("admin.Text")</label><div class="id_100">'
                        +'{!! Form::text("value_data", null, ["required" => "required", "placeholder" => "Enter text", "class" => "form-control"]) !!}';
                    $('.box').append(data)
                }else if(value == 2){
                    $('.box').empty();
                    var data = '<label class="fs-6 fw-semibold mb-2">@lang("admin.File")</label><div class="d-flex flex-column mb-7 fv-row"><fieldset class="d-flex flex-column mb-7 fv-row">'
                                +'<div class="custom-file">'
                                    +'<input type="file" class="form-control custom-file-input" name="value_data" required>'
                                +'</div></fieldset></div>';
                    $('.box').append(data)
                }else{
                    $('.box').empty();
                }
            });
        })
    </script>
@endsection