Merged PR 2036: feature(libs-icons, crm-customer-card-transactions): Added Refresh Icon, Adde...

feature(libs-icons, crm-customer-card-transactions): Added Refresh Icon, Added Spacer to Transaction Layout, Added Refresh CTA Styling

Ref: #5493
This commit is contained in:
Nino Righi
2025-11-20 16:58:02 +00:00
committed by Lorenz Hilpert
parent bcd4d655a6
commit b32cc48fd9
4 changed files with 20 additions and 6 deletions

View File

@@ -6,7 +6,7 @@
/* Header Row */
.cdk-header-row {
background-color: #CED4DA;
background-color: #ced4da;
height: 48px;
display: table-row;
}
@@ -17,7 +17,7 @@
font-weight: 700;
color: #212529;
padding: 16px 8px;
background-color: #CED4DA;
background-color: #ced4da;
}
.cdk-header-cell:first-child {
@@ -50,3 +50,7 @@
.cdk-cell:last-child {
padding-right: 24px;
}
.transparent-icon-button {
@apply text-isa-neutral-900 bg-transparent hover:bg-transparent disabled:bg-transparent disabled:hover:bg-transparent;
}

View File

@@ -1,13 +1,14 @@
<div class="flex flex-col gap-[24px] px-4">
@if (transactions()?.length) {
<div class="flex flex-row gap-4 items-center">
<div class="flex flex-row items-center">
<h2 class="isa-text-body-1-bold text-isa-neutral-900">
Letzte Transaktionen des Kunden
</h2>
<ui-icon-button
class="transparent-icon-button"
(click)="refresh()"
name="isaActionSearch"
name="isaActionRefresh"
color="tertiary"
[pending]="isLoading()"
[disabled]="isLoading()"
@@ -18,6 +19,7 @@
@if (isLoading()) {
<div class="text-isa-neutral-500 text-sm">Lade Transaktionen...</div>
<div class="h-[100rem]"></div>
} @else if (error()) {
<div class="text-isa-accent-red text-sm">
Fehler beim Laden der Transaktionen

View File

@@ -12,7 +12,7 @@ import { NgIconComponent, provideIcons } from '@ng-icons/core';
import {
isaActionPolygonUp,
isaActionPolygonDown,
isaActionSearch,
isaActionRefresh,
} from '@isa/icons';
import { logger } from '@isa/core/logging';
import { EmptyStateComponent } from '@isa/ui/empty-state';
@@ -31,7 +31,11 @@ import { IconButtonComponent } from '@isa/ui/buttons';
IconButtonComponent,
],
providers: [
provideIcons({ isaActionPolygonUp, isaActionPolygonDown, isaActionSearch }),
provideIcons({
isaActionPolygonUp,
isaActionPolygonDown,
isaActionRefresh,
}),
],
templateUrl: './crm-feature-customer-card-transactions.component.html',
styleUrl: './crm-feature-customer-card-transactions.component.css',

View File

@@ -36,6 +36,9 @@ export const isaActionFilter =
export const isaActionSort =
'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"> <path d="M7 4V20M7 20L3 16M7 20L11 16M17 20V4M17 4L13 8M17 4L21 8" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>';
export const isaActionRefresh =
'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M20.453 12.893C20.1752 15.5029 18.6964 17.9487 16.2494 19.3614C12.1839 21.7086 6.98539 20.3157 4.63818 16.2502L4.38818 15.8172M3.54613 11.107C3.82393 8.49711 5.30272 6.05138 7.74971 4.63862C11.8152 2.29141 17.0137 3.68434 19.3609 7.74983L19.6109 8.18285M3.49316 18.0661L4.22521 15.334L6.95727 16.0661M17.0424 7.93401L19.7744 8.66606L20.5065 5.93401" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>';
export const isaActionSearch =
'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"> <path fill-rule="evenodd" clip-rule="evenodd" d="M11 4C7.13401 4 4 7.13401 4 11C4 14.866 7.13401 18 11 18C12.8859 18 14.5977 17.2542 15.8564 16.0414C15.8827 16.0072 15.9115 15.9742 15.9429 15.9429C15.9742 15.9115 16.0072 15.8827 16.0414 15.8564C17.2542 14.5977 18 12.8859 18 11C18 7.13401 14.866 4 11 4ZM18.0319 16.6177C19.2635 15.078 20 13.125 20 11C20 6.02944 15.9706 2 11 2C6.02944 2 2 6.02944 2 11C2 15.9706 6.02944 20 11 20C13.125 20 15.078 19.2635 16.6177 18.0319L20.2929 21.7071C20.6834 22.0976 21.3166 22.0976 21.7071 21.7071C22.0976 21.3166 22.0976 20.6834 21.7071 20.2929L18.0319 16.6177Z" fill="currentColor"/></svg>';
@@ -44,6 +47,7 @@ export const isaActionPrinter =
export const isaActionScanner =
'<svg width="24" height="24" viewBox="0 0 6 6" fill="currentColor" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><path d="M4.802,3.842l0,0.181c0.002,0.266 0.006,0.414 -0.053,0.529c-0.046,0.09 -0.119,0.164 -0.209,0.21c-0,-0 -0,-0 -0,-0c-0.132,0.067 -0.306,0.052 -0.65,0.052l-0.004,0.004l-0.002,-0l0.004,-0.004l-0.071,0.001l-0.002,0c-0.044,0.005 -0.078,0.019 -0.106,0.039c-0.065,0.043 -0.107,0.117 -0.107,0.2c-0,-0 0.021,0.24 0.241,0.24l0.047,-0c0.462,-0 0.691,-0.015 0.868,-0.105c0.18,-0.092 0.327,-0.239 0.419,-0.419c0,-0 0,-0 0,-0c0.09,-0.177 0.105,-0.406 0.105,-0.868l-0,-0.047c-0,-0.119 -0.016,-0.149 -0.079,-0.198c-0.063,-0.048 -0.078,-0.043 -0.161,-0.043c-0.129,-0 -0.233,0.101 -0.24,0.228Zm-2.872,0.949l-0.182,0c-0.266,0.002 -0.413,0.006 -0.528,-0.053c-0.091,-0.046 -0.164,-0.12 -0.21,-0.21c0,-0 0,-0 0,-0c-0.067,-0.132 -0.052,-0.306 -0.052,-0.65l-0.004,-0.004l0,-0.001l0.004,0.004l-0.001,-0.072l0,-0.002c-0.004,-0.043 -0.019,-0.078 -0.038,-0.106c-0.043,-0.065 -0.117,-0.107 -0.2,-0.107c-0,-0 -0.24,0.021 -0.241,0.241l0,0.046c0,0.462 0.015,0.692 0.104,0.868c0.092,0.181 0.239,0.328 0.419,0.42c0,0 0,0 0,0c0.177,0.09 0.406,0.105 0.868,0.106l0.047,-0c0.119,-0 0.15,-0.016 0.198,-0.079c0.049,-0.063 0.043,-0.078 0.043,-0.161c0.001,-0.128 -0.1,-0.233 -0.227,-0.24Zm1.434,-2.425l-0,1.02c-0,0.133 0.107,0.24 0.24,0.24c0.132,0 0.24,-0.107 0.24,-0.24l-0,-1.02c-0,-0.132 -0.108,-0.24 -0.24,-0.24c-0.133,0 -0.24,0.108 -0.24,0.24Zm0.72,0l-0,1.02c-0,0.133 0.107,0.24 0.24,0.24c0.132,0 0.24,-0.107 0.24,-0.24l-0,-1.02c-0,-0.132 -0.108,-0.24 -0.24,-0.24c-0.133,0 -0.24,0.108 -0.24,0.24Zm-2.16,0l-0,1.02c-0,0.133 0.107,0.24 0.24,0.24c0.132,0 0.24,-0.107 0.24,-0.24l-0,-1.02c-0,-0.132 -0.108,-0.24 -0.24,-0.24c-0.133,0 -0.24,0.108 -0.24,0.24Zm0.72,0l-0,1.02c-0,0.133 0.107,0.24 0.24,0.24c0.132,0 0.24,-0.107 0.24,-0.24l-0,-1.02c-0,-0.132 -0.108,-0.24 -0.24,-0.24c-0.133,0 -0.24,0.108 -0.24,0.24Zm-1.44,0l-0,1.02c-0,0.133 0.107,0.24 0.24,0.24c0.132,0 0.24,-0.107 0.24,-0.24l-0,-1.02c-0,-0.132 -0.108,-0.24 -0.24,-0.24c-0.133,0 -0.24,0.108 -0.24,0.24Zm2.728,-1.883l-0.089,0c-0.119,0 -0.149,0.016 -0.198,0.079c-0.049,0.064 -0.043,0.078 -0.043,0.161c-0,0.129 0.101,0.234 0.228,0.24l0.181,-0l0.179,-0.001c0.159,0.001 0.263,0.01 0.35,0.054c0.09,0.046 0.164,0.119 0.21,0.209c-0,0 -0,0 -0,0c0.067,0.132 0.052,0.306 0.052,0.65l0.004,0.005l-0,0.001l-0.004,-0.004l0.001,0.071l0,0.002c0.005,0.044 0.019,0.078 0.039,0.106c0.043,0.065 0.116,0.107 0.2,0.107l0.001,0c0.014,-0.001 0.239,-0.028 0.239,-0.241l-0,-0.047c-0,-0.462 -0.015,-0.691 -0.105,-0.867c-0.092,-0.181 -0.239,-0.328 -0.419,-0.42c-0,0 -0,0 -0,0c-0.171,-0.087 -0.392,-0.104 -0.826,-0.105Zm-2.971,1.446l-0,-0.182c-0.002,-0.266 -0.006,-0.413 0.053,-0.528c0.046,-0.091 0.119,-0.164 0.21,-0.21c-0,-0 -0,-0 -0,-0c0.131,-0.067 0.305,-0.052 0.649,-0.052l0.005,-0.005l0.001,0.001l-0.004,0.004l0.071,-0.002l0.002,0c0.044,-0.004 0.078,-0.019 0.106,-0.039c0.065,-0.043 0.107,-0.116 0.107,-0.199c0,-0 -0.021,-0.24 -0.241,-0.24l-0.047,-0c-0.462,-0 -0.691,0.014 -0.867,0.104c-0.181,0.092 -0.328,0.239 -0.42,0.42c0,-0 0,-0 0,-0c-0.09,0.176 -0.105,0.406 -0.105,0.868l0,0.046c0,0.119 0.016,0.15 0.079,0.198c0.064,0.049 0.078,0.044 0.161,0.044c0.129,-0 0.234,-0.101 0.24,-0.228Z"/></svg>';
export const isaActionEdit =
'<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(1,0,0,1,0.835859,1.16414)"><g><path d="M15.293,1.293L2.087,14.499C1.72,14.866 1.545,15.055 1.406,15.267C1.257,15.492 1.139,15.737 1.056,15.994C0.978,16.235 0.939,16.49 0.882,17.005L0.506,20.39C0.473,20.691 0.578,20.992 0.793,21.207C1.008,21.422 1.308,21.527 1.61,21.494L4.995,21.118C5.51,21.061 5.765,21.022 6.006,20.944C6.263,20.861 6.508,20.743 6.733,20.594L6.734,20.594C6.945,20.455 7.135,20.28 7.501,19.913L20.707,6.707C22.202,5.212 22.202,2.788 20.707,1.293C19.212,-0.202 16.788,-0.202 15.293,1.293ZM13,6.414L15.586,9L6.087,18.499C5.864,18.721 5.76,18.84 5.632,18.925C5.557,18.974 5.476,19.013 5.39,19.041C5.244,19.088 5.086,19.095 4.774,19.13L2.632,19.368L2.87,17.226C2.905,16.914 2.912,16.756 2.959,16.61C2.987,16.524 3.026,16.443 3.076,16.368C3.16,16.239 3.279,16.136 3.501,15.913L13,6.414ZM17,7.586L14.414,5L16.707,2.707C17.421,1.993 18.579,1.993 19.293,2.707C20.007,3.421 20.007,4.579 19.293,5.293L17,7.586Z"/></g></g></svg>';