feat(layout): enhance topbar with customizable templates and full-page support

- Updated app.layout.component.html to include start, center, and end templates for the topbar.
- Modified app.layout.component.ts to manage new template references and added isFullPage getter.
- Refactored app.topbar.component.html to utilize new templates and improved layout structure.
- Enhanced app.topbar.component.ts to accept new input properties for templates.
- Updated layout.service.ts to manage full-page state and new topbar slots.
- Added new payment bridge services for POS functionality.
- Introduced greater validator for form validation.
- Improved dialog component to support mobile drawer and responsive design.
- Updated styles for better mobile support and layout adjustments.
- Added new main menu sidebar for POS with dynamic content.
This commit is contained in:
2026-04-30 16:27:42 +03:30
parent c89d4027d6
commit 8104f1b7a7
56 changed files with 1130 additions and 434 deletions
@@ -1,6 +1,20 @@
<uikit-field [label]="label" [name]="name" [control]="control" [showLabel]="!!label" [showErrors]="showErrors">
@if (labelSuffix) {
<ng-template #labelView>
<div class="flex gap-1 items-center">
<uikit-label [name]="name">
@if (labelTextView) {
<ng-container [ngTemplateOutlet]="labelTextView"></ng-container>
} @else {
{{ label }}
}
</uikit-label>
<ng-container [ngTemplateOutlet]="labelSuffix"></ng-container>
</div>
</ng-template>
}
@if (type === "switch") {
<p-toggleSwitch [formControl]="control" />
<p-toggleSwitch [attr.disabled]="disabled" [formControl]="control" />
} @else {
<p-inputgroup>
<!-- [minlength]="minlength || null" -->
@@ -13,6 +27,7 @@
[attr.placeholder]="preparedPlaceholder"
[attr.type]="htmlType"
[attr.autocomplete]="autocomplete"
[attr.disabled]="disabled"
[class]="` w-full ${size === 'large' ? 'p-inputtext-lg' : size === 'small' ? 'p-inputtext-sm' : ''}`"
[required]="isRequired"
[invalid]="control.invalid && (control.touched || control.dirty)"
@@ -30,6 +45,7 @@
[attr.inputmode]="inputMode"
[attr.maxlength]="preparedMaxLength || null"
[attr.type]="htmlType"
[attr.disabled]="disabled"
[attr.autocomplete]="autocomplete"
[classList]="
[
@@ -1,5 +1,6 @@
import { Maybe } from '@/core';
import { ToastService } from '@/core/services/toast.service';
import { UikitLabelComponent } from '@/uikit';
import { UikitFieldComponent } from '@/uikit/uikit-field.component';
import { CommonModule } from '@angular/common';
import {
@@ -35,6 +36,7 @@ import { ToggleSwitch } from 'primeng/toggleswitch';
InputNumberModule,
KeyFilterModule,
InputMaskModule,
UikitLabelComponent,
],
templateUrl: './input.component.html',
})
@@ -69,6 +71,8 @@ export class InputComponent {
@Output() blur = new EventEmitter<void>();
@ContentChild('suffixTemp', { static: true }) suffixTemp!: TemplateRef<any> | null;
@ContentChild('labelSuffix', { static: false }) labelSuffix!: TemplateRef<any> | null;
@ContentChild('labelTextView', { static: false }) labelTextView!: TemplateRef<any> | null;
private readonly toastService = inject(ToastService);
@@ -202,14 +206,14 @@ export class InputComponent {
const minValidator = (this.min || this.min === 0) && parseFloat(value) < this.min!;
const maxValidator = (this.max || this.max === 0) && parseFloat(value) > this.max;
if (minValidator || maxValidator) {
if (minValidator) {
this.toastService.warn({
text: `مقدار ${this.label} نمی‌تواند بیشتر از ${this.min} باشد.`,
});
}
if (maxValidator) {
this.toastService.warn({
text: `مقدار ${this.label} نمی‌تواند کمتر از ${this.max} باشد.`,
text: `مقدار ${this.label} نمی‌تواند بیشتر از ${this.max} باشد.`,
});
}
if (minValidator) {
this.toastService.warn({
text: `مقدار ${this.label} نمی‌تواند کمتر از ${this.min} باشد.`,
});
}
@@ -233,8 +237,12 @@ export class InputComponent {
}
if (replacedTargetValue !== null) {
console.log(replacedTargetValue);
// @ts-ignore
this.$event.value = replacedTargetValue;
$event.value = replacedTargetValue;
// @ts-ignore
$event.target.value = replacedTargetValue;
}
}
}