@posiwise/smart-crm 0.0.26 → 0.0.27

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 (23) hide show
  1. package/esm2022/lib/private/components/smart-crm-accounts/smart-crm-account-files/smart-crm-account-files.component.mjs +3 -3
  2. package/esm2022/lib/private/components/smart-crm-accounts/smart-crm-account-info/smart-crm-account-info.component.mjs +3 -3
  3. package/esm2022/lib/private/components/smart-crm-accounts/smart-crm-accounts.component.mjs +3 -29
  4. package/esm2022/lib/private/components/smart-crm-configuration/smart-crm-actions/smart-crm-actions.component.mjs +3 -3
  5. package/esm2022/lib/private/components/smart-crm-configuration/smart-crm-opportunity-categories/smart-crm-opportunity-categories.component.mjs +3 -3
  6. package/esm2022/lib/private/components/smart-crm-configuration/smart-crm-source/smart-crm-source.component.mjs +3 -3
  7. package/esm2022/lib/private/components/smart-crm-configuration/smart-crm-stages/smart-crm-stages.component.mjs +3 -3
  8. package/esm2022/lib/private/components/smart-crm-configuration/smart-crm-widgets/smart-crm-widgets.component.mjs +3 -3
  9. package/esm2022/lib/private/components/smart-crm-contacts/smart-crm-contacts.component.mjs +3 -3
  10. package/esm2022/lib/private/components/smart-crm-leads/smart-crm-leads.component.mjs +3 -3
  11. package/esm2022/lib/private/components/smart-crm-marketing/smart-crm-marketing-list/smart-crm-marketing-details/smart-crm-marketing-details.component.mjs +3 -3
  12. package/esm2022/lib/private/components/smart-crm-marketing/smart-crm-marketing-list/smart-crm-marketing-list.component.mjs +3 -3
  13. package/esm2022/lib/private/components/smart-crm-marketing/smart-crm-marketing-list/smart-crm-marketing-view-details/smart-crm-marketing-view-details.component.mjs +3 -3
  14. package/esm2022/lib/private/components/smart-crm-opportunities/smart-crm-board/smart-crm-board.component.mjs +2 -2
  15. package/esm2022/lib/private/components/smart-crm-opportunities/smart-crm-opportunities-list/smart-crm-opportunities-info/smart-crm-opportunities-info.component.mjs +23 -16
  16. package/esm2022/lib/private/components/smart-crm-opportunities/smart-crm-opportunities-list/smart-crm-opportunities-list.component.mjs +3 -4
  17. package/esm2022/lib/private/components/smart-crm-summary/smart-crm-summary-actions/smart-crm-summary-actions.component.mjs +3 -3
  18. package/esm2022/lib/private/components/smart-crm-summary/smart-crm-summary-others/smart-crm-summary-others.component.mjs +18 -8
  19. package/fesm2022/posiwise-smart-crm.mjs +63 -76
  20. package/fesm2022/posiwise-smart-crm.mjs.map +1 -1
  21. package/lib/private/components/smart-crm-accounts/smart-crm-accounts.component.d.ts +0 -6
  22. package/lib/private/components/smart-crm-summary/smart-crm-summary-others/smart-crm-summary-others.component.d.ts +24 -0
  23. package/package.json +1 -1
@@ -57,6 +57,7 @@ import { moveItemInArray, transferArrayItem, DragDropModule } from '@angular/cdk
57
57
  import uniqBy from 'lodash/uniqBy';
58
58
  import * as i4$2 from 'ngx-pagination';
59
59
  import { NgxPaginationModule } from 'ngx-pagination';
60
+ import { ROUTERS as ROUTERS$1 } from 'libs/smart-crm/src/lib/shared/routers/routers';
60
61
  import { PageAccessGuard } from '@posiwise/core-guards';
61
62
  import { CoreTranslocoModule } from '@posiwise/core-transloco';
62
63
  import { Loader } from '@googlemaps/js-api-loader';
@@ -605,11 +606,11 @@ class SmartCrmCompanyFilesComponent extends AppBaseComponent {
605
606
  super.ngOnDestroy();
606
607
  }
607
608
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompanyFilesComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i2$2.NgbModal }, { token: i2.AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
608
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompanyFilesComponent, selector: "pw-smart-crm-company-files", inputs: { accountId: "accountId", contactId: "contactId", opportunityId: "opportunityId" }, usesInheritance: true, ngImport: i0, template: "<div class=\"row d-none\">\n <div class=\"col-12 mb-3\">\n <h2>Account Files</h2>\n </div>\n</div>\n<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-file\"\n (click)=\"openModal(content)\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add File' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allFiles\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Files...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.AccountFilesMessage.Owner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.AccountFilesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_contact_id\">\n {{ 'Crm.AccountFilesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_id\">\n {{ 'Crm.AccountFilesMessage.Opportunity' | transloco }}\n <p-sortIcon field=\"crm_opportunity_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"file\">\n {{ 'Crm.AccountFilesMessage.File' | transloco }}\n <p-sortIcon field=\"file\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-file>\n <tr>\n <td data-head=\"Owner\">{{ file.owner?.first_name }} {{ file.owner?.last_name }}</td>\n <td data-head=\"Account\">\n <a *ngIf=\"file.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n file.crm_account_id\n ]\">{{ file.crm_account?.name }}</a>\n </td>\n <td data-head=\"Contact\">\n <a *ngIf=\"file.crm_contact_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n file.crm_contact_id\n ]\">{{ file.crm_contact | ifNameNullShowEmail }}</a>\n </td>\n <td data-head=\"Opportunities\">{{ file?.crm_opportunity?.title }}</td>\n <td data-head=\"Files\">\n <a href=\"{{ file.file?.url }}\"\n target=\"blank\">{{\n file.file.url.split('?')[0].split('/')[\n file.file.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess || file.owner_id === userId\">\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(file.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n</div>\n<div *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountFilesMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i12$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i12$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
609
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompanyFilesComponent, selector: "pw-smart-crm-company-files", inputs: { accountId: "accountId", contactId: "contactId", opportunityId: "opportunityId" }, usesInheritance: true, ngImport: i0, template: "<div class=\"row d-none\">\n <div class=\"col-12 mb-3\">\n <h2>Account Files</h2>\n </div>\n</div>\n<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-file\"\n (click)=\"openModal(content)\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add File' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allFiles\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Files...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.AccountFilesMessage.Owner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.AccountFilesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_contact_id\">\n {{ 'Crm.AccountFilesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_id\">\n {{ 'Crm.AccountFilesMessage.Opportunity' | transloco }}\n <p-sortIcon field=\"crm_opportunity_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"file\">\n {{ 'Crm.AccountFilesMessage.File' | transloco }}\n <p-sortIcon field=\"file\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-file>\n <tr>\n <td data-head=\"Owner\">{{ file.owner?.first_name }} {{ file.owner?.last_name }}</td>\n <td data-head=\"Account\">\n <a *ngIf=\"file.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n file.crm_account_id\n ]\">{{ file.crm_account?.name }}</a>\n </td>\n <td data-head=\"Contact\">\n <a *ngIf=\"file.crm_contact_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n file.crm_contact_id\n ]\">{{ file.crm_contact | ifNameNullShowEmail }}</a>\n </td>\n <td data-head=\"Opportunities\">{{ file?.crm_opportunity?.title }}</td>\n <td data-head=\"Files\">\n <a href=\"{{ file.file?.url }}\"\n target=\"blank\">{{\n file.file.url.split('?')[0].split('/')[\n file.file.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess || file.owner_id === userId\">\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(file.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n</div>\n<div *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountFilesMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i12$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i12$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
609
610
  }
610
611
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompanyFilesComponent, decorators: [{
611
612
  type: Component,
612
- args: [{ selector: 'pw-smart-crm-company-files', template: "<div class=\"row d-none\">\n <div class=\"col-12 mb-3\">\n <h2>Account Files</h2>\n </div>\n</div>\n<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-file\"\n (click)=\"openModal(content)\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add File' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allFiles\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Files...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.AccountFilesMessage.Owner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.AccountFilesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_contact_id\">\n {{ 'Crm.AccountFilesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_id\">\n {{ 'Crm.AccountFilesMessage.Opportunity' | transloco }}\n <p-sortIcon field=\"crm_opportunity_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"file\">\n {{ 'Crm.AccountFilesMessage.File' | transloco }}\n <p-sortIcon field=\"file\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-file>\n <tr>\n <td data-head=\"Owner\">{{ file.owner?.first_name }} {{ file.owner?.last_name }}</td>\n <td data-head=\"Account\">\n <a *ngIf=\"file.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n file.crm_account_id\n ]\">{{ file.crm_account?.name }}</a>\n </td>\n <td data-head=\"Contact\">\n <a *ngIf=\"file.crm_contact_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n file.crm_contact_id\n ]\">{{ file.crm_contact | ifNameNullShowEmail }}</a>\n </td>\n <td data-head=\"Opportunities\">{{ file?.crm_opportunity?.title }}</td>\n <td data-head=\"Files\">\n <a href=\"{{ file.file?.url }}\"\n target=\"blank\">{{\n file.file.url.split('?')[0].split('/')[\n file.file.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess || file.owner_id === userId\">\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(file.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n</div>\n<div *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountFilesMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n" }]
613
+ args: [{ selector: 'pw-smart-crm-company-files', template: "<div class=\"row d-none\">\n <div class=\"col-12 mb-3\">\n <h2>Account Files</h2>\n </div>\n</div>\n<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-file\"\n (click)=\"openModal(content)\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add File' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allFiles\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Files...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.AccountFilesMessage.Owner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.AccountFilesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_contact_id\">\n {{ 'Crm.AccountFilesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_id\">\n {{ 'Crm.AccountFilesMessage.Opportunity' | transloco }}\n <p-sortIcon field=\"crm_opportunity_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"file\">\n {{ 'Crm.AccountFilesMessage.File' | transloco }}\n <p-sortIcon field=\"file\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-file>\n <tr>\n <td data-head=\"Owner\">{{ file.owner?.first_name }} {{ file.owner?.last_name }}</td>\n <td data-head=\"Account\">\n <a *ngIf=\"file.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n file.crm_account_id\n ]\">{{ file.crm_account?.name }}</a>\n </td>\n <td data-head=\"Contact\">\n <a *ngIf=\"file.crm_contact_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n file.crm_contact_id\n ]\">{{ file.crm_contact | ifNameNullShowEmail }}</a>\n </td>\n <td data-head=\"Opportunities\">{{ file?.crm_opportunity?.title }}</td>\n <td data-head=\"Files\">\n <a href=\"{{ file.file?.url }}\"\n target=\"blank\">{{\n file.file.url.split('?')[0].split('/')[\n file.file.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess || file.owner_id === userId\">\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(file.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n</div>\n<div *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountFilesMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n" }]
613
614
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i2$2.NgbModal }, { type: i2.AuthService }, { type: i0.ChangeDetectorRef }], propDecorators: { accountId: [{
614
615
  type: Input
615
616
  }], contactId: [{
@@ -1170,11 +1171,11 @@ class SmartCrmCompanyInfoComponent extends AppBaseComponent {
1170
1171
  super.ngOnDestroy();
1171
1172
  }
1172
1173
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompanyInfoComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i2.SubscriptionService }, { token: i2.GeoService }, { token: i2.CommonService }, { token: i2$2.NgbModal }, { token: i2.AuthService }, { token: i0.ChangeDetectorRef }, { token: i2.LogoCacheService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
1173
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompanyInfoComponent, selector: "pw-smart-crm-company-info", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Account Info\n </h2>\n </div>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToAddOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isDataLoaded\">\n <p-progressSpinner> </p-progressSpinner>\n </div>\n <div *ngIf=\"isDataLoaded\">\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img alt=\"Profile Image\"\n width=\"100\"\n height=\"100\"\n [src]=\"getAccountLogo(data?.company_url)\"\n class=\"img-fluid company-logo\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.name }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"isFormEdit = !isFormEdit; this.getAllSubscriptionMembers()\">{{ 'Button.Edit' | transloco }}</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Name' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.Location' | transloco\n }}</label>\n <input ngx-gp-autocomplete\n class=\"form-control rounded-0 ps-1 user-value\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"countries$ | async as countries\">\n <label>{{ 'Crm.AccountMessage.Country' | transloco\n }}<span class=\"text-danger required-icon\">*</span>\n </label>\n <select class=\"form-select\"\n formControlName=\"country\"\n [ngClass]=\"{ 'is-invalid': submitted && f['country'].errors }\">\n <option *ngFor=\"let country of countries\"\n [value]=\"country.code\">\n {{ country.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{ 'Crm.AccountMessage.Owner' | transloco }}</label>\n <p class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.owner_id\">\n {{ data?.owner?.first_name }} {{ data?.owner?.last_name }}\n </p>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.owner_id\"\n [suggestions]=\"filteredOwner\"\n formControlName=\"owner_id\"\n dataKey=\"id\"\n field=\"first_name\"\n [dropdown]=\"true\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search owner\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.CompanyUrl' | transloco\n }}</label>\n <a [href]=\"data?.company_url\"\n target=\"blank\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.company_url\">{{ data?.company_url }}</a>\n <input *ngIf=\"!isFormEdit || !data?.company_url\"\n type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"company_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"data?.tel\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Tel' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"tel\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationTypes$ | async as types\">\n <label>{{ 'Organization.OrganizationType' | transloco }}</label>\n <div class=\"mb-3\">\n <select formControlName=\"organization_type_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_type_id'].errors }\">\n <option *ngFor=\"let option of types['organization_types']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationIndustries$ | async as industries\">\n <label>{{ 'Organization.OrganizationIndustry' | transloco }}</label>\n <select formControlName=\"organization_industry_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_industry_id'].errors }\">\n <option *ngFor=\"let option of industries['organization_industries']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationSizes$ | async as sizes\">\n <label>{{ 'Crm.AccountMessage.Size' | transloco }}</label>\n <select formControlName=\"organization_size_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_size_id'].errors }\">\n <option *ngFor=\"let option of sizes['organization_sizes']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Status' | transloco }}</label>\n <select formControlName=\"status\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['status'].errors }\">\n <option *ngFor=\"let option of status\"\n [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Priority' | transloco }}</label>\n <select formControlName=\"priority\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['priority'].errors }\">\n <option *ngFor=\"let option of priority\"\n [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Source' | transloco }}</label>\n <select formControlName=\"crm_source_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id'].errors }\">\n <option *ngFor=\"let option of source\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Crm.AccountMessage.Description' | transloco\"\n name=\"description\">\n <textarea rows=\"5\"\n type=\"text\"\n class=\"form-control\"\n formControlName=\"description\"\n id=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\"></textarea>\n </pw-input-container>\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getAccountDetails()\"\n value=\"Cancel\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary ms-3\"\n (click)=\"updateAccountInfo()\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionControls.get('crm_action_id').invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"ui-fluid skills-modal col-sm-4 ps-0\">\n <p-autoComplete [suggestions]=\"filteredContact\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"searchContact($event)\"\n (onSelect)=\"selectContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\"w-100\"\n placeholder=\"Search contact\"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <a class=\"btn btn-outline-primary me-0 me-sm-2\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2\">Submit Note</button>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.AccountMessage.NoActionsInAccountInfoMessage' | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!accountComments?.length && isLoaded\"\n class=\"no-actions pt-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"accountComments?.length\">\n <div id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper timeline-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollTimeline()\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd || last }\"\n *ngFor=\"\n let item of accountComments;\n index as i;\n let odd = odd;\n let even = even;\n let last = last;\n let first = first\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span></span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <div class=\"auto-complete mb-3 ui-fluid skills-modal\">\n <p-autoComplete [(ngModel)]=\"item.crm_contact\"\n [suggestions]=\"filteredContactComment\"\n dataKey=\" id \"\n field=\"first_name\"\n dropdown=\" true \"\n (completeMethod)=\"\n searchContactInComment($event)\n \"\n (onSelect)=\"selectCommentContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\" w-100 \"\n placeholder=\" Search contact \"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <p class=\"float-start mb-0\"\n *ngIf=\"\n !showFullComment || item.id !== commentId\n \">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true;\n commentId = item.id\n \">...show more\n </a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 &&\n showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event, item)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <a class=\"text-secondary action-owner\"\n *ngIf=\"item.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n item.crm_contact.id\n ]\">{{ item.crm_contact.first_name }}\n {{ item.crm_contact.last_name || '' }}</a>\n <p>\n By\n {{\n item.owner.first_name +\n ' ' +\n item.owner.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i\n class=\"fa fa-tasks completed\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i\n class=\"far fa-window-close\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <div class=\"control-btns mt-3 text-end form-action-buttons\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined, '')\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Contacts</a>\n <ng-template ngbNavContent>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactAdd,\n accountId\n ]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"contacts\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"headline\">\n {{ 'Crm.ContactMessage.Headline' | transloco }}\n <p-sortIcon field=\"headline\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\">{{\n contact.first_name + ' ' + contact.last_name\n | textTruncate: 20\n }}</a>\n </td>\n <td data-head=\"OwnerName\">\n {{ contact.owner | ifNameNullShowEmail }}\n </td>\n <td data-head=\"Headline\"\n class=\"headline-content\">\n {{ contact?.headline | textTruncate: 20 }}\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\">\n <i\n class=\"fa fa-eye see-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.opportunityAdd\n ]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i\n class=\"fa fa-plus-circle add-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.contactDetails,\n contact.id\n ]\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDeleteContact(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n </div>\n <div *ngIf=\"totalRecordsUnFiltered === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let versioning of accountVersioning\">\n <p>\n <strong>Event: </strong>{{ versioning.event }} |\n <strong>Author: </strong><a *ngIf=\"versioning?.author\"\n [routerLink]=\"['/members', versioning?.author?.slug]\">{{ versioning?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ versioning.created_at | dateFormat: 'datetime' }}<br />\n <strong>Object: </strong>{{ versioning.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"accountVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"4\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [accountId]=\"accountId\"></pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.auto-complete{display:none;margin-top:10px}.show-controls .comment-field,.show-controls .auto-complete,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn,.show-controls .action-owner{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.timeline-container{height:700px;overflow-y:scroll}.action-btn.active{color:#fff!important;background-color:var(--first)}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i4$1.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i5.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i2$2.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2$2.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2$2.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2$2.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2$2.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2$2.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2$2.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i8.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i11.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i12$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i12$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i17.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: SmartCrmCompanyFilesComponent, selector: "pw-smart-crm-company-files", inputs: ["accountId", "contactId", "opportunityId"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.JsonPipe, name: "json" }, { kind: "pipe", type: i2$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1174
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompanyInfoComponent, selector: "pw-smart-crm-company-info", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Account Info\n </h2>\n </div>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToAddOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isDataLoaded\">\n <p-progressSpinner> </p-progressSpinner>\n </div>\n <div *ngIf=\"isDataLoaded\">\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img alt=\"Profile Image\"\n width=\"100\"\n height=\"100\"\n [src]=\"getAccountLogo(data?.company_url)\"\n class=\"img-fluid company-logo\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.name }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"isFormEdit = !isFormEdit; this.getAllSubscriptionMembers()\">{{ 'Button.Edit' | transloco }}</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Name' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.Location' | transloco\n }}</label>\n <input ngx-gp-autocomplete\n class=\"form-control rounded-0 ps-1 user-value\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"countries$ | async as countries\">\n <label>{{ 'Crm.AccountMessage.Country' | transloco\n }}<span class=\"text-danger required-icon\">*</span>\n </label>\n <select class=\"form-select\"\n formControlName=\"country\"\n [ngClass]=\"{ 'is-invalid': submitted && f['country'].errors }\">\n <option *ngFor=\"let country of countries\"\n [value]=\"country.code\">\n {{ country.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{ 'Crm.AccountMessage.Owner' | transloco }}</label>\n <p class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.owner_id\">\n {{ data?.owner?.first_name }} {{ data?.owner?.last_name }}\n </p>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.owner_id\"\n [suggestions]=\"filteredOwner\"\n formControlName=\"owner_id\"\n dataKey=\"id\"\n field=\"first_name\"\n [dropdown]=\"true\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search owner\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.CompanyUrl' | transloco\n }}</label>\n <a [href]=\"data?.company_url\"\n target=\"blank\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.company_url\">{{ data?.company_url }}</a>\n <input *ngIf=\"!isFormEdit || !data?.company_url\"\n type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"company_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"data?.tel\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Tel' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"tel\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationTypes$ | async as types\">\n <label>{{ 'Organization.OrganizationType' | transloco }}</label>\n <div class=\"mb-3\">\n <select formControlName=\"organization_type_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_type_id'].errors }\">\n <option *ngFor=\"let option of types['organization_types']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationIndustries$ | async as industries\">\n <label>{{ 'Organization.OrganizationIndustry' | transloco }}</label>\n <select formControlName=\"organization_industry_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_industry_id'].errors }\">\n <option *ngFor=\"let option of industries['organization_industries']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationSizes$ | async as sizes\">\n <label>{{ 'Crm.AccountMessage.Size' | transloco }}</label>\n <select formControlName=\"organization_size_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_size_id'].errors }\">\n <option *ngFor=\"let option of sizes['organization_sizes']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Status' | transloco }}</label>\n <select formControlName=\"status\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['status'].errors }\">\n <option *ngFor=\"let option of status\"\n [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Priority' | transloco }}</label>\n <select formControlName=\"priority\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['priority'].errors }\">\n <option *ngFor=\"let option of priority\"\n [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Source' | transloco }}</label>\n <select formControlName=\"crm_source_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id'].errors }\">\n <option *ngFor=\"let option of source\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Crm.AccountMessage.Description' | transloco\"\n name=\"description\">\n <textarea rows=\"5\"\n type=\"text\"\n class=\"form-control\"\n formControlName=\"description\"\n id=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\"></textarea>\n </pw-input-container>\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getAccountDetails()\"\n value=\"Cancel\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary ms-3\"\n (click)=\"updateAccountInfo()\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionControls.get('crm_action_id').invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"ui-fluid skills-modal col-sm-4 ps-0\">\n <p-autoComplete [suggestions]=\"filteredContact\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"searchContact($event)\"\n (onSelect)=\"selectContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\"w-100\"\n placeholder=\"Search contact\"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <a class=\"btn btn-outline-primary me-0 me-sm-2\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2\">Submit Note</button>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.AccountMessage.NoActionsInAccountInfoMessage' | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!accountComments?.length && isLoaded\"\n class=\"no-actions pt-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"accountComments?.length\">\n <div id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper timeline-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollTimeline()\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd || last }\"\n *ngFor=\"\n let item of accountComments;\n index as i;\n let odd = odd;\n let even = even;\n let last = last;\n let first = first\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span></span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <div class=\"auto-complete mb-3 ui-fluid skills-modal\">\n <p-autoComplete [(ngModel)]=\"item.crm_contact\"\n [suggestions]=\"filteredContactComment\"\n dataKey=\" id \"\n field=\"first_name\"\n dropdown=\" true \"\n (completeMethod)=\"\n searchContactInComment($event)\n \"\n (onSelect)=\"selectCommentContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\" w-100 \"\n placeholder=\" Search contact \"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <p class=\"float-start mb-0\"\n *ngIf=\"\n !showFullComment || item.id !== commentId\n \">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true;\n commentId = item.id\n \">...show more\n </a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 &&\n showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event, item)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <a class=\"text-secondary action-owner\"\n *ngIf=\"item.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n item.crm_contact.id\n ]\">{{ item.crm_contact.first_name }}\n {{ item.crm_contact.last_name || '' }}</a>\n <p>\n By\n {{\n item.owner.first_name +\n ' ' +\n item.owner.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i\n class=\"fa fa-tasks completed\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i\n class=\"far fa-window-close\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <div class=\"control-btns mt-3 text-end form-action-buttons\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined, '')\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Contacts</a>\n <ng-template ngbNavContent>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactAdd,\n accountId\n ]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"contacts\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"headline\">\n {{ 'Crm.ContactMessage.Headline' | transloco }}\n <p-sortIcon field=\"headline\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\"> {{ (contact.first_name || '') + ' ' + (contact.last_name || '') | textTruncate: 20 }}</a>\n </td>\n <td data-head=\"OwnerName\">\n {{ contact.owner | ifNameNullShowEmail }}\n </td>\n <td data-head=\"Headline\"\n class=\"headline-content\">\n {{ contact?.headline | textTruncate: 20 }}\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\">\n <i\n class=\"fa fa-eye see-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.opportunityAdd\n ]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i\n class=\"fa fa-plus-circle add-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.contactDetails,\n contact.id\n ]\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDeleteContact(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n </div>\n <div *ngIf=\"totalRecordsUnFiltered === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let versioning of accountVersioning\">\n <p>\n <strong>Event: </strong>{{ versioning.event }} |\n <strong>Author: </strong><a *ngIf=\"versioning?.author\"\n [routerLink]=\"['/members', versioning?.author?.slug]\">{{ versioning?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ versioning.created_at | dateFormat: 'datetime' }}<br />\n <strong>Object: </strong>{{ versioning.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"accountVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"4\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [accountId]=\"accountId\"></pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.auto-complete{display:none;margin-top:10px}.show-controls .comment-field,.show-controls .auto-complete,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn,.show-controls .action-owner{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.timeline-container{height:700px;overflow-y:scroll}.action-btn.active{color:#fff!important;background-color:var(--first)}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i4$1.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i5.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i2$2.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2$2.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2$2.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2$2.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2$2.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2$2.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2$2.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i8.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i11.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i12$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i12$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i17.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: SmartCrmCompanyFilesComponent, selector: "pw-smart-crm-company-files", inputs: ["accountId", "contactId", "opportunityId"] }, { kind: "pipe", type: i2$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.JsonPipe, name: "json" }, { kind: "pipe", type: i2$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1174
1175
  }
1175
1176
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompanyInfoComponent, decorators: [{
1176
1177
  type: Component,
1177
- args: [{ selector: 'pw-smart-crm-company-info', template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Account Info\n </h2>\n </div>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToAddOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isDataLoaded\">\n <p-progressSpinner> </p-progressSpinner>\n </div>\n <div *ngIf=\"isDataLoaded\">\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img alt=\"Profile Image\"\n width=\"100\"\n height=\"100\"\n [src]=\"getAccountLogo(data?.company_url)\"\n class=\"img-fluid company-logo\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.name }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"isFormEdit = !isFormEdit; this.getAllSubscriptionMembers()\">{{ 'Button.Edit' | transloco }}</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Name' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.Location' | transloco\n }}</label>\n <input ngx-gp-autocomplete\n class=\"form-control rounded-0 ps-1 user-value\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"countries$ | async as countries\">\n <label>{{ 'Crm.AccountMessage.Country' | transloco\n }}<span class=\"text-danger required-icon\">*</span>\n </label>\n <select class=\"form-select\"\n formControlName=\"country\"\n [ngClass]=\"{ 'is-invalid': submitted && f['country'].errors }\">\n <option *ngFor=\"let country of countries\"\n [value]=\"country.code\">\n {{ country.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{ 'Crm.AccountMessage.Owner' | transloco }}</label>\n <p class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.owner_id\">\n {{ data?.owner?.first_name }} {{ data?.owner?.last_name }}\n </p>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.owner_id\"\n [suggestions]=\"filteredOwner\"\n formControlName=\"owner_id\"\n dataKey=\"id\"\n field=\"first_name\"\n [dropdown]=\"true\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search owner\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.CompanyUrl' | transloco\n }}</label>\n <a [href]=\"data?.company_url\"\n target=\"blank\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.company_url\">{{ data?.company_url }}</a>\n <input *ngIf=\"!isFormEdit || !data?.company_url\"\n type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"company_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"data?.tel\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Tel' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"tel\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationTypes$ | async as types\">\n <label>{{ 'Organization.OrganizationType' | transloco }}</label>\n <div class=\"mb-3\">\n <select formControlName=\"organization_type_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_type_id'].errors }\">\n <option *ngFor=\"let option of types['organization_types']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationIndustries$ | async as industries\">\n <label>{{ 'Organization.OrganizationIndustry' | transloco }}</label>\n <select formControlName=\"organization_industry_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_industry_id'].errors }\">\n <option *ngFor=\"let option of industries['organization_industries']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationSizes$ | async as sizes\">\n <label>{{ 'Crm.AccountMessage.Size' | transloco }}</label>\n <select formControlName=\"organization_size_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_size_id'].errors }\">\n <option *ngFor=\"let option of sizes['organization_sizes']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Status' | transloco }}</label>\n <select formControlName=\"status\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['status'].errors }\">\n <option *ngFor=\"let option of status\"\n [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Priority' | transloco }}</label>\n <select formControlName=\"priority\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['priority'].errors }\">\n <option *ngFor=\"let option of priority\"\n [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Source' | transloco }}</label>\n <select formControlName=\"crm_source_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id'].errors }\">\n <option *ngFor=\"let option of source\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Crm.AccountMessage.Description' | transloco\"\n name=\"description\">\n <textarea rows=\"5\"\n type=\"text\"\n class=\"form-control\"\n formControlName=\"description\"\n id=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\"></textarea>\n </pw-input-container>\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getAccountDetails()\"\n value=\"Cancel\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary ms-3\"\n (click)=\"updateAccountInfo()\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionControls.get('crm_action_id').invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"ui-fluid skills-modal col-sm-4 ps-0\">\n <p-autoComplete [suggestions]=\"filteredContact\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"searchContact($event)\"\n (onSelect)=\"selectContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\"w-100\"\n placeholder=\"Search contact\"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <a class=\"btn btn-outline-primary me-0 me-sm-2\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2\">Submit Note</button>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.AccountMessage.NoActionsInAccountInfoMessage' | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!accountComments?.length && isLoaded\"\n class=\"no-actions pt-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"accountComments?.length\">\n <div id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper timeline-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollTimeline()\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd || last }\"\n *ngFor=\"\n let item of accountComments;\n index as i;\n let odd = odd;\n let even = even;\n let last = last;\n let first = first\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span></span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <div class=\"auto-complete mb-3 ui-fluid skills-modal\">\n <p-autoComplete [(ngModel)]=\"item.crm_contact\"\n [suggestions]=\"filteredContactComment\"\n dataKey=\" id \"\n field=\"first_name\"\n dropdown=\" true \"\n (completeMethod)=\"\n searchContactInComment($event)\n \"\n (onSelect)=\"selectCommentContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\" w-100 \"\n placeholder=\" Search contact \"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <p class=\"float-start mb-0\"\n *ngIf=\"\n !showFullComment || item.id !== commentId\n \">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true;\n commentId = item.id\n \">...show more\n </a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 &&\n showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event, item)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <a class=\"text-secondary action-owner\"\n *ngIf=\"item.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n item.crm_contact.id\n ]\">{{ item.crm_contact.first_name }}\n {{ item.crm_contact.last_name || '' }}</a>\n <p>\n By\n {{\n item.owner.first_name +\n ' ' +\n item.owner.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i\n class=\"fa fa-tasks completed\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i\n class=\"far fa-window-close\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <div class=\"control-btns mt-3 text-end form-action-buttons\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined, '')\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Contacts</a>\n <ng-template ngbNavContent>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactAdd,\n accountId\n ]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"contacts\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"headline\">\n {{ 'Crm.ContactMessage.Headline' | transloco }}\n <p-sortIcon field=\"headline\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\">{{\n contact.first_name + ' ' + contact.last_name\n | textTruncate: 20\n }}</a>\n </td>\n <td data-head=\"OwnerName\">\n {{ contact.owner | ifNameNullShowEmail }}\n </td>\n <td data-head=\"Headline\"\n class=\"headline-content\">\n {{ contact?.headline | textTruncate: 20 }}\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\">\n <i\n class=\"fa fa-eye see-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.opportunityAdd\n ]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i\n class=\"fa fa-plus-circle add-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.contactDetails,\n contact.id\n ]\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDeleteContact(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n </div>\n <div *ngIf=\"totalRecordsUnFiltered === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let versioning of accountVersioning\">\n <p>\n <strong>Event: </strong>{{ versioning.event }} |\n <strong>Author: </strong><a *ngIf=\"versioning?.author\"\n [routerLink]=\"['/members', versioning?.author?.slug]\">{{ versioning?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ versioning.created_at | dateFormat: 'datetime' }}<br />\n <strong>Object: </strong>{{ versioning.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"accountVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"4\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [accountId]=\"accountId\"></pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.auto-complete{display:none;margin-top:10px}.show-controls .comment-field,.show-controls .auto-complete,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn,.show-controls .action-owner{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.timeline-container{height:700px;overflow-y:scroll}.action-btn.active{color:#fff!important;background-color:var(--first)}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"] }]
1178
+ args: [{ selector: 'pw-smart-crm-company-info', template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Account Info\n </h2>\n </div>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToAddOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isDataLoaded\">\n <p-progressSpinner> </p-progressSpinner>\n </div>\n <div *ngIf=\"isDataLoaded\">\n <div class=\"row\">\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img alt=\"Profile Image\"\n width=\"100\"\n height=\"100\"\n [src]=\"getAccountLogo(data?.company_url)\"\n class=\"img-fluid company-logo\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.name }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"isFormEdit = !isFormEdit; this.getAllSubscriptionMembers()\">{{ 'Button.Edit' | transloco }}</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Name' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.Location' | transloco\n }}</label>\n <input ngx-gp-autocomplete\n class=\"form-control rounded-0 ps-1 user-value\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"countries$ | async as countries\">\n <label>{{ 'Crm.AccountMessage.Country' | transloco\n }}<span class=\"text-danger required-icon\">*</span>\n </label>\n <select class=\"form-select\"\n formControlName=\"country\"\n [ngClass]=\"{ 'is-invalid': submitted && f['country'].errors }\">\n <option *ngFor=\"let country of countries\"\n [value]=\"country.code\">\n {{ country.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{ 'Crm.AccountMessage.Owner' | transloco }}</label>\n <p class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.owner_id\">\n {{ data?.owner?.first_name }} {{ data?.owner?.last_name }}\n </p>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.owner_id\"\n [suggestions]=\"filteredOwner\"\n formControlName=\"owner_id\"\n dataKey=\"id\"\n field=\"first_name\"\n [dropdown]=\"true\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search owner\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.AccountMessage.CompanyUrl' | transloco\n }}</label>\n <a [href]=\"data?.company_url\"\n target=\"blank\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.company_url\">{{ data?.company_url }}</a>\n <input *ngIf=\"!isFormEdit || !data?.company_url\"\n type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"company_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['company_url'].errors }\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"data?.tel\">\n <label class=\"label mb-0\">{{ 'Crm.AccountMessage.Tel' | transloco }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"tel\" />\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationTypes$ | async as types\">\n <label>{{ 'Organization.OrganizationType' | transloco }}</label>\n <div class=\"mb-3\">\n <select formControlName=\"organization_type_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_type_id'].errors }\">\n <option *ngFor=\"let option of types['organization_types']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationIndustries$ | async as industries\">\n <label>{{ 'Organization.OrganizationIndustry' | transloco }}</label>\n <select formControlName=\"organization_industry_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_industry_id'].errors }\">\n <option *ngFor=\"let option of industries['organization_industries']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\"\n *ngIf=\"organizationSizes$ | async as sizes\">\n <label>{{ 'Crm.AccountMessage.Size' | transloco }}</label>\n <select formControlName=\"organization_size_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['organization_size_id'].errors }\">\n <option *ngFor=\"let option of sizes['organization_sizes']\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Status' | transloco }}</label>\n <select formControlName=\"status\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['status'].errors }\">\n <option *ngFor=\"let option of status\"\n [value]=\"option\">{{ option }}</option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Priority' | transloco }}</label>\n <select formControlName=\"priority\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['priority'].errors }\">\n <option *ngFor=\"let option of priority\"\n [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <label>{{ 'Crm.AccountMessage.Source' | transloco }}</label>\n <select formControlName=\"crm_source_id\"\n class=\"form-control form-select\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id'].errors }\">\n <option *ngFor=\"let option of source\"\n [value]=\"option.id\">\n {{ option.name }}\n </option>\n </select>\n </div>\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Crm.AccountMessage.Description' | transloco\"\n name=\"description\">\n <textarea rows=\"5\"\n type=\"text\"\n class=\"form-control\"\n formControlName=\"description\"\n id=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors }\"></textarea>\n </pw-input-container>\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getAccountDetails()\"\n value=\"Cancel\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary ms-3\"\n (click)=\"updateAccountInfo()\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionControls.get('crm_action_id').invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"ui-fluid skills-modal col-sm-4 ps-0\">\n <p-autoComplete [suggestions]=\"filteredContact\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"searchContact($event)\"\n (onSelect)=\"selectContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\"w-100\"\n placeholder=\"Search contact\"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <a class=\"btn btn-outline-primary me-0 me-sm-2\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2\">Submit Note</button>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.AccountMessage.NoActionsInAccountInfoMessage' | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!accountComments?.length && isLoaded\"\n class=\"no-actions pt-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"accountComments?.length\">\n <div id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper timeline-container\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollTimeline()\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd || last }\"\n *ngFor=\"\n let item of accountComments;\n index as i;\n let odd = odd;\n let even = even;\n let last = last;\n let first = first\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span></span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <div class=\"auto-complete mb-3 ui-fluid skills-modal\">\n <p-autoComplete [(ngModel)]=\"item.crm_contact\"\n [suggestions]=\"filteredContactComment\"\n dataKey=\" id \"\n field=\"first_name\"\n dropdown=\" true \"\n (completeMethod)=\"\n searchContactInComment($event)\n \"\n (onSelect)=\"selectCommentContact($event)\"\n (onBlur)=\"OnContactBlur()\"\n styleClass=\" w-100 \"\n placeholder=\" Search contact \"\n [multiple]=\"false\"\n (onDropdownClick)=\"onDropdownClick()\">\n </p-autoComplete>\n </div>\n <p class=\"float-start mb-0\"\n *ngIf=\"\n !showFullComment || item.id !== commentId\n \">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true;\n commentId = item.id\n \">...show more\n </a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 &&\n showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event, item)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <a class=\"text-secondary action-owner\"\n *ngIf=\"item.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n item.crm_contact.id\n ]\">{{ item.crm_contact.first_name }}\n {{ item.crm_contact.last_name || '' }}</a>\n <p>\n By\n {{\n item.owner.first_name +\n ' ' +\n item.owner.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i\n class=\"fa fa-tasks completed\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i\n class=\"far fa-window-close\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <div class=\"control-btns mt-3 text-end form-action-buttons\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined, '')\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Contacts</a>\n <ng-template ngbNavContent>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactAdd,\n accountId\n ]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"contacts\"\n [paginator]=\"totalRecords !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"headline\">\n {{ 'Crm.ContactMessage.Headline' | transloco }}\n <p-sortIcon field=\"headline\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\"> {{ (contact.first_name || '') + ' ' + (contact.last_name || '') | textTruncate: 20 }}</a>\n </td>\n <td data-head=\"OwnerName\">\n {{ contact.owner | ifNameNullShowEmail }}\n </td>\n <td data-head=\"Headline\"\n class=\"headline-content\">\n {{ contact?.headline | textTruncate: 20 }}\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n contact.id\n ]\">\n <i\n class=\"fa fa-eye see-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.opportunityAdd\n ]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i\n class=\"fa fa-plus-circle add-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' +\n subscription?.slug +\n routers.contactDetails,\n contact.id\n ]\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDeleteContact(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n </div>\n <div *ngIf=\"totalRecordsUnFiltered === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let versioning of accountVersioning\">\n <p>\n <strong>Event: </strong>{{ versioning.event }} |\n <strong>Author: </strong><a *ngIf=\"versioning?.author\"\n [routerLink]=\"['/members', versioning?.author?.slug]\">{{ versioning?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ versioning.created_at | dateFormat: 'datetime' }}<br />\n <strong>Object: </strong>{{ versioning.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"accountVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"4\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [accountId]=\"accountId\"></pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.auto-complete{display:none;margin-top:10px}.show-controls .comment-field,.show-controls .auto-complete,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn,.show-controls .action-owner{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.timeline-container{height:700px;overflow-y:scroll}.action-btn.active{color:#fff!important;background-color:var(--first)}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"] }]
1178
1179
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i2.SubscriptionService }, { type: i2.GeoService }, { type: i2.CommonService }, { type: i2$2.NgbModal }, { type: i2.AuthService }, { type: i0.ChangeDetectorRef }, { type: i2.LogoCacheService }, { type: Document, decorators: [{
1179
1180
  type: Inject,
1180
1181
  args: [DOCUMENT]
@@ -1245,8 +1246,6 @@ class SmartCrmCompaniesComponent extends AppBaseComponent {
1245
1246
  if (this.permissionService.isGranted('Pages.Beta')) {
1246
1247
  this.getAccountGeography();
1247
1248
  this.getAccountActivities();
1248
- this.getAccountLastInvoices();
1249
- this.getAccountInsight();
1250
1249
  }
1251
1250
  }
1252
1251
  });
@@ -1458,30 +1457,6 @@ class SmartCrmCompaniesComponent extends AppBaseComponent {
1458
1457
  }
1459
1458
  });
