features/rewrite/modaldialog #15
@ -1,49 +1,33 @@
 | 
				
			|||||||
@page "/"
 | 
					@page "/"
 | 
				
			||||||
@using Connected.Models;
 | 
					 | 
				
			||||||
@using Connected.Components;
 | 
					@using Connected.Components;
 | 
				
			||||||
 | 
					@using Connected.Models.Modal;
 | 
				
			||||||
 | 
					@using Connected.Services;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					@inject ModalDialogService modalDialog;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<h1 style="text-align:center;">Component Sandbox</h1>
 | 
					<h1 style="text-align:center;">Component Sandbox</h1>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<Grid>
 | 
					 | 
				
			||||||
    @for (int i = 0; i < 5; i++)
 | 
					 | 
				
			||||||
    {
 | 
					 | 
				
			||||||
        int num = i;
 | 
					 | 
				
			||||||
        <GridRow>
 | 
					 | 
				
			||||||
            <GridRowContent>
 | 
					 | 
				
			||||||
                Fixed content @num.ToString()
 | 
					 | 
				
			||||||
            </GridRowContent>
 | 
					 | 
				
			||||||
            <GridRowContent Collapsable=true>
 | 
					 | 
				
			||||||
                Collapsable content @num.ToString()
 | 
					 | 
				
			||||||
            </GridRowContent>
 | 
					 | 
				
			||||||
        </GridRow>
 | 
					 | 
				
			||||||
    }
 | 
					 | 
				
			||||||
</Grid>
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
<p>Izbran datum je: @date</p>
 | 
					<Button OnClick="OpenValueDialog">Open dialog</Button>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<FormWizard Id="Wizard1">
 | 
					<ReturnModal ReturnType="int" @bind-Visible=@ResultDialogShown @bind-Value=@value Title="Dialog1">
 | 
				
			||||||
    <FormWizardStep Name="Step1">
 | 
					    <NumberInput @bind-Value=@value></NumberInput>
 | 
				
			||||||
        Step1
 | 
					</ReturnModal>
 | 
				
			||||||
    </FormWizardStep>
 | 
					 | 
				
			||||||
    <FormWizardStep Name="Step2">
 | 
					 | 
				
			||||||
        Step2
 | 
					 | 
				
			||||||
    </FormWizardStep>
 | 
					 | 
				
			||||||
    <FormWizardStep Name="Step3">
 | 
					 | 
				
			||||||
        Step3
 | 
					 | 
				
			||||||
    </FormWizardStep>
 | 
					 | 
				
			||||||
    <FormWizardStep Name="Step4">
 | 
					 | 
				
			||||||
        Step4
 | 
					 | 
				
			||||||
    </FormWizardStep>
 | 
					 | 
				
			||||||
</FormWizard>
 | 
					 | 
				
			||||||
<DatePicker 
 | 
					 | 
				
			||||||
CloseOnDateSelect=true
 | 
					 | 
				
			||||||
@bind-SelectedDate=@date>
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
</DatePicker>
 | 
					<p>Modal value @value.ToString()</p>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<p>Selected date is @date.ToString()</p>
 | 
					 | 
				
			||||||
 | 
					
 | 
				
			||||||
