| № | 5 |Дата | 6 |Время | 7 |Сумма | 8 |9 | |
|---|---|---|---|---|
| {{order.order}} | 15 |{{getOrderDate(order)}} | 16 |{{getOrderTime(order)}} | 17 |{{calculatePrice(order)}} руб. | 18 |19 | 22 | | 23 |
2 |
12 |
13 | История заказов
3 | 11 |
16 |
34 |
36 |
37 |
38 |
17 |
33 |
19 |
20 |
28 |
29 |
31 |
32 | Заказов нет
35 |
2 |
46 |
47 |
--------------------------------------------------------------------------------
/client/src/app/login-page/login-page.component.ts:
--------------------------------------------------------------------------------
1 | import {Component, OnDestroy, OnInit} from '@angular/core'
2 | import {FormControl, FormGroup, Validators} from '@angular/forms'
3 | import {AuthService} from '../shared/services/auth.service'
4 | import {ActivatedRoute, Params, Router} from '@angular/router'
5 | import {MaterialService} from '../shared/classes/material.service'
6 | import {Subscription} from 'rxjs/Subscription'
7 |
8 | @Component({
9 | selector: 'app-login-page',
10 | templateUrl: './login-page.component.html',
11 | styleUrls: ['./login-page.component.css']
12 | })
13 | export class LoginPageComponent implements OnInit, OnDestroy {
14 | form: FormGroup
15 |
16 | aSub: Subscription
17 |
18 | constructor(private auth: AuthService,
19 | private route: ActivatedRoute,
20 | private router: Router) {
21 | }
22 |
23 | ngOnInit() {
24 | this.form = new FormGroup({
25 | email: new FormControl(null, [Validators.required, Validators.email]),
26 | password: new FormControl(null, [Validators.required, Validators.minLength(6)]),
27 | })
28 |
29 | this.route.queryParams.subscribe((params: Params) => {
30 | if (params['registered']) {
31 | MaterialService.toast('Теперь вы можете зайти использую свои данные')
32 | } else if (params['accessDenied']) {
33 | MaterialService.toast('Для начала авторизуйтесь')
34 | }
35 | })
36 | }
37 |
38 | ngOnDestroy() {
39 | if (this.aSub) {
40 | this.aSub.unsubscribe()
41 | }
42 | }
43 |
44 | onSubmit() {
45 | this.form.disable()
46 | this.aSub = this.auth.login(this.form.value).subscribe(
47 | () => this.router.navigate(['/overview']),
48 | error => {
49 | MaterialService.toast(error.error.message)
50 | this.form.enable()
51 | }
52 | )
53 | }
54 | }
55 |
--------------------------------------------------------------------------------
/client/src/app/new-order-page/new-order-page.component.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/vladilenm/fullstack/72465941d15015d873fab7eaf595e9f3135c264f/client/src/app/new-order-page/new-order-page.component.css
--------------------------------------------------------------------------------
/client/src/app/new-order-page/new-order-page.component.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
14 |
15 | Заказ
4 |5 | Заказ 6 | keyboard_arrow_right 7 | Добавить продукцию 8 |
9 | 10 | 13 |
2 |
20 |
22 |
23 |
24 |
3 |
19 |
8 |
18 |
9 | ![]()
13 |
14 |
15 |
17 | {{category.name}}
16 |Категорий пока нет
21 |
2 |
3 |
4 |
32 |
33 |
34 |
36 |
37 |
38 | | Название | 6 |Стоимость | 7 |Количество | 8 |9 | |
|---|---|---|---|
| {{item.name}} | 15 |{{item.cost}} руб. | 16 |
17 |
18 |
19 |
20 | |
21 | 22 | 28 | | 29 |
Позиций пока нет
35 |
2 |
10 |
11 | 3 | Обзор за вчера ({{date}}) 4 | info_outline 8 |
9 |
12 |
64 |
65 |
13 |
37 |
38 |
14 |
36 |
15 | Выручка:
16 |
35 | {{data.gain.yesterday}} руб.
17 |24 | 25 | {{data.gain.isHigher ? 'arrow_upward': 'arrow_downward'}} 26 | 27 | {{data.gain.percent}}% 28 |
29 |30 | Выручка вашего бизнеса вчера на 31 | {{data.gain.percent}}% {{data.gain.isHigher ? 'выше' : 'ниже'}} 32 | среднего: {{data.gain.compare}} руб. в день 33 |
34 |
39 |
63 |
40 |
62 |
41 | Заказы:
42 |
61 | {{data.orders.yesterday}} зак.
43 |50 | 51 | {{data.orders.isHigher ? 'arrow_upward': 'arrow_downward'}} 52 | 53 | {{data.orders.percent}}% 54 |
55 |56 | Число заказов вчера на 57 | {{data.orders.percent}}% {{data.orders.isHigher ? 'выше' : 'ниже'}} 58 | среднего значения: {{data.orders.compare}} зак. в день 59 |
60 |
71 |
76 |
--------------------------------------------------------------------------------
/client/src/app/overview-page/overview-page.component.ts:
--------------------------------------------------------------------------------
1 | import {AfterViewInit, Component, ElementRef, OnDestroy, OnInit, ViewChild} from '@angular/core'
2 | import {MaterialService, IMaterialInstance} from '../shared/classes/material.service'
3 | import * as moment from 'moment'
4 | import {AnalyticsService} from '../shared/services/analytics.service'
5 | import {Observable} from 'rxjs/Observable'
6 | import {Overview} from '../shared/interfaces'
7 |
8 | @Component({
9 | selector: 'app-overview-page',
10 | templateUrl: './overview-page.component.html',
11 | styleUrls: ['./overview-page.component.css']
12 | })
13 | export class OverviewPageComponent implements OnInit, AfterViewInit, OnDestroy {
14 | date: string
15 | tapTarget: IMaterialInstance
16 |
17 | @ViewChild('tapTarget') tapTargetEl: ElementRef
18 |
19 | data$: Observable
72 |
75 | Зачем нужна эта страница?
73 |Страница “Обзор” покажет динамику продаж за предыдущий день. Сравнение со средним значениями поможет вам понять, как идут дела у Вашего бизнеса.
74 |
2 |
38 |
39 |
94 |
95 |
--------------------------------------------------------------------------------
/client/src/app/products-page/product-form-page/positions-form/positions-form.component.ts:
--------------------------------------------------------------------------------
1 | import {AfterViewInit, Component, ElementRef, Input, OnDestroy, OnInit, ViewChild} from '@angular/core'
2 | import {PositionsService} from '../../../shared/services/positions.service'
3 | import {Position} from '../../../shared/interfaces'
4 | import {IMaterialInstance, MaterialService} from '../../../shared/classes/material.service'
5 | import {FormControl, FormGroup, Validators} from '@angular/forms'
6 | import {Subscription} from 'rxjs/Subscription'
7 |
8 | @Component({
9 | selector: 'app-positions-form',
10 | templateUrl: './positions-form.component.html',
11 | styleUrls: ['./positions-form.component.css']
12 | })
13 | export class PositionsFormComponent implements OnInit, AfterViewInit, OnDestroy {
14 | @ViewChild('modal') modalRef: ElementRef
15 | @Input() categoryId: string
16 |
17 | pSub: Subscription
18 |
19 | modal: IMaterialInstance = null
20 | form: FormGroup
21 |
22 | positions: Position[]
23 | positionId: string = null
24 | loading = true
25 |
26 | constructor(private positionsService: PositionsService) {
27 | }
28 |
29 | ngOnInit() {
30 | this.pSub = this.positionsService.fetch(this.categoryId).subscribe(positions => {
31 | this.positions = positions
32 | this.loading = false
33 | })
34 |
35 | this.form = new FormGroup({
36 | name: new FormControl(null, Validators.required),
37 | cost: new FormControl(null, [Validators.required, Validators.min(1)])
38 | })
39 | }
40 |
41 | ngOnDestroy() {
42 | if (this.pSub) {
43 | this.pSub.unsubscribe()
44 | }
45 | this.modal.destroy()
46 | }
47 |
48 | ngAfterViewInit() {
49 | this.modal = MaterialService.initModal(this.modalRef)
50 | }
51 |
52 | onSelectPosition(position: Position) {
53 | this.positionId = position._id
54 | this.form.patchValue({
55 | name: position.name,
56 | cost: position.cost
57 | })
58 | this.modal.open()
59 | MaterialService.updateTextInput()
60 | }
61 |
62 | addPosition() {
63 | this.positionId = null
64 | this.form.patchValue({
65 | name: null,
66 | cost: null
67 | })
68 | this.modal.open()
69 | MaterialService.updateTextInput()
70 | }
71 |
72 | removePosition(event, position: Position) {
73 | event.stopPropagation()
74 | const decision = window.confirm('Вы уверены, что хотите удалить позицию?')
75 | if (decision) {
76 | this.positionsService.remove(position._id).subscribe(
77 | response => {
78 | const idx = this.positions.findIndex(p => p._id !== position._id)
79 | this.positions.splice(idx, 1)
80 | MaterialService.toast(response.message)
81 | },
82 | error => MaterialService.toast(error.error.message)
83 | )
84 | }
85 | }
86 |
87 | onCancel() {
88 | this.modal.close()
89 | this.form.reset({name: '', cost: 0})
90 | }
91 |
92 | onSubmit() {
93 | this.form.disable()
94 |
95 | const position: Position = {
96 | name: this.form.value.name,
97 | cost: this.form.value.cost,
98 | category: this.categoryId
99 | }
100 |
101 | if (this.positionId) {
102 | position._id = this.positionId
103 | this.positionsService.update(position).subscribe(
104 | pos => {
105 | const idx = this.positions.findIndex(p => p._id === pos._id)
106 | this.positions[idx] = pos
107 | MaterialService.toast('Изменения сохранены')
108 | },
109 | error => {
110 | this.form.enable()
111 | MaterialService.toast(error.error.message)
112 | },
113 | () => {
114 | this.modal.close()
115 | this.form.reset({name: '', cost: 0})
116 | this.form.enable()
117 | }
118 | )
119 | } else {
120 | this.positionsService.create(position).subscribe(
121 | pos => {
122 | this.positions.push(pos)
123 | MaterialService.toast('Изменения сохранены')
124 | },
125 | error => {
126 | this.form.enable()
127 | MaterialService.toast(error.error.message)
128 | },
129 | () => {
130 | this.modal.close()
131 | this.form.reset({name: '', cost: 0})
132 | this.form.enable()
133 | }
134 | )
135 | }
136 | }
137 |
138 | }
139 |
--------------------------------------------------------------------------------
/client/src/app/products-page/product-form-page/product-form-page.component.css:
--------------------------------------------------------------------------------
1 | .h200 {
2 | height: 200px;
3 | }
4 |
5 | .dn {
6 | display: none;
7 | }
8 |
--------------------------------------------------------------------------------
/client/src/app/products-page/product-form-page/product-form-page.component.html:
--------------------------------------------------------------------------------
1 |
3 |
34 |
36 |
37 |
4 |
12 |
13 | Позиции:
5 | 11 |
14 |
28 |
29 |
31 |
32 |
33 | Позиций пока нет
30 |
2 |
17 |
18 | 3 | Категории 4 | keyboard_arrow_right 5 | {{isNew ? 'Добавить' : 'Редактировать'}} 6 |
7 | 8 | 15 | 16 |
19 |
66 |
67 |
75 |
76 |
68 | ![]()
73 |
74 |
2 |
8 |
9 | Категории
3 | 7 |
10 |
27 |
28 |
11 |
21 |
25 |
26 |
12 |
17 | {{category.name}}
18 |
19 |
20 |
22 | У вас нет ни одной категории
23 |
24 |
2 |
55 |
56 |
--------------------------------------------------------------------------------
/client/src/app/registration-page/registration-page.component.ts:
--------------------------------------------------------------------------------
1 | import {Component, OnDestroy, OnInit} from '@angular/core'
2 | import {FormControl, FormGroup, Validators} from '@angular/forms'
3 | import {AuthService} from '../shared/services/auth.service'
4 | import {Router} from '@angular/router'
5 | import {MaterialService} from '../shared/classes/material.service'
6 | import {Subscription} from 'rxjs/Subscription'
7 |
8 | @Component({
9 | selector: 'app-registration-page',
10 | templateUrl: './registration-page.component.html',
11 | styleUrls: ['./registration-page.component.css']
12 | })
13 | export class RegistrationPageComponent implements OnInit, OnDestroy {
14 | form: FormGroup
15 | aSub: Subscription
16 |
17 | constructor(private auth: AuthService, private router: Router) {
18 | }
19 |
20 | ngOnInit() {
21 | this.form = new FormGroup({
22 | email: new FormControl(null, [Validators.required, Validators.email]),
23 | password: new FormControl(null, [Validators.required, Validators.minLength(6)]),
24 | })
25 | }
26 |
27 | ngOnDestroy() {
28 | if (this.aSub) {
29 | this.aSub.unsubscribe()
30 | }
31 | }
32 |
33 | onSubmit() {
34 | this.form.disable()
35 | this.aSub = this.auth.register(this.form.value).subscribe(
36 | response => {
37 | this.router.navigate(['/login'], {
38 | queryParams: {
39 | 'registered': true
40 | }
41 | })
42 | },
43 | error => {
44 | MaterialService.toast(error.error.message)
45 | this.form.enable()
46 | }
47 | )
48 | }
49 | }
50 |
--------------------------------------------------------------------------------
/client/src/app/shared/classes/auth.guard.ts:
--------------------------------------------------------------------------------
1 | import {ActivatedRouteSnapshot, CanActivate, CanActivateChild, Router, RouterStateSnapshot} from '@angular/router'
2 | import {Injectable} from '@angular/core'
3 | import {Observable} from 'rxjs/Observable'
4 | import {AuthService} from '../services/auth.service'
5 | import {of} from 'rxjs/observable/of'
6 |
7 | @Injectable()
8 | export class AuthGuard implements CanActivate, CanActivateChild {
9 | constructor(private auth: AuthService, private router: Router) {
10 | }
11 |
12 | canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable
2 |
18 |
--------------------------------------------------------------------------------
/client/src/app/shared/components/loader/loader.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 |
3 | @Component({
4 | selector: 'app-loader',
5 | templateUrl: './loader.component.html',
6 | styleUrls: ['./loader.component.css']
7 | })
8 | export class LoaderComponent implements OnInit {
9 |
10 | constructor() { }
11 |
12 | ngOnInit() {
13 | }
14 |
15 | }
16 |
--------------------------------------------------------------------------------
/client/src/app/shared/interfaces.ts:
--------------------------------------------------------------------------------
1 | export interface User {
2 | _id?: string
3 | password: string
4 | email: string
5 | }
6 |
7 | export interface Category {
8 | _id?: string
9 | imageSrc?: string
10 | name: string
11 | user?: string
12 | }
13 |
14 | export interface Position {
15 | _id?: string
16 | cost: number
17 | name: string
18 | category: string
19 | user?: string
20 | }
21 |
22 | export interface Message {
23 | message: string
24 | }
25 |
26 | export interface Order {
27 | _id?: string
28 | date?: Date
29 | order?: number
30 | user?: string
31 | list: OrderListItem[]
32 | }
33 |
34 | export interface OrderListItem {
35 | _id?: string
36 | name: string
37 | quantity: number
38 | cost: number
39 | }
40 |
41 | export interface Overview {
42 | gain: OverviewItem
43 | orders: OverviewItem
44 | }
45 |
46 | export interface Analytics {
47 | chart: AnalyticsChart[]
48 | average: number
49 | }
50 |
51 | export interface AnalyticsChart {
52 | gain: number
53 | order: number
54 | label: string
55 | }
56 |
57 | export interface OverviewItem {
58 | percent: number
59 | compare: number
60 | yesterday: number
61 | isHigher: boolean
62 | }
63 |
--------------------------------------------------------------------------------
/client/src/app/shared/layouts/empty-layout/empty-layout.component.css:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/vladilenm/fullstack/72465941d15015d873fab7eaf595e9f3135c264f/client/src/app/shared/layouts/empty-layout/empty-layout.component.css
--------------------------------------------------------------------------------
/client/src/app/shared/layouts/empty-layout/empty-layout.component.html:
--------------------------------------------------------------------------------
1 |
10 |
11 |
3 |
17 |
4 |
16 |
5 |
15 |
6 |
7 |
8 |
9 |
10 |
11 |
12 |
13 |
14 | -
2 |
- 5 | {{link.name}} 6 | 7 |
- 8 | Выйти 9 | 10 |
Newborn POS
3 | 4 |
18 |
19 | add
20 |
21 |
26 |
27 |
28 |
29 | info
30 |
31 |
--------------------------------------------------------------------------------
/client/src/app/shared/layouts/site-layout/site-layout.component.ts:
--------------------------------------------------------------------------------
1 | import {AfterViewInit, Component, ElementRef, ViewChild, ViewEncapsulation} from '@angular/core'
2 | import {AuthService} from '../../services/auth.service'
3 | import {Router} from '@angular/router'
4 | import {MaterialService} from '../../classes/material.service'
5 |
6 | @Component({
7 | selector: 'app-site-layout',
8 | templateUrl: './site-layout.component.html',
9 | styleUrls: ['./site-layout.component.css'],
10 | encapsulation: ViewEncapsulation.None
11 | })
12 | export class SiteLayoutComponent implements AfterViewInit {
13 |
14 | @ViewChild('actionBtn') actionBtnEl: ElementRef
15 |
16 | links = [
17 | {url: '/overview', name: 'Обзор'},
18 | {url: '/analytics', name: 'Аналитика'},
19 | {url: '/history', name: 'История'},
20 | {url: '/order', name: 'Новый заказ'},
21 | {url: '/categories', name: 'Ассортимент'}
22 | ]
23 |
24 | constructor(private auth: AuthService, private router: Router) {
25 | }
26 |
27 | logout(event) {
28 | event.preventDefault()
29 | this.auth.logout()
30 | this.router.navigate(['/login'])
31 | }
32 |
33 | ngAfterViewInit() {
34 | MaterialService.initializeFloatingButton(this.actionBtnEl)
35 | }
36 | }
37 |
--------------------------------------------------------------------------------
/client/src/app/shared/services/analytics.service.ts:
--------------------------------------------------------------------------------
1 | import {Injectable} from '@angular/core'
2 | import {HttpClient} from '@angular/common/http'
3 | import {Observable} from 'rxjs/Observable'
4 | import {Analytics, Overview} from '../interfaces'
5 |
6 | @Injectable()
7 | export class AnalyticsService {
8 | constructor(private http: HttpClient) {}
9 |
10 | fetchOverview(): Observable-
22 |
- assignment 23 |
- list 24 |