libs/common/frame/src/frame-parts/offer-code/offer-code.component.ts
| selector | frame-offer-code |
| styleUrls | ./offer-code.component.scss |
| templateUrl | ./offer-code.component.html |
Properties |
Inputs |
| offerCode$ | |
Type : Observable<string | undefined>
|
|
| pageId$ |
Type : Observable<string>
|
import { TalyPageDataService } from '@allianz/taly-core';
import { Component, Input, OnInit, inject } from '@angular/core';
import { Observable } from 'rxjs';
@Component({
selector: 'frame-offer-code',
templateUrl: './offer-code.component.html',
styleUrls: ['./offer-code.component.scss'],
standalone: false
})
export class OfferCodeComponent implements OnInit {
private readonly talyPageDataService = inject(TalyPageDataService);
@Input() offerCode$!: Observable<string | undefined>;
pageId$!: Observable<string>;
ngOnInit(): void {
this.pageId$ = this.talyPageDataService.pageId$;
}
}
<p
nxCopytext
data-testid="offerCode"
class="offer-code"
*aclTag="(pageId$ | async) + '/offer-code'"
>
<span class="nx-font-weight-semibold" i18n="@@frame.offer-code">Your proposal code is:</span>
{{ offerCode$ | async }}
</p>
./offer-code.component.scss
@use '../../../styles/breakpoints.scss' as *;
@use '../../../styles/spacing.scss' as *;
:host {
display: flex;
justify-content: center;
}
.offer-code {
text-align: center;
margin-bottom: var(--vertical-outer-section-spacing);
max-width: 100%;
width: var(--grid-max-width);
margin-left: auto;
margin-right: auto;
}