@include('header')

<div class="x_panel">
    <div class="x_title">
        <h2>درباره ما
        </h2>
        <ul class="nav navbar-right panel_toolbox">
            <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
            </li>
        </ul>
        <div class="clearfix"></div>
    </div>
    <div class="x_content">
        <div id="alerts"></div>
        <div class="btn-toolbar editor" data-role="editor-toolbar" data-target="#editor">
            <div class="btn-group">
                <ul class="dropdown-menu">
                    <li>
                        <a data-edit="fontSize 5">
                            <p style="font-size:17px">بزرگ</p>
                        </a>
                    </li>
                    <li>
                        <a data-edit="fontSize 3">
                            <p style="font-size:14px">معمولی</p>
                        </a>
                    </li>
                    <li>
                        <a data-edit="fontSize 1">
                            <p style="font-size:11px">کوچک</p>
                        </a>
                    </li>
                </ul>
            </div>

            <div class="btn-group">
                <a class="btn" data-edit="bold" title="درشت (Ctrl/Cmd+B)"><i class="fa fa-bold"></i></a>
                <a class="btn" data-edit="italic" title="ایتالیک (Ctrl/Cmd+I)"><i class="fa fa-italic"></i></a>
                <a class="btn" data-edit="strikethrough" title="خط خورده"><i class="fa fa-strikethrough"></i></a>
                <a class="btn" data-edit="underline" title="زیرخط (Ctrl/Cmd+U)"><i class="fa fa-underline"></i></a>
            </div>

            <div class="btn-group">
                <a class="btn" data-edit="insertunorderedlist" title="لیست دایره ای"><i class="fa fa-list-ul"></i></a>
                <a class="btn" data-edit="insertorderedlist" title="لیست عددی"><i class="fa fa-list-ol"></i></a>
                <a class="btn" data-edit="outdent" title="کاهش دندانه (Shift+Tab)"><i class="fa fa-dedent"></i></a>
                <a class="btn" data-edit="indent" title="دنداره (Tab)"><i class="fa fa-indent"></i></a>
            </div>

            <div class="btn-group">

                <a class="btn" data-edit="justifyright" title="تراز راست (Ctrl/Cmd+R)"><i class="fa fa-align-right"></i></a>
                <a class="btn" data-edit="justifycenter" title="وسط (Ctrl/Cmd+E)"><i class="fa fa-align-center"></i></a>
                <a class="btn" data-edit="justifyleft" title="تراز چپ (Ctrl/Cmd+L)"><i class="fa fa-align-left"></i></a>
                <a class="btn" data-edit="justifyfull" title="جاستیفای (Ctrl/Cmd+J)"><i class="fa fa-align-justify"></i></a>
            </div>

            <div class="btn-group">
                <a class="btn" data-edit="undo" title="باطل کردن (Ctrl/Cmd+Z)"><i class="fa fa-undo"></i></a>
                <a class="btn" data-edit="redo" title="بازگردانی (Ctrl/Cmd+Y)"><i class="fa fa-repeat"></i></a>
            </div>
        </div>

        <div id="editor" class="editor-wrapper placeholderText" contenteditable="true">
            {!! $item !!}
        </div>

        <textarea name="descr" id="descr" style="display:none;"></textarea>

        <br>
        <button onclick="SendData()"  type="submit" class="right_message" style="border: none">
            ارسال
        </button>

        <div class="ln_solid"></div>

    </div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="sweetalert2.all.min.js"></script>


<script>

    function SendData() {
        var editor = document.getElementById("editor").innerHTML

        Swal.fire({
            title: 'آیا مطمئن هستید؟',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#0082e0',
            cancelButtonColor: '#c40909',
            confirmButtonText: 'بله مطمئنم',
            cancelButtonText: 'کنسل',
        }).then((result) => {
            if (result.isConfirmed) {
                $.ajax({
                        type: "POST",
                        url: '/panel/about_page_action',
                        data: {
                            text: editor,
                        },
                        success: function (res) {
                            if (res.status == 'update') {
                                Swal.fire('انجام شد!').then((result) => {
                                    if (result.isConfirmed) {
                                        location.reload();
                                    }
                                })
                            } else {
                                alert('مشکلی پیش آمد. لطفا مجدد تلاش کنید')
                            }
                        },
                        error: function (res) {
                            console.log(res);
                        },
                    }
                )
            }
        })
    }


</script>


@include('footer')