@posiwise/smart-crm 0.0.38 → 0.0.39
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/private/components/smart-crm-actions/smart-crm-actions.component.mjs +9 -7
- package/esm2022/lib/private/components/smart-crm-contacts/smart-crm-contacts.component.mjs +3 -3
- package/esm2022/lib/private/components/smart-crm-insight/smart-crm-contact-insight/smart-crm-contact-insight.component.mjs +3 -3
- package/fesm2022/posiwise-smart-crm.mjs +8 -7
- package/fesm2022/posiwise-smart-crm.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -56,10 +56,11 @@ import { moveItemInArray, transferArrayItem, DragDropModule } from '@angular/cdk
|
|
|
56
56
|
import uniqBy from 'lodash/uniqBy';
|
|
57
57
|
import * as i4$3 from 'ngx-pagination';
|
|
58
58
|
import { NgxPaginationModule } from 'ngx-pagination';
|
|
59
|
+
import * as i12$2 from 'primeng/dropdown';
|
|
60
|
+
import { DropdownModule } from 'primeng/dropdown';
|
|
59
61
|
import { PageAccessGuard } from '@posiwise/core-guards';
|
|
60
62
|
import { AppConfigService } from '@posiwise/app-config-service';
|
|
61
63
|
import { CoreTranslocoModule } from '@posiwise/core-transloco';
|
|
62
|
-
import { DropdownModule } from 'primeng/dropdown';
|
|
63
64
|
import { Loader } from '@googlemaps/js-api-loader';
|
|
64
65
|
import { StatusCodes } from 'http-status-codes';
|
|
65
66
|
import * as i3$1 from '@posiwise/layouts';
|
|
@@ -3358,11 +3359,11 @@ class SmartCrmContactComponent extends AppBaseComponent {
|
|
|
3358
3359
|
super.ngOnDestroy();
|
|
3359
3360
|
}
|
|
3360
3361
|
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 }); }
|
|
3361
|
-
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 *ngIf=\"hasAccess || accountData.owner_id === userId\" [routerLink]=\"['/' + subscription?.slug + 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]\"\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]=\"true\"\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]=\"true\"\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 <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 (keydown.enter)=\"onDelete(contact.id)\"\n (keydown.space)=\"onDelete(contact.id)\"\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>\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded && !accountData?.name\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</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 [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 <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\">Contacts Location</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [config]=\"contactGeography?.config\"\n [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\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_sub_bg: rgb(70, 136, 236);--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: 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: i4$2.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: i8$1.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.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: i11$1.TranslocoPipe, name: "transloco" }] }); }
|
|
3362
|
+
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 *ngIf=\"hasAccess || accountData.owner_id === userId\" [routerLink]=\"['/' + subscription?.slug + 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]\"\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]=\"true\"\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]=\"true\"\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 <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 (keydown.enter)=\"onDelete(contact.id)\"\n (keydown.space)=\"onDelete(contact.id)\"\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>\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded && !accountData?.name\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</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 [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 <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\">\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\">Contacts Location</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [config]=\"contactGeography?.config\"\n [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\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_sub_bg: rgb(70, 136, 236);--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: 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: i4$2.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: i8$1.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.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: i11$1.TranslocoPipe, name: "transloco" }] }); }
|
|
3362
3363
|
}
|
|
3363
3364
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmContactComponent, decorators: [{
|
|
3364
3365
|
type: Component,
|
|
3365
|
-
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 *ngIf=\"hasAccess || accountData.owner_id === userId\" [routerLink]=\"['/' + subscription?.slug + 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]\"\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]=\"true\"\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]=\"true\"\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 <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 (keydown.enter)=\"onDelete(contact.id)\"\n (keydown.space)=\"onDelete(contact.id)\"\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>\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded && !accountData?.name\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</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 [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 <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\">Contacts Location</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [config]=\"contactGeography?.config\"\n [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\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_sub_bg: rgb(70, 136, 236);--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"] }]
|
|
3366
|
+
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 *ngIf=\"hasAccess || accountData.owner_id === userId\" [routerLink]=\"['/' + subscription?.slug + 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]\"\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]=\"true\"\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]=\"true\"\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 <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 (keydown.enter)=\"onDelete(contact.id)\"\n (keydown.space)=\"onDelete(contact.id)\"\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>\n <div class=\"row mt-5\"\n *ngIf=\"isLoaded && !accountData?.name\">\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</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 [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 <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\">\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\">Contacts Location</h5>\n <div>\n <ng-template [ngIf]=\"contactGeography\">\n <plotly-plot [data]=\"contactGeography?.data\"\n [config]=\"contactGeography?.config\"\n [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\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_sub_bg: rgb(70, 136, 236);--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"] }]
|
|
3366
3367
|
}], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
|
|
3367
3368
|
|
|
3368
3369
|
class SmartCrmCustomerSuccessComponent {
|
|
@@ -3607,11 +3608,11 @@ class SmartCrmContactInsightComponent extends AppBaseComponent {
|
|
|
3607
3608
|
super.ngOnDestroy();
|
|
3608
3609
|
}
|
|
3609
3610
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmContactInsightComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i2$3.AdminService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3610
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmContactInsightComponent, selector: "pw-smart-crm-contact-insight", usesInheritance: true, ngImport: i0, template: "\n\n<app-date-picker\n[selectedDateRange]=\"selectedDateRange\"\n[dateRanges]=\"dateRanges\"\n(dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n\n<div class=\"row mt-5\">\n\n <!-- User Base Graph -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contact Evolution Timeline</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!userBaseLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"userBaseLoaded && userBaseData?.data?.length\">\n <plotly-plot [data]=\"userBaseData?.data\"\n [config]=\"userBaseData?.config\"\n [layout]=\"userBaseData?.layout\" [useResizeHandler]=\"true\"></plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"userBaseLoaded && !userBaseData?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contacts Location</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!geographyLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"geographyLoaded && contactGeography?.data?.length\">\n <plotly-plot [data]=\"contactGeography?.data\" [config]=\"contactGeography?.config\" [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"geographyLoaded && !contactGeography?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactInsightLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"contactInsightLoaded && contactInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"contactInsight\" [paginator]=\"contactInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"contactInsight.length\" [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\" let-insight>\n <tr>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, insight.crm_contact_id]\"\n class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Headline\">\n <span [ngbTooltip]=\"insight?.headline\" container=\"body\" tooltipClass=\"custom-tooltip\" placement=\"bottom\"> {{\n insight?.headline | textTruncate: 20 }} </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=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"contactInsight?.length
|
|
3611
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartCrmContactInsightComponent, selector: "pw-smart-crm-contact-insight", usesInheritance: true, ngImport: i0, template: "\n\n<app-date-picker\n[selectedDateRange]=\"selectedDateRange\"\n[dateRanges]=\"dateRanges\"\n(dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n\n<div class=\"row mt-5\">\n\n <!-- User Base Graph -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contact Evolution Timeline</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!userBaseLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"userBaseLoaded && userBaseData?.data?.length\">\n <plotly-plot [data]=\"userBaseData?.data\"\n [config]=\"userBaseData?.config\"\n [layout]=\"userBaseData?.layout\" [useResizeHandler]=\"true\"></plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"userBaseLoaded && !userBaseData?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contacts Location</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!geographyLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"geographyLoaded && contactGeography?.data?.length\">\n <plotly-plot [data]=\"contactGeography?.data\" [config]=\"contactGeography?.config\" [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"geographyLoaded && !contactGeography?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactInsightLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"contactInsightLoaded && contactInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"contactInsight\" [paginator]=\"contactInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"contactInsight.length\" [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\" let-insight>\n <tr>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, insight.crm_contact_id]\"\n class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Headline\">\n <span [ngbTooltip]=\"insight?.headline\" container=\"body\" tooltipClass=\"custom-tooltip\" placement=\"bottom\"> {{\n insight?.headline | textTruncate: 20 }} </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=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"!contactInsight?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n </div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: i4$2.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: i11.DateRangePickerComponent, selector: "app-date-picker", inputs: ["selectedDateRange", "dateRanges"], outputs: ["dateRangeChange"] }, { kind: "directive", type: i8.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: i14.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: i11$1.TranslocoPipe, name: "transloco" }] }); }
|
|
3611
3612
|
}
|
|
3612
3613
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartCrmContactInsightComponent, decorators: [{
|
|
3613
3614
|
type: Component,
|
|
3614
|
-
args: [{ selector: 'pw-smart-crm-contact-insight', template: "\n\n<app-date-picker\n[selectedDateRange]=\"selectedDateRange\"\n[dateRanges]=\"dateRanges\"\n(dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n\n<div class=\"row mt-5\">\n\n <!-- User Base Graph -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contact Evolution Timeline</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!userBaseLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"userBaseLoaded && userBaseData?.data?.length\">\n <plotly-plot [data]=\"userBaseData?.data\"\n [config]=\"userBaseData?.config\"\n [layout]=\"userBaseData?.layout\" [useResizeHandler]=\"true\"></plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"userBaseLoaded && !userBaseData?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contacts Location</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!geographyLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"geographyLoaded && contactGeography?.data?.length\">\n <plotly-plot [data]=\"contactGeography?.data\" [config]=\"contactGeography?.config\" [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"geographyLoaded && !contactGeography?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactInsightLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"contactInsightLoaded && contactInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"contactInsight\" [paginator]=\"contactInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"contactInsight.length\" [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\" let-insight>\n <tr>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, insight.crm_contact_id]\"\n class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Headline\">\n <span [ngbTooltip]=\"insight?.headline\" container=\"body\" tooltipClass=\"custom-tooltip\" placement=\"bottom\"> {{\n insight?.headline | textTruncate: 20 }} </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=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"contactInsight?.length
|
|
3615
|
+
args: [{ selector: 'pw-smart-crm-contact-insight', template: "\n\n<app-date-picker\n[selectedDateRange]=\"selectedDateRange\"\n[dateRanges]=\"dateRanges\"\n(dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n\n<div class=\"row mt-5\">\n\n <!-- User Base Graph -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contact Evolution Timeline</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!userBaseLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"userBaseLoaded && userBaseData?.data?.length\">\n <plotly-plot [data]=\"userBaseData?.data\"\n [config]=\"userBaseData?.config\"\n [layout]=\"userBaseData?.layout\" [useResizeHandler]=\"true\"></plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"userBaseLoaded && !userBaseData?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Geography -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Contacts Location</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!geographyLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div>\n <ng-template [ngIf]=\"geographyLoaded && contactGeography?.data?.length\">\n <plotly-plot [data]=\"contactGeography?.data\" [config]=\"contactGeography?.config\" [layout]=\"contactGeography?.layout\" [useResizeHandler]=\"true\">\n </plotly-plot>\n </ng-template>\n </div>\n <div *ngIf=\"geographyLoaded && !contactGeography?.data?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n <!-- Drill Down -->\n <div class=\"col-12 col-md-6 mb-3 analytics\">\n <h5 class=\"accordion-heading\">Watch Closely</h5>\n <div class=\"w-100 text-center mt-3\">\n <ng-template [ngIf]=\"!contactInsightLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </ng-template>\n </div>\n <div class=\"primeng-datatable-container table-responsive\" *ngIf=\"contactInsightLoaded && contactInsight?.length\">\n <p-table class=\"table\" #dt [value]=\"contactInsight\" [paginator]=\"contactInsight?.length !== 0\" [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"contactInsight.length\" [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\" let-insight>\n <tr>\n <td data-head=\"Contact\">\n <a [routerLink]=\"['/' + subscription?.slug + routers.contactInfo, insight.crm_contact_id]\"\n class=\"name-link\">\n <span [ngbTooltip]=\"insight?.name\">{{ insight?.name | textTruncate:20 }}</span>\n </a>\n </td>\n <td data-head=\"Headline\">\n <span [ngbTooltip]=\"insight?.headline\" container=\"body\" tooltipClass=\"custom-tooltip\" placement=\"bottom\"> {{\n insight?.headline | textTruncate: 20 }} </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=\"contactInsight?.length !== 0\">Total: {{ contactInsight.length }}</span>\n </div>\n <div *ngIf=\"!contactInsight?.length\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Crm.ContactMessage.NoInsightMessage' | transloco\">\n </pw-no-data>\n </div>\n </div>\n\n </div>\n" }]
|
|
3615
3616
|
}], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i2$3.AdminService }] });
|
|
3616
3617
|
|
|
3617
3618
|
class SmartCrmOpportunitiesInsightComponent extends AppBaseComponent {
|
|
@@ -6215,11 +6216,11 @@ class CrmActionsComponent extends AppBaseComponent {
|
|
|
6215
6216
|
super.ngOnDestroy();
|
|
6216
6217
|
}
|
|
6217
6218
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CrmActionsComponent, deps: [{ token: i1.CrmService }, { token: i0.Injector }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6218
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: CrmActionsComponent, selector: "pw-crm-actions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-4\">\n <div class=\"col-12 mb-0\">\n <h2>{{ 'Crm.Actions.Title' | transloco }}</h2>\n </div>\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.contactAdd]\"\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.Actions.ActionMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div #selector 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>\n <ng-container *ngIf=\"action.owner?.user_avatar?.length > 0; else noProfileImg\">\n <ng-container *ngFor=\"let owner_image of action.owner?.user_avatar\">\n <div class=\"text-center my-2\" *ngIf=\"owner_image.width === 50\" [ngbTooltip]=\"action.owner.first_name + ' ' +action.owner.last_name\">\n <div class=\"avatar avatar-image\">\n <img\n class=\"img-fluid\"\n [src]=\"owner_image.url\"\n alt=\"Male Icon\"\n (error)=\"handleImageError($event, 'assets/img/icons/male.png')\"\n />\n </div>\n </div>\n </ng-container>\n </ng-container>\n\n <ng-template #noProfileImg>\n <div class=\"text-center my-2\">\n <div class=\"avatar avatar-image\">\n <img\n src=\"/assets/img/icons/male.png\"\n alt=\"\"\n class=\"img-fluid\"\n />\n </div>\n </div>\n </ng-template>\n </li>\n\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n aria-label=\"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 aria-label=\"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 aria-label=\"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\">AI 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\n <div #suggestedActionsSelector *ngIf=\"accountActionSuggested?.length > 0\" class=\"suggested-actions-wrapper\"\n infiniteScroll\n [infiniteScrollContainer]=\"suggestedActionsSelector\"\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\">\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>\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.Actions.ActionSuggestionsMessage' | 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_sub_bg: rgb(70, 136, 236);--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}.avatar-image{height:25px;width:25px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper,.suggested-actions-wrapper{overflow-y:auto;height:calc(100vh - 150px)}\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$3.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { 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$3.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i11$1.TranslocoPipe, name: "transloco" }] }); }
|
|
6219
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: CrmActionsComponent, selector: "pw-crm-actions", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-4\">\n <div class=\"col-12 mb-0\">\n <h2>{{ 'Crm.Actions.Title' | transloco }}</h2>\n </div>\n <div class=\"col-12 col-sm-3 float-start mb-2\"\n *ngIf=\"showFilter\">\n <p-dropdown\n [options]=\"allSubscriptionMembers\"\n optionLabel=\"first_name\"\n optionValue=\"id\"\n [ngModel]=\"0\"\n (onChange)=\"filterByUser($event.value)\">\n\n <ng-template pTemplate=\"selectedItem\" let-selected>\n <span *ngIf=\"selected\">\n {{ selected.first_name }} {{ selected.last_name }}\n </span>\n </ng-template>\n\n <ng-template pTemplate=\"item\" let-option>\n {{ option.first_name }} {{ option.last_name }}\n </ng-template>\n</p-dropdown>\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.contactAdd]\"\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.Actions.ActionMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div #selector 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>\n <ng-container *ngIf=\"action.owner?.user_avatar?.length > 0; else noProfileImg\">\n <ng-container *ngFor=\"let owner_image of action.owner?.user_avatar\">\n <div class=\"text-center my-2\" *ngIf=\"owner_image.width === 50\" [ngbTooltip]=\"action.owner.first_name + ' ' +action.owner.last_name\">\n <div class=\"avatar avatar-image\">\n <img\n class=\"img-fluid\"\n [src]=\"owner_image.url\"\n alt=\"Male Icon\"\n (error)=\"handleImageError($event, 'assets/img/icons/male.png')\"\n />\n </div>\n </div>\n </ng-container>\n </ng-container>\n\n <ng-template #noProfileImg>\n <div class=\"text-center my-2\">\n <div class=\"avatar avatar-image\">\n <img\n src=\"/assets/img/icons/male.png\"\n alt=\"\"\n class=\"img-fluid\"\n />\n </div>\n </div>\n </ng-template>\n </li>\n\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n aria-label=\"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 aria-label=\"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 aria-label=\"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\">AI 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\n <div #suggestedActionsSelector *ngIf=\"accountActionSuggested?.length > 0\" class=\"suggested-actions-wrapper\"\n infiniteScroll\n [infiniteScrollContainer]=\"suggestedActionsSelector\"\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\">\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>\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.Actions.ActionSuggestionsMessage' | 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_sub_bg: rgb(70, 136, 236);--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}.avatar-image{height:25px;width:25px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper,.suggested-actions-wrapper{overflow-y:auto;height:calc(100vh - 150px)}\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: "component", type: i4$3.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "directive", type: i5.LazyImgDirective, selector: "img" }, { 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: "directive", type: i8.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: 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: "component", type: i12$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "pipe", type: i2$1.SlicePipe, name: "slice" }, { kind: "pipe", type: i4$3.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i11$1.TranslocoPipe, name: "transloco" }] }); }
|
|
6219
6220
|
}
|
|
6220
6221
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CrmActionsComponent, decorators: [{
|
|
6221
6222
|
type: Component,
|
|
6222
|
-
args: [{ selector: 'pw-crm-actions', template: "<div class=\"row\">\n <div class=\"col-12 mb-4\">\n <div class=\"col-12 mb-0\">\n <h2>{{ 'Crm.Actions.Title' | transloco }}</h2>\n </div>\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.contactAdd]\"\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.Actions.ActionMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div #selector 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>\n <ng-container *ngIf=\"action.owner?.user_avatar?.length > 0; else noProfileImg\">\n <ng-container *ngFor=\"let owner_image of action.owner?.user_avatar\">\n <div class=\"text-center my-2\" *ngIf=\"owner_image.width === 50\" [ngbTooltip]=\"action.owner.first_name + ' ' +action.owner.last_name\">\n <div class=\"avatar avatar-image\">\n <img\n class=\"img-fluid\"\n [src]=\"owner_image.url\"\n alt=\"Male Icon\"\n (error)=\"handleImageError($event, 'assets/img/icons/male.png')\"\n />\n </div>\n </div>\n </ng-container>\n </ng-container>\n\n <ng-template #noProfileImg>\n <div class=\"text-center my-2\">\n <div class=\"avatar avatar-image\">\n <img\n src=\"/assets/img/icons/male.png\"\n alt=\"\"\n class=\"img-fluid\"\n />\n </div>\n </div>\n </ng-template>\n </li>\n\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n aria-label=\"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 aria-label=\"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 aria-label=\"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\">AI 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\n <div #suggestedActionsSelector *ngIf=\"accountActionSuggested?.length > 0\" class=\"suggested-actions-wrapper\"\n infiniteScroll\n [infiniteScrollContainer]=\"suggestedActionsSelector\"\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\">\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>\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.Actions.ActionSuggestionsMessage' | 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_sub_bg: rgb(70, 136, 236);--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}.avatar-image{height:25px;width:25px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper,.suggested-actions-wrapper{overflow-y:auto;height:calc(100vh - 150px)}\n"] }]
|
|
6223
|
+
args: [{ selector: 'pw-crm-actions', template: "<div class=\"row\">\n <div class=\"col-12 mb-4\">\n <div class=\"col-12 mb-0\">\n <h2>{{ 'Crm.Actions.Title' | transloco }}</h2>\n </div>\n <div class=\"col-12 col-sm-3 float-start mb-2\"\n *ngIf=\"showFilter\">\n <p-dropdown\n [options]=\"allSubscriptionMembers\"\n optionLabel=\"first_name\"\n optionValue=\"id\"\n [ngModel]=\"0\"\n (onChange)=\"filterByUser($event.value)\">\n\n <ng-template pTemplate=\"selectedItem\" let-selected>\n <span *ngIf=\"selected\">\n {{ selected.first_name }} {{ selected.last_name }}\n </span>\n </ng-template>\n\n <ng-template pTemplate=\"item\" let-option>\n {{ option.first_name }} {{ option.last_name }}\n </ng-template>\n</p-dropdown>\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.contactAdd]\"\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.Actions.ActionMessage' | transloco\"> </pw-no-data>\n </div>\n <!-- wrapper for infinite scroll -->\n <div #selector 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>\n <ng-container *ngIf=\"action.owner?.user_avatar?.length > 0; else noProfileImg\">\n <ng-container *ngFor=\"let owner_image of action.owner?.user_avatar\">\n <div class=\"text-center my-2\" *ngIf=\"owner_image.width === 50\" [ngbTooltip]=\"action.owner.first_name + ' ' +action.owner.last_name\">\n <div class=\"avatar avatar-image\">\n <img\n class=\"img-fluid\"\n [src]=\"owner_image.url\"\n alt=\"Male Icon\"\n (error)=\"handleImageError($event, 'assets/img/icons/male.png')\"\n />\n </div>\n </div>\n </ng-container>\n </ng-container>\n\n <ng-template #noProfileImg>\n <div class=\"text-center my-2\">\n <div class=\"avatar avatar-image\">\n <img\n src=\"/assets/img/icons/male.png\"\n alt=\"\"\n class=\"img-fluid\"\n />\n </div>\n </div>\n </ng-template>\n </li>\n\n <li class=\"list-inline-item float-end\">\n <a *ngIf=\"action?.crm_contact\"\n ngbTooltip=\"See this contact\"\n aria-label=\"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 aria-label=\"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 aria-label=\"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\">AI 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\n <div #suggestedActionsSelector *ngIf=\"accountActionSuggested?.length > 0\" class=\"suggested-actions-wrapper\"\n infiniteScroll\n [infiniteScrollContainer]=\"suggestedActionsSelector\"\n [infiniteScrollDistance]=\"2\"\n [infiniteScrollThrottle]=\"50\">\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>\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.Actions.ActionSuggestionsMessage' | 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_sub_bg: rgb(70, 136, 236);--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}.avatar-image{height:25px;width:25px}.when-btn:focus{border:0;box-shadow:none}.pending-actions-wrapper,.suggested-actions-wrapper{overflow-y:auto;height:calc(100vh - 150px)}\n"] }]
|
|
6223
6224
|
}], ctorParameters: () => [{ type: i1.CrmService }, { type: i0.Injector }, { type: Document, decorators: [{
|
|
6224
6225
|
type: Inject,
|
|
6225
6226
|
args: [DOCUMENT]
|