FRONTEND-520. Responsive refunds (#455)

* responsive refunds

* fixes

Co-authored-by: Rinat Arsaev <11846445+KrickRay@users.noreply.github.com>
This commit is contained in:
Denis Ezhov 2021-05-14 13:21:07 +03:00 committed by GitHub
parent 55801def1a
commit 450968ab9b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 36 additions and 33 deletions

View File

@ -7,6 +7,6 @@
>
<dsh-row-header-label fxFlex>{{ t('amount') }}</dsh-row-header-label>
<dsh-row-header-label fxFlex>{{ t('status') }}</dsh-row-header-label>
<dsh-row-header-label fxFlex>{{ t('updatedAt') }}</dsh-row-header-label>
<dsh-row-header-label fxFlex fxHide.lt-md>{{ t('updatedAt') }}</dsh-row-header-label>
<dsh-row-header-label fxFlex fxHide.lt-md> {{ t('shop') }} </dsh-row-header-label>
</dsh-row>

View File

@ -4,15 +4,18 @@
(selectedChange)="daterangeSelectionChange($event)"
></dsh-daterange-filter>
<dsh-filter-shops
fxHide.lt-md
[shops]="shops$ | async"
[selected]="selectedShops$ | async"
(selectedChange)="shopSelectionChange($event)"
></dsh-filter-shops>
<dsh-invoices-filter
fxHide.lt-md
[selected]="initParams?.invoiceIDs"
(selectedChange)="invoiceSelectionChange($event)"
></dsh-invoices-filter>
<dsh-refund-status-filter
fxHide.lt-md
[selected]="initParams?.refundStatus"
(selectedChange)="statusSelectionChange($event)"
></dsh-refund-status-filter>

View File

@ -1,19 +1,18 @@
<div fxLayout="column" fxLayoutGap="24px" *transloco="let t; scope: 'invoice-details'; read: 'invoiceDetails'">
<div fxLayout="row" fxLayout.lt-md="column" fxLayoutAlign="space-between" fxLayoutGap="24px">
<dsh-details-item fxFlex="33" fxFlex.lt-md="100" [title]="t('status')">
<dsh-status [color]="invoice.status | invoiceStatusColor">{{
invoice.status | invoiceStatusName
}}</dsh-status>
</dsh-details-item>
<dsh-details-item fxFlex="33" fxFlex.lt-md="100" [title]="t('amount')">{{
invoice.amount | toMajor | currency: invoice.currency
}}</dsh-details-item>
<dsh-details-item fxFlex="33" fxFlex.lt-md="100" [title]="t('createdAt')">{{
invoice.createdAt | date: 'dd MMMM yyyy, HH:mm'
}}</dsh-details-item>
</div>
<dsh-details-item [title]="t('name')">{{ invoice.product }}</dsh-details-item>
<dsh-details-item *ngIf="invoice.description" [title]="t('description')">{{
<div
gdColumns="1fr"
gdColumns.gt-sm="1fr 1fr 1fr"
gdGap="24px"
*transloco="let t; scope: 'invoice-details'; read: 'invoiceDetails'"
>
<dsh-details-item [title]="t('status')">
<dsh-status [color]="invoice.status | invoiceStatusColor">{{ invoice.status | invoiceStatusName }}</dsh-status>
</dsh-details-item>
<dsh-details-item [title]="t('amount')">{{
invoice.amount | toMajor | currency: invoice.currency
}}</dsh-details-item>
<dsh-details-item [title]="t('createdAt')">{{ invoice.createdAt | date: 'dd MMMM yyyy, HH:mm' }}</dsh-details-item>
<dsh-details-item gdColumn="3fr" [title]="t('name')">{{ invoice.product }}</dsh-details-item>
<dsh-details-item gdColumn="3fr" *ngIf="invoice.description" [title]="t('description')">{{
invoice.description
}}</dsh-details-item>
</div>

View File

@ -1,7 +1,7 @@
<div
*transloco="let t; scope: 'payment-info'; read: 'paymentInfo'"
fxLayout="row"
fxLayout.lt-md="column"
fxLayout.gt-sm="row"
fxLayout="column"
fxLayoutGap="24px"
>
<dsh-details-item fxFlex [title]="t('amount')">{{

View File

@ -1,15 +1,16 @@
<div fxLayout="column" fxLayoutGap="24px" *transloco="let t; scope: 'refund-details'; read: 'refundDetails'">
<div fxLayout="row" fxLayout.lt-md="column" fxLayoutAlign="space-between" fxLayoutGap="24px">
<dsh-details-item fxFlex="33" fxFlex.lt-md="100" [title]="t('status')">
<dsh-status [color]="refund.status | refundStatusColor">{{ refund.status | refundStatusName }}</dsh-status>
</dsh-details-item>
<dsh-details-item fxFlex="33" fxFlex.lt-md="100" [title]="t('amount')">{{
refund.amount | toMajor | currency: refund.currency
}}</dsh-details-item>
<dsh-details-item fxFlex="33" fxFlex.lt-md="100" [title]="t('createdAt')">{{
refund.createdAt | date: 'dd MMMM yyyy, HH:mm'
}}</dsh-details-item>
</div>
<dsh-details-item *ngIf="refund?.reason" [title]="t('reason')">{{ refund.reason }}</dsh-details-item>
<dsh-details-item *ngIf="refund?.error" [title]="t('error')">{{ refund.error.message }}</dsh-details-item>
<div
gdColumns="1fr"
gdColumns.gt-sm="1fr 1fr 1fr"
gdGap="24px"
*transloco="let t; scope: 'refund-details'; read: 'refundDetails'"
>
<dsh-details-item [title]="t('status')">
<dsh-status [color]="refund.status | refundStatusColor">{{ refund.status | refundStatusName }}</dsh-status>
</dsh-details-item>
<dsh-details-item [title]="t('amount')">{{ refund.amount | toMajor | currency: refund.currency }}</dsh-details-item>
<dsh-details-item [title]="t('createdAt')">{{ refund.createdAt | date: 'dd MMMM yyyy, HH:mm' }}</dsh-details-item>
<dsh-details-item gdColumn="3fr" *ngIf="refund?.reason" [title]="t('reason')">{{ refund.reason }}</dsh-details-item>
<dsh-details-item gdColumn="3fr" *ngIf="refund?.error" [title]="t('error')">{{
refund.error.message
}}</dsh-details-item>
</div>