1460
1459
  }
1461
- /** Function to call last invoice */
1462
- getAccountLastInvoices() {
1463
- this.crmService
1464
- .getCrmAnalytics(this.subscription?.id, 'accounts_last_invoices')
1465
- .subscribe(response => {
1466
- if (typeof response === 'object' && Object.keys(response).length === 0) {
1467
- this.accountLastInvoices = [];
1468
- }
1469
- else
1470
- this.accountLastInvoices = response;
1471
- });
1472
- }
1473
- /** Function to call account insight */
1474
- getAccountInsight() {
1475
- this.crmService
1476
- .getCrmAnalytics(this.subscription?.id, 'accounts_insights')
1477
- .subscribe(response => {
1478
- if (typeof response === 'object' && Object.keys(response).length === 0) {
1479
- this.accountInsight = [];
1480
- }
1481
- else
1482
- this.accountInsight = response;
1483
- });
1484
- }
1485
1460
  getCountryFromLocation(location) {
1486
1461
  const parts = location?.split(',') || [];
1487
1462
  return parts[parts.length - 1]?.trim() || '';
@@ -1496,11 +1471,11 @@ class SmartCrmCompaniesComponent extends AppBaseComponent {
1496
1471
  super.ngOnDestroy();
1497
1472
  }
1498
1473
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompaniesComponent, deps: [{ token: i1.CrmService }, { token: i2.CommonService }, { token: i2.LogoCacheService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1499
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompaniesComponent, selector: "pw-smart-crm-companies", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Accounts</h2>\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.AccountMessage.AddAccount' | transloco }} </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.accounts\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\" [loading]=\"loading\" [filterDelay]=\"1000\" (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row m-0\">\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Industry\" [options]=\"searchOptions\" [(ngModel)]=\"filterByIndustries\"\n (onChange)=\"onSearchOptionChange($event, 'industry')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Size\" [options]=\"organizationSizes\" [(ngModel)]=\"filterBySizeId\"\n (onChange)=\"onSearchOptionChange($event, 'size')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Status\" [options]=\"status\" [(ngModel)]=\"filterByStatus\"\n (onChange)=\"onSearchOptionChange($event, 'status')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Priority\" [options]=\"priority\" [(ngModel)]=\"filterByPriority\"\n (onChange)=\"onSearchOptionChange($event, 'priority')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Source\" [options]=\"source\" [(ngModel)]=\"filterBySource\"\n (onChange)=\"onSearchOptionChange($event, 'source')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4 mb-2\">\n <input ngx-gp-autocomplete class=\"form-control location\" #places=\"ngx-places\" [(ngModel)]=\"searchLocationText\"\n placeholder=\"Search location...\" (keyup)=\"locationSearch($event)\"\n (onAddressChange)=\"handleAddressChange($event)\" />\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start btn-filter-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n <div class=\"text-end mt-0 mt-sm-3\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText size=\"50\" placeholder=\"Search accounts...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"name\"> {{ 'Crm.AccountMessage.Name' | transloco }} <p-sortIcon field=\"name\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"location\"> {{ 'Crm.AccountMessage.Location' | transloco }} <p-sortIcon\n field=\"location\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"owner_id\"> {{ 'Crm.AccountMessage.Owner' | transloco }} <p-sortIcon\n field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"organization_size_id\"> {{ 'Crm.AccountMessage.Size' | transloco }} <p-sortIcon\n field=\"organization_size_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"expected_mrr\" class=\"mrr-header\"> {{ 'Crm.AccountMessage.MRR' | transloco }} <p-sortIcon field=\"expected_mrr\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"signed_up_at\"> {{ 'Crm.AccountMessage.SignUp' | transloco }} <p-sortIcon field=\"signed_up_at\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_quarter\"> {{ 'Crm.AccountMessage.Quarter' | transloco }} <p-sortIcon field=\"sessions_last_quarter\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Month' | transloco }} <p-sortIcon field=\"sessions_last_month\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Status' | transloco }} <p-sortIcon field=\"sessions_staus\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Priority' | transloco }} <p-sortIcon field=\"sessions_priority\">\n </p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-account>\n <tr>\n <td data-head=\"Name\" class=\"name-column\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.id]\" class=\"name-link\">\n <img alt=\"company image\" [src]=\"getAccountLogo(account.company_url)\" class=\"img-fluid company-logo me-2\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n <span [ngbTooltip]=\"account.name\" class=\"account-name\" [title]=\"account.name\">{{ account.name | textTruncate:30 }}</span>\n <i [ngClass]=\"getUserAccountInfo(account).iconClass\" [ngbTooltip]=\"getUserAccountInfo(account).message\"\n class=\"info-icon\"></i>\n </a>\n </td>\n <td data-head=\"Location\" class=\"no-wrap\"><span [ngbTooltip]=\"account.location\">{{ getCountryFromLocation(account.location) }}</span></td>\n <td data-head=\"Owner\">\n <a [routerLink]=\"['/members', account?.owner?.slug]\"> {{ account.owner.first_name.charAt(0) }}. {{account.owner.last_name}}</a>\n </td>\n <td data-head=\"Size\" class=\"no-wrap\">{{ account?.organisation_size?.name !== 'Not available' ? account?.organisation_size?.name : '' }}\n</td>\n<td data-head=\"MRR\" class=\"no-wrap fw-bold expected-mrr\">\n {{ account?.expected_mrr !== null && account?.expected_mrr !== 0 ? formatMRR(account?.expected_mrr) : '' }}\n</td>\n <td data-head=\"Signed Up\">{{ account.signed_up_at | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Quarter\">{{ account.sessions_last_quarter }}</td>\n <td data-head=\"Month\">{{ account.sessions_last_month }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"account.status === 'Prospect'\" class=\"badge bg-primary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Inactive'\" class=\"badge bg-secondary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - New'\" class=\"badge bg-info\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Inactive'\" class=\"badge bg-warning\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Old'\" class=\"badge bg-dark\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Dead'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Competitor'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Vendor'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Supplier'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Other'\" class=\"badge bg-teal\">{{account.status}}</span>\n </td>\n\n <td data-head=\"Priority\">\n <span *ngIf=\"account.priority === 'A - Ideal Fit'\" class=\"badge bg-success\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'B - High Potential'\" class=\"badge bg-primary\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'C - Low Potential'\" class=\"badge bg-warning\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'D - Out of market'\" class=\"badge bg-secondary\">{{account.priority}}</span>\n </td>\n\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline icon-ul\">\n <li ngbTooltip=\"See contacts\" class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts, account.id]\">\n <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n </li>\n <ng-container *ngIf=\"hasAccess || account.owner_id === userId\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.accounts,\n account.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(account.id, subscription.id)\"\n aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoAccountMessage' | transloco\"> </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"accountInsight\" [paginator]=\"accountInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountInsight.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Value' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Reason' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-insight>\n <tr>\n <td data-head=\"Title\">{{ insight.title }}</td>\n <td data-head=\"Value\">{{ insight.value }}</td>\n <td data-head=\"Reason\">{{ insight.reason }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountInsight.length }}</span>\n </div>\n <div *ngIf=\"accountInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"accountGeography\">\n <plotly-plot [data]=\"accountGeography?.data\" [layout]=\"accountGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!accountGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Last Activities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Last Activities</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountActivities?.length\">\n <p-table class=\"table\" #dt [value]=\"accountActivities\" [paginator]=\"accountInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountActivities.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Action' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.When' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-activities>\n <tr>\n <td data-head=\"Owner\"> {{ activities.owner?.first_name.charAt(0) }}. {{ activities.owner?.last_name }} </td>\n <td data-head=\"Account\">{{ activities.crm_account?.name }}</td>\n <td data-head=\"Contact\"> {{ activities.crm_contact?.first_name }} {{ activities.crm_contact?.last_name }}\n </td>\n\n <td data-head=\"Action\">\n <span [ngbTooltip]=\"activities.comment\" [appDynamicBadge]=\"{\n itemsArray: actionNames,\n item: activities.crm_action?.name\n }\"\n color=\"blue-grey\"\n class=\"badge\">{{ activities.crm_action?.name }}</span>\n </td>\n <td data-head=\"When\">{{ activities.when | date:'dd-MMM-YYYY' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountActivities.length }}</span>\n </div>\n <div *ngIf=\"accountActivities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Last Invoices -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Last Invoices</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountLastInvoices?.length\">\n <p-table class=\"table\" #dt [value]=\"accountLastInvoices\" [paginator]=\"accountLastInvoices?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountLastInvoices.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.File' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-invoice>\n <tr>\n <td data-head=\"Owner\"> {{ invoice.owner?.first_name }} {{ invoice.owner?.last_name }} </td>\n <td data-head=\"Organization\"> {{ invoice.subscription?.organization }} </td>\n <td data-head=\"Contact\">{{ invoice.subscription?.contact_name }}</td>\n <td data-head=\"File\">\n <a target=\"blank\" href=\"{{ invoice.file }}\">{{ invoice.file.split('/')[invoice.file.split('/').length -\n 1] }}</a>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountLastInvoices?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountLastInvoices.length }}</span>\n </div>\n <div *ngIf=\"accountLastInvoices?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.location{background-color:#fff}.company-logo{height:20px;width:20px}::ng-deep .ui-multiselect{display:inline-block}::ng-deep body .ui-multiselect .ui-multiselect-label{font-weight:700}.name-column{text-align:left}.account-name{margin-right:5px}.info-icon{vertical-align:middle;margin-left:5px}.account-link-icon{color:gray}.money-icon{color:green;font-size:.85em;background-color:#90ee90;border-radius:50%;padding:5px;width:18.5px;box-shadow:0 0 10px #00800080}.icon-ul{width:111px}.no-wrap{word-break:keep-all;white-space:pre-line}.expected-mrr,.mrr-header{filter:saturate(.5)}.expected-mrr{background-color:#d8e8f1!important}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i9.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1474
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompaniesComponent, selector: "pw-smart-crm-companies", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Accounts</h2>\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.AccountMessage.AddAccount' | transloco }} </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.accounts\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\" [loading]=\"loading\" [filterDelay]=\"1000\" (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row m-0\">\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Industry\" [options]=\"searchOptions\" [(ngModel)]=\"filterByIndustries\"\n (onChange)=\"onSearchOptionChange($event, 'industry')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Size\" [options]=\"organizationSizes\" [(ngModel)]=\"filterBySizeId\"\n (onChange)=\"onSearchOptionChange($event, 'size')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Status\" [options]=\"status\" [(ngModel)]=\"filterByStatus\"\n (onChange)=\"onSearchOptionChange($event, 'status')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Priority\" [options]=\"priority\" [(ngModel)]=\"filterByPriority\"\n (onChange)=\"onSearchOptionChange($event, 'priority')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Source\" [options]=\"source\" [(ngModel)]=\"filterBySource\"\n (onChange)=\"onSearchOptionChange($event, 'source')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4 mb-2\">\n <input ngx-gp-autocomplete class=\"form-control location\" #places=\"ngx-places\" [(ngModel)]=\"searchLocationText\"\n placeholder=\"Search location...\" (keyup)=\"locationSearch($event)\"\n (onAddressChange)=\"handleAddressChange($event)\" />\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start btn-filter-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n <div class=\"text-end mt-0 mt-sm-3\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText size=\"50\" placeholder=\"Search accounts...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"name\"> {{ 'Crm.AccountMessage.Name' | transloco }} <p-sortIcon field=\"name\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"location\"> {{ 'Crm.AccountMessage.Location' | transloco }} <p-sortIcon\n field=\"location\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"owner_id\"> {{ 'Crm.AccountMessage.Owner' | transloco }} <p-sortIcon\n field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"organization_size_id\"> {{ 'Crm.AccountMessage.Size' | transloco }} <p-sortIcon\n field=\"organization_size_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"expected_mrr\" class=\"mrr-header\"> {{ 'Crm.AccountMessage.MRR' | transloco }} <p-sortIcon field=\"expected_mrr\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"signed_up_at\"> {{ 'Crm.AccountMessage.SignUp' | transloco }} <p-sortIcon field=\"signed_up_at\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_quarter\"> {{ 'Crm.AccountMessage.Quarter' | transloco }} <p-sortIcon field=\"sessions_last_quarter\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Month' | transloco }} <p-sortIcon field=\"sessions_last_month\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Status' | transloco }} <p-sortIcon field=\"sessions_staus\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Priority' | transloco }} <p-sortIcon field=\"sessions_priority\">\n </p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-account>\n <tr>\n <td data-head=\"Name\" class=\"name-column\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.id]\" class=\"name-link\">\n <img alt=\"company image\" [src]=\"getAccountLogo(account.company_url)\" class=\"img-fluid company-logo me-2\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n <span [ngbTooltip]=\"account.name\" class=\"account-name\" [title]=\"account.name\">{{ account.name | textTruncate:30 }}</span>\n <i [ngClass]=\"getUserAccountInfo(account).iconClass\" [ngbTooltip]=\"getUserAccountInfo(account).message\"\n class=\"info-icon\"></i>\n </a>\n </td>\n <td data-head=\"Location\" class=\"no-wrap\"><span [ngbTooltip]=\"account.location\">{{ getCountryFromLocation(account.location) }}</span></td>\n <td data-head=\"Owner\">\n <a [routerLink]=\"['/members', account?.owner?.slug]\"> {{ account.owner.first_name.charAt(0) }}. {{account.owner.last_name}}</a>\n </td>\n <td data-head=\"Size\" class=\"no-wrap\">{{ account?.organisation_size?.name !== 'Not available' ? account?.organisation_size?.name : '' }}\n</td>\n<td data-head=\"MRR\" class=\"no-wrap fw-bold expected-mrr\">\n {{ account?.expected_mrr !== null && account?.expected_mrr !== 0 ? formatMRR(account?.expected_mrr) : '' }}\n</td>\n <td data-head=\"Signed Up\">{{ account.signed_up_at | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Quarter\">{{ account.sessions_last_quarter }}</td>\n <td data-head=\"Month\">{{ account.sessions_last_month }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"account.status === 'Prospect'\" class=\"badge bg-primary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Inactive'\" class=\"badge bg-secondary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - New'\" class=\"badge bg-info\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Inactive'\" class=\"badge bg-warning\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Old'\" class=\"badge bg-dark\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Dead'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Competitor'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Vendor'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Supplier'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Other'\" class=\"badge bg-teal\">{{account.status}}</span>\n </td>\n\n <td data-head=\"Priority\">\n <span *ngIf=\"account.priority === 'A - Ideal Fit'\" class=\"badge bg-success\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'B - High Potential'\" class=\"badge bg-primary\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'C - Low Potential'\" class=\"badge bg-warning\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'D - Out of market'\" class=\"badge bg-secondary\">{{account.priority}}</span>\n </td>\n\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"See contacts\" class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts, account.id]\">\n <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n </li>\n <ng-container *ngIf=\"hasAccess || account.owner_id === userId\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.accounts,\n account.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(account.id, subscription.id)\"\n aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoAccountMessage' | transloco\"> </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Last Activities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Last Activities</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountActivities?.length\">\n <p-table class=\"table\" #dt [value]=\"accountActivities\" [paginator]=\"accountInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountActivities.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Action' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.When' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-activities>\n <tr>\n <td data-head=\"Owner\"> {{ activities.owner?.first_name.charAt(0) }}. {{ activities.owner?.last_name }} </td>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, activities.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"activities.crm_account?.name\">{{ activities.crm_account?.name }}</span>\n </a>\n </td>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, activities.crm_contact_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"activities.crm_contact ? activities.crm_contact.first_name + ' ' + activities.crm_contact.last_name : ''\">{{ (activities.crm_contact?.first_name + ' ' + activities.crm_contact?.last_name) | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Action\">\n <span [ngbTooltip]=\"activities.comment\" [appDynamicBadge]=\"{\n itemsArray: actionNames,\n item: activities.crm_action?.name\n }\"\n color=\"blue-grey\"\n class=\"badge\">{{ activities.crm_action?.name }}</span>\n </td>\n <td data-head=\"When\">{{ activities.when | date:'dd-MMM-YYYY' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountActivities.length }}</span>\n </div>\n <div *ngIf=\"accountActivities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"accountGeography\">\n <plotly-plot [data]=\"accountGeography?.data\" [layout]=\"accountGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!accountGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.location{background-color:#fff}.company-logo{height:20px;width:20px}::ng-deep .ui-multiselect{display:inline-block}::ng-deep body .ui-multiselect .ui-multiselect-label{font-weight:700}.name-column{text-align:left}.account-name{margin-right:5px}.info-icon{vertical-align:middle;margin-left:5px}.account-link-icon{color:gray}.money-icon{color:green;font-size:.85em;background-color:#90ee90;border-radius:50%;padding:5px;width:18.5px;box-shadow:0 0 10px #00800080}.icon-ul{width:111px}.no-wrap{word-break:keep-all;white-space:pre-line}.expected-mrr,.mrr-header{filter:saturate(.5)}.expected-mrr{background-color:#d8e8f1!important}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i9.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1500
1475
  }
