npm - @rolatech/angular-onboarding - Versions diffs - 20.3.0-beta.2 → 20.3.0-beta.3 - Mend

@rolatech/angular-onboarding 20.3.0-beta.2 → 20.3.0-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (41) hide show

package/fesm2022/rolatech-angular-onboarding-agent-apply-form-page-y02hYlN_.mjs ADDED Viewed

@@ -0,0 +1,446 @@
+import * as i0 from '@angular/core';
+import { inject, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import * as i1 from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
+import { Router, ActivatedRoute } from '@angular/router';
+import { onboardingApplicantTypeLabel } from '@rolatech/angular-services';
+import { AgentApplyFacade, OnboardingQualificationUploadSection, OnboardingVatSection, OnboardingBankingSection, OnboardingReviewIssuesBanner } from './rolatech-angular-onboarding.mjs';
+class AgentApplyFormPage {
+    facade = inject(AgentApplyFacade);
+    applicantTypeLabel = onboardingApplicantTypeLabel;
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    companyCountryLabel = computed(() => {
+        switch (this.facade.companyCountry()) {
+            case 'CN':
+                return 'China';
+            case 'UK':
+                return 'United Kingdom';
+            default:
+                return 'Other';
+        }
+    }, ...(ngDevMode ? [{ debugName: "companyCountryLabel" }] : []));
+    progressPills = computed(() => {
+        const completion = this.facade.completion();
+        return [
+            { label: 'Profile', complete: completion.profile },
+            { label: 'Documents', complete: completion.qualification },
+            { label: 'VAT', complete: completion.financial },
+            { label: 'Banking', complete: completion.banking },
+        ];
+    }, ...(ngDevMode ? [{ debugName: "progressPills" }] : []));
+    lockedDocuments = computed(() => this.facade.requiredDocuments().filter((spec) => this.facade.isDocumentLocked(spec.type)).map((spec) => spec.type), ...(ngDevMode ? [{ debugName: "lockedDocuments" }] : []));
+    financialFieldLocks = computed(() => ({
+        vatMode: this.facade.isIndividual() || this.facade.isFieldLocked('vatMode'),
+        vatNumber: this.facade.isIndividual() || this.facade.isFieldLocked('vatNumber'),
+    }), ...(ngDevMode ? [{ debugName: "financialFieldLocks" }] : []));
+    bankingFieldLocks = computed(() => ({
+        bankName: this.facade.isFieldLocked('bankName'),
+        accountHolderName: this.facade.isFieldLocked('accountHolderName'),
+        sortCode: this.facade.isFieldLocked('sortCode'),
+        accountNumber: this.facade.isFieldLocked('accountNumber'),
+    }), ...(ngDevMode ? [{ debugName: "bankingFieldLocks" }] : []));
+    profileTitle = computed(() => (this.facade.isCompany() ? 'Company Contact Details' : 'Applicant Details'), ...(ngDevMode ? [{ debugName: "profileTitle" }] : []));
+    profileDescription = computed(() => this.facade.isCompany()
+        ? 'Enter the legal company name and the contact person responsible for this onboarding submission.'
+        : 'Enter the personal details for the applicant who is joining as an agent.', ...(ngDevMode ? [{ debugName: "profileDescription" }] : []));
+    contactNameLabel = computed(() => (this.facade.isCompany() ? 'Company representative' : 'Full name'), ...(ngDevMode ? [{ debugName: "contactNameLabel" }] : []));
+    vatRateLabel = computed(() => (this.facade.isIndividual() ? '0%' : '20%'), ...(ngDevMode ? [{ debugName: "vatRateLabel" }] : []));
+    draftSavedAt = computed(() => {
+        const value = this.facade.lastLocalDraftSavedAt();
+        return value ? new Date(value).toLocaleString() : '';
+    }, ...(ngDevMode ? [{ debugName: "draftSavedAt" }] : []));
+    primaryActionLabel = computed(() => (this.facade.hasSubmittedState() ? 'Open review' : 'Continue to review'), ...(ngDevMode ? [{ debugName: "primaryActionLabel" }] : []));
+    hasProfileError(controlName, errorCode) {
+        const control = this.facade.profileForm.get(controlName);
+        return Boolean(control?.touched && control.hasError(errorCode));
+    }
+    async onUpload(documentType, file, replacedDocumentId) {
+        await this.facade.uploadDocument(documentType, file, replacedDocumentId);
+    }
+    async continueToReview() {
+        if (!this.facade.hasSubmittedState()) {
+            const saved = await this.facade.saveFormProgress();
+            if (!saved) {
+                return;
+            }
+        }
+        await this.router.navigate(['../review'], {
+            relativeTo: this.route,
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AgentApplyFormPage, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: AgentApplyFormPage, isStandalone: true, selector: "rolatech-agent-apply-form-page", host: { classAttribute: "block" }, ngImport: i0, template: `
+    <div class="space-y-6">
+      @if (facade.status() === 'NEED_MORE_INFO' && facade.issues().length > 0) {
+        <rolatech-onboarding-review-issues-banner [issues]="facade.issues()" [status]="facade.status()" />
+      }
+      <section class="grid gap-4 md:grid-cols-3">
+        <article class="rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)">Applicant Type</p>
+          <p class="mt-2 text-lg font-semibold text-(--rt-text-primary)">{{ applicantTypeLabel(facade.applicantType()) }}</p>
+        </article>
+        <article class="rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)">Operating Region</p>
+          <p class="mt-2 text-lg font-semibold text-(--rt-text-primary)">{{ companyCountryLabel() }}</p>
+        </article>
+        <article class="rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)">Section Progress</p>
+          <div class="mt-3 flex flex-wrap gap-2">
+            @for (item of progressPills(); track item.label) {
+              <span
+                class="rounded-full px-3 py-1 text-xs font-semibold"
+                [class]="
+                  item.complete
+                    ? 'bg-(--rt-raised-background) text-emerald-700'
+                    : 'bg-(--rt-raised-background) text-(--rt-text-secondary)'
+                "
+              >
+                {{ item.label }}
+              </span>
+            }
+          </div>
+        </article>
+      </section>
+      <form [formGroup]="facade.profileForm" class="space-y-4 rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-6 shadow-sm">
+        <div class="space-y-2">
+          <h2 class="text-lg font-semibold text-(--rt-text-primary)">{{ profileTitle() }}</h2>
+          <p class="max-w-2xl text-sm text-(--rt-text-secondary)">
+            {{ profileDescription() }}
+          </p>
+        </div>
+        <div class="grid gap-4 md:grid-cols-2">
+          @if (facade.isCompany()) {
+            <label class="grid gap-2 md:col-span-2">
+              <span class="text-sm font-medium text-(--rt-text-secondary)">Company legal name</span>
+              <input
+                formControlName="organizationName"
+                class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+                [readonly]="facade.isFieldLocked('organizationName')"
+              />
+              @if (facade.getFieldIssueComment('organizationName')) {
+                <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('organizationName') }}</span>
+              }
+              @if (hasProfileError('organizationName', 'required')) {
+                <span class="text-xs text-rose-700">Company legal name is required.</span>
+              }
+            </label>
+          }
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">{{ contactNameLabel() }}</span>
+            <input
+              formControlName="contactName"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+              [readonly]="facade.isFieldLocked('contactName')"
+            />
+            @if (facade.getFieldIssueComment('contactName')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('contactName') }}</span>
+            }
+            @if (hasProfileError('contactName', 'required')) {
+              <span class="text-xs text-rose-700">{{ contactNameLabel() }} is required.</span>
+            }
+          </label>
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">Primary email</span>
+            <input
+              formControlName="contactEmail"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+              [readonly]="facade.isFieldLocked('contactEmail')"
+            />
+            @if (facade.getFieldIssueComment('contactEmail')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('contactEmail') }}</span>
+            }
+            @if (hasProfileError('contactEmail', 'required')) {
+              <span class="text-xs text-rose-700">Primary email is required.</span>
+            }
+            @if (hasProfileError('contactEmail', 'email')) {
+              <span class="text-xs text-rose-700">Enter a valid email address.</span>
+            }
+          </label>
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">Phone number</span>
+            <input
+              formControlName="contactPhone"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+              [readonly]="facade.isFieldLocked('contactPhone')"
+            />
+            @if (facade.getFieldIssueComment('contactPhone')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('contactPhone') }}</span>
+            }
+            @if (hasProfileError('contactPhone', 'required')) {
+              <span class="text-xs text-rose-700">Phone number is required.</span>
+            }
+          </label>
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">Country code</span>
+            <input
+              formControlName="countryCode"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3 uppercase"
+              [readonly]="facade.isFieldLocked('countryCode')"
+            />
+            @if (facade.getFieldIssueComment('countryCode')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('countryCode') }}</span>
+            }
+            @if (hasProfileError('countryCode', 'required')) {
+              <span class="text-xs text-rose-700">Country code is required.</span>
+            }
+          </label>
+        </div>
+      </form>
+      <rolatech-onboarding-qualification-upload-section
+        [documentSpecs]="facade.requiredDocuments()"
+        [documents]="facade.documents()"
+        [issueComments]="facade.documentIssueComments()"
+        [lockedDocuments]="lockedDocuments()"
+        [uploadStates]="facade.uploadStates()"
+        [busy]="facade.saving()"
+        (fileSelected)="onUpload($event.documentType, $event.file, $event.replacedDocumentId)"
+      />
+      <rolatech-onboarding-vat-section
+        [form]="facade.financialForm"
+        [applicantType]="facade.applicantType()"
+        [companyCountry]="facade.companyCountry()"
+        [fieldLocks]="financialFieldLocks()"
+        [vatRateLabel]="vatRateLabel()"
+        [issueComments]="facade.fieldIssueComments()"
+      />
+      <rolatech-onboarding-banking-section
+        [form]="facade.bankingForm"
+        [fieldLocks]="bankingFieldLocks()"
+        [expectedAccountHolderName]="facade.expectedAccountHolderName()"
+        [issueComments]="facade.fieldIssueComments()"
+      />
+      <section class="flex flex-wrap items-center justify-between gap-4 rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+        <div class="space-y-1 text-sm text-(--rt-text-secondary)">
+          @if (facade.lastLocalDraftSavedAt()) {
+            <p>Local draft saved {{ draftSavedAt() }}.</p>
+          } @else {
+            <p>Changes are stored locally while you work.</p>
+          }
+          @if (facade.hasActiveUploads()) {
+            <p class="text-amber-800">A document upload is still running.</p>
+          }
+        </div>
+        <button
+          type="button"
+          class="rounded-xl bg-(--rt-brand-color) px-5 py-2.5 text-sm font-semibold text-(--rt-text-primary-inverse) transition hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-60"
+          [disabled]="facade.saving() || facade.hasActiveUploads()"
+          (click)="continueToReview()"
+        >
+          {{ primaryActionLabel() }}
+        </button>
+      </section>
+    </div>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: OnboardingQualificationUploadSection, selector: "rolatech-onboarding-qualification-upload-section", inputs: ["documentSpecs", "documents", "issueComments", "lockedDocuments", "uploadStates", "busy"], outputs: ["fileSelected"] }, { kind: "component", type: OnboardingVatSection, selector: "rolatech-onboarding-vat-section", inputs: ["form", "applicantType", "companyCountry", "fieldLocks", "vatRateLabel", "issueComments"] }, { kind: "component", type: OnboardingBankingSection, selector: "rolatech-onboarding-banking-section", inputs: ["form", "fieldLocks", "expectedAccountHolderName", "issueComments"] }, { kind: "component", type: OnboardingReviewIssuesBanner, selector: "rolatech-onboarding-review-issues-banner", inputs: ["issues", "status"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AgentApplyFormPage, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rolatech-agent-apply-form-page',
+                    standalone: true,
+                    imports: [
+                        ReactiveFormsModule,
+                        OnboardingQualificationUploadSection,
+                        OnboardingVatSection,
+                        OnboardingBankingSection,
+                        OnboardingReviewIssuesBanner,
+                    ],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: { class: 'block' },
+                    template: `
+    <div class="space-y-6">
+      @if (facade.status() === 'NEED_MORE_INFO' && facade.issues().length > 0) {
+        <rolatech-onboarding-review-issues-banner [issues]="facade.issues()" [status]="facade.status()" />
+      }
+      <section class="grid gap-4 md:grid-cols-3">
+        <article class="rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)">Applicant Type</p>
+          <p class="mt-2 text-lg font-semibold text-(--rt-text-primary)">{{ applicantTypeLabel(facade.applicantType()) }}</p>
+        </article>
+        <article class="rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)">Operating Region</p>
+          <p class="mt-2 text-lg font-semibold text-(--rt-text-primary)">{{ companyCountryLabel() }}</p>
+        </article>
+        <article class="rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)">Section Progress</p>
+          <div class="mt-3 flex flex-wrap gap-2">
+            @for (item of progressPills(); track item.label) {
+              <span
+                class="rounded-full px-3 py-1 text-xs font-semibold"
+                [class]="
+                  item.complete
+                    ? 'bg-(--rt-raised-background) text-emerald-700'
+                    : 'bg-(--rt-raised-background) text-(--rt-text-secondary)'
+                "
+              >
+                {{ item.label }}
+              </span>
+            }
+          </div>
+        </article>
+      </section>
+      <form [formGroup]="facade.profileForm" class="space-y-4 rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-6 shadow-sm">
+        <div class="space-y-2">
+          <h2 class="text-lg font-semibold text-(--rt-text-primary)">{{ profileTitle() }}</h2>
+          <p class="max-w-2xl text-sm text-(--rt-text-secondary)">
+            {{ profileDescription() }}
+          </p>
+        </div>
+        <div class="grid gap-4 md:grid-cols-2">
+          @if (facade.isCompany()) {
+            <label class="grid gap-2 md:col-span-2">
+              <span class="text-sm font-medium text-(--rt-text-secondary)">Company legal name</span>
+              <input
+                formControlName="organizationName"
+                class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+                [readonly]="facade.isFieldLocked('organizationName')"
+              />
+              @if (facade.getFieldIssueComment('organizationName')) {
+                <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('organizationName') }}</span>
+              }
+              @if (hasProfileError('organizationName', 'required')) {
+                <span class="text-xs text-rose-700">Company legal name is required.</span>
+              }
+            </label>
+          }
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">{{ contactNameLabel() }}</span>
+            <input
+              formControlName="contactName"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+              [readonly]="facade.isFieldLocked('contactName')"
+            />
+            @if (facade.getFieldIssueComment('contactName')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('contactName') }}</span>
+            }
+            @if (hasProfileError('contactName', 'required')) {
+              <span class="text-xs text-rose-700">{{ contactNameLabel() }} is required.</span>
+            }
+          </label>
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">Primary email</span>
+            <input
+              formControlName="contactEmail"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+              [readonly]="facade.isFieldLocked('contactEmail')"
+            />
+            @if (facade.getFieldIssueComment('contactEmail')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('contactEmail') }}</span>
+            }
+            @if (hasProfileError('contactEmail', 'required')) {
+              <span class="text-xs text-rose-700">Primary email is required.</span>
+            }
+            @if (hasProfileError('contactEmail', 'email')) {
+              <span class="text-xs text-rose-700">Enter a valid email address.</span>
+            }
+          </label>
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">Phone number</span>
+            <input
+              formControlName="contactPhone"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3"
+              [readonly]="facade.isFieldLocked('contactPhone')"
+            />
+            @if (facade.getFieldIssueComment('contactPhone')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('contactPhone') }}</span>
+            }
+            @if (hasProfileError('contactPhone', 'required')) {
+              <span class="text-xs text-rose-700">Phone number is required.</span>
+            }
+          </label>
+          <label class="grid gap-2">
+            <span class="text-sm font-medium text-(--rt-text-secondary)">Country code</span>
+            <input
+              formControlName="countryCode"
+              class="h-11 rounded-xl border border-(--rt-border-color) px-3 uppercase"
+              [readonly]="facade.isFieldLocked('countryCode')"
+            />
+            @if (facade.getFieldIssueComment('countryCode')) {
+              <span class="text-xs text-amber-800">{{ facade.getFieldIssueComment('countryCode') }}</span>
+            }
+            @if (hasProfileError('countryCode', 'required')) {
+              <span class="text-xs text-rose-700">Country code is required.</span>
+            }
+          </label>
+        </div>
+      </form>
+      <rolatech-onboarding-qualification-upload-section
+        [documentSpecs]="facade.requiredDocuments()"
+        [documents]="facade.documents()"
+        [issueComments]="facade.documentIssueComments()"
+        [lockedDocuments]="lockedDocuments()"
+        [uploadStates]="facade.uploadStates()"
+        [busy]="facade.saving()"
+        (fileSelected)="onUpload($event.documentType, $event.file, $event.replacedDocumentId)"
+      />
+      <rolatech-onboarding-vat-section
+        [form]="facade.financialForm"
+        [applicantType]="facade.applicantType()"
+        [companyCountry]="facade.companyCountry()"
+        [fieldLocks]="financialFieldLocks()"
+        [vatRateLabel]="vatRateLabel()"
+        [issueComments]="facade.fieldIssueComments()"
+      />
+      <rolatech-onboarding-banking-section
+        [form]="facade.bankingForm"
+        [fieldLocks]="bankingFieldLocks()"
+        [expectedAccountHolderName]="facade.expectedAccountHolderName()"
+        [issueComments]="facade.fieldIssueComments()"
+      />
+      <section class="flex flex-wrap items-center justify-between gap-4 rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm">
+        <div class="space-y-1 text-sm text-(--rt-text-secondary)">
+          @if (facade.lastLocalDraftSavedAt()) {
+            <p>Local draft saved {{ draftSavedAt() }}.</p>
+          } @else {
+            <p>Changes are stored locally while you work.</p>
+          }
+          @if (facade.hasActiveUploads()) {
+            <p class="text-amber-800">A document upload is still running.</p>
+          }
+        </div>
+        <button
+          type="button"
+          class="rounded-xl bg-(--rt-brand-color) px-5 py-2.5 text-sm font-semibold text-(--rt-text-primary-inverse) transition hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-60"
+          [disabled]="facade.saving() || facade.hasActiveUploads()"
+          (click)="continueToReview()"
+        >
+          {{ primaryActionLabel() }}
+        </button>
+      </section>
+    </div>
+  `,
+                }]
+        }] });
+export { AgentApplyFormPage };
+//# sourceMappingURL=rolatech-angular-onboarding-agent-apply-form-page-y02hYlN_.mjs.map

package/fesm2022/rolatech-angular-onboarding-agent-apply-form-page-y02hYlN_.mjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"rolatech-angular-onboarding-agent-apply-form-page-y02hYlN_.mjs","sources":["../../../../packages/angular-onboarding/src/lib/pages/agent-apply/agent-apply-form-page.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, inject, ViewEncapsulation } from '@angular/core';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { ActivatedRoute, Router } from '@angular/router';\nimport { OnboardingDocumentType, onboardingApplicantTypeLabel } from '@rolatech/angular-services';\nimport { OnboardingBankingSection } from '../../components/onboarding/onboarding-banking-section';\nimport { OnboardingQualificationUploadSection } from '../../components/onboarding/onboarding-qualification-upload-section';\nimport { OnboardingReviewIssuesBanner } from '../../components/onboarding/onboarding-review-issues-banner';\nimport { OnboardingVatSection } from '../../components/onboarding/onboarding-vat-section';\nimport { AgentApplyFacade } from '../../store/agent-apply.facade';\n\n@Component({\n selector: 'rolatech-agent-apply-form-page',\n standalone: true,\n imports: [\n ReactiveFormsModule,\n OnboardingQualificationUploadSection,\n OnboardingVatSection,\n OnboardingBankingSection,\n OnboardingReviewIssuesBanner,\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n encapsulation: ViewEncapsulation.None,\n host: { class: 'block' },\n template: `\n <div class=\"space-y-6\">\n @if (facade.status() === 'NEED_MORE_INFO' && facade.issues().length > 0) {\n <rolatech-onboarding-review-issues-banner [issues]=\"facade.issues()\" [status]=\"facade.status()\" />\n }\n\n <section class=\"grid gap-4 md:grid-cols-3\">\n <article class=\"rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm\">\n <p class=\"text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)\">Applicant Type</p>\n <p class=\"mt-2 text-lg font-semibold text-(--rt-text-primary)\">{{ applicantTypeLabel(facade.applicantType()) }}</p>\n </article>\n\n <article class=\"rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm\">\n <p class=\"text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)\">Operating Region</p>\n <p class=\"mt-2 text-lg font-semibold text-(--rt-text-primary)\">{{ companyCountryLabel() }}</p>\n </article>\n\n <article class=\"rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm\">\n <p class=\"text-xs font-semibold uppercase tracking-[0.2em] text-(--rt-text-secondary)\">Section Progress</p>\n <div class=\"mt-3 flex flex-wrap gap-2\">\n @for (item of progressPills(); track item.label) {\n <span\n class=\"rounded-full px-3 py-1 text-xs font-semibold\"\n [class]=\"\n item.complete\n ? 'bg-(--rt-raised-background) text-emerald-700'\n : 'bg-(--rt-raised-background) text-(--rt-text-secondary)'\n \"\n >\n {{ item.label }}\n </span>\n }\n </div>\n </article>\n </section>\n\n <form [formGroup]=\"facade.profileForm\" class=\"space-y-4 rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-6 shadow-sm\">\n <div class=\"space-y-2\">\n <h2 class=\"text-lg font-semibold text-(--rt-text-primary)\">{{ profileTitle() }}</h2>\n <p class=\"max-w-2xl text-sm text-(--rt-text-secondary)\">\n {{ profileDescription() }}\n </p>\n </div>\n\n <div class=\"grid gap-4 md:grid-cols-2\">\n @if (facade.isCompany()) {\n <label class=\"grid gap-2 md:col-span-2\">\n <span class=\"text-sm font-medium text-(--rt-text-secondary)\">Company legal name</span>\n <input\n formControlName=\"organizationName\"\n class=\"h-11 rounded-xl border border-(--rt-border-color) px-3\"\n [readonly]=\"facade.isFieldLocked('organizationName')\"\n />\n @if (facade.getFieldIssueComment('organizationName')) {\n <span class=\"text-xs text-amber-800\">{{ facade.getFieldIssueComment('organizationName') }}</span>\n }\n @if (hasProfileError('organizationName', 'required')) {\n <span class=\"text-xs text-rose-700\">Company legal name is required.</span>\n }\n </label>\n }\n\n <label class=\"grid gap-2\">\n <span class=\"text-sm font-medium text-(--rt-text-secondary)\">{{ contactNameLabel() }}</span>\n <input\n formControlName=\"contactName\"\n class=\"h-11 rounded-xl border border-(--rt-border-color) px-3\"\n [readonly]=\"facade.isFieldLocked('contactName')\"\n />\n @if (facade.getFieldIssueComment('contactName')) {\n <span class=\"text-xs text-amber-800\">{{ facade.getFieldIssueComment('contactName') }}</span>\n }\n @if (hasProfileError('contactName', 'required')) {\n <span class=\"text-xs text-rose-700\">{{ contactNameLabel() }} is required.</span>\n }\n </label>\n\n <label class=\"grid gap-2\">\n <span class=\"text-sm font-medium text-(--rt-text-secondary)\">Primary email</span>\n <input\n formControlName=\"contactEmail\"\n class=\"h-11 rounded-xl border border-(--rt-border-color) px-3\"\n [readonly]=\"facade.isFieldLocked('contactEmail')\"\n />\n @if (facade.getFieldIssueComment('contactEmail')) {\n <span class=\"text-xs text-amber-800\">{{ facade.getFieldIssueComment('contactEmail') }}</span>\n }\n @if (hasProfileError('contactEmail', 'required')) {\n <span class=\"text-xs text-rose-700\">Primary email is required.</span>\n }\n @if (hasProfileError('contactEmail', 'email')) {\n <span class=\"text-xs text-rose-700\">Enter a valid email address.</span>\n }\n </label>\n\n <label class=\"grid gap-2\">\n <span class=\"text-sm font-medium text-(--rt-text-secondary)\">Phone number</span>\n <input\n formControlName=\"contactPhone\"\n class=\"h-11 rounded-xl border border-(--rt-border-color) px-3\"\n [readonly]=\"facade.isFieldLocked('contactPhone')\"\n />\n @if (facade.getFieldIssueComment('contactPhone')) {\n <span class=\"text-xs text-amber-800\">{{ facade.getFieldIssueComment('contactPhone') }}</span>\n }\n @if (hasProfileError('contactPhone', 'required')) {\n <span class=\"text-xs text-rose-700\">Phone number is required.</span>\n }\n </label>\n\n <label class=\"grid gap-2\">\n <span class=\"text-sm font-medium text-(--rt-text-secondary)\">Country code</span>\n <input\n formControlName=\"countryCode\"\n class=\"h-11 rounded-xl border border-(--rt-border-color) px-3 uppercase\"\n [readonly]=\"facade.isFieldLocked('countryCode')\"\n />\n @if (facade.getFieldIssueComment('countryCode')) {\n <span class=\"text-xs text-amber-800\">{{ facade.getFieldIssueComment('countryCode') }}</span>\n }\n @if (hasProfileError('countryCode', 'required')) {\n <span class=\"text-xs text-rose-700\">Country code is required.</span>\n }\n </label>\n </div>\n </form>\n\n <rolatech-onboarding-qualification-upload-section\n [documentSpecs]=\"facade.requiredDocuments()\"\n [documents]=\"facade.documents()\"\n [issueComments]=\"facade.documentIssueComments()\"\n [lockedDocuments]=\"lockedDocuments()\"\n [uploadStates]=\"facade.uploadStates()\"\n [busy]=\"facade.saving()\"\n (fileSelected)=\"onUpload($event.documentType, $event.file, $event.replacedDocumentId)\"\n />\n\n <rolatech-onboarding-vat-section\n [form]=\"facade.financialForm\"\n [applicantType]=\"facade.applicantType()\"\n [companyCountry]=\"facade.companyCountry()\"\n [fieldLocks]=\"financialFieldLocks()\"\n [vatRateLabel]=\"vatRateLabel()\"\n [issueComments]=\"facade.fieldIssueComments()\"\n />\n\n <rolatech-onboarding-banking-section\n [form]=\"facade.bankingForm\"\n [fieldLocks]=\"bankingFieldLocks()\"\n [expectedAccountHolderName]=\"facade.expectedAccountHolderName()\"\n [issueComments]=\"facade.fieldIssueComments()\"\n />\n\n <section class=\"flex flex-wrap items-center justify-between gap-4 rounded-3xl border border-(--rt-border-color) bg-(--rt-base-background) p-5 shadow-sm\">\n <div class=\"space-y-1 text-sm text-(--rt-text-secondary)\">\n @if (facade.lastLocalDraftSavedAt()) {\n <p>Local draft saved {{ draftSavedAt() }}.</p>\n } @else {\n <p>Changes are stored locally while you work.</p>\n }\n @if (facade.hasActiveUploads()) {\n <p class=\"text-amber-800\">A document upload is still running.</p>\n }\n </div>\n\n <button\n type=\"button\"\n class=\"rounded-xl bg-(--rt-brand-color) px-5 py-2.5 text-sm font-semibold text-(--rt-text-primary-inverse) transition hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-60\"\n [disabled]=\"facade.saving() || facade.hasActiveUploads()\"\n (click)=\"continueToReview()\"\n >\n {{ primaryActionLabel() }}\n </button>\n </section>\n </div>\n `,\n})\nexport class AgentApplyFormPage {\n readonly facade = inject(AgentApplyFacade);\n readonly applicantTypeLabel = onboardingApplicantTypeLabel;\n private readonly router = inject(Router);\n private readonly route = inject(ActivatedRoute);\n\n readonly companyCountryLabel = computed(() => {\n switch (this.facade.companyCountry()) {\n case 'CN':\n return 'China';\n case 'UK':\n return 'United Kingdom';\n default:\n return 'Other';\n }\n });\n\n readonly progressPills = computed(() => {\n const completion = this.facade.completion();\n\n return [\n { label: 'Profile', complete: completion.profile },\n { label: 'Documents', complete: completion.qualification },\n { label: 'VAT', complete: completion.financial },\n { label: 'Banking', complete: completion.banking },\n ];\n });\n\n readonly lockedDocuments = computed(() =>\n this.facade.requiredDocuments().filter((spec) => this.facade.isDocumentLocked(spec.type)).map((spec) => spec.type),\n );\n\n readonly financialFieldLocks = computed(() => ({\n vatMode: this.facade.isIndividual() || this.facade.isFieldLocked('vatMode'),\n vatNumber: this.facade.isIndividual() || this.facade.isFieldLocked('vatNumber'),\n }));\n\n readonly bankingFieldLocks = computed(() => ({\n bankName: this.facade.isFieldLocked('bankName'),\n accountHolderName: this.facade.isFieldLocked('accountHolderName'),\n sortCode: this.facade.isFieldLocked('sortCode'),\n accountNumber: this.facade.isFieldLocked('accountNumber'),\n }));\n\n readonly profileTitle = computed(() => (this.facade.isCompany() ? 'Company Contact Details' : 'Applicant Details'));\n readonly profileDescription = computed(() =>\n this.facade.isCompany()\n ? 'Enter the legal company name and the contact person responsible for this onboarding submission.'\n : 'Enter the personal details for the applicant who is joining as an agent.',\n );\n readonly contactNameLabel = computed(() => (this.facade.isCompany() ? 'Company representative' : 'Full name'));\n readonly vatRateLabel = computed(() => (this.facade.isIndividual() ? '0%' : '20%'));\n readonly draftSavedAt = computed(() => {\n const value = this.facade.lastLocalDraftSavedAt();\n return value ? new Date(value).toLocaleString() : '';\n });\n readonly primaryActionLabel = computed(() => (this.facade.hasSubmittedState() ? 'Open review' : 'Continue to review'));\n\n hasProfileError(controlName: string, errorCode: string): boolean {\n const control = this.facade.profileForm.get(controlName);\n return Boolean(control?.touched && control.hasError(errorCode));\n }\n\n async onUpload(documentType: OnboardingDocumentType, file: File, replacedDocumentId?: string): Promise<void> {\n await this.facade.uploadDocument(documentType, file, replacedDocumentId);\n }\n\n async continueToReview(): Promise<void> {\n if (!this.facade.hasSubmittedState()) {\n const saved = await this.facade.saveFormProgress();\n\n if (!saved) {\n return;\n }\n }\n\n await this.router.navigate(['../review'], {\n relativeTo: this.route,\n });\n }\n}\n"],"names":[],"mappings":"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"}

