Files
print-calculator/frontend/src/app/features/calculator/calculator-page.component.html

100 lines
3.3 KiB
HTML

<div class="container ui-simple-hero">
<h1 class="ui-simple-hero__title">{{ "CALC.TITLE" | translate }}</h1>
<p class="ui-simple-hero__subtitle">{{ "CALC.SUBTITLE" | translate }}</p>
@if (error()) {
<app-alert type="error">{{ errorKey() | translate }}</app-alert>
}
</div>
@if (step() === "success") {
<div class="container ui-simple-hero">
<app-success-state
context="calc"
(action)="onNewQuote()"
></app-success-state>
</div>
} @else {
<div class="container content-grid">
<!-- Left Column: Input -->
<div class="col-input">
<app-card>
<div class="mode-selector">
<div
class="mode-option"
[class.active]="mode() === 'easy'"
[class.disabled]="cadSessionLocked()"
(click)="switchMode('easy')"
>
{{ "CALC.MODE_EASY" | translate }}
</div>
<div
class="mode-option"
[class.active]="mode() === 'advanced'"
[class.disabled]="cadSessionLocked()"
(click)="switchMode('advanced')"
>
{{ "CALC.MODE_ADVANCED" | translate }}
</div>
</div>
<app-upload-form
#uploadForm
[mode]="mode()"
[lockedSettings]="cadSessionLocked()"
[loading]="loading()"
[uploadProgress]="uploadProgress()"
(submitRequest)="onCalculate($event)"
(itemQuantityChange)="onUploadItemQuantityChange($event)"
(printSettingsChange)="onUploadPrintSettingsChange($event)"
(itemSettingsDiffChange)="onItemSettingsDiffChange($event)"
></app-upload-form>
</app-card>
</div>
<!-- Right Column: Result or Info -->
<div class="col-result" #resultCol>
@if (loading()) {
<app-card class="loading-state">
<div class="loader-content">
<div class="spinner"></div>
<h3 class="loading-title">
{{ "CALC.ANALYZING_TITLE" | translate }}
</h3>
<p class="loading-text">{{ "CALC.ANALYZING_TEXT" | translate }}</p>
</div>
</app-card>
} @else if (result()) {
<app-quote-result
[result]="result()!"
[recalculationRequired]="requiresRecalculation()"
[itemSettingsDiffByFileName]="itemSettingsDiffByFileName()"
(consult)="onConsult()"
(proceed)="onProceed()"
(itemQuantityPreviewChange)="onQuoteItemQuantityPreviewChange($event)"
(itemChange)="onItemChange($event)"
></app-quote-result>
} @else if (isZeroQuoteError()) {
<app-card class="zero-result-card">
<h3>{{ "CALC.ZERO_RESULT_TITLE" | translate }}</h3>
<p>{{ "CALC.ZERO_RESULT_HELP" | translate }}</p>
<div class="zero-result-action">
<app-button variant="outline" (click)="onConsult()">
{{ "QUOTE.CONSULT" | translate }}
</app-button>
</div>
</app-card>
} @else {
<app-card>
<h3>{{ "CALC.BENEFITS_TITLE" | translate }}</h3>
<ul class="benefits">
<li>{{ "CALC.BENEFITS_1" | translate }}</li>
<li>{{ "CALC.BENEFITS_2" | translate }}</li>
<li>{{ "CALC.BENEFITS_3" | translate }}</li>
</ul>
</app-card>
}
</div>
</div>
}