Changes to make SPA compatible with angular-cli AOT

Signed-off-by: André Passos <andre-ap2@hotmail.com>
2017-04-17 09:59:01 -03:00 · 2017-04-17 09:59:01 -03:00 · b06bcdcd58
commit b06bcdcd58
parent 28426e95c0
11 changed files with 45 additions and 23 deletions
--- a/src/Web/WebSPA/Client/modules/app.component.ts
+++ b/src/Web/WebSPA/Client/modules/app.component.ts
@ -18,7 +18,7 @@ import { ConfigurationService } from './shared/services/configuration.service';
    templateUrl: './app.component.html'
 })
 export class AppComponent implements OnInit {
-    private Authenticated: boolean = false;
+    Authenticated: boolean = false;
    subscription: Subscription;

    constructor(private titleService: Title, private securityService: SecurityService, private configurationService: ConfigurationService) {
--- a/src/Web/WebSPA/Client/modules/basket/basket-status/basket-status.component.html
+++ b/src/Web/WebSPA/Client/modules/basket/basket-status/basket-status.component.html
@ -3,7 +3,7 @@
   [routerLink]="['basket']">

    <div class="esh-basketstatus-image">
-        <img src="../../../images/cart.png" />
+        <img src="assets/images/cart.png" />
    </div>
    <div class="esh-basketstatus-badge">
        {{badge}}
--- a/src/Web/WebSPA/Client/modules/orders/orders-detail/orders-detail.component.ts
+++ b/src/Web/WebSPA/Client/modules/orders/orders-detail/orders-detail.component.ts
@ -1,6 +1,6 @@
-import { Component, OnInit }    from '@angular/core';
-import { OrdersService }        from '../orders.service';
-import { IOrder }               from '../../shared/models/order.model';
+import { Component, OnInit } from '@angular/core';
+import { OrdersService } from '../orders.service';
+import { IOrderDetail } from '../../shared/models/order-detail.model';
 import { ActivatedRoute } from '@angular/router';

@Component({
@ -9,7 +9,7 @@ import { ActivatedRoute } from '@angular/router';
    templateUrl: './orders-detail.component.html'
 })
 export class OrdersDetailComponent implements OnInit {
-    order = {}; // new order
+    public order: IOrderDetail = <IOrderDetail>{};

    constructor(private service: OrdersService, private route: ActivatedRoute) { }

@ -27,5 +27,4 @@ export class OrdersDetailComponent implements OnInit {
            console.log(this.order);
        });
    }
-}
-
+}
--- a/src/Web/WebSPA/Client/modules/orders/orders-new/orders-new.component.ts
+++ b/src/Web/WebSPA/Client/modules/orders/orders-new/orders-new.component.ts
@ -13,10 +13,10 @@ import { Router }                                   from '@angular/router';
    templateUrl: './orders-new.component.html'
 })
 export class OrdersNewComponent implements OnInit {
-    private newOrderForm: FormGroup;  // new order form
-    private isOrderProcessing: Boolean;
-    private errorReceived: Boolean;
-    private order: IOrder;
+    newOrderForm: FormGroup;  // new order form
+    isOrderProcessing: boolean;
+    errorReceived: boolean;
+    order: IOrder;

    constructor(private service: OrdersService, fb: FormBuilder, private router: Router) {
        // Obtain user profile information
--- a/src/Web/WebSPA/Client/modules/orders/orders.service.ts
+++ b/src/Web/WebSPA/Client/modules/orders/orders.service.ts
@ -4,6 +4,7 @@ import { Response } from '@angular/http';
 import { DataService } from '../shared/services/data.service';
 import { IOrder } from '../shared/models/order.model';
 import { IOrderItem } from '../shared/models/orderItem.model';
+import { IOrderDetail } from "../shared/models/order-detail.model";
 import { SecurityService } from '../shared/services/security.service';
 import { ConfigurationService } from '../shared/services/configuration.service';
 import { BasketWrapperService } from '../shared/services/basket.wrapper.service';
@ -35,7 +36,7 @@ export class OrdersService {
        });
    }

