Добавила еще фильтров в заказах, на вкладке терминалов и подразделений

This commit is contained in:
Luba Kaysina 2022-08-17 10:37:43 +04:00
parent ce5135cdaa
commit c59b947673
5 changed files with 72 additions and 11 deletions

View File

@ -9,12 +9,18 @@
<button (click)="createDivision()">Добавить</button>
<p-table [value]="divisions">
<ng-template pTemplate="header">
<tr style="position:sticky !important; top: 0">
<tr style="position:sticky !important; top: 0">
<th style="width:35%">ID</th>
<th style="width:35%">Наименование подразделения</th>
<th></th>
<th></th>
</tr>
<tr style="position:sticky !important; top: 55px">
<th style="width:35%"></th>
<th style="width:35%"><p-columnFilter type="text" field="name" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th></th>
<th></th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-Division>
<!--*ngIf="color()" style="color: red" [ngClass]="{ui-button-danger: true}"-->

View File

@ -2,7 +2,7 @@ import { Component, OnInit } from "@angular/core";
import { JsonrpcService, RpcService } from "src/app/services/jsonrpc.service";
import { MessageService } from "primeng/api";
import { Divisions } from "src/app/interface/data";
import { ConfirmationService } from 'primeng/api';
import { ConfirmationService, FilterService, FilterMatchMode, SelectItem } from 'primeng/api';
@Component({
@ -17,15 +17,38 @@ export class DivisionsComponent implements OnInit {
public create = false;
public chooseName!: string;
public ind: boolean = false;
public matchModeOptions!: SelectItem[];
constructor(
private jsonRpcService: JsonrpcService,
private messageService: MessageService,
private confirmationService: ConfirmationService
private confirmationService: ConfirmationService,
private filterService: FilterService
) { }
ngOnInit(): void {
if (this.choose) { this.getDivisions() };
const customFilterName = "custom-contains";
this.filterService.register(customFilterName, (value: any, filter: any): boolean => {
if (filter === undefined || filter === null || filter.trim() === '') {
return true;
}
if (value === undefined || value === null) {
return false;
}
let det = value.toString()
let det2 = det.toLowerCase()
return det2.includes(filter.toString()) || det.includes(filter.toString());
});
this.matchModeOptions = [
{ label: 'Содержит', value: customFilterName },
{ label: 'Равно', value: FilterMatchMode.EQUALS },
{ label: 'Начинается с', value: FilterMatchMode.STARTS_WITH },
];
}
async getDivisions() {

View File

@ -22,13 +22,13 @@
<th>Тип оплаты</th>
</tr>
<tr style="position:sticky !important; top: 55px">
<th></th>
<th><p-columnFilter type="text" field="id" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th><p-columnFilter type="text" field="status_h" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th><p-columnFilter type="text" field="address.name" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th><p-columnFilter type="text" field="external_id" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th><p-columnFilter type="text" field="phone" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th></th>
</tr>
</ng-template>

View File

@ -14,13 +14,22 @@
<ng-template pTemplate="header" class="head">
<tr>
<th style="width: 16%">ID</th>
<th style="width: 16%">Наименование терминала</th>
<th style="width: 16%">Адрес точки заказа</th>
<th style="width: 16%">ID кассы ККМ</th>
<th style="width: 16%">ID точки заказа</th>
<th style="width: 16%">Список ID цехов готовки</th>
<th style="width: 16%">Статус подключения</th>
<th></th>
<th></th>
</tr>
<tr style="position:sticky !important; top: 55px">
<th style="width: 16%"></th>
<th style="width: 16%"><p-columnFilter type="text" field="public_id" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th style="width: 16%"><p-columnFilter type="text" field="division_id" [matchModeOptions]="matchModeOptions" [matchMode]="'custom-contains'"></p-columnFilter></th>
<th style="width: 16%"></th>
<th style="width: 16%"></th>
<th></th>
<th></th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-terminals>
@ -67,7 +76,6 @@
</p-table>
<div *ngIf="create; else change">
<button (click)="registerTerminal2()">Создать</button>
<button (click)="updateTerminal()">Сохранить</button>
</div>
<ng-template #change>
<button (click)="updateTerminal()">Сохранить</button>

View File

@ -3,7 +3,7 @@ import { JsonrpcService, RpcService } from "src/app/services/jsonrpc.service";
import { MessageService } from "primeng/api";
import { Terminals, Areas } from "src/app/interface/data";
import { ScrollPanelModule } from 'primeng/scrollpanel';
import { ConfirmationService } from 'primeng/api';
import { ConfirmationService, FilterService, FilterMatchMode, SelectItem } from 'primeng/api';
@Component({
@ -19,12 +19,14 @@ export class TerminalsComponent implements OnInit {
public chooseName!: string;
public areas: Areas[] = [];
public chooseArea: Array<string> = [];
public matchModeOptions!: SelectItem[];
constructor(
private jsonRpcService: JsonrpcService,
private messageService: MessageService,
private confirmationService: ConfirmationService
private confirmationService: ConfirmationService,
private filterService: FilterService
//readonly swPush: SwPush,
//private newsletterService: NewsletterService
@ -32,6 +34,28 @@ export class TerminalsComponent implements OnInit {
ngOnInit(): void {
if (this.choose) { this.getTerminals() };
const customFilterName = "custom-contains";
this.filterService.register(customFilterName, (value: any, filter: any): boolean => {
if (filter === undefined || filter === null || filter.trim() === '') {
return true;
}
if (value === undefined || value === null) {
return false;
}
let det = value.toString()
let det2 = det.toLowerCase()
return det2.includes(filter.toString()) || det.includes(filter.toString());
});
this.matchModeOptions = [
{ label: 'Содержит', value: customFilterName },
{ label: 'Равно', value: FilterMatchMode.EQUALS },
{ label: 'Начинается с', value: FilterMatchMode.STARTS_WITH },
];
}
async getTerminals() {