@extends('layouts.admin')
@section('styles')
    <link rel="stylesheet" href="{{ asset('assets/richtexteditor/rte_theme_default.css') }}" />
@endsection
@section('content')
    <div class="page-wrapper">
        <!-- Page header -->
        <div class="page-header d-print-none">
            <div class="container-xl">
                <div class="row g-2 align-items-center">
                    <div class="col">
                        <h2 class="page-title">
                            New plan
                        </h2>
                    </div>
                </div>
            </div>
        </div>
        <!-- Page body -->
        <div class="page-body">
            <div class="container-xl">


                <div class="row">
                    <div class="col-md-12">

                        <div class="card">
                            <div class="card-header">
                                <h3 class="card-title">Add New plan</h3>
                            </div>

                            <form method="POST" action="{{ route('admin.saveplans') }}" id="editorForm">
                                <input type="hidden" name="editorContent" id="editorContent">
                                @csrf
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-12">
                                            <label>Name</label>
                                            <input type="text" class="form-control" required name="name">
                                        </div>
                                        <div class="col-md-12 mt-3">
                                            <div id="div_editor1">
                                                <p>This is a default toolbar demo of Rich text editor.</p>
                                            </div>
                                        </div>
                                        <div class="col-md-12 mt-3">
                                            <label>Price</label>
                                            <input type="number" name="price" class="form-control">
                                        </div>
                                        <div class="col-md-12 mt-3">
                                            <label>Duration (In Days)</label>
                                            <input type="number" name="duration" class="form-control">
                                        </div>
                                        <div class="col-md-12 mt-3">
                                            <label>Feature at front</label>
                                            <select class="form-control" name="show_front" required>
                                                <option value="1">Yes</option>
                                                <option value="0">No</option>
                                            </select>
                                        </div>
                                        <div class="col-md-12 mt-5">
                                            <input type="submit" class="btn btn-success pull-right" value="Add"
                                                style="float: right">
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>

                </div>


            </div>
        </div>

        @include('includes.admin_footer')
    </div>
@endsection

@section('scripts')
    <script type="text/javascript" src="{{ asset('assets/richtexteditor/rte.js') }}"></script>
    <script type="text/javascript" src='{{ asset('assets/richtexteditor/plugins/all_plugins.js') }}'></script>
    <script>
        var editor1 = new RichTextEditor("#div_editor1");

        document.getElementById('editorForm').addEventListener('submit', function(event) {
            // Prevent the form from submitting immediately
            event.preventDefault();

            // Get the content from the Rich Text Editor
            var editorContent = editor1.getHTMLCode(); // Assuming `getHTMLCode` method returns the editor content

            // Set the content to the hidden input field
            document.getElementById('editorContent').value = editorContent;

            // Submit the form
            this.submit();
        });
        //editor1.setHTMLCode("Use inline HTML or setHTMLCode to init the default content.");
    </script>
@endsection