Yeet 🎂

🐱🐉🎉🙌🤞
This commit is contained in:
Friend2868
2023-02-08 10:13:38 +01:00
parent 38f255c430
commit 53cddb8ef9
11 changed files with 153 additions and 284 deletions
+59 -44
View File
@@ -1,48 +1,63 @@
<Blazorise.ThemeProvider Theme="@theme"> <Blazorise.ThemeProvider Theme="@theme">
<Router AppAssembly="typeof(App).Assembly"> <Router AppAssembly="typeof(App).Assembly">
<Found Context="routeData"> <Found Context="routeData">
<RouteView RouteData="routeData" DefaultLayout="typeof(Elektrifikatsiya.Layouts.MainLayout)" /> <RouteView RouteData="routeData" DefaultLayout="typeof(Elektrifikatsiya.Layouts.MainLayout)" />
</Found> </Found>
<NotFound> <NotFound>
<p>Sorry, there's nothing at this address.</p> <p>Sorry, there's nothing at this address.</p>
</NotFound> </NotFound>
</Router> </Router>
<MessageProvider /> <MessageProvider />
<NotificationProvider /> <NotificationProvider />
<PageProgressProvider /> <PageProgressProvider />
</Blazorise.ThemeProvider> </Blazorise.ThemeProvider>
@code { @code {
private Theme theme = new() private Theme theme = new()
{ {
BarOptions = new() BarOptions = new()
{ {
HorizontalHeight = "72px" HorizontalHeight = "72px",
}, DarkColors = new()
ColorOptions = new() {
{ ItemColorOptions = new()
Primary = "#0288D1", {
Secondary = "#A65529", ActiveBackgroundColor = "#1a237e",
Success = "#23C02E", ActiveColor = "#1a237e",
Info = "#9BD8FE", HoverColor = "#1a237e",
Warning = "#F8B86C", }
Danger = "#F95741",
Light = "#F0F0F0", }
Dark = "#535353", },
}, ColorOptions = new()
BackgroundOptions = new() {
{ Primary = "#1a237e",
Primary = "#0288D1", Secondary = "#A65529",
Secondary = "#A65529", Success = "#23C02E",
Success = "#23C02E", Info = "#9BD8FE",
Info = "#9BD8FE", Warning = "#F8B86C",
Warning = "#F8B86C", Danger = "#F95741",
Danger = "#F95741", Light = "#F0F0F0",
Light = "#F0F0F0", Dark = "#535353",
Dark = "#535353", },
}, BackgroundOptions = new()
InputOptions = new() {
{ Primary = "#1a237e",
CheckColor = "#0288D1", Secondary = "#A65529",
} Success = "#23C02E",
}; Info = "#9BD8FE",
Warning = "#F8B86C",
Danger = "#F95741",
Light = "#F0F0F0",
Dark = "#535353",
},
InputOptions = new()
{
CheckColor = "#1a237e",
},
TextColorOptions = new()
{
Dark = "#000000",
Primary = "#1a237e"
}
};
} }
@@ -1,6 +1,6 @@
<Bar Breakpoint="Breakpoint.Desktop" NavigationBreakpoint="Breakpoint.Tablet" ThemeContrast="ThemeContrast.Dark" <Bar Breakpoint="Breakpoint.Desktop" NavigationBreakpoint="Breakpoint.Tablet" ThemeContrast="ThemeContrast.Dark"
Mode="BarMode.VerticalInline" CollapseMode="BarCollapseMode.Small"> Mode="BarMode.VerticalInline" CollapseMode="BarCollapseMode.Small">
<BarToggler /> <BarToggler TextColor="TextColor.Primary" />
<BarBrand> <BarBrand>
<BarItem> <BarItem>
<BarLink To=""> <BarLink To="">
@@ -12,28 +12,28 @@
<BarMenu> <BarMenu>
<BarStart> <BarStart>
<BarItem> <BarItem>
<BarLink To="/"> <BarLink To="/" TextColor="TextColor.White">
<BarIcon IconName="IconName.Dashboard" /> <BarIcon Style="color:white" IconName="IconName.Dashboard" />
Dashboard Dashboard
</BarLink> </BarLink>
</BarItem> </BarItem>
<BarItem> <BarItem>
<BarLink To="/"> <BarLink To="/" TextColor="TextColor.White">
<BarIcon IconName="IconName.ShieldAlt" /> <BarIcon Style="color:white" IconName="IconName.ShieldAlt" />
Admin Admin
</BarLink> </BarLink>
</BarItem> </BarItem>
<BarItem> <BarItem>
<BarLink To="/"> <BarLink To="/" TextColor="TextColor.White">
<BarIcon IconName="IconName.Plug" /> <BarIcon Style="color:white" IconName="IconName.Plug" />
Add Plug Add Plug
</BarLink> </BarLink>
</BarItem> </BarItem>
</BarStart> </BarStart>
<BarEnd> <BarEnd>
<BarItem> <BarItem>
<BarLink To="/"> <BarLink To="/" TextColor="TextColor.White">
<BarIcon IconName="IconName.Wrench" /> <BarIcon Style="color:white" IconName="IconName.Wrench" />
Settings Settings
</BarLink> </BarLink>
</BarItem> </BarItem>
@@ -43,5 +43,6 @@
@code { @code {
private bool pagesBarVisible = true; private bool pagesBarVisible = true;
RenderFragment customIcon =@<img src="/brand-logo.png" style="width:32px; height: 32px" />; //TODO: replace logo png with transparent background one
RenderFragment customIcon =@<img src="/logo.png" style="width:32px; height: 32px" />;
} }
@@ -1,160 +0,0 @@
@using Blazorise.Localization
<Bar @bind-Visible="@topbarVisible" Breakpoint="Breakpoint.Desktop" Background="Background.Primary" ThemeContrast="ThemeContrast.Light">
<BarBrand>
<BarItem>
<BarLink To="">
<BarIcon Margin="Margin.Is2.FromEnd" IconName="IconName.Dashboard" />
Elektrifikatsiya
</BarLink>
</BarItem>
</BarBrand>
<BarToggler />
<BarMenu>
<BarStart>
<BarItem>
<BarLink To="https://blazorise.com/docs/">Documentation</BarLink>
</BarItem>
<BarItem>
<BarDropdown>
<BarDropdownToggle>More</BarDropdownToggle>
<BarDropdownMenu>
<BarDropdownItem To="https://blazorise.com/docs/start/">
Quick-Start Guide
</BarDropdownItem>
<BarDropdownDivider />
<BarDropdownItem To="https://blazorise.com/docs/usage/">
Usage
</BarDropdownItem>
</BarDropdownMenu>
</BarDropdown>
</BarItem>
<BarItem>
<BarDropdown>
<BarDropdownToggle>Layout</BarDropdownToggle>
<BarDropdownMenu>
<BarDropdownItem Clicked="@(()=>OnLayoutTypeChecked("fixed-header"))">
@if ( LayoutType == "fixed-header" )
{
<Icon Name="IconName.CheckCircle" TextColor="TextColor.Success" />
}
Fixed Header
</BarDropdownItem>
<BarDropdownItem Clicked="@(()=>OnLayoutTypeChecked("fixed-header-footer-only"))">
@if ( LayoutType == "fixed-header-footer-only" )
{
<Icon Name="IconName.CheckCircle" TextColor="TextColor.Success" />
}
Fixed Header and Footer only
</BarDropdownItem>
<BarDropdownItem Clicked="@(()=>OnLayoutTypeChecked("sider-with-header-on-top"))">
@if ( LayoutType == "sider-with-header-on-top" )
{
<Icon Name="IconName.CheckCircle" TextColor="TextColor.Success" />
}
Sider with Header on top
</BarDropdownItem>
</BarDropdownMenu>
</BarDropdown>
</BarItem>
</BarStart>
<BarEnd>
<BarItem>
<BarDropdown RightAligned>
<BarDropdownToggle><Icon Name="IconName.Language" /></BarDropdownToggle>
<BarDropdownMenu>
@foreach ( var cultureInfo in LocalizationService.AvailableCultures )
{
<BarDropdownItem @key="@cultureInfo.Name" Clicked="@(()=>SelectCulture(cultureInfo.Name))">
@if ( cultureInfo.IsNeutralCulture )
{
@cultureInfo.EnglishName
}
else
{
@cultureInfo.Parent.EnglishName
}
</BarDropdownItem>
}
</BarDropdownMenu>
</BarDropdown>
</BarItem>
<BarItem>
<BarDropdown RightAligned>
<BarDropdownToggle><Icon Name="IconName.Tint" /> Theme</BarDropdownToggle>
<BarDropdownMenu Style="padding: 15px; min-width:550px;">
<Row>
<Column Margin="Margin.Is2.FromBottom">
<Field>
<Switch TValue="bool" Checked="@(Theme?.Enabled == true)" CheckedChanged="@ThemeEnabledChanged">Theme enabled</Switch>
</Field>
</Column>
</Row>
<Row>
<Column Margin="Margin.Is2.FromBottom">
<Field>
<Check TValue="bool" Checked="@(Theme?.IsGradient == true)" CheckedChanged="@ThemeGradientChanged">Gradient colors</Check>
</Field>
<Field>
<Check TValue="bool" Checked="@(Theme?.IsRounded == true)" CheckedChanged="@ThemeRoundedChanged">Rounded elements</Check>
</Field>
</Column>
</Row>
<Row>
<Column>
<Container Fluid>
<ThemeColorSelector Value="@(Theme?.ColorOptions?.Primary)" ValueChanged="@ThemeColorChanged"></ThemeColorSelector>
</Container>
</Column>
</Row>
</BarDropdownMenu>
</BarDropdown>
</BarItem>
<BarItem>
<BarLink To="https://github.com/Megabit/Blazorise">GitHub</BarLink>
</BarItem>
</BarEnd>
</BarMenu>
</Bar>
@code {
protected override async Task OnInitializedAsync()
{
await SelectCulture( "en-US" );
await base.OnInitializedAsync();
}
Task SelectCulture( string name )
{
LocalizationService.ChangeLanguage( name );
return Task.CompletedTask;
}
private bool topbarVisible = false;
Task OnLayoutTypeChecked( string layoutType )
{
LayoutType = layoutType;
return LayoutTypeChanged.InvokeAsync( layoutType );
}
[Parameter] public EventCallback<bool> ThemeEnabledChanged { get; set; }
[Parameter] public EventCallback<bool> ThemeGradientChanged { get; set; }
[Parameter] public EventCallback<bool> ThemeRoundedChanged { get; set; }
[Parameter] public EventCallback<string> ThemeColorChanged { get; set; }
[Parameter] public string LayoutType { get; set; }
[Parameter] public EventCallback<string> LayoutTypeChanged { get; set; }
[Inject] protected ITextLocalizerService LocalizationService { get; set; }
[CascadingParameter] protected Theme Theme { get; set; }
}
@@ -18,10 +18,11 @@
</PropertyGroup> </PropertyGroup>
<ItemGroup> <ItemGroup>
<PackageReference Include="Blazorise" Version="1.1.*" /> <PackageReference Include="Blazorise" Version="1.2.0" />
<PackageReference Include="Blazorise.Components" Version="1.1.6" /> <PackageReference Include="Blazorise.Charts" Version="1.2.0" />
<PackageReference Include="Blazorise.Material" Version="1.1.*" /> <PackageReference Include="Blazorise.Components" Version="1.2.0" />
<PackageReference Include="Blazorise.Icons.Material" Version="1.1.*" /> <PackageReference Include="Blazorise.Material" Version="1.2.0" />
<PackageReference Include="Blazorise.Icons.Material" Version="1.2.0" />
<PackageReference Include="Microsoft.EntityFrameworkCore" Version="7.0.2" /> <PackageReference Include="Microsoft.EntityFrameworkCore" Version="7.0.2" />
<PackageReference Include="Microsoft.VisualStudio.Azure.Containers.Tools.Targets" Version="1.17.0" /> <PackageReference Include="Microsoft.VisualStudio.Azure.Containers.Tools.Targets" Version="1.17.0" />
</ItemGroup> </ItemGroup>
@@ -2,67 +2,16 @@
@inherits LayoutComponentBase @inherits LayoutComponentBase
@if ( layoutType == "fixed-header" )
{ <Layout Sider>
<Layout Sider> <LayoutSider>
<LayoutSider> <LayoutSiderContent>
<LayoutSiderContent> <SideMenu />
<SideMenu /> </LayoutSiderContent>
</LayoutSiderContent> </LayoutSider>
</LayoutSider> <Layout>
<Layout> <LayoutContent Padding="Padding.Is4.OnX.Is4.FromTop">
<LayoutHeader Fixed> @Body
<TopMenu ThemeEnabledChanged="@OnThemeEnabledChanged" </LayoutContent>
ThemeGradientChanged="@OnThemeGradientChanged" </Layout>
ThemeRoundedChanged="@OnThemeRoundedChanged" </Layout>
ThemeColorChanged="@OnThemeColorChanged"
@bind-LayoutType="@layoutType" />
</LayoutHeader>
<LayoutContent Padding="Padding.Is4.OnX.Is4.FromTop">
@Body
</LayoutContent>
</Layout>
</Layout>
}
else if ( layoutType == "fixed-header-footer-only" )
{
<Layout>
<LayoutHeader Fixed>
<TopMenu ThemeEnabledChanged="@OnThemeEnabledChanged"
ThemeGradientChanged="@OnThemeGradientChanged"
ThemeRoundedChanged="@OnThemeRoundedChanged"
ThemeColorChanged="@OnThemeColorChanged"
@bind-LayoutType="@layoutType" />
</LayoutHeader>
<LayoutContent Padding="Padding.Is4.OnX.Is4.FromTop">
@Body
</LayoutContent>
<LayoutFooter Fixed>
<FooterMenu></FooterMenu>
</LayoutFooter>
</Layout>
}
else if ( layoutType == "sider-with-header-on-top" )
{
<Layout>
<LayoutHeader Fixed>
<TopMenu ThemeEnabledChanged="@OnThemeEnabledChanged"
ThemeGradientChanged="@OnThemeGradientChanged"
ThemeRoundedChanged="@OnThemeRoundedChanged"
ThemeColorChanged="@OnThemeColorChanged"
@bind-LayoutType="@layoutType" />
</LayoutHeader>
<Layout Sider>
<LayoutSider>
<LayoutSiderContent>
<SideMenu />
</LayoutSiderContent>
</LayoutSider>
<Layout>
<LayoutContent Padding="Padding.Is4.OnX.Is4.FromTop">
@Body
</LayoutContent>
</Layout>
</Layout>
</Layout>
}
@@ -2,7 +2,8 @@
@using Blazorise.Components; @using Blazorise.Components;
@using Elektrifikatsiya.Models; @using Elektrifikatsiya.Models;
@inject IVersionProvider VersionProvider @inject IVersionProvider VersionProvider
<Row>
<Row Padding="Padding.Is3">
<Column ColumnSize="ColumnSize.Is6"> <Column ColumnSize="ColumnSize.Is6">
<ListView TItem="Device" <ListView TItem="Device"
Data="@plugs" Data="@plugs"
@@ -55,8 +56,67 @@
</ListView> </ListView>
</Column> </Column>
</Row> </Row>
<Row Padding="Padding.Is3">
<Column>
<Button Color="Color.Primary" Clicked="@(async () => await HandleRedraw())">Aktualisieren</Button>
<LineChart @ref="lineChart" TItem="double" />
</Column>
</Row>
@code { @code {
List<Event> events = new List<Event>() { new Event("Jude", "Alles kaputt", DateTime.Now), new Event("Jude", "Alles kaputt", DateTime.Now), new Event("Jude", "Alles kaputt", DateTime.Now) }; //TODO: insert new event here if plug produces one
List<Event> events = new List<Event>() { new Event("Placeholder", "Placeholder", DateTime.Now), new Event("Placeholder", "Placeholder", DateTime.Now), new Event("Placeholder", "Placeholder", DateTime.Now) };
//TODO: insert new Device here if user adds one
List<Device> plugs = new List<Device>() { new Device("Placeholder", "Plug", System.Net.IPAddress.Broadcast, 60, "Oldin", "4AHINF"), new Device("Placeholder", "Plug", System.Net.IPAddress.Broadcast, 60, "Oldin", "4AHINF"), new Device("Placeholder", "Plug", System.Net.IPAddress.Broadcast, 60, "Oldin", "4AHINF") }; List<Device> plugs = new List<Device>() { new Device("Placeholder", "Plug", System.Net.IPAddress.Broadcast, 60, "Oldin", "4AHINF"), new Device("Placeholder", "Plug", System.Net.IPAddress.Broadcast, 60, "Oldin", "4AHINF"), new Device("Placeholder", "Plug", System.Net.IPAddress.Broadcast, 60, "Oldin", "4AHINF") };
//code for graph
LineChart<double> lineChart;
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
await HandleRedraw();
}
}
async Task HandleRedraw()
{
await lineChart.Clear();
await lineChart.AddLabelsDatasetsAndUpdate(Labels, GetLineChartDataset());
}
//TODO: insert dataset of current and last voltage usages
LineChartDataset<double> GetLineChartDataset()
{
return new LineChartDataset<double>
{
Label = "# of random number in thousands",
Data = RandomizeData(),
BackgroundColor = backgroundColors,
BorderColor = borderColors,
Fill = true,
PointRadius = 3,
CubicInterpolationMode = "monotone",
};
}
string[] Labels = { "Red", "Blue", "Yellow", "Green", "Purple", "Orange" };
List<string> backgroundColors = new List<string> { ChartColor.FromRgba(255, 99, 132, 0.2f), ChartColor.FromRgba(54, 162, 235, 0.2f), ChartColor.FromRgba(255, 206, 86, 0.2f), ChartColor.FromRgba(75, 192, 192, 0.2f), ChartColor.FromRgba(153, 102, 255, 0.2f), ChartColor.FromRgba(255, 159, 64, 0.2f) };
List<string> borderColors = new List<string> { ChartColor.FromRgba(255, 99, 132, 1f), ChartColor.FromRgba(54, 162, 235, 1f), ChartColor.FromRgba(255, 206, 86, 1f), ChartColor.FromRgba(75, 192, 192, 1f), ChartColor.FromRgba(153, 102, 255, 1f), ChartColor.FromRgba(255, 159, 64, 1f) };
List<double> RandomizeData()
{
var r = new Random(DateTime.Now.Millisecond);
return new List<double> {
r.Next( 3, 50 ) * r.NextDouble(),
r.Next( 3, 50 ) * r.NextDouble(),
r.Next( 3, 50 ) * r.NextDouble(),
r.Next( 3, 50 ) * r.NextDouble(),
r.Next( 3, 50 ) * r.NextDouble(),
r.Next( 3, 50 ) * r.NextDouble() };
}
} }
@@ -6,3 +6,4 @@
} }
<component type="typeof(App)" render-mode="Server" /> <component type="typeof(App)" render-mode="Server" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js"></script>
@@ -40,5 +40,6 @@
<script src="js/material/material.min.js"></script> <script src="js/material/material.min.js"></script>
<script src="_framework/blazor.server.js"></script> <script src="_framework/blazor.server.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js"></script>
</body> </body>
</html> </html>
@@ -9,3 +9,4 @@
@using Elektrifikatsiya @using Elektrifikatsiya
@using Blazorise @using Blazorise
@using Blazorise.Charts
Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 264 KiB