@symphony-talent/component-library 4.195.0 → 4.197.0
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.
- package/esm2020/lib/organisms/merge-contacts-modal/merge-contacts-modal.component.mjs +5 -5
- package/esm2020/projects/component-library/lib/organisms/merge-contacts-modal/merge-contacts-modal.component.mjs +5 -5
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +2 -2
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +2 -2
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +2 -2
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +2 -2
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -5267,10 +5267,10 @@ class MergeContactsModalComponent {
|
|
|
5267
5267
|
}
|
|
5268
5268
|
}
|
|
5269
5269
|
MergeContactsModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MergeContactsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5270
|
-
MergeContactsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: MergeContactsModalComponent, selector: "symphony-merge-contacts-modal", inputs: { model: "model", isLoading: "isLoading", hasError: "hasError", selected: "selected", confirmSuggestion: "confirmSuggestion", showSuccessToast: "showSuccessToast", showFailureToast: "showFailureToast", currentStep: "currentStep" }, outputs: { next: "next", cancel: "cancel", notDuplicate: "notDuplicate", selectionChange: "selectionChange", hideSuccessToast: "hideSuccessToast", hideFailureToast: "hideFailureToast", requestConfirmSuggestion: "requestConfirmSuggestion", requestCancelConfirmSuggestion: "requestCancelConfirmSuggestion" }, ngImport: i0, template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <symphony-h4 text=\"Merge Contacts\"></symphony-h4>\n <div class=\"sfx-mt-15\">\n <symphony-paragraph\n *ngIf=\"currentStep === 1\"\n text=\"Step 1 of 2 - Select the duplicate contact that needs to be merged.\"\n ></symphony-paragraph>\n <symphony-paragraph\n *ngIf=\"currentStep === 2\"\n text=\"Step 2 of 2 - Merge duplicate contacts\"\n ></symphony-paragraph>\n </div>\n </div>\n <div class=\"col-xs-4 col-sm-4 col-md-4 col-lg-4\">\n <symphony-icon\n class=\"pull-right\"\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCancel()\"\n ></symphony-icon>\n </div>\n </div>\n </div>\n </section>\n <section class=\"modal-body sfx-p-30\">\n <ng-container *ngIf=\"currentStep === 1\">\n <div class=\"toaster-alert-container-global\">\n <symphony-toaster-alert\n *ngIf=\"showSuccessToast\"\n [alertModel]=\"successToast\"\n (hideAlert)=\"onHideSuccessToast()\"\n ></symphony-toaster-alert>\n <symphony-toaster-alert\n *ngIf=\"showFailureToast\"\n [alertModel]=\"failureToast\"\n (hideAlert)=\"onHideFailureToast()\"\n ></symphony-toaster-alert>\n </div>\n <div *ngIf=\"isLoading\" class=\"sfx-mt-30 sfx-mb-30\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n <div *ngIf=\"hasError\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"Something has went wrong. Try again later or contact support\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && (!model?.suggestions || model.suggestions.length === 0)\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"No more duplicates exist for this selected contact. Please try again later\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && !confirmSuggestion && model?.suggestions?.length\" class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-40 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Merge Suggestions\"></symphony-h5>\n <div class=\"scrollable-container\">\n <div *ngFor=\"let suggestion of model.suggestions\">\n <div class=\"radio-item\">\n <symphony-input-radio\n [label]=\"suggestion.name + ' [' + suggestion.id + ']'\"\n [name]=\"'merge-suggestions'\"\n [isActive]=\"selected === suggestion\"\n (clicked)=\"onSelect(suggestion)\"\n ></symphony-input-radio>\n <div class=\"radio-action sfx-mt-30\">\n <symphony-grid-cell-clicked-open-new-tab class=\"icon-upwards\"\n [newTabUrl]=\"getContactUrl(suggestion.id)\"\n ></symphony-grid-cell-clicked-open-new-tab>\n <symphony-icon-wrapper class=\"not-duplicate-icon-global\"\n title=\"Mark not duplicate\" (clicked)=\"onNotDuplicate(suggestion)\">\n <symphony-icon [icon]=\"'si-exclude'\"></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n </div>\n <div class=\"radio-item\">\n <div class=\"radio-details\">\n <div>{{ suggestion.email }}</div>\n <div *ngFor=\"let criterion of suggestion.criteria\" class=\"sfx-mt-5\">{{ criterion }}</div>\n <div *ngFor=\"let status of suggestion.statuses\" class=\"sfx-mt-10\">\n <symphony-status-pill [statusPillModel]=\"{statusClass: 'statusGrey', value: status}\"></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!isLoading && !hasError && confirmSuggestion\">\n <symphony-h5 text=\"Are you sure you want to remove this contact as a potential duplicate? \"></symphony-h5>\n <div class=\"sfx-mt-20 radio-action\">\n <symphony-icon class=\"pending-icon\" [icon]=\"'si-pending-incomplete'\"></symphony-icon>\n <symphony-paragraph class=\"sfx-font-italic\" text=\"Doing so is irreversible and this contact will never be shown as a potential duplicate of this contact again.\"></symphony-paragraph>\n </div>\n <div class=\"row sfx-mt-30\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-40 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Merge Suggestion\"></symphony-h5>\n <div class=\"suggestion-confirm\">\n <div class=\"sfx-font-bold\">{{ confirmSuggestion.name }} [{{ confirmSuggestion.id }}]</div>\n <div class=\"sfx-mt-5\">{{ confirmSuggestion.email }}</div>\n <div *ngFor=\"let criterion of confirmSuggestion.criteria\" class=\"sfx-mt-5\">{{ criterion }}</div>\n <div *ngFor=\"let status of confirmSuggestion.statuses\" class=\"sfx-mt-10\">\n <symphony-status-pill [statusPillModel]=\"{statusClass: 'statusGrey', value: status}\"></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n <div class=\"confirm-actions\">\n <symphony-button-v2\n text=\"Cancel\"\n [isSecondary]=\"true\"\n (clicked)=\"cancelNotDuplicate()\"\n ></symphony-button-v2>\n <symphony-button-v2\n text=\"Confirm\"\n (clicked)=\"confirmOnNotDuplicate()\"\n ></symphony-button-v2>\n </div>\n </div>\n </ng-container>\n <ng-content *ngIf=\"currentStep === 2\"></ng-content>\n </section>\n <section *ngIf=\"currentStep === 1\" class=\"modal-footer\">\n <symphony-button-v2 text=\"Close\" [isSecondary]=\"true\" (clicked)=\"onCancel()\"></symphony-button-v2>\n <symphony-button-v2 text=\"Next\" [disabled]=\"!selected || !!confirmSuggestion\" (clicked)=\"onNext()\"></symphony-button-v2>\n </section>\n</div>\n", styles: [".scrollable-container{max-height:500px;display:flex;flex-direction:column;overflow-y:auto;padding:10px;gap:10px}.radio-item{display:flex;align-items:flex-start;gap:5px}.radio-label{display:flex;align-items:center;gap:1px}.radio-details{padding-left:24px}.radio-action{margin-left:auto;display:flex}.icon-upwards{margin-top:-1px!important;margin-bottom:auto}.modal-footer{display:flex;gap:10px;width:100%;justify-content:flex-end}.confirm-actions{display:flex;gap:10px;margin-top:20px}.suggestion-confirm{margin-top:38px}.pending-icon{margin-right:8px}\n"], components: [{ type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ToasterAlertComponent, selector: "symphony-toaster-alert", inputs: ["alertModel", "showAlert"], outputs: ["hideAlert", "refreshClicked"] }, { type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }, { type: H5Component, selector: "symphony-h5", inputs: ["text", "isSecondary"] }, { type: InputRadioComponent, selector: "symphony-input-radio", inputs: ["isActive", "name", "label", "isRequired"], outputs: ["clicked"] }, { type: GridCellClickedOpenNewTabComponent, selector: "symphony-grid-cell-clicked-open-new-tab", inputs: ["newTabUrl"] }, { type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: StatusPillComponent, selector: "symphony-status-pill", inputs: ["statusPillModel"] }, { type: ButtonV2Component, selector: "symphony-button-v2" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
5270
|
+
MergeContactsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: MergeContactsModalComponent, selector: "symphony-merge-contacts-modal", inputs: { model: "model", isLoading: "isLoading", hasError: "hasError", selected: "selected", confirmSuggestion: "confirmSuggestion", showSuccessToast: "showSuccessToast", showFailureToast: "showFailureToast", currentStep: "currentStep" }, outputs: { next: "next", cancel: "cancel", notDuplicate: "notDuplicate", selectionChange: "selectionChange", hideSuccessToast: "hideSuccessToast", hideFailureToast: "hideFailureToast", requestConfirmSuggestion: "requestConfirmSuggestion", requestCancelConfirmSuggestion: "requestCancelConfirmSuggestion" }, ngImport: i0, template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <symphony-h4 *ngIf=\"currentStep === 1\" text=\"Manage Duplicates\"></symphony-h4>\n <symphony-h4 *ngIf=\"currentStep === 2\" text=\"Merge Contacts\"></symphony-h4>\n </div>\n <div class=\"col-xs-4 col-sm-4 col-md-4 col-lg-4\">\n <symphony-icon\n class=\"pull-right\"\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCancel()\"\n ></symphony-icon>\n </div>\n <div class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-mt-15\">\n <symphony-paragraph\n *ngIf=\"currentStep === 1\"\n text=\"The contacts below are potential duplicates. Please compare their data and select the one you would like to merge.\"\n ></symphony-paragraph>\n <symphony-paragraph\n *ngIf=\"currentStep === 2\"\n text=\"Using the fields below, choose a Primary Contact, and then select the data you would like to merge and keep in that Primary Contact Record. Merging contacts is irreversible.\"\n ></symphony-paragraph> \n </div>\n </div>\n </div>\n </section>\n <section class=\"modal-body sfx-p-30\">\n <ng-container *ngIf=\"currentStep === 1\">\n <div class=\"toaster-alert-container-global\">\n <symphony-toaster-alert\n *ngIf=\"showSuccessToast\"\n [alertModel]=\"successToast\"\n (hideAlert)=\"onHideSuccessToast()\"\n ></symphony-toaster-alert>\n <symphony-toaster-alert\n *ngIf=\"showFailureToast\"\n [alertModel]=\"failureToast\"\n (hideAlert)=\"onHideFailureToast()\"\n ></symphony-toaster-alert>\n </div>\n <div *ngIf=\"isLoading\" class=\"sfx-mt-30 sfx-mb-30\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n <div *ngIf=\"hasError\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"Something has went wrong. Try again later or contact support\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && (!model?.suggestions || model.suggestions.length === 0)\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"No more duplicates exist for this selected contact. Please try again later\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && !confirmSuggestion && model?.suggestions?.length\" class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-40 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 [text]=\"'Potential Duplicates (' + (model?.suggestions?.length || 0) + ')'\"></symphony-h5>\n <div class=\"scrollable-container\">\n <div *ngFor=\"let suggestion of model.suggestions\">\n <div class=\"radio-item\">\n <symphony-input-radio\n [label]=\"suggestion.name + ' [' + suggestion.id + ']'\"\n [name]=\"'merge-suggestions'\"\n [isActive]=\"selected === suggestion\"\n (clicked)=\"onSelect(suggestion)\"\n ></symphony-input-radio>\n <div class=\"radio-action sfx-mt-30\">\n <symphony-grid-cell-clicked-open-new-tab class=\"icon-upwards\"\n [newTabUrl]=\"getContactUrl(suggestion.id)\"\n ></symphony-grid-cell-clicked-open-new-tab>\n <symphony-icon-wrapper class=\"not-duplicate-icon-global\"\n title=\"Mark not duplicate\" (clicked)=\"onNotDuplicate(suggestion)\">\n <symphony-icon [icon]=\"'si-exclude'\"></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n </div>\n <div class=\"radio-item\">\n <div class=\"radio-details\">\n <div>{{ suggestion.email }}</div>\n <div *ngFor=\"let criterion of suggestion.criteria\" class=\"sfx-mt-5\">{{ criterion }}</div>\n <div *ngFor=\"let status of suggestion.statuses\" class=\"sfx-mt-10\">\n <symphony-status-pill [statusPillModel]=\"{statusClass: 'statusGrey', value: status}\"></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!isLoading && !hasError && confirmSuggestion\">\n <symphony-h5 text=\"Are you sure you want to remove this contact as a potential duplicate? \"></symphony-h5>\n <div class=\"sfx-mt-20 radio-action\">\n <symphony-icon class=\"pending-icon\" [icon]=\"'si-pending-incomplete'\"></symphony-icon>\n <symphony-paragraph class=\"sfx-font-italic\" text=\"Doing so is irreversible and this contact will never be shown as a potential duplicate of this contact again.\"></symphony-paragraph>\n </div>\n <div class=\"row sfx-mt-30\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-40 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Merge Suggestion\"></symphony-h5>\n <div class=\"suggestion-confirm\">\n <div class=\"sfx-font-bold\">{{ confirmSuggestion.name }} [{{ confirmSuggestion.id }}]</div>\n <div class=\"sfx-mt-5\">{{ confirmSuggestion.email }}</div>\n <div *ngFor=\"let criterion of confirmSuggestion.criteria\" class=\"sfx-mt-5\">{{ criterion }}</div>\n <div *ngFor=\"let status of confirmSuggestion.statuses\" class=\"sfx-mt-10\">\n <symphony-status-pill [statusPillModel]=\"{statusClass: 'statusGrey', value: status}\"></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n <div class=\"confirm-actions\">\n <symphony-button-v2\n text=\"Cancel\"\n [isSecondary]=\"true\"\n (clicked)=\"cancelNotDuplicate()\"\n ></symphony-button-v2>\n <symphony-button-v2\n text=\"Confirm\"\n (clicked)=\"confirmOnNotDuplicate()\"\n ></symphony-button-v2>\n </div>\n </div>\n </ng-container>\n <ng-content *ngIf=\"currentStep === 2\"></ng-content>\n </section>\n <section *ngIf=\"currentStep === 1\" class=\"modal-footer\">\n <symphony-button-v2 text=\"Close\" [isSecondary]=\"true\" (clicked)=\"onCancel()\"></symphony-button-v2>\n <symphony-button-v2 text=\"Next\" [disabled]=\"!selected || !!confirmSuggestion\" (clicked)=\"onNext()\"></symphony-button-v2>\n </section>\n</div>\n", styles: [".scrollable-container{max-height:500px;display:flex;flex-direction:column;overflow-y:auto;padding:10px;gap:10px}.radio-item{display:flex;align-items:flex-start;gap:5px}.radio-label{display:flex;align-items:center;gap:1px}.radio-details{padding-left:24px}.radio-action{margin-left:auto;display:flex}.icon-upwards{margin-top:-1px!important;margin-bottom:auto}.modal-footer{display:flex;gap:10px;width:100%;justify-content:flex-end}.confirm-actions{display:flex;gap:10px;margin-top:20px}.suggestion-confirm{margin-top:38px}.pending-icon{margin-right:8px}\n"], components: [{ type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: ToasterAlertComponent, selector: "symphony-toaster-alert", inputs: ["alertModel", "showAlert"], outputs: ["hideAlert", "refreshClicked"] }, { type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }, { type: H5Component, selector: "symphony-h5", inputs: ["text", "isSecondary"] }, { type: InputRadioComponent, selector: "symphony-input-radio", inputs: ["isActive", "name", "label", "isRequired"], outputs: ["clicked"] }, { type: GridCellClickedOpenNewTabComponent, selector: "symphony-grid-cell-clicked-open-new-tab", inputs: ["newTabUrl"] }, { type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: StatusPillComponent, selector: "symphony-status-pill", inputs: ["statusPillModel"] }, { type: ButtonV2Component, selector: "symphony-button-v2" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
5271
5271
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MergeContactsModalComponent, decorators: [{
|
|
5272
5272
|
type: Component,
|
|
5273
|
-
args: [{ selector: 'symphony-merge-contacts-modal', template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <symphony-h4
|
|
5273
|
+
args: [{ selector: 'symphony-merge-contacts-modal', template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <symphony-h4 *ngIf=\"currentStep === 1\" text=\"Manage Duplicates\"></symphony-h4>\n <symphony-h4 *ngIf=\"currentStep === 2\" text=\"Merge Contacts\"></symphony-h4>\n </div>\n <div class=\"col-xs-4 col-sm-4 col-md-4 col-lg-4\">\n <symphony-icon\n class=\"pull-right\"\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCancel()\"\n ></symphony-icon>\n </div>\n <div class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-mt-15\">\n <symphony-paragraph\n *ngIf=\"currentStep === 1\"\n text=\"The contacts below are potential duplicates. Please compare their data and select the one you would like to merge.\"\n ></symphony-paragraph>\n <symphony-paragraph\n *ngIf=\"currentStep === 2\"\n text=\"Using the fields below, choose a Primary Contact, and then select the data you would like to merge and keep in that Primary Contact Record. Merging contacts is irreversible.\"\n ></symphony-paragraph> \n </div>\n </div>\n </div>\n </section>\n <section class=\"modal-body sfx-p-30\">\n <ng-container *ngIf=\"currentStep === 1\">\n <div class=\"toaster-alert-container-global\">\n <symphony-toaster-alert\n *ngIf=\"showSuccessToast\"\n [alertModel]=\"successToast\"\n (hideAlert)=\"onHideSuccessToast()\"\n ></symphony-toaster-alert>\n <symphony-toaster-alert\n *ngIf=\"showFailureToast\"\n [alertModel]=\"failureToast\"\n (hideAlert)=\"onHideFailureToast()\"\n ></symphony-toaster-alert>\n </div>\n <div *ngIf=\"isLoading\" class=\"sfx-mt-30 sfx-mb-30\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n <div *ngIf=\"hasError\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"Something has went wrong. Try again later or contact support\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && (!model?.suggestions || model.suggestions.length === 0)\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"No more duplicates exist for this selected contact. Please try again later\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && !confirmSuggestion && model?.suggestions?.length\" class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-40 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 [text]=\"'Potential Duplicates (' + (model?.suggestions?.length || 0) + ')'\"></symphony-h5>\n <div class=\"scrollable-container\">\n <div *ngFor=\"let suggestion of model.suggestions\">\n <div class=\"radio-item\">\n <symphony-input-radio\n [label]=\"suggestion.name + ' [' + suggestion.id + ']'\"\n [name]=\"'merge-suggestions'\"\n [isActive]=\"selected === suggestion\"\n (clicked)=\"onSelect(suggestion)\"\n ></symphony-input-radio>\n <div class=\"radio-action sfx-mt-30\">\n <symphony-grid-cell-clicked-open-new-tab class=\"icon-upwards\"\n [newTabUrl]=\"getContactUrl(suggestion.id)\"\n ></symphony-grid-cell-clicked-open-new-tab>\n <symphony-icon-wrapper class=\"not-duplicate-icon-global\"\n title=\"Mark not duplicate\" (clicked)=\"onNotDuplicate(suggestion)\">\n <symphony-icon [icon]=\"'si-exclude'\"></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n </div>\n <div class=\"radio-item\">\n <div class=\"radio-details\">\n <div>{{ suggestion.email }}</div>\n <div *ngFor=\"let criterion of suggestion.criteria\" class=\"sfx-mt-5\">{{ criterion }}</div>\n <div *ngFor=\"let status of suggestion.statuses\" class=\"sfx-mt-10\">\n <symphony-status-pill [statusPillModel]=\"{statusClass: 'statusGrey', value: status}\"></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!isLoading && !hasError && confirmSuggestion\">\n <symphony-h5 text=\"Are you sure you want to remove this contact as a potential duplicate? \"></symphony-h5>\n <div class=\"sfx-mt-20 radio-action\">\n <symphony-icon class=\"pending-icon\" [icon]=\"'si-pending-incomplete'\"></symphony-icon>\n <symphony-paragraph class=\"sfx-font-italic\" text=\"Doing so is irreversible and this contact will never be shown as a potential duplicate of this contact again.\"></symphony-paragraph>\n </div>\n <div class=\"row sfx-mt-30\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-40 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Merge Suggestion\"></symphony-h5>\n <div class=\"suggestion-confirm\">\n <div class=\"sfx-font-bold\">{{ confirmSuggestion.name }} [{{ confirmSuggestion.id }}]</div>\n <div class=\"sfx-mt-5\">{{ confirmSuggestion.email }}</div>\n <div *ngFor=\"let criterion of confirmSuggestion.criteria\" class=\"sfx-mt-5\">{{ criterion }}</div>\n <div *ngFor=\"let status of confirmSuggestion.statuses\" class=\"sfx-mt-10\">\n <symphony-status-pill [statusPillModel]=\"{statusClass: 'statusGrey', value: status}\"></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n <div class=\"confirm-actions\">\n <symphony-button-v2\n text=\"Cancel\"\n [isSecondary]=\"true\"\n (clicked)=\"cancelNotDuplicate()\"\n ></symphony-button-v2>\n <symphony-button-v2\n text=\"Confirm\"\n (clicked)=\"confirmOnNotDuplicate()\"\n ></symphony-button-v2>\n </div>\n </div>\n </ng-container>\n <ng-content *ngIf=\"currentStep === 2\"></ng-content>\n </section>\n <section *ngIf=\"currentStep === 1\" class=\"modal-footer\">\n <symphony-button-v2 text=\"Close\" [isSecondary]=\"true\" (clicked)=\"onCancel()\"></symphony-button-v2>\n <symphony-button-v2 text=\"Next\" [disabled]=\"!selected || !!confirmSuggestion\" (clicked)=\"onNext()\"></symphony-button-v2>\n </section>\n</div>\n", styles: [".scrollable-container{max-height:500px;display:flex;flex-direction:column;overflow-y:auto;padding:10px;gap:10px}.radio-item{display:flex;align-items:flex-start;gap:5px}.radio-label{display:flex;align-items:center;gap:1px}.radio-details{padding-left:24px}.radio-action{margin-left:auto;display:flex}.icon-upwards{margin-top:-1px!important;margin-bottom:auto}.modal-footer{display:flex;gap:10px;width:100%;justify-content:flex-end}.confirm-actions{display:flex;gap:10px;margin-top:20px}.suggestion-confirm{margin-top:38px}.pending-icon{margin-right:8px}\n"] }]
|
|
5274
5274
|
}], ctorParameters: function () { return []; }, propDecorators: { model: [{
|
|
5275
5275
|
type: Input
|
|
5276
5276
|
}], isLoading: [{
|