Init commit

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Contents/AddWidgetModal.cshtml

@@ -0,0 +1,29 @@
+@page
+@using Microsoft.AspNetCore.Mvc.Localization
+@using Volo.CmsKit.Admin.Web.Pages
+@using Volo.CmsKit.Localization
+@using Volo.CmsKit.Admin.Web.Pages.CmsKit.Contents;
+@inject IHtmlLocalizer<CmsKitResource> L
+
+
+@model AddWidgetModal;
+@{
+    Layout = null;
+}
+
+@section scripts
+{
+    <abp-script src="/Pages/CmsKit/Contents/addWidgetModal.js" />
+}
+
+<abp-modal size="Large" id="addWidgetModal">
+    <abp-modal-header title="@L["Edit"].Value"></abp-modal-header>
+
+    <abp-modal-body>
+        <div class="mb-3">
+            <small class="text-muted">Text</small>
+            <input id="textId" type="text" />
+            <button class="btn btn-primary float-end" type="submit" id="poll-change-text-button">@L["Save"]</button>
+        </div>
+    </abp-modal-body>
+</abp-modal>

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Contents/AddWidgetModal.cshtml.cs

@@ -0,0 +1,30 @@
+using System;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Mvc;
+using Volo.Abp.AspNetCore.Mvc.UI.RazorPages;
+
+namespace Volo.CmsKit.Admin.Web.Pages.CmsKit.Contents;
+
+public class AddWidgetModal : AbpPageModel
+{
+    [BindProperty(SupportsGet = true)]
+    public Guid Id { get; set; }
+
+    [BindProperty(SupportsGet = true)]
+    public string Text { get; set; }
+
+
+    public AddWidgetModal()
+    {
+    }
+
+    public async Task OnGetAsync()
+    {
+
+    }
+
+    public async Task OnPostAsync()
+    {
+
+    }
+}

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Contents/addWidgetModal.js

@@ -0,0 +1,14 @@
+var abp = abp || {};
+$(function () {
+    alert("hello guys1");
+    abp.modals.addWidgetModal = function () {
+
+        var initModal = function () {
+            alert("hello guys");
+        };
+
+        return {
+            initModal: initModal
+        };
+    };
+});

modules/cms-kit/src/Volo.CmsKit.Admin.Web/Pages/CmsKit/Pages/create.js

@@ -6,6 +6,8 @@ $(function () {
     var $slug = $('#ViewModel_Slug');
     var $buttonSubmit = $('#button-page-create');
 
+    var widgetModal = new abp.ModalManager({ viewUrl: abp.appPath + "CmsKit/Contents/AddWidgetModal", modalClass: "addWidgetModal" });
+
     var scriptEditor = CodeMirror.fromTextArea(document.getElementById("ViewModel_Script"), {
         mode: "javascript",
         lineNumbers: true
@@ -25,7 +27,7 @@ $(function () {
 
     $createForm.on('submit', function (e) {
         e.preventDefault();
-        
+
         if ($createForm.valid()) {
 
             abp.ui.setBusy();
@@ -112,6 +114,19 @@ $(function () {
             minHeight: "25em",
             initialEditType: 'markdown',
             language: $editorContainer.data("language"),
+            toolbarItems: [
+                ['heading', 'bold', 'italic', 'strike'],
+                ['hr', 'quote'],
+                ['ul', 'ol', 'task', 'indent', 'outdent'],
+                ['table', 'image', 'link'],
+                ['code', 'codeblock'],
+                // Using Option: Customize the last button
+                [{
+                    el: createLastButton(),
+                    command: 'bold',
+                    tooltip: 'Add Widget'
+                }]
+            ],
             hooks: {
                 addImageBlobHook: uploadFile,
             },
@@ -122,6 +137,15 @@ $(function () {
                 }
             }
         });
+
+        editor.insertToolbarItem({ groupIndex: 0, itemIndex: 0 }, {
+            name: 'myItem',
+            tooltip: 'Custom Button',
+            command: 'bold',
+            text: '@',
+            className: 'toastui-editor-toolbar-icons first',
+            style: { backgroundImage: 'none' }
+        });
     }
 
     function uploadFile(blob, callback, source) {
@@ -155,4 +179,21 @@ $(function () {
             }
         });
     }
+
+    function createLastButton() {
+        const button = document.createElement('button');
+
+        button.className = 'toastui-editor-toolbar-icons last dropdown';
+        button.style.backgroundImage = 'none';
+        button.style.margin = '0';
+        button.innerHTML = `AW`;
+        button.addEventListener('click', (event) => {
+            //editor.exec('bold');
+            event.preventDefault();
+            alert("ye");
+            widgetModal.open();
+        });
+
+        return button;
+    }
 });