1501
1476
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompaniesComponent, decorators: [{
1502
1477
  type: Component,
1503
- args: [{ selector: 'pw-smart-crm-companies', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Accounts</h2>\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.AccountMessage.AddAccount' | transloco }} </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.accounts\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\" [loading]=\"loading\" [filterDelay]=\"1000\" (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row m-0\">\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Industry\" [options]=\"searchOptions\" [(ngModel)]=\"filterByIndustries\"\n (onChange)=\"onSearchOptionChange($event, 'industry')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Size\" [options]=\"organizationSizes\" [(ngModel)]=\"filterBySizeId\"\n (onChange)=\"onSearchOptionChange($event, 'size')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Status\" [options]=\"status\" [(ngModel)]=\"filterByStatus\"\n (onChange)=\"onSearchOptionChange($event, 'status')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Priority\" [options]=\"priority\" [(ngModel)]=\"filterByPriority\"\n (onChange)=\"onSearchOptionChange($event, 'priority')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Source\" [options]=\"source\" [(ngModel)]=\"filterBySource\"\n (onChange)=\"onSearchOptionChange($event, 'source')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4 mb-2\">\n <input ngx-gp-autocomplete class=\"form-control location\" #places=\"ngx-places\" [(ngModel)]=\"searchLocationText\"\n placeholder=\"Search location...\" (keyup)=\"locationSearch($event)\"\n (onAddressChange)=\"handleAddressChange($event)\" />\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start btn-filter-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n <div class=\"text-end mt-0 mt-sm-3\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText size=\"50\" placeholder=\"Search accounts...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"name\"> {{ 'Crm.AccountMessage.Name' | transloco }} <p-sortIcon field=\"name\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"location\"> {{ 'Crm.AccountMessage.Location' | transloco }} <p-sortIcon\n field=\"location\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"owner_id\"> {{ 'Crm.AccountMessage.Owner' | transloco }} <p-sortIcon\n field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"organization_size_id\"> {{ 'Crm.AccountMessage.Size' | transloco }} <p-sortIcon\n field=\"organization_size_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"expected_mrr\" class=\"mrr-header\"> {{ 'Crm.AccountMessage.MRR' | transloco }} <p-sortIcon field=\"expected_mrr\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"signed_up_at\"> {{ 'Crm.AccountMessage.SignUp' | transloco }} <p-sortIcon field=\"signed_up_at\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_quarter\"> {{ 'Crm.AccountMessage.Quarter' | transloco }} <p-sortIcon field=\"sessions_last_quarter\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Month' | transloco }} <p-sortIcon field=\"sessions_last_month\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Status' | transloco }} <p-sortIcon field=\"sessions_staus\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Priority' | transloco }} <p-sortIcon field=\"sessions_priority\">\n </p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-account>\n <tr>\n <td data-head=\"Name\" class=\"name-column\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.id]\" class=\"name-link\">\n <img alt=\"company image\" [src]=\"getAccountLogo(account.company_url)\" class=\"img-fluid company-logo me-2\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n <span [ngbTooltip]=\"account.name\" class=\"account-name\" [title]=\"account.name\">{{ account.name | textTruncate:30 }}</span>\n <i [ngClass]=\"getUserAccountInfo(account).iconClass\" [ngbTooltip]=\"getUserAccountInfo(account).message\"\n class=\"info-icon\"></i>\n </a>\n </td>\n <td data-head=\"Location\" class=\"no-wrap\"><span [ngbTooltip]=\"account.location\">{{ getCountryFromLocation(account.location) }}</span></td>\n <td data-head=\"Owner\">\n <a [routerLink]=\"['/members', account?.owner?.slug]\"> {{ account.owner.first_name.charAt(0) }}. {{account.owner.last_name}}</a>\n </td>\n <td data-head=\"Size\" class=\"no-wrap\">{{ account?.organisation_size?.name !== 'Not available' ? account?.organisation_size?.name : '' }}\n</td>\n<td data-head=\"MRR\" class=\"no-wrap fw-bold expected-mrr\">\n {{ account?.expected_mrr !== null && account?.expected_mrr !== 0 ? formatMRR(account?.expected_mrr) : '' }}\n</td>\n <td data-head=\"Signed Up\">{{ account.signed_up_at | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Quarter\">{{ account.sessions_last_quarter }}</td>\n <td data-head=\"Month\">{{ account.sessions_last_month }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"account.status === 'Prospect'\" class=\"badge bg-primary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Inactive'\" class=\"badge bg-secondary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - New'\" class=\"badge bg-info\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Inactive'\" class=\"badge bg-warning\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Old'\" class=\"badge bg-dark\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Dead'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Competitor'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Vendor'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Supplier'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Other'\" class=\"badge bg-teal\">{{account.status}}</span>\n </td>\n\n <td data-head=\"Priority\">\n <span *ngIf=\"account.priority === 'A - Ideal Fit'\" class=\"badge bg-success\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'B - High Potential'\" class=\"badge bg-primary\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'C - Low Potential'\" class=\"badge bg-warning\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'D - Out of market'\" class=\"badge bg-secondary\">{{account.priority}}</span>\n </td>\n\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline icon-ul\">\n <li ngbTooltip=\"See contacts\" class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts, account.id]\">\n <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n </li>\n <ng-container *ngIf=\"hasAccess || account.owner_id === userId\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.accounts,\n account.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(account.id, subscription.id)\"\n aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoAccountMessage' | transloco\"> </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"accountInsight\" [paginator]=\"accountInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountInsight.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Value' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Reason' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-insight>\n <tr>\n <td data-head=\"Title\">{{ insight.title }}</td>\n <td data-head=\"Value\">{{ insight.value }}</td>\n <td data-head=\"Reason\">{{ insight.reason }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountInsight.length }}</span>\n </div>\n <div *ngIf=\"accountInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"accountGeography\">\n <plotly-plot [data]=\"accountGeography?.data\" [layout]=\"accountGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!accountGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Last Activities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Last Activities</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountActivities?.length\">\n <p-table class=\"table\" #dt [value]=\"accountActivities\" [paginator]=\"accountInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountActivities.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Action' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.When' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-activities>\n <tr>\n <td data-head=\"Owner\"> {{ activities.owner?.first_name.charAt(0) }}. {{ activities.owner?.last_name }} </td>\n <td data-head=\"Account\">{{ activities.crm_account?.name }}</td>\n <td data-head=\"Contact\"> {{ activities.crm_contact?.first_name }} {{ activities.crm_contact?.last_name }}\n </td>\n\n <td data-head=\"Action\">\n <span [ngbTooltip]=\"activities.comment\" [appDynamicBadge]=\"{\n itemsArray: actionNames,\n item: activities.crm_action?.name\n }\"\n color=\"blue-grey\"\n class=\"badge\">{{ activities.crm_action?.name }}</span>\n </td>\n <td data-head=\"When\">{{ activities.when | date:'dd-MMM-YYYY' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountActivities.length }}</span>\n </div>\n <div *ngIf=\"accountActivities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Last Invoices -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Last Invoices</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountLastInvoices?.length\">\n <p-table class=\"table\" #dt [value]=\"accountLastInvoices\" [paginator]=\"accountLastInvoices?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountLastInvoices.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.File' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-invoice>\n <tr>\n <td data-head=\"Owner\"> {{ invoice.owner?.first_name }} {{ invoice.owner?.last_name }} </td>\n <td data-head=\"Organization\"> {{ invoice.subscription?.organization }} </td>\n <td data-head=\"Contact\">{{ invoice.subscription?.contact_name }}</td>\n <td data-head=\"File\">\n <a target=\"blank\" href=\"{{ invoice.file }}\">{{ invoice.file.split('/')[invoice.file.split('/').length -\n 1] }}</a>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountLastInvoices?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountLastInvoices.length }}</span>\n </div>\n <div *ngIf=\"accountLastInvoices?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.location{background-color:#fff}.company-logo{height:20px;width:20px}::ng-deep .ui-multiselect{display:inline-block}::ng-deep body .ui-multiselect .ui-multiselect-label{font-weight:700}.name-column{text-align:left}.account-name{margin-right:5px}.info-icon{vertical-align:middle;margin-left:5px}.account-link-icon{color:gray}.money-icon{color:green;font-size:.85em;background-color:#90ee90;border-radius:50%;padding:5px;width:18.5px;box-shadow:0 0 10px #00800080}.icon-ul{width:111px}.no-wrap{word-break:keep-all;white-space:pre-line}.expected-mrr,.mrr-header{filter:saturate(.5)}.expected-mrr{background-color:#d8e8f1!important}\n"] }]
1478
+ args: [{ selector: 'pw-smart-crm-companies', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Accounts</h2>\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.AccountMessage.AddAccount' | transloco }} </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.accounts\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\" [loading]=\"loading\" [filterDelay]=\"1000\" (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row m-0\">\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Industry\" [options]=\"searchOptions\" [(ngModel)]=\"filterByIndustries\"\n (onChange)=\"onSearchOptionChange($event, 'industry')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Size\" [options]=\"organizationSizes\" [(ngModel)]=\"filterBySizeId\"\n (onChange)=\"onSearchOptionChange($event, 'size')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Status\" [options]=\"status\" [(ngModel)]=\"filterByStatus\"\n (onChange)=\"onSearchOptionChange($event, 'status')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Priority\" [options]=\"priority\" [(ngModel)]=\"filterByPriority\"\n (onChange)=\"onSearchOptionChange($event, 'priority')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4\">\n <p-multiSelect placeholder=\"Select Source\" [options]=\"source\" [(ngModel)]=\"filterBySource\"\n (onChange)=\"onSearchOptionChange($event, 'source')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-4 mb-2\">\n <input ngx-gp-autocomplete class=\"form-control location\" #places=\"ngx-places\" [(ngModel)]=\"searchLocationText\"\n placeholder=\"Search location...\" (keyup)=\"locationSearch($event)\"\n (onAddressChange)=\"handleAddressChange($event)\" />\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start btn-filter-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n <div class=\"text-end mt-0 mt-sm-3\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText size=\"50\" placeholder=\"Search accounts...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"name\"> {{ 'Crm.AccountMessage.Name' | transloco }} <p-sortIcon field=\"name\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"location\"> {{ 'Crm.AccountMessage.Location' | transloco }} <p-sortIcon\n field=\"location\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"owner_id\"> {{ 'Crm.AccountMessage.Owner' | transloco }} <p-sortIcon\n field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"organization_size_id\"> {{ 'Crm.AccountMessage.Size' | transloco }} <p-sortIcon\n field=\"organization_size_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"expected_mrr\" class=\"mrr-header\"> {{ 'Crm.AccountMessage.MRR' | transloco }} <p-sortIcon field=\"expected_mrr\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"signed_up_at\"> {{ 'Crm.AccountMessage.SignUp' | transloco }} <p-sortIcon field=\"signed_up_at\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_quarter\"> {{ 'Crm.AccountMessage.Quarter' | transloco }} <p-sortIcon field=\"sessions_last_quarter\">\n </p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Month' | transloco }} <p-sortIcon field=\"sessions_last_month\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Status' | transloco }} <p-sortIcon field=\"sessions_staus\">\n </p-sortIcon>\n <th scope=\"true\" pSortableColumn=\"sessions_last_month\"> {{ 'Crm.AccountMessage.Priority' | transloco }} <p-sortIcon field=\"sessions_priority\">\n </p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-account>\n <tr>\n <td data-head=\"Name\" class=\"name-column\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.id]\" class=\"name-link\">\n <img alt=\"company image\" [src]=\"getAccountLogo(account.company_url)\" class=\"img-fluid company-logo me-2\"\n onerror=\"this.onerror=null;this.src='assets/img/icons/company.png';\" />\n <span [ngbTooltip]=\"account.name\" class=\"account-name\" [title]=\"account.name\">{{ account.name | textTruncate:30 }}</span>\n <i [ngClass]=\"getUserAccountInfo(account).iconClass\" [ngbTooltip]=\"getUserAccountInfo(account).message\"\n class=\"info-icon\"></i>\n </a>\n </td>\n <td data-head=\"Location\" class=\"no-wrap\"><span [ngbTooltip]=\"account.location\">{{ getCountryFromLocation(account.location) }}</span></td>\n <td data-head=\"Owner\">\n <a [routerLink]=\"['/members', account?.owner?.slug]\"> {{ account.owner.first_name.charAt(0) }}. {{account.owner.last_name}}</a>\n </td>\n <td data-head=\"Size\" class=\"no-wrap\">{{ account?.organisation_size?.name !== 'Not available' ? account?.organisation_size?.name : '' }}\n</td>\n<td data-head=\"MRR\" class=\"no-wrap fw-bold expected-mrr\">\n {{ account?.expected_mrr !== null && account?.expected_mrr !== 0 ? formatMRR(account?.expected_mrr) : '' }}\n</td>\n <td data-head=\"Signed Up\">{{ account.signed_up_at | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Quarter\">{{ account.sessions_last_quarter }}</td>\n <td data-head=\"Month\">{{ account.sessions_last_month }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"account.status === 'Prospect'\" class=\"badge bg-primary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Trial - Inactive'\" class=\"badge bg-secondary\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - New'\" class=\"badge bg-info\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Active'\" class=\"badge bg-success\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Inactive'\" class=\"badge bg-warning\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Customer - Old'\" class=\"badge bg-dark\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Dead'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Competitor'\" class=\"badge bg-danger\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Vendor'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Supplier'\" class=\"badge bg-blue-grey\">{{account.status}}</span>\n <span *ngIf=\"account.status === 'Other'\" class=\"badge bg-teal\">{{account.status}}</span>\n </td>\n\n <td data-head=\"Priority\">\n <span *ngIf=\"account.priority === 'A - Ideal Fit'\" class=\"badge bg-success\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'B - High Potential'\" class=\"badge bg-primary\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'C - Low Potential'\" class=\"badge bg-warning\">{{account.priority}}</span>\n <span *ngIf=\"account.priority === 'D - Out of market'\" class=\"badge bg-secondary\">{{account.priority}}</span>\n </td>\n\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"See contacts\" class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts, account.id]\">\n <i class=\"fa fa-eye\" aria-hidden=\"true\"></i>\n </li>\n <ng-container *ngIf=\"hasAccess || account.owner_id === userId\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.accounts,\n account.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(account.id, subscription.id)\"\n aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoAccountMessage' | transloco\"> </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Last Activities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Last Activities</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"accountActivities?.length\">\n <p-table class=\"table\" #dt [value]=\"accountActivities\" [paginator]=\"accountInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"accountActivities.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Action' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.When' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-activities>\n <tr>\n <td data-head=\"Owner\"> {{ activities.owner?.first_name.charAt(0) }}. {{ activities.owner?.last_name }} </td>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, activities.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"activities.crm_account?.name\">{{ activities.crm_account?.name }}</span>\n </a>\n </td>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, activities.crm_contact_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"activities.crm_contact ? activities.crm_contact.first_name + ' ' + activities.crm_contact.last_name : ''\">{{ (activities.crm_contact?.first_name + ' ' + activities.crm_contact?.last_name) | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Action\">\n <span [ngbTooltip]=\"activities.comment\" [appDynamicBadge]=\"{\n itemsArray: actionNames,\n item: activities.crm_action?.name\n }\"\n color=\"blue-grey\"\n class=\"badge\">{{ activities.crm_action?.name }}</span>\n </td>\n <td data-head=\"When\">{{ activities.when | date:'dd-MMM-YYYY' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountActivities.length }}</span>\n </div>\n <div *ngIf=\"accountActivities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"accountGeography\">\n <plotly-plot [data]=\"accountGeography?.data\" [layout]=\"accountGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!accountGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.location{background-color:#fff}.company-logo{height:20px;width:20px}::ng-deep .ui-multiselect{display:inline-block}::ng-deep body .ui-multiselect .ui-multiselect-label{font-weight:700}.name-column{text-align:left}.account-name{margin-right:5px}.info-icon{vertical-align:middle;margin-left:5px}.account-link-icon{color:gray}.money-icon{color:green;font-size:.85em;background-color:#90ee90;border-radius:50%;padding:5px;width:18.5px;box-shadow:0 0 10px #00800080}.icon-ul{width:111px}.no-wrap{word-break:keep-all;white-space:pre-line}.expected-mrr,.mrr-header{filter:saturate(.5)}.expected-mrr{background-color:#d8e8f1!important}\n"] }]
1504
1479
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i2.CommonService }, { type: i2.LogoCacheService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
1505
1480
 
1506
1481
  class SmartCrmCompetitionComponent {
@@ -1686,11 +1661,11 @@ class SmartCrmActionsComponent extends AppBaseComponent {
1686
1661
  super.ngOnDestroy();
1687
1662
  }
1688
1663
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmActionsComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1689
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmActionsComponent, selector: "pw-smart-crm-actions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>\n Please define the actions you want to associate with your contacts. For example you\n could choose Phone Call, or Meeting, or Email Sent, etc.\n </p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-action-button\"\n (click)=\"buildDefaultActions()\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.BuildDefaultAction' | transloco }}\n </a>\n <a *ngIf=\"hasAccess\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n [routerLink]=\"['/' + subscription?.slug + routers.configurationDetails + 'add']\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.AddAction' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_actions\"\n [paginator]=\"data.object_count!==0\"\n [lazy]=\"true\"\n [rows]=\"100\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search action...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\" >\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.Settings.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week\">\n {{ 'Crm.Settings.TargetWeek' | transloco }}\n <p-sortIcon field=\"target_week\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week_min\">\n {{ 'Crm.Settings.TargetWeekMin' | transloco }}\n <p-sortIcon field=\"target_week_min\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Settings.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n *ngIf=\"hasAccess\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-action>\n <tr>\n <td data-head=\"Name\">{{ action.name }}</td>\n <td data-head=\"TargetWeek\">{{ action.target_week }}</td>\n <td data-head=\"TargetWeekMin\">{{ action.target_week_min }}</td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: action?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!action?.visible }}</span>\n </td>\n <td data-head=\"Action\"\n *ngIf=\"hasAccess\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.configurationDetails,\n action.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(action.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count!==0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n <div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Settings.NoActionMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.build-default-action-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1664
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmActionsComponent, selector: "pw-smart-crm-actions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>\n Please define the actions you want to associate with your contacts. For example you\n could choose Phone Call, or Meeting, or Email Sent, etc.\n </p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-action-button\"\n (click)=\"buildDefaultActions()\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.BuildDefaultAction' | transloco }}\n </a>\n <a *ngIf=\"hasAccess\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n [routerLink]=\"['/' + subscription?.slug + routers.configurationDetails + 'add']\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.AddAction' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_actions\"\n [paginator]=\"data.object_count!==0\"\n [lazy]=\"true\"\n [rows]=\"100\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search action...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\" >\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.Settings.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week\">\n {{ 'Crm.Settings.TargetWeek' | transloco }}\n <p-sortIcon field=\"target_week\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week_min\">\n {{ 'Crm.Settings.TargetWeekMin' | transloco }}\n <p-sortIcon field=\"target_week_min\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Settings.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n *ngIf=\"hasAccess\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-action>\n <tr>\n <td data-head=\"Name\">{{ action.name }}</td>\n <td data-head=\"TargetWeek\">{{ action.target_week }}</td>\n <td data-head=\"TargetWeekMin\">{{ action.target_week_min }}</td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: action?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!action?.visible }}</span>\n </td>\n <td data-head=\"Action\"\n *ngIf=\"hasAccess\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.configurationDetails,\n action.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(action.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count!==0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n <div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Settings.NoActionMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.build-default-action-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1690
1665
  }
1691
1666
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmActionsComponent, decorators: [{
1692
1667
  type: Component,
1693
- args: [{ selector: 'pw-smart-crm-actions', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>\n Please define the actions you want to associate with your contacts. For example you\n could choose Phone Call, or Meeting, or Email Sent, etc.\n </p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-action-button\"\n (click)=\"buildDefaultActions()\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.BuildDefaultAction' | transloco }}\n </a>\n <a *ngIf=\"hasAccess\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n [routerLink]=\"['/' + subscription?.slug + routers.configurationDetails + 'add']\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.AddAction' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_actions\"\n [paginator]=\"data.object_count!==0\"\n [lazy]=\"true\"\n [rows]=\"100\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search action...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\" >\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.Settings.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week\">\n {{ 'Crm.Settings.TargetWeek' | transloco }}\n <p-sortIcon field=\"target_week\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week_min\">\n {{ 'Crm.Settings.TargetWeekMin' | transloco }}\n <p-sortIcon field=\"target_week_min\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Settings.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n *ngIf=\"hasAccess\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-action>\n <tr>\n <td data-head=\"Name\">{{ action.name }}</td>\n <td data-head=\"TargetWeek\">{{ action.target_week }}</td>\n <td data-head=\"TargetWeekMin\">{{ action.target_week_min }}</td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: action?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!action?.visible }}</span>\n </td>\n <td data-head=\"Action\"\n *ngIf=\"hasAccess\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.configurationDetails,\n action.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(action.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count!==0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n <div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Settings.NoActionMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.build-default-action-button{margin-left:7px}\n"] }]
1668
+ args: [{ selector: 'pw-smart-crm-actions', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>\n Please define the actions you want to associate with your contacts. For example you\n could choose Phone Call, or Meeting, or Email Sent, etc.\n </p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-action-button\"\n (click)=\"buildDefaultActions()\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.BuildDefaultAction' | transloco }}\n </a>\n <a *ngIf=\"hasAccess\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n [routerLink]=\"['/' + subscription?.slug + routers.configurationDetails + 'add']\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Settings.AddAction' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_actions\"\n [paginator]=\"data.object_count!==0\"\n [lazy]=\"true\"\n [rows]=\"100\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search action...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\" >\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.Settings.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week\">\n {{ 'Crm.Settings.TargetWeek' | transloco }}\n <p-sortIcon field=\"target_week\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"target_week_min\">\n {{ 'Crm.Settings.TargetWeekMin' | transloco }}\n <p-sortIcon field=\"target_week_min\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Settings.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n *ngIf=\"hasAccess\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-action>\n <tr>\n <td data-head=\"Name\">{{ action.name }}</td>\n <td data-head=\"TargetWeek\">{{ action.target_week }}</td>\n <td data-head=\"TargetWeekMin\">{{ action.target_week_min }}</td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: action?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!action?.visible }}</span>\n </td>\n <td data-head=\"Action\"\n *ngIf=\"hasAccess\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.configurationDetails,\n action.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(action.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count!==0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n <div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Settings.NoActionMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.build-default-action-button{margin-left:7px}\n"] }]
1694
1669
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
1695
1670
 
1696
1671
  class SmartCrmCompanySourceComponent extends AppBaseComponent {
@@ -1775,11 +1750,11 @@ class SmartCrmCompanySourceComponent extends AppBaseComponent {
1775
1750
  super.ngOnDestroy();
1776
1751
  }
1777
1752
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompanySourceComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1778
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompanySourceComponent, selector: "pw-smart-crm-source", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the sources that you want to associate with your prospect accounts.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end build-action-button\"\n *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n data-cy=\"build-contact\"\n (click)=\"buildAccountSource()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.BuildAccountSource' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.sourceDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.AddAccountSource' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_sources\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.AccountSourceMessage.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-source>\n <tr>\n <td data-head=\"Name\">{{ source.name }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.sourceDetails,\n source.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(source.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountSourceMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-action-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1753
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCompanySourceComponent, selector: "pw-smart-crm-source", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the sources that you want to associate with your prospect accounts.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end build-action-button\"\n *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n data-cy=\"build-contact\"\n (click)=\"buildAccountSource()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.BuildAccountSource' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.sourceDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.AddAccountSource' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_sources\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.AccountSourceMessage.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-source>\n <tr>\n <td data-head=\"Name\">{{ source.name }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.sourceDetails,\n source.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(source.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountSourceMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-action-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1779
1754
  }
1780
1755
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCompanySourceComponent, decorators: [{
1781
1756
  type: Component,
1782
- args: [{ selector: 'pw-smart-crm-source', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the sources that you want to associate with your prospect accounts.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end build-action-button\"\n *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n data-cy=\"build-contact\"\n (click)=\"buildAccountSource()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.BuildAccountSource' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.sourceDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.AddAccountSource' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_sources\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.AccountSourceMessage.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-source>\n <tr>\n <td data-head=\"Name\">{{ source.name }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.sourceDetails,\n source.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(source.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountSourceMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-action-button{margin-left:7px}\n"] }]
1757
+ args: [{ selector: 'pw-smart-crm-source', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the sources that you want to associate with your prospect accounts.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end build-action-button\"\n *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n data-cy=\"build-contact\"\n (click)=\"buildAccountSource()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.BuildAccountSource' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.sourceDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountSourceMessage.AddAccountSource' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_sources\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.AccountSourceMessage.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-source>\n <tr>\n <td data-head=\"Name\">{{ source.name }}</td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.sourceDetails,\n source.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(source.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.AccountSourceMessage.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-action-button{margin-left:7px}\n"] }]
1783
1758
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i0.ChangeDetectorRef }] });
1784
1759
 
1785
1760
  class SmartCrmWidgetsComponent extends AppBaseComponent {
@@ -1881,11 +1856,11 @@ class SmartCrmWidgetsComponent extends AppBaseComponent {
1881
1856
  super.ngOnDestroy();
1882
1857
  }
1883
1858
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmWidgetsComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1884
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmWidgetsComponent, selector: "pw-smart-crm-widgets", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the widgets you want to use.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.widgetsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Widgets.AddWidgets' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_widget_relationships\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"crm_widget_id\">\n {{ 'Crm.Widgets.CrmWidget' | transloco }}\n <p-sortIcon field=\"crm_widget_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"position\">\n {{ 'Crm.Widgets.Position' | transloco }}\n <p-sortIcon field=\"position\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Widgets.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-widget>\n <tr>\n <td data-head=\"Crm Widget\">{{ widget.crm_widget }}</td>\n <td data-head=\"Position\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: positions,\n item: widget?.position\n }\"\n color=\"default\">{{ widget.position }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: widget?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!widget?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.widgetsDetails,\n widget.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(widget.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\"*ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Widgets.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1859
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmWidgetsComponent, selector: "pw-smart-crm-widgets", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the widgets you want to use.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.widgetsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Widgets.AddWidgets' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_widget_relationships\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"crm_widget_id\">\n {{ 'Crm.Widgets.CrmWidget' | transloco }}\n <p-sortIcon field=\"crm_widget_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"position\">\n {{ 'Crm.Widgets.Position' | transloco }}\n <p-sortIcon field=\"position\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Widgets.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-widget>\n <tr>\n <td data-head=\"Crm Widget\">{{ widget.crm_widget }}</td>\n <td data-head=\"Position\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: positions,\n item: widget?.position\n }\"\n color=\"default\">{{ widget.position }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: widget?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!widget?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.widgetsDetails,\n widget.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(widget.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\"*ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Widgets.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1885
1860
  }
1886
1861
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmWidgetsComponent, decorators: [{
1887
1862
  type: Component,
1888
- args: [{ selector: 'pw-smart-crm-widgets', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the widgets you want to use.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.widgetsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Widgets.AddWidgets' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_widget_relationships\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"crm_widget_id\">\n {{ 'Crm.Widgets.CrmWidget' | transloco }}\n <p-sortIcon field=\"crm_widget_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"position\">\n {{ 'Crm.Widgets.Position' | transloco }}\n <p-sortIcon field=\"position\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Widgets.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-widget>\n <tr>\n <td data-head=\"Crm Widget\">{{ widget.crm_widget }}</td>\n <td data-head=\"Position\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: positions,\n item: widget?.position\n }\"\n color=\"default\">{{ widget.position }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: widget?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!widget?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.widgetsDetails,\n widget.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(widget.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\"*ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Widgets.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
1863
+ args: [{ selector: 'pw-smart-crm-widgets', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <p>Please define the widgets you want to use.</p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.widgetsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.Widgets.AddWidgets' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_widget_relationships\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search source...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"crm_widget_id\">\n {{ 'Crm.Widgets.CrmWidget' | transloco }}\n <p-sortIcon field=\"crm_widget_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"position\">\n {{ 'Crm.Widgets.Position' | transloco }}\n <p-sortIcon field=\"position\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.Widgets.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-widget>\n <tr>\n <td data-head=\"Crm Widget\">{{ widget.crm_widget }}</td>\n <td data-head=\"Position\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: positions,\n item: widget?.position\n }\"\n color=\"default\">{{ widget.position }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: widget?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!widget?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.widgetsDetails,\n widget.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(widget.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\"*ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Widgets.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
1889
1864
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i0.ChangeDetectorRef }] });
1890
1865
 
1891
1866
  class SmartCrmStagesComponent extends AppBaseComponent {
@@ -2001,11 +1976,11 @@ class SmartCrmStagesComponent extends AppBaseComponent {
2001
1976
  super.ngOnDestroy();
2002
1977
  }
2003
1978
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmStagesComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
2004
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmStagesComponent, selector: "pw-smart-crm-stages", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.StageMessages.StageTitle' | transloco }}</p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-stage-button\"\n (click)=\"buildDefaultStages()\"\n data-cy=\"add-contact\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.BuildDefaultStage' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.stageDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.AddStage' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_stages\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.StageMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_stage_id\">\n {{ 'Crm.StageMessages.PreviousStage' | transloco }}\n <p-sortIcon field=\"previous_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_category_ids\">\n {{ 'Crm.StageMessages.OpportunityCategory' | transloco }}\n <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.StageMessages.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: stageNames,\n item: stage?.crm_previous_stage?.name\n }\"\n color=\"warning\">{{ stage?.crm_previous_stage?.name }}</span>\n </td>\n <td data-head=\"Opportunity Category\">\n <span *ngFor=\"let category of stage?.crm_opportunity_categories\"\n class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\"\n color=\"blue-grey\">{{ category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!stage?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.stageDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.StageMessages.NoStageMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-default-stage-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
1979
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmStagesComponent, selector: "pw-smart-crm-stages", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.StageMessages.StageTitle' | transloco }}</p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-stage-button\"\n (click)=\"buildDefaultStages()\"\n data-cy=\"add-contact\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.BuildDefaultStage' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.stageDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.AddStage' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_stages\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.StageMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_stage_id\">\n {{ 'Crm.StageMessages.PreviousStage' | transloco }}\n <p-sortIcon field=\"previous_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_category_ids\">\n {{ 'Crm.StageMessages.OpportunityCategory' | transloco }}\n <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.StageMessages.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: stageNames,\n item: stage?.crm_previous_stage?.name\n }\"\n color=\"warning\">{{ stage?.crm_previous_stage?.name }}</span>\n </td>\n <td data-head=\"Opportunity Category\">\n <span *ngFor=\"let category of stage?.crm_opportunity_categories\"\n class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\"\n color=\"blue-grey\">{{ category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!stage?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.stageDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.StageMessages.NoStageMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-default-stage-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
2005
1980
  }
2006
1981
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmStagesComponent, decorators: [{
2007
1982
  type: Component,
2008
- args: [{ selector: 'pw-smart-crm-stages', template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.StageMessages.StageTitle' | transloco }}</p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-stage-button\"\n (click)=\"buildDefaultStages()\"\n data-cy=\"add-contact\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.BuildDefaultStage' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.stageDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.AddStage' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_stages\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.StageMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_stage_id\">\n {{ 'Crm.StageMessages.PreviousStage' | transloco }}\n <p-sortIcon field=\"previous_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_category_ids\">\n {{ 'Crm.StageMessages.OpportunityCategory' | transloco }}\n <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.StageMessages.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: stageNames,\n item: stage?.crm_previous_stage?.name\n }\"\n color=\"warning\">{{ stage?.crm_previous_stage?.name }}</span>\n </td>\n <td data-head=\"Opportunity Category\">\n <span *ngFor=\"let category of stage?.crm_opportunity_categories\"\n class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\"\n color=\"blue-grey\">{{ category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!stage?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.stageDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.StageMessages.NoStageMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-default-stage-button{margin-left:7px}\n"] }]
1983
+ args: [{ selector: 'pw-smart-crm-stages', template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.StageMessages.StageTitle' | transloco }}</p>\n <a *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\"\n class=\"btn btn-sm btn-outline-primary float-end build-default-stage-button\"\n (click)=\"buildDefaultStages()\"\n data-cy=\"add-contact\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.BuildDefaultStage' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.stageDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.StageMessages.AddStage' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_stages\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.StageMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_stage_id\">\n {{ 'Crm.StageMessages.PreviousStage' | transloco }}\n <p-sortIcon field=\"previous_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_opportunity_category_ids\">\n {{ 'Crm.StageMessages.OpportunityCategory' | transloco }}\n <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"visible\">\n {{ 'Crm.StageMessages.Visible' | transloco }}\n <p-sortIcon field=\"visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: stageNames,\n item: stage?.crm_previous_stage?.name\n }\"\n color=\"warning\">{{ stage?.crm_previous_stage?.name }}</span>\n </td>\n <td data-head=\"Opportunity Category\">\n <span *ngFor=\"let category of stage?.crm_opportunity_categories\"\n class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\"\n color=\"blue-grey\">{{ category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!stage?.visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.stageDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.StageMessages.NoStageMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-default-stage-button{margin-left:7px}\n"] }]
2009
1984
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i0.ChangeDetectorRef }] });
2010
1985
 
2011
1986
  class SmartCrmOpportunityCategoriesComponent extends AppBaseComponent {
@@ -2101,11 +2076,11 @@ class SmartCrmOpportunityCategoriesComponent extends AppBaseComponent {
2101
2076
  super.ngOnDestroy();
2102
2077
  }
2103
2078
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmOpportunityCategoriesComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
2104
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmOpportunityCategoriesComponent, selector: "pw-smart-crm-opportunity-categories", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.CategoriesMessages.CategoriesTitle' | transloco }}</p>\n <div class=\"col-12\" *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\">\n <a class=\"btn btn-sm btn-outline-primary float-end build-category-button\"\n data-cy=\"add-category\"\n (click)=\"buildCategories()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.BuildCategory' | transloco }}\n </a>\n </div>\n <div class=\"col-12\">\n <a class=\"btn btn-sm btn-outline-primary float-end mr-2\"\n data-cy=\"add-category\"\n [routerLink]=\"['/' + subscription?.slug + routers.categoryDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.AddCategory' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_categories\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.CategoriesMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_category_id\">\n {{ 'Crm.CategoriesMessages.PreviousCategory' | transloco }}\n <p-sortIcon field=\"previous_category_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Crm.CategoriesMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: categoryNames,\n item: stage?.previous_category?.name\n }\"\n color=\"blue-grey\">{{ stage?.previous_category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ stage?.is_visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.categoryDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CategoriesMessages.NoCategoriesMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-category-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
2079
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmOpportunityCategoriesComponent, selector: "pw-smart-crm-opportunity-categories", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.CategoriesMessages.CategoriesTitle' | transloco }}</p>\n <div class=\"col-12\" *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\">\n <a class=\"btn btn-sm btn-outline-primary float-end build-category-button\"\n data-cy=\"add-category\"\n (click)=\"buildCategories()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.BuildCategory' | transloco }}\n </a>\n </div>\n <div class=\"col-12\">\n <a class=\"btn btn-sm btn-outline-primary float-end mr-2\"\n data-cy=\"add-category\"\n [routerLink]=\"['/' + subscription?.slug + routers.categoryDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.AddCategory' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_categories\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.CategoriesMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_category_id\">\n {{ 'Crm.CategoriesMessages.PreviousCategory' | transloco }}\n <p-sortIcon field=\"previous_category_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Crm.CategoriesMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: categoryNames,\n item: stage?.previous_category?.name\n }\"\n color=\"blue-grey\">{{ stage?.previous_category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ stage?.is_visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.categoryDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CategoriesMessages.NoCategoriesMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-category-button{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
2105
2080
  }
2106
2081
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmOpportunityCategoriesComponent, decorators: [{
2107
2082
  type: Component,
2108
- args: [{ selector: 'pw-smart-crm-opportunity-categories', template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.CategoriesMessages.CategoriesTitle' | transloco }}</p>\n <div class=\"col-12\" *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\">\n <a class=\"btn btn-sm btn-outline-primary float-end build-category-button\"\n data-cy=\"add-category\"\n (click)=\"buildCategories()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.BuildCategory' | transloco }}\n </a>\n </div>\n <div class=\"col-12\">\n <a class=\"btn btn-sm btn-outline-primary float-end mr-2\"\n data-cy=\"add-category\"\n [routerLink]=\"['/' + subscription?.slug + routers.categoryDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.AddCategory' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_categories\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.CategoriesMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_category_id\">\n {{ 'Crm.CategoriesMessages.PreviousCategory' | transloco }}\n <p-sortIcon field=\"previous_category_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Crm.CategoriesMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: categoryNames,\n item: stage?.previous_category?.name\n }\"\n color=\"blue-grey\">{{ stage?.previous_category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ stage?.is_visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.categoryDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CategoriesMessages.NoCategoriesMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-category-button{margin-left:7px}\n"] }]
2083
+ args: [{ selector: 'pw-smart-crm-opportunity-categories', template: "<div class=\"row\">\n <div class=\"col-12\">\n <p>{{ 'Crm.CategoriesMessages.CategoriesTitle' | transloco }}</p>\n <div class=\"col-12\" *ngIf=\"data.object_count === 0 && data.unfiltered_count === 0 && isLoaded\">\n <a class=\"btn btn-sm btn-outline-primary float-end build-category-button\"\n data-cy=\"add-category\"\n (click)=\"buildCategories()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.BuildCategory' | transloco }}\n </a>\n </div>\n <div class=\"col-12\">\n <a class=\"btn btn-sm btn-outline-primary float-end mr-2\"\n data-cy=\"add-category\"\n [routerLink]=\"['/' + subscription?.slug + routers.categoryDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CategoriesMessages.AddCategory' | transloco }}\n </a>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_opportunity_categories\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search stages...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Crm.CategoriesMessages.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"previous_category_id\">\n {{ 'Crm.CategoriesMessages.PreviousCategory' | transloco }}\n <p-sortIcon field=\"previous_category_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Crm.CategoriesMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-stage>\n <tr>\n <td data-head=\"Name\">{{ stage?.name }}</td>\n <td data-head=\"Previous Stage\">\n <span class=\"badge\"\n [appDynamicBadge]=\"{\n itemsArray: categoryNames,\n item: stage?.previous_category?.name\n }\"\n color=\"blue-grey\">{{ stage?.previous_category?.name }}</span>\n </td>\n <td data-head=\"Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: stage?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ stage?.is_visible }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.categoryDetails,\n stage.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(stage.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CategoriesMessages.NoCategoriesMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [".build-category-button{margin-left:7px}\n"] }]
2109
2084
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i0.ChangeDetectorRef }] });
2110
2085
 
2111
2086
  class SmartCrmConfigurationComponent extends AppBaseComponent {
@@ -3261,11 +3236,11 @@ class SmartCrmContactComponent extends AppBaseComponent {
3261
3236
  super.ngOnDestroy();
3262
3237
  }
3263
3238
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmContactComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
3264
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmContactComponent, selector: "pw-crm-contacts", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2 *ngIf=\"!accountData?.name\">Contacts</h2>\n <h3 *ngIf=\"accountData?.name\"\n class=\"mb-2\">\n {{ accountData.name }}\n <span [routerLink]=\"[routers.accounts, accountData.id]\"><i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i></span>\n </h3>\n <h4 *ngIf=\"accountData?.location\"\n class=\"mb-1\">Location: {{ accountData.location }}</h4>\n <h4 *ngIf=\"accountData?.tel\">Tel: {{ accountData.tel }}</h4>\n <h4 *ngIf=\"accountData?.company_url\">\n URL:\n <a href=\"{{ accountData.company_url }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{ accountData.company_url }}\n </a>\n </h4>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3 ms-2\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"!accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary me-3 float-end\"\n data-cy=\"list-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-list\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.ShowAllContacts' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"data.contacts\"\n [paginator]=\"data.object_count !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n [filterDelay]=\"1000\"\n stateStorage=\"local\"\n stateKey=\"smart-crm-contacts\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <select class=\"form-select\" (change)=\"filterByPotential($event)\">\n <option value=\"\">Select Priority</option>\n <option *ngFor=\"let option of potential\" [selected]=\"filterByPotentials === option\" [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedLabels\" placeholder=\"Select Label\" [options]=\"labels\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" (onChange)=\"onLabelChange($event)\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- multiple select account drop down -->\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedAccount\" placeholder=\"Select Account\" [options]=\"accountDropDown\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" optionLabel=\"name\" (onChange)=\"onSelectAccount()\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-md-4 col-lg-3\">\n <div class=\"d-flex\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control\" />\n </div>\n </div>\n\n </div>\n\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.ContactMessage.AccountOwner' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"labels\">\n {{ 'Crm.ContactMessage.Labels' | transloco }}\n <p-sortIcon field=\"labels\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"potential\">\n {{ 'Crm.ContactMessage.Potential' | transloco }}\n <p-sortIcon field=\"potential\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a ngbTooltip=\"{{contact.headline ? contact.headline : 'No headline for this contact'}}\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, contact.id]\">{{ (contact?.first_name || '') + ' ' + (contact?.last_name || '') | textTruncate: 20 }}\n </a>\n </td>\n <td data-head=\"OwnerName\">{{ contact.owner | ifNameNullShowEmail }}</td>\n <td data-head=\"Account Name\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n contact.crm_account.id\n ]\" ngbTooltip=\"{{contact?.crm_account.name}}\">{{ contact?.crm_account.name | textTruncate: 20 }}</a>\n </td>\n <td data-head=\"Labels\">\n <span class=\"badge bg-info m-1\"\n *ngFor=\"let item of contact.labels\">{{\n item\n }}</span>\n </td>\n <td data-head=\"Potential\">\n <span [appDynamicBadge]=\"{ itemsArray: potential, item: contact.potential }\"\n color=\"warning\"\n class=\"badge\">{{ contact.potential }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/crm/contacts/info',\n contact.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i class=\"fa fa-plus-circle add-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- <ng-container *ngIf=\"contact\"> -->\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactDetails,\n contact.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"contactInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"contactInsight\"\n [paginator]=\"contactInsight?.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"contactInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.ContactMessage.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.ContactMessage.Value' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.ContactMessage.Reason' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Title\">\n {{ insight.title }}\n </td>\n <td data-head=\"Value\">\n {{ insight.value }}\n </td>\n <td data-head=\"Reason\">\n {{ insight.reason }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"contactInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [layout]=\"contactGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!contactGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table tr{vertical-align:baseline}@media (min-width: 640px){.list-inline{width:150px}}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
3239
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmContactComponent, selector: "pw-crm-contacts", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2 *ngIf=\"!accountData?.name\">Contacts</h2>\n <h3 *ngIf=\"accountData?.name\"\n class=\"mb-2\">\n {{ accountData.name }}\n <span [routerLink]=\"[routers.accounts, accountData.id]\"><i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i></span>\n </h3>\n <h4 *ngIf=\"accountData?.location\"\n class=\"mb-1\">Location: {{ accountData.location }}</h4>\n <h4 *ngIf=\"accountData?.tel\">Tel: {{ accountData.tel }}</h4>\n <h4 *ngIf=\"accountData?.company_url\">\n URL:\n <a href=\"{{ accountData.company_url }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{ accountData.company_url }}\n </a>\n </h4>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3 ms-2\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"!accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary me-3 float-end\"\n data-cy=\"list-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-list\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.ShowAllContacts' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"data.contacts\"\n [paginator]=\"data.object_count !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n [filterDelay]=\"1000\"\n stateStorage=\"local\"\n stateKey=\"smart-crm-contacts\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <select class=\"form-select\" (change)=\"filterByPotential($event)\">\n <option value=\"\">Select Priority</option>\n <option *ngFor=\"let option of potential\" [selected]=\"filterByPotentials === option\" [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedLabels\" placeholder=\"Select Label\" [options]=\"labels\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" (onChange)=\"onLabelChange($event)\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- multiple select account drop down -->\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedAccount\" placeholder=\"Select Account\" [options]=\"accountDropDown\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" optionLabel=\"name\" (onChange)=\"onSelectAccount()\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-md-4 col-lg-3\">\n <div class=\"d-flex\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control\" />\n </div>\n </div>\n\n </div>\n\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.ContactMessage.AccountOwner' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"labels\">\n {{ 'Crm.ContactMessage.Labels' | transloco }}\n <p-sortIcon field=\"labels\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"potential\">\n {{ 'Crm.ContactMessage.Potential' | transloco }}\n <p-sortIcon field=\"potential\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a ngbTooltip=\"{{contact.headline ? contact.headline : 'No headline for this contact'}}\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, contact.id]\">{{ (contact?.first_name || '') + ' ' + (contact?.last_name || '') | textTruncate: 20 }}\n </a>\n </td>\n <td data-head=\"OwnerName\">{{ contact.owner | ifNameNullShowEmail }}</td>\n <td data-head=\"Account Name\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n contact.crm_account.id\n ]\" ngbTooltip=\"{{contact?.crm_account.name}}\">{{ contact?.crm_account.name | textTruncate: 20 }}</a>\n </td>\n <td data-head=\"Labels\">\n <span class=\"badge bg-info m-1\"\n *ngFor=\"let item of contact.labels\">{{\n item\n }}</span>\n </td>\n <td data-head=\"Potential\">\n <span [appDynamicBadge]=\"{ itemsArray: potential, item: contact.potential }\"\n color=\"warning\"\n class=\"badge\">{{ contact.potential }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/crm/contacts/info',\n contact.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i class=\"fa fa-plus-circle add-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- <ng-container *ngIf=\"contact\"> -->\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactDetails,\n contact.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"contactInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"contactInsight\"\n [paginator]=\"contactInsight?.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"contactInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.ContactMessage.Reason' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, insight.crm_contact_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n\n <td data-head=\"Headline\">\n <span\n [ngbTooltip]=\"insight?.headline\"\n container=\"body\"\n tooltipClass=\"custom-tooltip\"\n placement=\"bottom\"\n >\n {{ insight?.headline | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"Reason\">\n {{ insight.reason }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"contactInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [layout]=\"contactGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!contactGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table tr{vertical-align:baseline}@media (min-width: 640px){.list-inline{width:150px}}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
3265
3240
  }
