Skip to content

Commit

Permalink
Merge pull request #49 from falberthen/feature/ctrl-flow
Browse files Browse the repository at this point in the history 
feat(control-flow): migrate to the new control-flow via schematic command
  • Loading branch information
@falberthen
falberthen authored May 29, 2024
2 parents 6fd3c97 + 50361cc commit 5ed4601
Show file tree
Hide file tree
Showing 9 changed files with 527 additions and 460 deletions.
68 changes: 40 additions & 28 deletions ...rc/app/modules/authentication/components/customer-account/customer-account.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,12 @@ <h4>Customer account</h4>
formControlName="email"
placeholder="E-mail"
[ngClass]="{ 'is-invalid': isFieldInvalid('email') }"
/>
<div class="invalid-feedback" *ngIf="isFieldInvalid('email')">
Email is required
</div>
/>
@if (isFieldInvalid('email')) {
<div class="invalid-feedback">
Email is required
</div>
}
</div>
<div class="form-group mt-3">
<label for="name" class="form-label col-lg-12">Name</label>
Expand All @@ -36,10 +38,12 @@ <h4>Customer account</h4>
formControlName="name"
placeholder="Name"
[ngClass]="{ 'is-invalid': isFieldInvalid('name') }"
/>
<div class="invalid-feedback" *ngIf="isFieldInvalid('name')">
Name is required
</div>
/>
@if (isFieldInvalid('name')) {
<div class="invalid-feedback">
Name is required
</div>
}
</div>
<div class="form-group mt-3">
<label for="shippingAddress" class="form-label col-lg-12">
Expand All @@ -53,12 +57,14 @@ <h4>Customer account</h4>
formControlName="shippingAddress"
placeholder="Shipping Address"
[ngClass]="{ 'is-invalid': isFieldInvalid('shippingAddress') }"
/>
<div
class="invalid-feedback"
*ngIf="isFieldInvalid('shippingAddress')">
Shipping Address is required
</div>
/>
@if (isFieldInvalid('shippingAddress')) {
<div
class="invalid-feedback"
>
Shipping Address is required
</div>
}
</div>
<div class="form-group mt-3">
<label for="password" class="form-label col-lg-12">Password</label>
Expand All @@ -70,10 +76,12 @@ <h4>Customer account</h4>
formControlName="password"
placeholder="Password"
[ngClass]="{ 'is-invalid': isFieldInvalid('password') }"
/>
<div class="invalid-feedback" *ngIf="isFieldInvalid('password')">
Password is required
</div>
/>
@if (isFieldInvalid('password')) {
<div class="invalid-feedback">
Password is required
</div>
}
</div>
<div class="form-group mt-3">
<label for="passwordConfirm" class="form-label col-lg-12">
Expand All @@ -87,10 +95,12 @@ <h4>Customer account</h4>
formControlName="passwordConfirm"
placeholder="Confirmation"
[ngClass]="{ 'is-invalid': isFieldInvalid('passwordConfirm') }"
/>
<div class="invalid-feedback" *ngIf="isFieldInvalid('password')">
Password confirm is required
</div>
/>
@if (isFieldInvalid('password')) {
<div class="invalid-feedback">
Password confirm is required
</div>
}
</div>
<div class="form-group mt-3">
<label for="creditLimit" class="form-label col-lg-12">
Expand All @@ -104,10 +114,12 @@ <h4>Customer account</h4>
formControlName="creditLimit"
placeholder="Credit limit"
[ngClass]="{ 'is-invalid': isFieldInvalid('creditLimit') }"
/>
<div class="invalid-feedback" *ngIf="isFieldInvalid('creditLimit')">
Credit Limit is required
</div>
/>
@if (isFieldInvalid('creditLimit')) {
<div class="invalid-feedback">
Credit Limit is required
</div>
}
</div>
<div class="row mt-3">
<hr />
Expand All @@ -116,14 +128,14 @@ <h4>Customer account</h4>
[routerLink]="['/home']"
class="btn btn-secondary footer-item"
[disabled]="isLoading | async"
>
>
Cancel
</button>
<button
(click)="onSubmit()"
class="btn btn-primary footer-item"
[disabled]="accountForm.invalid || (isLoading | async)"
>
>
Create
</button>
</div>
Expand Down
47 changes: 26 additions & 21 deletions src/EcommerceDDD.Spa/src/app/modules/authentication/components/login/login.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,10 +16,12 @@ <h4>Login</h4>
formControlName="email"
placeholder="Login"
[ngClass]="{ 'is-invalid': isFieldInvalid('email') }"
/>
<div class="invalid-feedback" *ngIf="isFieldInvalid('email')">
Email is required
</div>
/>
@if (isFieldInvalid('email')) {
<div class="invalid-feedback">
Email is required
</div>
}
</div>
<div class="form-group mt-3">
<input
Expand All @@ -30,10 +32,12 @@ <h4>Login</h4>
formControlName="password"
placeholder="Password"
[ngClass]="{ 'is-invalid': isFieldInvalid('password') }"
/>
<div class="invalid-feedback" *ngIf="isFieldInvalid('password')">
Password is required
</div>
/>
@if (isFieldInvalid('password')) {
<div class="invalid-feedback">
Password is required
</div>
}
</div>
<div class="row mt-3">
<div class="col-lg-12">
Expand All @@ -42,7 +46,7 @@ <h4>Login</h4>
class="btn btn-primary login-button"
value="Log In"
[disabled]="loginForm.invalid || (isLoading | async)"
/>
/>
</div>
</div>
</form>
Expand All @@ -52,19 +56,20 @@ <h4>Login</h4>
<div class="col-lg-12">
<a [routerLink]="['/customer-account']" class="create-account-link"
>Create my account</a
>
>
</div>
</div>
</div>
</div>
</div>
<div class="container mt-3">
<div class="stargazers-container alert alert-dark">
Did you like it?<strong> give a star!</strong><br /><br />
<github-button
type="stargazers"
size="large"
namespace="falberthen"
repo="EcommerceDDD"
></github-button>
<div class="container mt-3">
<div class="stargazers-container alert alert-dark">
Did you like it?<strong> give a star!</strong><br /><br />
<github-button
type="stargazers"
size="large"
namespace="falberthen"
repo="EcommerceDDD"
></github-button>
</div>
</div>
</div>
147 changes: 80 additions & 67 deletions src/EcommerceDDD.Spa/src/app/modules/ecommerce/components/cart/cart.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,88 +2,101 @@
<div class="stored-event-viewer-container">
<template #storedEventViewerContainer></template>
</div>

