@extends('admin.layouts.master')
@section('content')
    @include('admin.layouts.breadcrumbs')
    <section id="basic-horizontal-layouts">
        <div class="row match-height">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h4 class="card-title">{{trans('sidebar.add')}}</h4>
                    </div>
                    <div class="card-content">
                        <div class="card-body">
                            <form class="form form-horizontal" action="{{route('admin.workshops.store')}}"
                                  method="POST" enctype="multipart/form-data">
                                {{csrf_field()}}
                                <div class="form-body">
                                    <div class="row">
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>{{trans('sidebar.title')}}</span>
                                                </div>
                                                <div class="col-md-8">
                                                    <input type="text" class="form-control" name="title">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>{{trans('sidebar.sub_title')}}</span>
                                                </div>
                                                <div class="col-md-8">
                                                    <input type="text" class="form-control" name="sub_title">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>Description</span>
                                                </div>
                                                <div class="col-md-8">
                                                    <textarea class="form-control" name="description"></textarea>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>{{trans('sidebar.price')}}</span>
                                                </div>
                                                <div class="col-md-8">
                                                    <input type="number" class="form-control" name="price">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>{{trans('sidebar.skills')}}</span>
                                                </div>
                                                <div class="col-md-7">
                                                    <input type="text" class="form-control" name="skills[]">
                                                </div>
                                                <div class="col-md-1">
                                                    <button type="button" class="btn btn-primary" onclick="addRow()">+</button>
                                                </div>
                                            </div>
                                        </div>
                                        <div  class="col-12">
                                            <div class="row" id="row_container"></div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>{{trans('sidebar.image')}}</span>
                                                </div>
                                                <div class="col-md-8">
                                                    <input type="file" class="form-control" name="image">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>Home Screen</span>
                                                </div>
                                                <div class="col-md-8">
                                                    <div class="vs-checkbox-con vs-checkbox-primary">
                                                        <input type="checkbox" value="1" name="fixed">
                                                        <span class="vs-checkbox">
                                                            <span class="vs-checkbox--check">
                                                                <i class="vs-icon feather icon-check"></i>
                                                            </span>
                                                        </span>
                                                        <span class="">Yes</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-12">
                                            <div class="form-group row">
                                                <div class="col-md-4">
                                                    <span>Whatsapp</span>
                                                </div>
                                                <div class="col-md-8">
                                                    <input type="text" class="form-control" name="whatsapp">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-8 offset-md-4">
                                            <button type="submit"
                                                    class="btn btn-primary mr-1 mb-1">{{trans('sidebar.save')}}</button>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection
@section('script')
    <script>
        // tinymce.init({
        //     selector: 'textarea',
        //     plugins: 'advlist autolink lists link image charmap preview anchor pagebreak',
        //     toolbar_mode: 'floating',
        // });
        function addRow(){
            $('#row_container').append('<div class="col-12">'+
                '<div class="form-group row">'+
                '<div class="col-md-4">'+
                '<span>{{trans('sidebar.skills')}}</span>'+
        '</div>'+
        '<div class="col-md-8">'+
        '<input type="text" class="form-control" name="skills[]">'+
        '</div>'+
        '</div>'+
        '</div>');
        }
    </script>
@endsection