3266
3241
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmContactComponent, decorators: [{
3267
3242
  type: Component,
3268
- args: [{ selector: 'pw-crm-contacts', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2 *ngIf=\"!accountData?.name\">Contacts</h2>\n <h3 *ngIf=\"accountData?.name\"\n class=\"mb-2\">\n {{ accountData.name }}\n <span [routerLink]=\"[routers.accounts, accountData.id]\"><i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i></span>\n </h3>\n <h4 *ngIf=\"accountData?.location\"\n class=\"mb-1\">Location: {{ accountData.location }}</h4>\n <h4 *ngIf=\"accountData?.tel\">Tel: {{ accountData.tel }}</h4>\n <h4 *ngIf=\"accountData?.company_url\">\n URL:\n <a href=\"{{ accountData.company_url }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{ accountData.company_url }}\n </a>\n </h4>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3 ms-2\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"!accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary me-3 float-end\"\n data-cy=\"list-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-list\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.ShowAllContacts' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"data.contacts\"\n [paginator]=\"data.object_count !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n [filterDelay]=\"1000\"\n stateStorage=\"local\"\n stateKey=\"smart-crm-contacts\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <select class=\"form-select\" (change)=\"filterByPotential($event)\">\n <option value=\"\">Select Priority</option>\n <option *ngFor=\"let option of potential\" [selected]=\"filterByPotentials === option\" [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedLabels\" placeholder=\"Select Label\" [options]=\"labels\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" (onChange)=\"onLabelChange($event)\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- multiple select account drop down -->\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedAccount\" placeholder=\"Select Account\" [options]=\"accountDropDown\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" optionLabel=\"name\" (onChange)=\"onSelectAccount()\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-md-4 col-lg-3\">\n <div class=\"d-flex\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control\" />\n </div>\n </div>\n\n </div>\n\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.ContactMessage.AccountOwner' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"labels\">\n {{ 'Crm.ContactMessage.Labels' | transloco }}\n <p-sortIcon field=\"labels\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"potential\">\n {{ 'Crm.ContactMessage.Potential' | transloco }}\n <p-sortIcon field=\"potential\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a ngbTooltip=\"{{contact.headline ? contact.headline : 'No headline for this contact'}}\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, contact.id]\">{{ (contact?.first_name || '') + ' ' + (contact?.last_name || '') | textTruncate: 20 }}\n </a>\n </td>\n <td data-head=\"OwnerName\">{{ contact.owner | ifNameNullShowEmail }}</td>\n <td data-head=\"Account Name\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n contact.crm_account.id\n ]\" ngbTooltip=\"{{contact?.crm_account.name}}\">{{ contact?.crm_account.name | textTruncate: 20 }}</a>\n </td>\n <td data-head=\"Labels\">\n <span class=\"badge bg-info m-1\"\n *ngFor=\"let item of contact.labels\">{{\n item\n }}</span>\n </td>\n <td data-head=\"Potential\">\n <span [appDynamicBadge]=\"{ itemsArray: potential, item: contact.potential }\"\n color=\"warning\"\n class=\"badge\">{{ contact.potential }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/crm/contacts/info',\n contact.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i class=\"fa fa-plus-circle add-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- <ng-container *ngIf=\"contact\"> -->\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactDetails,\n contact.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"contactInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"contactInsight\"\n [paginator]=\"contactInsight?.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"contactInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.ContactMessage.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.ContactMessage.Value' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.ContactMessage.Reason' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Title\">\n {{ insight.title }}\n </td>\n <td data-head=\"Value\">\n {{ insight.value }}\n </td>\n <td data-head=\"Reason\">\n {{ insight.reason }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"contactInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [layout]=\"contactGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!contactGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table tr{vertical-align:baseline}@media (min-width: 640px){.list-inline{width:150px}}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}\n"] }]
3243
+ args: [{ selector: 'pw-crm-contacts', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2 *ngIf=\"!accountData?.name\">Contacts</h2>\n <h3 *ngIf=\"accountData?.name\"\n class=\"mb-2\">\n {{ accountData.name }}\n <span [routerLink]=\"[routers.accounts, accountData.id]\"><i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i></span>\n </h3>\n <h4 *ngIf=\"accountData?.location\"\n class=\"mb-1\">Location: {{ accountData.location }}</h4>\n <h4 *ngIf=\"accountData?.tel\">Tel: {{ accountData.tel }}</h4>\n <h4 *ngIf=\"accountData?.company_url\">\n URL:\n <a href=\"{{ accountData.company_url }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{ accountData.company_url }}\n </a>\n </h4>\n <a class=\"btn btn-sm btn-outline-primary float-end mb-3 ms-2\"\n data-cy=\"add-opportunities\"\n (click)=\"navigateToOpportunities()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactAdd, accountId]\"\n *ngIf=\"!accountData?.name\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary me-3 float-end\"\n data-cy=\"list-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.contacts]\"\n *ngIf=\"accountData?.name\">\n <i class=\"fa fa-plus-list\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.ShowAllContacts' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table class=\"table\"\n #dt\n [value]=\"data.contacts\"\n [paginator]=\"data.object_count !== 0\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n [filterDelay]=\"1000\"\n stateStorage=\"local\"\n stateKey=\"smart-crm-contacts\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <select class=\"form-select\" (change)=\"filterByPotential($event)\">\n <option value=\"\">Select Priority</option>\n <option *ngFor=\"let option of potential\" [selected]=\"filterByPotentials === option\" [value]=\"option\">\n {{ option }}\n </option>\n </select>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedLabels\" placeholder=\"Select Label\" [options]=\"labels\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" (onChange)=\"onLabelChange($event)\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- multiple select account drop down -->\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect [(ngModel)]=\"selectedAccount\" placeholder=\"Select Account\" [options]=\"accountDropDown\" [filter]=\"false\"\n [showHeader]=\"true\" [showToggleAll]=\"true\" optionLabel=\"name\" (onChange)=\"onSelectAccount()\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-md-4 col-lg-3\">\n <div class=\"d-flex\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control\" />\n </div>\n </div>\n\n </div>\n\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"owner_id\">\n {{ 'Crm.ContactMessage.ContactOwner' | transloco }}\n <p-sortIcon field=\"owner_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_account_id\">\n {{ 'Crm.ContactMessage.AccountOwner' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"labels\">\n {{ 'Crm.ContactMessage.Labels' | transloco }}\n <p-sortIcon field=\"labels\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"potential\">\n {{ 'Crm.ContactMessage.Potential' | transloco }}\n <p-sortIcon field=\"potential\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-contact>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a ngbTooltip=\"{{contact.headline ? contact.headline : 'No headline for this contact'}}\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, contact.id]\">{{ (contact?.first_name || '') + ' ' + (contact?.last_name || '') | textTruncate: 20 }}\n </a>\n </td>\n <td data-head=\"OwnerName\">{{ contact.owner | ifNameNullShowEmail }}</td>\n <td data-head=\"Account Name\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n contact.crm_account.id\n ]\" ngbTooltip=\"{{contact?.crm_account.name}}\">{{ contact?.crm_account.name | textTruncate: 20 }}</a>\n </td>\n <td data-head=\"Labels\">\n <span class=\"badge bg-info m-1\"\n *ngFor=\"let item of contact.labels\">{{\n item\n }}</span>\n </td>\n <td data-head=\"Potential\">\n <span [appDynamicBadge]=\"{ itemsArray: potential, item: contact.potential }\"\n color=\"warning\"\n class=\"badge\">{{ contact.potential }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/crm/contacts/info',\n contact.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Add opportunity\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\"\n [queryParams]=\"{ contact_id: contact.id }\">\n <i class=\"fa fa-plus-circle add-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- <ng-container *ngIf=\"contact\"> -->\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactDetails,\n contact.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n contact.owner_id === userId ||\n contact.crm_account.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(contact.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.ContactsAdminMessage' | transloco\"> </pw-no-data>\n</div>\n\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"contactInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"contactInsight\"\n [paginator]=\"contactInsight?.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"contactInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Contact' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.ContactMessage.Reason' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, insight.crm_contact_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n\n <td data-head=\"Headline\">\n <span\n [ngbTooltip]=\"insight?.headline\"\n container=\"body\"\n tooltipClass=\"custom-tooltip\"\n placement=\"bottom\"\n >\n {{ insight?.headline | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"Reason\">\n {{ insight.reason }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"contactInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [layout]=\"contactGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!contactGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table tr{vertical-align:baseline}@media (min-width: 640px){.list-inline{width:150px}}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}\n"] }]
3269
3244
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
3270
3245
 
3271
3246
  class SmartCrmCustomerSuccessComponent {
@@ -3605,11 +3580,11 @@ class SmartCrmLeadsComponent extends AppBaseComponent {
3605
3580
  super.ngOnDestroy();
3606
3581
  }
3607
3582
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmLeadsComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
3608
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmLeadsComponent, selector: "pw-smart-crm-leads", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Leads</h2>\n <p>\n In this section you'll find a list of prospects we found for you - based on your domain\n of activity - and we think you should reach out to.\n </p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-leads\"\n [routerLink]=\"['/' + subscription?.slug + routers.leadsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CrmLeads.AddLead' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_leads\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"d-flex\">\n <div class=\"col-sm-3\">\n <p-multiSelect placeholder=\"Select Source\"\n [options]=\"crmSources\"\n [filter]=\"false\"\n (onChange)=\"onSourceChange($event)\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"text-end ms-auto\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search leads...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Crm.CrmLeads.Email' | transloco }}\n <p-sortIcon field=\"email\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Crm.CrmLeads.EmailVerified' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"created_at\">\n {{ 'Crm.CrmLeads.CreatedAt' | transloco }}\n <p-sortIcon field=\"created_at\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_source_id\">\n {{ 'Crm.CrmLeads.Source' | transloco }}\n <p-sortIcon field=\"crm_source_id\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-lead>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, lead?.id]\">\n {{\n !lead?.first_name && !lead.last_name\n ? 'N/A'\n : ((lead?.first_name || '') + ' ' + (lead?.last_name || '') | textTruncate: 20)\n }}\n </a>\n </td>\n <td data-head=\"Email\">\n <a href=\"mailto:{{ lead?.email }}\">{{ lead?.email }}</a>\n <span *ngIf=\"lead?.enquiry\"\n class=\"ms-2\"\n [pTooltip]=\"lead?.enquiry\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </td>\n <td data-head=\"Email Verified\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: lead?.email_verified\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ lead?.email_verified ? 'true' : 'false' }}</span>\n <span class=\"ms-2 cursor-pointer\"\n [pTooltip]=\"'Crm.CrmLeads.Tooltip.NewsLetterUnsubscribed' | transloco\"\n tooltipPosition=\"top\"\n *ngIf=\"!lead?.newsletter_subscribed\"><i class=\"fas fa-exclamation-triangle text-danger\"></i></span>\n </td>\n <td data-head=\"Created At\">\n {{ lead?.created_at | dateFormat }}\n </td>\n <td>\n <span class=\"badge\"\n [appDynamicBadge]=\"{ itemsArray: allSource, item: lead?.crm_source?.name }\"\n color=\"default\">{{ lead?.crm_source?.name }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n lead?.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.leadsDetails,\n lead?.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(lead.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CrmLeads.NoCrmLeadMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i10$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
3583
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmLeadsComponent, selector: "pw-smart-crm-leads", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Leads</h2>\n <p>\n In this section you'll find a list of prospects we found for you - based on your domain\n of activity - and we think you should reach out to.\n </p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-leads\"\n [routerLink]=\"['/' + subscription?.slug + routers.leadsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CrmLeads.AddLead' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_leads\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"d-flex\">\n <div class=\"col-sm-3\">\n <p-multiSelect placeholder=\"Select Source\"\n [options]=\"crmSources\"\n [filter]=\"false\"\n (onChange)=\"onSourceChange($event)\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"text-end ms-auto\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search leads...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Crm.CrmLeads.Email' | transloco }}\n <p-sortIcon field=\"email\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Crm.CrmLeads.EmailVerified' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"created_at\">\n {{ 'Crm.CrmLeads.CreatedAt' | transloco }}\n <p-sortIcon field=\"created_at\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_source_id\">\n {{ 'Crm.CrmLeads.Source' | transloco }}\n <p-sortIcon field=\"crm_source_id\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-lead>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, lead?.id]\">\n {{\n !lead?.first_name && !lead.last_name\n ? 'N/A'\n : ((lead?.first_name || '') + ' ' + (lead?.last_name || '') | textTruncate: 20)\n }}\n </a>\n </td>\n <td data-head=\"Email\">\n <a href=\"mailto:{{ lead?.email }}\">{{ lead?.email }}</a>\n <span *ngIf=\"lead?.enquiry\"\n class=\"ms-2\"\n [pTooltip]=\"lead?.enquiry\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </td>\n <td data-head=\"Email Verified\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: lead?.email_verified\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ lead?.email_verified ? 'true' : 'false' }}</span>\n <span class=\"ms-2 cursor-pointer\"\n [pTooltip]=\"'Crm.CrmLeads.Tooltip.NewsLetterUnsubscribed' | transloco\"\n tooltipPosition=\"top\"\n *ngIf=\"!lead?.newsletter_subscribed\"><i class=\"fas fa-exclamation-triangle text-danger\"></i></span>\n </td>\n <td data-head=\"Created At\">\n {{ lead?.created_at | dateFormat }}\n </td>\n <td>\n <span class=\"badge\"\n [appDynamicBadge]=\"{ itemsArray: allSource, item: lead?.crm_source?.name }\"\n color=\"default\">{{ lead?.crm_source?.name }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n lead?.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.leadsDetails,\n lead?.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(lead.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CrmLeads.NoCrmLeadMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i10$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
3609
3584
  }
3610
3585
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmLeadsComponent, decorators: [{
3611
3586
  type: Component,
3612
- args: [{ selector: 'pw-smart-crm-leads', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Leads</h2>\n <p>\n In this section you'll find a list of prospects we found for you - based on your domain\n of activity - and we think you should reach out to.\n </p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-leads\"\n [routerLink]=\"['/' + subscription?.slug + routers.leadsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CrmLeads.AddLead' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_leads\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"d-flex\">\n <div class=\"col-sm-3\">\n <p-multiSelect placeholder=\"Select Source\"\n [options]=\"crmSources\"\n [filter]=\"false\"\n (onChange)=\"onSourceChange($event)\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"text-end ms-auto\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search leads...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Crm.CrmLeads.Email' | transloco }}\n <p-sortIcon field=\"email\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Crm.CrmLeads.EmailVerified' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"created_at\">\n {{ 'Crm.CrmLeads.CreatedAt' | transloco }}\n <p-sortIcon field=\"created_at\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_source_id\">\n {{ 'Crm.CrmLeads.Source' | transloco }}\n <p-sortIcon field=\"crm_source_id\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-lead>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, lead?.id]\">\n {{\n !lead?.first_name && !lead.last_name\n ? 'N/A'\n : ((lead?.first_name || '') + ' ' + (lead?.last_name || '') | textTruncate: 20)\n }}\n </a>\n </td>\n <td data-head=\"Email\">\n <a href=\"mailto:{{ lead?.email }}\">{{ lead?.email }}</a>\n <span *ngIf=\"lead?.enquiry\"\n class=\"ms-2\"\n [pTooltip]=\"lead?.enquiry\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </td>\n <td data-head=\"Email Verified\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: lead?.email_verified\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ lead?.email_verified ? 'true' : 'false' }}</span>\n <span class=\"ms-2 cursor-pointer\"\n [pTooltip]=\"'Crm.CrmLeads.Tooltip.NewsLetterUnsubscribed' | transloco\"\n tooltipPosition=\"top\"\n *ngIf=\"!lead?.newsletter_subscribed\"><i class=\"fas fa-exclamation-triangle text-danger\"></i></span>\n </td>\n <td data-head=\"Created At\">\n {{ lead?.created_at | dateFormat }}\n </td>\n <td>\n <span class=\"badge\"\n [appDynamicBadge]=\"{ itemsArray: allSource, item: lead?.crm_source?.name }\"\n color=\"default\">{{ lead?.crm_source?.name }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n lead?.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.leadsDetails,\n lead?.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(lead.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CrmLeads.NoCrmLeadMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
3587
+ args: [{ selector: 'pw-smart-crm-leads', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Leads</h2>\n <p>\n In this section you'll find a list of prospects we found for you - based on your domain\n of activity - and we think you should reach out to.\n </p>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-leads\"\n [routerLink]=\"['/' + subscription?.slug + routers.leadsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.CrmLeads.AddLead' | transloco }}\n </a>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n<div class=\"primeng-datatable-container table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_leads\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"d-flex\">\n <div class=\"col-sm-3\">\n <p-multiSelect placeholder=\"Select Source\"\n [options]=\"crmSources\"\n [filter]=\"false\"\n (onChange)=\"onSourceChange($event)\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"text-end ms-auto\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search leads...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"first_name\">\n {{ 'Crm.ContactMessage.Name' | transloco }}\n <p-sortIcon field=\"first_name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"email\">\n {{ 'Crm.CrmLeads.Email' | transloco }}\n <p-sortIcon field=\"email\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Crm.CrmLeads.EmailVerified' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"created_at\">\n {{ 'Crm.CrmLeads.CreatedAt' | transloco }}\n <p-sortIcon field=\"created_at\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"crm_source_id\">\n {{ 'Crm.CrmLeads.Source' | transloco }}\n <p-sortIcon field=\"crm_source_id\"></p-sortIcon>\n </th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-lead>\n <tr>\n <td data-head=\"Name\"\n class=\"contactname\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, lead?.id]\">\n {{\n !lead?.first_name && !lead.last_name\n ? 'N/A'\n : ((lead?.first_name || '') + ' ' + (lead?.last_name || '') | textTruncate: 20)\n }}\n </a>\n </td>\n <td data-head=\"Email\">\n <a href=\"mailto:{{ lead?.email }}\">{{ lead?.email }}</a>\n <span *ngIf=\"lead?.enquiry\"\n class=\"ms-2\"\n [pTooltip]=\"lead?.enquiry\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </td>\n <td data-head=\"Email Verified\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: lead?.email_verified\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ lead?.email_verified ? 'true' : 'false' }}</span>\n <span class=\"ms-2 cursor-pointer\"\n [pTooltip]=\"'Crm.CrmLeads.Tooltip.NewsLetterUnsubscribed' | transloco\"\n tooltipPosition=\"top\"\n *ngIf=\"!lead?.newsletter_subscribed\"><i class=\"fas fa-exclamation-triangle text-danger\"></i></span>\n </td>\n <td data-head=\"Created At\">\n {{ lead?.created_at | dateFormat }}\n </td>\n <td>\n <span class=\"badge\"\n [appDynamicBadge]=\"{ itemsArray: allSource, item: lead?.crm_source?.name }\"\n color=\"default\">{{ lead?.crm_source?.name }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Show\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n lead?.id\n ]\">\n <i class=\"fa fa-eye see-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.leadsDetails,\n lead?.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li *ngIf=\"\n hasAccess ||\n lead?.owner_id === userId ||\n lead?.crm_account?.owner_id === userId\n \"\n ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(lead.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CrmLeads.NoCrmLeadMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
3613
3588
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
3614
3589
 
3615
3590
  class SmartCrmMarketingUsersListComponent extends AppBaseComponent {
@@ -3911,7 +3886,7 @@ class SmartCrmCommunicationsDetailsComponent extends AppBaseComponent {
3911
3886
  super.ngOnDestroy();
3912
3887
  }
3913
3888
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCommunicationsDetailsComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i2.CommonService }], target: i0.ɵɵFactoryTarget.Component }); }
3914
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCommunicationsDetailsComponent, selector: "pw-smart-crm-communications-details", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{ data?.id ? 'Edit' : 'Create new' }} marketing email</span>\n </h3>\n </div>\n</div>\n<ng-container>\n <div class=\"container-fluid pw-tab\">\n <div class=\"p-2 mt-3\">\n <p class=\"my-3\">\n You can insert the user name by adding the following syntax in the body or title:\n {{ userNameSyntax }}\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Title' | transloco\"\n name=\"title\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Title' | transloco\"\n errorMsg=\"Please enter subject\">\n <input type=\"text\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Body' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Body' | transloco\"\n name=\"body\"\n errorMsg=\"Please enter body\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n class=\"quillEditor\" [modules]=\"editorConfig\"\n class=\"w-100\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendAt' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendAt' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_at\"\n ngbDatepicker\n #c=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_at'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"c.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendUntil' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendUntil' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_until\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_until'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"d.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.PreviousNewsletter' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.PreviousNewsletter' | transloco\n }}</span></label>\n <select class=\"form-select\"\n formControlName=\"previous_newsletter_id\"\n (change)=\"onNewsletterSelect($event)\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['previous_newsletter_id'].errors\n }\">\n <option value=\"\">select previous newsletter</option>\n <option *ngFor=\"let option of allCommunications\"\n [value]=\"option.id\">\n {{ option.title }}\n </option>\n </select>\n </div>\n\n <div class=\"col-12 col-sm-2\"\n *ngIf=\"daysToNewsletterField\">\n <pw-input-container [label]=\"\n 'Crm.CommunicationsMessage.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Crm.CommunicationsMessage.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\"\n errorMsg=\"Please enter days to wait from previous newsletter\">\n <input type=\"number\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted && f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-1\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ShouldDeliver' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.IsPushed' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"is_pushed\"\n (change)=\"onChange($event, 'is_pushed')\"\n name=\"is_pushed\">\n </ui-switch>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.CanReply' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.CanReply' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"can_reply\"\n name=\"can_reply\">\n </ui-switch>\n </div>\n </div>\n </div>\n\n <h3>Decide who will receive the email</h3>\n\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Location' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Location' | transloco\n }}</span></label>\n <input ngx-gp-autocomplete\n class=\"form-control\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Products' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Products' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"crmProduct\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Features' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Features' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"featureKeys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactPotential' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactPotential' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"potentials\"\n formControlName=\"contact_potential\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactLabel' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactLabel' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"labels\"\n formControlName=\"contact_label\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"contactSource\"\n formControlName=\"contact_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountPriority' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountPriority' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"priority\"\n formControlName=\"account_priority\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountStatus' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountStatus' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"status\"\n formControlName=\"account_status\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"source\"\n formControlName=\"account_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSize' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSize' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"organizationSizes\"\n formControlName=\"account_size\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <!-- Only new contacts -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <label class=\"info-circle mb-2\">{{ 'Crm.CommunicationsMessage.OnlyNewContacts' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.OnlyNewContacts' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"only_new_contacts\"\n name=\"only_new_contacts\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_contacts'].errors\n }\">\n </ui-switch>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n [disabled]=\"!form.valid\"\n >\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4$1.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i5.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i9.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i11.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText"] }, { kind: "component", type: i12$2.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
3889
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCommunicationsDetailsComponent, selector: "pw-smart-crm-communications-details", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{ data?.id ? 'Edit' : 'Create new' }} marketing email</span>\n </h3>\n </div>\n</div>\n<ng-container>\n <div class=\"container-fluid pw-tab\">\n <div class=\"p-2 mt-3\">\n <p class=\"my-3\">\n You can insert the user name by adding the following syntax in the body or title:\n {{ userNameSyntax }}\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Title' | transloco\"\n name=\"title\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Title' | transloco\"\n errorMsg=\"Please enter subject\">\n <input type=\"text\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Body' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Body' | transloco\"\n name=\"body\"\n errorMsg=\"Please enter body\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendAt' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendAt' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_at\"\n ngbDatepicker\n #c=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_at'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"c.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendUntil' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendUntil' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_until\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_until'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"d.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.PreviousNewsletter' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.PreviousNewsletter' | transloco\n }}</span></label>\n <select class=\"form-select\"\n formControlName=\"previous_newsletter_id\"\n (change)=\"onNewsletterSelect($event)\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['previous_newsletter_id'].errors\n }\">\n <option value=\"\">select previous newsletter</option>\n <option *ngFor=\"let option of allCommunications\"\n [value]=\"option.id\">\n {{ option.title }}\n </option>\n </select>\n </div>\n\n <div class=\"col-12 col-sm-2\"\n *ngIf=\"daysToNewsletterField\">\n <pw-input-container [label]=\"\n 'Crm.CommunicationsMessage.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Crm.CommunicationsMessage.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\"\n errorMsg=\"Please enter days to wait from previous newsletter\">\n <input type=\"number\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted && f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-1\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ShouldDeliver' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.IsPushed' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"is_pushed\"\n (change)=\"onChange($event, 'is_pushed')\"\n name=\"is_pushed\">\n </ui-switch>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.CanReply' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.CanReply' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"can_reply\"\n name=\"can_reply\">\n </ui-switch>\n </div>\n </div>\n </div>\n\n <h3>Decide who will receive the email</h3>\n\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Location' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Location' | transloco\n }}</span></label>\n <input ngx-gp-autocomplete\n class=\"form-control\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Products' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Products' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"crmProduct\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Features' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Features' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"featureKeys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactPotential' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactPotential' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"potentials\"\n formControlName=\"contact_potential\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactLabel' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactLabel' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"labels\"\n formControlName=\"contact_label\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"contactSource\"\n formControlName=\"contact_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountPriority' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountPriority' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"priority\"\n formControlName=\"account_priority\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountStatus' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountStatus' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"status\"\n formControlName=\"account_status\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"source\"\n formControlName=\"account_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSize' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSize' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"organizationSizes\"\n formControlName=\"account_size\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <!-- Only new contacts -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <label class=\"info-circle mb-2\">{{ 'Crm.CommunicationsMessage.OnlyNewContacts' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.OnlyNewContacts' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"only_new_contacts\"\n name=\"only_new_contacts\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_contacts'].errors\n }\">\n </ui-switch>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n [disabled]=\"!form.valid\"\n >\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4$1.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i5.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i9.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i11.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText"] }, { kind: "component", type: i12$2.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
3915
3890
  }
3916
3891
  __decorate([
3917
3892
  ValidateForm('form'),
@@ -3921,7 +3896,7 @@ __decorate([
3921
3896
  ], SmartCrmCommunicationsDetailsComponent.prototype, "onSave", null);
3922
3897
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCommunicationsDetailsComponent, decorators: [{
3923
3898
  type: Component,
3924
- args: [{ selector: 'pw-smart-crm-communications-details', template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{ data?.id ? 'Edit' : 'Create new' }} marketing email</span>\n </h3>\n </div>\n</div>\n<ng-container>\n <div class=\"container-fluid pw-tab\">\n <div class=\"p-2 mt-3\">\n <p class=\"my-3\">\n You can insert the user name by adding the following syntax in the body or title:\n {{ userNameSyntax }}\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Title' | transloco\"\n name=\"title\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Title' | transloco\"\n errorMsg=\"Please enter subject\">\n <input type=\"text\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Body' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Body' | transloco\"\n name=\"body\"\n errorMsg=\"Please enter body\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n class=\"quillEditor\" [modules]=\"editorConfig\"\n class=\"w-100\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendAt' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendAt' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_at\"\n ngbDatepicker\n #c=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_at'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"c.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendUntil' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendUntil' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_until\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_until'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"d.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.PreviousNewsletter' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.PreviousNewsletter' | transloco\n }}</span></label>\n <select class=\"form-select\"\n formControlName=\"previous_newsletter_id\"\n (change)=\"onNewsletterSelect($event)\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['previous_newsletter_id'].errors\n }\">\n <option value=\"\">select previous newsletter</option>\n <option *ngFor=\"let option of allCommunications\"\n [value]=\"option.id\">\n {{ option.title }}\n </option>\n </select>\n </div>\n\n <div class=\"col-12 col-sm-2\"\n *ngIf=\"daysToNewsletterField\">\n <pw-input-container [label]=\"\n 'Crm.CommunicationsMessage.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Crm.CommunicationsMessage.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\"\n errorMsg=\"Please enter days to wait from previous newsletter\">\n <input type=\"number\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted && f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-1\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ShouldDeliver' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.IsPushed' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"is_pushed\"\n (change)=\"onChange($event, 'is_pushed')\"\n name=\"is_pushed\">\n </ui-switch>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.CanReply' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.CanReply' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"can_reply\"\n name=\"can_reply\">\n </ui-switch>\n </div>\n </div>\n </div>\n\n <h3>Decide who will receive the email</h3>\n\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Location' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Location' | transloco\n }}</span></label>\n <input ngx-gp-autocomplete\n class=\"form-control\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Products' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Products' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"crmProduct\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Features' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Features' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"featureKeys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactPotential' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactPotential' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"potentials\"\n formControlName=\"contact_potential\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactLabel' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactLabel' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"labels\"\n formControlName=\"contact_label\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"contactSource\"\n formControlName=\"contact_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountPriority' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountPriority' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"priority\"\n formControlName=\"account_priority\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountStatus' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountStatus' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"status\"\n formControlName=\"account_status\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"source\"\n formControlName=\"account_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSize' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSize' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"organizationSizes\"\n formControlName=\"account_size\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <!-- Only new contacts -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <label class=\"info-circle mb-2\">{{ 'Crm.CommunicationsMessage.OnlyNewContacts' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.OnlyNewContacts' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"only_new_contacts\"\n name=\"only_new_contacts\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_contacts'].errors\n }\">\n </ui-switch>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n [disabled]=\"!form.valid\"\n >\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n</ng-container>\n" }]
3899
+ args: [{ selector: 'pw-smart-crm-communications-details', template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{ data?.id ? 'Edit' : 'Create new' }} marketing email</span>\n </h3>\n </div>\n</div>\n<ng-container>\n <div class=\"container-fluid pw-tab\">\n <div class=\"p-2 mt-3\">\n <p class=\"my-3\">\n You can insert the user name by adding the following syntax in the body or title:\n {{ userNameSyntax }}\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Title' | transloco\"\n name=\"title\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Title' | transloco\"\n errorMsg=\"Please enter subject\">\n <input type=\"text\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Crm.CommunicationsMessage.Body' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Crm.CommunicationsMessage.Tooltip.Body' | transloco\"\n name=\"body\"\n errorMsg=\"Please enter body\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendAt' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendAt' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_at\"\n ngbDatepicker\n #c=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_at'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"c.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.SendUntil' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.SendUntil' | transloco\n }}</span></label>\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"send_until\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n [ngClass]=\"{ 'is-invalid': submitted && f['send_until'].errors }\" />\n <div class=\"input-group-append\">\n <button class=\"btn btn-primary\"\n (click)=\"d.toggle()\"\n type=\"button\">\n <i class=\"fa fa-calendar\" aria-hidden=\"true\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"col-12 col-md-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.PreviousNewsletter' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.PreviousNewsletter' | transloco\n }}</span></label>\n <select class=\"form-select\"\n formControlName=\"previous_newsletter_id\"\n (change)=\"onNewsletterSelect($event)\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['previous_newsletter_id'].errors\n }\">\n <option value=\"\">select previous newsletter</option>\n <option *ngFor=\"let option of allCommunications\"\n [value]=\"option.id\">\n {{ option.title }}\n </option>\n </select>\n </div>\n\n <div class=\"col-12 col-sm-2\"\n *ngIf=\"daysToNewsletterField\">\n <pw-input-container [label]=\"\n 'Crm.CommunicationsMessage.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Crm.CommunicationsMessage.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\"\n errorMsg=\"Please enter days to wait from previous newsletter\">\n <input type=\"number\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted && f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-1\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ShouldDeliver' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.IsPushed' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"is_pushed\"\n (change)=\"onChange($event, 'is_pushed')\"\n name=\"is_pushed\">\n </ui-switch>\n </div>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.CanReply' | transloco\n }}<span class=\"text-danger required-icon\">*</span><span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.CanReply' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"can_reply\"\n name=\"can_reply\">\n </ui-switch>\n </div>\n </div>\n </div>\n\n <h3>Decide who will receive the email</h3>\n\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Location' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Location' | transloco\n }}</span></label>\n <input ngx-gp-autocomplete\n class=\"form-control\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </div>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Products' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Products' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"crmProduct\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.Features' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.Features' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"featureKeys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactPotential' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactPotential' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"potentials\"\n formControlName=\"contact_potential\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactLabel' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactLabel' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"labels\"\n formControlName=\"contact_label\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.ContactSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.ContactSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"contactSource\"\n formControlName=\"contact_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountPriority' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountPriority' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"priority\"\n formControlName=\"account_priority\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountStatus' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountStatus' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"status\"\n formControlName=\"account_status\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSource' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSource' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"source\"\n formControlName=\"account_source\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <div class=\"mb-3 col-12 col-md-4\">\n <label class=\"info-circle\">{{ 'Crm.CommunicationsMessage.AccountSize' | transloco }}\n <span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.AccountSize' | transloco\n }}</span></label>\n <p-multiSelect [options]=\"organizationSizes\"\n formControlName=\"account_size\"\n appendTo=\"body\"></p-multiSelect>\n </div>\n\n <!-- Only new contacts -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <label class=\"info-circle mb-2\">{{ 'Crm.CommunicationsMessage.OnlyNewContacts' | transloco\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n 'Crm.CommunicationsMessage.Tooltip.OnlyNewContacts' | transloco\n }}</span>\n </label>\n <ui-switch class=\"d-block\"\n formControlName=\"only_new_contacts\"\n name=\"only_new_contacts\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_contacts'].errors\n }\">\n </ui-switch>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n [disabled]=\"!form.valid\"\n >\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n</ng-container>\n" }]
3925
3900
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i2.CommonService }], propDecorators: { onSave: [] } });
3926
3901
 
