gofnnp/h-usersite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dev #12926

Browse Source 
Доработки по списку товаров, доработки по дизайну
This commit is contained in:
gofnnp 2022-12-05 08:30:16 +04:00
parent 3120528bb2
commit 63fac5b48d
19 changed files with 342 additions and 186 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
angular/angular.json
View File

@ -34,6 +34,7 @@
"src/firebase-messaging-sw.js"
],
"styles": [
"node_modules/mdb-angular-ui-kit/assets/scss/mdb.scss",
"node_modules/primeng/resources/themes/saga-blue/theme.css",
"node_modules/primeicons/primeicons.css",
"node_modules/primeng/resources/primeng.min.css",

112
angular/package-lock.json generated
View File

@ -1,12 +1,12 @@
{
"name": "sakura",
"version": "0.0.2",
"version": "0.0.1",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "sakura",
"version": "0.0.2",
"version": "0.0.1",
"dependencies": {
"@angular/animations": "^14.0.0",
"@angular/cdk": "^14.2.1",
@ -15,14 +15,18 @@
"@angular/core": "^14.0.0",
"@angular/fire": "^7.4.1",
"@angular/forms": "^14.0.0",
"@angular/material": "^14.2.1",
"@angular/platform-browser": "^14.0.0",
"@angular/platform-browser-dynamic": "^14.0.0",
"@angular/router": "^14.0.0",
"@angular/service-worker": "^14.0.0",
"@fortawesome/angular-fontawesome": "^0.11.1",
"@fortawesome/fontawesome-free": "^6.0.0",
"@fortawesome/fontawesome-svg-core": "^6.2.0",
"@fortawesome/free-brands-svg-icons": "^6.2.0",
"@fortawesome/free-solid-svg-icons": "^6.2.0",
"@ngrx/effects": "^14.3.2",
"@ngrx/store": "^14.3.2",
"@types/uuid": "^8.3.4",
"angular-moment-timezone": "^1.7.1",
"angularx-qrcode": "^14.0.0",
@ -30,6 +34,7 @@
"firebase": "^9.9.3",
"google-libphonenumber": "^3.2.30",
"jsbarcode": "^3.11.5",
"mdb-angular-ui-kit": "^3.0.0",
"ngx-sharebuttons": "^11.0.0",
"primeicons": "^5.0.0",
"primeng": "^14.0.1",
@ -666,6 +671,23 @@
"rxjs": "^6.5.3 || ^7.4.0"
}
},
"node_modules/@angular/material": {
"version": "14.2.1",
"resolved": "https://registry.npmjs.org/@angular/material/-/material-14.2.1.tgz",
"integrity": "sha512-e7DkKJTuqrSpKPhxahrqkZt6AeU5ld5/aSeCamq2dcdqfZ8otmgiajzN0cXZGwSCT2Lth6c+QV3yn8ufTJQpTw==",
"dependencies": {
"tslib": "^2.3.0"
},
"peerDependencies": {
"@angular/animations": "^14.0.0 || ^15.0.0",
"@angular/cdk": "14.2.1",
"@angular/common": "^14.0.0 || ^15.0.0",
"@angular/core": "^14.0.0 || ^15.0.0",
"@angular/forms": "^14.0.0 || ^15.0.0",
"@angular/platform-browser": "^14.0.0 || ^15.0.0",
"rxjs": "^6.5.3 || ^7.4.0"
}
},
"node_modules/@angular/platform-browser": {
"version": "14.1.3",
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-14.1.3.tgz",
@ -3226,6 +3248,15 @@
"node": ">=6"
}
},
"node_modules/@fortawesome/fontawesome-free": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.2.1.tgz",
"integrity": "sha512-viouXhegu/TjkvYQoiRZK3aax69dGXxgEjpvZW81wIJdxm5Fnvp3VVIP4VHKqX4SvFw6qpmkILkD4RJWAdrt7A==",
"hasInstallScript": true,
"engines": {
"node": ">=6"
}
},
"node_modules/@fortawesome/fontawesome-svg-core": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.0.tgz",
@ -3491,6 +3522,31 @@
"integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==",
"dev": true
},
"node_modules/@ngrx/effects": {
"version": "14.3.2",
"resolved": "https://registry.npmjs.org/@ngrx/effects/-/effects-14.3.2.tgz",
"integrity": "sha512-6bpGfA44jzwhBcmNaTwVgnFmYOX9iKPFpXyetDe41tVESo1CsNhUBPTmISDXKN9Mx2mwGbsMxrn6QFRypSsKAQ==",
"dependencies": {
"tslib": "^2.0.0"
},
"peerDependencies": {
"@angular/core": "^14.0.0",
"@ngrx/store": "14.3.2",
"rxjs": "^6.5.3 || ^7.5.0"
}
},
"node_modules/@ngrx/store": {
"version": "14.3.2",
"resolved": "https://registry.npmjs.org/@ngrx/store/-/store-14.3.2.tgz",
"integrity": "sha512-XGHjr0arh6gClo8Ce+xqJLvW9PkeXPW2tCo9Z5qMtHFI/z5dUppLVKGmMgD/fQBDyoqWTK5xu+89tDkdeZfRjQ==",
"dependencies": {
"tslib": "^2.0.0"
},
"peerDependencies": {
"@angular/core": "^14.0.0",
"rxjs": "^6.5.3 || ^7.5.0"
}
},
"node_modules/@ngtools/webpack": {
"version": "14.1.3",
"resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-14.1.3.tgz",
@ -9248,6 +9304,21 @@
"node": ">= 8"
}
},
"node_modules/mdb-angular-ui-kit": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/mdb-angular-ui-kit/-/mdb-angular-ui-kit-3.0.0.tgz",
"integrity": "sha512-D1gP9pC6CwYHg1O6WJeXTr6k78FNU/A55Gsez5ICTj6rM2sn3A3FoxrIYz8OGgaAVhm5NjBxX7N+2R0EF7dVwQ==",
"dependencies": {
"tslib": "^2.0.0"
},
"peerDependencies": {
"@angular/animations": "^14.0.0",
"@angular/cdk": "^14.0.0",
"@angular/common": "^14.0.0",
"@angular/core": "^14.0.0",
"@angular/forms": "^14.0.0"
}
},
"node_modules/media-typer": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",
@ -14164,6 +14235,14 @@
"tslib": "^2.3.0"
}
},
"@angular/material": {
"version": "14.2.1",
"resolved": "https://registry.npmjs.org/@angular/material/-/material-14.2.1.tgz",
"integrity": "sha512-e7DkKJTuqrSpKPhxahrqkZt6AeU5ld5/aSeCamq2dcdqfZ8otmgiajzN0cXZGwSCT2Lth6c+QV3yn8ufTJQpTw==",
"requires": {
"tslib": "^2.3.0"
}
},
"@angular/platform-browser": {
"version": "14.1.3",
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-14.1.3.tgz",
@ -15963,6 +16042,11 @@
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-6.2.0.tgz",
"integrity": "sha512-rBevIsj2nclStJ7AxTdfsa3ovHb1H+qApwrxcTVo+NNdeJiB9V75hsKfrkG5AwNcRUNxrPPiScGYCNmLMoh8pg=="
},
"@fortawesome/fontawesome-free": {
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.2.1.tgz",
"integrity": "sha512-viouXhegu/TjkvYQoiRZK3aax69dGXxgEjpvZW81wIJdxm5Fnvp3VVIP4VHKqX4SvFw6qpmkILkD4RJWAdrt7A=="
},
"@fortawesome/fontawesome-svg-core": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.2.0.tgz",
@ -16175,6 +16259,22 @@
"integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==",
"dev": true
},
"@ngrx/effects": {
"version": "14.3.2",
"resolved": "https://registry.npmjs.org/@ngrx/effects/-/effects-14.3.2.tgz",
"integrity": "sha512-6bpGfA44jzwhBcmNaTwVgnFmYOX9iKPFpXyetDe41tVESo1CsNhUBPTmISDXKN9Mx2mwGbsMxrn6QFRypSsKAQ==",
"requires": {
"tslib": "^2.0.0"
}
},
"@ngrx/store": {
"version": "14.3.2",
"resolved": "https://registry.npmjs.org/@ngrx/store/-/store-14.3.2.tgz",
"integrity": "sha512-XGHjr0arh6gClo8Ce+xqJLvW9PkeXPW2tCo9Z5qMtHFI/z5dUppLVKGmMgD/fQBDyoqWTK5xu+89tDkdeZfRjQ==",
"requires": {
"tslib": "^2.0.0"
}
},
"@ngtools/webpack": {
"version": "14.1.3",
"resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-14.1.3.tgz",
@ -20468,6 +20568,14 @@
}
}
},
"mdb-angular-ui-kit": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/mdb-angular-ui-kit/-/mdb-angular-ui-kit-3.0.0.tgz",
"integrity": "sha512-D1gP9pC6CwYHg1O6WJeXTr6k78FNU/A55Gsez5ICTj6rM2sn3A3FoxrIYz8OGgaAVhm5NjBxX7N+2R0EF7dVwQ==",
"requires": {
"tslib": "^2.0.0"
}
},
"media-typer": {
"version": "0.3.0",
"resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz",

11
angular/package.json
View File

@ -1,9 +1,9 @@
{
"name": "sakura",
"version": "0.0.1",
"version": "0.0.3",
"scripts": {
"ng": "ng",
"start": "ng serve --host 192.168.0.12",
"start": "ng serve --host 192.168.0.14",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test"
@ -17,14 +17,18 @@
"@angular/core": "^14.0.0",
"@angular/fire": "^7.4.1",
"@angular/forms": "^14.0.0",
"@angular/material": "^14.2.1",
"@angular/platform-browser": "^14.0.0",
"@angular/platform-browser-dynamic": "^14.0.0",
"@angular/router": "^14.0.0",
"@angular/service-worker": "^14.0.0",
"@fortawesome/angular-fontawesome": "^0.11.1",
"@fortawesome/fontawesome-free": "^6.0.0",
"@fortawesome/fontawesome-svg-core": "^6.2.0",
"@fortawesome/free-brands-svg-icons": "^6.2.0",
"@fortawesome/free-solid-svg-icons": "^6.2.0",
"@ngrx/effects": "^14.3.2",
"@ngrx/store": "^14.3.2",
"@types/uuid": "^8.3.4",
"angular-moment-timezone": "^1.7.1",
"angularx-qrcode": "^14.0.0",
@ -32,6 +36,7 @@
"firebase": "^9.9.3",
"google-libphonenumber": "^3.2.30",
"jsbarcode": "^3.11.5",
"mdb-angular-ui-kit": "^3.0.0",
"ngx-sharebuttons": "^11.0.0",
"primeicons": "^5.0.0",
"primeng": "^14.0.1",
@ -55,4 +60,4 @@
"karma-jasmine-html-reporter": "~1.7.0",
"typescript": "~4.7.2"
}
}
}

