Compare commits
No commits in common. '909cfd0d8179345fbfcaf64b90f994d134a2f38e' and 'e4b246a8bc6615c02c63bc3c463df5339e917f31' have entirely different histories.
909cfd0d81
...
e4b246a8bc
@ -1,28 +0,0 @@
|
|||||||
@page "/button"
|
|
||||||
@using Connected.Components;
|
|
||||||
@using Connected.Enums;
|
|
||||||
@using Connected.Models.Modal;
|
|
||||||
@using Connected.Models;
|
|
||||||
@using Connected.Services;
|
|
||||||
@using Connected.Utilities;
|
|
||||||
|
|
||||||
<h1 style="text-align:center;">BUTTON EXAMPLE</h1>
|
|
||||||
|
|
||||||
<Button OnClick="(()=>TextChange())">Change text default</Button>
|
|
||||||
|
|
||||||
<Button OnClick="(()=>TextChange(Hello))">Change text to - Hello my friend</Button>
|
|
||||||
|
|
||||||
<p>Text: <h4>@text</h4></p>
|
|
||||||
|
|
||||||
@code {
|
|
||||||
string text = "Some random text";
|
|
||||||
|
|
||||||
string Hello = "Hello my friend";
|
|
||||||
|
|
||||||
private void TextChange(string new_text="Some random text.. but new")
|
|
||||||
{
|
|
||||||
text = new_text;
|
|
||||||
StateHasChanged();
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@ -1,92 +0,0 @@
|
|||||||
@page "/modal"
|
|
||||||
@using Connected.Components;
|
|
||||||
@using Connected.Enums;
|
|
||||||
@using Connected.Models.Modal;
|
|
||||||
@using Connected.Models;
|
|
||||||
@using Connected.Services;
|
|
||||||
@using Connected.Utilities;
|
|
||||||
|
|
||||||
@inject ModalDialogService modalDialog;
|
|
||||||
|
|
||||||
|
|
||||||
<h1 style="text-align:center;">MODAL DIALOG EXAMPLE</h1>
|
|
||||||
|
|
||||||
|
|
||||||
<Button OnClick="OpenModalDialog">Open dialog</Button>
|
|
||||||
|
|
||||||
<p>Modal result: @test_modal_result</p>
|
|
||||||
|
|
||||||
<h4>Value: @value.ToString()</h4>
|
|
||||||
|
|
||||||
|
|
||||||
@code {
|
|
||||||
int value = 0;
|
|
||||||
|
|
||||||
string test_modal_result = string.Empty;
|
|
||||||
|
|
||||||
ModalOptions options = new ModalOptions();
|
|
||||||
|
|
||||||
|
|
||||||
public void OpenModalDialog()
|
|
||||||
{
|
|
||||||
modalDialog.ShowDialog(
|
|
||||||
/*
|
|
||||||
MODAL TITLE
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
"Title",
|
|
||||||
|
|
||||||
/*
|
|
||||||
MODAL CONTENT !!!starting with @
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
@<div>
|
|
||||||
<div>Change the number input aand watch the value variable behind the modal change</div>
|
|
||||||
<NumberInput @bind-Value=@value></NumberInput>
|
|
||||||
</div>,
|
|
||||||
|
|
||||||
/*
|
|
||||||
MODAL BUTTONS WITH ACTIONS
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
new List<ModalButton>()
|
|
||||||
{
|
|
||||||
new ModalButton(
|
|
||||||
new Event(ChangeText, new object[]{"OK clicked"}), //event triggered on button click
|
|
||||||
"OK", //button text
|
|
||||||
ModalButtonType.OkButton, //button type: OK, Cancel, Regular
|
|
||||||
true //close modal on click
|
|
||||||
),
|
|
||||||
new ModalButton(
|
|
||||||
new Event(ChangeText, new object[]{"Cancel clicked"}), //event triggered on button click - first parameter = method name, second parameter = method parameters --> array of objects
|
|
||||||
"Cancel", //button text
|
|
||||||
ModalButtonType.CancelButton, //button type: OK, Cancel, Regular
|
|
||||||
true //close modal on click
|
|
||||||
),
|
|
||||||
new ModalButton(
|
|
||||||
new Event(ChangeText, new object[]{"Regular clicked"}), //event triggered on button click - first parameter = method name, second parameter = method parameters --> array of objects
|
|
||||||
"Click me", //button text
|
|
||||||
ModalButtonType.RegularButton, //button type: OK, Cancel, Regular
|
|
||||||
true //close modal on click
|
|
||||||
)
|
|
||||||
},
|
|
||||||
|
|
||||||
/*
|
|
||||||
MODAL OPTIONS
|
|
||||||
*
|
|
||||||
*/
|
|
||||||
new ModalOptions(false,true,false)); //modal dialog options - optional
|
|
||||||
}
|
|
||||||
|
|
||||||
private void ChangeValue(int val)
|
|
||||||
{
|
|
||||||
value = val;
|
|
||||||
StateHasChanged();
|
|
||||||
}
|
|
||||||
|
|
||||||
public void ChangeText(string some_parameter)
|
|
||||||
{
|
|
||||||
test_modal_result = some_parameter;
|
|
||||||
StateHasChanged();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,20 +1,49 @@
|
|||||||
@page "/"
|
@page "/"
|
||||||
@using Connected.Components;
|
|
||||||
@using Connected.Enums;
|
|
||||||
@using Connected.Models.Modal;
|
|
||||||
@using Connected.Models;
|
@using Connected.Models;
|
||||||
@using Connected.Services;
|
@using Connected.Components;
|
||||||
@using Connected.Utilities;
|
|
||||||
|
|
||||||
|
<h1 style="text-align:center;">Component Sandbox</h1>
|
||||||
|
|
||||||
<h1 style="text-align:center;">Component Example page</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>
|
||||||
|
|
||||||
<ul>
|
<p>Izbran datum je: @date</p>
|
||||||
<li><Link Class="m-1" Url="modal" Text="Modal dialog" Target="Target.Self" /></li>
|
|
||||||
<li><Link Class="m-1" Url="button" Text="Button" Target="Target.Self" /></li>
|
|
||||||
</ul>
|
|
||||||
|
|
||||||
|
<FormWizard Id="Wizard1">
|
||||||
|
<FormWizardStep Name="Step1">
|
||||||
|
Step1
|
||||||
|
</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>Selected date is @date.ToString()</p>
|
||||||
|
|
||||||
@code {
|
@code {
|
||||||
|
DateTime date = DateTime.Today;
|
||||||
}
|
}
|
||||||
@ -1,25 +1,25 @@
|
|||||||
@using Connected.Models.Modal;
|
@using Connected.Models.Modal;
|
||||||
@if (IsVisible)
|
@if (IsVisible)
|
||||||
{
|
{
|
||||||
<div class="@ClassList" @onclick="@CloseIfEnabled" @onkeydown="@(e => CheckEscape(e))" tabindex="-1" @ref="@root">
|
<div class="modal fade show" @onclick="@CloseIfEnabled" @onkeydown="@(e => CheckEscape(e))" tabindex="-1" @ref="@root">
|
||||||
<div class="modal-dialog modal-dialog-scrollable modal-dialog-centered">
|
<div class="modal-dialog modal-dialog-scrollable modal-dialog-centered">
|
||||||
<div class="modal-content" @onclick="PreventClose">
|
<div class="modal-content" @onclick="PreventClose">
|
||||||
@if (!ModalOptions.NoHeader)
|
@if (!ModalOptions.NoHeader)
|
||||||
{
|
{
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<h3 class="modal-title">@Title</h3>
|
<h3 class="modal-title">@Title</h3>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
@Content
|
@Content
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
@foreach (ModalButton button in buttons)
|
||||||
|
{
|
||||||
|
<button type="button" class="btn @button.GetButtonClass" @onclick="@(()=>CloseModal(button))">@button.ButtonText</button>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
</div>
|
||||||
@foreach (ModalButton button in buttons)
|
|
||||||
{
|
|
||||||
<button type="button" class="btn @button.GetButtonClass" @onclick="@(()=>CloseModal(button))">@button.ButtonText</button>
|
|
||||||
}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
}
|
}
|
||||||
@ -1,22 +0,0 @@
|
|||||||
@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>
|
|
||||||
}
|
|
||||||
Loading…
Reference in new issue