single sponsorship
unknown
plain_text
2 years ago
15 kB
2
Indexable
Never
<div fxLayout="column"
fxLayoutGap="30px"
fxFlex="100%"
fxLayoutAlign="space-between">
<div fxLayout="column"
fxLayoutGap="30px"
fxLayoutGap.gt-xs="10px">
<div fxFlex="100%">
<div fxLayoutGap="10px"
fxLayoutGap.gt-xs="20px"
fxLayout="column"
fxLayout.gt-xs="row wrap">
<div fxFlex="100%"
fxFlex.gt-xs="calc(60% - 20px)"
fxFlex.gt-sm="calc(70% - 20px)">
<mat-form-field appearance="outline"
fxFlex="100%">
<mat-label>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.SearchStaff">
Search staff
</app-translate>
</mat-label>
<input matInput
(keyup)="onFilterChange($event)"
#input>
<mat-icon matSuffix
class="search-icon">search</mat-icon>
</mat-form-field>
</div>
<div fxFlex="100%"
fxFlex.gt-xs="calc(40% - 20px)"
fxFlex.gt-sm="calc(30% - 20px)">
<button mat-stroked-button
color="primary"
class="input-height"
fxFlex="100%"
(click)="onImportSponsorStaffData()">
<mat-icon>insert_chart</mat-icon>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.ImportPartner">
Import from partner
</app-translate>
</button>
</div>
</div>
</div>
<div fxFlex="100%">
<div class="mat-table-container without-header sort-table"
fxFlex="100%">
<table mat-table
[dataSource]="tableData"
matSort
(matSortChange)="onSortChanged($event)">
<ng-container matColumnDef="statusId">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
{{ 'PartnersContracts.SingleSponsorship.Staff.Status' | translate: 'Status' | async }}
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.statusId | contactStatus | async | tooltip"
[ngStyle]="{'color': '#' + (row.statusId | contactStatusColor | async)}">
{{ row.statusId | contactStatus | async | dataSlice}}
</td>
</ng-container>
<ng-container matColumnDef="isEventRepresentative">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.EventRepresentative">
Event Representative
</app-translate>
</th>
<td mat-cell
*matCellDef="let row">
<mat-checkbox color="primary"
[checked]="row.isEventRepresentative"
[ngStyle]="{'margin-bottom': '0', 'pointer-events': 'none'}">
</mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="name">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
{{ 'PartnersContracts.SingleSponsorship.Staff.Name' | translate: 'Name' | async }}
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.name | tooltip">
{{ row.name | dataSlice }}
</td>
</ng-container>
<ng-container matColumnDef="jobRole">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.JobRole">
Job Role
</app-translate>
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.jobRole | tooltip">
{{ row.jobRole | dataSlice }}
</td>
</ng-container>
<ng-container matColumnDef="customStatus">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
{{ 'PartnersContracts.SingleSponsorship.Staff.CustomStatus' | translate: 'Custom Status' |
async }}
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.customStatus | tooltip">
{{ row.customStatus | dataSlice }}
</td>
</ng-container>
<ng-container matColumnDef="email">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
{{ 'PartnersContracts.SingleSponsorship.Staff.Email' | translate: 'Email' | async }}
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.email | tooltip">
<a mat-button
class="link add-decoration"
color="primary"
type="button"
href="mailto:{{row.email}}">
{{ row.email | dataSlice }}
</a>
</td>
</ng-container>
<ng-container matColumnDef="phone">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
{{ 'PartnersContracts.SingleSponsorship.Staff.Phone' | translate: 'Phone' | async }}
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.phone | tooltip">
<a mat-button
class="link add-decoration"
color="primary"
type="button"
href="tel:{{row.phone}}">
{{ row.phone | dataSlice}}
</a>
</td>
</ng-container>
<ng-container matColumnDef="labels">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
<app-translate key="LabelsLabel">
Labels
</app-translate>
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.labels | tooltip">
{{ row.labels | join | dataSlice }}
</td>
</ng-container>
<ng-container matColumnDef="positionAtEvent">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.PositionAtEvent">
Position at event
</app-translate>
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.positionAtEvent | tooltip">
{{ row.positionAtEvent | dataSlice }}
</td>
</ng-container>
<ng-container matColumnDef="isUsedForMailings">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.UseForMailings">
Use For Mailings
</app-translate>
</th>
<td mat-cell
*matCellDef="let row">
<mat-checkbox color="primary"
[checked]="row.isUsedForMailings"
[ngStyle]="{'margin-bottom': '0', 'pointer-events': 'none'}">
</mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="eventComment">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.EventComment">
Event Comment
</app-translate>
</th>
<td mat-cell
*matCellDef="let row"
[matTooltip]="row.eventComment | tooltip">
{{ row.eventComment | dataSlice }}
</td>
</ng-container>
<ng-container matColumnDef="manager">
<th mat-header-cell
*matHeaderCellDef
mat-sort-header>
<app-translate key="PartnersContracts.SingleSponsorship.Staff.Manager">
Manager
</app-translate>
</th>
<td mat-cell
*matCellDef="let row"
class="img-relative"
[matTooltip]="(row | partnershipManagerTooltip | async) ?? ''">
<button *ngIf="!row.managerName"
mat-button
class="link add-decoration"
color="primary"
type="button"
(click)="onInviteUser(row)">
<app-translate key="PartnersContracts.SingleSponsorship.Staff.InviteUser">
Invite User
</app-translate>
</button>
<div *ngIf="row.managerName"
fxLayoutGap="10px"
fxLayout="row"
fxLayoutAlign="start center">
<img [src]="row.managerPhoto | logo: 'ProfileImage'"
alt="Photo of {{ row.managerName }}"
*ngIf="row.managerPhoto; else imgPlaceholder">
<ng-template #imgPlaceholder>
<div class="img-placeholder">
<mat-icon color="primary">person</mat-icon>
</div>
</ng-template>
<span>{{ row.managerName }}</span>
</div>
</td>
</ng-container>
<ng-container matColumnDef="delete">
<th mat-header-cell
*matHeaderCellDef></th>
<td mat-cell
*matCellDef="let element">
<button mat-icon-button
(click)="onRemoveSponsorStaffData(element)">
<mat-icon>delete</mat-icon>
</button>
</td>
</ng-container>
<tr mat-header-row
*matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row
*matRowDef="let row; columns: displayedColumns;"
(click)="onEditSponsorStaffData(row)"
class="table-link delete-table"></tr>
<tr class="mat-row"
*matNoDataRow>
<td class="mat-cell"
colspan="4">{{ 'TableNoSearchResult' | translate: 'No data matching the filter' | async }}
"{{input.value}}"
</td>
</tr>
</table>
</div>
</div>
<div *ngIf="(parentComponent.hasCrmAccess | async)"
fxFlex="100%"
fxLayoutAlign="space-around center">
<button mat-button
class="link remove-decoration"
color="primary"
type="button"
(click)="onAddSponsorStaffData()"
[ngStyle]="{'margin-top': '20px'}">
<mat-icon>add_circle_outline</mat-icon>
{{ 'ButtonInsertRow' | translate: 'Insert row' | async }}
</button>
</div>
</div>
<div fxLayout="row"
fxLayoutGap="16px"
fxLayoutAlign="end end">
<div fxFlex.xs="50%">
<button mat-flat-button
color="primary"
fxFlex="100%"
[routerLink]="['../../']">
{{ 'ButtonClose' | translate: 'Close' | async }}
</button>
</div>
</div>
</div>