3927
3902
  class SmartCrmCommunicationsComponent extends AppBaseComponent {
@@ -4050,11 +4025,11 @@ class SmartCrmCommunicationsComponent extends AppBaseComponent {
4050
4025
  super.ngOnDestroy();
4051
4026
  }
4052
4027
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCommunicationsComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
4053
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCommunicationsComponent, selector: "pw-smart-crm-communications", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12\">\n <h2>Email Marketing</h2>\n <p>In this section you can create and manage your email marketing strategy.</p>\n </div>\n <div class=\"col-12 col-md-12 text-end\">\n <button class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + routers.marketingDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add New Email' }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-3 table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_newsletters\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search communication emails...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"title\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n <p-sortIcon field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"body\">\n {{ 'Crm.CommunicationsMessage.Body' | transloco }}\n <p-sortIcon field=\"body\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"location\">\n {{ 'Crm.CommunicationsMessage.Location' | transloco }}\n <p-sortIcon field=\"location'\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"send_until\">\n {{ 'Crm.CommunicationsMessage.SendUntil' | transloco }}\n <p-sortIcon field=\"send_until\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_pushed\">\n {{ 'Crm.CommunicationsMessage.Pushed' | transloco }}\n <p-sortIcon field=\"is_pushed\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_sent\">\n {{ 'Crm.CommunicationsMessage.Sent' | transloco }}\n <p-sortIcon field=\"is_sent\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.marketing, item.id]\">{{\n item.title\n }}</a>\n </td>\n <td data-head=\"Body\"\n [innerHtml]=\"item.body | removeHtml: 'quill' | textTruncate: 200\"></td>\n <td data-head=\"Location\">{{ item.location }}</td>\n <td data-head=\"Send Until\">{{ item.send_until | dateFormat }}</td>\n <td data-head=\"Pushed?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_pushed }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_pushed }}</span>\n </td>\n <td data-head=\"Sent?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_sent }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_sent }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Send test email\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-comment-alt cta1-icon\"\n (click)=\"sendTestEmail(item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.marketingDetails,\n item.id\n ]\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Preview and Recipients\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-eye eye-icon\"\n (click)=\"onNavigate(subscription, item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoCommunicationMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"communicationsInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"communicationsInsight\"\n [paginator]=\"communicationsInsight.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"communicationsInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Value' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Reason' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Title\">{{ insight.title }}</td>\n <td data-head=\"Value\">{{ insight.value }}</td>\n <td data-head=\"Reason\">{{ insight.reason }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"communicationsInsight.length !== 0\">{{ 'Label.Total' | transloco }}: {{ communicationsInsight.length }}</span>\n </div>\n <div *ngIf=\"!communicationsInsight?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Engagement</h5>\n <div>\n <ng-template [ngIf]=\"communicationEngagement\">\n <plotly-plot [data]=\"communicationEngagement?.data\"\n [layout]=\"communicationEngagement?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!communicationEngagement\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [".actions-column{min-width:170px}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.RemoveHtmlPipe, name: "removeHtml" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
4028
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCommunicationsComponent, selector: "pw-smart-crm-communications", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12\">\n <h2>Email Marketing</h2>\n <p>In this section you can create and manage your email marketing strategy.</p>\n </div>\n <div class=\"col-12 col-md-12 text-end\">\n <button class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + routers.marketingDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add New Email' }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-3 table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_newsletters\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search communication emails...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"title\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n <p-sortIcon field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"body\">\n {{ 'Crm.CommunicationsMessage.Body' | transloco }}\n <p-sortIcon field=\"body\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"location\">\n {{ 'Crm.CommunicationsMessage.Location' | transloco }}\n <p-sortIcon field=\"location'\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"send_until\">\n {{ 'Crm.CommunicationsMessage.SendUntil' | transloco }}\n <p-sortIcon field=\"send_until\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_pushed\">\n {{ 'Crm.CommunicationsMessage.Pushed' | transloco }}\n <p-sortIcon field=\"is_pushed\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_sent\">\n {{ 'Crm.CommunicationsMessage.Sent' | transloco }}\n <p-sortIcon field=\"is_sent\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.marketing, item.id]\">{{\n item.title\n }}</a>\n </td>\n <td data-head=\"Body\"\n [innerHtml]=\"item.body | removeHtml: 'quill' | textTruncate: 200\"></td>\n <td data-head=\"Location\">{{ item.location }}</td>\n <td data-head=\"Send Until\">{{ item.send_until | dateFormat }}</td>\n <td data-head=\"Pushed?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_pushed }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_pushed }}</span>\n </td>\n <td data-head=\"Sent?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_sent }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_sent }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Send test email\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-comment-alt cta1-icon\"\n (click)=\"sendTestEmail(item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.marketingDetails,\n item.id\n ]\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Preview and Recipients\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-eye eye-icon\"\n (click)=\"onNavigate(subscription, item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoCommunicationMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"communicationsInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"communicationsInsight\"\n [paginator]=\"communicationsInsight.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"communicationsInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.SendAt' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.SendUntil' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Reason' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Title\">\n <span\n [ngbTooltip]=\"insight?.title\"\n container=\"body\"\n tooltipClass=\"custom-tooltip\"\n placement=\"bottom\"\n >\n <a [routerLink]=\"['/' + subscription?.slug + routers.marketing, insight.id]\">{{ insight?.title | textTruncate: 30 }}</a>\n </span>\n </td>\n <td data-head=\"Value\">{{ insight.send_at | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Value\">{{ insight.send_until | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Reason\">{{ insight.reason }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"communicationsInsight.length !== 0\">{{ 'Label.Total' | transloco }}: {{ communicationsInsight.length }}</span>\n </div>\n <div *ngIf=\"!communicationsInsight?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Engagement</h5>\n <div>\n <ng-template [ngIf]=\"communicationEngagement\">\n <plotly-plot [data]=\"communicationEngagement?.data\"\n [layout]=\"communicationEngagement?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!communicationEngagement\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [".actions-column{min-width:170px}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.RemoveHtmlPipe, name: "removeHtml" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
4054
4029
  }
4055
4030
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCommunicationsComponent, decorators: [{
4056
4031
  type: Component,
4057
- args: [{ selector: 'pw-smart-crm-communications', template: "<div class=\"row\">\n <div class=\"col-12\">\n <h2>Email Marketing</h2>\n <p>In this section you can create and manage your email marketing strategy.</p>\n </div>\n <div class=\"col-12 col-md-12 text-end\">\n <button class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + routers.marketingDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add New Email' }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-3 table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_newsletters\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search communication emails...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"title\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n <p-sortIcon field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"body\">\n {{ 'Crm.CommunicationsMessage.Body' | transloco }}\n <p-sortIcon field=\"body\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"location\">\n {{ 'Crm.CommunicationsMessage.Location' | transloco }}\n <p-sortIcon field=\"location'\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"send_until\">\n {{ 'Crm.CommunicationsMessage.SendUntil' | transloco }}\n <p-sortIcon field=\"send_until\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_pushed\">\n {{ 'Crm.CommunicationsMessage.Pushed' | transloco }}\n <p-sortIcon field=\"is_pushed\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_sent\">\n {{ 'Crm.CommunicationsMessage.Sent' | transloco }}\n <p-sortIcon field=\"is_sent\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.marketing, item.id]\">{{\n item.title\n }}</a>\n </td>\n <td data-head=\"Body\"\n [innerHtml]=\"item.body | removeHtml: 'quill' | textTruncate: 200\"></td>\n <td data-head=\"Location\">{{ item.location }}</td>\n <td data-head=\"Send Until\">{{ item.send_until | dateFormat }}</td>\n <td data-head=\"Pushed?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_pushed }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_pushed }}</span>\n </td>\n <td data-head=\"Sent?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_sent }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_sent }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <li ngbTooltip=\"Send test email\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-comment-alt cta1-icon\"\n (click)=\"sendTestEmail(item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.marketingDetails,\n item.id\n ]\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Preview and Recipients\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-eye eye-icon\"\n (click)=\"onNavigate(subscription, item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoCommunicationMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"communicationsInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"communicationsInsight\"\n [paginator]=\"communicationsInsight.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"communicationsInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Value' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Reason' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Title\">{{ insight.title }}</td>\n <td data-head=\"Value\">{{ insight.value }}</td>\n <td data-head=\"Reason\">{{ insight.reason }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"communicationsInsight.length !== 0\">{{ 'Label.Total' | transloco }}: {{ communicationsInsight.length }}</span>\n </div>\n <div *ngIf=\"!communicationsInsight?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Engagement</h5>\n <div>\n <ng-template [ngIf]=\"communicationEngagement\">\n <plotly-plot [data]=\"communicationEngagement?.data\"\n [layout]=\"communicationEngagement?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!communicationEngagement\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [".actions-column{min-width:170px}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}\n"] }]
4032
+ args: [{ selector: 'pw-smart-crm-communications', template: "<div class=\"row\">\n <div class=\"col-12\">\n <h2>Email Marketing</h2>\n <p>In this section you can create and manage your email marketing strategy.</p>\n </div>\n <div class=\"col-12 col-md-12 text-end\">\n <button class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + routers.marketingDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add New Email' }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-3 table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.crm_newsletters\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search communication emails...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"title\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n <p-sortIcon field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"body\">\n {{ 'Crm.CommunicationsMessage.Body' | transloco }}\n <p-sortIcon field=\"body\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"location\">\n {{ 'Crm.CommunicationsMessage.Location' | transloco }}\n <p-sortIcon field=\"location'\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"send_until\">\n {{ 'Crm.CommunicationsMessage.SendUntil' | transloco }}\n <p-sortIcon field=\"send_until\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_pushed\">\n {{ 'Crm.CommunicationsMessage.Pushed' | transloco }}\n <p-sortIcon field=\"is_pushed\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_sent\">\n {{ 'Crm.CommunicationsMessage.Sent' | transloco }}\n <p-sortIcon field=\"is_sent\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.marketing, item.id]\">{{\n item.title\n }}</a>\n </td>\n <td data-head=\"Body\"\n [innerHtml]=\"item.body | removeHtml: 'quill' | textTruncate: 200\"></td>\n <td data-head=\"Location\">{{ item.location }}</td>\n <td data-head=\"Send Until\">{{ item.send_until | dateFormat }}</td>\n <td data-head=\"Pushed?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_pushed }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_pushed }}</span>\n </td>\n <td data-head=\"Sent?\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_sent }\"\n color=\"success-danger\"\n class=\"badge\">{{ !!item?.is_sent }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Send test email\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-comment-alt cta1-icon\"\n (click)=\"sendTestEmail(item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.marketingDetails,\n item.id\n ]\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Preview and Recipients\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-eye eye-icon\"\n (click)=\"onNavigate(subscription, item)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoCommunicationMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"communicationsInsight?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"communicationsInsight\"\n [paginator]=\"communicationsInsight.length !== 0\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"communicationsInsight.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Title' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.SendAt' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.SendUntil' | transloco }}\n </th>\n <th scope=\"true\">\n {{ 'Crm.CommunicationsMessage.Reason' | transloco }}\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-insight>\n <tr>\n <td data-head=\"Title\">\n <span\n [ngbTooltip]=\"insight?.title\"\n container=\"body\"\n tooltipClass=\"custom-tooltip\"\n placement=\"bottom\"\n >\n <a [routerLink]=\"['/' + subscription?.slug + routers.marketing, insight.id]\">{{ insight?.title | textTruncate: 30 }}</a>\n </span>\n </td>\n <td data-head=\"Value\">{{ insight.send_at | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Value\">{{ insight.send_until | date: 'dd-MMM-YYYY' }}</td>\n <td data-head=\"Reason\">{{ insight.reason }}</td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"communicationsInsight.length !== 0\">{{ 'Label.Total' | transloco }}: {{ communicationsInsight.length }}</span>\n </div>\n <div *ngIf=\"!communicationsInsight?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Engagement</h5>\n <div>\n <ng-template [ngIf]=\"communicationEngagement\">\n <plotly-plot [data]=\"communicationEngagement?.data\"\n [layout]=\"communicationEngagement?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!communicationEngagement\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.CommunicationsMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [".actions-column{min-width:170px}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}\n"] }]
4058
4033
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i0.ChangeDetectorRef }] });
4059
4034
 
4060
4035
  class SmartCrmCommunicationViewDetailsComponent extends AppBaseComponent {
@@ -4100,11 +4075,11 @@ class SmartCrmCommunicationViewDetailsComponent extends AppBaseComponent {
4100
4075
  super.ngOnDestroy();
4101
4076
  }
4102
4077
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCommunicationViewDetailsComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i2$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
4103
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCommunicationViewDetailsComponent, selector: "pw-smart-crm-communication-view-details", usesInheritance: true, ngImport: i0, template: "\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n<div class=\"container-fluid pw-tab overflow-hidden\" *ngIf=\"communicationDetails && isLoaded\">\n <div class=\"card pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.is_pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.is_sent? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_sent ? 'Sent' : 'Not Sent' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Send At (' + (communicationDetails?.send_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Send Until (' + (communicationDetails?.send_until | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <span><i class=\"fas fa-map-marker-alt\"></i> <span class=\"ms-2\">{{ communicationDetails?.location || 'Not set' }}</span></span>\n </div>\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }] }); }
4078
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmCommunicationViewDetailsComponent, selector: "pw-smart-crm-communication-view-details", usesInheritance: true, ngImport: i0, template: "\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n<div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden\" *ngIf=\"communicationDetails && isLoaded\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.is_pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.is_sent? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_sent ? 'Sent' : 'Not Sent' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Send At (' + (communicationDetails?.send_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Send Until (' + (communicationDetails?.send_until | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <span><i class=\"fas fa-map-marker-alt\"></i> <span class=\"ms-2\">{{ communicationDetails?.location || 'Not set' }}</span></span>\n </div>\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.ql-container{resize:none!important}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }] }); }
4104
4079
  }
4105
4080
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmCommunicationViewDetailsComponent, decorators: [{
4106
4081
  type: Component,
4107
- args: [{ selector: 'pw-smart-crm-communication-view-details', template: "\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n<div class=\"container-fluid pw-tab overflow-hidden\" *ngIf=\"communicationDetails && isLoaded\">\n <div class=\"card pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.is_pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.is_sent? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_sent ? 'Sent' : 'Not Sent' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Send At (' + (communicationDetails?.send_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Send Until (' + (communicationDetails?.send_until | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <span><i class=\"fas fa-map-marker-alt\"></i> <span class=\"ms-2\">{{ communicationDetails?.location || 'Not set' }}</span></span>\n </div>\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"] }]
4082
+ args: [{ selector: 'pw-smart-crm-communication-view-details', template: "\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n<div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden\" *ngIf=\"communicationDetails && isLoaded\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.is_pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.is_sent? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.is_sent ? 'Sent' : 'Not Sent' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Send At (' + (communicationDetails?.send_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Send Until (' + (communicationDetails?.send_until | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <span><i class=\"fas fa-map-marker-alt\"></i> <span class=\"ms-2\">{{ communicationDetails?.location || 'Not set' }}</span></span>\n </div>\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.ql-container{resize:none!important}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"] }]
4108
4083
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i2$3.DomSanitizer }] });
4109
4084
 
4110
4085
  class SmartCrmMarketingViewComponent extends AppBaseComponent {
@@ -4324,11 +4299,11 @@ class SmartCrmBoardComponent extends AppBaseComponent {
4324
4299
  super.ngOnDestroy();
4325
4300
  }
4326
4301
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmBoardComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
4327
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmBoardComponent, selector: "pw-smart-crm-board", usesInheritance: true, ngImport: i0, template: "<div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n </ng-template>\n</div>\n\n<div class=\"row mb-4\" *ngIf=\"isLoaded\">\n <div class=\"col-12 col-sm-4\">\n <select class=\"form-select\" (change)=\"onChangeCategory($event.target.value)\">\n <option *ngFor=\"let option of categories\" [value]=\"option.id\">{{ option.name }}</option>\n </select>\n </div>\n <div class=\"col-12 col-sm-8 mt-2 mt-sm-0 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n</div>\n<div *ngIf=\"isLoaded && !hasOpportunities()\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<div *ngIf=\"isLoaded && hasOpportunities()\" class=\"list-container d-flex\" cdkDropList [cdkDropListData]=\"opportunitiesGroup\" (cdkDropListDropped)=\"dropGroup($event)\">\n <div cdkDropListGroup class=\"opportunities-container main-div crm-board-primary\" [class.dynamic-columns-wrapper]=\"group.stage.collapsed\" [style.--border-color]=\"group.stage.color_code\" *ngFor=\"let group of opportunitiesGroup; let i = index\" cdkDrag [cdkDragData]=\"group\">\n <div class=\"opportunities-board-title d-flex align-items-center py-1\">\n <span class=\"collapse-column-toggle\">\n <i class=\"fas\" [ngClass]=\"{'fa-angle-right': !group.stage.collapsed, 'fa-angle-down': group.stage.collapsed}\" (click)=\"toggleColumn($event, group)\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"stage-name mb-0 py-2 ps-4\">\n <span class=\"badge rounded-pill text-white px-3\" [style.--background-color]=\"group.stage.color_code\">{{ group.stage.name }}</span>\n </p>\n <span class=\"ms-auto me-4 add-opportunity-icon\">\n <a class=\"text-secondary\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\" [queryParams]=\"{ stage_id: group?.stage?.id, category: group.stage.crm_opportunity_category_ids }\"><i class=\"fa fa-plus-square\" aria-hidden=\"true\"></i></a>\n </span>\n </div>\n <div class=\"opportunities-list items-container\" cdkDropList [id]=\"group.stage.name\" [cdkDropListData]=\"group.opportunities\" (cdkDropListDropped)=\"dropItem($event)\" [cdkDropListConnectedTo]=\"getConnectedList()\" (scroll)=\"onColumnScroll(i)\">\n <div *ngFor=\"let item of group.opportunities; let idx = index\">\n <div class=\"opportunities-box mb-3\" cdkDrag [cdkDragData]=\"item\">\n <span ngbTooltip=\"Edit\" class=\"float-end edit-button\" [routerLink]=\"['/' + subscription?.slug + routers.opportunities, item.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"fw-bold mb-1\">{{ item.title }}</p>\n <a class=\"mb-1\" [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, item?.crm_account_id ]\">{{ item?.crm_account?.name }}</a>\n <p class=\"mb-1\">{{ (item?.one_time_amount / 100 | currency) }} One-time / {{ (item?.monthly_amount / 100 | currency) }} MRR</p>\n <a *ngIf=\"item?.owner[0]?.user_avatar\" [routerLink]=\"['/members', item?.owner[0]?.slug]\">\n <img alt=\"member image\" [src]=\"item?.owner[0]?.user_avatar[0]?.url\" [width]=\"'30'\" class=\"squared_logo float-end\" [height]=\"'30'\" onerror=\"this.onerror=null;this.src='assets/img/icons/male.png';\" />\n </a>\n <p class=\"mb-1\">{{ item.starting_at | dateFormat }}</p>\n <p class=\"mb-1 badge bg-warning\">{{ item?.crm_opportunity_stage?.name }}</p>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"(idx + 1) % 5 === 0 && group.isLoadingMore\">\n <div class=\"custom-loader\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n <div class=\"loading-text\">Loading opportunities...</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"footer footer-list\">\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total One-Time:</span>\n <span class=\"footer-value\">{{ group.totals.oneTime / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total MRR:</span>\n <span class=\"footer-value\">{{ group.totals.mrr / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total Count:</span>\n <span class=\"footer-value\">{{ group.totals.count }}</span>\n </div>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.card{box-shadow:2px 3px gray;padding-bottom:0}.main-div{border:1px solid rgb(175,175,175);border-radius:5px;margin-right:10px}.opportunities-board-title{background-color:#fafafa}.opportunities-board-title h4{color:#fff}.edit-button{cursor:pointer}.items-container{height:500px;overflow-y:scroll}.list-container{overflow:auto;width:100%}.opportunities-container{display:inline-block;margin:0 13px 13px 0;max-width:80%;min-width:280px;vertical-align:top}.opportunities-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:450px}.footer-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:10px}.opportunities-box{align-items:center;background:#fff;border:solid 1px rgb(204,204,204);box-sizing:border-box;color:#000000de;cursor:move;display:block;flex-direction:row;font-size:14px;justify-content:space-between;margin:5px;padding:10px 20px}.cdk-drag-preview{border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;box-sizing:border-box}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.opportunities-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.footer-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.add-opportunity-icon{color:#fff;font-size:16px}.collapse-column-toggle{background:#e6dfdf;border-radius:2px;cursor:pointer;font-size:16px;margin-left:10px}.collapse-column-toggle i{padding:0 8px}.dynamic-columns-wrapper{min-width:50px;width:50px!important}.dynamic-columns-wrapper .opportunities-list,.dynamic-columns-wrapper .footer-list{display:none}.dynamic-columns-wrapper .opportunities-board-title{flex-direction:column;height:100%;min-height:450px}.dynamic-columns-wrapper .opportunities-board-title .collapse-column-toggle{margin-left:0}.dynamic-columns-wrapper .opportunities-board-title .stage-name{padding-left:0!important;writing-mode:vertical-lr}.dynamic-columns-wrapper .opportunities-board-title .stage-name .badge{padding:8px 4px!important}.dynamic-columns-wrapper .opportunities-board-title .add-opportunity-icon{margin:0 auto!important}.crm-board-success{border-top:3px solid rgb(69,210,146)}.crm-board-success .stage-name .badge{background-color:#45d292}.crm-board-info{border-top:3px solid rgb(28,188,216)}.crm-board-info .stage-name .badge{background-color:#1cbcd8}.crm-board-danger{border-top:3px solid rgb(255,88,107)}.crm-board-danger .stage-name .badge{background-color:#ff586b}.crm-board-warning{border-top:3px solid rgb(251,171,0)}.crm-board-warning .stage-name .badge{background-color:#fbab00}.footer{background-color:#f8f9fa;padding:10px;display:flex;justify-content:space-between;flex-direction:row;align-items:center;border-radius:8px}.footer-item{display:flex;flex-direction:column;align-items:center}.footer-label{font-weight:700;color:#6c757d}.footer-value{color:#212529;font-size:1.1em}.crm-board-primary{border-top:3px solid var(--border-color, var(--tabs_bg))}.crm-board-primary .stage-name .badge{background-color:var(--background-color, var(--tabs_bg))}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i8$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i8$3.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i8$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
4302
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmBoardComponent, selector: "pw-smart-crm-board", usesInheritance: true, ngImport: i0, template: "<div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n </ng-template>\n</div>\n\n<div class=\"row mb-4\" *ngIf=\"isLoaded\">\n <div class=\"col-12 col-sm-4\">\n <select class=\"form-select\" (change)=\"onChangeCategory($event.target.value)\">\n <option *ngFor=\"let option of categories\" [value]=\"option.id\">{{ option.name }}</option>\n </select>\n </div>\n <div class=\"col-12 col-sm-8 mt-2 mt-sm-0 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n</div>\n<div *ngIf=\"isLoaded && !hasOpportunities()\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<div *ngIf=\"isLoaded && hasOpportunities()\" class=\"list-container d-flex\" cdkDropList [cdkDropListData]=\"opportunitiesGroup\" (cdkDropListDropped)=\"dropGroup($event)\">\n <div cdkDropListGroup class=\"opportunities-container main-div crm-board-primary\" [class.dynamic-columns-wrapper]=\"group.stage.collapsed\" [style.--border-color]=\"group.stage.color_code\" *ngFor=\"let group of opportunitiesGroup; let i = index\" cdkDrag [cdkDragData]=\"group\">\n <div class=\"opportunities-board-title d-flex align-items-center py-1\">\n <span class=\"collapse-column-toggle\">\n <i class=\"fas\" [ngClass]=\"{'fa-angle-right': !group.stage.collapsed, 'fa-angle-down': group.stage.collapsed}\" (click)=\"toggleColumn($event, group)\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"stage-name mb-0 py-2 ps-4\">\n <span class=\"badge rounded-pill text-white px-3\" [style.--background-color]=\"group.stage.color_code\">{{ group.stage.name }}</span>\n </p>\n <span class=\"ms-auto me-4 add-opportunity-icon\">\n <a class=\"text-secondary\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\" [queryParams]=\"{ stage_id: group?.stage?.id, category: group.stage.crm_opportunity_category_ids }\"><i class=\"fa fa-plus-square\" aria-hidden=\"true\"></i></a>\n </span>\n </div>\n <div class=\"opportunities-list items-container\" cdkDropList [id]=\"group.stage.name\" [cdkDropListData]=\"group.opportunities\" (cdkDropListDropped)=\"dropItem($event)\" [cdkDropListConnectedTo]=\"getConnectedList()\" (scroll)=\"onColumnScroll(i)\">\n <div *ngFor=\"let item of group.opportunities; let idx = index\">\n <div class=\"opportunities-box mb-3\" cdkDrag [cdkDragData]=\"item\">\n <span ngbTooltip=\"Edit\" class=\"float-end edit-button\" [routerLink]=\"['/' + subscription?.slug + routers.opportunities, item.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"fw-bold mb-1\">{{ item.title }}</p>\n <a class=\"mb-1\" [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, item?.crm_account_id ]\">{{ item?.crm_account?.name }}</a>\n <p class=\"mb-1\">{{ (item?.one_time_amount / 100 | currency) }} One-time / {{ (item?.monthly_amount / 100 | currency) }} MRR</p>\n <a *ngIf=\"item?.owner[0]?.user_avatar\" [routerLink]=\"['/members', item?.owner[0]?.slug]\">\n <img alt=\"member image\" [src]=\"item?.owner[0]?.user_avatar[0]?.url\" [width]=\"'30'\" class=\"squared_logo float-end\" [height]=\"'30'\" onerror=\"this.onerror=null;this.src='assets/img/icons/male.png';\" />\n </a>\n <p class=\"mb-1\">{{ item.starting_at | dateFormat }}</p>\n <p class=\"mb-1 badge bg-warning\">{{ item?.crm_opportunity_stage?.name }}</p>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"(idx + 1) % 5 === 0 && group.isLoadingMore\">\n <div class=\"custom-loader\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n <div class=\"loading-text\">Loading opportunities...</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"footer footer-list\">\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total One-Time:</span>\n <span class=\"footer-value\">{{ group.totals.oneTime / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total MRR:</span>\n <span class=\"footer-value\">{{ group.totals.mrr / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total Count:</span>\n <span class=\"footer-value\">{{ group.totals.count }}</span>\n </div>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.card{box-shadow:2px 3px gray;padding-bottom:0}.main-div{border:1px solid rgb(175,175,175);border-radius:5px;margin-right:10px}.opportunities-board-title{background-color:#fafafa}.opportunities-board-title h4{color:#fff}.edit-button{cursor:pointer}.items-container{height:500px;overflow-y:scroll}.list-container{overflow:auto;width:100%}.opportunities-container{display:inline-block;margin:0 13px 13px 0;max-width:300px;min-width:300px;vertical-align:top}.opportunities-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:450px}.footer-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:10px}.opportunities-box{align-items:center;background:#fff;border:solid 1px rgb(204,204,204);box-sizing:border-box;color:#000000de;cursor:move;display:block;flex-direction:row;font-size:14px;justify-content:space-between;margin:5px;padding:10px 20px}.cdk-drag-preview{border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;box-sizing:border-box}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.opportunities-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.footer-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.add-opportunity-icon{color:#fff;font-size:16px}.collapse-column-toggle{background:#e6dfdf;border-radius:2px;cursor:pointer;font-size:16px;margin-left:10px}.collapse-column-toggle i{padding:0 8px}.dynamic-columns-wrapper{min-width:50px;width:50px!important}.dynamic-columns-wrapper .opportunities-list,.dynamic-columns-wrapper .footer-list{display:none}.dynamic-columns-wrapper .opportunities-board-title{flex-direction:column;height:100%;min-height:450px}.dynamic-columns-wrapper .opportunities-board-title .collapse-column-toggle{margin-left:0}.dynamic-columns-wrapper .opportunities-board-title .stage-name{padding-left:0!important;writing-mode:vertical-lr}.dynamic-columns-wrapper .opportunities-board-title .stage-name .badge{padding:8px 4px!important}.dynamic-columns-wrapper .opportunities-board-title .add-opportunity-icon{margin:0 auto!important}.crm-board-success{border-top:3px solid rgb(69,210,146)}.crm-board-success .stage-name .badge{background-color:#45d292}.crm-board-info{border-top:3px solid rgb(28,188,216)}.crm-board-info .stage-name .badge{background-color:#1cbcd8}.crm-board-danger{border-top:3px solid rgb(255,88,107)}.crm-board-danger .stage-name .badge{background-color:#ff586b}.crm-board-warning{border-top:3px solid rgb(251,171,0)}.crm-board-warning .stage-name .badge{background-color:#fbab00}.footer{background-color:#f8f9fa;padding:10px;display:flex;justify-content:space-between;flex-direction:row;align-items:center;border-radius:8px}.footer-item{display:flex;flex-direction:column;align-items:center}.footer-label{font-weight:700;color:#6c757d}.footer-value{color:#212529;font-size:1.1em}.crm-board-primary{border-top:3px solid var(--border-color, var(--tabs_bg))}.crm-board-primary .stage-name .badge{background-color:var(--background-color, var(--tabs_bg))}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i8$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i8$3.CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "directive", type: i8$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
4328
4303
  }