<div class="card cart-details-container">
<div class="card-body">
<div class="cart-header">
<div class="row">
<div class="col-7">
<h4>Shopping Cart</h4>
</div>
<div class="col-5 quote-history" *ngIf="quote">
<a class="text-secondary event-link"
(click)="showQuoteStoredEvents()">
<fa-icon [icon]="faList"></fa-icon>
Quote Events
</a>
</div>
@if (quote) {
<div class="col-5 quote-history">
<a class="text-secondary event-link"
(click)="showQuoteStoredEvents()">
<fa-icon [icon]="faList"></fa-icon>
Quote Events
</a>
</div>
}
</div>
<hr />
</div>
<div *ngIf="(isLoading | async) && !quote">
<app-loader-skeleton></app-loader-skeleton>
</div>
<div *ngIf="!(isLoading | async) && !quote"
class="empty-cart-message alert alert-danger">
Your cart is empty.
</div>
<div *ngIf="!(isLoading | async) && quote && quote.items.length == 0"
class="empty-cart-message alert alert-danger">
Your cart is empty.
</div>
<div class="cart-body" *ngIf="quote && quote.items.length > 0">
<div *ngIf="quote">
<div class="row mb-4" *ngFor="let quoteItem of quote.items; index as i">
<div class="col-1">
<button (click)="removeItem(quoteItem)" class="btn remove-item">
<fa-icon [icon]="faMinusCircle" title="Remove"></fa-icon>
</button>
</div>
<div class="col-7">
<span class="product-name">
{{ quoteItem.productName }}
</span>
</div>
<div class="col-4">
@if ((isLoading | async) && !quote) {
<div>
<app-loader-skeleton></app-loader-skeleton>
</div>
}
@if (!(isLoading | async) && !quote) {
<div
class="empty-cart-message alert alert-danger">
Your cart is empty.
</div>
}
@if (!(isLoading | async) && quote && quote.items.length == 0) {
<div
class="empty-cart-message alert alert-danger">
Your cart is empty.
</div>
}
@if (quote && quote.items.length > 0) {
<div class="cart-body">
@if (quote) {
<div>
@for (quoteItem of quote.items; track quoteItem; let i = $index) {
<div class="row mb-4">
<div class="col-1">
<button (click)="removeItem(quoteItem)" class="btn remove-item">
<fa-icon [icon]="faMinusCircle" title="Remove"></fa-icon>
</button>
</div>
<div class="col-7">
<span class="product-name">
{{ quoteItem.productName }}
</span>
</div>
<div class="col-4">
<div class="row">
<span class="product-price">
<span class="currency-symbol">
{{ quoteItem.currencySymbol }}
</span>
{{ quoteItem.unitPrice }}
</span>
</div>
<div class="row">
<span class="product-qty">
Qty: <b>{{ quoteItem.quantity }}</b>
</span>
</div>
</div>
</div>
}
<div class="row">
<span class="product-price">
<span class="currency-symbol">
{{ quoteItem.currencySymbol }}
<hr />
<div class="total-to-pay-container mb-3">
<b>Total:</b>
<span>
{{ quote.currencySymbol }}{{ quote.totalPrice.toFixed(2) }}
</span>
{{ quoteItem.unitPrice }}
</span>
</div>
</div>
<div class="row">
<span class="product-qty">
Qty: <b>{{ quoteItem.quantity }}</b>
</span>
<div class="place-order-container">
<button
(click)="cancelQuote()"
class="btn btn-danger cancel-quote"
[disabled]="isLoading | async">
Cancel
</button>
<button
(click)="placeOrder()"
class="btn btn-success"
[disabled]="isLoading | async">
Place Order
</button>
</div>
</div>
</div>
<div class="row">
<hr />
<div class="total-to-pay-container mb-3">
<b>Total:</b>
<span>
{{ quote.currencySymbol }}{{ quote.totalPrice.toFixed(2) }}
</span>
</div>
</div>
<div class="place-order-container">
<button
(click)="cancelQuote()"
class="btn btn-danger cancel-quote"
[disabled]="isLoading | async">
Cancel
</button>
<button
(click)="placeOrder()"
class="btn btn-success"
[disabled]="isLoading | async">
Place Order
</button>
</div>
}
</div>
</div>
}
</div>
</div>
20 changes: 12 additions & 8 deletions ...a/src/app/modules/ecommerce/components/currency-dropdown/currency-dropdown.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,13 +1,17 @@
<div class="ddl-currency-container">
<div class="currency-icon-container">
<fa-icon
[icon]="faEuroSign"
*ngIf="getCurrentCurrency() == 'EUR'">
</fa-icon>
<fa-icon
[icon]="faDollarSign"
*ngIf="getCurrentCurrency() != 'EUR'">
</fa-icon>
@if (getCurrentCurrency() == 'EUR') {
<fa-icon
[icon]="faEuroSign"
>
</fa-icon>
}
@if (getCurrentCurrency() != 'EUR') {
<fa-icon
[icon]="faDollarSign"
>
</fa-icon>
}
</div>
<div class="currency-selector-container">
<div ngbDropdown class="d-inline-block">
Expand Down
Loading

0 comments on commit 5ed4601

Please sign in to comment.