From 266601e59bef6572772954b858e92351a5d7f634 Mon Sep 17 00:00:00 2001 From: gofnnp Date: Tue, 8 Nov 2022 10:33:31 +0400 Subject: [PATCH] =?UTF-8?q?dev=20#12926=20=D0=B4=D0=BE=D1=80=D0=B0=D0=B1?= =?UTF-8?q?=D0=BE=D1=82=D0=B0=D0=BB=20=D0=BA=D0=B0=D1=82=D0=B0=D0=BB=D0=BE?= =?UTF-8?q?=D0=B3=20=D1=82=D0=BE=D0=B2=D0=B0=D1=80=D0=BE=D0=B2,=20=D0=B4?= =?UTF-8?q?=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20=D1=80=D0=B0=D0=B1=D0=BE?= =?UTF-8?q?=D1=82=D1=83=20=D1=81=20=D1=82=D0=B5=D1=80=D0=BC=D0=B8=D0=BD?= =?UTF-8?q?=D0=B0=D0=BB=D0=B0=D0=BC=D0=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/products/products.component.html | 33 ++++- .../pages/products/products.component.scss | 22 +++- .../app/pages/products/products.component.ts | 120 ++++++++++++++++-- angular/src/styles.scss | 49 +++++++ 4 files changed, 205 insertions(+), 19 deletions(-) diff --git a/angular/src/app/pages/products/products.component.html b/angular/src/app/pages/products/products.component.html index 3d92d4d..4683a93 100644 --- a/angular/src/app/pages/products/products.component.html +++ b/angular/src/app/pages/products/products.component.html @@ -1,7 +1,13 @@ +
- - + + + +
@@ -14,4 +20,25 @@
-
+ + +
+
+ +

{{message.summary}}

+

{{message.detail}}

