Merge branch 'Development' into feature-DeviceRegistration

This commit is contained in:
Stefan
2023-05-03 09:33:51 +02:00
13 changed files with 419 additions and 308 deletions
@@ -23,6 +23,12 @@
Admin
</BarLink>
</BarItem>
<BarItem>
<BarLink To="/settings" TextColor="TextColor.White">
<BarIcon Style="color:white" IconName="IconName.Wrench" />
Settings
</BarLink>
</BarItem>
<BarItem>
<BarLink To="/addplug" TextColor="TextColor.White">
<BarIcon Style="color:white" IconName="IconName.Plug" />
@@ -32,9 +38,9 @@
</BarStart>
<BarEnd>
<BarItem>
<BarLink To="/settings" TextColor="TextColor.White">
<BarIcon Style="color:white" IconName="IconName.Wrench" />
Settings
<BarLink To="/login" TextColor="TextColor.White">
<BarIcon Style="color:white" IconName="IconName.Running" />
Logout
</BarLink>
</BarItem>
</BarEnd>
@@ -42,7 +48,5 @@
</Bar>
@code {
private bool pagesBarVisible = true;
//TODO: replace logo png with transparent background one
RenderFragment customIcon =@<img src="/logo.png" style="width:32px; height: 32px" />;
}
@@ -37,6 +37,7 @@
<PackageReference Include="Blazorise" Version="1.2.0" />
<PackageReference Include="Blazorise.Charts" Version="1.2.0" />
<PackageReference Include="Blazorise.Components" Version="1.2.0" />
<PackageReference Include="Blazorise.LoadingIndicator" Version="1.2.0" />
<PackageReference Include="Blazorise.Material" Version="1.2.0" />
<PackageReference Include="Blazorise.Icons.Material" Version="1.2.0" />
<PackageReference Include="BCrypt.Net-Next" Version="4.0.3" />
@@ -1,40 +1,17 @@
@using System.Diagnostics;
@using FluentResults
@inject Elektrifikatsiya.Services.IAuthenticationService AuthenticationService
@inject NavigationManager NavigationManager
@inherits LayoutComponentBase
<Image Source="logo.png" Width="Width.Is50" Height="Height.Is50"> </Image>
<Card Width="Width.Is50" Position="Position.Absolute.Top.Is50.Start.Is50.Translate.Middle" Padding="Padding.Is5">
<Field Width="Width.Is25" Position="Position.Relative.Top.Is50.Start.Is50.Translate.Middle">
<TextEdit @bind-Text="username" Placeholder="Username" />
</Field>
<Field Width="Width.Is25" Position="Position.Relative.Top.Is50.Start.Is50.Translate.Middle">
<TextEdit @bind-Text="password" Role="TextRole.Password" Placeholder="Password" />
</Field>
<Button Width="Width.Is25" Disabled="disabled" Color="color" Clicked="Clicked" Position="Position.Relative.Bottom.Is50.Start.Is50.Translate.MiddleX" >Login</Button>
<Column ColumnSize="ColumnSize.Is6.OnDesktop.Is12.Is3.WithOffset">
<Field Position="Position.Relative.Top.Is50.Start.Is50.Translate.Middle">
<TextEdit Placeholder="Username" />
</Field>
<Field Position="Position.Relative.Top.Is50.Start.Is50.Translate.Middle">
<TextEdit Role="TextRole.Password" Placeholder="Password" />
</Field>
<Button Color="Color.Primary" Position="Position.Relative.Bottom.Is50.Start.Is50.Translate.MiddleX">Login</Button>
</Column>
</Card>
@code {
private string username = string.Empty;
private string password = string.Empty;
private Color color = Color.Primary;
private bool disabled;
private async Task Clicked()
{
color = Color.Primary;
disabled = true;
Result loginResult = await AuthenticationService.LoginUserAsync(username, password);
if (loginResult.IsSuccess)
{
NavigationManager.NavigateTo("/", true);
}
else
{
color = Color.Danger;
disabled = false;
}
}
}
<!-- TODO: Put this into the Component once we are merging and refactoring -->
@@ -6,149 +6,152 @@
@using Elektrifikatsiya.Services.Implementations
@using Elektrifikatsiya.Utilities
@using FluentResults;
@using Blazorise.LoadingIndicator;
@inject IVersionProvider VersionProvider
@inject IDeviceManagmentService DeviceManagmentService
@inject IAuthenticationService AuthenticationService
@inject IMessageService MessageService
<Div>
<Row Style="height:50%; width:100%" Padding="Padding.Is3.OnDesktop.Is0">
<Row Style="height:90%; width:100%">
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is1"></Column>
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is12">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop">
<BarBrand>
Add a plug via wifi
</BarBrand>
</Bar>
<ListView Class="w-100"
TItem="IPAddress"
Data="@ipAddresses"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
Mode="ListGroupMode.Static">
<ItemTemplate>
<ListGroupItem>
<Row>
<Column ColumnSize="ColumnSize.Is6">
<Row>
</Row>
<Row Width="Width.Is100">
<Column>
<Small>IP: @context.Item</Small>
</Column>
</Row>
</Column>
<Column ColumnSize="ColumnSize.Is4.Is2.WithOffset">
<Button Position="Position.Absolute.Top.Is50.Start.Is50.Translate.Middle" Color="Color.Dark" Clicked="@(()=>RegisterDevice(context.Item))" Outline>
<BarIcon IconName="IconName.Add" />
</Button>
</Column>
</Row>
</ListGroupItem>
</ItemTemplate>
</ListView>
</Column>
</Row>
</Row>
<Row Style="height:50%; width:100%; border-top-style:solid; border-top-color:#1a237e">
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is1"></Column>
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is12">
<Row Style="height:15%; width:100%"></Row>
<Row Style="height:10%; width:100%">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop"
Style="width:100%">
<BarBrand>
Add a plug via IP
</BarBrand>
</Bar>
<ListGroup Style="width:100%; border-radius: 0px 0px">
<ListGroupItem Color="Color.Default">
<Form>
<Validation @ref="ipValidation" Validator="ValidateIPv4">
<Field Horizontal>
<FieldBody ColumnSize="ColumnSize.Is12">
<TextEdit @bind-Text="ipText" Placeholder="Enter the Device IP here">
<Feedback>
<ValidationNone>Please enter a ip address.</ValidationNone>
<ValidationSuccess>Ip address is valid.</ValidationSuccess>
<ValidationError>Ip address is not valid!</ValidationError>
</Feedback>
</TextEdit>
<br>
<Button style="background-color:#1a237e; color:white" Type="ButtonType.Submit" Disabled="ipValidation?.Status != ValidationStatus.Success" Clicked="@(async (_)=> await RegisterDevice(IPAddress.Parse(ipText!)))" PreventDefaultOnSubmit>CONNECT</Button>
</FieldBody>
</Field>
</Validation>
</Form>
</ListGroupItem>
</ListGroup>
</Row>
<Row Style="height:75%; width:100%"></Row>
</Column>
</Row>
</Div>
<Row Style="height:50%; width:100%" Padding="Padding.Is3.OnDesktop.Is5.FromStart.OnMobile">
<Row Style="height:90%; width:100%">
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is1"></Column>
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is12">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop">
<BarBrand>
<Column ColumnSize="ColumnSize.Is9">
Add a plug via wifi
</Column>
<Column ColumnSize="ColumnSize.Is3.Is6.WithOffset">
<LoadingIndicator @bind-Visible="@visible"/>
</Column>
</BarBrand>
</Bar>
<ListView Class="w-100"
TItem="IPAddress"
Data="@ipAddresses"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
Mode="ListGroupMode.Static"
Style="border-radius: 0px 0px">
<ItemTemplate>
<ListGroupItem>
<Row>
<Column ColumnSize="ColumnSize.Is8">
<Row>
</Row>
<Row Width="Width.Is100">
<Column>
<Small>IP: @context.Item</Small>
</Column>
</Row>
</Column>
<Column ColumnSize="ColumnSize.Is4">
<Button Position="Position.Absolute.Top.Is50.Start.Is50.Translate.Middle" Color="Color.Dark" Clicked="@(async () => await DeviceManagmentService.RegisterDevice(context.Item,(await AuthenticationService.GetUserAsync()).ValueOrDefault))" Outline>
<BarIcon IconName="IconName.Add" />
</Button>
</Column>
</Row>
</ListGroupItem>
</ItemTemplate>
</ListView>
</Column>
</Row>
</Row>
<Row Style="height:50%; width:100%; border-top-style:solid; border-top-color:#1a237e" Padding="Padding.Is3.OnDesktop.Is5.FromStart.OnMobile">
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is1"></Column>
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is12">
<Row Style="height:15%; width:100%"></Row>
<Row Style="height:10%; width:100%">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop"
Style="width:100%">
<BarBrand>
Add a plug via IP
</BarBrand>
</Bar>
<ListGroup Style="width:100%; border-radius: 0px 0px">
<ListGroupItem Color="Color.Default">
<Form>
<Field Horizontal>
<FieldBody ColumnSize="ColumnSize.Is12">
<TextEdit Placeholder="Enter the Device IP here" />
<br>
<Button style="background-color:#1a237e; color:white" Type="ButtonType.Submit" PreventDefaultOnSubmit>CONNECT</Button>
</FieldBody>
</Field>
</Form>
</ListGroupItem>
</ListGroup>
</Row>
<Row Style="height:75%; width:100%"></Row>
</Column>
</Row>
@code {
List<IPAddress> ipAddresses = new List<IPAddress>();
List<IPAddress> ipAddresses = new List<IPAddress>();
Validation? ipValidation;
Validation? ipValidation;
string ipText = null!;
bool visible = true;
protected override void OnInitialized()
{
MdnsDiscovery.OnDeviceFound += async ipAddress =>
{
if (!ipAddresses.Contains(ipAddress))
{
ipAddresses.Add(ipAddress);
await InvokeAsync(StateHasChanged);
}
};
string ipText = null!;
MdnsDiscovery.FetchChachedDevices();
}
protected override void OnInitialized()
{
MdnsDiscovery.OnDeviceFound += async ipAddress =>
{
visible = false;
if (!ipAddresses.Contains(ipAddress))
{
ipAddresses.Add(ipAddress);
await InvokeAsync(StateHasChanged);
}
};
private async Task RegisterDevice(IPAddress ipAddress)
{
Result<Device> result = await DeviceManagmentService.RegisterDevice(ipAddress, (await AuthenticationService.GetUserAsync()).ValueOrDefault);
MdnsDiscovery.FetchChachedDevices();
}
if (result.IsSuccess)
{
await MessageService.Success("Device added!");
}
else
{
await MessageService.Error(string.Join(',', result.Errors.Select(e => e.Message)), "Adding device failed!");
}
}
private async Task RegisterDevice(IPAddress ipAddress)
{
Result<Device> result = await DeviceManagmentService.RegisterDevice(ipAddress, (await AuthenticationService.GetUserAsync()).ValueOrDefault);
public void ValidateIPv4(ValidatorEventArgs e)
{
string? input = Convert.ToString(e.Value);
if (result.IsSuccess)
{
await MessageService.Success("Device added!");
}
else
{
await MessageService.Error(string.Join(',', result.Errors.Select(e => e.Message)), "Adding device failed!");
}
}
if (string.IsNullOrWhiteSpace(input))
{
e.Status = ValidationStatus.None;
return;
}
public void ValidateIPv4(ValidatorEventArgs e)
{
string? input = Convert.ToString(e.Value);
string[] splitValues = input.Split('.');
if (splitValues.Length != 4)
{
e.Status = ValidationStatus.Error;
return;
}
if (string.IsNullOrWhiteSpace(input))
{
e.Status = ValidationStatus.None;
return;
}
string[] splitValues = input.Split('.');
if (splitValues.Length != 4)
{
e.Status = ValidationStatus.Error;
return;
}
e.Status = splitValues.All(r => byte.TryParse(r, out _)) ? ValidationStatus.Success : ValidationStatus.Error;
}
e.Status = splitValues.All(r => byte.TryParse(r, out _)) ? ValidationStatus.Success : ValidationStatus.Error;
}
}
@@ -0,0 +1,28 @@
@page "/admin"
@using Blazorise.Components
@using Elektrifikatsiya.Models;
@using System.Net
<Div>
<Row Padding="Padding.Is3">
<Div Display="Display.Flex.Row.OnDesktop" Margin=" Margin.Is3.FromBottom" Width="Width.Is100">
<Column ColumnSize="ColumnSize.Is6.OnDesktop.Is12">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop">
<BarBrand>
Users
</BarBrand>
<Button Position="Position.Absolute.End" Padding="Padding.Is3" Outline>
<BarIcon IconName="IconName.Add" ></BarIcon>
</Button>
</Bar>
</Column>
</Div>
</Row>
</Div>
@code {
}
@@ -1,4 +1,4 @@
@page "/"
@page "/"
@using Blazorise.Components;
@using Elektrifikatsiya.Models;
@using System.Net
@@ -6,89 +6,94 @@
@using Elektrifikatsiya.Utilities
@using System.Diagnostics
@inject IVersionProvider VersionProvider
@inject IDeviceStatusService DeviceStatusService
<Row Padding="Padding.Is3">
<Div Display="Display.Flex.Row.OnDesktop" Margin="Margin.Is3.FromBottom" Width="Width.Is100">
<Column ColumnSize="ColumnSize.Is6.OnDesktop.Is12">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop">
<BarBrand>
Plugs
</BarBrand>
</Bar>
<ListView TItem="Device"
Data="@plugs"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
Mode="ListGroupMode.Static"
Style="border-radius: 0px 0px">
<ItemTemplate>
<ListGroupItem Border="Border.OnBottom">
<Row>
<Column ColumnSize="ColumnSize.Is8">
<Row>
<Column ColumnSize="ColumnSize.Is7">
<Heading Size="HeadingSize.Is6" Margin="Margin.Is1.FromBottom">@context.Item.Name</Heading>
</Column>
</Row>
<Row>
<Column>
<Small>User: @context.Item.User.Name</Small>
<br />
<Small>Room: @context.Item.Room</Small>
</Column>
<Column ColumnSize="ColumnSize.Is5">
<Paragraph Margin="Margin.Is1.OnY">@context.Item.PowerUsage W</Paragraph>
</Column>
</Row>
</Column>
<Column ColumnSize="ColumnSize.Is4">
<Button Position="Position.Absolute.Top.Is50.Start.Is50.Translate.Middle" Color="Color.Dark" Outline>
<BarIcon IconName="IconName.Bolt" />
</Button>
</Column>
</Row>
</ListGroupItem>
</ItemTemplate>
</ListView>
</Column>
<Column ColumnSize="ColumnSize.Is6.OnDesktop.Is12">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.Rounded.RoundedTop">
<BarBrand>
Logs
</BarBrand>
</Bar>
<ListView TItem="Event"
Data="@events"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
Mode="ListGroupMode.Static"
Style="border-radius: 0px 0px">
<ItemTemplate>
<Div Flex="Flex.InlineFlex.JustifyContent.Between" Width="Width.Is100">
<Heading Size="HeadingSize.Is6" Margin="Margin.Is2.FromBottom">@context.Item.EventName</Heading>
<Small>@context.Item.Date</Small>
</Div>
<Paragraph Border="Border.OnBottom" Margin="Margin.Is2.FromBottom">@context.Item.Description</Paragraph>
</ItemTemplate>
</ListView>
@inject IDeviceStatusService DeviceStatusService;
<Div>
<Row Padding="Padding.Is3">
<Div Display="Display.Flex.Row.OnDesktop" Margin=" Margin.Is3.FromBottom" Width="Width.Is100">
<Column ColumnSize="ColumnSize.Is6.OnDesktop.Is12">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop">
<BarBrand>
Plugs
</BarBrand>
</Bar>
<ListView TItem="Device"
Data="@plugs"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
Mode="ListGroupMode.Static"
Style="border-radius: 0px 0px">
<ItemTemplate >
<ListGroupItem>
<Row>
<Column ColumnSize="ColumnSize.Is8">
<Row>
<Column ColumnSize="ColumnSize.Is7">
<Heading Size="HeadingSize.Is6" Margin="Margin.Is1.FromBottom">@context.Item.Name</Heading>
</Column>
</Row>
<Row>
<Column>
<Small>User: @context.Item.User.Name</Small>
<br />
<Small>Room: @context.Item.Room</Small>
</Column>
<Column ColumnSize="ColumnSize.Is5">
<Paragraph Margin="Margin.Is1.OnY">@context.Item.PowerUsage W</Paragraph>
</Column>
</Row>
</Column>
<Column ColumnSize="ColumnSize.Is4">
<Button Position="Position.Absolute.Top.Is50.Start.Is50.Translate.Middle" Color="Color.Primary"Primary Outline>
<!--TODO: This button should change color-->
<BarIcon IconName="IconName.Bolt" />
</Button>
</Column>
</Row>
</ListGroupItem>
</ItemTemplate>
</ListView>
</Column>
<Column ColumnSize="ColumnSize.Is6.OnDesktop.Is12">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.Rounded.RoundedTop">
<BarBrand>
Logs
</BarBrand>
</Bar>
<ListView TItem="Event"
Data="@events"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
Mode="ListGroupMode.Static"
Style="border-radius: 0px 0px">
<ItemTemplate>
<Div Flex="Flex.InlineFlex.JustifyContent.Between" Width="Width.Is100">
<Heading Size="HeadingSize.Is6" Margin="Margin.Is2.FromBottom">@context.Item.EventName</Heading>
<Small>@context.Item.Date</Small>
</Div>
<Paragraph Margin="Margin.Is2.FromBottom">@context.Item.Description</Paragraph>
</ItemTemplate>
</ListView>
</Column>
</Div>
</Row>
<Row Padding="Padding.Is3">
<Column>
<Button Color="Color.Primary" Style="border-radius: 0px" Clicked="@(async () => await HandleRedraw())">Aktualisieren</Button>
<LineChart Height="Height.Is100" Width="Width.Is100" @ref="lineChart" TItem="double" />
</Column>
</Div>
</Row>
<Row Padding="Padding.Is3">
<Column>
<Button Color="Color.Primary" Style="border-radius: 0px" Clicked="@(async () => await HandleRedraw())">Aktualisieren</Button>
<LineChart @ref="lineChart" TItem="double" />
</Column>
</Row>
</Row>
</Div>
@code {
//TODO: insert new event here if plug produces one
@@ -18,11 +18,6 @@ namespace Elektrifikatsiya.Pages
{
public partial class Dashboard
{
string bgcolor { get; set; } = "00f"; // (starting value)
void SetColor()
{
bgcolor = "#fd7";
StateHasChanged(); // may not be required, but I'm at work right now, so can't check
}
}
}
@@ -2,61 +2,157 @@
@using Blazorise.Components;
@using Elektrifikatsiya.Models;
@using System.Net
<Row Style="width: 100%; height: 100%">
<Column ColumnSize="ColumnSize.Is4">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop">
<BarBrand>
Plugs
</BarBrand>
</Bar>
<ListView TItem="Device"
Data="@plugs"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
<Div>
<Row Style="width: 100%; height: 100%" Margin="Margin.Is3.FromTop.OnMobile" Padding="Padding.Is4.FromStart.OnMobile">
<Div Display="Display.Flex.Row.OnDesktop" Margin=" Margin.Is3.FromBottom" Width="Width.Is100">
<Column ColumnSize="ColumnSize.Is5.OnDesktop.Is12.OnMobile">
<Bar Breakpoint="Breakpoint.Desktop"
Background="Background.White"
ThemeContrast="ThemeContrast.None"
Shadow="Shadow.Remove"
Border="Border.Is1.RoundedTop">
<BarBrand>
Plugs
</BarBrand>
</Bar>
<ListView TItem="Device"
Data="@plugs"
TextField="@((_)=>(""))"
ValueField="@((_)=>(""))"
Style="border-radius: 0px 0px"
Height="100%"
MaxHeight="90%">
<ItemTemplate>
<ListGroupItem Border="Border.OnBottom">
<Row>
Style="border-radius: 0px 0px"
Height="100%"
MaxHeight="90%">
<ItemTemplate>
<ListGroupItem Border="Border.OnBottom">
<Row>
<Column ColumnSize="ColumnSize.Is8">
<Row>
<Column ColumnSize="ColumnSize.Is7">
<Heading Size="HeadingSize.Is6" Margin="Margin.Is1.FromBottom">@context.Item.Name</Heading>
<Column ColumnSize="ColumnSize.Is6">
<Row>
<Column ColumnSize="ColumnSize.Is7">
<Heading Size="HeadingSize.Is6" Margin="Margin.Is1.FromBottom">@context.Item.Name</Heading>
</Column>
</Row>
<Row>
<Column>
<Small>User: @context.Item.User</Small>
<br />
<Small>Room: @context.Item.Room</Small>
</Column>
</Row>
</Column>
<Column ColumnSize="ColumnSize.Is4.OnDesktop.Is7.OnMobile">
<Button Position="Position.Absolute.Top.Is50.Start.Is50.Translate.Middle" Color="Color.Dark" Outline>
<BarIcon IconName="IconName.Delete" />
</Button>
</Column>
</Row>
<Row>
<Column>
<Small>User: @context.Item.User</Small>
<br />
<Small>Room: @context.Item.Room</Small>
</Column>
<Column ColumnSize="ColumnSize.Is5">
<Paragraph Margin="Margin.Is1.OnY">@context.Item.PowerUsage W</Paragraph>
</Column>
</Row>
</Column>
<Column ColumnSize="ColumnSize.Is4">
<Button Position="Position.Absolute.Top.Is50.Start.Is50.Translate.Middle" Color="Color.Dark" Outline>
<BarIcon IconName="IconName.Bolt" />
</Button>
</Column>
</Row>
</ListGroupItem>
</ItemTemplate>
</ListView>
</Column>
</Row>
<br />
<Row>
<Column ColumnSize="ColumnSize.Is1.OnDesktop">
<Button @onclick="Toggle" Position="Position.Absolute.Top.Is50.Start.Is100.Translate.Middle" Color="Color.Dark" Outline>
<BarIcon IconName="IconName.Pen" />
</Button>
</Column>
</Row>
</Row>
</ListGroupItem>
</ItemTemplate>
</ListView>
</Column>
<Column ColumnSize="ColumnSize.Is6.OnDesktop.Is12.OnMobile" Margin="Margin.Is3.FromTop.OnMobile" Padding="Padding.Is4.FromStart.OnMobile">
<Div hidden="@hideButtonSettings">
<Field>
<FieldLabel>
<h2>
Plug Settings
</h2>
</FieldLabel>
</Field>
<Field>
<FieldLabel>
<h5>
Plug Name
</h5>
<Paragraph>
Here you can change the name of your plug
</Paragraph>
</FieldLabel>
<TextEdit Placeholder="Enter Name" />
</Field>
<br />
<br />
<Field>
<FieldLabel>
<h5>
Change Max Output
</h5>
<Paragraph>
Here you can limit how much power your plug uses
</Paragraph>
</FieldLabel>
<TextEdit Placeholder="Enter Max Output" />
</Field>
<br />
<br />
<Field>
<FieldLabel>
<h5>
Select Room
</h5>
<Paragraph>
Here you select or change the room the plug belongs to.
</Paragraph>
</FieldLabel>
<br />
<Dropdown Display="Display.InlineBlock">
<DropdownToggle Color="Color.Primary" Width="Width.Is100">Rooms</DropdownToggle>
<DropdownMenu>
<DropdownItem>Room 1</DropdownItem>
<DropdownDivider />
<DropdownItem>Room 2</DropdownItem>
<DropdownDivider />
<DropdownItem>Room 3</DropdownItem>
</DropdownMenu>
</Dropdown>
</Field>
</Div>
<Div hidden="@(!hideButtonSettings)">
<Field>
<FieldLabel>
<h2>
General Settings
</h2>
</FieldLabel>
</Field>
<Field>
<FieldLabel>
<h5>
Electricity Price
</h5>
<Paragraph>
Here you enter your electricity price. This is gonna calculate the overall Price of your System
</Paragraph>
</FieldLabel>
<TextEdit Placeholder="Enter Electricity Price" />
</Field>
</Div>
<Column ColumnSize="ColumnSize.IsFull" TextAlignment="TextAlignment.End">
<Button Color="Color.Primary">Save</Button>
</Column>
</Column>
</Div>
</Row>
</Div>
@code {
List<Device> plugs = new List<Device>() { new Device("ffff:ffff:ffff:ffff", "Josne", IPAddress.Broadcast, new User("Joe", "qiowruioewjfopa", Role.Admin), "Raum"), new Device("ffff:ffff:ffff:ffff", "Josne", IPAddress.Broadcast, new User("Joe", "Josne", Role.Admin), "Raum"), new Device("ffff:ffff:ffff:ffff", "Josne", IPAddress.Broadcast, new User("Joe", "qiowruioewjfopa", Role.Admin), "Raum"), };
private bool hideButtonSettings = true;
List<Device> plugs = new List<Device>() { new Device("ffff:ffff:ffff:ffff", "Josne", IPAddress.Broadcast, new User("Joe", "qiowruioewjfopa", Role.Admin), "Raum"), new Device("ffff:ffff:ffff:ffff", "Josne", IPAddress.Broadcast, new User("Joe", "Josne", Role.Admin), "Raum"), new Device("ffff:ffff:ffff:ffff", "Josne", IPAddress.Broadcast, new User("Joe", "qiowruioewjfopa", Role.Admin), "Raum"), };
private void Toggle()
{
hideButtonSettings = !hideButtonSettings;
}
}
@@ -6,3 +6,4 @@
}
<component type="typeof(App)" render-mode="Server" />
<link href="_content/Blazorise.LoadingIndicator/blazorise.loadingindicator.css" rel="stylesheet" />
@@ -10,3 +10,4 @@
@using Elektrifikatsiya
@using Blazorise
@using Blazorise.Charts
@using Blazorise.LoadingIndicator