kocoded/oqtane.framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #4161 from zyhfish/task/fix-issue-4158

Browse Source 
Fix #4158: insert image into correct position.
This commit is contained in:
Shaun Walker 2024-04-22 16:28:47 -04:00 committed by GitHub
commit 86cbdf2442
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 31 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
Oqtane.Client/Modules/Controls/RichTextEditor.razor
View File

@ -122,6 +122,7 @@
private string _message = string.Empty;
private bool _contentchanged = false;
private int _editorIndex;
[Parameter]
public string Content { get; set; }
@ -275,18 +276,18 @@
// return original raw html content
return _originalrawhtml;
}
}
}
}
}
public async Task InsertRichImage()
{
_message = string.Empty;
if (_richfilemanager)
{
var file = _fileManager.GetFile();
public async Task InsertRichImage()
{
_message = string.Empty;
if (_richfilemanager)
{
var file = _fileManager.GetFile();
if (file != null)
{
await interop.InsertImage(_editorElement, file.Url, ((!string.IsNullOrEmpty(file.Description)) ? file.Description : file.Name));
await interop.InsertImage(_editorElement, file.Url, ((!string.IsNullOrEmpty(file.Description)) ? file.Description : file.Name), _editorIndex);
_richhtml = await interop.GetHtml(_editorElement);
_richfilemanager = false;
}
@ -297,6 +298,7 @@
}
else
{
_editorIndex = await interop.GetCurrentCursor(_editorElement);
_richfilemanager = true;
}
StateHasChanged();

16
Oqtane.Client/Modules/Controls/RichTextEditorInterop.cs
View File

@ -105,13 +105,25 @@ namespace Oqtane.Modules.Controls
}
}
public Task InsertImage(ElementReference quillElement, string imageUrl, string altText)
public ValueTask<int> GetCurrentCursor(ElementReference quillElement)
{
try
{
return _jsRuntime.InvokeAsync<int>("Oqtane.RichTextEditor.getCurrentCursor", quillElement);
}
catch
{
return new ValueTask<int>(Task.FromResult(0));
}
}
public Task InsertImage(ElementReference quillElement, string imageUrl, string altText, int editorIndex)
{
try
{
_jsRuntime.InvokeAsync<object>(
"Oqtane.RichTextEditor.insertQuillImage",
quillElement, imageUrl, altText);
quillElement, imageUrl, altText, editorIndex);
return Task.CompletedTask;
}
catch

10
Oqtane.Server/wwwroot/js/quill-interop.js
View File

@ -35,13 +35,15 @@ Oqtane.RichTextEditor = {
enableQuillEditor: function (editorElement, mode) {
editorElement.__quill.enable(mode);
},
insertQuillImage: function (quillElement, imageURL, altText) {
var Delta = Quill.import('delta');
editorIndex = 0;
getCurrentCursor: function (quillElement) {
var editorIndex = 0;
if (quillElement.__quill.getSelection() !== null) {
editorIndex = quillElement.__quill.getSelection().index;
}
return editorIndex;
},
insertQuillImage: function (quillElement, imageURL, altText, editorIndex) {
var Delta = Quill.import('delta');
return quillElement.__quill.updateContents(
new Delta()