10
angular/src/app/app.constants.ts
View File

@ -58,19 +58,29 @@ export const PageListMain: Page[] = [
name: 'Аккаунт',
resName: 'account',
onSideBar: true,
icon: 'person'
},
{
code: MainPageCode.Products,
name: 'Товары',
resName: 'products',
onSideBar: true,
icon: 'manage_search'
},
{
code: MainPageCode.Cart,
name: 'Корзина',
resName: 'cart',
onSideBar: true,
icon: 'shopping_bag'
},
// {
// code: MainPageCode.Info,
// name: 'О нас',
// resName: 'info',
// onSideBar: true,
// icon: 'info'
// },
]
export const orderStatuses: OrderStatus = {

22
angular/src/app/app.module.ts
View File

@ -43,6 +43,16 @@ import { UserDataOrderComponent } from './components/user-data-order/user-data-o
import {DropdownModule} from "primeng/dropdown";
import {SelectButtonModule} from 'primeng/selectbutton';
import { CalendarModule } from 'primeng/calendar';
import {MatIconModule} from '@angular/material/icon';
import { InfoComponent } from './pages/info/info.component';
import { MdbCarouselModule } from 'mdb-angular-ui-kit/carousel';
import { StoreModule } from '@ngrx/store';
import { configReducer } from './state/config/config.reducer';
import { EffectsModule } from '@ngrx/effects';
import { ConfigEffects } from './state/config/config.effects';
import {PaginatorModule} from 'primeng/paginator';
import {InputTextModule} from 'primeng/inputtext';
import { ChangeQuantityComponent } from './components/change-quantity/change-quantity.component';
@NgModule({
declarations: [
@ -64,7 +74,9 @@ import { CalendarModule } from 'primeng/calendar';
CartComponent,
ProductModalComponent,
CheckboxGroupComponent,
UserDataOrderComponent
UserDataOrderComponent,
InfoComponent,
ChangeQuantityComponent
],
imports: [
BrowserModule,
@ -101,7 +113,13 @@ import { CalendarModule } from 'primeng/calendar';
TreeSelectModule,
DropdownModule,
SelectButtonModule,
CalendarModule
CalendarModule,
MatIconModule,
MdbCarouselModule,
StoreModule.forRoot({config: configReducer}),
EffectsModule.forRoot([ConfigEffects]),
PaginatorModule,
InputTextModule
],
providers: [DialogService, MessageService, MessagingService ],
bootstrap: [AppComponent]

2
angular/src/app/components/navbar/navbar.component.html
View File

@ -1,3 +1,3 @@
<div class="container">
<div class="container-navbar">
<img src="./assets/logo.png" alt="Логотип">
</div>

2
angular/src/app/components/navbar/navbar.component.scss
View File

@ -1,4 +1,4 @@
.container {
.container-navbar {
box-sizing: border-box;
padding: 7px 0 0 5px;
width: 100%;

16
angular/src/app/interface/data.ts
View File

@ -12,7 +12,8 @@ export enum PageCode {
export enum MainPageCode {
Account,
Products,
Cart
Cart,
Info
}
export interface Page {
@ -23,6 +24,7 @@ export interface Page {
getMethod?: string;
resName?: string;
onSideBar: boolean
icon?: string;
}
export interface UserDataForm {
@ -150,9 +152,11 @@ export interface ModifiersGroup {
export interface Modifier {
id: string,
idLocal: string,
name: string,
groupId: string,
price?: number,
quantity?: number,
restrictions: {
minQuantity: number,
maxQuantity: number,
@ -163,8 +167,16 @@ export interface Modifier {
export interface CartModifier {
id: string;
idLocal: string;
name: string;
options: Modifier[];
allQuantity: number;
restrictions: {
minQuantity: number,
maxQuantity: number,
freeQuantity: number,
byDefault: number
}
}
export interface Cart {
@ -212,7 +224,7 @@ export interface OrderModifier {
}
export interface DeliveryData {
paymentMethod: PaymentMethod;
paymentMethod: PaymentMethod | null;
deliveryDate: Date | null;
deliveryType: DeliveryType | null;
persons: number;

34
angular/src/app/pages/account/account.component.html
View File

@ -8,10 +8,13 @@
<li *ngIf="page.onSideBar" class="main-menu-container__item" [ngClass]="{
'cart': page.resName === 'cart',
'is-active': page === currentPageMain
}" [ngStyle]="{
border: last && 0,
'border-radius': first ? '6px 0 0 6px' : (last ? '0 6px 6px 0' : 0)
}" [attr.data-counter]="page.resName === 'cart' ? cartCount : null" (click)="changeMainPage(page, $event)">
<mat-icon [ngClass]="{
'mat-icon': true,
'is-active': page === currentPageMain
}">
{{page.icon}}
</mat-icon>
<span>
{{page.name}}
</span>
@ -53,7 +56,7 @@
</div>
</li>
</ng-container>
<li class="woocommerce-MyAccount-navigation-link" (click)="logout($event)">
<li class="woocommerce-MyAccount-navigation-link" (click)="logout()">
<div class="container">
<img src="./assets/menu-icons/exit.png" alt="Иконка меню" />
<div class="menu-item-info">
@ -71,6 +74,9 @@
<ng-container *ngSwitchCase="MainPageCode.Cart">
<app-cart *ngIf="!showAuthoriztion" (showAuthoriztion)="checkAuthorization($event)"></app-cart>
</ng-container>
<ng-container *ngSwitchCase="MainPageCode.Info">
<app-info></app-info>
</ng-container>
<ng-container>
<app-auth *ngIf="showAuthoriztion && currentPageMain !== mainPageList[1]" [handleHttpError]="handleHttpErrorFunc"
@ -83,4 +89,24 @@
}">
v{{ version }}
</span>
<p-toast position="bottom-center" key="c" (onClose)="onReject()" [baseZIndex]="5000">
<ng-template let-message pTemplate="message">
<div class="flex flex-column" style="flex: 1">
<div class="text-center">
<i class="pi pi-exclamation-triangle" style="font-size: 3rem"></i>
<h4>{{message.summary}}</h4>
<p style="font-weight: 600;">{{message.detail}}</p>
</div>
<div class="grid p-fluid">
<div class="col-6">
<button type="button" pButton (click)="onConfirm()" label="Да" class="p-button-success"></button>
</div>
<div class="col-6">
<button type="button" pButton (click)="onReject()" label="Нет" class="p-button-secondary"></button>
</div>
</div>
</div>
</ng-template>
</p-toast>
</div>

71
angular/src/app/pages/account/account.component.scss
View File

@ -1,35 +1,51 @@
:host {
.woocommerce {
min-height: calc(100vh - 39px);
padding: 20px 18px;
padding: 20px 18px 65px;
position: relative;
&.auth-page {
}
&.auth-page {}
.main-menu-container {
max-width: 600px;
height: 50px;
margin: -20px auto 0 auto;
position: fixed;
width: 100%;
bottom: 0;
left: 0;
margin: 0;
z-index: 777;
height: 57px;
border-top: solid 1px #dfdfdf;
background-color: #fff;
ul {
display: flex;
justify-content: space-between;
height: 100%;
align-items: center;
font-size: 14px;
padding: 0 16px;
flex-wrap: nowrap;
flex-direction: row;
li {
width: 100%;
text-align: center;
border-right: solid #e1e1e1 1px;
padding: 8px 0;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 4px;
font-size: 12px;
color: #b5b5b9;
cursor: pointer;
&.mat-icon {
color: #b5b5b9;
&.is-active {
color: #000;
}
}
&.is-active {
background: #0d457e;
color: #fff;
color: #000;
}
&.cart {
@ -39,8 +55,8 @@
content: attr(data-counter);
color: #fff;
position: absolute;
right: 3px;
top: 1px;
right: calc(50% - 24px);
top: 3px;
background: #D7120B;
border-radius: 50px;
min-width: 1.2rem;
@ -138,7 +154,28 @@
.version {
opacity: 0.5;
position: absolute;
bottom: 12px;
bottom: 60px;
}
}
@media screen and (min-width: 550px) {
.woocommerce {
padding-bottom: 78px;
.main-menu-container {
width: 500px;
left: 50%;
transform: translate(-50%, 0);
bottom: 20px;
border: solid 1px #dfdfdf;
border-radius: 12px;
}
.version {
bottom: 20px;
}
}
}
}

41
angular/src/app/pages/account/account.component.ts
View File

@ -203,35 +203,16 @@ export class AccountComponent implements OnInit {
// });
}
logout(event?: MouseEvent) {
if (event) {
event.preventDefault();
}
this.ref = this.dialogService.open(ExitComponent, {
width: 'auto',
style: {
'max-width': '90vw',
'max-height': '90vh',
},
contentStyle: {
'max-height': '90vh',
height: 'auto',
'max-width': '90vw',
overflow: 'auto',
'border-radius': '4px',
padding: '16px'
},
baseZIndex: 10000,
autoZIndex: true,
dismissableMask: true,
closeOnEscape: true,
showHeader: false,
});
this.ref.onClose.subscribe((result) => {
if (result) {
this.deleteToken();
this.showAuthoriztion = true;
}
});
onReject() {
this.messageService.clear('c');
}
onConfirm() {
this.deleteToken();
this.showAuthoriztion = true;
}
logout() {
this.messageService.add({ key: 'c', sticky: true, severity: 'warn', summary: 'Вы уверены, что хотите выйти?' });
}
}

16
angular/src/app/pages/products/products.component.html
View File

@ -3,23 +3,29 @@
<div class="products-container__filters-container">
<label>Категория</label>
<p-treeSelect *ngIf="groups" [(ngModel)]="selectedGroup" [options]="groups"
(onNodeUnselect)="onGroupUnselect($event)" placeholder="Группа"></p-treeSelect>
(onNodeSelect)="changeGroup()" (onNodeUnselect)="onGroupUnselect($event)" placeholder="Группа"></p-treeSelect>
<label>Пункт выдачи</label>
<p-treeSelect *ngIf="terminalList" [(ngModel)]="selectedTerminal" [options]="terminalList"
(onNodeSelect)="changeTerminal()" (onNodeUnselect)="onTerminalUnselect($event)"
placeholder="Пункт самовывоза" [disabled]="!!cartService.cartCount"></p-treeSelect>
</div>
<p-paginator [style]="{'background': 'transparent', padding: '8px 0'}" [alwaysShow]="false" [first]="currentPage" [rows]="8"
[totalRecords]="filterByGroup().length" (onPageChange)="onPageChange($event)" [pageLinkSize]="3"
[showPageLinks]="true"></p-paginator>
<div class="products-container__items">
<div *ngFor="let product of filterByGroup()" class="products-container__item">
<div *ngFor="let product of cropList(filterByGroup(), 8)" (click)="addToCart($event, product)" class="products-container__item">
<img *ngIf="!product.image" src="./assets/no-image.png" alt="{{product.name}}">
<img *ngIf="product.image" src="{{product.image}}" alt="{{product.name}}">
<div class="products-container__name-container">
<p>{{product.name}}</p>
<span>{{product.price}}₽</span>
</div>
<button class="products-container__add-to-cart" (click)="addToCart($event, product)">В корзину</button>
<button class="products-container__add-to-cart">В корзину</button>
</div>
</div>
<p-paginator [style]="{'background': 'transparent', padding: '8px 0'}" [alwaysShow]="false" [first]="currentPage" [rows]="8"
[totalRecords]="filterByGroup().length" (onPageChange)="onPageChange($event)" [pageLinkSize]="3"
[showPageLinks]="true"></p-paginator>
<p-toast position="bottom-center" key="c" (onClose)="onReject()" [baseZIndex]="5000">
<ng-template let-message pTemplate="message">
<div class="flex flex-column" style="flex: 1">
@ -31,11 +37,11 @@
<div class="grid p-fluid">
<div class="col-6">
<button type="button" pButton (click)="onConfirm()" label="Да"
class="p-button-success">Да</button>
class="p-button-success"></button>
</div>
<div class="col-6">
<button type="button" pButton (click)="onReject()" label="Нет"
class="p-button-secondary">Нет</button>
class="p-button-secondary"></button>
</div>
</div>
</div>

29
angular/src/app/pages/products/products.component.scss
View File

@ -42,8 +42,9 @@
img {
width: 100%;
// max-width: 150px;
margin: 0 auto;
height: 150px;
object-fit: cover;
}
p {
@ -56,7 +57,7 @@
&__name-container {
width: 100%;
display: flex;
align-items: center;
align-items: flex-start;
margin-top: 8px;
}
@ -71,4 +72,28 @@
bottom: 0;
}
}
@media screen and (max-width: 683px) {
.products-container {
&__item {
width: calc(33% - 10px);
}
}
}
@media screen and (max-width: 517px) {
.products-container {
&__item {
width: calc(50% - 8px);
}
}
}
@media screen and (max-width: 351px) {
.products-container {
&__item {
width: 100%;
}
}
}
}

18
angular/src/app/pages/products/products.component.ts
View File

@ -24,6 +24,7 @@ export class ProductsComponent implements OnInit {
public terminalList!: any;
public selectedTerminal!: any;
public loading: boolean = false;
public currentPage: number = 0
constructor(
public dialogService: DialogService,
@ -99,10 +100,18 @@ export class ProductsComponent implements OnInit {
})
}
onPageChange(event: any) {
this.currentPage = event.first;
}
filterByGroup() {
if (!this.selectedGroup) return []
if (this.selectedGroup.label === 'Все') return this.products
return this.products.filter((product) => product.groupId === this.selectedGroup.id)
return JSON.parse(JSON.stringify(this.products.filter((product) => product.groupId === this.selectedGroup.id)))
}
cropList(list: Array<any>, quantity: number) {
return list.slice(this.currentPage, this.currentPage + quantity)
}
addToCart(event: MouseEvent, product: Product) {
@ -119,7 +128,7 @@ export class ProductsComponent implements OnInit {
contentStyle: {
'max-height': '90vh',
height: 'auto',
'max-width': '90vw',
'max-width': '600px',
overflow: 'auto',
},
data: {
@ -142,9 +151,14 @@ export class ProductsComponent implements OnInit {
this.getData()
this.cartService.changeTerminal(this.selectedTerminal);
this.loading = false;
this.currentPage = 0
}, 0);
}
changeGroup() {
this.currentPage = 0
}
onGroupUnselect(event: any) {
setTimeout(() => {
this.selectedGroup = event.node

4
angular/src/app/services/wp-json.service.ts
View File

@ -58,6 +58,10 @@ export class WpJsonService {
return this._request(`trans/${systemId}/${token}/`, 'GET', null, false, url)
}
getSiteConfig(): Observable<any> {
return this._request(`/assets/site-config.json`, 'GET', null, false)
}
_request(path: string, method: string, body?: any, auth = false, baseUrl?: string): Observable<any> {
const token = decodeURI(this.cookiesService.getItem('token') ?? '');
let headers = new HttpHeaders();

4
angular/src/environments/environment.ts
View File

@ -7,7 +7,7 @@ export const environment = {
appWPEndpoint: './',
hasBonusProgram: true,
systemId: 'StyrkNFW9vKga1KlJP',
defaultUrl: 'http://192.168.0.12:4200',
defaultUrl: 'http://192.168.0.14:4200',
firebase: {
apiKey: 'AIzaSyCnKvln5itnrBj62POCPHxshAN_Vmd0zds',
authDomain: 'fashionlogicanotification.firebaseapp.com',
@ -21,7 +21,7 @@ export const environment = {
appleWalletEndpoint: 'http://192.168.0.179:4200/apns/api',
appleWalletSecret: 'Token F5mbzEERAznGKVbB6l',
webhookItRetail: 'https://webhook.it-retail.tech/handlers/tillda/1eb3fb56-3c4c-43b7-9a04-ce532ab7548f',
icardProxy: 'http://192.168.0.12:4200/icard-proxy/',
icardProxy: 'http://192.168.0.14:4200/icard-proxy/',
clientName: 'Sakura',
cities: ['Менделеевск'],
};

5
angular/src/index.html
View File

@ -13,8 +13,11 @@
<link rel="manifest" href="manifest.webmanifest">
<meta name="theme-color" content="#1976d2">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body>
<body class="mat-typography">
<app-root></app-root>
<noscript>Please enable JavaScript to continue using this application.</noscript>
</body>

111
angular/src/static/nomen_1eb3fb56-3c4c-43b7-9a04-ce532ab7548f.json
View File

@ -1,111 +0,0 @@
{
"groups": [
{
"label": "тестовая категория",
"id": "05126d92-0e17-4c0f-b4c3-db6a9a1afdeb"
}
],
"products": [
{
"name": "Пицца",
"groupId": "05126d92-0e17-4c0f-b4c3-db6a9a1afdeb",
"id": "5d76d34a-d3be-48b9-8856-19ef825671c4",
"price": 234,
"image": "",
"modifiers_group": [
"78dc0a96-85fc-4ae3-87d0-2b4aabbea51a",
"00000000-0000-0000-0000-000000000000"
]
},
{
"name": "Пиво темное Козел",
"groupId": "05126d92-0e17-4c0f-b4c3-db6a9a1afdeb",
"id": "f1a2d10d-235a-4ac7-a9b4-836b025e9684",
"price": 123,
"image": "https://102922.selcdn.ru/ecomm/headline-demo-start/38180/images/items/4c252f382ab3851c3547d03155cf6ae0.jpeg",
"modifiers_group": []
},
{
"name": "Пиво темное Козел",
"groupId": "05126d92-0e17-4c0f-b4c3-db6a9a1afdeb",
"id": "f1a2d10d-235a-4ac7-a9b4-836b025e9684",
"price": 123,
"image": "https://102922.selcdn.ru/ecomm/headline-demo-start/38180/images/items/4c252f382ab3851c3547d03155cf6ae0.jpeg",
"modifiers_group": []
},
{
"name": "Пиво темное Козел",
"groupId": "05126d92-0e17-4c0f-b4c3-db6a9a1afdeb",
"id": "f1a2d10d-235a-4ac7-a9b4-836b025e9684",
"price": 123,
"image": "https://102922.selcdn.ru/ecomm/headline-demo-start/38180/images/items/4c252f382ab3851c3547d03155cf6ae0.jpeg",
"modifiers_group": []
},
{
"name": "Пиво темное Козел",
"groupId": "05126d92-0e17-4c0f-b4c3-db6a9a1afdeb7",
"id": "f1a2d10d-235a-4ac7-a9b4-836b025e9684",
"price": 123,
"image": "https://102922.selcdn.ru/ecomm/headline-demo-start/38180/images/items/4c252f382ab3851c3547d03155cf6ae0.jpeg",
"modifiers_group": []
}
],
"modifiers_groups": [
{
"name": "Добавки к пицце",
"id": "78dc0a96-85fc-4ae3-87d0-2b4aabbea51a",
"restrictions": {
"minQuantity": 0,
"maxQuantity": 1,
"freeQuantity": 0,
"byDefault": 0
}
},
{
"name": "Дополнительно",
"id": "00000000-0000-0000-0000-000000000000",
"restrictions": {
"minQuantity": 0,
"maxQuantity": 1,
"freeQuantity": 0,
"byDefault": 0
}
}
],
"modifiers": [
{
"groupId": "78dc0a96-85fc-4ae3-87d0-2b4aabbea51a",
"name": "С колбасой",
"id": "ab5e5ee1-4772-4b36-a793-751315e35436",
"restrictions": {
"minQuantity": 0,
"maxQuantity": 0,
"freeQuantity": 0,
"byDefault": 0
}
},
{
"groupId": "78dc0a96-85fc-4ae3-87d0-2b4aabbea51a",
"name": "С ветчиной",
"id": "e9fd6d73-eab2-4d3b-81b2-1b88c9c712d2",
"restrictions": {
"minQuantity": 0,
"maxQuantity": 0,
"freeQuantity": 0,
"byDefault": 0
}
},
{
"groupId": "00000000-0000-0000-0000-000000000000",
"name": "С собой",
"id": "d2c369f7-1d05-49ad-9387-157ebf253e10",
"restrictions": {
"minQuantity": 0,
"maxQuantity": 1,
"freeQuantity": 0,
"byDefault": 0
}
}
],
"categories": []
}

19
angular/src/styles.scss
View File

@ -1,3 +1,11 @@
// @import '~mdb-angular-ui-kit/assets/scss/mdb.scss';
@import '~@fortawesome/fontawesome-free/scss/fontawesome.scss';
@import '~@fortawesome/fontawesome-free/scss/solid.scss';
@import '~@fortawesome/fontawesome-free/scss/regular.scss';
@import '~@fortawesome/fontawesome-free/scss/brands.scss';
// @import '~mdb-angular-ui-kit/assets/scss/mdb.scss';
// Сброс стилей
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:middle}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
@ -151,6 +159,13 @@ input::-webkit-date-and-time-value {
p-toast[key="c"] .p-toast {
width: 96vw;
max-width: 400px;
bottom: 57px;
}
@media screen and (min-width: 550px) {
p-toast[key="c"] .p-toast {
bottom: 73px;
}
}
.p-calendar {
@ -172,4 +187,6 @@ p-toast[key="c"] .p-toast {
border-radius: 4px;
cursor: pointer;
}
}
}
html, body { height: 100%; }
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; background: #f9f9f9; }