package/fesm2022/rolatech-angular-onboarding-agent-apply-result-page-CEL4nWb_.mjs ADDED Viewed

@@ -0,0 +1,141 @@
+import * as i0 from '@angular/core';
+import { inject, computed, ViewEncapsulation, ChangeDetectionStrategy, Component } from '@angular/core';
+import { Router, ActivatedRoute } from '@angular/router';
+import { AgentApplyFacade, OnboardingStatusBadge } from './rolatech-angular-onboarding.mjs';
+class AgentApplyResultPage {
+    facade = inject(AgentApplyFacade);
+    router = inject(Router);
+    route = inject(ActivatedRoute);
+    toneClass = computed(() => {
+        switch (this.facade.status()) {
+            case 'APPROVED':
+                return 'border-(--rt-border-color) bg-(--rt-base-background) text-emerald-900';
+            case 'FAILED':
+                return 'border-(--rt-border-color) bg-(--rt-base-background) text-rose-800';
+            case 'NEED_MORE_INFO':
+                return 'border-(--rt-border-color) bg-(--rt-base-background) text-amber-900';
+            default:
+                return 'border-(--rt-border-color) bg-(--rt-base-background) text-sky-900';
+        }
+    }, ...(ngDevMode ? [{ debugName: "toneClass" }] : []));
+    title = computed(() => {
+        switch (this.facade.status()) {
+            case 'APPROVED':
+                return 'Application approved';
+            case 'FAILED':
+                return 'Application not approved';
+            case 'NEED_MORE_INFO':
+                return 'More information is required';
+            case 'IN_REVIEW':
+                return 'Application in review';
+            default:
+                return 'Application submitted';
+        }
+    }, ...(ngDevMode ? [{ debugName: "title" }] : []));
+    description = computed(() => {
+        switch (this.facade.status()) {
+            case 'APPROVED':
+                return 'The application passed review. PrimeCasa can now continue with the downstream agent enablement steps.';
+            case 'FAILED':
+                return 'The application was rejected during review. You can still inspect the submitted package and any reviewer feedback from the review screen.';
+            case 'NEED_MORE_INFO':
+                return 'Reviewer feedback has been returned to this application. Only the flagged fields and documents should be updated before resubmission.';
+            case 'IN_REVIEW':
+                return 'The submission is currently being reviewed by the PrimeCasa operations team.';
+            default:
+                return 'The application has been sent for manual review. You can return to the review screen to inspect the submission package.';
+        }
+    }, ...(ngDevMode ? [{ debugName: "description" }] : []));
+    async openReview() {
+        await this.router.navigate(['../review'], {
+            relativeTo: this.route,
+        });
+    }
+    async openForm() {
+        await this.router.navigate(['../form'], {
+            relativeTo: this.route,
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AgentApplyResultPage, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.1", type: AgentApplyResultPage, isStandalone: true, selector: "rolatech-agent-apply-result-page", host: { classAttribute: "block" }, ngImport: i0, template: `
+    <section class="rounded-3xl border p-8 shadow-sm" [class]="toneClass()">
+      <div class="flex flex-wrap items-start justify-between gap-4">
+        <div class="space-y-3">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] opacity-80">Application Result</p>
+          <h2 class="text-2xl font-semibold tracking-tight">{{ title() }}</h2>
+          <p class="max-w-2xl text-sm opacity-85">{{ description() }}</p>
+        </div>
+        <rolatech-onboarding-status-badge [status]="facade.status()" />
+      </div>
+      <div class="mt-6 flex flex-wrap gap-3">
+        <button
+          type="button"
+          class="rounded-xl border border-(--rt-border-color) bg-(--rt-raised-background) px-4 py-2 text-sm font-medium transition hover:bg-(--rt-base-background)"
+          (click)="openReview()"
+        >
+          View submission
+        </button>
+        @if (facade.status() === 'NEED_MORE_INFO') {
+          <button
+            type="button"
+            class="rounded-xl border border-(--rt-border-color) bg-(--rt-raised-background) px-4 py-2 text-sm font-medium transition hover:bg-(--rt-base-background)"
+            (click)="openForm()"
+          >
+            Update requested items
+          </button>
+        }
+      </div>
+    </section>
+  `, isInline: true, dependencies: [{ kind: "component", type: OnboardingStatusBadge, selector: "rolatech-onboarding-status-badge", inputs: ["status"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: AgentApplyResultPage, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'rolatech-agent-apply-result-page',
+                    standalone: true,
+                    imports: [OnboardingStatusBadge],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    host: { class: 'block' },
+                    template: `
+    <section class="rounded-3xl border p-8 shadow-sm" [class]="toneClass()">
+      <div class="flex flex-wrap items-start justify-between gap-4">
+        <div class="space-y-3">
+          <p class="text-xs font-semibold uppercase tracking-[0.2em] opacity-80">Application Result</p>
+          <h2 class="text-2xl font-semibold tracking-tight">{{ title() }}</h2>
+          <p class="max-w-2xl text-sm opacity-85">{{ description() }}</p>
+        </div>
+        <rolatech-onboarding-status-badge [status]="facade.status()" />
+      </div>
+      <div class="mt-6 flex flex-wrap gap-3">
+        <button
+          type="button"
+          class="rounded-xl border border-(--rt-border-color) bg-(--rt-raised-background) px-4 py-2 text-sm font-medium transition hover:bg-(--rt-base-background)"
+          (click)="openReview()"
+        >
+          View submission
+        </button>
+        @if (facade.status() === 'NEED_MORE_INFO') {
+          <button
+            type="button"
+            class="rounded-xl border border-(--rt-border-color) bg-(--rt-raised-background) px-4 py-2 text-sm font-medium transition hover:bg-(--rt-base-background)"
+            (click)="openForm()"
+          >
+            Update requested items
+          </button>
+        }
+      </div>
+    </section>
+  `,
+                }]
+        }] });
+export { AgentApplyResultPage };
+//# sourceMappingURL=rolatech-angular-onboarding-agent-apply-result-page-CEL4nWb_.mjs.map