-    getOrder(id: number): Observable<IOrder> {
+    getOrder(id: number): Observable<IOrderDetail> {
        let url = this.ordersUrl + '/api/v1/orders/' + id;

        return this.service.get(url).map((response: Response) => {
--- a/src/Web/WebSPA/Client/modules/shared/components/identity/identity.html
+++ b/src/Web/WebSPA/Client/modules/shared/components/identity/identity.html
@ -12,7 +12,7 @@
         *ngIf="authenticated">

        <div class="esh-identity-name">{{userName}}</div>
-        <img class="esh-identity-image" src="../../../../images/arrow-down.png">
+        <img class="esh-identity-image" src="assets/images/arrow-down.png">
    </section>

    <section class="esh-identity-drop"
@ -22,14 +22,14 @@
             [routerLink]="['orders']">

            <div class="esh-identity-name esh-identity-name--upper">My orders</div>
-            <img class="esh-identity-image" src="../../../../images/my_orders.png">
+            <img class="esh-identity-image" src="assets/images/my_orders.png">
        </div>

        <div class="esh-identity-item"
             (click)="logoutClicked($event)">

            <div class="esh-identity-name esh-identity-name--upper">Log Out</div>
-            <img class="esh-identity-image" src="../../../../images/logout.png">
+            <img class="esh-identity-image" src="assets/images/logout.png">
        </div>
    </section>
 </div>
--- a/src/Web/WebSPA/Client/modules/shared/components/identity/identity.ts
+++ b/src/Web/WebSPA/Client/modules/shared/components/identity/identity.ts
@ -10,7 +10,7 @@ import { SecurityService } from  '../../services/security.service';
    styleUrls: ['./identity.scss']
 })
 export class Identity implements OnInit  {
-    private authenticated: boolean = false;
+    authenticated: boolean = false;
    private subscription: Subscription;
    private userName: string = '';

--- a/src/Web/WebSPA/Client/modules/shared/models/order-detail.model.ts
+++ b/src/Web/WebSPA/Client/modules/shared/models/order-detail.model.ts
@ -0,0 +1,14 @@
+import {IOrderItem} from './orderItem.model';
+
+export interface IOrderDetail {
+    ordernumber: string;
+    status: string;
+    street: string;
+    date: Date;
+    city: number;
+    state: string;
+    zipcode: string;
+    country: number;
+    total: number;
+    orderitems: IOrderItem[];
+}
--- a/src/Web/WebSPA/Client/modules/shared/shared.module.ts
+++ b/src/Web/WebSPA/Client/modules/shared/shared.module.ts
@ -16,6 +16,10 @@ import { StorageService } from './services/storage.service';
 import { Pager } from './components/pager/pager';
 import { Header } from './components/header/header';
 import { Identity } from './components/identity/identity';
+import { PageNotFoundComponent } from './components/page-not-found/page-not-found.component';
+
+// Pipes:
+import { UppercasePipe } from './pipes/uppercase.pipe';

@NgModule({
    imports: [
@ -31,7 +35,9 @@ import { Identity } from './components/identity/identity';
    declarations: [
        Pager,
        Header,
-        Identity
+        Identity,
+        PageNotFoundComponent,
+        UppercasePipe
    ],
    exports: [
        // Modules
@ -43,7 +49,9 @@ import { Identity } from './components/identity/identity';
        // Providers, Components, directive, pipes
        Pager,
        Header,
-        Identity
+        Identity,
+        PageNotFoundComponent,
+        UppercasePipe
    ]
 })
 export class SharedModule {
--- a/src/Web/WebSPA/WebSPA.csproj
+++ b/src/Web/WebSPA/WebSPA.csproj
@ -56,7 +56,7 @@

  <Target Name="PrepublishScript" BeforeTargets="PrepareForPublish">
    <Exec Command="npm install" />
-    <Exec Command="npm run build:dev" />
+    <Exec Command="npm run build:prod" />
  </Target>

  <ItemGroup>
--- a/src/Web/WebSPA/package.json
+++ b/src/Web/WebSPA/package.json
@ -17,9 +17,11 @@
  },
  "scripts": {
    "ng": "ng",
+    "rimraf": "rimraf",
+    "clean": "npm cache clean && npm run rimraf -- node_modules doc typings coverage wwwroot",
    "start": "ng serve",
    "build:dev": "ng build",
-    "build:prod": "ng build",
+    "build:prod": "ng build --prod --aot --extract-css",
    "lint:sass": "sass-lint -c .sass-lint.yml Client/**/*.scss --verbose",
    "lint:ts": "tslint -c tslint.json Client/**/*.ts"
  },
@ -33,8 +35,6 @@
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/router": "^4.0.0",
    "@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.22",
-    "aspnet-prerendering": "1.0.7",
-    "aspnet-webpack": "1.0.24",
    "bootstrap": "4.0.0-alpha.5",
    "core-js": "^2.4.1",
    "file-loader": "0.9.0",