ng5 migration

Migrate to angular 5.1.1
Adjusted some visuals
Fixed some errors
Formatted all sources to LF endline
This commit is contained in:
Adrian MIHAILESCU 2017-12-21 18:10:25 +01:00
parent 6e51a9f391
commit 374087bf28
74 changed files with 10197 additions and 13643 deletions

View File

@ -3,8 +3,7 @@
"project": {
"name": "WebSPA"
},
"apps": [
{
"apps": [{
"root": "Client",
"outDir": "wwwroot",
"assets": [
@ -28,15 +27,13 @@
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
}],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"lint": [{
"project": "Client/tsconfig.app.json"
},
{

View File

@ -0,0 +1,4 @@
{
"repoId": "bccb75c8-567f-4f97-923c-d56cd1208aa5",
"lastSync": 0
}

View File

@ -1,9 +1,4 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
namespace eShopOnContainers.WebSPA
namespace eShopOnContainers.WebSPA
{
public class AppSettings
{

View File

@ -1,8 +1,7 @@
/* You can add global styles to this file, and also import other style files */
@import './modules/variables';
$dist: './fonts/Montserrat-Regular';
@font-face {
font-family: Montserrat;
font-weight: 400;
@ -74,4 +73,3 @@ select::-ms-expand {
color: #FB0D0D;
font-size: 12px;
}

View File

@ -1,7 +1,7 @@
export class Guid {
static newGuid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
let r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}

View File

@ -1,5 +1,6 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>eShopConContainers.WebSPA</title>
@ -8,6 +9,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<esh-app>
<div class="preloading">
@ -15,4 +17,5 @@
</div>
</esh-app>
</body>
</html>

View File

@ -4,41 +4,34 @@ $color-brand-dark: darken($color-brand, 10%);
$color-brand-darker: darken($color-brand, 20%);
$color-brand-bright: lighten($color-brand, 10%);
$color-brand-brighter: lighten($color-brand, 20%);
$color-secondary: #83D01B;
$color-secondary-dark: darken($color-secondary, 5%);
$color-secondary-darker: darken($color-secondary, 20%);
$color-secondary-bright: lighten($color-secondary, 10%);
$color-secondary-brighter: lighten($color-secondary, 20%);
$color-background-dark: #333333;
$color-background-darker: #000000;
$color-background-bright: #EEEEFF;
$color-background-brighter: #FFFFFF;
$color-foreground-dark: #333333;
$color-foreground-darker: #000000;
$color-foreground-bright: #EEEEEE;
$color-foreground-brighter: #FFFFFF;
// Animations
$animation-speed-default: .35s;
$animation-speed-slow: .5s;
$animation-speed-fast: .15s;
// Fonts
$font-weight-light: 200;
$font-weight-semilight: 300;
$font-weight-normal: 400;
$font-weight-semibold: 600;
$font-weight-bold: 700;
$font-size-xs: .65rem; // 10.4px
$font-size-s: .85rem; // 13.6px
$font-size-m: 1rem; // 16px
$font-size-l: 1.25rem; // 20px
$font-size-xl: 1.5rem; // 24px
// Medias
$media-screen-xxs: 360px;
$media-screen-xs: 640px;
@ -48,10 +41,8 @@ $media-screen-l: 1280px;
$media-screen-xl: 1440px;
$media-screen-xxl: 1680px;
$media-screen-xxxl: 1920px;
// Borders
$border-light: 1px;
// Images
$image_path: '/assets/images/';
$image-main_banner: '#{$image_path}main_banner.png';

View File

@ -1,4 +1,4 @@
<header class="navbar navbar-light navbar-static-top">
<header class="navbar-light navbar-static-top">
<div class="container">
<article class="row">
@ -38,4 +38,3 @@
</article>
</div>
</footer>

View File

@ -1,23 +1,18 @@
@import './variables';
.esh-app {
&-footer {
$margin: 2.5rem;
$padding: 2.5rem;
background-color: $color-background-darker;
border-top: $border-light solid $color-foreground-bright;
margin-top: $margin;
padding-bottom: $padding;
padding-top: $padding;
width: 100%;
$height: 50px;
&-brand {
height: $height;
width: 230px;
}
}
}

View File

@ -21,7 +21,10 @@ export class AppComponent implements OnInit {
Authenticated: boolean = false;
subscription: Subscription;
constructor(private titleService: Title, private securityService: SecurityService, private configurationService: ConfigurationService) {
constructor(
private titleService: Title,
private securityService: SecurityService,
private configurationService: ConfigurationService) {
this.Authenticated = this.securityService.IsAuthorized;
}
@ -29,7 +32,7 @@ export class AppComponent implements OnInit {
console.log('app on init');
this.subscription = this.securityService.authenticationChallenge$.subscribe(res => this.Authenticated = res);
//Get configuration from server environment variables:
// Get configuration from server environment variables:
console.log('configuration');
this.configurationService.load();
}

View File

@ -1,6 +1,4 @@
<a class="esh-basketstatus"
[ngClass]="{'is-disabled': badge < 1}"
[routerLink]="['basket']">
<a class="esh-basketstatus" [ngClass]="{'is-disabled': badge < 1}" [routerLink]="['basket']">
<div class="esh-basketstatus-image">
<img src="assets/images/cart.png" />

View File

@ -1,22 +1,18 @@
@import '../../variables';
.esh-basketstatus {
cursor: pointer;
display: inline-block;
float: right;
position: relative;
transition: all $animation-speed-default;
&.is-disabled {
opacity: .5;
pointer-events: none;
}
&-image {
height: 36px;
margin-top: .5rem;
}
&-badge {
$size: 1.5rem;
background-color: $color-secondary;
@ -32,7 +28,6 @@
transition: all $animation-speed-default;
width: $size;
}
&:hover &-badge {
background-color: transparent;
color: $color-secondary-dark;

View File

@ -20,17 +20,12 @@
<article class="esh-basket-items row">
<section class="esh-basket-item esh-basket-item--middle col-lg-3 hidden-lg-down">
<img class="esh-basket-image" src="{{item.pictureUrl}}"/>
<img class="esh-basket-image" src="{{item.pictureUrl}}" />
</section>
<section class="esh-basket-item esh-basket-item--middle col-xs-3">{{item.productName}}</section>
<section class="esh-basket-item esh-basket-item--middle col-xs-2">$ {{item.unitPrice | number:'.2-2'}}</section>
<section class="esh-basket-item esh-basket-item--middle col-xs-2">
<input id="quantity"
class="esh-basket-input"
type="number"
min="1"
[(ngModel)]="item.quantity"
(change)="itemQuantityChanged(item)"/>
<input id="quantity" class="esh-basket-input" type="number" min="1" [(ngModel)]="item.quantity" (change)="itemQuantityChanged(item)" />
</section>
<section class="esh-basket-item esh-basket-item--middle esh-basket-item--mark col-xs-2">$ {{(item.unitPrice * item.quantity) | number:'.2-2'}}</section>
</article>

View File

@ -1,69 +1,54 @@
@import '../variables';
@mixin margin-left($distance) {
margin-left: $distance;
}
.esh-basket {
min-height: 80vh;
&-titles {
padding-bottom: 1rem;
padding-top: 2rem;
&--clean {
padding-bottom: 0;
padding-top: 0;
}
}
&-title {
text-transform: uppercase;
}
&-items {
&--border {
border-bottom: $border-light solid $color-foreground-bright;
padding: .5rem 0;
&:last-of-type {
border-color: transparent;
}
}
&-margin-left1 {
@include margin-left(1px);
}
}
$item-height: 8rem;
&-item {
font-size: $font-size-m;
font-weight: $font-weight-semilight;
&--middle {
line-height: $item-height;
@media screen and (max-width: $media-screen-m) {
line-height: $font-size-m;
}
}
&--mark {
color: $color-brand;
}
}
&-image {
height: $item-height;
}
&-input {
line-height: 1rem;
width: 100%;
}
&-checkout {
background-color: $color-secondary;
border: 0;
@ -77,13 +62,9 @@
text-align: center;
text-transform: uppercase;
transition: all $animation-speed-default;
&:hover {
background-color: $color-secondary-darker;
transition: all $animation-speed-default;
}
}
}

View File

@ -52,8 +52,7 @@ export class BasketComponent implements OnInit {
x => {
this.errorMessages = [];
this.basketwrapper.basket = this.basket;
this.router.navigate(['order'],
errMessage => this.errorMessages = errMessage.messages);
this.router.navigate(['order']);
});
}

View File

@ -28,7 +28,7 @@ export class BasketService {
items: []
};
//observable that is fired when the basket is dropped
// observable that is fired when the basket is dropped
private basketDropedSource = new Subject();
basketDroped$ = this.basketDropedSource.asObservable();
@ -92,7 +92,7 @@ export class BasketService {
mapBasketInfoCheckout(order: IOrder): IBasketCheckout {
let basketCheckout = <IBasketCheckout>{};
basketCheckout.street = order.street
basketCheckout.street = order.street;
basketCheckout.city = order.city;
basketCheckout.country = order.country;
basketCheckout.state = order.state;

View File

@ -1,56 +1,43 @@
@import '../../variables';
.esh-campaign_detail {
min-height: 80vh;
margin-top: 1rem;
&-section {
padding: 1rem 0;
&--right {
text-align: right;
}
}
&-titles {
padding-bottom: 1rem;
padding-top: 2rem;
}
&-title {
text-transform: uppercase;
}
&-items {
&--border {
border-bottom: $border-light solid $color-foreground-bright;
padding: .5rem 0;
&:last-of-type {
border-color: transparent;
}
}
}
$item-height: 8rem;
&-item {
font-size: $font-size-m;
font-weight: $font-weight-semilight;
&--middle {
line-height: $item-height;
@media screen and (max-width: $media-screen-s) {
line-height: $font-size-m;
}
}
&--mark {
color: $color-secondary;
}
}
&-image {
height: $item-height;
}

View File

@ -6,8 +6,7 @@
<div *ngIf="campaigns?.data?.length > 0">
<esh-pager [model]="paginationInfo" (changed)="onPageChanged($event)"></esh-pager>
<div class="card-group esh-campaign-items row">
<div class="esh-campaign-item col-md-4"
*ngFor="let item of campaigns.data">
<div class="esh-campaign-item col-md-4" *ngFor="let item of campaigns.data">
<div class="card-block">
<h4 class="card-title esh-campaign-name">{{item.name}}</h4>
@ -31,4 +30,3 @@
<span>THERE ARE NO RESULTS THAT MATCH YOUR SEARCH</span>
</div>
</div>

View File

@ -1,38 +1,30 @@
@import '../variables';
.esh-campaign {
$banner-height: 260px;
&-title {
position: relative;
top: $banner-height / 3.5;
}
&-items {
margin-top: 1rem;
}
&-item {
margin-bottom: 1.5rem;
text-align: center;
width: 33%;
display: inline-block;
float: none !important;
@media screen and (max-width: $media-screen-m) {
width: 50%;
}
@media screen and (max-width: $media-screen-s) {
width: 100%;
}
}
&-thumbnail {
max-width: 370px;
width: 100%;
}
&-button {
background-color: $color-secondary;
border: 0;
@ -43,18 +35,15 @@
margin-top: 1rem;
transition: all $animation-speed-default;
width: 80%;
&.is-disabled {
opacity: .5;
pointer-events: none;
}
&:hover {
background-color: $color-secondary-darker;
transition: all $animation-speed-default;
}
}
&-name {
font-size: $font-size-m;
font-weight: $font-weight-semilight;
@ -62,7 +51,6 @@
text-align: center;
text-transform: uppercase;
}
&-alert {
margin-top: 10px;
}

View File

@ -21,7 +21,7 @@ export class CampaignsComponent implements OnInit {
ngOnInit() {
if (this.configurationService.isReady) {
this.getCampaigns(9, 0)
this.getCampaigns(9, 0);
} else {
this.configurationService.settingsLoaded$.subscribe(x => {
this.getCampaigns(9, 0);
@ -32,8 +32,8 @@ export class CampaignsComponent implements OnInit {
}
onPageChanged(value: any) {
console.log('campaigns pager event fired' + value);
//event.preventDefault();
console.log(`campaigns pager event fired` + value);
// event.preventDefault();
this.paginationInfo.actualPage = value;
this.getCampaigns(this.paginationInfo.itemsPage, value);
}
@ -45,9 +45,9 @@ export class CampaignsComponent implements OnInit {
.subscribe(campaigns => {
this.campaigns = campaigns;
this.paginationInfo = {
actualPage : campaigns.pageIndex,
itemsPage : campaigns.pageSize,
totalItems : campaigns.count,
actualPage: campaigns.pageIndex,
itemsPage: campaigns.pageSize,
totalItems: campaigns.count,
totalPages: Math.ceil(campaigns.count / campaigns.pageSize),
items: campaigns.pageSize
};
@ -55,7 +55,7 @@ export class CampaignsComponent implements OnInit {
}
onNavigateToDetails(uri: string) {
window.open(uri, "_blank");
window.open(uri, `_blank`);
}
private handleError(error: any) {

View File

@ -28,8 +28,7 @@
<esh-pager [model]="paginationInfo" (changed)="onPageChanged($event)"></esh-pager>
<div class="esh-catalog-items row">
<div class="esh-catalog-item col-md-4"
*ngFor="let item of catalog?.data">
<div class="esh-catalog-item col-md-4" *ngFor="let item of catalog?.data">
<img class="esh-catalog-thumbnail" src="{{item.pictureUri}}" />
<button [ngClass]="{'esh-catalog-button': true, 'is-disabled': !authenticated}" (click)="addToCart(item)">
@ -51,4 +50,3 @@
<span>THERE ARE NO RESULTS THAT MATCH YOUR SEARCH</span>
</div>
</div>

View File

@ -1,29 +1,22 @@
@import '../variables';
.esh-catalog {
$banner-height: 260px;
&-hero {
background-image: url($image-main_banner);
background-size: cover;
height: $banner-height;
width: 100%;
}
&-title {
position: relative;
top: $banner-height / 3.5;
}
$filter-height: 65px;
&-filters {
background-color: $color-brand;
height: $filter-height;
}
$filter-padding: .5rem;
&-filter {
-webkit-appearance: none;
background-color: transparent;
@ -38,17 +31,14 @@
padding-left: $filter-padding;
padding-right: $filter-padding;
padding-top: $filter-padding * 3;
option {
background-color: $color-brand;
}
}
&-label {
display: inline-block;
position: relative;
z-index: 0;
&::before {
color: rgba($color-foreground-brighter, .5);
content: attr(data-title);
@ -59,7 +49,6 @@
text-transform: uppercase;
z-index: 1;
}
&::after {
background-image: url($image-arrow_down);
content: '';
@ -71,7 +60,6 @@
z-index: 1;
}
}
&-send {
background-color: $color-secondary;
color: $color-foreground-brighter;
@ -80,38 +68,31 @@
margin-top: -$filter-padding * 3;
padding: $filter-padding;
transition: all $animation-speed-default;
&:hover {
background-color: $color-secondary-darker;
transition: all $animation-speed-default;
}
}
&-items {
margin-top: 1rem;
}
&-item {
margin-bottom: 1.5rem;
text-align: center;
width: 33%;
display: inline-block;
float: none !important;
@media screen and (max-width: $media-screen-m) {
width: 50%;
}
@media screen and (max-width: $media-screen-s) {
width: 100%;
}
}
&-thumbnail {
max-width: 370px;
width: 100%;
}
&-button {
background-color: $color-secondary;
border: 0;
@ -122,18 +103,15 @@
margin-top: 1rem;
transition: all $animation-speed-default;
width: 80%;
&.is-disabled {
opacity: .5;
pointer-events: none;
}
&:hover {
background-color: $color-secondary-darker;
transition: all $animation-speed-default;
}
}
&-name {
font-size: $font-size-m;
font-weight: $font-weight-semilight;
@ -141,17 +119,14 @@
text-align: center;
text-transform: uppercase;
}
&-price {
font-size: 28px;
font-weight: 900;
text-align: center;
&::before {
content: '$';
}
}
&-alert {
margin-top: 10px;
}

View File

@ -8,7 +8,7 @@ import { ICatalogItem } from '../shared/models/catalogItem.model';
import { ICatalogType } from '../shared/models/catalogType.model';
import { ICatalogBrand } from '../shared/models/catalogBrand.model';
import { IPager } from '../shared/models/pager.model';
import { BasketWrapperService} from '../shared/services/basket.wrapper.service';
import { BasketWrapperService } from '../shared/services/basket.wrapper.service';
import { SecurityService } from '../shared/services/security.service';
import { Observable } from 'rxjs/Observable';
@ -87,9 +87,9 @@ export class CatalogComponent implements OnInit {
.subscribe(catalog => {
this.catalog = catalog;
this.paginationInfo = {
actualPage : catalog.pageIndex,
itemsPage : catalog.pageSize,
totalItems : catalog.count,
actualPage: catalog.pageIndex,
itemsPage: catalog.pageSize,
totalItems: catalog.count,
totalPages: Math.ceil(catalog.count / catalog.pageSize),
items: catalog.pageSize
};

View File

@ -50,5 +50,5 @@ export class CatalogService {
return this.service.get(this.typesUrl).map((response: Response) => {
return response.json();
});
};
}
}

View File

@ -1,55 +1,46 @@
@import '../../variables';
.esh-orders_detail {
min-height: 80vh;
&-section {
padding: 1rem 0;
&--right {
text-align: right;
}
}
&-titles {
padding-bottom: 1rem;
padding-top: 2rem;
justify-content: space-between;
align-items: right;
}
&-title {
text-transform: uppercase;
}
&-items {
justify-content: space-between;
align-items: right;
&--border {
border-bottom: $border-light solid $color-foreground-bright;
padding: .5rem 0;
&:last-of-type {
border-color: transparent;
}
}
}
$item-height: 8rem;
&-item {
font-size: $font-size-m;
font-weight: $font-weight-semilight;
&--middle {
line-height: $item-height;
@media screen and (max-width: $media-screen-s) {
line-height: $font-size-m;
}
}
&--mark {
color: $color-secondary;
}
}
&-image {
height: $item-height;
}

View File

@ -80,8 +80,7 @@
<section class="esh-orders_new-title col-xs-12">Order details</section>
</article>
<article class="esh-orders_new-items esh-orders_new-items--border row"
*ngFor="let item of order.orderItems">
<article class="esh-orders_new-items esh-orders_new-items--border row" *ngFor="let item of order.orderItems">
<section class="esh-orders_new-item col-md-4 hidden-md-down">
<img class="esh-orders_new-image" src="{{item.pictureurl}}">
</section>

View File

@ -1,36 +1,28 @@
@import '../../variables';
.esh-orders_new {
min-height: 80vh;
$header-height: 4rem;
&-header {
background-color: #00A69C;
height: $header-height;
}
&-back {
color: rgba($color-foreground-brighter, .4);
line-height: $header-height;
text-decoration: none;
text-transform: uppercase;
transition: color $animation-speed-default;
&:hover {
color: $color-foreground-brighter;
transition: color $animation-speed-default;
}
}
&-section {
padding: 1rem 0;
&--right {
text-align: right;
}
}
&-placeOrder {
background-color: $color-secondary;
border: 0;
@ -44,57 +36,45 @@
text-align: center;
text-transform: uppercase;
transition: all $animation-speed-default;
&:hover {
background-color: $color-secondary-darker;
transition: all $animation-speed-default;
}
}
&-titles {
padding-bottom: 1rem;
padding-top: 2rem;
}
&-title {
font-size: $font-size-l;
text-transform: uppercase;
}
&-items {
&--border {
border-bottom: $border-light solid $color-foreground-bright;
padding: .5rem 0;
&:last-of-type {
border-color: transparent;
}
}
}
$item-height: 8rem;
&-item {
font-size: $font-size-m;
font-weight: $font-weight-semilight;
&--middle {
line-height: $item-height;
@media screen and (max-width: $media-screen-s) {
line-height: $font-size-m;
}
}
&--mark {
color: $color-secondary;
}
}
&-image {
height: $item-height;
}
&-alert {
margin-top: 10px;
}

View File

@ -13,8 +13,7 @@
<section class="esh-orders-title col-xs-2"></section>
</article>
<article class="esh-orders-items row"
*ngFor="let order of orders">
<article class="esh-orders-items row" *ngFor="let order of orders">
<section class="esh-orders-item col-xs-2">{{order.ordernumber}}</section>
<section class="esh-orders-item col-xs-4">{{order.date | date:'short'}}</section>
<section class="esh-orders-item col-xs-2">$ {{order.total}}</section>

View File

@ -1,44 +1,39 @@
@import '../variables';
.esh-orders {
min-height: 80vh;
overflow-x: hidden;
$header-height: 4rem;
&-header {
background-color: #00A69C;
height: $header-height;
}
&-back {
color: rgba($color-foreground-brighter, .4);
line-height: $header-height;
text-decoration: none;
text-transform: uppercase;
transition: color $animation-speed-default;
&:hover {
color: $color-foreground-brighter;
transition: color $animation-speed-default;
}
}
&-titles {
padding-bottom: 1rem;
padding-top: 2rem;
justify-content: space-between;
align-items: right;
}
&-title {
text-transform: uppercase;
}
&-items {
$height: 2rem;
height: $height;
line-height: $height;
position: relative;
justify-content: space-between;
align-items: right;
&:nth-of-type(2n + 1) {
&:before {
background-color: $color-background-bright;
@ -53,32 +48,26 @@
}
}
}
&-item {
font-weight: $font-weight-semilight;
&--hover {
opacity: 0;
pointer-events: none;
}
}
&-items:hover &-item--hover {
opacity: 1;
pointer-events: all;
}
&-link {
color: $color-secondary;
text-decoration: none;
transition: color $animation-speed-default;
&:hover {
color: $color-secondary-dark;
transition: color $animation-speed-default;
}
}
&-alert {
margin-top: 10px;
}

View File

@ -4,7 +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 { 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';

View File

@ -1,18 +1,14 @@
@import '../../../variables';
.esh-header {
$header-height: 4rem;
background-color: $color-brand;
height: $header-height;
&-back {
color: rgba($color-foreground-brighter, .5);
line-height: $header-height;
text-decoration: none;
text-transform: uppercase;
transition: color $animation-speed-default;
&:hover {
color: $color-foreground-brighter;
transition: color $animation-speed-default;

View File

@ -1,39 +1,32 @@
<div class="esh-identity">
<section class="esh-identity-section"
*ngIf="!authenticated">
<div class="esh-identity-item"
(click)="login()">
<section class="esh-identity-section" *ngIf="!authenticated">
<div class="esh-identity-item" (click)="login()">
<div class="esh-identity-name esh-identity-name--upper">Login</div>
</div>
</section>
<section class="esh-identity-section"
*ngIf="authenticated">
<section class="esh-identity-section" *ngIf="authenticated">
<div class="esh-identity-name">{{userName}}</div>
<div class="esh-identity-name">{{getUserName()}}</div>
<img class="esh-identity-image" src="assets/images/arrow-down.png">
</section>
<section class="esh-identity-drop"
*ngIf="authenticated">
<section class="esh-identity-drop" *ngIf="authenticated">
<div class="esh-identity-item"
[routerLink]="['orders']">
<div class="esh-identity-item" [routerLink]="['orders']">
<div class="esh-identity-name esh-identity-name--upper">My orders</div>
<img class="esh-identity-image" src="assets/images/my_orders.png">
</div>
<div class="esh-identity-item"
[routerLink]="['campaigns']">
<div class="esh-identity-item" [routerLink]="['campaigns']">
<div class="esh-identity-name esh-identity-name--upper">My campaigns</div>
<img class="esh-identity-image" src="assets/images/my_orders.png">
</div>
<div class="esh-identity-item"
(click)="logoutClicked($event)">
<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="assets/images/logout.png">

View File

@ -1,31 +1,24 @@
@import '../../../variables';
.esh-identity {
line-height: 2.1rem;
position: relative;
text-align: right;
&-section {
display: inline-block;
width: 100%;
}
&-name {
display: inline-block;
&--upper {
text-transform: uppercase;
}
@media screen and (max-width: $media-screen-s) {
font-size: $font-size-s;
}
}
&-image {
display: inline-block;
}
&-drop {
background: $color-background-brighter;
height: 0;
@ -37,17 +30,14 @@
top: 2.5rem;
transition: height $animation-speed-default;
}
&:hover &-drop {
border: $border-light solid $color-foreground-bright;
height: 7rem;
transition: height $animation-speed-default;
}
&-item {
cursor: pointer;
transition: color $animation-speed-default;
&:hover {
color: $color-secondary-dark;
transition: color $animation-speed-default;

View File

@ -50,4 +50,8 @@ export class Identity implements OnInit {
logout() {
this.service.Logoff();
}
getUserName() {
return this.userName;
}
}

View File

@ -2,11 +2,7 @@
<div class="container">
<article class="esh-pager-wrapper row">
<nav>
<span class="esh-pager-item esh-pager-item--navigable"
id="Previous"
[ngClass]="{'is-disabled': buttonStates?.previousDisabled}"
(click)="onPreviousCliked($event)"
aria-label="Previous">
<span class="esh-pager-item esh-pager-item--navigable" id="Previous" [ngClass]="{'is-disabled': buttonStates?.previousDisabled}" (click)="onPreviousCliked($event)" aria-label="Previous">
Previous
</span>
@ -14,11 +10,7 @@
Showing {{model?.items}} of {{model?.totalItems}} products - Page {{model?.actualPage + 1}} - {{model?.totalPages}}
</span>
<span class="esh-pager-item esh-pager-item--navigable"
id="Next"
[ngClass]="{'is-disabled': buttonStates?.nextDisabled}"
(click)="onNextClicked($event)"
aria-label="Next">
<span class="esh-pager-item esh-pager-item--navigable" id="Next" [ngClass]="{'is-disabled': buttonStates?.nextDisabled}" (click)="onNextClicked($event)" aria-label="Next">
Next
</span>
</nav>

View File

@ -1,34 +1,26 @@
@import '../../../variables';
.esh-pager {
&-wrapper {
padding-top: 1rem;
text-align: center;
}
&-item {
$margin: 5vw;
margin: 0 $margin;
&.is-disabled {
opacity: 0;
pointer-events: none;
}
&--navigable {
cursor: pointer;
display: inline-block;
&:hover {
color: $color-secondary;
}
}
@media screen and (max-width: $media-screen-l) {
font-size: $font-size-s;
}
@media screen and (max-width: $media-screen-m) {
margin: 0 $margin / 2;
}

View File

@ -1,4 +1,4 @@
import {ICampaignItem} from './campaignItem.model';
import { ICampaignItem } from './campaignItem.model';
export interface ICampaign {
data: ICampaignItem[];

View File

@ -1,4 +1,4 @@
import {ICatalogItem} from './catalogItem.model';
import { ICatalogItem } from './catalogItem.model';
export interface ICatalog {
pageIndex: number;

View File

@ -1,8 +1,8 @@
export interface IConfiguration {
catalogUrl: string,
orderingUrl: string,
identityUrl: string,
basketUrl: string,
marketingUrl: string,
activateCampaignDetailFunction: boolean
catalogUrl: string;
orderingUrl: string;
identityUrl: string;
basketUrl: string;
marketingUrl: string;
activateCampaignDetailFunction: boolean;
}

View File

@ -1,4 +1,4 @@
import {IOrderItem} from './orderItem.model';
import { IOrderItem } from './orderItem.model';
export interface IOrderDetail {
ordernumber: string;

View File

@ -1,4 +1,4 @@
import {IOrderItem} from './orderItem.model';
import { IOrderItem } from './orderItem.model';
export interface IOrder {
city: number;

View File

@ -25,7 +25,7 @@ export class SecurityService {
this.storage = _storageService;
this._configurationService.settingsLoaded$.subscribe(x => {
this.authorityUrl = this._configurationService.serverSettings.identityUrl
this.authorityUrl = this._configurationService.serverSettings.identityUrl;
this.storage.store('IdentityUrl', this.authorityUrl);
});
@ -205,7 +205,7 @@ export class SecurityService {
return data;
}
//private retrieve(key: string): any {
// private retrieve(key: string): any {
// let item = this.storage.getItem(key);
// if (item && item !== 'undefined') {
@ -213,11 +213,11 @@ export class SecurityService {
// }
// return;
//}
// }
//private store(key: string, value: any) {
// private store(key: string, value: any) {
// this.storage.setItem(key, JSON.stringify(value));
//}
// }
private getUserData = (): Observable<string[]> => {
this.setHeaders();

View File

@ -7,7 +7,7 @@ import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
// Services
import { DataService } from './services/data.service';
import { BasketWrapperService} from './services/basket.wrapper.service';
import { BasketWrapperService } from './services/basket.wrapper.service';
import { SecurityService } from './services/security.service';
import { ConfigurationService } from './services/configuration.service';
import { StorageService } from './services/storage.service';

View File

@ -17,7 +17,7 @@ declare var __karma__: any;
declare var require: any;
// Prevent Karma from running prematurely.
__karma__.loaded = function () {};
__karma__.loaded = function () { };
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(

View File

@ -1,20 +0,0 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"outDir": "../out-tsc/spec",
"module": "commonjs",
"target": "es5",
"baseUrl": "",
"types": [
"jasmine",
"node"
]
},
"files": [
"test.ts"
],
"include": [
"**/*.spec.ts",
"**/*.d.ts"
]
}

View File

@ -1,5 +0,0 @@
/* SystemJS module definition */
declare var module: NodeModule;
interface NodeModule {
id: string;
}

File diff suppressed because it is too large Load Diff

View File

@ -26,41 +26,42 @@
"lint:ts": "tslint -c tslint.json Client/**/*.ts"
},
"dependencies": {
"@angular/common": "^4.0.0",
"@angular/compiler": "^4.0.0",
"@angular/core": "^4.0.0",
"@angular/forms": "^4.0.0",
"@angular/http": "^4.0.0",
"@angular/platform-browser": "^4.0.0",
"@angular/platform-browser-dynamic": "^4.0.0",
"@angular/router": "^4.0.0",
"@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.22",
"bootstrap": "4.0.0-alpha.5",
"core-js": "^2.4.1",
"file-loader": "0.9.0",
"font-awesome": "4.6.3",
"@angular/common": "5.1.1",
"@angular/compiler": "5.1.1",
"@angular/core": "5.1.1",
"@angular/forms": "5.1.1",
"@angular/http": "5.1.1",
"@angular/platform-browser": "5.1.1",
"@angular/platform-browser-dynamic": "5.1.1",
"@angular/router": "5.1.1",
"@ng-bootstrap/ng-bootstrap": "1.0.0-beta.8",
"bootstrap": "4.0.0-beta.2",
"jquery": "3.2.1",
"popper.js": "1.12.9",
"core-js": "2.5.3",
"file-loader": "1.1.6",
"font-awesome": "4.7.0",
"isomorphic-fetch": "2.2.1",
"normalize.css": "5.0.0",
"normalize.css": "7.0.0",
"preboot": "4.5.2",
"rxjs": "^5.1.0",
"zone.js": "^0.8.4"
"rxjs": "5.5.5",
"zone.js": "^0.8.18"
},
"devDependencies": {
"@angular/cli": "^1.3.0",
"@angular/compiler-cli": "^4.0.0",
"@types/core-js": "0.9.34",
"@types/hammerjs": "2.0.33",
"@types/jasmine": "2.5.38",
"@types/node": "~6.0.60",
"@types/protractor": "1.5.20",
"@types/selenium-webdriver": "2.44.26",
"codelyzer": "~2.0.0",
"sass-lint": "1.10.2",
"ts-helpers": "1.1.1",
"ts-node": "~2.0.0",
"tslint": "~4.5.0",
"typedoc": "0.5.0",
"typescript": "~2.2.0",
"url-loader": "0.5.7"
"@angular/cli": "1.6.1",
"@angular/compiler-cli": "5.1.1",
"@types/core-js": "0.9.43",
"@types/hammerjs": "2.0.35",
"@types/jasmine": "2.8.2",
"@types/node": "8.5.1",
"@types/selenium-webdriver": "3.0.8",
"codelyzer": "4.0.2",
"sass-lint": "1.12.1",
"ts-helpers": "1.1.2",
"ts-node": "4.0.2",
"tslint": "5.8.0",
"typedoc": "0.9.0",
"typescript": "2.6.2",
"url-loader": "0.6.2"
}
}

View File

@ -1,14 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<!--
Configure your application settings in appsettings.json. Learn more at https://go.microsoft.com/fwlink/?LinkId=786380
-->
<!-- Configure your application settings in appsettings.json. Learn more at https://go.microsoft.com/fwlink/?LinkId=786380 -->
<system.webServer>
<handlers>
<add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModule" resourceType="Unspecified"/>
<add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModule" resourceType="Unspecified" />
</handlers>
<aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" forwardWindowsAuthToken="false"/>
<aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" forwardWindowsAuthToken="false" />
</system.webServer>
</configuration>