4329
4304
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmBoardComponent, decorators: [{
4330
4305
  type: Component,
4331
- args: [{ selector: 'pw-smart-crm-board', template: "<div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n </ng-template>\n</div>\n\n<div class=\"row mb-4\" *ngIf=\"isLoaded\">\n <div class=\"col-12 col-sm-4\">\n <select class=\"form-select\" (change)=\"onChangeCategory($event.target.value)\">\n <option *ngFor=\"let option of categories\" [value]=\"option.id\">{{ option.name }}</option>\n </select>\n </div>\n <div class=\"col-12 col-sm-8 mt-2 mt-sm-0 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n</div>\n<div *ngIf=\"isLoaded && !hasOpportunities()\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<div *ngIf=\"isLoaded && hasOpportunities()\" class=\"list-container d-flex\" cdkDropList [cdkDropListData]=\"opportunitiesGroup\" (cdkDropListDropped)=\"dropGroup($event)\">\n <div cdkDropListGroup class=\"opportunities-container main-div crm-board-primary\" [class.dynamic-columns-wrapper]=\"group.stage.collapsed\" [style.--border-color]=\"group.stage.color_code\" *ngFor=\"let group of opportunitiesGroup; let i = index\" cdkDrag [cdkDragData]=\"group\">\n <div class=\"opportunities-board-title d-flex align-items-center py-1\">\n <span class=\"collapse-column-toggle\">\n <i class=\"fas\" [ngClass]=\"{'fa-angle-right': !group.stage.collapsed, 'fa-angle-down': group.stage.collapsed}\" (click)=\"toggleColumn($event, group)\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"stage-name mb-0 py-2 ps-4\">\n <span class=\"badge rounded-pill text-white px-3\" [style.--background-color]=\"group.stage.color_code\">{{ group.stage.name }}</span>\n </p>\n <span class=\"ms-auto me-4 add-opportunity-icon\">\n <a class=\"text-secondary\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\" [queryParams]=\"{ stage_id: group?.stage?.id, category: group.stage.crm_opportunity_category_ids }\"><i class=\"fa fa-plus-square\" aria-hidden=\"true\"></i></a>\n </span>\n </div>\n <div class=\"opportunities-list items-container\" cdkDropList [id]=\"group.stage.name\" [cdkDropListData]=\"group.opportunities\" (cdkDropListDropped)=\"dropItem($event)\" [cdkDropListConnectedTo]=\"getConnectedList()\" (scroll)=\"onColumnScroll(i)\">\n <div *ngFor=\"let item of group.opportunities; let idx = index\">\n <div class=\"opportunities-box mb-3\" cdkDrag [cdkDragData]=\"item\">\n <span ngbTooltip=\"Edit\" class=\"float-end edit-button\" [routerLink]=\"['/' + subscription?.slug + routers.opportunities, item.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"fw-bold mb-1\">{{ item.title }}</p>\n <a class=\"mb-1\" [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, item?.crm_account_id ]\">{{ item?.crm_account?.name }}</a>\n <p class=\"mb-1\">{{ (item?.one_time_amount / 100 | currency) }} One-time / {{ (item?.monthly_amount / 100 | currency) }} MRR</p>\n <a *ngIf=\"item?.owner[0]?.user_avatar\" [routerLink]=\"['/members', item?.owner[0]?.slug]\">\n <img alt=\"member image\" [src]=\"item?.owner[0]?.user_avatar[0]?.url\" [width]=\"'30'\" class=\"squared_logo float-end\" [height]=\"'30'\" onerror=\"this.onerror=null;this.src='assets/img/icons/male.png';\" />\n </a>\n <p class=\"mb-1\">{{ item.starting_at | dateFormat }}</p>\n <p class=\"mb-1 badge bg-warning\">{{ item?.crm_opportunity_stage?.name }}</p>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"(idx + 1) % 5 === 0 && group.isLoadingMore\">\n <div class=\"custom-loader\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n <div class=\"loading-text\">Loading opportunities...</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"footer footer-list\">\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total One-Time:</span>\n <span class=\"footer-value\">{{ group.totals.oneTime / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total MRR:</span>\n <span class=\"footer-value\">{{ group.totals.mrr / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total Count:</span>\n <span class=\"footer-value\">{{ group.totals.count }}</span>\n </div>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.card{box-shadow:2px 3px gray;padding-bottom:0}.main-div{border:1px solid rgb(175,175,175);border-radius:5px;margin-right:10px}.opportunities-board-title{background-color:#fafafa}.opportunities-board-title h4{color:#fff}.edit-button{cursor:pointer}.items-container{height:500px;overflow-y:scroll}.list-container{overflow:auto;width:100%}.opportunities-container{display:inline-block;margin:0 13px 13px 0;max-width:80%;min-width:280px;vertical-align:top}.opportunities-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:450px}.footer-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:10px}.opportunities-box{align-items:center;background:#fff;border:solid 1px rgb(204,204,204);box-sizing:border-box;color:#000000de;cursor:move;display:block;flex-direction:row;font-size:14px;justify-content:space-between;margin:5px;padding:10px 20px}.cdk-drag-preview{border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;box-sizing:border-box}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.opportunities-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.footer-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.add-opportunity-icon{color:#fff;font-size:16px}.collapse-column-toggle{background:#e6dfdf;border-radius:2px;cursor:pointer;font-size:16px;margin-left:10px}.collapse-column-toggle i{padding:0 8px}.dynamic-columns-wrapper{min-width:50px;width:50px!important}.dynamic-columns-wrapper .opportunities-list,.dynamic-columns-wrapper .footer-list{display:none}.dynamic-columns-wrapper .opportunities-board-title{flex-direction:column;height:100%;min-height:450px}.dynamic-columns-wrapper .opportunities-board-title .collapse-column-toggle{margin-left:0}.dynamic-columns-wrapper .opportunities-board-title .stage-name{padding-left:0!important;writing-mode:vertical-lr}.dynamic-columns-wrapper .opportunities-board-title .stage-name .badge{padding:8px 4px!important}.dynamic-columns-wrapper .opportunities-board-title .add-opportunity-icon{margin:0 auto!important}.crm-board-success{border-top:3px solid rgb(69,210,146)}.crm-board-success .stage-name .badge{background-color:#45d292}.crm-board-info{border-top:3px solid rgb(28,188,216)}.crm-board-info .stage-name .badge{background-color:#1cbcd8}.crm-board-danger{border-top:3px solid rgb(255,88,107)}.crm-board-danger .stage-name .badge{background-color:#ff586b}.crm-board-warning{border-top:3px solid rgb(251,171,0)}.crm-board-warning .stage-name .badge{background-color:#fbab00}.footer{background-color:#f8f9fa;padding:10px;display:flex;justify-content:space-between;flex-direction:row;align-items:center;border-radius:8px}.footer-item{display:flex;flex-direction:column;align-items:center}.footer-label{font-weight:700;color:#6c757d}.footer-value{color:#212529;font-size:1.1em}.crm-board-primary{border-top:3px solid var(--border-color, var(--tabs_bg))}.crm-board-primary .stage-name .badge{background-color:var(--background-color, var(--tabs_bg))}\n"] }]
4306
+ args: [{ selector: 'pw-smart-crm-board', template: "<div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n </ng-template>\n</div>\n\n<div class=\"row mb-4\" *ngIf=\"isLoaded\">\n <div class=\"col-12 col-sm-4\">\n <select class=\"form-select\" (change)=\"onChangeCategory($event.target.value)\">\n <option *ngFor=\"let option of categories\" [value]=\"option.id\">{{ option.name }}</option>\n </select>\n </div>\n <div class=\"col-12 col-sm-8 mt-2 mt-sm-0 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n</div>\n<div *ngIf=\"isLoaded && !hasOpportunities()\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<div *ngIf=\"isLoaded && hasOpportunities()\" class=\"list-container d-flex\" cdkDropList [cdkDropListData]=\"opportunitiesGroup\" (cdkDropListDropped)=\"dropGroup($event)\">\n <div cdkDropListGroup class=\"opportunities-container main-div crm-board-primary\" [class.dynamic-columns-wrapper]=\"group.stage.collapsed\" [style.--border-color]=\"group.stage.color_code\" *ngFor=\"let group of opportunitiesGroup; let i = index\" cdkDrag [cdkDragData]=\"group\">\n <div class=\"opportunities-board-title d-flex align-items-center py-1\">\n <span class=\"collapse-column-toggle\">\n <i class=\"fas\" [ngClass]=\"{'fa-angle-right': !group.stage.collapsed, 'fa-angle-down': group.stage.collapsed}\" (click)=\"toggleColumn($event, group)\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"stage-name mb-0 py-2 ps-4\">\n <span class=\"badge rounded-pill text-white px-3\" [style.--background-color]=\"group.stage.color_code\">{{ group.stage.name }}</span>\n </p>\n <span class=\"ms-auto me-4 add-opportunity-icon\">\n <a class=\"text-secondary\" [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\" [queryParams]=\"{ stage_id: group?.stage?.id, category: group.stage.crm_opportunity_category_ids }\"><i class=\"fa fa-plus-square\" aria-hidden=\"true\"></i></a>\n </span>\n </div>\n <div class=\"opportunities-list items-container\" cdkDropList [id]=\"group.stage.name\" [cdkDropListData]=\"group.opportunities\" (cdkDropListDropped)=\"dropItem($event)\" [cdkDropListConnectedTo]=\"getConnectedList()\" (scroll)=\"onColumnScroll(i)\">\n <div *ngFor=\"let item of group.opportunities; let idx = index\">\n <div class=\"opportunities-box mb-3\" cdkDrag [cdkDragData]=\"item\">\n <span ngbTooltip=\"Edit\" class=\"float-end edit-button\" [routerLink]=\"['/' + subscription?.slug + routers.opportunities, item.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </span>\n <p class=\"fw-bold mb-1\">{{ item.title }}</p>\n <a class=\"mb-1\" [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, item?.crm_account_id ]\">{{ item?.crm_account?.name }}</a>\n <p class=\"mb-1\">{{ (item?.one_time_amount / 100 | currency) }} One-time / {{ (item?.monthly_amount / 100 | currency) }} MRR</p>\n <a *ngIf=\"item?.owner[0]?.user_avatar\" [routerLink]=\"['/members', item?.owner[0]?.slug]\">\n <img alt=\"member image\" [src]=\"item?.owner[0]?.user_avatar[0]?.url\" [width]=\"'30'\" class=\"squared_logo float-end\" [height]=\"'30'\" onerror=\"this.onerror=null;this.src='assets/img/icons/male.png';\" />\n </a>\n <p class=\"mb-1\">{{ item.starting_at | dateFormat }}</p>\n <p class=\"mb-1 badge bg-warning\">{{ item?.crm_opportunity_stage?.name }}</p>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"(idx + 1) % 5 === 0 && group.isLoadingMore\">\n <div class=\"custom-loader\">\n <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n <div class=\"loading-text\">Loading opportunities...</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"footer footer-list\">\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total One-Time:</span>\n <span class=\"footer-value\">{{ group.totals.oneTime / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total MRR:</span>\n <span class=\"footer-value\">{{ group.totals.mrr / 100 | currency }}</span>\n </div>\n <div class=\"footer-item\">\n <span class=\"footer-label\">Total Count:</span>\n <span class=\"footer-value\">{{ group.totals.count }}</span>\n </div>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.card{box-shadow:2px 3px gray;padding-bottom:0}.main-div{border:1px solid rgb(175,175,175);border-radius:5px;margin-right:10px}.opportunities-board-title{background-color:#fafafa}.opportunities-board-title h4{color:#fff}.edit-button{cursor:pointer}.items-container{height:500px;overflow-y:scroll}.list-container{overflow:auto;width:100%}.opportunities-container{display:inline-block;margin:0 13px 13px 0;max-width:300px;min-width:300px;vertical-align:top}.opportunities-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:450px}.footer-list{background:#fff;border:solid 1px rgb(204,204,204);display:block;min-height:10px}.opportunities-box{align-items:center;background:#fff;border:solid 1px rgb(204,204,204);box-sizing:border-box;color:#000000de;cursor:move;display:block;flex-direction:row;font-size:14px;justify-content:space-between;margin:5px;padding:10px 20px}.cdk-drag-preview{border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;box-sizing:border-box}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.opportunities-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.footer-list.cdk-drop-list-dragging .opportunities-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.add-opportunity-icon{color:#fff;font-size:16px}.collapse-column-toggle{background:#e6dfdf;border-radius:2px;cursor:pointer;font-size:16px;margin-left:10px}.collapse-column-toggle i{padding:0 8px}.dynamic-columns-wrapper{min-width:50px;width:50px!important}.dynamic-columns-wrapper .opportunities-list,.dynamic-columns-wrapper .footer-list{display:none}.dynamic-columns-wrapper .opportunities-board-title{flex-direction:column;height:100%;min-height:450px}.dynamic-columns-wrapper .opportunities-board-title .collapse-column-toggle{margin-left:0}.dynamic-columns-wrapper .opportunities-board-title .stage-name{padding-left:0!important;writing-mode:vertical-lr}.dynamic-columns-wrapper .opportunities-board-title .stage-name .badge{padding:8px 4px!important}.dynamic-columns-wrapper .opportunities-board-title .add-opportunity-icon{margin:0 auto!important}.crm-board-success{border-top:3px solid rgb(69,210,146)}.crm-board-success .stage-name .badge{background-color:#45d292}.crm-board-info{border-top:3px solid rgb(28,188,216)}.crm-board-info .stage-name .badge{background-color:#1cbcd8}.crm-board-danger{border-top:3px solid rgb(255,88,107)}.crm-board-danger .stage-name .badge{background-color:#ff586b}.crm-board-warning{border-top:3px solid rgb(251,171,0)}.crm-board-warning .stage-name .badge{background-color:#fbab00}.footer{background-color:#f8f9fa;padding:10px;display:flex;justify-content:space-between;flex-direction:row;align-items:center;border-radius:8px}.footer-item{display:flex;flex-direction:column;align-items:center}.footer-label{font-weight:700;color:#6c757d}.footer-value{color:#212529;font-size:1.1em}.crm-board-primary{border-top:3px solid var(--border-color, var(--tabs_bg))}.crm-board-primary .stage-name .badge{background-color:var(--background-color, var(--tabs_bg))}\n"] }]
4332
4307
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }] });
4333
4308
 
