Appearance
Screen Templates
| Backlog field | Value |
|---|---|
| Story ID | AP-TPL-003 |
| Epic | Dynamic Templates |
| Story type | Master data / configuration |
| Review status | Draft - business analyst and business owner review required |
| Source evidence | AppsPortal.Apis controller, application command/query handlers, validators, domain entities, and matching MFE workflow where available |
| Last source review | 2026-07-10 |
User story
As application administrators, I want to configure supported transaction screen layouts so that users see the approved data-entry structure.
Acceptance criteria
- Only authorized users can view or execute the feature's actions.
- Required business data, active dependencies, tenant/branch scope, and current document state are validated.
- Invalid requests return actionable validation errors without applying a partial change.
- Search, list, view, print, and export operations use the same authorized business scope.
- Material create, edit, status, approval, posting, reversal, and integration actions are auditable where applicable.
- Financial or stock effects are applied atomically and no more than once.
Business rules
Required
Module, screen, template identity, active/version state, and valid field configuration are required.
Optional or conditional
Field order, visibility, labels, defaults, and optional sections are configurable where supported.
Action behavior
Publish/activate changes future screen rendering; Draft template edits do not change business records.
Blocking rule or downstream effect
A template cannot remove server-required fields or bypass validation/authorization.
Frontend page coverage
The following UI coverage is sourced from the pulled MFE route configuration. A Module-level supporting artifact mapping is evidence of a reachable screen, but requires BA confirmation that it belongs to this story rather than a more specific feature story.
| Route/page | Component | Mode | Route permission/guard | Mapping confidence | Source |
|---|---|---|---|---|---|
| add/:screenConfigId/:screen | ReportBuilderComponent | Report/print | Permission: AppTemplatesPermissions.ReportTemplates_Add; Guards: PolicyAuthGuard | Feature token match | apps/templates/src/app/remote-entry/report-templates/report-templates-routing.module.ts:39 |
| add/:screenConfigId/:screen/:presetId | ReportBuilderComponent | Report/print | Permission: AppTemplatesPermissions.ReportTemplates_Add; Guards: PolicyAuthGuard | Feature token match | apps/templates/src/app/remote-entry/report-templates/report-templates-routing.module.ts:50 |
Observed frontend fields and validation
| Component | Control | Observed frontend rule | Component source |
|---|---|---|---|
| ReportBuilderComponent | alignment | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | backgroundColor | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | bold | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | color | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | columnKey | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | description | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | fontColor | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | fontFamily | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | fontSize | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | footerEmail | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | footerWebsite | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | headerBackgroundColor | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | headerBold | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | headerFontColor | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | headerFontFamily | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | headerFontSize | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | isDefault | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | isDescending | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | italic | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | name | Required in component validator | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | notes | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | numberFormat | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | opacity | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | operator | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | pageName | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showClientName | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showCompanyInfo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showCustomerInfo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showDate | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showFooter | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showFooterLogo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showInvoiceNo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showLogo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showMainInfo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showQr | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showRefundNo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | showStatus | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | signatureEnabled | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | signatureLabel | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | text | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | type | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | value | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | valueTo | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | width | Visible control; optional or API-dependent | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
Observed frontend actions
| Component | Click action/handler | Business review requirement | Component source |
|---|---|---|---|
| ReportBuilderComponent | addAggregationRow | Document the enabled state, permission, input context, resulting API or navigation effect, success refresh, and concrete failure behavior for this handler. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | addColumnRow | Document the enabled state, permission, input context, resulting API or navigation effect, success refresh, and concrete failure behavior for this handler. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | addFilterRow | Document the enabled state, permission, input context, resulting API or navigation effect, success refresh, and concrete failure behavior for this handler. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | addGroupRow | Document the enabled state, permission, input context, resulting API or navigation effect, success refresh, and concrete failure behavior for this handler. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | addSortRow | Document the enabled state, permission, input context, resulting API or navigation effect, success refresh, and concrete failure behavior for this handler. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | printPreview | Open the authorized record in view mode with its status, totals, lines, source and generated-document links; handle deleted, forbidden, and missing records without exposing stale data. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | removeAggregation | Available only in deletable states with Delete permission; identify the record in confirmation, call delete once, remove/refresh the list row on success, and retain the row with the API reason on failure. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | removeColumn | Available only in deletable states with Delete permission; identify the record in confirmation, call delete once, remove/refresh the list row on success, and retain the row with the API reason on failure. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | removeFilter | Available only in deletable states with Delete permission; identify the record in confirmation, call delete once, remove/refresh the list row on success, and retain the row with the API reason on failure. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | removeGroup | Available only in deletable states with Delete permission; identify the record in confirmation, call delete once, remove/refresh the list row on success, and retain the row with the API reason on failure. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | removeSort | Available only in deletable states with Delete permission; identify the record in confirmation, call delete once, remove/refresh the list row on success, and retain the row with the API reason on failure. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | resetPreviewZoom | Open the authorized record in view mode with its status, totals, lines, source and generated-document links; handle deleted, forbidden, and missing records without exposing stale data. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | toggleColumnStyle | Document the enabled state, permission, input context, resulting API or navigation effect, success refresh, and concrete failure behavior for this handler. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | toggleSection | Document the enabled state, permission, input context, resulting API or navigation effect, success refresh, and concrete failure behavior for this handler. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | zoomInPreview | Open the authorized record in view mode with its status, totals, lines, source and generated-document links; handle deleted, forbidden, and missing records without exposing stale data. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
| ReportBuilderComponent | zoomOutPreview | Open the authorized record in view mode with its status, totals, lines, source and generated-document links; handle deleted, forbidden, and missing records without exposing stale data. | apps/templates/src/app/remote-entry/report-templates/pages/report-builder/report-builder.component.ts |
Page-specific frontend acceptance criteria
- add/:screenConfigId/:screen - Report/print: Expose documented filters, validation, empty/loading/error states, authorized results, totals, drill-through, print, and export behavior where present. Security observed: Permission: AppTemplatesPermissions.ReportTemplates_Add; Guards: PolicyAuthGuard
- add/:screenConfigId/:screen/:presetId - Report/print: Expose documented filters, validation, empty/loading/error states, authorized results, totals, drill-through, print, and export behavior where present. Security observed: Permission: AppTemplatesPermissions.ReportTemplates_Add; Guards: PolicyAuthGuard