+
+
+
+ +
+
+ +
+
+
+ + + \ No newline at end of file diff --git a/angular/src/app/pages/products/products.component.scss b/angular/src/app/pages/products/products.component.scss index 83aa922..c2f72e8 100644 --- a/angular/src/app/pages/products/products.component.scss +++ b/angular/src/app/pages/products/products.component.scss @@ -12,7 +12,12 @@ display: flex; flex-wrap: nowrap; justify-content: space-between; - flex-direction: row; + flex-direction: column; + + label { + margin: 8px; + font-size: 14px; + } } &__items { @@ -66,4 +71,17 @@ bottom: 0; } } -} \ No newline at end of file +} + +// :host ::ng-deep { +// .p-toast-message-custom { +// background-color: #E1CFE7; +// border: solid #8A427A; +// border-width: 0 0 0 6px; +// color: #2c1e30; + +// .p-toast-icon-close { +// color: #2c1e30; +// } +// } +// } \ No newline at end of file diff --git a/angular/src/app/pages/products/products.component.ts b/angular/src/app/pages/products/products.component.ts index bdb6934..2a86031 100644 --- a/angular/src/app/pages/products/products.component.ts +++ b/angular/src/app/pages/products/products.component.ts @@ -4,45 +4,100 @@ import { v4 as uuidv4 } from 'uuid'; import { DialogService } from 'primeng/dynamicdialog'; import { ProductModalComponent } from 'src/app/components/product-modal/product-modal.component'; import { WpJsonService } from 'src/app/services/wp-json.service'; +import { MessageService } from 'primeng/api'; +import { lastValueFrom } from 'rxjs'; +import { CartService } from 'src/app/services/cart.service'; +import { CookiesService } from 'src/app/services/cookies.service'; @Component({ selector: 'app-products', templateUrl: './products.component.html', - styleUrls: ['./products.component.scss'] + styleUrls: ['./products.component.scss'], + providers: [MessageService] }) export class ProductsComponent implements OnInit { public products!: Product[]; - public groups: Group[] = [ - { - id: uuidv4(), - label: 'Все' - } - ]; + public groups: Group[] = []; public modifiersGroups!: ModifiersGroup[]; public modifiers!: Modifier[]; - public selectedGroup: Group = this.groups[0]; + public selectedGroup!: Group; + public terminalList!: any; + public selectedTerminal!: any; constructor( public dialogService: DialogService, - private wpJsonService: WpJsonService + private wpJsonService: WpJsonService, + private messageService: MessageService, + public cartService: CartService, + private cookiesService: CookiesService, ) { } - ngOnInit(): void { + async ngOnInit() { + await this.getTerminalList() this.getData() + this.messageService.add({ + severity:'info', + summary: 'В одном заказе могут быть товары только из выбранного пункта выдачи', + life: 5000 + }); + setTimeout(() => { + this.confirmTerminalList() + }, 0) + } + + async getTerminalList() { + const terminalList = (await lastValueFrom( + this.wpJsonService.getTerminalList() + )) + this.terminalList = this.toTreeJson(this.keyValue(terminalList), terminalList) + this.selectedTerminal = JSON.parse(this.cookiesService.getItem('selectedTerminal') || 'null') || this.terminalList[0] + this.cartService.changeTerminal(this.selectedTerminal) + } + + confirmTerminalList() { + if (this.cartService.cartCount) return + this.messageService.clear(); + this.messageService.add({ key: 'c', sticky: true, severity: 'warn', summary: 'Вам подходит пункт выдачи?', detail: this.selectedTerminal.label }); + } + + onConfirm() { + this.messageService.add({ + severity:'info', + summary: 'В одном заказе могут быть товары только из выбранного пункта выдачи', + life: 5000 + }); + this.messageService.clear('c'); + } + + onReject() { + this.messageService.clear('c'); + this.messageService.add({ + severity:'info', + summary: 'Выберите пункт выдачи. В одном заказе могут быть товары только из выбранного пункта.', + life: 6000 + }); } getData() { - this.wpJsonService.getAllData().subscribe({ + this.wpJsonService.getAllData(`${this.selectedTerminal.label}${this.selectedTerminal.id}`).subscribe({ next: (value) => { this.products = value.products - this.groups = [...this.groups, ...value.groups] + this.groups = value.groups + this.groups.unshift( + { + id: uuidv4(), + label: 'Все' + } + ) + this.selectedGroup = this.groups[0] this.modifiersGroups = value.modifiers_groups this.modifiers = value.modifiers - } + } }) } - filterByGroup() { + filterByGroup() { + if (!this.selectedGroup) return [] if (this.selectedGroup.label === 'Все') return this.products return this.products.filter((product) => product.groupId === this.selectedGroup.id) } @@ -77,4 +132,41 @@ export class ProductsComponent implements OnInit { } + changeTerminal() { + setTimeout(() => { + this.getData() + this.cartService.changeTerminal(this.selectedTerminal) + }, 0); + } + + onGroupUnselect(event: any) { + setTimeout(() => { + this.selectedGroup = event.node + }, 0); + } + + onTerminalUnselect(event: any) { + setTimeout(() => { + this.selectedTerminal = event.node + this.cartService.changeTerminal(this.selectedTerminal) + }, 0); + } + + keyValue(obj: Object) { + return Object.keys(obj) + } + + toTreeJson(array: Array, terminalList: any) { + let treeJson: Object[] = [] + for (const key of array) { + treeJson.push( + { + label: key, + id: terminalList[key] + } + ) + } + return treeJson + } + } diff --git a/angular/src/styles.scss b/angular/src/styles.scss index 32163cf..f08a98f 100644 --- a/angular/src/styles.scss +++ b/angular/src/styles.scss @@ -100,3 +100,52 @@ input::-webkit-date-and-time-value { .p-tree .p-tree-container .p-treenode .p-treenode-content { padding: 0; } + +.text-center { + text-align: center; +} + +.grid.p-fluid { + display: flex; + justify-content: space-between; +} + +.grid.p-fluid { + .col-6 { + flex: 0 0 auto; + padding: 0.5rem; + width: 50%; + } + + button { + margin: 0; + cursor: pointer; + -webkit-user-select: none; + user-select: none; + align-items: center; + vertical-align: bottom; + text-align: center; + overflow: hidden; + position: relative; + border-radius: 5px; + border: none; + padding: 8px 0; + color: #fff; + font-weight: 600; + + &.p-button-success { + background: #22C55E; + } + + &.p-button-secondary { + background: #64748B; + } + } +} + +@media screen and (max-width: 960px) { + .grid.p-fluid button { + width: 100%; + margin-bottom: .5rem; + } +} \ No newline at end of file