4334
4309
  class SmartCrmOpportunitiesDetailsComponent extends AppBaseComponent {
@@ -4675,13 +4650,6 @@ class SmartCrmOpportunitiesInfoComponent extends AppBaseComponent {
4675
4650
  this.aboutControls = AppSmartCrm.getOpportunitiesForm();
4676
4651
  }
4677
4652
  ngOnInit() {
4678
- this.route.params.subscribe(data => {
4679
- this.opportunitiesId = Number(data['id']);
4680
- if (this.opportunitiesId) {
4681
- this.getOpportunityDetails();
4682
- this.actionControls.get('crm_opportunity_id').setValue(this.opportunitiesId);
4683
- }
4684
- });
4685
4653
  this.getUserSubscription().subscribe(response => {
4686
4654
  this.subscription = response;
4687
4655
  if (this.subscription?.id) {
@@ -4689,6 +4657,13 @@ class SmartCrmOpportunitiesInfoComponent extends AppBaseComponent {
4689
4657
  this.getOpportunitiesComments();
4690
4658
  }
4691
4659
  });
4660
+ this.route.params.subscribe(data => {
4661
+ this.opportunitiesId = Number(data['id']);
4662
+ if (this.opportunitiesId) {
4663
+ this.getOpportunityDetails();
4664
+ this.actionControls.get('crm_opportunity_id').setValue(this.opportunitiesId);
4665
+ }
4666
+ });
4692
4667
  this.onDateSelected();
4693
4668
  this.getContactVersion();
4694
4669
  this.userInfo();
@@ -4704,8 +4679,9 @@ class SmartCrmOpportunitiesInfoComponent extends AppBaseComponent {
4704
4679
  }
4705
4680
  /** Function to get opportunities details */
4706
4681
  getOpportunityDetails() {
4682
+ console.log(this.subscription);
4707
4683
  this.crmService
4708
- .getOpportunityDetails(this.subscriptionId, this.opportunitiesId)
4684
+ .getOpportunityDetails(this.subscription?.id, this.opportunitiesId)
4709
4685
  .subscribe(response => {
4710
4686
  if (response) {
4711
4687
  if (response.crm_contact_id) {
@@ -4718,6 +4694,7 @@ class SmartCrmOpportunitiesInfoComponent extends AppBaseComponent {
4718
4694
  this.data.one_time_amount = this.data.one_time_amount / 100;
4719
4695
  this.contactId = response.crm_contact_id;
4720
4696
  this.accountId = response.crm_account_id;
4697
+ console.log(response);
4721
4698
  this.aboutControls.patchValue(response);
4722
4699
  this.aboutControls.get('crm_contact_id').patchValue(response.crm_contact);
4723
4700
  this.aboutControls.get('crm_account_id').patchValue(response.crm_account);
@@ -4733,12 +4710,17 @@ class SmartCrmOpportunitiesInfoComponent extends AppBaseComponent {
4733
4710
  }
4734
4711
  else {
4735
4712
  const formData = this.aboutControls;
4736
- formData.get('crm_account_id').setValue(formData.get('crm_account_id').value?.id);
4737
- formData.get('crm_contact_id').setValue(formData.get('crm_contact_id').value?.id);
4738
- formData.get('one_time_amount').setValue(formData.get('one_time_amount').value * 100);
4739
- formData.get('monthly_amount').setValue(formData.get('monthly_amount').value * 100);
4713
+ const dataObject = {
4714
+ crm_account_id: formData.get('crm_account_id').value?.id,
4715
+ crm_contact_id: formData.get('crm_contact_id').value?.id,
4716
+ one_time_amount: formData.get('one_time_amount').value * 100,
4717
+ monthly_amount: formData.get('monthly_amount').value * 100
4718
+ };
4740
4719
  this.crmService
4741
- .updateOpportunities(this.subscription?.id, this.opportunitiesId, formData.value)
4720
+ .updateOpportunities(this.subscription?.id, this.opportunitiesId, {
4721
+ ...formData.value,
4722
+ ...dataObject
4723
+ })
4742
4724
  .subscribe(() => {
4743
4725
  this.toast.success(this.translation.translate('Crm.OpportunitiesMessage.UpdatedMessage'));
4744
4726
  this.isFormEdit = true;
@@ -5078,7 +5060,7 @@ class SmartCrmOpportunitiesInfoComponent extends AppBaseComponent {
5078
5060
  super.ngOnDestroy();
5079
5061
  }
5080
5062
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmOpportunitiesInfoComponent, deps: [{ token: i0.Injector }, { token: i1.CrmService }, { token: i2$2.NgbModal }, { token: i2.AuthService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
5081
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmOpportunitiesInfoComponent, selector: "pw-smart-crm-opportunities-info", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Opportunity Info\n </h2>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img width=\"100\"\n height=\"100\"\n class=\"rounded-circle img-border width-100\"\n alt=\"user\"\n src=\"assets/img/icons/male.png\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.title }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"\n isFormEdit = !isFormEdit; getAccountsBySubscription(); getAllContacts()\n \">Edit</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.Title' | transloco\n }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\"\n *ngIf=\"data?.crm_contact_id\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Contact' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n data.crm_contact_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_contact_id\">{{ data?.crm_contact?.first_name }} {{ data?.crm_contact?.last_name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_contact_id\"\n [suggestions]=\"filteredContacts\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"onContactSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search contacts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Account' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n data.crm_account_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_account_id\">{{ data?.crm_accounty?.name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_account_id\"\n [suggestions]=\"filteredAccounts\"\n formControlName=\"crm_account_id\"\n dataKey=\"id\"\n field=\"name\"\n [dropdown]=\"true\"\n (completeMethod)=\"accountSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search accounts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }}</label>\n <a class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.one_time_amount\">{{ data?.one_time_amount | currency }}</a>\n <input *ngIf=\"!isFormEdit || !data?.one_time_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"one_time_amount\"\n id=\"one_time_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['one_time_amount'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }}</label>\n <a class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.monthly_amount\">{{ data?.monthly_amount | currency }}</a>\n <input *ngIf=\"!isFormEdit || !data?.monthly_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"monthly_amount\"\n id=\"monthly_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['monthly_amount'].errors }\" />\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getOpportunityDetails()\"\n value=\"Cancel\" />\n <input type=\"button\"\n class=\"btn btn-primary ms-3\"\n value=\"Submit\"\n (click)=\"updateOpportunities()\" />\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onCommentSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionFormControls.crm_action_id.invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2 float-end\"\n >Submit Note</button>\n <a class=\"btn btn-outline-primary mt-2 mb-2 me-0 me-sm-2 float-end\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.OpportunitiesMessage.NoActionsInOpportunitiesInfoMessage'\n | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!opportunitiesComments?.length && isLoaded\"\n class=\"no-actions pt-3\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"opportunitiesComments?.length\"\n id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd }\"\n *ngFor=\"\n let item of opportunitiesComments;\n index as i;\n let odd = odd;\n let even = even\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span>\n </span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <p class=\"float-start mb-0\"\n *ngIf=\"!showFullComment || item.id !== commentId\">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true; commentId = item.id\n \">...show more</a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 && showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <p>\n {{\n item?.owner?.first_name +\n ' ' +\n item?.owner?.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i class=\"fa fa-tasks completed\" aria-hidden=\"true\"></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i class=\"far fa-window-close\" aria-hidden=\"true\"></i>\n </a>\n <div class=\"control-btns mt-3 text-end\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined)\">\n Cancel\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n Submit\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let version of opportunitiesVersioning\">\n <p>\n <strong>Event: </strong>{{ version.event }} | <strong>Author: </strong><a *ngIf=\"version?.author\"\n [routerLink]=\"['/members', version?.author?.slug]\">{{ version?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ version.created_at }}<br />\n <strong>Object: </strong>{{ version.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"opportunitiesVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [contactId]=\"contactId\"\n [accountId]=\"accountId\"\n [opportunityId]=\"opportunitiesId\">\n </pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.show-controls .comment-field,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.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: i3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i5.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i5.NumberDirective, selector: "input[numbersOnly]" }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i2$2.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2$2.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2$2.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2$2.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2$2.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2$2.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2$2.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i8.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i12$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i12$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "component", type: SmartCrmCompanyFilesComponent, selector: "pw-smart-crm-company-files", inputs: ["accountId", "contactId", "opportunityId"] }, { kind: "pipe", type: i2$1.JsonPipe, name: "json" }, { kind: "pipe", type: i2$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5063
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmOpportunitiesInfoComponent, selector: "pw-smart-crm-opportunities-info", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Opportunity Info\n </h2>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img width=\"100\"\n height=\"100\"\n class=\"rounded-circle img-border width-100\"\n alt=\"user\"\n src=\"assets/img/icons/male.png\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.title }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"\n isFormEdit = !isFormEdit; getAccountsBySubscription(); getAllContacts()\n \">Edit</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.Title' | transloco\n }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\"\n *ngIf=\"data?.crm_contact_id\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Contact' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n data.crm_contact_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_contact_id\">{{ data?.crm_contact?.first_name }} {{ data?.crm_contact?.last_name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_contact_id\"\n [suggestions]=\"filteredContacts\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"onContactSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search contacts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Account' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n data.crm_account_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_account_id\">{{ data?.crm_account?.name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_account_id\"\n [suggestions]=\"filteredAccounts\"\n formControlName=\"crm_account_id\"\n dataKey=\"id\"\n field=\"name\"\n [dropdown]=\"true\"\n (completeMethod)=\"accountSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search accounts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }}</label>\n <span class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.one_time_amount\">{{ data?.one_time_amount | currency }}</span>\n <input *ngIf=\"!isFormEdit || !data?.one_time_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"one_time_amount\"\n id=\"one_time_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['one_time_amount'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }}</label>\n <span class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.monthly_amount\">{{ data?.monthly_amount | currency }}</span>\n <input *ngIf=\"!isFormEdit || !data?.monthly_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"monthly_amount\"\n id=\"monthly_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['monthly_amount'].errors }\" />\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getOpportunityDetails()\"\n value=\"Cancel\" />\n <input type=\"button\"\n class=\"btn btn-primary ms-3\"\n value=\"Submit\"\n (click)=\"updateOpportunities()\" />\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onCommentSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionFormControls.crm_action_id.invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2 float-end\"\n >Submit Note</button>\n <a class=\"btn btn-outline-primary mt-2 mb-2 me-0 me-sm-2 float-end\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.OpportunitiesMessage.NoActionsInOpportunitiesInfoMessage'\n | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!opportunitiesComments?.length && isLoaded\"\n class=\"no-actions pt-3\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"opportunitiesComments?.length\"\n id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd }\"\n *ngFor=\"\n let item of opportunitiesComments;\n index as i;\n let odd = odd;\n let even = even\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span>\n </span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <p class=\"float-start mb-0\"\n *ngIf=\"!showFullComment || item.id !== commentId\">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true; commentId = item.id\n \">...show more</a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 && showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <p>\n {{\n item?.owner?.first_name +\n ' ' +\n item?.owner?.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i class=\"fa fa-tasks completed\" aria-hidden=\"true\"></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i class=\"far fa-window-close\" aria-hidden=\"true\"></i>\n </a>\n <div class=\"control-btns mt-3 text-end\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined)\">\n Cancel\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n Submit\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let version of opportunitiesVersioning\">\n <p>\n <strong>Event: </strong>{{ version.event }} | <strong>Author: </strong><a *ngIf=\"version?.author\"\n [routerLink]=\"['/members', version?.author?.slug]\">{{ version?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ version.created_at }}<br />\n <strong>Object: </strong>{{ version.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"opportunitiesVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [contactId]=\"contactId\"\n [accountId]=\"accountId\"\n [opportunityId]=\"opportunitiesId\">\n </pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.action-btn.active{color:#fff!important;background-color:var(--first)}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.show-controls .comment-field,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.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: i3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "directive", type: i5.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i5.NumberDirective, selector: "input[numbersOnly]" }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i2$2.NgbNavContent, selector: "ng-template[ngbNavContent]" }, { kind: "directive", type: i2$2.NgbNav, selector: "[ngbNav]", inputs: ["activeId", "animation", "destroyOnHide", "orientation", "roles", "keyboard"], outputs: ["activeIdChange", "shown", "hidden", "navChange"], exportAs: ["ngbNav"] }, { kind: "directive", type: i2$2.NgbNavItem, selector: "[ngbNavItem]", inputs: ["destroyOnHide", "disabled", "domId", "ngbNavItem"], outputs: ["shown", "hidden"], exportAs: ["ngbNavItem"] }, { kind: "directive", type: i2$2.NgbNavItemRole, selector: "[ngbNavItem]:not(ng-container)" }, { kind: "directive", type: i2$2.NgbNavLink, selector: "a[ngbNavLink]" }, { kind: "directive", type: i2$2.NgbNavLinkBase, selector: "[ngbNavLink]" }, { kind: "component", type: i2$2.NgbNavOutlet, selector: "[ngbNavOutlet]", inputs: ["paneRole", "ngbNavOutlet"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i8.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i12$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i12$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "component", type: SmartCrmCompanyFilesComponent, selector: "pw-smart-crm-company-files", inputs: ["accountId", "contactId", "opportunityId"] }, { kind: "pipe", type: i2$1.JsonPipe, name: "json" }, { kind: "pipe", type: i2$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i14.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5082
5064
  }
5083
5065
  __decorate([
5084
5066
  ValidateForm('actionControls'),
@@ -5088,7 +5070,7 @@ __decorate([
5088
5070
  ], SmartCrmOpportunitiesInfoComponent.prototype, "onCommentSave", null);
5089
5071
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmOpportunitiesInfoComponent, decorators: [{
5090
5072
  type: Component,
5091
- args: [{ selector: 'pw-smart-crm-opportunities-info', template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Opportunity Info\n </h2>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img width=\"100\"\n height=\"100\"\n class=\"rounded-circle img-border width-100\"\n alt=\"user\"\n src=\"assets/img/icons/male.png\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.title }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"\n isFormEdit = !isFormEdit; getAccountsBySubscription(); getAllContacts()\n \">Edit</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.Title' | transloco\n }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\"\n *ngIf=\"data?.crm_contact_id\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Contact' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n data.crm_contact_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_contact_id\">{{ data?.crm_contact?.first_name }} {{ data?.crm_contact?.last_name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_contact_id\"\n [suggestions]=\"filteredContacts\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"onContactSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search contacts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Account' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n data.crm_account_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_account_id\">{{ data?.crm_accounty?.name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_account_id\"\n [suggestions]=\"filteredAccounts\"\n formControlName=\"crm_account_id\"\n dataKey=\"id\"\n field=\"name\"\n [dropdown]=\"true\"\n (completeMethod)=\"accountSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search accounts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }}</label>\n <a class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.one_time_amount\">{{ data?.one_time_amount | currency }}</a>\n <input *ngIf=\"!isFormEdit || !data?.one_time_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"one_time_amount\"\n id=\"one_time_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['one_time_amount'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }}</label>\n <a class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.monthly_amount\">{{ data?.monthly_amount | currency }}</a>\n <input *ngIf=\"!isFormEdit || !data?.monthly_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"monthly_amount\"\n id=\"monthly_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['monthly_amount'].errors }\" />\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getOpportunityDetails()\"\n value=\"Cancel\" />\n <input type=\"button\"\n class=\"btn btn-primary ms-3\"\n value=\"Submit\"\n (click)=\"updateOpportunities()\" />\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onCommentSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionFormControls.crm_action_id.invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2 float-end\"\n >Submit Note</button>\n <a class=\"btn btn-outline-primary mt-2 mb-2 me-0 me-sm-2 float-end\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.OpportunitiesMessage.NoActionsInOpportunitiesInfoMessage'\n | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!opportunitiesComments?.length && isLoaded\"\n class=\"no-actions pt-3\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"opportunitiesComments?.length\"\n id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd }\"\n *ngFor=\"\n let item of opportunitiesComments;\n index as i;\n let odd = odd;\n let even = even\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span>\n </span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <p class=\"float-start mb-0\"\n *ngIf=\"!showFullComment || item.id !== commentId\">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true; commentId = item.id\n \">...show more</a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 && showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <p>\n {{\n item?.owner?.first_name +\n ' ' +\n item?.owner?.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i class=\"fa fa-tasks completed\" aria-hidden=\"true\"></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i class=\"far fa-window-close\" aria-hidden=\"true\"></i>\n </a>\n <div class=\"control-btns mt-3 text-end\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined)\">\n Cancel\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n Submit\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let version of opportunitiesVersioning\">\n <p>\n <strong>Event: </strong>{{ version.event }} | <strong>Author: </strong><a *ngIf=\"version?.author\"\n [routerLink]=\"['/members', version?.author?.slug]\">{{ version?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ version.created_at }}<br />\n <strong>Object: </strong>{{ version.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"opportunitiesVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [contactId]=\"contactId\"\n [accountId]=\"accountId\"\n [opportunityId]=\"opportunitiesId\">\n </pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.show-controls .comment-field,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"] }]
5073
+ args: [{ selector: 'pw-smart-crm-opportunities-info', template: "<div class=\"row\">\n <div class=\"col-12 mb-0\">\n <div class=\"me-auto mb-0\">\n <h2 class=\"mb-0\">\n <a href=\"javascript:void(0)\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n Opportunity Info\n </h2>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"user-info p-3 card pb-0 h-auto\">\n <div class=\"mb-2 text-center\">\n <a class=\"profile-image\">\n <img width=\"100\"\n height=\"100\"\n class=\"rounded-circle img-border width-100\"\n alt=\"user\"\n src=\"assets/img/icons/male.png\" />\n </a>\n </div>\n <div class=\"mb-4 d-flex justify-content-between align-items-center\">\n <h4 class=\"d-inline-block\">\n About <span *ngIf=\"data?.id\">{{ data.title }}</span>\n </h4>\n <a href=\"javascript:void(0);\"\n *ngIf=\"isFormEdit\"\n class=\"btn btn-sm btn-outline-primary float-end\"\n (click)=\"\n isFormEdit = !isFormEdit; getAccountsBySubscription(); getAllContacts()\n \">Edit</a>\n </div>\n <form [formGroup]=\"aboutControls\"\n [class.isDisabled]=\"isFormEdit\">\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.Title' | transloco\n }}</label>\n <input type=\"text\"\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\"\n *ngIf=\"data?.crm_contact_id\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Contact' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n data.crm_contact_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_contact_id\">{{ data?.crm_contact?.first_name }} {{ data?.crm_contact?.last_name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_contact_id\"\n [suggestions]=\"filteredContacts\"\n formControlName=\"crm_contact_id\"\n dataKey=\"id\"\n field=\"displayName\"\n [dropdown]=\"true\"\n (completeMethod)=\"onContactSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search contacts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3 ui-fluid skills-modal\">\n <label class=\"label mb-2\">{{\n 'Crm.OpportunitiesMessage.Account' | transloco\n }}</label>\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n data.crm_account_id\n ]\"\n class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.crm_account_id\">{{ data?.crm_account?.name }}</a>\n <p-autoComplete *ngIf=\"!isFormEdit || !data?.crm_account_id\"\n [suggestions]=\"filteredAccounts\"\n formControlName=\"crm_account_id\"\n dataKey=\"id\"\n field=\"name\"\n [dropdown]=\"true\"\n (completeMethod)=\"accountSearch($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search accounts\"\n [multiple]=\"false\">\n </p-autoComplete>\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }}</label>\n <span class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.one_time_amount\">{{ data?.one_time_amount | currency }}</span>\n <input *ngIf=\"!isFormEdit || !data?.one_time_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"one_time_amount\"\n id=\"one_time_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['one_time_amount'].errors }\" />\n </div>\n <div class=\"mb-3\">\n <label class=\"label mb-0\">{{\n 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }}</label>\n <span class=\"form-control d-block pb-2 ps-1 user-value\"\n *ngIf=\"isFormEdit && data?.monthly_amount\">{{ data?.monthly_amount | currency }}</span>\n <input *ngIf=\"!isFormEdit || !data?.monthly_amount\"\n type=\"number\"\n numbersOnly\n class=\"form-control rounded-0 ps-1 user-value\"\n formControlName=\"monthly_amount\"\n id=\"monthly_amount\"\n [ngClass]=\"{ 'is-invalid': submitted && f['monthly_amount'].errors }\" />\n </div>\n <div *ngIf=\"!isFormEdit\"\n class=\"text-end form-action-buttons\">\n <input type=\"button\"\n class=\"btn btn-outline-primary\"\n (click)=\"isFormEdit = !isFormEdit; getOpportunityDetails()\"\n value=\"Cancel\" />\n <input type=\"button\"\n class=\"btn btn-primary ms-3\"\n value=\"Submit\"\n (click)=\"updateOpportunities()\" />\n </div>\n </form>\n </div>\n </div>\n <div class=\"col-12 col-md-8\">\n <ul ngbNav\n #nav=\"ngbNav\"\n class=\"nav-tabs\">\n <li [ngbNavItem]=\"1\">\n <a ngbNavLink>Notes</a>\n <ng-template ngbNavContent>\n <form [formGroup]=\"actionControls\"\n (ngSubmit)=\"onCommentSave()\">\n <textarea class=\"form-control\"\n formControlName=\"comment\"\n rows=\"6\"></textarea>\n <p class=\"text-danger\"\n *ngIf=\"\n actionControls.get('comment').touched &&\n actionControls.get('comment').invalid\n \">\n Note Required\n </p>\n <div *ngIf=\"actions?.length\"\n class=\"d-block clear-both pt-3\">\n <ng-container *ngFor=\"let action of actions; index as i\">\n <button *ngIf=\"action.visible\"\n type=\"button\"\n [class.active]=\"\"\n class=\"btn btn-sm me-2 btn-outline-primary mb-2 action-btn\"\n (click)=\"showDatePicker($event, action.id); d.toggle()\">\n {{ action.name }}\n </button>\n </ng-container>\n <div class=\"text-danger\"\n *ngIf=\"submitAction && actionFormControls.crm_action_id.invalid\">\n Please select an action\n </div>\n <div class=\"row mt-3\">\n <div class=\"col-12 col-sm-4\">\n <div class=\"input-group\">\n <input class=\"form-control\"\n placeholder=\"dd-mmm-yyyy\"\n formControlName=\"when\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (click)=\"d.toggle()\" />\n </div>\n </div>\n <div class=\"col-sm-4 pe-0 completed-toggle\">\n <div class=\"mb-3\">\n <ui-switch checkedLabel=\"completed\"\n uncheckedLabel=\"open\"\n formControlName=\"completed\"\n name=\"completed\">\n </ui-switch>\n </div>\n </div>\n </div>\n </div>\n <div class=\"float-end\">\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonDisable\"\n class=\"btn btn-primary mt-2 mb-2 float-end\"\n >Submit Note</button>\n <a class=\"btn btn-outline-primary mt-2 mb-2 me-0 me-sm-2 float-end\"\n (click)=\"openModal(content)\">{{ 'Upload file' | transloco }}</a>\n </div>\n <div *ngIf=\"buttonDisable\"\n class=\"no-actions pt-4\">\n <pw-no-data [withImage]=\"true\" [message]=\"\n 'Crm.OpportunitiesMessage.NoActionsInOpportunitiesInfoMessage'\n | transloco\n \">\n </pw-no-data>\n </div>\n </form>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"!opportunitiesComments?.length && isLoaded\"\n class=\"no-actions pt-3\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoActionsMessage' | transloco\">\n </pw-no-data>\n </div>\n <div *ngIf=\"opportunitiesComments?.length\"\n id=\"timeline\"\n class=\"pt-3 clear-both timeline-center timeline-wrapper\">\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n </ul>\n <ul class=\"timeline\">\n <li class=\"timeline-line\"></li>\n <li class=\"timeline-item\"\n [ngClass]=\"{ 'mt-5': odd }\"\n *ngFor=\"\n let item of opportunitiesComments;\n index as i;\n let odd = odd;\n let even = even\n \">\n <div class=\"timeline-badge\">\n <span class=\"bg-red bg-lighten-1\">\n <span class=\"timeline-year\">\n <span class=\"d-block date-year\">{{\n item.when | date: 'medium' | slice: 0:3\n }}</span>\n <span>{{ item.year }}</span>\n </span>\n </span>\n </div>\n <div class=\"timeline-card shadow card pb-0 rounded border-grey border-lighten-2 position-static\">\n <div class=\"card-header py-4\">\n <div class=\"mb-0 clearfix\">\n <textarea type=\"text\"\n name=\"comment\"\n class=\"comment-field form-control p-0\"\n [(ngModel)]=\"item.comment\">{{ item.comment }}</textarea>\n <p class=\"float-start mb-0\"\n *ngIf=\"!showFullComment || item.id !== commentId\">\n {{ item.comment | slice: 0:170\n }}<a *ngIf=\"item.comment.length > 170\"\n class=\"text-secondary\"\n (click)=\"\n showFullComment = true; commentId = item.id\n \">...show more</a>\n </p>\n <p class=\"float-start mb-0\"\n *ngIf=\"showFullComment && item.id === commentId\">\n {{ item.comment }}\n <a *ngIf=\"\n item.comment.length > 170 && showFullComment\n \"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn float-end py-0\"\n (click)=\"showEditControls($event)\"\n *ngIf=\"userId === item.owner_id || hasAccess\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <div class=\"card-subtitle text-muted my-0 clearfix\">\n <div class=\"float-start\">\n <span *ngIf=\"!updating || actionId !== item.id\"\n class=\"font-small-3\">\n {{ item.when }}</span>\n <input *ngIf=\"updating && actionId === item.id\"\n placeholder=\"dd-mmm-yyyy\"\n value=\"{{ item.when }}\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, item)\" />\n </div>\n <button type=\" button\"\n class=\"btn btn-sm float-end when-btn py-0\"\n *ngIf=\"userId === item.owner_id || hasAccess\"\n (click)=\"showDatePickerUpdate(item.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </div>\n <p [class.text-danger]=\"!item.color\"\n *ngIf=\"!item.cancelled && !item.completed\"\n class=\"mb-0\">\n {{ item.due }}\n </p>\n <p>\n {{\n item?.owner?.first_name +\n ' ' +\n item?.owner?.last_name\n }}\n </p>\n <span class=\"badge bg-primary\">{{\n item?.crm_action?.name\n }}</span>\n <span *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n class=\"badge bg-success ms-2\">Open</span>\n <a *ngIf=\"\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as completed\"\n class=\"me-3 ms-3\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \">\n <i class=\"fa fa-tasks completed\" aria-hidden=\"true\"></i>\n </a>\n <a *ngIf=\"\n !item.cancelled &&\n !item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(item.id, item)\">\n <i\n class=\"fa fa-times delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n <a *ngIf=\"\n item.completed &&\n (userId === item.owner_id || hasAccess)\n \"\n ngbTooltip=\"Set as UnCompleted\"\n href=\"javascript:void(0);\"\n (click)=\"\n setAsCompletedOrUncompleted(\n item.id,\n item,\n item.completed\n )\n \"\n class=\"ms-2\">\n <i class=\"far fa-window-close\" aria-hidden=\"true\"></i>\n </a>\n <div class=\"control-btns mt-3 text-end\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"showEditControls(undefined)\">\n Cancel\n </button>\n <button class=\"btn btn-sm btn-primary\"\n type=\"button\"\n (click)=\"updateComment(item)\">\n Submit\n </button>\n </div>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"2\">\n <a ngbNavLink>Versioning</a>\n <ng-template ngbNavContent>\n <div *ngFor=\"let version of opportunitiesVersioning\">\n <p>\n <strong>Event: </strong>{{ version.event }} | <strong>Author: </strong><a *ngIf=\"version?.author\"\n [routerLink]=\"['/members', version?.author?.slug]\">{{ version?.author | ifNameNullShowEmail }}</a>\n | <strong>Created at: </strong>{{ version.created_at }}<br />\n <strong>Object: </strong>{{ version.object | json }}\n </p>\n <hr />\n </div>\n <div *ngIf=\"opportunitiesVersioning?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoVersionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </ng-template>\n </li>\n <li [ngbNavItem]=\"3\">\n <a ngbNavLink>Files</a>\n <ng-template ngbNavContent>\n <pw-smart-crm-company-files [contactId]=\"contactId\"\n [accountId]=\"accountId\"\n [opportunityId]=\"opportunitiesId\">\n </pw-smart-crm-company-files>\n </ng-template>\n </li>\n </ul>\n\n <div [ngbNavOutlet]=\"nav\"></div>\n </div>\n</div>\n\n<ng-template #content\n let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'Upload File' | transloco }}</h3>\n <button type=\"button\"\n class=\"btn-close float-end\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss()\">\n\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <div class=\"row p-2\">\n <div class=\"col-12\">\n <div class=\"upload-box\">\n <div class=\"upload-box-content\">\n <div class=\"drop-container\"\n ngFileDrop\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\">\n <p>\n Drag files here or\n <label class=\"upload-button\">\n <input type=\"file\"\n ngFileSelect\n [options]=\"options\"\n (uploadOutput)=\"onUploadOutput($event)\"\n [uploadInput]=\"uploadInput\"\n multiple />\n browse\n </label>\n to upload.\n </p>\n </div>\n <div class=\"upload-item\"\n *ngFor=\"let f of files; let i = index\">\n <div class=\"upload-item-content\">\n <div class=\"filename\">\n <div class=\"filename-left\">\n <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n <span>{{ f.name }}</span>\n </div>\n </div>\n <div class=\"progress-content\">\n <div class=\"progress\">\n <span class=\"bar\"\n [style.width]=\"f?.progress?.data?.percentage + '%'\"\n [class.is-done]=\"f['uploaded']\"></span>\n </div>\n </div>\n <div class=\"progress-text-content\">\n <span class=\"progress-text\"\n [class.is-done]=\"f['uploaded']\">\n <span *ngIf=\"!f['uploaded']\">{{ f.progress?.data?.percentage - 1 }}%\n </span>\n <span *ngIf=\"f['uploaded']\">100 %</span>\n <span *ngIf=\"!f['uploaded']\">Uploading...</span>\n <span *ngIf=\"f['uploaded']\">Done</span>\n </span>\n <span class=\"speed-and-eta-text\"\n *ngIf=\"f.progress?.data?.percentage !== 0 && !f['uploaded']\">\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.user-info .label{color:#777;font-size:14px;text-transform:capitalize}.user-info .user-value{border:0;border-bottom:1px solid rgb(119,119,119)}.user-info .user-value:focus{box-shadow:none}.user-info .user-value.is-invalid{border-color:#ff586b}.action-btn.active{color:#fff!important;background-color:var(--first)}.control-btns{display:none}.comment-field{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:15px;min-height:100px;padding:2px 5px!important}.comment-field:focus{border:1px solid rgb(23,105,225)!important;border-bottom:0;box-shadow:none}p{max-width:85%;white-space:pre-wrap}.show-controls .comment-field,.show-controls .control-btns{display:block}.show-controls p,.show-controls .edit-btn{display:none}select{appearance:none}textarea{resize:none}.clear-both{clear:both}.isDisabled input[type=text],.isDisabled select{pointer-events:none}.timeline-card.card{min-height:auto}@media (max-width: 768px){.completed-toggle{padding-top:10px}}.when-btn:focus{border:0;box-shadow:none}.no-actions{clear:both}.form-action-buttons{margin-bottom:14px;margin-top:15px}\n"] }]
5092
5074
  }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.CrmService }, { type: i2$2.NgbModal }, { type: i2.AuthService }, { type: Document, decorators: [{
5093
5075
  type: Inject,
5094
5076
  args: [DOCUMENT]
@@ -5174,7 +5156,6 @@ class SmartCrmOpportunitiesListComponent extends AppBaseComponent {
5174
5156
  });
5175
5157
  })
5176
5158
  .add(() => {
5177
- this.isLoaded = true;
5178
5159
  this.loading = false;
5179
5160
  });
5180
5161
  }
@@ -5281,11 +5262,11 @@ class SmartCrmOpportunitiesListComponent extends AppBaseComponent {
5281
5262
  super.ngOnDestroy();
5282
5263
  }
5283
5264
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmOpportunitiesListComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i2.ProductService }], target: i0.ɵɵFactoryTarget.Component }); }
5284
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmOpportunitiesListComponent, selector: "pw-smart-crm-opportunities-list", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.crm_opportunities\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n class=\"contact-table\" [totalRecords]=\"data.object_count\" [loading]=\"loading\" filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\" [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <p-multiSelect placeholder=\"Select Stage\" [options]=\"searchStages\" [(ngModel)]=\"filterByStages\"\n (onChange)=\"onSearchOptionChange($event, 'stage')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect placeholder=\"Select Category\" [options]=\"categories\" [(ngModel)]=\"filterByCategories\"\n (onChange)=\"onSearchOptionChange($event, 'category')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- Empty column occupying the same space -->\n <div class=\"col-sm-3 col-6\"></div>\n <div class=\"col-sm-3 col-md-4 col-lg-3 d-flex justify-content-end\">\n <div class=\"d-flex w-100\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search opportunities..\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control search-opportunities-search-input\" />\n </div>\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start text-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"title\"> {{ 'Crm.OpportunitiesMessage.Title' | transloco }} <p-sortIcon\n field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_contact_id\"> {{ 'Crm.OpportunitiesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_account_id\"> {{ 'Crm.OpportunitiesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"one_time_amount\"> {{ 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }} <p-sortIcon field=\"one_time_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"win_chances\"> {{ 'Crm.OpportunitiesMessage.WinChance' | transloco }}\n <p-sortIcon field=\"win_chances\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"monthly_amount\"> {{ 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }} <p-sortIcon field=\"monthly_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_stage_id\"> {{ 'Crm.OpportunitiesMessage.Stage' | transloco\n }} <p-sortIcon field=\"crm_opportunity_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_category_ids\"> {{ 'Crm.OpportunitiesMessage.Categories' |\n transloco }} <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"starting_at\"> {{ 'Crm.OpportunitiesMessage.StartingAt' | transloco }}\n <p-sortIcon field=\"starting_at\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\" scope=\"true\"> {{ 'Label.Actions' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-opportunities>\n <tr>\n <td data-head=\"Title\">\n <a *ngIf=\"\n hasAccess ||\n opportunities?.owner_id === userId ||\n checkPermission('Pages.Product.CRM.Role.Admin')\n \" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunityInfo,\n opportunities.id\n ]\">\n <span>{{ opportunities?.title | textTruncate: 15 }} </span>\n </a>\n <a *ngIf=\"\n !hasAccess &&\n opportunities?.owner_id !== userId &&\n checkPermission('Pages.Product.CRM.Role.Admin')\n \"> {{ opportunities?.title | textTruncate: 15 }} </a>\n </td>\n <td class=\"contactname\" data-head=\"Crm Contact\">\n <a *ngIf=\"opportunities?.crm_contact_id\" [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n opportunities.crm_contact_id.id\n ]\">{{ opportunities.crm_contact?.first_name + ' ' +\n opportunities.crm_contact?.last_name }}</a>\n </td>\n <td data-head=\"Account\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n opportunities.crm_account.id\n ]\">{{ opportunities.crm_account.name }}</a>\n </td>\n <td data-head=\"Amount\"> {{ opportunities.one_time_amount / 100 | currency }} </td>\n <td data-head=\"WinChance\"> {{ opportunities.win_chances / 100 | percent }} <span class=\"text-danger\"\n *ngIf=\"opportunities.cancelled\">!Cancelled!</span>\n </td>\n <td data-head=\"Monthly Amount\"> {{ opportunities.monthly_amount / 100 | currency }} </td>\n <td data-head=\"Stage\">\n <span class=\"badge\" [appDynamicBadge]=\"{\n itemsArray: stages,\n item: opportunities?.crm_opportunity_stage?.name\n }\" color=\"cyan\">{{ opportunities?.crm_opportunity_stage?.name }}</span>\n </td>\n <td data-head=\"Categories\">\n <span *ngFor=\"let category of opportunities?.crm_opportunity_categories\" class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\" color=\"blue-grey\">{{ category?.name\n }}</span>\n </td>\n <td data-head=\"Starting At\"> {{ opportunities.starting_at | dateFormat }} </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess || opportunities?.owner_id === userId\">\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunities,\n opportunities.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(opportunities.id)\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"opportunitiesInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"opportunitiesInsight\" [paginator]=\"opportunitiesInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"opportunitiesInsight.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.OpportunitiesMessage.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.OpportunitiesMessage.Value' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.OpportunitiesMessage.Reason' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-insight>\n <tr>\n <td data-head=\"Title\"> {{ insight.title }} </td>\n <td data-head=\"Value\"> {{ insight.value }} </td>\n <td data-head=\"Reason\"> {{ insight.reason }} </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"opportunitiesInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ opportunitiesInsight.length }}</span>\n </div>\n <div *ngIf=\"opportunitiesInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"opportunitiesGeography\">\n <plotly-plot [data]=\"opportunitiesGeography?.data\" [layout]=\"opportunitiesGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!opportunitiesGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}.search-opportunities-search-input{background-color:#fff!important}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.PercentPipe, name: "percent" }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5265
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmOpportunitiesListComponent, selector: "pw-smart-crm-opportunities-list", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.crm_opportunities\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n class=\"contact-table\" [totalRecords]=\"data.object_count\" [loading]=\"loading\" filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\" [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <p-multiSelect placeholder=\"Select Stage\" [options]=\"searchStages\" [(ngModel)]=\"filterByStages\"\n (onChange)=\"onSearchOptionChange($event, 'stage')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect placeholder=\"Select Category\" [options]=\"categories\" [(ngModel)]=\"filterByCategories\"\n (onChange)=\"onSearchOptionChange($event, 'category')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- Empty column occupying the same space -->\n <div class=\"col-sm-3 col-6\"></div>\n <div class=\"col-sm-3 col-md-4 col-lg-3 d-flex justify-content-end\">\n <div class=\"d-flex w-100\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search opportunities..\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control search-opportunities-search-input\" />\n </div>\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start text-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"title\"> {{ 'Crm.OpportunitiesMessage.Title' | transloco }} <p-sortIcon\n field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_contact_id\"> {{ 'Crm.OpportunitiesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_account_id\"> {{ 'Crm.OpportunitiesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"one_time_amount\"> {{ 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }} <p-sortIcon field=\"one_time_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"win_chances\"> {{ 'Crm.OpportunitiesMessage.WinChance' | transloco }}\n <p-sortIcon field=\"win_chances\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"monthly_amount\"> {{ 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }} <p-sortIcon field=\"monthly_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_stage_id\"> {{ 'Crm.OpportunitiesMessage.Stage' | transloco\n }} <p-sortIcon field=\"crm_opportunity_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_category_ids\"> {{ 'Crm.OpportunitiesMessage.Categories' |\n transloco }} <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"starting_at\"> {{ 'Crm.OpportunitiesMessage.StartingAt' | transloco }}\n <p-sortIcon field=\"starting_at\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\" scope=\"true\"> {{ 'Label.Actions' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-opportunities>\n <tr>\n <td data-head=\"Title\">\n <a [ngbTooltip]=\"opportunities?.title\" *ngIf=\"\n hasAccess ||\n opportunities?.owner_id === userId ||\n checkPermission('Pages.Product.CRM.Role.Admin')\n \" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunityInfo,\n opportunities.id\n ]\">\n <span>{{ opportunities?.title | textTruncate: 15 }} </span>\n </a>\n <a *ngIf=\"\n !hasAccess &&\n opportunities?.owner_id !== userId &&\n checkPermission('Pages.Product.CRM.Role.Admin')\n \"> {{ opportunities?.title | textTruncate: 15 }} </a>\n </td>\n <td class=\"contactname\" data-head=\"Crm Contact\">\n <a *ngIf=\"opportunities?.crm_contact_id\" [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n opportunities.crm_contact_id.id\n ]\">{{ opportunities.crm_contact?.first_name + ' ' +\n opportunities.crm_contact?.last_name }}</a>\n </td>\n <td data-head=\"Account\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n opportunities.crm_account.id\n ]\">{{ opportunities.crm_account.name }}</a>\n </td>\n <td data-head=\"Amount\"> {{ opportunities.one_time_amount / 100 | currency }} </td>\n <td data-head=\"WinChance\"> {{ opportunities.win_chances / 100 | percent }} <span class=\"text-danger\"\n *ngIf=\"opportunities.cancelled\">!Cancelled!</span>\n </td>\n <td data-head=\"Monthly Amount\"> {{ opportunities.monthly_amount / 100 | currency }} </td>\n <td data-head=\"Stage\">\n <span class=\"badge\" [appDynamicBadge]=\"{\n itemsArray: stages,\n item: opportunities?.crm_opportunity_stage?.name\n }\" color=\"cyan\">{{ opportunities?.crm_opportunity_stage?.name }}</span>\n </td>\n <td data-head=\"Categories\">\n <span *ngFor=\"let category of opportunities?.crm_opportunity_categories\" class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\" color=\"blue-grey\">{{ category?.name\n }}</span>\n </td>\n <td data-head=\"Starting At\"> {{ opportunities.starting_at | dateFormat }} </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess || opportunities?.owner_id === userId\">\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunities,\n opportunities.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(opportunities.id)\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"opportunitiesInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"opportunitiesInsight\" [paginator]=\"opportunitiesInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"opportunitiesInsight.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.OpportunitiesMessage.Reason' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-insight>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, insight.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Title\">\n <span\n [ngbTooltip]=\"insight?.title\"\n container=\"body\"\n tooltipClass=\"custom-tooltip\"\n placement=\"bottom\"\n >\n {{ insight?.title | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"Reason\"> {{ insight.reason }} </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"opportunitiesInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ opportunitiesInsight.length }}</span>\n </div>\n <div *ngIf=\"opportunitiesInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"opportunitiesGeography\">\n <plotly-plot [data]=\"opportunitiesGeography?.data\" [layout]=\"opportunitiesGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!opportunitiesGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}.search-opportunities-search-input{background-color:#fff!important}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i5.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: i7.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i10.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i10.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.PercentPipe, name: "percent" }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5285
5266
  }
5286
5267
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmOpportunitiesListComponent, decorators: [{
5287
5268
  type: Component,
5288
- args: [{ selector: 'pw-smart-crm-opportunities-list', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.crm_opportunities\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n class=\"contact-table\" [totalRecords]=\"data.object_count\" [loading]=\"loading\" filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\" [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <p-multiSelect placeholder=\"Select Stage\" [options]=\"searchStages\" [(ngModel)]=\"filterByStages\"\n (onChange)=\"onSearchOptionChange($event, 'stage')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect placeholder=\"Select Category\" [options]=\"categories\" [(ngModel)]=\"filterByCategories\"\n (onChange)=\"onSearchOptionChange($event, 'category')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- Empty column occupying the same space -->\n <div class=\"col-sm-3 col-6\"></div>\n <div class=\"col-sm-3 col-md-4 col-lg-3 d-flex justify-content-end\">\n <div class=\"d-flex w-100\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search opportunities..\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control search-opportunities-search-input\" />\n </div>\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start text-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"title\"> {{ 'Crm.OpportunitiesMessage.Title' | transloco }} <p-sortIcon\n field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_contact_id\"> {{ 'Crm.OpportunitiesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_account_id\"> {{ 'Crm.OpportunitiesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"one_time_amount\"> {{ 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }} <p-sortIcon field=\"one_time_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"win_chances\"> {{ 'Crm.OpportunitiesMessage.WinChance' | transloco }}\n <p-sortIcon field=\"win_chances\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"monthly_amount\"> {{ 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }} <p-sortIcon field=\"monthly_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_stage_id\"> {{ 'Crm.OpportunitiesMessage.Stage' | transloco\n }} <p-sortIcon field=\"crm_opportunity_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_category_ids\"> {{ 'Crm.OpportunitiesMessage.Categories' |\n transloco }} <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"starting_at\"> {{ 'Crm.OpportunitiesMessage.StartingAt' | transloco }}\n <p-sortIcon field=\"starting_at\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\" scope=\"true\"> {{ 'Label.Actions' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-opportunities>\n <tr>\n <td data-head=\"Title\">\n <a *ngIf=\"\n hasAccess ||\n opportunities?.owner_id === userId ||\n checkPermission('Pages.Product.CRM.Role.Admin')\n \" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunityInfo,\n opportunities.id\n ]\">\n <span>{{ opportunities?.title | textTruncate: 15 }} </span>\n </a>\n <a *ngIf=\"\n !hasAccess &&\n opportunities?.owner_id !== userId &&\n checkPermission('Pages.Product.CRM.Role.Admin')\n \"> {{ opportunities?.title | textTruncate: 15 }} </a>\n </td>\n <td class=\"contactname\" data-head=\"Crm Contact\">\n <a *ngIf=\"opportunities?.crm_contact_id\" [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n opportunities.crm_contact_id.id\n ]\">{{ opportunities.crm_contact?.first_name + ' ' +\n opportunities.crm_contact?.last_name }}</a>\n </td>\n <td data-head=\"Account\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n opportunities.crm_account.id\n ]\">{{ opportunities.crm_account.name }}</a>\n </td>\n <td data-head=\"Amount\"> {{ opportunities.one_time_amount / 100 | currency }} </td>\n <td data-head=\"WinChance\"> {{ opportunities.win_chances / 100 | percent }} <span class=\"text-danger\"\n *ngIf=\"opportunities.cancelled\">!Cancelled!</span>\n </td>\n <td data-head=\"Monthly Amount\"> {{ opportunities.monthly_amount / 100 | currency }} </td>\n <td data-head=\"Stage\">\n <span class=\"badge\" [appDynamicBadge]=\"{\n itemsArray: stages,\n item: opportunities?.crm_opportunity_stage?.name\n }\" color=\"cyan\">{{ opportunities?.crm_opportunity_stage?.name }}</span>\n </td>\n <td data-head=\"Categories\">\n <span *ngFor=\"let category of opportunities?.crm_opportunity_categories\" class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\" color=\"blue-grey\">{{ category?.name\n }}</span>\n </td>\n <td data-head=\"Starting At\"> {{ opportunities.starting_at | dateFormat }} </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <ng-container *ngIf=\"hasAccess || opportunities?.owner_id === userId\">\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunities,\n opportunities.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(opportunities.id)\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"opportunitiesInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"opportunitiesInsight\" [paginator]=\"opportunitiesInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"opportunitiesInsight.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.OpportunitiesMessage.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.OpportunitiesMessage.Value' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.OpportunitiesMessage.Reason' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-insight>\n <tr>\n <td data-head=\"Title\"> {{ insight.title }} </td>\n <td data-head=\"Value\"> {{ insight.value }} </td>\n <td data-head=\"Reason\"> {{ insight.reason }} </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"opportunitiesInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ opportunitiesInsight.length }}</span>\n </div>\n <div *ngIf=\"opportunitiesInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"opportunitiesGeography\">\n <plotly-plot [data]=\"opportunitiesGeography?.data\" [layout]=\"opportunitiesGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!opportunitiesGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}.search-opportunities-search-input{background-color:#fff!important}\n"] }]
5269
+ args: [{ selector: 'pw-smart-crm-opportunities-list', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <a class=\"btn btn-sm btn-outline-primary float-end\" data-cy=\"add-opportunities\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"col-12\">\n <div class=\"primeng-datatable-container table-responsive\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt [value]=\"data.crm_opportunities\" [paginator]=\"data.object_count !== 0\" [lazy]=\"true\" [rows]=\"PAGE_SIZE\"\n class=\"contact-table\" [totalRecords]=\"data.object_count\" [loading]=\"loading\" filterDelay=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\" [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div class=\"col-sm-3 col-6 mb-2 mb-sm-0\">\n <p-multiSelect placeholder=\"Select Stage\" [options]=\"searchStages\" [(ngModel)]=\"filterByStages\"\n (onChange)=\"onSearchOptionChange($event, 'stage')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-sm-3 col-6\">\n <p-multiSelect placeholder=\"Select Category\" [options]=\"categories\" [(ngModel)]=\"filterByCategories\"\n (onChange)=\"onSearchOptionChange($event, 'category')\" [filter]=\"false\" [showHeader]=\"true\"\n [showToggleAll]=\"true\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <!-- Empty column occupying the same space -->\n <div class=\"col-sm-3 col-6\"></div>\n <div class=\"col-sm-3 col-md-4 col-lg-3 d-flex justify-content-end\">\n <div class=\"d-flex w-100\">\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\" [(ngModel)]=\"searchText\" pInputText placeholder=\"Search opportunities..\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" class=\"form-control search-opportunities-search-input\" />\n </div>\n </div>\n </div>\n <div class=\"search-filter\">\n <a class=\"mt-3 ms-3 text-start text-primary\" (click)=\"clearFilters()\">Clear all filters</a>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\" pSortableColumn=\"title\"> {{ 'Crm.OpportunitiesMessage.Title' | transloco }} <p-sortIcon\n field=\"title\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_contact_id\"> {{ 'Crm.OpportunitiesMessage.Contact' | transloco }}\n <p-sortIcon field=\"crm_contact_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_account_id\"> {{ 'Crm.OpportunitiesMessage.Account' | transloco }}\n <p-sortIcon field=\"crm_account_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"one_time_amount\"> {{ 'Crm.OpportunitiesMessage.OneTimeAmount' | transloco\n }} <p-sortIcon field=\"one_time_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"win_chances\"> {{ 'Crm.OpportunitiesMessage.WinChance' | transloco }}\n <p-sortIcon field=\"win_chances\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"monthly_amount\"> {{ 'Crm.OpportunitiesMessage.MonthlyAmount' | transloco\n }} <p-sortIcon field=\"monthly_amount\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_stage_id\"> {{ 'Crm.OpportunitiesMessage.Stage' | transloco\n }} <p-sortIcon field=\"crm_opportunity_stage_id\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"crm_opportunity_category_ids\"> {{ 'Crm.OpportunitiesMessage.Categories' |\n transloco }} <p-sortIcon field=\"crm_opportunity_category_ids\"></p-sortIcon>\n </th>\n <th scope=\"true\" pSortableColumn=\"starting_at\"> {{ 'Crm.OpportunitiesMessage.StartingAt' | transloco }}\n <p-sortIcon field=\"starting_at\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\" scope=\"true\"> {{ 'Label.Actions' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-opportunities>\n <tr>\n <td data-head=\"Title\">\n <a [ngbTooltip]=\"opportunities?.title\" *ngIf=\"\n hasAccess ||\n opportunities?.owner_id === userId ||\n checkPermission('Pages.Product.CRM.Role.Admin')\n \" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunityInfo,\n opportunities.id\n ]\">\n <span>{{ opportunities?.title | textTruncate: 15 }} </span>\n </a>\n <a *ngIf=\"\n !hasAccess &&\n opportunities?.owner_id !== userId &&\n checkPermission('Pages.Product.CRM.Role.Admin')\n \"> {{ opportunities?.title | textTruncate: 15 }} </a>\n </td>\n <td class=\"contactname\" data-head=\"Crm Contact\">\n <a *ngIf=\"opportunities?.crm_contact_id\" [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n opportunities.crm_contact_id.id\n ]\">{{ opportunities.crm_contact?.first_name + ' ' +\n opportunities.crm_contact?.last_name }}</a>\n </td>\n <td data-head=\"Account\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n opportunities.crm_account.id\n ]\">{{ opportunities.crm_account.name }}</a>\n </td>\n <td data-head=\"Amount\"> {{ opportunities.one_time_amount / 100 | currency }} </td>\n <td data-head=\"WinChance\"> {{ opportunities.win_chances / 100 | percent }} <span class=\"text-danger\"\n *ngIf=\"opportunities.cancelled\">!Cancelled!</span>\n </td>\n <td data-head=\"Monthly Amount\"> {{ opportunities.monthly_amount / 100 | currency }} </td>\n <td data-head=\"Stage\">\n <span class=\"badge\" [appDynamicBadge]=\"{\n itemsArray: stages,\n item: opportunities?.crm_opportunity_stage?.name\n }\" color=\"cyan\">{{ opportunities?.crm_opportunity_stage?.name }}</span>\n </td>\n <td data-head=\"Categories\">\n <span *ngFor=\"let category of opportunities?.crm_opportunity_categories\" class=\"badge ms-1\"\n [appDynamicBadge]=\"{ itemsArray: categories, item: category?.name }\" color=\"blue-grey\">{{ category?.name\n }}</span>\n </td>\n <td data-head=\"Starting At\"> {{ opportunities.starting_at | dateFormat }} </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <ng-container *ngIf=\"hasAccess || opportunities?.owner_id === userId\">\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-3\" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunities,\n opportunities.id\n ]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n <ng-container *rbacAllow=\"'SubscriptionAdmin'\">\n <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-3\">\n <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(opportunities.id)\" aria-hidden=\"true\"></i>\n </li>\n </ng-container>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span class=\"total-records-count\" *ngIf=\"data.object_count !== 0\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n </div>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoOpportunitiesMessage' | transloco\">\n </pw-no-data>\n</div>\n<ng-container *rbacAllow=\"'Pages.Beta'\">\n <div class=\"row mt-5\" *ngIf=\"data.unfiltered_count !== 0 && isLoaded\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Drill Down</h5>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"opportunitiesInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"opportunitiesInsight\" [paginator]=\"opportunitiesInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"opportunitiesInsight.length\" [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.OpportunitiesMessage.Reason' | transloco }} </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\" let-insight>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, insight.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Title\">\n <span\n [ngbTooltip]=\"insight?.title\"\n container=\"body\"\n tooltipClass=\"custom-tooltip\"\n placement=\"bottom\"\n >\n {{ insight?.title | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"Reason\"> {{ insight.reason }} </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"opportunitiesInsight?.length !== 0\">{{ 'Label.Total' | transloco }}: {{ opportunitiesInsight.length }}</span>\n </div>\n <div *ngIf=\"opportunitiesInsight?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Geography</h5>\n <div>\n <ng-template [ngIf]=\"opportunitiesGeography\">\n <plotly-plot [data]=\"opportunitiesGeography?.data\" [layout]=\"opportunitiesGeography?.layout\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"!opportunitiesGeography\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.OpportunitiesMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media (min-width: 640px) and (max-width: 768px){.primeng-datatable-container tr td{width:350px}}.search-opportunities-search-input{background-color:#fff!important}\n"] }]
5289
5270
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i2.ProductService }] });
5290
5271
 
5291
5272
  class SmartCrmOpportunitiesComponent {
@@ -5522,11 +5503,11 @@ class SmartCrmSummaryActionsComponent extends AppBaseComponent {
5522
5503
  super.ngOnDestroy();
5523
5504
  }
5524
5505
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmSummaryActionsComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
5525
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmSummaryActionsComponent, selector: "pw-smart-crm-summary-actions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"col-12 col-sm-3 float-start mb-2\"\n *ngIf=\"showFilter\">\n <select class=\"form-select\"\n (change)=\"filterByUser($event)\">\n <option value=\"0\">Filter by user</option>\n <option *ngFor=\"let member of allSubscriptionMembers\"\n [value]=\"member.id\">\n {{ member.first_name }} {{ member.last_name }}\n </option>\n </select>\n </div>\n <div>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountMessage.AddAccount' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end me-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactDetails, 0]\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <!-- Pending Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Pending Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"contactActions?.length === 0 && isLoaded\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummaryMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div class=\"pending-actions-wrapper\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollPendingActions()\">\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"let action of contactActions; let i = index\">\n <div class=\"p-2\">\n <ul class=\"list-inline\">\n <li class=\"list-inline-item me-2\">\n <h6 *ngIf=\"!updating || actionId !== action.id\">\n {{ action.when_short_date }}\n </h6>\n <input *ngIf=\"updating && actionId === action.id\"\n placeholder=\"dd-mmm-yyyy\"\n [value]=\"action.when_short_date\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, action)\" />\n </li>\n <li>\n <button type=\"button\"\n class=\"btn btn-sm when-btn\"\n (click)=\"showDatePicker(action?.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n ngbTooltip=\"Click to Edit\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </li>\n <li class=\"list-inline-item\">\n <span class=\"badge bg-primary\">{{ action.crm_action?.name }}</span>\n </li>\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n <i class=\"fa fa-eye me-3 see-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as completed\"\n class=\"me-3\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCompleted(action.id, action, i)\">\n <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(action.id, action, i)\">\n <i\n class=\"fa fa-times text-danger delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n </li>\n </ul>\n <p [class.text-danger]=\"!action.color\"\n class=\"mb-0\"\n *ngIf=\"action.due\">\n {{ action.due }}\n </p>\n <p *ngIf=\"action.owner?.id !== userId\"\n class=\"m-0 mt-1\">\n <a class=\"font-italic grey\"\n [routerLink]=\"['/members', action?.owner?.slug]\">Added by\n {{ action.owner?.first_name + ' ' + action.owner?.last_name }}</a>\n </p>\n <p class=\"mt-1 mb-1 fw-bold\">\n <a class=\"text-secondary\"\n *ngIf=\"action?.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n {{\n action?.crm_contact?.first_name +\n ' ' +\n action?.crm_contact?.last_name\n }}\n </a>\n <a *ngIf=\"!action.crm_contact_id\">N/A</a> at\n <a *ngIf=\"action.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n action?.crm_account?.id\n ]\">\n {{ action?.crm_account?.name }}\n </a>\n </p>\n <div class=\"comment-section\">\n <textarea class=\"mt-1 textarea form-control mb-2\"\n [(ngModel)]=\"action.comment\">{{ action.comment }}</textarea>\n <div class=\"d-flex\">\n <p class=\"my-1 comment\"\n *ngIf=\"!showFullComment || action.id !== commentId\">\n {{ action.comment | slice: 0:230\n }}<a *ngIf=\"action.comment.length > 230\"\n class=\"text-secondary\"\n (click)=\"showFullComment = true; commentId = action.id\">...show more\n </a>\n </p>\n <p class=\"my-1 comment\"\n *ngIf=\"showFullComment && action.id === commentId\">\n {{ action.comment }}\n <a *ngIf=\"action.comment.length > 230 && showFullComment\"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn\"\n (click)=\"editComment($event)\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <div class=\"control-btns edit-control-btns\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"editComment(undefined)\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n (click)=\"updateComment(action)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Suggested Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Suggested Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"\n let suggestedAction of accountActionSuggested\n | paginate: { id: 'suggestedAction', itemsPerPage: 10, currentPage: p1 };\n let i = index\n \">\n <div class=\"p-2\">\n <p class=\"mt-1 mb-1 fw-bold\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n suggestedAction?.crm_account?.id\n ]\">{{ suggestedAction?.crm_account?.name }}</a>\n </p>\n <p class=\"fw-bold mb-1\">{{ suggestedAction.crm_action }}</p>\n <p class=\"mb-0\">{{ suggestedAction.reason }}</p>\n </div>\n </div>\n <div class=\"text-center pagination-controls w-100 mt-3\"\n *ngIf=\"accountActionSuggested?.length > 10\">\n <pagination-controls id=\"suggestedAction\"\n (pageChange)=\"p1 = $event\">\n </pagination-controls>\n </div>\n <div *ngIf=\"accountActionSuggested.length === 0 && isLoadedSuggested\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummarySuggestionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.textarea,.control-btns{display:none}.comment,.edit-btn{display:block}.comment{border:0;border-bottom:1px solid rgb(242,242,242);color:#000;font-size:1rem;resize:none}.textarea{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:17px}.comment-section{min-width:350px;padding-right:45px;position:relative}.comment-section p{word-break:break-all}.comment-section.show-controls .textarea,.comment-section.show-controls .control-btns{display:block}.comment-section.show-controls .comment,.comment-section.show-controls .edit-btn{display:none}.comment-section.show-controls .control-btns.edit-control-btns{display:flex;justify-content:flex-end}.edit-btn{margin-top:-15px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper{height:500px;overflow-y:auto}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$2.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i17.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "pipe", type: i2$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i4$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5506
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmSummaryActionsComponent, selector: "pw-smart-crm-summary-actions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"col-12 col-sm-3 float-start mb-2\"\n *ngIf=\"showFilter\">\n <select class=\"form-select\"\n (change)=\"filterByUser($event)\">\n <option value=\"0\">Filter by user</option>\n <option *ngFor=\"let member of allSubscriptionMembers\"\n [value]=\"member.id\">\n {{ member.first_name }} {{ member.last_name }}\n </option>\n </select>\n </div>\n <div>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-opportunities\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end me-3\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountMessage.AddAccount' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end me-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactDetails, 0]\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <!-- Pending Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Pending Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"contactActions?.length === 0 && isLoaded\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummaryMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div class=\"pending-actions-wrapper\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollPendingActions()\">\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"let action of contactActions; let i = index\">\n <div class=\"p-2\">\n <ul class=\"list-inline\">\n <li class=\"list-inline-item me-2\">\n <h6 *ngIf=\"!updating || actionId !== action.id\">\n {{ action.when_short_date }}\n </h6>\n <input *ngIf=\"updating && actionId === action.id\"\n placeholder=\"dd-mmm-yyyy\"\n [value]=\"action.when_short_date\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, action)\" />\n </li>\n <li>\n <button type=\"button\"\n class=\"btn btn-sm when-btn\"\n (click)=\"showDatePicker(action?.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n ngbTooltip=\"Click to Edit\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </li>\n <li class=\"list-inline-item\">\n <span class=\"badge bg-primary\">{{ action.crm_action?.name }}</span>\n </li>\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n <i class=\"fa fa-eye me-3 see-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as completed\"\n class=\"me-3\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCompleted(action.id, action, i)\">\n <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(action.id, action, i)\">\n <i\n class=\"fa fa-times text-danger delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n </li>\n </ul>\n <p [class.text-danger]=\"!action.color\"\n class=\"mb-0\"\n *ngIf=\"action.due\">\n {{ action.due }}\n </p>\n <p *ngIf=\"action.owner?.id !== userId\"\n class=\"m-0 mt-1\">\n <a class=\"font-italic grey\"\n [routerLink]=\"['/members', action?.owner?.slug]\">Added by\n {{ action.owner?.first_name + ' ' + action.owner?.last_name }}</a>\n </p>\n <p class=\"mt-1 mb-1 fw-bold\">\n <a class=\"text-secondary\"\n *ngIf=\"action?.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n {{\n action?.crm_contact?.first_name +\n ' ' +\n action?.crm_contact?.last_name\n }}\n </a>\n <a *ngIf=\"!action.crm_contact_id\">N/A</a> at\n <a *ngIf=\"action.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n action?.crm_account?.id\n ]\">\n {{ action?.crm_account?.name }}\n </a>\n </p>\n <div class=\"comment-section\">\n <textarea class=\"mt-1 textarea form-control mb-2\"\n [(ngModel)]=\"action.comment\">{{ action.comment }}</textarea>\n <div class=\"d-flex\">\n <p class=\"my-1 comment\"\n *ngIf=\"!showFullComment || action.id !== commentId\">\n {{ action.comment | slice: 0:230\n }}<a *ngIf=\"action.comment.length > 230\"\n class=\"text-secondary\"\n (click)=\"showFullComment = true; commentId = action.id\">...show more\n </a>\n </p>\n <p class=\"my-1 comment\"\n *ngIf=\"showFullComment && action.id === commentId\">\n {{ action.comment }}\n <a *ngIf=\"action.comment.length > 230 && showFullComment\"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn\"\n (click)=\"editComment($event)\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <div class=\"control-btns edit-control-btns\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"editComment(undefined)\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n (click)=\"updateComment(action)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Suggested Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Suggested Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"\n let suggestedAction of accountActionSuggested\n | paginate: { id: 'suggestedAction', itemsPerPage: 10, currentPage: p1 };\n let i = index\n \">\n <div class=\"p-2\">\n <p class=\"mt-1 mb-1 fw-bold\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n suggestedAction?.crm_account?.id\n ]\">{{ suggestedAction?.crm_account?.name }}</a>\n </p>\n <p class=\"fw-bold mb-1\">{{ suggestedAction.crm_action }}</p>\n <p class=\"mb-0\">{{ suggestedAction.reason }}</p>\n </div>\n </div>\n <div class=\"text-center pagination-controls w-100 mt-3\"\n *ngIf=\"accountActionSuggested?.length > 10\">\n <pagination-controls id=\"suggestedAction\"\n (pageChange)=\"p1 = $event\">\n </pagination-controls>\n </div>\n <div *ngIf=\"accountActionSuggested.length === 0 && isLoadedSuggested\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummarySuggestionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.textarea,.control-btns{display:none}.comment,.edit-btn{display:block}.comment{border:0;border-bottom:1px solid rgb(242,242,242);color:#000;font-size:1rem;resize:none}.textarea{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:17px}.comment-section{min-width:350px;padding-right:45px;position:relative}.comment-section p{word-break:break-all}.comment-section.show-controls .textarea,.comment-section.show-controls .control-btns{display:block}.comment-section.show-controls .comment,.comment-section.show-controls .edit-btn{display:none}.comment-section.show-controls .control-btns.edit-control-btns{display:flex;justify-content:flex-end}.edit-btn{margin-top:-15px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper{height:500px;overflow-y:auto}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$2.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "directive", type: i2$2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["autoClose", "contentTemplate", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "popperOptions", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays", "disabled"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i17.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "pipe", type: i2$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i4$2.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5526
5507
  }
5527
5508
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmSummaryActionsComponent, decorators: [{
5528
5509
  type: Component,
5529
- args: [{ selector: 'pw-smart-crm-summary-actions', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"col-12 col-sm-3 float-start mb-2\"\n *ngIf=\"showFilter\">\n <select class=\"form-select\"\n (change)=\"filterByUser($event)\">\n <option value=\"0\">Filter by user</option>\n <option *ngFor=\"let member of allSubscriptionMembers\"\n [value]=\"member.id\">\n {{ member.first_name }} {{ member.last_name }}\n </option>\n </select>\n </div>\n <div>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountMessage.AddAccount' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end me-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactDetails, 0]\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <!-- Pending Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Pending Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"contactActions?.length === 0 && isLoaded\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummaryMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div class=\"pending-actions-wrapper\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollPendingActions()\">\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"let action of contactActions; let i = index\">\n <div class=\"p-2\">\n <ul class=\"list-inline\">\n <li class=\"list-inline-item me-2\">\n <h6 *ngIf=\"!updating || actionId !== action.id\">\n {{ action.when_short_date }}\n </h6>\n <input *ngIf=\"updating && actionId === action.id\"\n placeholder=\"dd-mmm-yyyy\"\n [value]=\"action.when_short_date\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, action)\" />\n </li>\n <li>\n <button type=\"button\"\n class=\"btn btn-sm when-btn\"\n (click)=\"showDatePicker(action?.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n ngbTooltip=\"Click to Edit\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </li>\n <li class=\"list-inline-item\">\n <span class=\"badge bg-primary\">{{ action.crm_action?.name }}</span>\n </li>\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n <i class=\"fa fa-eye me-3 see-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as completed\"\n class=\"me-3\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCompleted(action.id, action, i)\">\n <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(action.id, action, i)\">\n <i\n class=\"fa fa-times text-danger delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n </li>\n </ul>\n <p [class.text-danger]=\"!action.color\"\n class=\"mb-0\"\n *ngIf=\"action.due\">\n {{ action.due }}\n </p>\n <p *ngIf=\"action.owner?.id !== userId\"\n class=\"m-0 mt-1\">\n <a class=\"font-italic grey\"\n [routerLink]=\"['/members', action?.owner?.slug]\">Added by\n {{ action.owner?.first_name + ' ' + action.owner?.last_name }}</a>\n </p>\n <p class=\"mt-1 mb-1 fw-bold\">\n <a class=\"text-secondary\"\n *ngIf=\"action?.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n {{\n action?.crm_contact?.first_name +\n ' ' +\n action?.crm_contact?.last_name\n }}\n </a>\n <a *ngIf=\"!action.crm_contact_id\">N/A</a> at\n <a *ngIf=\"action.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n action?.crm_account?.id\n ]\">\n {{ action?.crm_account?.name }}\n </a>\n </p>\n <div class=\"comment-section\">\n <textarea class=\"mt-1 textarea form-control mb-2\"\n [(ngModel)]=\"action.comment\">{{ action.comment }}</textarea>\n <div class=\"d-flex\">\n <p class=\"my-1 comment\"\n *ngIf=\"!showFullComment || action.id !== commentId\">\n {{ action.comment | slice: 0:230\n }}<a *ngIf=\"action.comment.length > 230\"\n class=\"text-secondary\"\n (click)=\"showFullComment = true; commentId = action.id\">...show more\n </a>\n </p>\n <p class=\"my-1 comment\"\n *ngIf=\"showFullComment && action.id === commentId\">\n {{ action.comment }}\n <a *ngIf=\"action.comment.length > 230 && showFullComment\"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn\"\n (click)=\"editComment($event)\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <div class=\"control-btns edit-control-btns\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"editComment(undefined)\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n (click)=\"updateComment(action)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Suggested Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Suggested Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"\n let suggestedAction of accountActionSuggested\n | paginate: { id: 'suggestedAction', itemsPerPage: 10, currentPage: p1 };\n let i = index\n \">\n <div class=\"p-2\">\n <p class=\"mt-1 mb-1 fw-bold\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n suggestedAction?.crm_account?.id\n ]\">{{ suggestedAction?.crm_account?.name }}</a>\n </p>\n <p class=\"fw-bold mb-1\">{{ suggestedAction.crm_action }}</p>\n <p class=\"mb-0\">{{ suggestedAction.reason }}</p>\n </div>\n </div>\n <div class=\"text-center pagination-controls w-100 mt-3\"\n *ngIf=\"accountActionSuggested?.length > 10\">\n <pagination-controls id=\"suggestedAction\"\n (pageChange)=\"p1 = $event\">\n </pagination-controls>\n </div>\n <div *ngIf=\"accountActionSuggested.length === 0 && isLoadedSuggested\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummarySuggestionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.textarea,.control-btns{display:none}.comment,.edit-btn{display:block}.comment{border:0;border-bottom:1px solid rgb(242,242,242);color:#000;font-size:1rem;resize:none}.textarea{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:17px}.comment-section{min-width:350px;padding-right:45px;position:relative}.comment-section p{word-break:break-all}.comment-section.show-controls .textarea,.comment-section.show-controls .control-btns{display:block}.comment-section.show-controls .comment,.comment-section.show-controls .edit-btn{display:none}.comment-section.show-controls .control-btns.edit-control-btns{display:flex;justify-content:flex-end}.edit-btn{margin-top:-15px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper{height:500px;overflow-y:auto}\n"] }]
5510
+ args: [{ selector: 'pw-smart-crm-summary-actions', template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"col-12 col-sm-3 float-start mb-2\"\n *ngIf=\"showFilter\">\n <select class=\"form-select\"\n (change)=\"filterByUser($event)\">\n <option value=\"0\">Filter by user</option>\n <option *ngFor=\"let member of allSubscriptionMembers\"\n [value]=\"member.id\">\n {{ member.first_name }} {{ member.last_name }}\n </option>\n </select>\n </div>\n <div>\n <a class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"add-opportunities\"\n [routerLink]=\"['/' + subscription?.slug + routers.opportunityAdd]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.OpportunitiesMessage.AddOpportunity' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end me-3\"\n data-cy=\"add-contact\"\n [routerLink]=\"['/' + subscription?.slug + routers.addAccount]\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.AccountMessage.AddAccount' | transloco }}\n </a>\n <a class=\"btn btn-sm btn-outline-primary float-end me-3\"\n [routerLink]=\"['/' + subscription?.slug + routers.contactDetails, 0]\"\n data-cy=\"add-action\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Crm.ContactMessage.AddContact' | transloco }}\n </a>\n </div>\n </div>\n <!-- Pending Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Pending Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"contactActions?.length === 0 && isLoaded\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummaryMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div class=\"pending-actions-wrapper\"\n infiniteScroll\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\"\n [infiniteScrollContainer]=\"selector\"\n [fromRoot]=\"true\"\n (scrolled)=\"onScrollPendingActions()\">\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"let action of contactActions; let i = index\">\n <div class=\"p-2\">\n <ul class=\"list-inline\">\n <li class=\"list-inline-item me-2\">\n <h6 *ngIf=\"!updating || actionId !== action.id\">\n {{ action.when_short_date }}\n </h6>\n <input *ngIf=\"updating && actionId === action.id\"\n placeholder=\"dd-mmm-yyyy\"\n [value]=\"action.when_short_date\"\n ngbDatepicker\n #d=\"ngbDatepicker\"\n (focus)=\"d.toggle()\"\n (dateSelect)=\"onDateSelect($event, action)\" />\n </li>\n <li>\n <button type=\"button\"\n class=\"btn btn-sm when-btn\"\n (click)=\"showDatePicker(action?.id)\">\n <i\n class=\"fa fa-edit edit-icon\"\n ngbTooltip=\"Click to Edit\"\n aria-hidden=\"true\"\n ></i>\n </button>\n </li>\n <li class=\"list-inline-item\">\n <span class=\"badge bg-primary\">{{ action.crm_action?.name }}</span>\n </li>\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n <i class=\"fa fa-eye me-3 see-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as completed\"\n class=\"me-3\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCompleted(action.id, action, i)\">\n <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n </a>\n <a ngbTooltip=\"Set as cancelled\"\n href=\"javascript:void(0);\"\n (click)=\"setAsCancelled(action.id, action, i)\">\n <i\n class=\"fa fa-times text-danger delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </a>\n </li>\n </ul>\n <p [class.text-danger]=\"!action.color\"\n class=\"mb-0\"\n *ngIf=\"action.due\">\n {{ action.due }}\n </p>\n <p *ngIf=\"action.owner?.id !== userId\"\n class=\"m-0 mt-1\">\n <a class=\"font-italic grey\"\n [routerLink]=\"['/members', action?.owner?.slug]\">Added by\n {{ action.owner?.first_name + ' ' + action.owner?.last_name }}</a>\n </p>\n <p class=\"mt-1 mb-1 fw-bold\">\n <a class=\"text-secondary\"\n *ngIf=\"action?.crm_contact\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.contactInfo,\n action?.crm_contact?.id\n ]\">\n {{\n action?.crm_contact?.first_name +\n ' ' +\n action?.crm_contact?.last_name\n }}\n </a>\n <a *ngIf=\"!action.crm_contact_id\">N/A</a> at\n <a *ngIf=\"action.crm_account_id\"\n [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n action?.crm_account?.id\n ]\">\n {{ action?.crm_account?.name }}\n </a>\n </p>\n <div class=\"comment-section\">\n <textarea class=\"mt-1 textarea form-control mb-2\"\n [(ngModel)]=\"action.comment\">{{ action.comment }}</textarea>\n <div class=\"d-flex\">\n <p class=\"my-1 comment\"\n *ngIf=\"!showFullComment || action.id !== commentId\">\n {{ action.comment | slice: 0:230\n }}<a *ngIf=\"action.comment.length > 230\"\n class=\"text-secondary\"\n (click)=\"showFullComment = true; commentId = action.id\">...show more\n </a>\n </p>\n <p class=\"my-1 comment\"\n *ngIf=\"showFullComment && action.id === commentId\">\n {{ action.comment }}\n <a *ngIf=\"action.comment.length > 230 && showFullComment\"\n (click)=\"showFullComment = false\"\n class=\"text-secondary\">...show less</a>\n </p>\n <button class=\"btn btn-md edit-btn\"\n (click)=\"editComment($event)\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </button>\n </div>\n <div class=\"control-btns edit-control-btns\">\n <button type=\"button\"\n class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"editComment(undefined)\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button class=\"btn btn-sm btn-primary\"\n (click)=\"updateComment(action)\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <!-- Suggested Actions -->\n <div class=\"col-12 col-md-6 mb-3\">\n <h5 class=\"accordion-heading\">Suggested Actions</h5>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"mb-4 action-card bg-white\"\n *ngFor=\"\n let suggestedAction of accountActionSuggested\n | paginate: { id: 'suggestedAction', itemsPerPage: 10, currentPage: p1 };\n let i = index\n \">\n <div class=\"p-2\">\n <p class=\"mt-1 mb-1 fw-bold\">\n <a [routerLink]=\"[\n '/' + subscription?.slug + routers.accountInfo,\n suggestedAction?.crm_account?.id\n ]\">{{ suggestedAction?.crm_account?.name }}</a>\n </p>\n <p class=\"fw-bold mb-1\">{{ suggestedAction.crm_action }}</p>\n <p class=\"mb-0\">{{ suggestedAction.reason }}</p>\n </div>\n </div>\n <div class=\"text-center pagination-controls w-100 mt-3\"\n *ngIf=\"accountActionSuggested?.length > 10\">\n <pagination-controls id=\"suggestedAction\"\n (pageChange)=\"p1 = $event\">\n </pagination-controls>\n </div>\n <div *ngIf=\"accountActionSuggested.length === 0 && isLoadedSuggested\"\n class=\"px-2\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.SummarySuggestionsMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.textarea,.control-btns{display:none}.comment,.edit-btn{display:block}.comment{border:0;border-bottom:1px solid rgb(242,242,242);color:#000;font-size:1rem;resize:none}.textarea{border:0;border-bottom:1px solid rgb(242,242,242);color:#1769e1;display:none;font-size:17px}.comment-section{min-width:350px;padding-right:45px;position:relative}.comment-section p{word-break:break-all}.comment-section.show-controls .textarea,.comment-section.show-controls .control-btns{display:block}.comment-section.show-controls .comment,.comment-section.show-controls .edit-btn{display:none}.comment-section.show-controls .control-btns.edit-control-btns{display:flex;justify-content:flex-end}.edit-btn{margin-top:-15px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper{height:500px;overflow-y:auto}\n"] }]
5530
5511
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: Document, decorators: [{
5531
5512
  type: Inject,
5532
5513
  args: [DOCUMENT]
@@ -5536,6 +5517,7 @@ class SmartCrmSummaryOthersComponent extends AppBaseComponent {
5536
5517
  constructor(crmService, injector) {
5537
5518
  super(injector);
5538
5519
  this.crmService = crmService;
5520
+ this.routers = ROUTERS$1;
5539
5521
  this.signUpLastThirtyDaysLoaded = false;
5540
5522
  this.activeOpportunitiesLoaded = false;
5541
5523
  this.accountAtRiskDetailsLoaded = false;
@@ -5547,6 +5529,7 @@ class SmartCrmSummaryOthersComponent extends AppBaseComponent {
5547
5529
  this.getUserSubscription().subscribe(response => {
5548
5530
  this.subscription = response;
5549
5531
  if (this.subscription?.id) {
5532
+ this.hasAccess = this.hasAdminAccess(this.subscription.id);
5550
5533
  this.getUserInfo();
5551
5534
  }
5552
5535
  });
@@ -5555,6 +5538,7 @@ class SmartCrmSummaryOthersComponent extends AppBaseComponent {
5555
5538
  this.userStore().subscribe(user => {
5556
5539
  if (user) {
5557
5540
  this.user = user;
5541
+ this.userId = user.id;
5558
5542
  if (this.permissionService.isGranted('Pages.Beta') ||
5559
5543
  this.permissionService.isSuperAdmin()) {
5560
5544
  this.getSignedUpLastThirtyDays();
@@ -5657,15 +5641,18 @@ class SmartCrmSummaryOthersComponent extends AppBaseComponent {
5657
5641
  this.magicMomentLoaded = true;
5658
5642
  });
5659
5643
  }
5644
+ checkPermission(permission) {
5645
+ return this.permissionService.evaluatePermissions(permission);
5646
+ }
5660
5647
  ngOnDestroy() {
5661
5648
  super.ngOnDestroy();
5662
5649
  }
5663
5650
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmSummaryOthersComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
5664
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmSummaryOthersComponent, selector: "pw-smart-crm-summary-others", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <ng-container class=\"mt-5\"\n *rbacAllow=\"'Pages.Beta'\">\n <!-- Signed up last 30 days -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Signed up Last 30 Days</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!signUpLastThirtyDaysLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"signedUpLastThirtyDays?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"signedUpLastThirtyDays\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"signedUpLastThirtyDays.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-signUp>\n <tr>\n <td data-head=\"Owner\">\n {{ signUp.owner?.first_name }} {{ signUp.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ signUp.contact_name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ signUp.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"signedUpLastThirtyDays.length!== 0\">{{ 'Label.Total' | transloco }}: {{ signedUpLastThirtyDays.length }}</span>\n </div>\n <div *ngIf=\"signedUpLastThirtyDays?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Active Opportunities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Active Opportunities</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!activeOpportunitiesLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"activeOpportunities?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"activeOpportunities\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"activeOpportunities.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.OneTimeAmount' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.WinChance' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.MonthlyAmount' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-opportunities>\n <tr>\n <td data-head=\"Title\">\n {{ opportunities.title }}\n </td>\n <td data-head=\"Contact Name\">\n {{ opportunities.crm_contact?.first_name }}\n {{ opportunities.crm_contact?.last_name }}\n </td>\n <td data-head=\"Account\">\n {{ opportunities.crm_account?.name }}\n </td>\n <td data-head=\"One Time Amount\">\n {{ opportunities.one_time_amount / 100 | currency }}\n </td>\n <td data-head=\"Monthly Amount\">\n {{ opportunities.monthly_amount / 100 | currency }}\n </td>\n <td data-head=\"Win Chance\">\n {{ opportunities.win_chances | percent }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"activeOpportunities.length !== 0\">{{ 'Label.Total' | transloco }}: {{ activeOpportunities.length }}</span>\n </div>\n <div *ngIf=\"activeOpportunities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Accounts at risk -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Accounts at Risk</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!accountAtRiskDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"accountAtRisk?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"accountAtRisk\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"accountAtRisk.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountAtRisk.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountAtRisk.length }}</span>\n </div>\n <div *ngIf=\"accountAtRisk?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Contract renewal -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contract Renewal</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactRenewalLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"ContractRenewal?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"ContractRenewal\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"ContractRenewal.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"ContractRenewal.length !== 0\">{{ 'Label.Total' | transloco }}: {{ ContractRenewal.length }}</span>\n </div>\n <div *ngIf=\"ContractRenewal?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Credit Card Expiring -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Credit Card Expiring</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!creditCardExpiringDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"creditCardExpiring?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"creditCardExpiring\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"creditCardExpiring.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"creditCardExpiring.length !== 0\">{{ 'Label.Total' | transloco }}: {{ creditCardExpiring.length }}</span>\n </div>\n <div *ngIf=\"creditCardExpiring?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Magic Moment -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Magic Moment</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!magicMomentLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"magicMoment?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"magicMoment\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"magicMoment.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"magicMoment.length !==0 \">{{ 'Label.Total' | transloco }}: {{ magicMoment.length }}</span>\n </div>\n <div *ngIf=\"magicMoment?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.PercentPipe, name: "percent" }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5651
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmSummaryOthersComponent, selector: "pw-smart-crm-summary-others", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <ng-container class=\"mt-5\"\n *rbacAllow=\"'Pages.Beta'\">\n <!-- Signed up last 30 days -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Signed up Last 30 Days</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!signUpLastThirtyDaysLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"signedUpLastThirtyDays?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"signedUpLastThirtyDays\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"signedUpLastThirtyDays.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-signUp>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, signUp.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"signUp.crm_account_name\">{{ signUp?.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ signUp.expected_mrr / 100 | currency: signUp.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ signUp.signed_up_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"signedUpLastThirtyDays.length!== 0\">{{ 'Label.Total' | transloco }}: {{ signedUpLastThirtyDays.length }}</span>\n </div>\n <div *ngIf=\"signedUpLastThirtyDays?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Active Opportunities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Active Opportunities</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!activeOpportunitiesLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"activeOpportunities?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"activeOpportunities\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"activeOpportunities.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.OneTimeAmount' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.MonthlyAmount' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.WinChance' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-opportunities>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, opportunities.crm_account?.id]\" class=\"name-link\">\n <span [ngbTooltip]=\"opportunities.crm_account?.name\">{{ opportunities.crm_account?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Title\">\n <a [ngbTooltip]=\"opportunities?.title\" *ngIf=\"\n hasAccess ||\n opportunities?.owner_id === userId ||\n checkPermission('Pages.Product.CRM.Role.Admin')\n \" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunityInfo,\n opportunities.id\n ]\">\n <span>{{ opportunities?.title | textTruncate: 20 }} </span>\n </a>\n </td>\n <td data-head=\"One Time Amount\"> {{ opportunities.one_time_amount / 100 | currency }} </td>\n <td data-head=\"Monthly Amount\"> {{ opportunities.monthly_amount / 100 | currency }} </td>\n <td data-head=\"Win Chance\"> {{ opportunities.win_chances / 100 | percent }} <span class=\"text-danger\"\n *ngIf=\"opportunities.cancelled\">!Cancelled!</span>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"activeOpportunities.length !== 0\">{{ 'Label.Total' | transloco }}: {{ activeOpportunities.length }}</span>\n </div>\n <div *ngIf=\"activeOpportunities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Accounts at risk -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Accounts at Risk</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!accountAtRiskDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"accountAtRisk?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"accountAtRisk\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"accountAtRisk.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account?.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountAtRisk.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountAtRisk.length }}</span>\n </div>\n <div *ngIf=\"accountAtRisk?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Contract renewal -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contract Renewal</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactRenewalLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"ContractRenewal?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"ContractRenewal\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"ContractRenewal.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n\n <th scope=\"true\">{{ 'Crm.AccountMessage.Quarter' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.AccountMessage.Month' | transloco }}</th>\n\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.ExpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"Quarter\">{{ account.sessions_last_quarter }}</td>\n <td data-head=\"Month\">{{ account.sessions_last_month }}</td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n <td data-head=\"ExpAt\">\n {{ account.cc_expiring_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"ContractRenewal.length !== 0\">{{ 'Label.Total' | transloco }}: {{ ContractRenewal.length }}</span>\n </div>\n <div *ngIf=\"ContractRenewal?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Credit Card Expiring -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Credit Card Expiring</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!creditCardExpiringDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"creditCardExpiring?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"creditCardExpiring\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"creditCardExpiring.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.ExpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n <td data-head=\"ExpAt\">\n {{ account.cc_expiring_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"creditCardExpiring.length !== 0\">{{ 'Label.Total' | transloco }}: {{ creditCardExpiring.length }}</span>\n </div>\n <div *ngIf=\"creditCardExpiring?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Magic Moment -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Magic Moment</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!magicMomentLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"magicMoment?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"magicMoment\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"magicMoment.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account?.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"magicMoment.length !==0 \">{{ 'Label.Total' | transloco }}: {{ magicMoment.length }}</span>\n </div>\n <div *ngIf=\"magicMoment?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i2$2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i8$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i11.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i2$1.PercentPipe, name: "percent" }, { kind: "pipe", type: i2$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i14.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
5665
5652
  }
5666
5653
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmSummaryOthersComponent, decorators: [{
5667
5654
  type: Component,
5668
- args: [{ selector: 'pw-smart-crm-summary-others', template: "<div class=\"row\">\n <ng-container class=\"mt-5\"\n *rbacAllow=\"'Pages.Beta'\">\n <!-- Signed up last 30 days -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Signed up Last 30 Days</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!signUpLastThirtyDaysLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"signedUpLastThirtyDays?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"signedUpLastThirtyDays\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"signedUpLastThirtyDays.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-signUp>\n <tr>\n <td data-head=\"Owner\">\n {{ signUp.owner?.first_name }} {{ signUp.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ signUp.contact_name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ signUp.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"signedUpLastThirtyDays.length!== 0\">{{ 'Label.Total' | transloco }}: {{ signedUpLastThirtyDays.length }}</span>\n </div>\n <div *ngIf=\"signedUpLastThirtyDays?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Active Opportunities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Active Opportunities</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!activeOpportunitiesLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"activeOpportunities?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"activeOpportunities\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"activeOpportunities.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.OneTimeAmount' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.WinChance' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.MonthlyAmount' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-opportunities>\n <tr>\n <td data-head=\"Title\">\n {{ opportunities.title }}\n </td>\n <td data-head=\"Contact Name\">\n {{ opportunities.crm_contact?.first_name }}\n {{ opportunities.crm_contact?.last_name }}\n </td>\n <td data-head=\"Account\">\n {{ opportunities.crm_account?.name }}\n </td>\n <td data-head=\"One Time Amount\">\n {{ opportunities.one_time_amount / 100 | currency }}\n </td>\n <td data-head=\"Monthly Amount\">\n {{ opportunities.monthly_amount / 100 | currency }}\n </td>\n <td data-head=\"Win Chance\">\n {{ opportunities.win_chances | percent }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"activeOpportunities.length !== 0\">{{ 'Label.Total' | transloco }}: {{ activeOpportunities.length }}</span>\n </div>\n <div *ngIf=\"activeOpportunities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Accounts at risk -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Accounts at Risk</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!accountAtRiskDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"accountAtRisk?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"accountAtRisk\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"accountAtRisk.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountAtRisk.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountAtRisk.length }}</span>\n </div>\n <div *ngIf=\"accountAtRisk?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Contract renewal -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contract Renewal</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactRenewalLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"ContractRenewal?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"ContractRenewal\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"ContractRenewal.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"ContractRenewal.length !== 0\">{{ 'Label.Total' | transloco }}: {{ ContractRenewal.length }}</span>\n </div>\n <div *ngIf=\"ContractRenewal?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Credit Card Expiring -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Credit Card Expiring</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!creditCardExpiringDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"creditCardExpiring?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"creditCardExpiring\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"creditCardExpiring.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"creditCardExpiring.length !== 0\">{{ 'Label.Total' | transloco }}: {{ creditCardExpiring.length }}</span>\n </div>\n <div *ngIf=\"creditCardExpiring?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Magic Moment -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Magic Moment</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!magicMomentLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"magicMoment?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"magicMoment\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"magicMoment.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Owner' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactName' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Organisation' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.ContactEmail' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Owner\">\n {{ account.owner?.first_name }} {{ account.owner?.last_name }}\n </td>\n <td data-head=\"Contact Name\">\n {{ account.contact_name }}\n </td>\n <td data-head=\"Organisation\">\n {{ account.name }}\n </td>\n <td data-head=\"Contact Email\">\n {{ account.contact_email }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"magicMoment.length !==0 \">{{ 'Label.Total' | transloco }}: {{ magicMoment.length }}</span>\n </div>\n <div *ngIf=\"magicMoment?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n </ng-container>\n</div>\n" }]
5655
+ args: [{ selector: 'pw-smart-crm-summary-others', template: "<div class=\"row\">\n <ng-container class=\"mt-5\"\n *rbacAllow=\"'Pages.Beta'\">\n <!-- Signed up last 30 days -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Signed up Last 30 Days</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!signUpLastThirtyDaysLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"signedUpLastThirtyDays?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"signedUpLastThirtyDays\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"signedUpLastThirtyDays.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-signUp>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, signUp.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"signUp.crm_account_name\">{{ signUp?.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ signUp.expected_mrr / 100 | currency: signUp.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ signUp.signed_up_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"signedUpLastThirtyDays.length!== 0\">{{ 'Label.Total' | transloco }}: {{ signedUpLastThirtyDays.length }}</span>\n </div>\n <div *ngIf=\"signedUpLastThirtyDays?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Active Opportunities -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Active Opportunities</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!activeOpportunitiesLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"activeOpportunities?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"activeOpportunities\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"activeOpportunities.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.OneTimeAmount' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.MonthlyAmount' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.Summary.WinChance' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-opportunities>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, opportunities.crm_account?.id]\" class=\"name-link\">\n <span [ngbTooltip]=\"opportunities.crm_account?.name\">{{ opportunities.crm_account?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Title\">\n <a [ngbTooltip]=\"opportunities?.title\" *ngIf=\"\n hasAccess ||\n opportunities?.owner_id === userId ||\n checkPermission('Pages.Product.CRM.Role.Admin')\n \" [routerLink]=\"[\n '/' + subscription?.slug + routers.opportunityInfo,\n opportunities.id\n ]\">\n <span>{{ opportunities?.title | textTruncate: 20 }} </span>\n </a>\n </td>\n <td data-head=\"One Time Amount\"> {{ opportunities.one_time_amount / 100 | currency }} </td>\n <td data-head=\"Monthly Amount\"> {{ opportunities.monthly_amount / 100 | currency }} </td>\n <td data-head=\"Win Chance\"> {{ opportunities.win_chances / 100 | percent }} <span class=\"text-danger\"\n *ngIf=\"opportunities.cancelled\">!Cancelled!</span>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"activeOpportunities.length !== 0\">{{ 'Label.Total' | transloco }}: {{ activeOpportunities.length }}</span>\n </div>\n <div *ngIf=\"activeOpportunities?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Accounts at risk -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Accounts at Risk</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!accountAtRiskDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"accountAtRisk?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"accountAtRisk\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"accountAtRisk.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account?.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"accountAtRisk.length !== 0\">{{ 'Label.Total' | transloco }}: {{ accountAtRisk.length }}</span>\n </div>\n <div *ngIf=\"accountAtRisk?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Contract renewal -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contract Renewal</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactRenewalLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"ContractRenewal?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"ContractRenewal\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"ContractRenewal.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n\n <th scope=\"true\">{{ 'Crm.AccountMessage.Quarter' | transloco }}</th>\n <th scope=\"true\"> {{ 'Crm.AccountMessage.Month' | transloco }}</th>\n\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.ExpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"Quarter\">{{ account.sessions_last_quarter }}</td>\n <td data-head=\"Month\">{{ account.sessions_last_month }}</td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n <td data-head=\"ExpAt\">\n {{ account.cc_expiring_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"ContractRenewal.length !== 0\">{{ 'Label.Total' | transloco }}: {{ ContractRenewal.length }}</span>\n </div>\n <div *ngIf=\"ContractRenewal?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Credit Card Expiring -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Credit Card Expiring</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!creditCardExpiringDetailsLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"creditCardExpiring?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"creditCardExpiring\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"creditCardExpiring.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.AccountMessage.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.ExpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n <td data-head=\"ExpAt\">\n {{ account.cc_expiring_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"creditCardExpiring.length !== 0\">{{ 'Label.Total' | transloco }}: {{ creditCardExpiring.length }}</span>\n </div>\n <div *ngIf=\"creditCardExpiring?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n <!-- Magic Moment -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Magic Moment</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!magicMomentLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\"\n *ngIf=\"magicMoment?.length\">\n <p-table class=\"table\"\n #dt\n [value]=\"magicMoment\"\n [paginator]=\"true\"\n [rows]=\"PAGE_SIZE\"\n\n [totalRecords]=\"magicMoment.length\"\n [lazy]=\"true\">\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Crm.Summary.Account' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.MRR' | transloco }}</th>\n <th scope=\"true\">{{ 'Crm.AccountMessage.SignUpAt' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-account>\n <tr>\n <td data-head=\"Account\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.accountInfo, account.crm_account_id]\" class=\"name-link\">\n <span [ngbTooltip]=\"account.crm_account_name\">{{ account?.crm_account_name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"MRR\">\n {{ account.expected_mrr / 100 | currency: account.currency }}\n </td>\n <td data-head=\"SignUpAt\">\n {{ account.signed_up_at | dateFormat }}\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"magicMoment.length !==0 \">{{ 'Label.Total' | transloco }}: {{ magicMoment.length }}</span>\n </div>\n <div *ngIf=\"magicMoment?.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.Summary.NoInsightMessage' | transloco\"> </pw-no-data>\n </div>\n </div>\n </ng-container>\n</div>\n" }]
5669
5656
  }], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }] });
5670
5657
 
5671
5658
  class SmartCrmSummaryComponent {