cs11dotnet7/vscode/PracticalApps/Northwind.Web/Pages/Functions.cshtml
2023-07-26 17:45:45 +01:00

190 lines
11 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@page
@using Northwind.Web.Pages
@using Packt.Shared
@model FunctionsModel
@{
string title = "Functions";
ViewData["Title"] = $"Northwind B2B - {title}";
string collapsedTimesTable = Model.TimesTableNumberInput.HasValue ? string.Empty : "collapse";
string collapsedCalculateTax = Model.Amount.HasValue ? string.Empty : "collapse";
string collapsedFactorial = Model.FactorialNumber.HasValue ? string.Empty : "collapse";
string collapsedFibonacci = Model.FibonacciNumber.HasValue ? string.Empty : "collapse";
}
<div class="row">
<h1 class="display-2">@title</h1>
<div>
<h2>Exercise 14.3 Practice building web pages for console apps</h2>
<div>Provide a web user interface to output times tables, calculate tax, and generate factorials and the Fibonacci sequence.</div>
</div>
<div class="accordion" id="accordionFunctions">
<div class="accordion-item">
<h2 class="accordion-header" id="headerTimesTable">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTimesTable" aria-expanded="true" aria-controls="collapseTimesTable">
Times Table
</button>
</h2>
<div id="collapseTimesTable" class="accordion-collapse @collapsedTimesTable" aria-labelledby="headingTimesTable" data-bs-parent="#accordionTimesTable">
<div class="accordion-body">
<form>
<div class="mb-3">
<label for="timesTableNumberInput" class="form-label">Number</label>
<input type="number" class="form-control" id="timesTableNumberInput" name="timesTableNumberInput" aria-describedby="timesTableNumberHelp">
<div id="timesTableNumberHelp" class="form-text">Enter an integer between 1 and 100.</div>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
@if (Model.TimesTableNumberInput.HasValue)
{
<div class="card" style="width: 18rem;">
<div class="card-body">
<h5 class="card-title">@Model.TimesTableNumberInput times table</h5>
@for (int i = 1; i <= 12; i++)
{
<div>
@i x @Model.TimesTableNumberInput = @(i * Model.TimesTableNumberInput)
</div>
}
</div>
</div>
}
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headerCalculateTax">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseCalculateTax" aria-expanded="true" aria-controls="collapseCalculateTax">
Calculate Tax
</button>
</h2>
<div id="collapseCalculateTax" class="accordion-collapse @collapsedCalculateTax" aria-labelledby="headingCalculateTax" data-bs-parent="#accordionCalculateTax">
<div class="accordion-body">
<form>
<div class="mb-3">
<label for="calculateTaxAmountInput" class="form-label">Amount</label>
<input type="number" class="form-control" id="calculateTaxAmountInput" name="calculateTaxAmountInput" aria-describedby="calculateTaxAmountInputHelp">
<div id="calculateTaxAmountInputHelp" class="form-text">Enter a monetary value.</div>
</div>
<div class="mb-3">
<label for="calculateTaxRegionCodeInput" class="form-label">Region</label>
<select class="form-control" id="calculateTaxRegionCodeInput" name="calculateTaxRegionCodeInput" aria-describedby="calculateTaxRegionCodeInputHelp">
<optgroup label="Europe">
<option value="DK">Denmark</option>
<option value="FR">France</option>
<option value="HU">Hungary</option>
<option value="NO">Norway</option>
<option value="CH">Switzerland</option>
<option value="GB">United Kingdom</option>
</optgroup>
<optgroup label="United States">
<option value="AK">Alaska</option>
<option value="OR">Oregon</option>
<option value="MT">Montana</option>
<option value="ND">North Dakota</option>
<option value="WI">Wisconsin</option>
<option value="ME">Maine</option>
<option value="VA">Virginia</option>
<option value="CA">California</option>
<option value="OT">Other</option>
</optgroup>
</select>
<div id="calculateTaxRegionCodeInputHelp" class="form-text">Select a European or US state.</div>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
@if (Model.Amount.HasValue)
{
<div class="card" style="width: 18rem;">
<div class="card-body">
<h5 class="card-title">You must pay @Model.TaxToPay in tax.</h5>
</div>
</div>
}
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headerFactorials">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFactorials" aria-expanded="true" aria-controls="collapseFactorials">
Factorials
</button>
</h2>
<div id="collapseFactorials" class="accordion-collapse @collapsedFactorial" aria-labelledby="headingFactorials" data-bs-parent="#accordionFactorials">
<div class="accordion-body">
<div>
<form>
<div class="mb-3">
<label for="factorialNumberInput" class="form-label">Number</label>
<input type="number" class="form-control" id="factorialNumberInput" name="factorialNumberInput" aria-describedby="factorialNumberHelp">
<div id="factorialNumberHelp" class="form-text">Enter an integer between 1 and 12.</div>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
@if (Model.FactorialNumber.HasValue)
{
<div class="card" style="width: 18rem;">
<div class="card-body">
<h5 class="card-title">@(Model.FactorialNumber)!</h5>
<div>
@(Model.FactorialNumber)! = @(Model.FactorialResult is null ? "null" : Model.FactorialResult.Value.ToString("N0"))
</div>
</div>
</div>
}
@if (Model.FactorialException is not null)
{
<div class="card" style="width: 18rem;">
<div class="card-body">
<h5 class="card-title">Exception</h5>
<div>
@Model.FactorialException.Message
</div>
</div>
</div>
}
</div>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="headerFibonacciSequence">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFibonacciSequence" aria-expanded="true" aria-controls="collapseFibonacciSequence">
Fibonacci sequence
</button>
</h2>
<div id="collapseFibonacciSequence" class="accordion-collapse @collapsedFibonacci" aria-labelledby="headingFibonacciSequence" data-bs-parent="#accordionCustomers">
<div class="accordion-body">
<div>
<form>
<div class="mb-3">
<label for="fibonacciNumberInput" class="form-label">Term</label>
<input type="number" class="form-control" id="fibonacciNumberInput" name="fibonacciNumberInput" aria-describedby="fibonacciNumberHelp">
<div id="fibonacciNumberHelp" class="form-text">Enter an integer between 1 and 40.</div>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
@if (Model.FibonacciNumber.HasValue)
{
<div class="card" style="width: 18rem;">
<div class="card-body">
<h5 class="card-title">Fibonacci term @Model.FibonacciNumber</h5>
<div>
Term @Model.FibonacciNumber of the fibonacci sequence = @(Model.FibonacciResult is null ? "null" : Model.FibonacciResult.Value.ToString("N0"))
</div>
</div>
</div>
}
</div>
</div>
</div>
</div>
</div>
</div>