css clean up on platform buttons and other ui fixes

This commit is contained in:
CITE\spapacharalampous 2024-09-05 12:40:06 +03:00
parent 0609065ab8
commit 2e5b3b2d8d
52 changed files with 155 additions and 400 deletions

View File

@ -126,7 +126,7 @@ export class DescriptionStatusListingComponent extends BaseListingComponent<Desc
{
prop: nameof<DescriptionStatus>(x => x.internalStatus),
sortable: true,
languageName: 'PLAN-STATUS-LISTING.FIELDS.STATUS',
languageName: 'PLAN-STATUS-LISTING.FIELDS.INTERNAL-STATUS',
cellTemplate: this.status
},
{

View File

@ -90,19 +90,19 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/', row.id])">
<mat-icon>edit</mat-icon>{{'DESCRIPTION-TEMPLATE-LISTING.ACTIONS.EDIT' | translate}}
</button>
<button *ngIf="canAddNewVersion(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/new-version/', row.id])">
</a>
<a *ngIf="canAddNewVersion(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/new-version/', row.id])">
<mat-icon>queue</mat-icon>{{'DESCRIPTION-TEMPLATE-LISTING.ACTIONS.NEW-VERSION' | translate}}
</button>
<button *ngIf="canClone(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/clone/', row.id])">
</a>
<a *ngIf="canClone(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/clone/', row.id])">
<mat-icon>content_copy</mat-icon>{{'DESCRIPTION-TEMPLATE-LISTING.ACTIONS.CLONE' | translate}}
</button>
<button *ngIf="canViewVersions(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/versions/', row.groupId])">
</a>
<a *ngIf="canViewVersions(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-templates/versions/', row.groupId])">
<mat-icon>library_books</mat-icon>
{{'DESCRIPTION-TEMPLATE-LISTING.ACTIONS.VIEW-VERSIONS' | translate}}
</button>
</a>
<button *ngIf="canDownloadXml(row)" mat-menu-item (click)="export($event, row.id)">
<mat-icon>download</mat-icon>{{'DESCRIPTION-TEMPLATE-LISTING.ACTIONS.DOWNLOAD-XML' | translate}}
</button>

View File

@ -90,10 +90,10 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-template-type/' + row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/description-template-type/' + row.id])">
<mat-icon>edit</mat-icon>{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.ACTIONS.EDIT' | translate}}
</button>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.ACTIONS.DELETE' | translate}}
</button>

View File

@ -81,9 +81,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/languages/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/languages/', row.id])">
<mat-icon>edit</mat-icon>{{'LANGUAGE-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'LANGUAGE-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -85,19 +85,19 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/', row.id])">
<mat-icon>edit</mat-icon>{{'PLAN-BLUEPRINT-LISTING.ACTIONS.EDIT' | translate}}
</button>
<button *ngIf="canCreateNewVersion(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/new-version/', row.id])">
</a>
<a *ngIf="canCreateNewVersion(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/new-version/', row.id])">
<mat-icon>queue</mat-icon>{{'PLAN-BLUEPRINT-LISTING.ACTIONS.NEW-VERSION' | translate}}
</button>
<button mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/clone/', row.id])">
</a>
<a mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/clone/', row.id])">
<mat-icon>content_copy</mat-icon>{{'PLAN-BLUEPRINT-LISTING.ACTIONS.CLONE' | translate}}
</button>
<button *ngIf="row.isActive == isActive.Active" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/versions/', row.groupId])">
</a>
<a *ngIf="row.isActive == isActive.Active" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-blueprints/versions/', row.groupId])">
<mat-icon>library_books</mat-icon>
{{'PLAN-BLUEPRINT-LISTING.ACTIONS.VIEW-VERSIONS' | translate}}
</button>
</a>
<button mat-menu-item (click)="export($event, row.id)" *ngIf="canDownloadXML(row)">
<mat-icon>download</mat-icon>{{'PLAN-BLUEPRINT-LISTING.ACTIONS.DOWNLOAD-XML' | translate}}
</button>

View File

@ -53,9 +53,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-statuses/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/plan-statuses/', row.id])">
<mat-icon>edit</mat-icon>{{'PLAN-STATUS-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="delete(row.id)">
<mat-icon>delete</mat-icon>
{{'PLAN-STATUS-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -127,7 +127,7 @@ export class PlanStatusListingComponent extends BaseListingComponent<PlanStatus,
{
prop: nameof<PlanStatus>(x => x.internalStatus),
sortable: true,
languageName: 'PLAN-STATUS-LISTING.FIELDS.STATUS',
languageName: 'PLAN-STATUS-LISTING.FIELDS.INTERNAL-STATUS',
cellTemplate: this.status
},
{

View File

@ -83,9 +83,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/prefilling-sources/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/prefilling-sources/', row.id])">
<mat-icon>edit</mat-icon>{{'PREFILLING-SOURCE-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'PREFILLING-SOURCE-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -84,9 +84,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/reference-type/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/reference-type/', row.id])">
<mat-icon>edit</mat-icon>{{'REFERENCE-TYPE-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'REFERENCE-TYPE-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -105,9 +105,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/references/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/references/', row.id])">
<mat-icon>edit</mat-icon>{{'REFERENCE-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'REFERENCE-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -84,9 +84,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/tenants/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/tenants/', row.id])">
<mat-icon>edit</mat-icon>{{'TENANT-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'TENANT-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -84,9 +84,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/usage-limits/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/usage-limits/', row.id])">
<mat-icon>edit</mat-icon>{{'USAGE-LIMIT-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'USAGE-LIMIT-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -225,7 +225,7 @@
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('externalIdentifier')?.get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<div class="col-md-2">
<button type="button" mat-button class="lightblue-btn" (click)="validateId()" [disabled]="propertiesFormGroup?.get(field.id).get('externalIdentifier')?.get('identifier').disabled">{{ "TYPES.DESCRIPTION-TEMPLATE-VALIDATOR.ACTION" | translate }}</button>
<button type="button" mat-button class="rounded-btn lightblue-btn" (click)="validateId()" [disabled]="propertiesFormGroup?.get(field.id).get('externalIdentifier')?.get('identifier').disabled">{{ "TYPES.DESCRIPTION-TEMPLATE-VALIDATOR.ACTION" | translate }}</button>
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('externalIdentifier')?.get('identifier').hasError('backendError')">{{propertiesFormGroup?.get(field.id).get('externalIdentifier')?.get('identifier').getError('backendError').message}}</mat-error>
<mat-error *ngIf="propertiesFormGroup?.get(field.id).get('externalIdentifier')?.get('identifier').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div>

View File

@ -22,10 +22,10 @@
<div class="row">
<div class="col actions">
<div class="col-auto ml-auto">
<button mat-button type="button" class="cancel-btn" (click)="cancel()">{{ 'START-NEW-DESCRIPTION-DIALOG.ACTIONS.CANCEL' | translate }}</button>
<button mat-button type="button" class="rounded-btn neutral" (click)="cancel()">{{ 'START-NEW-DESCRIPTION-DIALOG.ACTIONS.CANCEL' | translate }}</button>
</div>
<div class="col-auto p-0">
<button mat-button [disabled]="!formGroup.valid" type="button" class="rounded-btn primary-inverted next-btn" (click)="next()">{{ 'START-NEW-DESCRIPTION-DIALOG.ACTIONS.NEXT' | translate }}</button>
<button mat-button [disabled]="!formGroup.valid" type="button" class="rounded-btn primary-inverted primary-inverted-hover" (click)="next()">{{ 'START-NEW-DESCRIPTION-DIALOG.ACTIONS.NEXT' | translate }}</button>
</div>
</div>
</div>

View File

@ -38,31 +38,6 @@
line-height: 1.9rem;
}
.cancel-btn {
background: #ffffff 0% 0% no-repeat padding-box;
border: 1px solid #b5b5b5;
border-radius: 30px;
min-width: 101px;
height: 43px;
color: #212121;
font-weight: 500;
}
.next-btn:hover {
background-color: var(--primary-color);
color: white;
}
// .disabled-btn {
// border: 1px solid #b5b5b5;
// border-radius: 30px;
// opacity: 1;
// min-width: 101px;
// height: 43px;
// color: #b5b5b5;
// font-weight: 500;
// }
.actions {
display: flex;
flex-direction: row;

View File

@ -223,19 +223,19 @@
<h3 class="m-0">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.FIELDS.QUERIES' | translate}}</h3>
</div>
<div class="col-auto">
<button mat-button type="button" class="action-btn" (click)="addQuery()" [disabled]="formGroup.get('queries').disabled">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.ADD-QUERY' | translate}}</button>
<button mat-button type="button" class="rounded-btn secondary" (click)="addQuery()" [disabled]="formGroup.get('queries').disabled">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.ADD-QUERY' | translate}}</button>
</div>
</div>
</div>
<div class="col-12">
<div *ngFor="let query of formGroup.get('queries').controls; let queryIndex=index;" class="row">
<div class="col-12">
<div class="row d-flex align-items-center">
<div class="row align-items-center">
<div class="col-auto d-flex">
<h4>{{'EXTERNAL-FETCHER-SOURCE-EDITOR.FIELDS.QUERY' | translate}} {{queryIndex + 1}}</h4>
<h4 class="m-0">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.FIELDS.QUERY' | translate}} {{queryIndex + 1}}</h4>
</div>
<div class="col-auto d-flex">
<button mat-icon-button class="action-list-icon" matTooltip="{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.REMOVE-QUERY' | translate}}" (click)="removeQuery(queryIndex)" [disabled]="formGroup.get('queries').disabled">
<button mat-icon-button matTooltip="{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.REMOVE-QUERY' | translate}}" (click)="removeQuery(queryIndex)" [disabled]="formGroup.get('queries').disabled">
<mat-icon>delete</mat-icon>
</button>
</div>
@ -260,12 +260,12 @@
</div>
<!-- Query Cases -->
<div class="row mb-2">
<div class="row align-items-center mb-2">
<div class="col-auto pr-0">
<h3 class="m-0">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.FIELDS.CASES' | translate}}</h3>
</div>
<div class="col-auto">
<button mat-button class="action-btn" type="button" (click)="addCase(queryIndex)" [disabled]="query.disabled">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.ADD-CASE' | translate}}</button>
<button mat-button class="rounded-btn secondary" type="button" (click)="addCase(queryIndex)" [disabled]="query.disabled">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.ADD-CASE' | translate}}</button>
</div>
</div>
<div *ngFor="let case of query.get('cases').controls; let caseIndex=index;" class="row">
@ -327,7 +327,7 @@
</div>
</div>
<div class="col-auto mb-4">
<button mat-icon-button class="action-list-icon" matTooltip="{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.REMOVE-CASE' | translate}}" (click)="removeCase(queryIndex, caseIndex)" [disabled]="query.disabled">
<button mat-icon-button matTooltip="{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.REMOVE-CASE' | translate}}" (click)="removeCase(queryIndex, caseIndex)" [disabled]="query.disabled">
<mat-icon>delete</mat-icon>
</button>
</div>
@ -354,7 +354,7 @@
</div>
</div>
<div class="col-auto d-flex">
<button mat-icon-button class="action-list-icon" matTooltip="{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.REMOVE-STATIC-ITEM' | translate}}" (click)="removeStaticItem(staticIndex)" [disabled]="formGroup.get('items').disabled">
<button mat-icon-button matTooltip="{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.REMOVE-STATIC-ITEM' | translate}}" (click)="removeStaticItem(staticIndex)" [disabled]="formGroup.get('items').disabled">
<mat-icon>delete</mat-icon>
</button>
</div>
@ -393,7 +393,7 @@
</mat-card-content>
</div>
</div>
<button mat-button class="action-btn" type="button" (click)="addStaticItem()" [disabled]="formGroup.get('items').disabled">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.ADD-STATIC-ITEM' | translate}}</button>
<button mat-button class="rounded-btn secondary" type="button" (click)="addStaticItem()" [disabled]="formGroup.get('items').disabled">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.ACTIONS.ADD-STATIC-ITEM' | translate}}</button>
</div>
<mat-error *ngIf="formGroup.get('items').dirty && formGroup.get('items').hasError('required')">{{'EXTERNAL-FETCHER-SOURCE-EDITOR.STATIC-ITEMS-REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('items').hasError('backendError')">{{formGroup.get('items').getError('backendError').message}}</mat-error>

View File

@ -1,18 +1,18 @@
.action-btn {
border-radius: 30px;
background-color: var(--secondary-color);
border: 1px solid transparent;
padding-left: 2em;
padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
// .action-btn {
// border-radius: 30px;
// background-color: var(--secondary-color);
// border: 1px solid transparent;
// padding-left: 2em;
// padding-right: 2em;
// box-shadow: 0px 3px 6px #1E202029;
transition-property: background-color, color;
transition-duration: 200ms;
transition-delay: 50ms;
transition-timing-function: ease-in-out;
&:disabled{
background-color: #CBCBCB;
color: #FFF;
border: 0px;
}
}
// transition-property: background-color, color;
// transition-duration: 200ms;
// transition-delay: 50ms;
// transition-timing-function: ease-in-out;
// &:disabled{
// background-color: #CBCBCB;
// color: #FFF;
// border: 0px;
// }
// }

View File

@ -11,6 +11,6 @@
<app-faq-content [isDialog]="isDialog"></app-faq-content>
</div>
<div mat-dialog-actions class="row">
<div class="ml-auto col-auto"><button mat-button tabindex="-1" mat-dialog-close class="cancel-btn" (click)="cancel()">{{'FAQ.CLOSE' | translate}}</button></div>
<div class="ml-auto col-auto"><button mat-button tabindex="-1" mat-dialog-close class="rounded-btn neutral" (click)="cancel()">{{'FAQ.CLOSE' | translate}}</button></div>
</div>
</div>

View File

@ -29,13 +29,3 @@
.faq {
margin: 1.125rem 0;
}
.cancel-btn {
background: #ffffff 0% 0% no-repeat padding-box;
border: 1px solid #b5b5b5;
border-radius: 30px;
min-width: 101px;
height: 43px;
color: #212121;
font-weight: 500;
}

View File

@ -54,7 +54,7 @@
</div>
<div class="row pt-4">
<div class="col"></div>
<div class="col-auto"><button mat-raised-button type="button" class="cancel-btn" (click)="cancel()">{{'PLAN-CLONE-DIALOG.ACTIONS.CANCEL' | translate}}</button></div>
<div class="col-auto"><button mat-raised-button type="button" class="confirm-btn" (click)="confirm()" color="accent">{{'PLAN-CLONE-DIALOG.ACTIONS.CLONE' | translate}}</button></div>
<div class="col-auto"><button mat-button type="button" class="rounded-btn neutral" (click)="cancel()">{{'PLAN-CLONE-DIALOG.ACTIONS.CANCEL' | translate}}</button></div>
<div class="col-auto"><button mat-button type="button" class="rounded-btn primary-inverted primary-inverted-hover" (click)="confirm()" color="accent">{{'PLAN-CLONE-DIALOG.ACTIONS.CLONE' | translate}}</button></div>
</div>
</div>

View File

@ -20,31 +20,7 @@
opacity: 0.81;
margin-bottom: 0.625rem;
}
.cancel-btn {
min-width: 101px;
height: 43px;
background: #ffffff;
border: 1px solid #b5b5b5;
border-radius: 30px;
opacity: 1;
}
.confirm-btn {
min-width: 84px;
height: 43px;
background: #ffffff;
color: var(--primary-color);
border: 1px solid var(--primary-color);
border-radius: 30px;
opacity: 1;
}
.confirm-btn:hover {
background-color: var(--primary-color);
color: #ffffff;
}
::ng-deep label {
margin: 0;
}

View File

@ -12,8 +12,9 @@
<app-plan-user-field-component [form]="formGroup" [validationErrorModel]="editorModel.validationErrorModel" [sections]="selectedBlueprint?.definition?.sections" [viewOnly]="false" [initializeUsers]="true" [enableSorting]="false"></app-plan-user-field-component>
</div>
<div class="col mt-2">
<button mat-raised-button *ngIf="hasValue()" [disabled]="inProgressSendButton" (click)="send()" type="button" class="invite-btn">{{'PLAN-USER-INVITATION-DIALOG.ACTIONS.INVITE' | translate}}</button>
<button mat-button *ngIf="hasValue()" [disabled]="inProgressSendButton" (click)="send()" type="button" class="rounded-btn primary-inverted primary-inverted-hover">{{'PLAN-USER-INVITATION-DIALOG.ACTIONS.INVITE' | translate}}</button>
<mat-error *ngIf="formGroup.get('users').hasError('backendError')">{{formGroup.get('users').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('users').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div>
</div>
</div>
</div>

View File

@ -69,35 +69,6 @@
padding-bottom: 0 !important;
}
.invite-btn {
background: #ffffff 0% 0% no-repeat padding-box;
border: 1px solid var(--primary-color);
border-radius: 30px;
opacity: 1;
min-width: 101px;
height: 43px;
color: var(--primary-color);
font-weight: 500;
}
.invite-btn-disabled {
min-width: 6.64em;
height: 2.93em;
background: #ffffff;
border: 1px solid #b5b5b5;
border-radius: 30px;
font-weight: bold;
letter-spacing: -0.35px;
color: #b5b5b5;
margin-bottom: 0.25em;
cursor: default;
}
.invite-btn:hover {
background: var(--primary-color);
color: #ffffff;
}
@keyframes blink {
0% {
border: 1px solid rgba(255, 0, 0, 0.2);

View File

@ -60,9 +60,9 @@
<button *ngIf="canCreateNewVersion()" mat-menu-item (click)="newVersionClicked()">
<mat-icon>queue</mat-icon>{{'PLAN-LISTING.ACTIONS.NEW-VERSION' | translate}}
</button>
<button mat-menu-item (click)="viewVersions(plan)">
<a mat-menu-item [routerLink]="viewVersionsUrl(plan)" target="_blank">
<mat-icon>library_books</mat-icon>{{'PLAN-LISTING.ACTIONS.VIEW-VERSION' | translate}}
</button>
</a>
<button mat-menu-item *ngIf="isDraftPlan(plan) && canDeletePlan()" (click)="deleteClicked(plan.id)" class="menu-item">
<mat-icon>delete</mat-icon>{{ 'PLAN-LISTING.ACTIONS.DELETE' | translate }}
</button>

View File

@ -121,6 +121,16 @@ export class PlanListingItemComponent extends BaseComponent implements OnInit {
}
}
viewVersionsUrl(plan: Plan): string {
if (plan.accessType == PlanAccessType.Public && plan.status == PlanStatusEnum.Finalized && !this.plan.authorizationFlags?.some(x => x === AppPermission.EditPlan)) {
let url = this.router.createUrlTree(['/explore-plans/versions/', plan.groupId]);
return url.toString();
} else {
let url = this.router.createUrlTree(['/plans/versions/', plan.groupId]);
return url.toString();
}
}
isUserPlanRelated() {
const principalId: Guid = this.authentication.userId();
return this.plan.planUsers?.some(x => (x.user.id === principalId));

View File

@ -87,7 +87,7 @@
</div>
<div class="row pt-4">
<div class="col"></div>
<div class="col-auto"><button mat-raised-button type="button" class="cancel-btn" (click)="cancel()">{{'PLAN-NEW-VERSION-DIALOG.ACTIONS.CANCEL' | translate}}</button></div>
<div class="col-auto"><button mat-raised-button type="button" class="confirm-btn" (click)="confirm()" color="accent">{{'PLAN-NEW-VERSION-DIALOG.ACTIONS.NEW-VERSION' | translate}}</button></div>
<div class="col-auto"><button mat-raised-button type="button" class="rounded-btn neutral" (click)="cancel()">{{'PLAN-NEW-VERSION-DIALOG.ACTIONS.CANCEL' | translate}}</button></div>
<div class="col-auto"><button mat-raised-button type="button" class="rounded-btn primary-inverted primary-inverted-hover" (click)="confirm()">{{'PLAN-NEW-VERSION-DIALOG.ACTIONS.NEW-VERSION' | translate}}</button></div>
</div>
</div>

View File

@ -21,30 +21,6 @@
margin-bottom: 0.625rem;
}
.cancel-btn {
min-width: 101px;
height: 43px;
background: #ffffff;
border: 1px solid #b5b5b5;
border-radius: 30px;
opacity: 1;
}
.confirm-btn {
min-width: 84px;
height: 43px;
background: #ffffff;
color: var(--primary-color);
border: 1px solid var(--primary-color);
border-radius: 30px;
opacity: 1;
}
.confirm-btn:hover {
background-color: var(--primary-color);
color: #ffffff;
}
::ng-deep label {
margin: 0;
}

View File

@ -3,7 +3,7 @@
<div class="confirmation-message align-self-center">
<h4>{{'PLAN-UPLOAD.TITLE' | translate}}</h4>
</div>
<div class="close-btn justify-content-end">
<div class="justify-content-end">
<button mat-icon-button tabindex="-1" (click)="close()">
<mat-icon>close</mat-icon>
</button>
@ -84,7 +84,7 @@
<button mat-button type="button" class="rounded-btn neutral" (click)="cancel()">{{'PLAN-UPLOAD.ACTIONS.CANCEL' | translate}}</button>
</div>
<div class="col-auto">
<button mat-button type="button" (click)="confirm()" [disabled]="disableConfirmButton()" class="rounded-btn primary-inverted next-btn">{{'PLAN-UPLOAD.ACTIONS.IMPORT' | translate}}</button>
<button mat-button type="button" (click)="confirm()" [disabled]="disableConfirmButton()" class="rounded-btn primary-inverted primary-inverted-hover">{{'PLAN-UPLOAD.ACTIONS.IMPORT' | translate}}</button>
</div>
</div>
</div>

View File

@ -22,26 +22,6 @@
}
}
.close-btn {
margin-left: auto;
cursor: pointer;
}
.cancel-btn {
background: #ffffff 0% 0% no-repeat padding-box;
border: 1px solid #b5b5b5;
border-radius: 30px;
min-width: 101px;
height: 43px;
color: #212121;
font-weight: 500;
}
.next-btn:hover {
background-color: var(--primary-color);
color: #ffffff;
}
.attach-btn {
top: -20px;
}

View File

@ -13,11 +13,11 @@
<div class="col-12 col-xl mt-3">
<mat-form-field class="w-100">
<mat-label>{{'PLAN-CONTACT-PREFILL-DIALOG.FIELDS.USER' | translate}}</mat-label>
<app-single-auto-complete [formControl]="formGroup" [configuration]="singleAutoCompletePlanAssociatedUserConfiguration"></app-single-auto-complete>
<app-single-auto-complete [(ngModel)]="selectedUser" [configuration]="singleAutoCompletePlanAssociatedUserConfiguration"></app-single-auto-complete>
</mat-form-field>
</div>
<div class="row" style="justify-content: space-between;">
<div class="col-auto"><button mat-raised-button type="button" class="cancel-btn" (click)="cancel()">{{'PLAN-CONTACT-PREFILL-DIALOG.ACTIONS.CANCEL' | translate}}</button></div>
<div class="col-auto"><button mat-raised-button type="button" (click)="confirm()" class="delete-btn">{{'PLAN-CONTACT-PREFILL-DIALOG.ACTIONS.CONFIRM' | translate}}</button></div>
<div class="col-auto"><button mat-button type="button" class="rounded-btn neutral" (click)="cancel()">{{'PLAN-CONTACT-PREFILL-DIALOG.ACTIONS.CANCEL' | translate}}</button></div>
<div class="col-auto"><button mat-button type="button" [disabled]="!selectedUser" (click)="confirm()" class="rounded-btn primary-inverted">{{'PLAN-CONTACT-PREFILL-DIALOG.ACTIONS.CONFIRM' | translate}}</button></div>
</div>
</div>

View File

@ -7,38 +7,13 @@
padding-bottom: 20px;
}
.close-btn {
margin-left: auto;
cursor: pointer;
}
.cancel {
background-color: #aaaaaa;
color: #ffffff;
}
.cancel-btn {
min-width: 101px;
height: 43px;
background: #ffffff;
border: 1px solid #b5b5b5;
border-radius: 30px;
opacity: 1;
}
.delete {
background-color: #ba2c2c;
color: #ffffff;
}
.delete-btn {
min-width: 101px;
height: 43px;
background: #ffffff;
color: #ba2c2c;
border: 1px solid #ba2c2c;
border-radius: 30px;
opacity: 1;
}
}

View File

@ -5,11 +5,7 @@ import { UserService } from '@app/core/services/user/user.service';
import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration';
import { map } from 'rxjs';
import { PlanAssociatedUser } from '@app/core/model/user/user';
import { UntypedFormGroup } from '@angular/forms';
import { PlanContactPrefillDialogEditorModel } from './plan-contact-prefill-dialog.editor.model';
import { FormService } from '@common/forms/form-service';
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
import { PlanBlueprintSystemFieldType } from '@app/core/common/enum/plan-blueprint-system-field-type';
@Component({
selector: 'app-plan-contact-prefill-dialog',
@ -18,34 +14,32 @@ import { PlanBlueprintSystemFieldType } from '@app/core/common/enum/plan-bluepri
})
export class PlanContactPrefillDialogComponent extends BaseComponent {
formGroup: UntypedFormGroup;
contactFormGroup: UntypedFormGroup;
label: string;
selectedUser: PlanAssociatedUser;
singleAutoCompletePlanAssociatedUserConfiguration: SingleAutoCompleteConfiguration = {
initialItems: (data?: any) => this.userService.queryPlanAssociated(this.userService.buildAutocompleteLookup()).pipe(map(x => x.items)),
filterFn: (searchQuery: string, data?: any) => this.userService.queryPlanAssociated(this.userService.buildAutocompleteLookup(searchQuery)).pipe(map(x => x.items)),
getSelectedItem: (selectedItem: any) => this.userService.queryPlanAssociated(this.userService.buildAutocompleteLookup(null, null, [selectedItem.id])).pipe(map(x => x.items[0])),
displayFn: (item: PlanAssociatedUser) => item.name,
subtitleFn: (item: PlanAssociatedUser) => item.email,
titleFn: (item: PlanAssociatedUser) => item.name,
valueAssign: (item: PlanAssociatedUser) => item,
uniqueAssign: (item: PlanAssociatedUser) => item.id
singleAutoCompletePlanAssociatedUserConfiguration: SingleAutoCompleteConfiguration;
}; constructor(
constructor(
private userService: UserService,
private formService: FormService,
public enumUtils: EnumUtils,
public dialogRef: MatDialogRef<PlanContactPrefillDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any
) {
super();
this.contactFormGroup = data.contactFormGroup;
this.label = data.label;
}
ngOnInit(): void {
this.formGroup = new PlanContactPrefillDialogEditorModel().buildForm();
this.singleAutoCompletePlanAssociatedUserConfiguration = {
initialItems: (data?: any) => this.userService.queryPlanAssociated(this.userService.buildAutocompleteLookup()).pipe(map(x => x.items)),
filterFn: (searchQuery: string, data?: any) => this.userService.queryPlanAssociated(this.userService.buildAutocompleteLookup(searchQuery)).pipe(map(x => x.items)),
getSelectedItem: (selectedItem: any) => this.userService.queryPlanAssociated(this.userService.buildAutocompleteLookup(null, null, [selectedItem.id])).pipe(map(x => x.items[0])),
displayFn: (item: PlanAssociatedUser) => item.name,
subtitleFn: (item: PlanAssociatedUser) => item.email,
titleFn: (item: PlanAssociatedUser) => item.name,
valueAssign: (item: PlanAssociatedUser) => item,
uniqueAssign: (item: PlanAssociatedUser) => item.id
};
}
cancel() {
@ -53,14 +47,6 @@ export class PlanContactPrefillDialogComponent extends BaseComponent {
}
confirm() {
this.formService.touchAllFormFields(this.formGroup);
if (!this.formGroup.valid) { return; }
this.contactFormGroup.get('firstName').patchValue(this.formGroup.get('name').value);
this.contactFormGroup.get('lastName').patchValue(null);
this.contactFormGroup.get('email').patchValue(this.formGroup.get('email').value);
this.dialogRef.close(true);
this.dialogRef.close(this.selectedUser);
}
}

View File

@ -1,38 +0,0 @@
import { UntypedFormBuilder, UntypedFormGroup, Validators } from "@angular/forms";
import { PlanAssociatedUser } from "@app/core/model/user/user";
import { BackendErrorValidator } from '@common/forms/validation/custom-validator';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { Validation, ValidationContext } from '@common/forms/validation/validation-context';
import { Guid } from "@common/types/guid";
export class PlanContactPrefillDialogEditorModel implements PlanAssociatedUser {
id: Guid;
name: string;
email: string;
public validationErrorModel: ValidationErrorModel = new ValidationErrorModel();
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
constructor() { }
buildForm(context: ValidationContext = null, disabled: boolean = false): UntypedFormGroup {
if (context == null) { context = this.createValidationContext(); }
return this.formBuilder.group({
id: [{ value: this.id, disabled: disabled }, context.getValidation('id').validators],
name: [{ value: this.name, disabled: disabled }, context.getValidation('name').validators],
email: [{ value: this.email, disabled: disabled }, context.getValidation('email').validators],
});
}
createValidationContext(): ValidationContext {
const baseContext: ValidationContext = new ValidationContext();
const baseValidationArray: Validation[] = new Array<Validation>();
baseValidationArray.push({ key: 'id', validators: [Validators.required, BackendErrorValidator(this.validationErrorModel, 'id')] });
baseValidationArray.push({ key: 'name', validators: [Validators.required, BackendErrorValidator(this.validationErrorModel, 'name')] });
baseValidationArray.push({ key: 'email', validators: [Validators.required, BackendErrorValidator(this.validationErrorModel, 'email')] });
baseContext.validation = baseValidationArray;
return baseContext;
}
}

View File

@ -249,12 +249,14 @@
<mat-error *ngIf="formGroup.get('language').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div *ngIf="field.systemFieldType == planBlueprintSystemFieldTypeEnum.Contact">
<div *ngIf="field.systemFieldType == planBlueprintSystemFieldTypeEnum.Contact" class="row">
<div cdkDropList class="col-12" (cdkDropListDropped)="dropContacts($event)">
<div *ngFor="let contact of formGroup.get('properties').get('contacts').controls; let contactIndex=index;" cdkDrag class="row align-items-center" [cdkDragDisabled]="formGroup.disabled || !canEdit" (mouseenter)="onContactHover(contactIndex)" (mouseleave)="clearHoveredContact()">
<div class="col-12 col-xl-auto pr-0">
<span *ngIf="!isContactSelected(contactIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.15rem 0.435rem 0.3rem 0.435rem;">{{contactIndex + 1}}</span>
<mat-icon *ngIf="isContactSelected(contactIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled || !canEdit}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
<span *ngIf="!isContactSelected(contactIndex)" class="ml-2" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.15rem 0.435rem 0.3rem 0.435rem;">{{contactIndex + 1}}</span>
<span *ngIf="isContactSelected(contactIndex)" class="ml-2">
<mat-icon [ngClass]="{'drag-handle-disabled': formGroup.disabled || !canEdit}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
</span>
</div>
<div class="col pt-3">
<div class="row">
@ -298,12 +300,10 @@
<mat-error *ngIf="formGroup.get('properties').get('contacts').hasError('backendError')">{{formGroup.get('properties').get('contacts').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('properties').get('contacts').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div>
<div class="row">
<div class="col">
<button mat-icon-button (click)="addContact()" [disabled]="formGroup.disabled || isFinalized || (!this.canSave && !isNew)">
<mat-icon>add</mat-icon>
</button>
</div>
<div class="col-12">
<button mat-icon-button (click)="addContact()" [disabled]="formGroup.disabled || isFinalized || (!this.canSave && !isNew)">
<mat-icon>add</mat-icon>
</button>
</div>
</div>
<div *ngIf="field.systemFieldType == planBlueprintSystemFieldTypeEnum.AccessRights">

View File

@ -59,6 +59,7 @@ import { PlanEditorModel, PlanFieldIndicator } from './plan-editor.model';
import { PlanEditorService } from './plan-editor.service';
import { PlanEditorEntityResolver } from './resolvers/plan-editor-enitity.resolver';
import { FormAnnotationService } from '@app/ui/annotations/annotation-dialog-component/form-annotation.service';
import { PlanAssociatedUser } from '@app/core/model/user/user';
@Component({
selector: 'app-plan-editor',
@ -656,12 +657,16 @@ export class PlanEditorComponent extends BaseEditor<PlanEditorModel, Plan> imple
maxWidth: '700px',
maxHeight: '80vh',
data: {
contactFormGroup: (this.formGroup.get('properties').get('contacts') as FormArray).at(contactIndex),
label: field.label
}
});
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe((result: Plan) => {
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe((result: PlanAssociatedUser) => {
if (result) {
const contactFormGroup = (this.formGroup.get('properties').get('contacts') as FormArray).at(contactIndex);
contactFormGroup.get('firstName').patchValue(result?.name);
contactFormGroup.get('lastName').patchValue(null);
contactFormGroup.get('email').patchValue(result?.email);
this.uiNotificationService.snackBarNotification(this.language.instant('PLAN-EDITOR.SNACK-BAR.SUCCESSFUL-PLAN-CONTACT'), SnackBarNotificationLevel.Success);
}
});

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -874,7 +874,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -922,7 +922,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -876,7 +876,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"
@ -915,7 +915,7 @@
"FIELDS": {
"NAME": "Name",
"DESCRIPTION": "Description",
"STATUS": "Status",
"INTERNAL-STATUS": "Internal Status",
"UPDATED-AT": "Updated",
"CREATED-AT": "Created",
"IS-ACTIVE": "Is Active"

View File

@ -24,9 +24,9 @@
<div *ngIf="!agreePrivacyPolicyNames" class="required-policy">{{'GENERAL.CONFIRMATION-DIALOG.ACTIONS.REQUIRED' | translate}}</div>
</div>
<div class="row" style="justify-content: space-between;">
<div class="col-auto"><button mat-raised-button type="button" class="cancel-btn" (click)="cancel()">{{ data.cancelButton }}</button></div>
<div *ngIf="data.isDeleteConfirmation" class="col-auto"><button mat-raised-button type="button" (click)="confirm()" class="delete-btn">{{ data.confirmButton }}</button></div>
<div *ngIf="!data.isDeleteConfirmation && !data.privacyPolicyNames" class="col-auto"><button mat-raised-button type="button" (click)="confirm()" class="submit-btn">{{ data.confirmButton }}</button></div>
<div *ngIf="!data.isDeleteConfirmation && data.privacyPolicyNames" class="col-auto"><button mat-raised-button type="button" [disabled]="!agreePrivacyPolicyNames" (click)="confirm()" class="submiit-btn">{{ data.confirmButton }}</button></div>
<div class="col-auto"><button mat-button type="button" class="rounded-btn neutral" (click)="cancel()">{{ data.cancelButton }}</button></div>
<div *ngIf="data.isDeleteConfirmation" class="col-auto"><button mat-button type="button" (click)="confirm()" class="rounded-btn delete">{{ data.confirmButton }}</button></div>
<div *ngIf="!data.isDeleteConfirmation && !data.privacyPolicyNames" class="col-auto"><button mat-button type="button" (click)="confirm()" class="rounded-btn primary-inverted primary-inverted-hover">{{ data.confirmButton }}</button></div>
<div *ngIf="!data.isDeleteConfirmation && data.privacyPolicyNames" class="col-auto"><button mat-button type="button" [disabled]="!agreePrivacyPolicyNames" (click)="confirm()" class="rounded-btn primary-inverted primary-inverted-hover">{{ data.confirmButton }}</button></div>
</div>
</div>

View File

@ -17,15 +17,6 @@
color: #ffffff;
}
.cancel-btn {
min-width: 101px;
height: 43px;
background: #ffffff;
border: 1px solid #b5b5b5;
border-radius: 30px;
opacity: 1;
}
.confirm {
background-color: #2cba6c;
color: #ffffff;
@ -45,33 +36,4 @@
font-size: smaller;
color: #f44336;
}
.submit-btn {
min-width: 101px;
height: 43px;
background: #ffffff;
color: var(--primary-color);
border: 1px solid var(--primary-color);
border-radius: 30px;
opacity: 1;
}
.submit-btn[disabled] {
border: 1px solid #b5b5b5 !important;
}
.submit-btn:not([disabled]):hover {
background-color: var(--primary-color);
color: #ffffff;
}
.delete-btn {
min-width: 101px;
height: 43px;
background: #ffffff;
color: #ba2c2c;
border: 1px solid #ba2c2c;
border-radius: 30px;
opacity: 1;
}
}

View File

@ -6,16 +6,16 @@
<app-navigation-breadcrumb />
</div>
<div class="col-auto">
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
<button mat-button class="rounded-btn secondary" (click)="cancel()" type="button">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
</div>
<div class="col-auto" *ngIf="canDelete">
<button mat-button class="action-btn" type="button" (click)="delete()">
<button mat-button class="rounded-btn secondary" type="button" (click)="delete()">
<mat-icon>delete</mat-icon>
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.DELETE' | translate}}
</button>
</div>
<div class="col-auto" *ngIf="canSave">
<button mat-button class="action-btn" (click)="formSubmit()">
<button mat-button class="rounded-btn secondary" (click)="formSubmit()">
<mat-icon>save</mat-icon>
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.SAVE' | translate}}
</button>

View File

@ -19,21 +19,3 @@
background-color: #b0b0b0;
}
.action-btn {
border-radius: 30px;
background-color: var(--secondary-color);
border: 1px solid transparent;
padding-left: 2em;
padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
transition-property: background-color, color;
transition-duration: 200ms;
transition-delay: 50ms;
transition-timing-function: ease-in-out;
&:disabled{
background-color: #CBCBCB;
color: #FFF;
border: 0px;
}
}

View File

@ -98,9 +98,9 @@
<mat-icon>more_horiz</mat-icon>
</button>
<mat-menu #actionsMenu="matMenu">
<button *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/notification-templates/', row.id])">
<a *ngIf="canEdit(row)" mat-menu-item [routerLink]="routerUtils.generateUrl(['/notification-templates/', row.id])">
<mat-icon>edit</mat-icon>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.ACTIONS.EDIT' | translate}}
</button>
</a>
<button *ngIf="canDelete(row)" mat-menu-item (click)="deleteType(row.id)">
<mat-icon>delete</mat-icon>
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -458,6 +458,10 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
border: 1px solid #CBCBCB;
color: #CBCBCB;
}
&.primary-inverted-hover:hover {
background-color: var(--primary-color);
color: white;
}
}