@code {
 | 
					@code {
 | 
				
			||||||
    DateTime date = DateTime.Today;
 | 
					    DateTime date = DateTime.Today;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    int value = 0;
 | 
				
			||||||
 | 
					    bool ResultDialogShown = false;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    private void OpenValueDialog()
 | 
				
			||||||
 | 
					    {
 | 
				
			||||||
 | 
					        ResultDialogShown = !ResultDialogShown;
 | 
				
			||||||
 | 
					        StateHasChanged();
 | 
				
			||||||
 | 
					    }    
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
							
								
								
									
										22
									
								
								src/Connected.Components/Components/ReturnModal.razor
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										22
									
								
								src/Connected.Components/Components/ReturnModal.razor
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,22 @@
 | 
				
			|||||||
 | 
					@typeparam ReturnType
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					@using Connected.Models.Modal;
 | 
				
			||||||
 | 
					@if (Visible)
 | 
				
			||||||
 | 
					{
 | 
				
			||||||
 | 
					    <div class="modal fade show" tabindex="-1">
 | 
				
			||||||
 | 
					        <div class="modal-dialog modal-dialog-scrollable modal-dialog-centered">
 | 
				
			||||||
 | 
					            <div class="modal-content">
 | 
				
			||||||
 | 
					                <div class="modal-header">
 | 
				
			||||||
 | 
					                        <h3 class="modal-title">@Title</h3>
 | 
				
			||||||
 | 
					                </div>
 | 
				
			||||||
 | 
					                <div class="modal-body">
 | 
				
			||||||
 | 
					                    @ChildContent
 | 
				
			||||||
 | 
					                </div>
 | 
				
			||||||
 | 
					                <div class="modal-footer">
 | 
				
			||||||
 | 
					                    <button type="button" class="btn btn-sm btn-core" @onclick="@(()=>CloseModal())">Zapri</button>
 | 
				
			||||||
 | 
					                    <button type="button" class="btn btn-sm btn-info" @onclick="@(()=>CloseModal(true))">Ok</button>
 | 
				
			||||||
 | 
					                </div>
 | 
				
			||||||
 | 
					            </div>
 | 
				
			||||||
 | 
					        </div>
 | 
				
			||||||
 | 
					    </div>
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
							
								
								
									
										71
									
								
								src/Connected.Components/Components/ReturnModal.razor.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										71
									
								
								src/Connected.Components/Components/ReturnModal.razor.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,71 @@
 | 
				
			|||||||
 | 
					using Connected.Models.Modal;
 | 
				
			||||||
 | 
					using Microsoft.AspNetCore.Components;
 | 
				
			||||||
 | 
					using Microsoft.AspNetCore.Components.Web;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					namespace Connected.Components;
 | 
				
			||||||
 | 
					public partial class ReturnModal<ReturnType>
 | 
				
			||||||
 | 
					{
 | 
				
			||||||
 | 
						[Parameter]
 | 
				
			||||||
 | 
						public bool Visible { get; set; } = false;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						[Parameter]
 | 
				
			||||||
 | 
						public EventCallback<bool> VisibleChanged { get; set; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						[Parameter]
 | 
				
			||||||
 | 
						public string Title { get; set; } = string.Empty;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						[Parameter]
 | 
				
			||||||
 | 
						public RenderFragment? ChildContent { get; set; }
 | 
				
			||||||
 | 
						protected bool OverlayClickToClose { get; set; } = true;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						private ReturnType initialValue { get; set; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						[Parameter]
 | 
				
			||||||
 | 
						public ReturnType Value { get; set; } = default;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						[Parameter]
 | 
				
			||||||
 | 
						public EventCallback<ReturnType> ValueChanged { get; set; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						protected ModalOptions? ModalOptions { get; set; }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						public async Task CloseModal(bool returnResult = false)
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
							Visible = false;
 | 
				
			||||||
 | 
							VisibleChanged.InvokeAsync(Visible);
 | 
				
			||||||
 | 
							Title = "";
 | 
				
			||||||
 | 
							ChildContent = null;
 | 
				
			||||||
 | 
							StateHasChanged();
 | 
				
			||||||
 | 
							if (!returnResult)
 | 
				
			||||||
 | 
								await ValueChanged.InvokeAsync(initialValue);
 | 
				
			||||||
 | 
							else
 | 
				
			||||||
 | 
								initialValue = Value;
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						public void CheckEscape(KeyboardEventArgs args)
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
							if (!ModalOptions.DisableEscKey)
 | 
				
			||||||
 | 
							{
 | 
				
			||||||
 | 
								var key = args.Key.ToLower();
 | 
				
			||||||
 | 
								if (key.Equals("escape"))
 | 
				
			||||||
 | 
								{
 | 
				
			||||||
 | 
									CloseModal();
 | 
				
			||||||
 | 
								}
 | 
				
			||||||
 | 
							}
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						public void CloseIfEnabled(MouseEventArgs args)
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
							CloseModal();
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						public void PreventClose(MouseEventArgs args)
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
							OverlayClickToClose = false;
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
						protected override async Task OnInitializedAsync()
 | 
				
			||||||
 | 
						{
 | 
				
			||||||
 | 
								initialValue = Value;
 | 
				
			||||||
 | 
						}
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
@ -5,6 +5,4 @@ public class ModalOptions
 | 
				
			|||||||
	public bool DisableBackdropClick { get; set; } = false;
 | 
						public bool DisableBackdropClick { get; set; } = false;
 | 
				
			||||||
	public bool NoHeader { get; set; } = false;
 | 
						public bool NoHeader { get; set; } = false;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
				
			|||||||
							
								
								
									
										5
									
								
								src/Connected.Components/Models/Modal/ModalResult.cs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										5
									
								
								src/Connected.Components/Models/Modal/ModalResult.cs
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,5 @@
 | 
				
			|||||||
 | 
					namespace Connected.Models.Modal;
 | 
				
			||||||
 | 
					internal class ModalResult
 | 
				
			||||||
 | 
					{
 | 
				
			||||||
 | 
						public object Result { get; set; }
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
@ -1,5 +1,4 @@
 | 
				
			|||||||
using Connected.Components;
 | 
					using Connected.Models.Modal;
 | 
				
			||||||
using Connected.Models.Modal;
 | 
					 | 
				
			||||||
using Microsoft.AspNetCore.Components;
 | 
					using Microsoft.AspNetCore.Components;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
namespace Connected.Services;
 | 
					namespace Connected.Services;
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user