From af33ed31c76e2208bbc272763d6fe8daf021a4d3 Mon Sep 17 00:00:00 2001 From: Kataev Denis Date: Tue, 13 Sep 2022 13:11:41 +0400 Subject: [PATCH] =?UTF-8?q?dev=20#12401=20=D0=BF=D1=80=D0=B0=D0=B2=D0=BA?= =?UTF-8?q?=D0=B8=20=D0=B8=20=D0=B4=D0=BE=D1=80=D0=B0=D0=B1=D0=BE=D1=82?= =?UTF-8?q?=D0=BA=D0=B8=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86=D1=8B?= =?UTF-8?q?=20'=D0=B7=D0=B0=D0=BF=D0=BE=D0=BB=D0=BD=D0=B8=D1=82=D1=8C=20?= =?UTF-8?q?=D0=B0=D0=BD=D0=BA=D0=B5=D1=82=D1=83'?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../bonus-program.component.scss | 12 +- .../bonus-program/bonus-program.component.ts | 1 - .../user-data/user-data.component.html | 120 +++++++++++++----- .../user-data/user-data.component.scss | 60 ++++++++- .../account/user-data/user-data.component.ts | 55 +++++++- src/index.html | 4 +- src/manifest.webmanifest | 4 +- 7 files changed, 200 insertions(+), 56 deletions(-) diff --git a/src/app/pages/account/bonus-program/bonus-program.component.scss b/src/app/pages/account/bonus-program/bonus-program.component.scss index ba529eb..07af801 100644 --- a/src/app/pages/account/bonus-program/bonus-program.component.scss +++ b/src/app/pages/account/bonus-program/bonus-program.component.scss @@ -51,7 +51,7 @@ &__decorative-pattern { height: 122px; - background-color: #B8DEFF; + background-color: #fff; // padding-top: 9px; display: flex; justify-content: center; @@ -61,7 +61,7 @@ } // .imgs-row { - // background: url("../../../../assets/card-decorative-pattern.png") repeat-x; + // background: url("./assets/card-decorative-pattern.png") repeat-x; // height: 32%; // } } @@ -135,10 +135,10 @@ background-size: cover; } - &__front { - transform: rotateY(0deg); - background-image: url(../../../../assets/background.svg); - } + // &__front { + // transform: rotateY(0deg); + // background-image: url(./assets/background.svg); + // } &__back { position: absolute; diff --git a/src/app/pages/account/bonus-program/bonus-program.component.ts b/src/app/pages/account/bonus-program/bonus-program.component.ts index 968c89e..db33302 100644 --- a/src/app/pages/account/bonus-program/bonus-program.component.ts +++ b/src/app/pages/account/bonus-program/bonus-program.component.ts @@ -49,7 +49,6 @@ export class BonusProgramComponent implements OnInit { .options({font: "OCR-B"}) // Will affect all barcodes .EAN13(`${this.accountData.CardNumber}`.padStart(12, "0"), {fontSize: 18, textMargin: 0}) .render(); - console.log(this.accountData) this.loadingBonuses = false; const transactions: Transaction[] = (await lastValueFrom( this.jsonrpc.rpc( diff --git a/src/app/pages/account/user-data/user-data.component.html b/src/app/pages/account/user-data/user-data.component.html index 6fae399..2e74ecb 100644 --- a/src/app/pages/account/user-data/user-data.component.html +++ b/src/app/pages/account/user-data/user-data.component.html @@ -1,33 +1,87 @@ -
-

Личные данные

-

- - -

-

- -

-

- -

-

- -

- Нажимая кнопку, Вы соглашаетесь с Политикой - обработки персональных данных. -
- - -
-
\ No newline at end of file +
+

Личные данные

+

+ + +

+

+ + +

+

+ + + +

+

+ +

