Entwicklung_BLAZOR/Test Stefan/DxBlazorApplication1/DxBlazorApplication1/Pages/Layout.razor
2025-09-26 15:45:37 +02:00

98 lines
3.1 KiB
Plaintext

@page "/layout"
@using System.IO
@inject IJSRuntime JS
<script>
window.downloadFileFromStream = async (fileName, contentStreamReference) => {
const arrayBuffer = await contentStreamReference.arrayBuffer();
const blob = new Blob([arrayBuffer]);
const url = URL.createObjectURL(blob);
const anchorElement = document.createElement('a');
anchorElement.href = url;
anchorElement.download = fileName ?? '';
anchorElement.click();
anchorElement.remove();
URL.revokeObjectURL(url);
}
</script>
<div class="border" style="padding: 20px; margin-top: 20px;">
<DxFormLayout CssClass="w-100 demo-form-layout">
<DxFormLayoutItem Caption="Contact Name:">
<DxTextBox @bind-Text="@Name" />
</DxFormLayoutItem>
<DxFormLayoutItem Caption="eMail:">
<DxTextBox @bind-Text="@Email" InputId="contactEmail" />
</DxFormLayoutItem>
<DxFormLayoutItem Caption="Birth Date:">
<DxDateEdit @bind-Date="@BirthDate" Mask="@DateTimeMask.ShortDate" />
</DxFormLayoutItem>
<DxFormLayoutItem Caption="Years Worked:">
<DxSpinEdit @bind-Value="@YearsWorked" />
</DxFormLayoutItem>
<DxFormLayoutItem Caption="On Vacation:">
<DxCheckBox @bind-Checked="@OnVacation" />
</DxFormLayoutItem>
</DxFormLayout>
<div class="w-100 mx-0 mt-3">
<p class="demo-text col-12 mt-2">
@nameof(Name)=<b>@Name</b>,
@nameof(Email)=<b>@Email</b>,
@nameof(BirthDate)=<b>@BirthDate</b>,
@nameof(YearsWorked)=<b>@YearsWorked</b>,
@nameof(OnVacation)=<b>@OnVacation</b>
</p>
</div>
</div>
<div class="border" style="padding: 20px; margin-top: 20px;">
<DxFormLayout>
@* If the viewport width is less then 768px (medium), the item occupies 12 columns *@
@* If the viewport width is from 768px (medium) to 1200px (extra large), the item occupies 6 columns *@
@* If the viewport width exceeds 1200px (extra large), the item occupies 4 columns *@
<DxFormLayoutItem Caption="Name" ColSpanXl="4" ColSpanMd="6">
<DxTextBox />
</DxFormLayoutItem>
</DxFormLayout>
</div>
<div class="border" style="padding: 20px; margin-top: 20px;">
<div>
<button @onclick="DownloadFileFromStream">
Download File From Stream
</button>
</div>
</div>
@code {
string Name { get; set; } = "Nancy Davolio";
string Email { get; set; } = "NancyDavolio@sample.com";
DateTime BirthDate { get; set; } = DateTime.Now.AddYears(-20);
int YearsWorked { get; set; } = 3;
bool OnVacation { get; set; } = true;
bool IsInfoOpen { get; set; } = false;
/* private Stream GetFileStream()
{
var randomBinaryData = new byte[50 * 1024];
var fileStream = new MemoryStream(randomBinaryData);
return fileStream;
}
*/
private Stream GetFileStream() => File.OpenRead(@"D:\Mappe1.xlsx");
private async Task DownloadFileFromStream()
{
var fileStream = GetFileStream();
var fileName = "Mappe2.xlsx";
using var streamRef = new DotNetStreamReference(stream: fileStream);
await JS.InvokeVoidAsync("downloadFileFromStream", fileName, streamRef);
}
}