UI

TechHelper.Client/Pages/Common/TextEditorDialog.razor

@@ -0,0 +1,86 @@
+@using Entities.DTO
+@inject ISnackbar Snackbar
+
+<MudDialog Class="rounded-xl" Style="background-color: #dedede" >
+    <TitleContent>
+        <MudText Typo="Typo.h6">
+            <MudIcon Icon="@Icons.Material.Filled.EditAttributes" Class="mr-3 mb-n1" />
+            <b> 编辑属性 </b>
+        </MudText>
+    </TitleContent>
+    <DialogContent>
+		<BlazoredTextEditor @ref="@TextEditor">
+			<ToolbarContent>
+				<select class="ql-header">
+					<option selected=""></option>
+					<option value="1"></option>
+					<option value="2"></option>
+					<option value="3"></option>
+					<option value="4"></option>
+					<option value="5"></option>
+				</select>
+				<span class="ql-formats">
+					<button class="ql-bold"></button>
+					<button class="ql-italic"></button>
+					<button class="ql-underline"></button>
+					<button class="ql-strike"></button>
+				</span>
+				<span class="ql-formats">
+					<select class="ql-color"></select>
+					<select class="ql-background"></select>
+				</span>
+				<span class="ql-formats">
+					<button class="ql-list" value="ordered"></button>
+					<button class="ql-list" value="bullet"></button>
+				</span>
+				<span class="ql-formats">
+					<button class="ql-link"></button>
+				</span>
+			</ToolbarContent>
+			<EditorContent>
+			</EditorContent>
+		</BlazoredTextEditor>
+    </DialogContent>
+    <DialogActions>
+        <MudButton OnClick="Cancel">Cancel</MudButton>
+        <MudButton Color="Color.Error" OnClick="Confirm">确认</MudButton>
+    </DialogActions>
+</MudDialog>
+
+@code {
+	[CascadingParameter]
+	private IMudDialogInstance MudDialog { get; set; }
+
+	[Parameter]
+	public BlazoredTextEditor TextEditor { get; set; } = new BlazoredTextEditor();
+	[Parameter]
+	public string EditorText { get; set; } = "{}";
+
+	private void HandleClick()
+	{
+		TextEditor.InsertText(EditorText);
+	}
+
+	private void Cancel() => MudDialog.Cancel();
+
+
+	protected async override Task OnInitializedAsync()
+	{
+		await DelayInsert();
+		await base.OnInitializedAsync();
+	}
+
+
+	private async Task DelayInsert()
+	{
+		await Task.Delay(100);
+		HandleClick();
+	}
+
+	private async void Confirm()
+	{
+		Snackbar.Add("属性已更新", Severity.Success);
+		EditorText = await TextEditor.GetText();
+		MudDialog.Close(DialogResult.Ok(TextEditor));
+    }
+}