+ Нажимая кнопку, Вы соглашаетесь с Политикой обработки персональных + данных. +
+ + +
+
diff --git a/src/app/pages/account/user-data/user-data.component.scss b/src/app/pages/account/user-data/user-data.component.scss index de0197e..88bfc61 100644 --- a/src/app/pages/account/user-data/user-data.component.scss +++ b/src/app/pages/account/user-data/user-data.component.scss @@ -83,14 +83,22 @@ "Segoe UI Symbol"; font-size: 1rem; color: #495057; - background: #ffffff; padding: 0.5rem 0.75rem; - border: 1px solid #ced4da; transition: background-color 0.15s, border-color 0.15s, box-shadow 0.15s; -webkit-appearance: none; appearance: none; border-radius: 4px; width: 100%; + height: 45px; + background: #FFFFFF; + border: 1px solid #B8DEFF; + border-radius: 15px; + &.ng-dirty.ng-invalid { + border-color: red; + } + &.ng-invalid.ng-touched { + border-color: red; + } } select { @@ -101,13 +109,23 @@ height: 45px; padding: 0 10px; - option[value=""][disabled] { - display: none; + // option[value=""][disabled] { + // display: none; + // } + &.ng-dirty.ng-invalid { + border-color: red; + } + &.ng-invalid.ng-touched { + border-color: red; + } + &::before { + content: 'jgbfgb'; + color: red; } } select:required:invalid { - color: #7D7D7D; + color: #6c757d; } } @@ -124,8 +142,38 @@ .decoration-pattern { margin-top: 12px; display: flex; - align-items: end; + align-items: flex-end; margin-left: 0; width: 92%; } + + input[type="date"]::before { + content: attr(placeholder); + width: 100%; + color: #6c757d; + } + + input[type="date"]:focus::before, + input[type="date"].ng-valid::before { + display: none; + } + + .select-wrapper { + position: relative; + &::before { + content: 'Выберете пол'; + top: 0; + position: absolute; + left: 12px; + } + &.hidden::before { + display: none; + } + } + + /* hide our custom/fake placeholder text when in focus to show the default + * 'mm/dd/yyyy' value and when valid to show the users' date of birth value. + */ + // input[type="date"]:focus::before, + // input[type="date"]:valid::before { display: none } } \ No newline at end of file diff --git a/src/app/pages/account/user-data/user-data.component.ts b/src/app/pages/account/user-data/user-data.component.ts index 3ff1c7c..dfb3c7d 100644 --- a/src/app/pages/account/user-data/user-data.component.ts +++ b/src/app/pages/account/user-data/user-data.component.ts @@ -1,6 +1,8 @@ import { Component, OnInit } from '@angular/core'; import { FormControl, FormGroup, Validators } from '@angular/forms'; +import { MessageService } from 'primeng/api'; import { UserDataForm } from 'src/app/interface/data'; +import { JsonrpcService, RpcService } from 'src/app/services/jsonrpc.service'; @Component({ selector: 'app-user-data', @@ -10,25 +12,66 @@ import { UserDataForm } from 'src/app/interface/data'; export class UserDataComponent implements OnInit { public userDataFormGroup!: FormGroup; public userData: UserDataForm = { - name: '', + first_name: '', birthdate: '', gender: '', } - constructor() { } + constructor( + private jsonRpcService: JsonrpcService, + private messageService: MessageService, + ) { } ngOnInit(): void { + this.createUserDataForm({...this.userData}) + this.jsonRpcService.rpc({ + method: 'getAdditionalInfo', + params: [] + }, RpcService.authService, true).subscribe({ + next: (res) => { + const { first_name, birthdate, gender } = res.data + this.userData = { first_name, birthdate, gender } + this.createUserDataForm({...this.userData}) + }, + error: (err) => { + console.error('Error: ', err) + } + }); + + } + + createUserDataForm(val: UserDataForm) { this.userDataFormGroup = new FormGroup({ - name: new FormControl('', [Validators.required, Validators.minLength(2)]), - birthdate: new FormControl('', [Validators.required]), - gender: new FormControl('', [Validators.required]), + first_name: new FormControl(val.first_name, [Validators.required, Validators.minLength(2)]), + birthdate: new FormControl(val.birthdate, [Validators.required]), + gender: new FormControl(val.gender ? val.gender : '', [Validators.required]), }) } saveData() { + if (this.userDataFormGroup.invalid) { + this.markFormGroupTouched(this.userDataFormGroup) + return + } this.userData = this.userDataFormGroup.value as UserDataForm - console.log('####: ', this.userData) + this.jsonRpcService.rpc({ + method: 'updateAdditionalInfo', + params: [this.userData] + }, RpcService.authService, true).subscribe({ + next: () => { + this.messageService.add({severity:'custom', summary:'Данные успешно обновлены!'}); + }, + error: (err) => { + console.error('Error: ', err) + this.messageService.add({severity:'error', summary:'Произошла ошибка, попробуйте позже'}); + } + }) } + markFormGroupTouched(formGroup: FormGroup) { + (Object).values(formGroup.controls).forEach((control: FormControl) => { + control.markAsDirty(); + }); + } } diff --git a/src/index.html b/src/index.html index 7faa450..b698187 100644 --- a/src/index.html +++ b/src/index.html @@ -1,8 +1,8 @@ - + - CardProject + Fashion logica diff --git a/src/manifest.webmanifest b/src/manifest.webmanifest index cc41419..129d131 100644 --- a/src/manifest.webmanifest +++ b/src/manifest.webmanifest @@ -1,6 +1,6 @@ { - "name": "card-project", - "short_name": "card-project", + "name": "fashion-logica", + "short_name": "fashion-logica", "theme_color": "#1976d2", "background_color": "#fafafa", "display": "standalone",