@amc-technology/ui-library 1.0.101 → 1.0.102
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/README.md +25 -8
- package/esm2022/projects/UILibrary/src/app/components/activity/activity.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/chat-box/chat-box.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/chat-message/chat-message.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/create/create.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/current-activity/current-activity.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/disposition/disposition.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/duration/duration.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/holdtimer/holdtimer.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/interaction/interaction.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/login/login.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/operation/operation.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/property/property.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/recent-activity/recent-activity.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/scenario/scenario.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/components/search-information/search-information.component.mjs +3 -3
- package/esm2022/projects/UILibrary/src/app/uilibrary.module.mjs +4 -4
- package/fesm2022/amc-technology-ui-library.mjs +49 -49
- package/package.json +1 -1
- package/webcomponents/webcomponents.js +1 -1
package/README.md
CHANGED
|
@@ -1,10 +1,27 @@
|
|
|
1
|
-
# Deploy UI LIbrary
|
|
2
1
|
|
|
3
|
-
##
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
## Project Setup and running things locally.
|
|
3
|
+
The UI Library repo contains two projects, the UI Library module/components themselves (projects/UILibrary), and the UI library Tester (src/). In order to run the UILibrary itself in storybook install node modules(NPM I) and run ng run UILibraryTester:storybook. In order to run the UILibrary tester simply run ng serve.
|
|
4
|
+
## Shared componets.
|
|
5
|
+
Components available in [UILibraryModule](https://amc-ui-lib-docs.azurewebsites.net/modules/UILibraryModule.html) are shared through `@amc/ui-library` latest npm package.<br />
|
|
6
|
+
|
|
7
|
+
## Deploying a beta release to npm
|
|
8
|
+
|
|
9
|
+
1. Create a feature branch based off of dev/master in which you will develop new features/UI.
|
|
10
|
+
2. Once one is ready to push the commits containing changes and test the new features/UI, update the package.json version number to be the same version that was last released to NPM (find the latest version number it doesn't matter if it was a beta or latest release).
|
|
11
|
+
3. Ensure the package.json version was updated and committed and create a PR to merge your feature branch into dev branch.
|
|
12
|
+
4. Successful approval of the PR will trigger the dev build pipeline to run which will package the repo into a tarball file that will be used by the beta release pipeline.
|
|
13
|
+
5. On success of the build pipeline, approve the beta release pipeline to run. This pipeline will extract the files from the tarball and publish a new beta release of the UI library package to NPM.
|
|
14
|
+
6. Test the beta release in another project by modifying the @amc-technology/ui-library package.json depedency to use the exact version that was just released to beta and perform an NPM I.
|
|
6
15
|
|
|
7
|
-
##
|
|
16
|
+
## Deploying a latest release to npm
|
|
17
|
+
1. In order to build and release a production (latest) version of the package to NPM once again create a feature branch off of dev/master. Ideally, you use the same feature branch that you used to develop changes for a beta release that you have already tested and published to NPM.
|
|
18
|
+
2. Note that you should not initiate a PR to merge the dev branch into the master branch. If you have tested the beta release of the NPM package and want the changes/features created to be pushed to production so that other applications can use the new features, create a PR to merge the feature branch to master.
|
|
19
|
+
3. Before creating this PR, ensure that the project/package version inside of package.json is the same version that was last released to NPM. Also, be sure to delete any unnecessary commits/tags from your local project before pushing to the origin branch.
|
|
20
|
+
4. Next create the PR, and get it approved for a merge. After a successful merge to the master branch the prod build pipeline will run and package the project into a tarball file that will be used by the latest release pipeline.
|
|
21
|
+
5. On success of the build pipeline, approve the latest release pipeline to run. This pipeline will extract the files from the tarball and publish a new latest release of the UI library package to NPM.
|
|
22
|
+
6. Confirm that the package was released on NPM with the highest version to date and that the tag is listed as latest. Now projects using the UILibrary will use the new version of the package you just released unless specifying an earlier version.
|
|
23
|
+
|
|
24
|
+
## Old way of deploying NPM package (Can still use this script for releasing documentation)
|
|
8
25
|
|
|
9
26
|
From the root of the project run `publish_lib_doc` powershell script. <br />
|
|
10
27
|
It will prompt for azure username and password. <br />
|
|
@@ -12,6 +29,6 @@ It will create a new version of `@amc/ui-library` npm package. <br />
|
|
|
12
29
|
It will create new npm package and update the [docs](https://amc-ui-lib-docs.azurewebsites.net/index.html) related to it. <br />
|
|
13
30
|
If one wants to just deploy doc not npm package then additional `-pub_lib $false` parameter can be supplied. e.g. `.\publish_lib_doc.ps1 -pub_lib $false`
|
|
14
31
|
|
|
15
|
-
##
|
|
16
|
-
|
|
17
|
-
|
|
32
|
+
## Prerequisite (Not needed unless you want to release documentation or a new version of UILibrary with the old script):
|
|
33
|
+
Need to have [Azure CLI](https://docs.microsoft.com/en-us/cli/azure/install-azure-cli-windows?view=azure-cli-latest) installed.
|
|
34
|
+
Need to have npm set up and logged in according to CCF [doc](https://cccf-api-docs.azurewebsites.net/index.html). <br />
|
|
@@ -57,10 +57,10 @@ export class ActivityComponent {
|
|
|
57
57
|
activitySave(clearActivityFields) {
|
|
58
58
|
this.ActivitySave.emit(this.activity);
|
|
59
59
|
}
|
|
60
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
61
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
60
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: ActivityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
61
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: ActivityComponent, selector: "app-activity", inputs: { activity: "activity" }, outputs: { ActivitySave: "ActivitySave", OnNameSelectChange: "OnNameSelectChange", OnRelatedToChange: "OnRelatedToChange", OnSubjectChange: "OnSubjectChange", OnCallNotesChange: "OnCallNotesChange" }, ngImport: i0, template: "<div *ngIf=\"isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_collapse.png\" (click)=\"isActivityMaximized = false\" title=\"Collapse\">\r\n </div>\r\n <div class=\"callBody\">\r\n <div class=\"activityFields\">\r\n <form>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Call From\">{{activity.NameFieldName}}</label>\r\n <select class=\"dropDownListStyle displayData\" data-resetperactivity=\"false\" (change)=\"onNameSelectChange($event)\">\r\n <option *ngFor=\"let who of activity.whoList\" value=\"{{who.objectId}}\">{{parseWhoObject(who)}}</option>\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Related To\">{{activity.RelatedToFieldName}}</label>\r\n <select class=\"dropDownListStyle displayData\" (change)=\"onRelatedToChange($event)\" data-resetperactivity=\"false\">\r\n <option *ngFor=\"let what of activity.whatList\" value=\"{{what.objectId}}\">{{parseWhatObject(what)}}</option>\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Subject\">{{activity.SubjectFieldName}}</label>\r\n <input class=\"activitySubjectTextBoxStyle displayData\" (change)=\"onSubjectChange($event)\" title=\"{{activity.Subject}}\"\r\n type=\"text\" value=\"{{activity.Subject}}\">\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <div class=\"callNotesContainer\">\r\n <div class=\"textAreaDiv\">\r\n <textarea value=\"{{activity.Description}}\" placeholder=\"Click to add a comment\" class=\"activityCommentsTextBoxStyle\"\r\n (change)=\"onCallNotesChange($event)\" cols=\"20\" rows=\"2\" title=\"\"></textarea>\r\n </div>\r\n <div class=\"notesButtonBorder\">\r\n <div class=\"commentsButtonDiv\">\r\n <div class=\"quickCommentsDiv\">\r\n <input *ngFor=\"let quickComment of activity.quickCommentList ; let i = index;\" class=\"quickNotesBotton\" type=\"button\"\r\n value=\"{{i+1}}\" (click)=\"loadQuickComment(i)\" title=\"{{quickComment}}\">\r\n </div>\r\n <div class=\"submitDiv\">\r\n <input class=\"submitButton\" type=\"button\" value=\"Submit\" (click)=\"activitySave(false)\">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"!isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"assets/images/section_expand.png\" (click)=\"isActivityMaximized = true\" title=\"Expand\">\r\n </div>\r\n", styles: [".callDisplay{display:grid;margin-bottom:8px;background-color:#fff}.editor{font-size:.9em;width:70%;text-align:left;margin:4px 5% 0 0;font-family:Arial;white-space:nowrap;text-overflow:ellipsis;border:0;padding-top:2px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.callHeader{background-color:#f4f5fb!important;width:100%!important;margin-top:0!important}.headerLabel{margin-left:10px}.ViewResizeImage{width:20px;height:20px;float:right;cursor:pointer}.callBody{border-top:0;position:relative}.displayDiv{width:100%;display:flex}.displayLabels{margin-left:5px;width:25%;margin-right:2px}.displayData{width:70%}.dropDownListStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;white-space:nowrap!important;text-overflow:ellipsis!important;margin:0 5px 0 0;cursor:pointer}.activitySubjectTextBoxStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin:0 5px 0 0;padding-left:2px}.activityCommentsTextBoxStyle{border:none;color:#333!important;text-align:left!important;margin:0 0% 0 0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;resize:none;width:100%;height:95px}.notesButtonBorder{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-bottom-left-radius:3px!important;border-bottom-right-radius:3px!important;height:auto}.commentsButtonDiv{width:100%;display:flex;align-items:center}.quickNotesBotton{background-color:#1e72ba;border:0;color:#fff;height:70%;width:20px;margin:2px;outline:none;font-size:70%}.quickCommentsDiv{text-align:left;flex:1 0 0;flex-wrap:wrap;display:flex;margin:2px}.submitDiv{text-align:right;padding-right:4px}.submitButton{border:0;float:right;margin-top:2px;outline:none;cursor:pointer;background-color:#6cb047;color:#fff;border-radius:4px;font-size:98%;margin-bottom:2px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
62
62
|
}
|
|
63
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
63
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: ActivityComponent, decorators: [{
|
|
64
64
|
type: Component,
|
|
65
65
|
args: [{ selector: 'app-activity', template: "<div *ngIf=\"isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_collapse.png\" (click)=\"isActivityMaximized = false\" title=\"Collapse\">\r\n </div>\r\n <div class=\"callBody\">\r\n <div class=\"activityFields\">\r\n <form>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Call From\">{{activity.NameFieldName}}</label>\r\n <select class=\"dropDownListStyle displayData\" data-resetperactivity=\"false\" (change)=\"onNameSelectChange($event)\">\r\n <option *ngFor=\"let who of activity.whoList\" value=\"{{who.objectId}}\">{{parseWhoObject(who)}}</option>\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Related To\">{{activity.RelatedToFieldName}}</label>\r\n <select class=\"dropDownListStyle displayData\" (change)=\"onRelatedToChange($event)\" data-resetperactivity=\"false\">\r\n <option *ngFor=\"let what of activity.whatList\" value=\"{{what.objectId}}\">{{parseWhatObject(what)}}</option>\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Subject\">{{activity.SubjectFieldName}}</label>\r\n <input class=\"activitySubjectTextBoxStyle displayData\" (change)=\"onSubjectChange($event)\" title=\"{{activity.Subject}}\"\r\n type=\"text\" value=\"{{activity.Subject}}\">\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <div class=\"callNotesContainer\">\r\n <div class=\"textAreaDiv\">\r\n <textarea value=\"{{activity.Description}}\" placeholder=\"Click to add a comment\" class=\"activityCommentsTextBoxStyle\"\r\n (change)=\"onCallNotesChange($event)\" cols=\"20\" rows=\"2\" title=\"\"></textarea>\r\n </div>\r\n <div class=\"notesButtonBorder\">\r\n <div class=\"commentsButtonDiv\">\r\n <div class=\"quickCommentsDiv\">\r\n <input *ngFor=\"let quickComment of activity.quickCommentList ; let i = index;\" class=\"quickNotesBotton\" type=\"button\"\r\n value=\"{{i+1}}\" (click)=\"loadQuickComment(i)\" title=\"{{quickComment}}\">\r\n </div>\r\n <div class=\"submitDiv\">\r\n <input class=\"submitButton\" type=\"button\" value=\"Submit\" (click)=\"activitySave(false)\">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"!isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"assets/images/section_expand.png\" (click)=\"isActivityMaximized = true\" title=\"Expand\">\r\n </div>\r\n", styles: [".callDisplay{display:grid;margin-bottom:8px;background-color:#fff}.editor{font-size:.9em;width:70%;text-align:left;margin:4px 5% 0 0;font-family:Arial;white-space:nowrap;text-overflow:ellipsis;border:0;padding-top:2px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.callHeader{background-color:#f4f5fb!important;width:100%!important;margin-top:0!important}.headerLabel{margin-left:10px}.ViewResizeImage{width:20px;height:20px;float:right;cursor:pointer}.callBody{border-top:0;position:relative}.displayDiv{width:100%;display:flex}.displayLabels{margin-left:5px;width:25%;margin-right:2px}.displayData{width:70%}.dropDownListStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;white-space:nowrap!important;text-overflow:ellipsis!important;margin:0 5px 0 0;cursor:pointer}.activitySubjectTextBoxStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin:0 5px 0 0;padding-left:2px}.activityCommentsTextBoxStyle{border:none;color:#333!important;text-align:left!important;margin:0 0% 0 0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;resize:none;width:100%;height:95px}.notesButtonBorder{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-bottom-left-radius:3px!important;border-bottom-right-radius:3px!important;height:auto}.commentsButtonDiv{width:100%;display:flex;align-items:center}.quickNotesBotton{background-color:#1e72ba;border:0;color:#fff;height:70%;width:20px;margin:2px;outline:none;font-size:70%}.quickCommentsDiv{text-align:left;flex:1 0 0;flex-wrap:wrap;display:flex;margin:2px}.submitDiv{text-align:right;padding-right:4px}.submitButton{border:0;float:right;margin-top:2px;outline:none;cursor:pointer;background-color:#6cb047;color:#fff;border-radius:4px;font-size:98%;margin-bottom:2px}\n"] }]
|
|
66
66
|
}], ctorParameters: function () { return []; }, propDecorators: { activity: [{
|
|
@@ -109,10 +109,10 @@ export class ChatBoxComponent {
|
|
|
109
109
|
}
|
|
110
110
|
catch (e) { }
|
|
111
111
|
}
|
|
112
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
113
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
112
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: ChatBoxComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
113
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: ChatBoxComponent, selector: "app-chat-box", inputs: { settings: "settings", isTyping: "isTyping", messages: "messages", newMsgs: "newMsgs" }, outputs: { isAgentTyping: "isAgentTyping", newMessage: "newMessage" }, viewQueries: [{ propertyName: "messagesContainer", first: true, predicate: ["MessagesContainer"], descendants: true, static: true }, { propertyName: "autofocus", first: true, predicate: ["autofocus"], descendants: true }], ngImport: i0, template: "<div class=\"chat-box\">\r\n <div #MessagesContainer id=\"msgScroll\" class=\"messages\" [style.max-height]='settings.maxHeight'>\r\n <ng-container *ngFor=\"let message of updatedMessage()\">\r\n <app-chat-message class=\"chat-line\" [alignRight]=\"shouldAlignRight(message)\" [message]=\"message.text\" [username]=\"message.username\" (focusOn)=\"setOnFocus($event)\"\r\n [timestamp]=\"message.timestamp\" [image]=\"message.userIcon.toString()\" [fallbackImage]=\"settings.fallbackUserIcon.toString()\" [color]=\"getColor(message)\">\r\n </app-chat-message>\r\n </ng-container>\r\n\r\n <div *ngIf=\"isTyping\" class=\"typing-indicator\">\r\n Someone is typing\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n </div>\r\n </div>\r\n\r\n\r\n\r\n<div class=\"message-box\">\r\n <textarea id=\"autofocus\" tabindex=\"1\" #NewMessageText [(ngModel)]=\"newMessageText\" type=\"text\" class=\"message-input scroll\" placeholder=\"Type a message...\"\r\n (focus)=\"onNewMessageFocus(true)\" (keydown.enter)=\"sendNewMessage($event)\" (keyup)='onKeyup()' [disabled]=\"settings.disableSendMessage\" ></textarea>\r\n <button type=\"submit\" class=\"message-submit\" (click)=\"sendNewMessage($event)\" [disabled]=\"settings.disableSendMessage\">Send</button>\r\n</div>\r\n</div>\r\n", styles: [".message-box{flex:1 1 0;width:99%;background:#fff;margin:auto;position:relative;border-radius:5px;height:100%;border:1px solid #ccc}.message-box .message-input{background:none;border:none;outline:none!important;resize:none;font-family:inherit;font-size:.8rem;height:100%;margin:0;padding:10px 7px;width:89%;color:#444}.message-box textarea:focus:-webkit-placeholder{color:transparent}.message-box .message-submit{position:absolute;z-index:1;top:26px;right:5px;background:#1e72ba;border:none;color:#fff;font-size:10px;line-height:1;padding:6px 10px;border-radius:5px;outline:none!important;transition:background .2s ease;cursor:pointer}.scroll::-webkit-scrollbar{display:none}.chat-box{background-color:#f4f5fb;padding:5px}.messages{padding:5px;overflow:auto;min-height:50px}.chat-line{margin-bottom:15px}.new-message{border-top:solid black 1px;display:flex;align-content:center;height:25px}.new-message input[type=text]{flex:1 1 0;background-color:#f4f5fb;border:none;min-width:0}.new-message input[type=image]{position:relative;top:50%;transform:translateY(-50%);height:20px;cursor:pointer}.new-message input[type=image]:disabled{opacity:.5;cursor:auto}.new-message input:focus{outline:none}.typing-indicator{font-size:.8em;font-style:italic}.typing-indicator span{display:inline-block;height:4px;width:4px;border-radius:50%;background-color:#9e9e9e;margin:0 1px;opacity:.2}.typing-indicator span:nth-of-type(1){animation:1.5s blink infinite .33333s}.typing-indicator span:nth-of-type(2){animation:1.5s blink infinite .66666s}.typing-indicator span:nth-of-type(3){animation:1.5s blink infinite .99999s}@keyframes chat-box_blink{50%{opacity:1}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.ChatMessageComponent, selector: "app-chat-message", inputs: ["message", "alignRight", "username", "color", "timestamp", "image", "fallbackImage"], outputs: ["focusOn"] }] });
|
|
114
114
|
}
|
|
115
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
115
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: ChatBoxComponent, decorators: [{
|
|
116
116
|
type: Component,
|
|
117
117
|
args: [{ selector: 'app-chat-box', template: "<div class=\"chat-box\">\r\n <div #MessagesContainer id=\"msgScroll\" class=\"messages\" [style.max-height]='settings.maxHeight'>\r\n <ng-container *ngFor=\"let message of updatedMessage()\">\r\n <app-chat-message class=\"chat-line\" [alignRight]=\"shouldAlignRight(message)\" [message]=\"message.text\" [username]=\"message.username\" (focusOn)=\"setOnFocus($event)\"\r\n [timestamp]=\"message.timestamp\" [image]=\"message.userIcon.toString()\" [fallbackImage]=\"settings.fallbackUserIcon.toString()\" [color]=\"getColor(message)\">\r\n </app-chat-message>\r\n </ng-container>\r\n\r\n <div *ngIf=\"isTyping\" class=\"typing-indicator\">\r\n Someone is typing\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n </div>\r\n </div>\r\n\r\n\r\n\r\n<div class=\"message-box\">\r\n <textarea id=\"autofocus\" tabindex=\"1\" #NewMessageText [(ngModel)]=\"newMessageText\" type=\"text\" class=\"message-input scroll\" placeholder=\"Type a message...\"\r\n (focus)=\"onNewMessageFocus(true)\" (keydown.enter)=\"sendNewMessage($event)\" (keyup)='onKeyup()' [disabled]=\"settings.disableSendMessage\" ></textarea>\r\n <button type=\"submit\" class=\"message-submit\" (click)=\"sendNewMessage($event)\" [disabled]=\"settings.disableSendMessage\">Send</button>\r\n</div>\r\n</div>\r\n", styles: [".message-box{flex:1 1 0;width:99%;background:#fff;margin:auto;position:relative;border-radius:5px;height:100%;border:1px solid #ccc}.message-box .message-input{background:none;border:none;outline:none!important;resize:none;font-family:inherit;font-size:.8rem;height:100%;margin:0;padding:10px 7px;width:89%;color:#444}.message-box textarea:focus:-webkit-placeholder{color:transparent}.message-box .message-submit{position:absolute;z-index:1;top:26px;right:5px;background:#1e72ba;border:none;color:#fff;font-size:10px;line-height:1;padding:6px 10px;border-radius:5px;outline:none!important;transition:background .2s ease;cursor:pointer}.scroll::-webkit-scrollbar{display:none}.chat-box{background-color:#f4f5fb;padding:5px}.messages{padding:5px;overflow:auto;min-height:50px}.chat-line{margin-bottom:15px}.new-message{border-top:solid black 1px;display:flex;align-content:center;height:25px}.new-message input[type=text]{flex:1 1 0;background-color:#f4f5fb;border:none;min-width:0}.new-message input[type=image]{position:relative;top:50%;transform:translateY(-50%);height:20px;cursor:pointer}.new-message input[type=image]:disabled{opacity:.5;cursor:auto}.new-message input:focus{outline:none}.typing-indicator{font-size:.8em;font-style:italic}.typing-indicator span{display:inline-block;height:4px;width:4px;border-radius:50%;background-color:#9e9e9e;margin:0 1px;opacity:.2}.typing-indicator span:nth-of-type(1){animation:1.5s blink infinite .33333s}.typing-indicator span:nth-of-type(2){animation:1.5s blink infinite .66666s}.typing-indicator span:nth-of-type(3){animation:1.5s blink infinite .99999s}@keyframes chat-box_blink{50%{opacity:1}}\n"] }]
|
|
118
118
|
}], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { settings: [{
|
package/esm2022/projects/UILibrary/src/app/components/chat-message/chat-message.component.mjs
CHANGED
|
@@ -14,10 +14,10 @@ export class ChatMessageComponent {
|
|
|
14
14
|
ngOnInit() {
|
|
15
15
|
this.focusOn.emit(true);
|
|
16
16
|
}
|
|
17
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
18
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: ChatMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: ChatMessageComponent, selector: "app-chat-message", inputs: { message: "message", alignRight: "alignRight", username: "username", color: "color", timestamp: "timestamp", image: "image", fallbackImage: "fallbackImage" }, outputs: { focusOn: "focusOn" }, ngImport: i0, template: "<div [class]=\"alignRight? 'message right-message' : 'message left-message'\">\r\n <div class=\"message-header\">\r\n <img *ngIf=\"image\" class=\"image\" [src]=\"image\" (error)=\"image = fallbackImage\" [style.border-color]=\"color\" />\r\n <span *ngIf=\"username\" class=\"username\">{{username}}</span>\r\n </div>\r\n\r\n <div class=\"message-body-container\">\r\n <div>\r\n <div class=\"message-body\" [style.background-color]=\"color\" [style.border-color]=\"color\">\r\n <span [innerHTML]=\"message\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <span *ngIf=\"timestamp\" class=\"timestamp\">{{timestamp}}</span>\r\n</div>\r\n", styles: [":host{display:block;margin-top:2px;margin-bottom:2px}.right-message{text-align:end}.timestamp{font-size:10px;margin-right:30px;margin-left:30px}.message-header{display:flex;-webkit-text-emphasis:none;text-emphasis:none;font-style:italic;font-size:.7em;align-items:center;margin-bottom:.5em}.message-header .image{height:30px;border-radius:50%;border:2px solid red}.message-header .username{font-weight:700}.right-message>.message-header{flex-direction:row-reverse;margin-right:1px}.right-message>.message-header .image{margin-left:5px}.right-message>.message-header .username{margin-left:5px}.left-message>.message-header{margin-left:1px}.left-message>.message-header .image{margin-right:5px}.left-message>.message-header .username{margin-right:5px}.message-body-container{display:flex}.right-message>.message-body-container{flex-direction:row-reverse}.message-body{display:inline-block;position:relative;border-radius:1em;padding:6px;font-style:normal;font-size:.8em;text-align:start;min-width:2em;overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-all;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}.left-message .message-body:after{content:\"\";position:absolute;border-left:10px solid black;border-color:inherit;border-right:10px solid transparent;border-bottom:10px solid transparent;left:1px;bottom:-2px}.right-message .message-body:after{content:\"\";position:absolute;border-left:10px solid transparent;border-top:10px solid black;border-top-color:inherit;border-bottom:0px solid transparent;right:1px;bottom:-2px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
19
19
|
}
|
|
20
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: ChatMessageComponent, decorators: [{
|
|
21
21
|
type: Component,
|
|
22
22
|
args: [{ selector: 'app-chat-message', template: "<div [class]=\"alignRight? 'message right-message' : 'message left-message'\">\r\n <div class=\"message-header\">\r\n <img *ngIf=\"image\" class=\"image\" [src]=\"image\" (error)=\"image = fallbackImage\" [style.border-color]=\"color\" />\r\n <span *ngIf=\"username\" class=\"username\">{{username}}</span>\r\n </div>\r\n\r\n <div class=\"message-body-container\">\r\n <div>\r\n <div class=\"message-body\" [style.background-color]=\"color\" [style.border-color]=\"color\">\r\n <span [innerHTML]=\"message\"></span>\r\n </div>\r\n </div>\r\n </div>\r\n <span *ngIf=\"timestamp\" class=\"timestamp\">{{timestamp}}</span>\r\n</div>\r\n", styles: [":host{display:block;margin-top:2px;margin-bottom:2px}.right-message{text-align:end}.timestamp{font-size:10px;margin-right:30px;margin-left:30px}.message-header{display:flex;-webkit-text-emphasis:none;text-emphasis:none;font-style:italic;font-size:.7em;align-items:center;margin-bottom:.5em}.message-header .image{height:30px;border-radius:50%;border:2px solid red}.message-header .username{font-weight:700}.right-message>.message-header{flex-direction:row-reverse;margin-right:1px}.right-message>.message-header .image{margin-left:5px}.right-message>.message-header .username{margin-left:5px}.left-message>.message-header{margin-left:1px}.left-message>.message-header .image{margin-right:5px}.left-message>.message-header .username{margin-right:5px}.message-body-container{display:flex}.right-message>.message-body-container{flex-direction:row-reverse}.message-body{display:inline-block;position:relative;border-radius:1em;padding:6px;font-style:normal;font-size:.8em;text-align:start;min-width:2em;overflow-wrap:break-word;word-wrap:break-word;-ms-word-break:break-all;word-break:break-all;word-break:break-word;-webkit-hyphens:auto;hyphens:auto}.left-message .message-body:after{content:\"\";position:absolute;border-left:10px solid black;border-color:inherit;border-right:10px solid transparent;border-bottom:10px solid transparent;left:1px;bottom:-2px}.right-message .message-body:after{content:\"\";position:absolute;border-left:10px solid transparent;border-top:10px solid black;border-top-color:inherit;border-bottom:0px solid transparent;right:1px;bottom:-2px}\n"] }]
|
|
23
23
|
}], ctorParameters: function () { return []; }, propDecorators: { message: [{
|
|
@@ -20,10 +20,10 @@ export class CreateComponent {
|
|
|
20
20
|
getImage(entity) {
|
|
21
21
|
return entity.substring(entity.indexOf('|') + 1);
|
|
22
22
|
}
|
|
23
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
24
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
23
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
24
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: CreateComponent, selector: "amc-create", inputs: { Entities: "Entities" }, outputs: { CreateNewEntity: "CreateNewEntity" }, ngImport: i0, template: "<div *ngIf=\"isCreateMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Create New</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_collapse.png\" (click)=\"isCreateMaximized = false\"\r\n title=\"Collapse\" />\r\n </div>\r\n <div class=\"callBody\">\r\n <div *ngIf=\"Entities\" class=\"container\">\r\n <div *ngFor=\"let entity of getEntities()\" class=\"createNewLabel\" (click)=\"createNewEntity(entity)\"\r\n title=\"{{ getDisplay(Entities[entity]) }}\">\r\n <img class=\"createEntityImages\" src=\"{{ getImage(Entities[entity]) }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"!isCreateMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Create New</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_expand.png\" (click)=\"isCreateMaximized = true\"\r\n title=\"Expand\" />\r\n </div>\r\n</div>\r\n", styles: [".callHeader{background-color:#f4f5fb!important;width:100%!important;margin-top:0!important;border:1px solid #939598!important}.editor{font-size:.9em;width:70%;text-align:left;margin:4px 5% 0 0;font-family:Arial;white-space:nowrap;text-overflow:ellipsis;border:0;padding-top:2px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.createEntityImages{width:30px;height:25px;margin-bottom:5px;margin-top:5px;cursor:pointer;padding-left:5px}.createNewLabel{display:inline-block;margin-left:5%;margin-right:5%}.container{padding-right:0;padding-left:0;font-size:10px;text-align:center}.callBody{border:1px solid #939598;border-top-color:#939598;border-top-style:solid;border-top-width:1px;border-top:0;position:relative}.callDisplay{background-color:#fff;display:grid}.ViewResizeImage{width:20px;height:20px;float:right;cursor:pointer}.headerLabel{margin-left:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
25
25
|
}
|
|
26
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
26
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CreateComponent, decorators: [{
|
|
27
27
|
type: Component,
|
|
28
28
|
args: [{ selector: 'amc-create', template: "<div *ngIf=\"isCreateMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Create New</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_collapse.png\" (click)=\"isCreateMaximized = false\"\r\n title=\"Collapse\" />\r\n </div>\r\n <div class=\"callBody\">\r\n <div *ngIf=\"Entities\" class=\"container\">\r\n <div *ngFor=\"let entity of getEntities()\" class=\"createNewLabel\" (click)=\"createNewEntity(entity)\"\r\n title=\"{{ getDisplay(Entities[entity]) }}\">\r\n <img class=\"createEntityImages\" src=\"{{ getImage(Entities[entity]) }}\" />\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"!isCreateMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Create New</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_expand.png\" (click)=\"isCreateMaximized = true\"\r\n title=\"Expand\" />\r\n </div>\r\n</div>\r\n", styles: [".callHeader{background-color:#f4f5fb!important;width:100%!important;margin-top:0!important;border:1px solid #939598!important}.editor{font-size:.9em;width:70%;text-align:left;margin:4px 5% 0 0;font-family:Arial;white-space:nowrap;text-overflow:ellipsis;border:0;padding-top:2px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.createEntityImages{width:30px;height:25px;margin-bottom:5px;margin-top:5px;cursor:pointer;padding-left:5px}.createNewLabel{display:inline-block;margin-left:5%;margin-right:5%}.container{padding-right:0;padding-left:0;font-size:10px;text-align:center}.callBody{border:1px solid #939598;border-top-color:#939598;border-top-style:solid;border-top-width:1px;border-top:0;position:relative}.callDisplay{background-color:#fff;display:grid}.ViewResizeImage{width:20px;height:20px;float:right;cursor:pointer}.headerLabel{margin-left:10px}\n"] }]
|
|
29
29
|
}], ctorParameters: function () { return []; }, propDecorators: { CreateNewEntity: [{
|
|
@@ -140,10 +140,10 @@ export class CurrentActivityComponent {
|
|
|
140
140
|
}
|
|
141
141
|
catch (error) { }
|
|
142
142
|
}
|
|
143
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
144
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: CurrentActivityComponent, selector: "amc-current-activity", inputs: { ActivityDetails: "ActivityDetails", quickCommentList: "quickCommentList", isAutoSave: "isAutoSave", enableDiscard: "enableDiscard", autoSaveTimer: "autoSaveTimer", quickCommentOptionRequiredCadArray: "quickCommentOptionRequiredCadArray", WhoObjectList: "WhoObjectList", WhatObjectList: "WhatObjectList", scenarioToCADMap: "scenarioToCADMap" }, outputs: { EventEmitter: "EventEmitter" }, ngImport: i0, template: "<div *ngIf=\"isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_collapse.png\" (click)=\"isActivityMaximized = false\"\r\n title=\"Collapse\"><img *ngIf=\"enableDiscard\" class=\"DiscardImage\" src=\"assets/images/Discard.png\"\r\n (click)=\"triggerDiscardActivity()\" title=\"Discard\">\r\n </div>\r\n <div class=\"callBody\">\r\n <div class=\"activityFields\">\r\n <form>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Name\">Name</label>\r\n <select class=\"dropDownListStyle displayData\" [ngModel]=\"ActivityDetails.WhoObject.objectId\" (ngModelChange)=\"onNameChange($event)\" name=\"whoItem\">\r\n <option *ngFor=\"let whoItem of WhoObjectList\" [ngValue]=\"whoItem.objectId\">{{ (whoItem.displayName && whoItem.objectName) ? (whoItem.displayName + ': ' +\r\n whoItem.objectName) : \"\"}}</option>\r\n <!-- <option value=\"UserSelectedForEmptyRecord\"></option> -->\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\"\r\n *ngIf='(ActivityDetails.WhoObject && ActivityDetails.WhoObject.objectType !== \"Lead\")'>\r\n <label class=\"displayLabels\" title=\"Related To\">Related To</label>\r\n <select class=\"dropDownListStyle displayData\" (ngModelChange)=\"onRelatedToChange($event)\"\r\n [ngModel]=\"ActivityDetails.WhatObject.objectId\" name=\"whatItem\">\r\n <option *ngFor=\"let whatItem of WhatObjectList;\" [ngValue]=\"whatItem.objectId\">\r\n {{ (whatItem.displayName && whatItem.objectName) ? (whatItem.displayName + ': ' + whatItem.objectName) : \"\" }}</option>\r\n <!-- <option value=\"UserSelectedForEmptyRecord\"></option> -->\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Subject\">Subject</label>\r\n <input class=\"activitySubjectTextBoxStyle displayData\" (change)=\"onSubjectChange()\" type=\"text\"\r\n name=\"subject\" (keyup)=\"onSubjectKeyUp()\" [(ngModel)]=\"ActivityDetails.Subject\">\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <div class=\"callNotesSection\">\r\n <div class=\"callNotesTextArea\">\r\n <textarea [(ngModel)]=\"ActivityDetails.Description\" placeholder=\"Click to add a comment\"\r\n class=\"activityCommentsTextBoxStyle\" (change)=\"onCallNotesChange()\" name=\"description\"\r\n (keyup)=\"onCallNotesKeyUp()\" cols=\"20\" rows=\"2\" title=\"\"></textarea>\r\n </div>\r\n <div class=\"notesBottonBorder\">\r\n <div class=\"commentsButtonDiv\">\r\n <div class=\"quickCommentsDiv\">\r\n <input *ngFor=\"let quickComment of quickCommentList; let i = index;\"\r\n class=\"quickNotesBotton\" type=\"button\" value=\"{{i+1}}\"\r\n (click)=\"addQuickCommentToDescription(quickComment)\" title=\"{{quickComment}}\">\r\n </div>\r\n <div class=\"callNotesButtonsSection\">\r\n <input class=\"submitButton\" type=\"button\" value=\"Save\"\r\n (click)=\"submitActivity()\" [disabled]=\"!ActivityDetails.IsUnSaved\" />\r\n <!-- TOsDO check this Isprocessing -->\r\n <!-- <input *ngIf=\"!storageService.getActivity().IsProcessing\" class=\"submitButton\" type=\"button\" value=\"Save\" (click)=\"submitActivity(storageService.getActivity().ScenarioId)\" [disabled]=\"!isChangesUnSaved(this.scenarioId)\" /> -->\r\n <img *ngIf=\"ActivityDetails.IsProcessing\" class=\"loadingIcon\"\r\n src=\"assets/images/loading.gif\" title=\"Updating Activity\" />\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"!isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"assets/images/section_expand.png\" (click)=\"isActivityMaximized = true\"\r\n title=\"Expand\">\r\n </div>\r\n</div>\r\n", styles: [".imageExpandCollapse{float:right;width:20px;height:20px}.miscSection{position:relative;margin-top:20px;background-color:#e5e6f2}.callHeader{background-color:#f4f5fb!important;width:100%!important;margin-top:0!important;border:1px solid #939598!important}.notesBottonBorder{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-bottom-left-radius:3px!important;border-bottom-right-radius:3px!important;height:auto}.quickNotesBotton{background-color:#1e72ba;border:0;color:#fff;height:70%;width:20px;margin:2px;outline:none;font-size:70%}.submitButton{border:0;float:right;margin-top:2px;outline:none;cursor:pointer;background-color:#6cb047;color:#fff;border-radius:4px;font-size:98%;margin-bottom:2px}.callBody{border:1px solid #939598;border-top-color:#939598;border-top-style:solid;border-top-width:1px;border-top:0;position:relative}.miscIcons{width:20px;height:20px;float:right;margin-top:4px;margin-right:5px;margin-left:5px}.amcIcon{width:50%;height:20px;margin-top:5px;margin-left:10px}.callDisplay{display:grid;margin-bottom:8px;background-color:#fff}.editor{font-size:.9em;width:70%;text-align:left;margin:4px 5% 0 0;font-family:Arial;white-space:nowrap;text-overflow:ellipsis;border:0;padding-top:2px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.AnswerCallImages{width:28px;height:20px;margin:6px 0 0 5px}.dropDownListStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;white-space:nowrap!important;text-overflow:ellipsis!important;margin:0 5px 0 0;cursor:pointer}.activitySubjectTextBoxStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin:0 5px 0 0;padding-left:2px}.activityCommentsTextBoxStyle{border:none;color:#333!important;text-align:left!important;margin:0 0% 0 0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;resize:none;width:100%;height:95px}.displayDiv{width:100%;display:flex}.displayLabels{margin-left:5px;width:25%;margin-right:2px}.displayData{width:70%}.commentsButtonDiv{width:100%;display:flex;align-items:center;background-color:#f6f7fb}.quickCommentsDiv{text-align:left;flex:1 0 0;flex-wrap:wrap;display:flex;margin:2px}.callNotesButtonsSection{text-align:right;padding-right:4px}.newEntityImages{width:25px;height:25px;margin-top:2px;cursor:pointer;padding-left:5px}body{font-size:.85em;font-family:\"Segoe UI\",Verdana,Helvetica,Sans-Serif;color:#232323;background-color:#fff;font-family:Arial}.callNotesSection{float:left;height:100%;width:100%;margin-right:5px;margin-left:5px;margin-bottom:5px}.ViewResizeImage{width:20px;height:20px;float:right;cursor:pointer}.DiscardImage{padding-top:2px;width:15px;height:18px;float:right;cursor:pointer}.headerLabel{margin-left:10px}.callNotesTextArea{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-top:1px solid #939598;border-top-left-radius:3px!important;border-top-right-radius:3px!important}.loadingIcon{float:right;margin-right:5px;height:10px;width:30px;margin-top:8px;padding-bottom:0}input[type=button]:disabled{background-color:#d3d3d3;cursor:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
143
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CurrentActivityComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
144
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: CurrentActivityComponent, selector: "amc-current-activity", inputs: { ActivityDetails: "ActivityDetails", quickCommentList: "quickCommentList", isAutoSave: "isAutoSave", enableDiscard: "enableDiscard", autoSaveTimer: "autoSaveTimer", quickCommentOptionRequiredCadArray: "quickCommentOptionRequiredCadArray", WhoObjectList: "WhoObjectList", WhatObjectList: "WhatObjectList", scenarioToCADMap: "scenarioToCADMap" }, outputs: { EventEmitter: "EventEmitter" }, ngImport: i0, template: "<div *ngIf=\"isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_collapse.png\" (click)=\"isActivityMaximized = false\"\r\n title=\"Collapse\"><img *ngIf=\"enableDiscard\" class=\"DiscardImage\" src=\"assets/images/Discard.png\"\r\n (click)=\"triggerDiscardActivity()\" title=\"Discard\">\r\n </div>\r\n <div class=\"callBody\">\r\n <div class=\"activityFields\">\r\n <form>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Name\">Name</label>\r\n <select class=\"dropDownListStyle displayData\" [ngModel]=\"ActivityDetails.WhoObject.objectId\" (ngModelChange)=\"onNameChange($event)\" name=\"whoItem\">\r\n <option *ngFor=\"let whoItem of WhoObjectList\" [ngValue]=\"whoItem.objectId\">{{ (whoItem.displayName && whoItem.objectName) ? (whoItem.displayName + ': ' +\r\n whoItem.objectName) : \"\"}}</option>\r\n <!-- <option value=\"UserSelectedForEmptyRecord\"></option> -->\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\"\r\n *ngIf='(ActivityDetails.WhoObject && ActivityDetails.WhoObject.objectType !== \"Lead\")'>\r\n <label class=\"displayLabels\" title=\"Related To\">Related To</label>\r\n <select class=\"dropDownListStyle displayData\" (ngModelChange)=\"onRelatedToChange($event)\"\r\n [ngModel]=\"ActivityDetails.WhatObject.objectId\" name=\"whatItem\">\r\n <option *ngFor=\"let whatItem of WhatObjectList;\" [ngValue]=\"whatItem.objectId\">\r\n {{ (whatItem.displayName && whatItem.objectName) ? (whatItem.displayName + ': ' + whatItem.objectName) : \"\" }}</option>\r\n <!-- <option value=\"UserSelectedForEmptyRecord\"></option> -->\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Subject\">Subject</label>\r\n <input class=\"activitySubjectTextBoxStyle displayData\" (change)=\"onSubjectChange()\" type=\"text\"\r\n name=\"subject\" (keyup)=\"onSubjectKeyUp()\" [(ngModel)]=\"ActivityDetails.Subject\">\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <div class=\"callNotesSection\">\r\n <div class=\"callNotesTextArea\">\r\n <textarea [(ngModel)]=\"ActivityDetails.Description\" placeholder=\"Click to add a comment\"\r\n class=\"activityCommentsTextBoxStyle\" (change)=\"onCallNotesChange()\" name=\"description\"\r\n (keyup)=\"onCallNotesKeyUp()\" cols=\"20\" rows=\"2\" title=\"\"></textarea>\r\n </div>\r\n <div class=\"notesBottonBorder\">\r\n <div class=\"commentsButtonDiv\">\r\n <div class=\"quickCommentsDiv\">\r\n <input *ngFor=\"let quickComment of quickCommentList; let i = index;\"\r\n class=\"quickNotesBotton\" type=\"button\" value=\"{{i+1}}\"\r\n (click)=\"addQuickCommentToDescription(quickComment)\" title=\"{{quickComment}}\">\r\n </div>\r\n <div class=\"callNotesButtonsSection\">\r\n <input class=\"submitButton\" type=\"button\" value=\"Save\"\r\n (click)=\"submitActivity()\" [disabled]=\"!ActivityDetails.IsUnSaved\" />\r\n <!-- TOsDO check this Isprocessing -->\r\n <!-- <input *ngIf=\"!storageService.getActivity().IsProcessing\" class=\"submitButton\" type=\"button\" value=\"Save\" (click)=\"submitActivity(storageService.getActivity().ScenarioId)\" [disabled]=\"!isChangesUnSaved(this.scenarioId)\" /> -->\r\n <img *ngIf=\"ActivityDetails.IsProcessing\" class=\"loadingIcon\"\r\n src=\"assets/images/loading.gif\" title=\"Updating Activity\" />\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"!isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"assets/images/section_expand.png\" (click)=\"isActivityMaximized = true\"\r\n title=\"Expand\">\r\n </div>\r\n</div>\r\n", styles: [".imageExpandCollapse{float:right;width:20px;height:20px}.miscSection{position:relative;margin-top:20px;background-color:#e5e6f2}.callHeader{background-color:#f4f5fb!important;width:100%!important;margin-top:0!important;border:1px solid #939598!important}.notesBottonBorder{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-bottom-left-radius:3px!important;border-bottom-right-radius:3px!important;height:auto}.quickNotesBotton{background-color:#1e72ba;border:0;color:#fff;height:70%;width:20px;margin:2px;outline:none;font-size:70%}.submitButton{border:0;float:right;margin-top:2px;outline:none;cursor:pointer;background-color:#6cb047;color:#fff;border-radius:4px;font-size:98%;margin-bottom:2px}.callBody{border:1px solid #939598;border-top-color:#939598;border-top-style:solid;border-top-width:1px;border-top:0;position:relative}.miscIcons{width:20px;height:20px;float:right;margin-top:4px;margin-right:5px;margin-left:5px}.amcIcon{width:50%;height:20px;margin-top:5px;margin-left:10px}.callDisplay{display:grid;margin-bottom:8px;background-color:#fff}.editor{font-size:.9em;width:70%;text-align:left;margin:4px 5% 0 0;font-family:Arial;white-space:nowrap;text-overflow:ellipsis;border:0;padding-top:2px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.AnswerCallImages{width:28px;height:20px;margin:6px 0 0 5px}.dropDownListStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;white-space:nowrap!important;text-overflow:ellipsis!important;margin:0 5px 0 0;cursor:pointer}.activitySubjectTextBoxStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin:0 5px 0 0;padding-left:2px}.activityCommentsTextBoxStyle{border:none;color:#333!important;text-align:left!important;margin:0 0% 0 0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;resize:none;width:100%;height:95px}.displayDiv{width:100%;display:flex}.displayLabels{margin-left:5px;width:25%;margin-right:2px}.displayData{width:70%}.commentsButtonDiv{width:100%;display:flex;align-items:center;background-color:#f6f7fb}.quickCommentsDiv{text-align:left;flex:1 0 0;flex-wrap:wrap;display:flex;margin:2px}.callNotesButtonsSection{text-align:right;padding-right:4px}.newEntityImages{width:25px;height:25px;margin-top:2px;cursor:pointer;padding-left:5px}body{font-size:.85em;font-family:\"Segoe UI\",Verdana,Helvetica,Sans-Serif;color:#232323;background-color:#fff;font-family:Arial}.callNotesSection{float:left;height:100%;width:100%;margin-right:5px;margin-left:5px;margin-bottom:5px}.ViewResizeImage{width:20px;height:20px;float:right;cursor:pointer}.DiscardImage{padding-top:2px;width:15px;height:18px;float:right;cursor:pointer}.headerLabel{margin-left:10px}.callNotesTextArea{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-top:1px solid #939598;border-top-left-radius:3px!important;border-top-right-radius:3px!important}.loadingIcon{float:right;margin-right:5px;height:10px;width:30px;margin-top:8px;padding-bottom:0}input[type=button]:disabled{background-color:#d3d3d3;cursor:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
145
145
|
}
|
|
146
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
146
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: CurrentActivityComponent, decorators: [{
|
|
147
147
|
type: Component,
|
|
148
148
|
args: [{ selector: 'amc-current-activity', template: "<div *ngIf=\"isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"/assets/images/section_collapse.png\" (click)=\"isActivityMaximized = false\"\r\n title=\"Collapse\"><img *ngIf=\"enableDiscard\" class=\"DiscardImage\" src=\"assets/images/Discard.png\"\r\n (click)=\"triggerDiscardActivity()\" title=\"Discard\">\r\n </div>\r\n <div class=\"callBody\">\r\n <div class=\"activityFields\">\r\n <form>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Name\">Name</label>\r\n <select class=\"dropDownListStyle displayData\" [ngModel]=\"ActivityDetails.WhoObject.objectId\" (ngModelChange)=\"onNameChange($event)\" name=\"whoItem\">\r\n <option *ngFor=\"let whoItem of WhoObjectList\" [ngValue]=\"whoItem.objectId\">{{ (whoItem.displayName && whoItem.objectName) ? (whoItem.displayName + ': ' +\r\n whoItem.objectName) : \"\"}}</option>\r\n <!-- <option value=\"UserSelectedForEmptyRecord\"></option> -->\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\"\r\n *ngIf='(ActivityDetails.WhoObject && ActivityDetails.WhoObject.objectType !== \"Lead\")'>\r\n <label class=\"displayLabels\" title=\"Related To\">Related To</label>\r\n <select class=\"dropDownListStyle displayData\" (ngModelChange)=\"onRelatedToChange($event)\"\r\n [ngModel]=\"ActivityDetails.WhatObject.objectId\" name=\"whatItem\">\r\n <option *ngFor=\"let whatItem of WhatObjectList;\" [ngValue]=\"whatItem.objectId\">\r\n {{ (whatItem.displayName && whatItem.objectName) ? (whatItem.displayName + ': ' + whatItem.objectName) : \"\" }}</option>\r\n <!-- <option value=\"UserSelectedForEmptyRecord\"></option> -->\r\n </select>\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" title=\"Subject\">Subject</label>\r\n <input class=\"activitySubjectTextBoxStyle displayData\" (change)=\"onSubjectChange()\" type=\"text\"\r\n name=\"subject\" (keyup)=\"onSubjectKeyUp()\" [(ngModel)]=\"ActivityDetails.Subject\">\r\n </div>\r\n <div class=\"editor displayDiv\">\r\n <div class=\"callNotesSection\">\r\n <div class=\"callNotesTextArea\">\r\n <textarea [(ngModel)]=\"ActivityDetails.Description\" placeholder=\"Click to add a comment\"\r\n class=\"activityCommentsTextBoxStyle\" (change)=\"onCallNotesChange()\" name=\"description\"\r\n (keyup)=\"onCallNotesKeyUp()\" cols=\"20\" rows=\"2\" title=\"\"></textarea>\r\n </div>\r\n <div class=\"notesBottonBorder\">\r\n <div class=\"commentsButtonDiv\">\r\n <div class=\"quickCommentsDiv\">\r\n <input *ngFor=\"let quickComment of quickCommentList; let i = index;\"\r\n class=\"quickNotesBotton\" type=\"button\" value=\"{{i+1}}\"\r\n (click)=\"addQuickCommentToDescription(quickComment)\" title=\"{{quickComment}}\">\r\n </div>\r\n <div class=\"callNotesButtonsSection\">\r\n <input class=\"submitButton\" type=\"button\" value=\"Save\"\r\n (click)=\"submitActivity()\" [disabled]=\"!ActivityDetails.IsUnSaved\" />\r\n <!-- TOsDO check this Isprocessing -->\r\n <!-- <input *ngIf=\"!storageService.getActivity().IsProcessing\" class=\"submitButton\" type=\"button\" value=\"Save\" (click)=\"submitActivity(storageService.getActivity().ScenarioId)\" [disabled]=\"!isChangesUnSaved(this.scenarioId)\" /> -->\r\n <img *ngIf=\"ActivityDetails.IsProcessing\" class=\"loadingIcon\"\r\n src=\"assets/images/loading.gif\" title=\"Updating Activity\" />\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</div>\r\n<div *ngIf=\"!isActivityMaximized\" class=\"callDisplay\">\r\n <div class=\"editor callHeader\">\r\n <label class=\"headerLabel\">\r\n <b>Activity Information</b>\r\n </label>\r\n <img class=\"ViewResizeImage\" src=\"assets/images/section_expand.png\" (click)=\"isActivityMaximized = true\"\r\n title=\"Expand\">\r\n </div>\r\n</div>\r\n", styles: [".imageExpandCollapse{float:right;width:20px;height:20px}.miscSection{position:relative;margin-top:20px;background-color:#e5e6f2}.callHeader{background-color:#f4f5fb!important;width:100%!important;margin-top:0!important;border:1px solid #939598!important}.notesBottonBorder{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-bottom-left-radius:3px!important;border-bottom-right-radius:3px!important;height:auto}.quickNotesBotton{background-color:#1e72ba;border:0;color:#fff;height:70%;width:20px;margin:2px;outline:none;font-size:70%}.submitButton{border:0;float:right;margin-top:2px;outline:none;cursor:pointer;background-color:#6cb047;color:#fff;border-radius:4px;font-size:98%;margin-bottom:2px}.callBody{border:1px solid #939598;border-top-color:#939598;border-top-style:solid;border-top-width:1px;border-top:0;position:relative}.miscIcons{width:20px;height:20px;float:right;margin-top:4px;margin-right:5px;margin-left:5px}.amcIcon{width:50%;height:20px;margin-top:5px;margin-left:10px}.callDisplay{display:grid;margin-bottom:8px;background-color:#fff}.editor{font-size:.9em;width:70%;text-align:left;margin:4px 5% 0 0;font-family:Arial;white-space:nowrap;text-overflow:ellipsis;border:0;padding-top:2px;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.AnswerCallImages{width:28px;height:20px;margin:6px 0 0 5px}.dropDownListStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;white-space:nowrap!important;text-overflow:ellipsis!important;margin:0 5px 0 0;cursor:pointer}.activitySubjectTextBoxStyle{border:1px solid #939598!important;border-radius:3px!important;width:71%!important;height:20px!important;text-align:left!important;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;margin:0 5px 0 0;padding-left:2px}.activityCommentsTextBoxStyle{border:none;color:#333!important;text-align:left!important;margin:0 0% 0 0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;resize:none;width:100%;height:95px}.displayDiv{width:100%;display:flex}.displayLabels{margin-left:5px;width:25%;margin-right:2px}.displayData{width:70%}.commentsButtonDiv{width:100%;display:flex;align-items:center;background-color:#f6f7fb}.quickCommentsDiv{text-align:left;flex:1 0 0;flex-wrap:wrap;display:flex;margin:2px}.callNotesButtonsSection{text-align:right;padding-right:4px}.newEntityImages{width:25px;height:25px;margin-top:2px;cursor:pointer;padding-left:5px}body{font-size:.85em;font-family:\"Segoe UI\",Verdana,Helvetica,Sans-Serif;color:#232323;background-color:#fff;font-family:Arial}.callNotesSection{float:left;height:100%;width:100%;margin-right:5px;margin-left:5px;margin-bottom:5px}.ViewResizeImage{width:20px;height:20px;float:right;cursor:pointer}.DiscardImage{padding-top:2px;width:15px;height:18px;float:right;cursor:pointer}.headerLabel{margin-left:10px}.callNotesTextArea{background-color:#fff;border-left:1px solid #939598;border-bottom:1px solid #939598;border-right:1px solid #939598;border-top:1px solid #939598;border-top-left-radius:3px!important;border-top-right-radius:3px!important}.loadingIcon{float:right;margin-right:5px;height:10px;width:30px;margin-top:8px;padding-bottom:0}input[type=button]:disabled{background-color:#d3d3d3;cursor:auto}\n"] }]
|
|
149
149
|
}], ctorParameters: function () { return []; }, propDecorators: { ActivityDetails: [{
|
|
@@ -33,10 +33,10 @@ export class DispositionComponent {
|
|
|
33
33
|
this.submitDisposition();
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
37
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
36
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: DispositionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
37
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: DispositionComponent, selector: "amc-disposition", inputs: { disposition: "disposition" }, outputs: { dispositionEmitter: "dispositionEmitter" }, ngImport: i0, template: "<div class=\"disposition-container\">\r\n <div class=\"header-container\">\r\n <label class=\"disposition-header\" attr.aria-label=\"set disposition\">{{disposition.dispositionHeader}}</label>\r\n </div>\r\n\r\n <div class=\"dispositions-container\">\r\n <div class=\"disposition\" *ngFor=\"let disp of disposition.disposition | keyvalue; let i = index\">\r\n <label\r\n class=\"disposition-label\"\r\n tabindex=\"0\"\r\n [id]=\"disp.key\"\r\n [ngClass]=\"{'disposition-label-selected' : selectedDispositionValue === disp.key, 'first-disposition': i === 0}\"\r\n (keypress)=\"selectAndSubmitDisposition($event, disp.key)\">\r\n\r\n <input\r\n class=\"disposition-input\"\r\n type=\"radio\"\r\n value=\"{{disp.key}}\"\r\n tabindex=\"-1\"\r\n attr.aria-label=\"{{disp.value}}\"\r\n [required]=\"!selectedDispositionValue\"\r\n [name]=\"dispositionName\"\r\n (change)=\"submitDisposition()\"\r\n [(ngModel)]=\"selectedDispositionValue\">\r\n\r\n {{disp.value}}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".disposition-container{border:1px solid #939598;white-space:nowrap;font-family:Arial;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;text-overflow:ellipsis;position:relative;font-size:.9em;max-height:180px;overflow-x:hidden;overflow-y:hidden}.header-container{border-bottom:1px solid #939598;background-color:#f4f5fb;width:100%;white-space:nowrap;height:28px;position:sticky;overflow-x:hidden;overflow-y:hidden}.disposition-header{margin-top:auto;margin-left:7px;padding:5px;white-space:nowrap;text-overflow:ellipsis;font-weight:700;font-size:.9em;font-family:Arial;overflow-x:hidden}.disposition{margin-left:5px;padding-left:5px;white-space:nowrap}.disposition-label{text-overflow:ellipsis;font-weight:400;white-space:nowrap;font-size:.9em;overflow-x:hidden}.disposition-label-selected{text-overflow:ellipsis;font-weight:700;white-space:nowrap;font-size:.9em}.dispositions-container{overflow-y:scroll;max-height:150px;padding:3px}.disposition-label:focus{outline:2px solid rgb(50,150,218);outline-offset:5px}.first-disposition{margin-top:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.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: i2.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }] });
|
|
38
38
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
39
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: DispositionComponent, decorators: [{
|
|
40
40
|
type: Component,
|
|
41
41
|
args: [{ selector: 'amc-disposition', template: "<div class=\"disposition-container\">\r\n <div class=\"header-container\">\r\n <label class=\"disposition-header\" attr.aria-label=\"set disposition\">{{disposition.dispositionHeader}}</label>\r\n </div>\r\n\r\n <div class=\"dispositions-container\">\r\n <div class=\"disposition\" *ngFor=\"let disp of disposition.disposition | keyvalue; let i = index\">\r\n <label\r\n class=\"disposition-label\"\r\n tabindex=\"0\"\r\n [id]=\"disp.key\"\r\n [ngClass]=\"{'disposition-label-selected' : selectedDispositionValue === disp.key, 'first-disposition': i === 0}\"\r\n (keypress)=\"selectAndSubmitDisposition($event, disp.key)\">\r\n\r\n <input\r\n class=\"disposition-input\"\r\n type=\"radio\"\r\n value=\"{{disp.key}}\"\r\n tabindex=\"-1\"\r\n attr.aria-label=\"{{disp.value}}\"\r\n [required]=\"!selectedDispositionValue\"\r\n [name]=\"dispositionName\"\r\n (change)=\"submitDisposition()\"\r\n [(ngModel)]=\"selectedDispositionValue\">\r\n\r\n {{disp.value}}\r\n </label>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".disposition-container{border:1px solid #939598;white-space:nowrap;font-family:Arial;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;text-overflow:ellipsis;position:relative;font-size:.9em;max-height:180px;overflow-x:hidden;overflow-y:hidden}.header-container{border-bottom:1px solid #939598;background-color:#f4f5fb;width:100%;white-space:nowrap;height:28px;position:sticky;overflow-x:hidden;overflow-y:hidden}.disposition-header{margin-top:auto;margin-left:7px;padding:5px;white-space:nowrap;text-overflow:ellipsis;font-weight:700;font-size:.9em;font-family:Arial;overflow-x:hidden}.disposition{margin-left:5px;padding-left:5px;white-space:nowrap}.disposition-label{text-overflow:ellipsis;font-weight:400;white-space:nowrap;font-size:.9em;overflow-x:hidden}.disposition-label-selected{text-overflow:ellipsis;font-weight:700;white-space:nowrap;font-size:.9em}.dispositions-container{overflow-y:scroll;max-height:150px;padding:3px}.disposition-label:focus{outline:2px solid rgb(50,150,218);outline-offset:5px}.first-disposition{margin-top:5px}\n"] }]
|
|
42
42
|
}], ctorParameters: function () { return []; }, propDecorators: { disposition: [{
|
|
@@ -42,10 +42,10 @@ export class DurationComponent {
|
|
|
42
42
|
this._timerId = null;
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
46
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
45
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: DurationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
46
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: DurationComponent, selector: "amc-duration", inputs: { statusText: "statusText", callId: "callId", startTime: "startTime" }, ngImport: i0, template: "<div class=\"holdCallDurationDiv\">\r\n <input\r\n readonly\r\n class=\"block durationInput\"\r\n name=\"CallDuration\"\r\n type=\"text\"\r\n tabindex=\"-1\"\r\n title=\"Call Duration\"\r\n [value]=\"displayTime\"\r\n [attr.aria-labelledby]=\"labelledByText || null\">\r\n</div>\r\n", styles: [".durationInput:focus{outline-style:none}\n"] });
|
|
47
47
|
}
|
|
48
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
48
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: DurationComponent, decorators: [{
|
|
49
49
|
type: Component,
|
|
50
50
|
args: [{ selector: 'amc-duration', template: "<div class=\"holdCallDurationDiv\">\r\n <input\r\n readonly\r\n class=\"block durationInput\"\r\n name=\"CallDuration\"\r\n type=\"text\"\r\n tabindex=\"-1\"\r\n title=\"Call Duration\"\r\n [value]=\"displayTime\"\r\n [attr.aria-labelledby]=\"labelledByText || null\">\r\n</div>\r\n", styles: [".durationInput:focus{outline-style:none}\n"] }]
|
|
51
51
|
}], ctorParameters: function () { return []; }, propDecorators: { statusText: [{
|
|
@@ -56,10 +56,10 @@ export class HoldtimerComponent {
|
|
|
56
56
|
this._timerId = null;
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
60
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
59
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: HoldtimerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
60
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: HoldtimerComponent, selector: "amc-holdtimer", inputs: { holdCounterData: "holdCounterData", statusText: "statusText", callId: "callId" }, ngImport: i0, template: "<div class=\"holdCallDurationDiv\">\r\n <input\r\n readonly\r\n class=\"holdCallDurationTimer\"\r\n name=\"HoldCallDuration/TotalHoldCallDuration\"\r\n type=\"text\"\r\n tabindex=\"-1\"\r\n title=\"Hold Duration\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n [value]=\"displayTime\">\r\n</div>\r\n", styles: [".holdCallDurationTimer:focus{outline-style:none}\n"] });
|
|
61
61
|
}
|
|
62
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
62
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: HoldtimerComponent, decorators: [{
|
|
63
63
|
type: Component,
|
|
64
64
|
args: [{ selector: 'amc-holdtimer', template: "<div class=\"holdCallDurationDiv\">\r\n <input\r\n readonly\r\n class=\"holdCallDurationTimer\"\r\n name=\"HoldCallDuration/TotalHoldCallDuration\"\r\n type=\"text\"\r\n tabindex=\"-1\"\r\n title=\"Hold Duration\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n [value]=\"displayTime\">\r\n</div>\r\n", styles: [".holdCallDurationTimer:focus{outline-style:none}\n"] }]
|
|
65
65
|
}], ctorParameters: function () { return []; }, propDecorators: { holdCounterData: [{
|
|
@@ -78,10 +78,10 @@ export class InteractionComponent {
|
|
|
78
78
|
localStorage.setItem('focusedPanel', id);
|
|
79
79
|
}
|
|
80
80
|
}
|
|
81
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
82
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
81
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: InteractionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
82
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: InteractionComponent, selector: "amc-interaction", inputs: { interaction: "interaction", newMsgs: "newMsgs" }, outputs: { minimizedChanged: "minimizedChanged", isAgentTyping: "isAgentTyping", newMessage: "newMessage" }, ngImport: i0, template: "<div class=\"AnswerCallFocused\" [id]=\"interaction.interactionId\">\r\n <div class=\"editor callHeaderTop\" (click)=\"clickEvent(interaction.interactionId)\">\r\n <img class=\"statusImage\" aria-hidden=\"true\" [src]=\"interaction.UIHeadersData.statusUrl\" (click)=\"interaction.UIHeadersData.focusHandler.handler(interaction.UIHeadersData.focusHandler.operationName, interaction.UIHeadersData.focusHandler.operationMetadata)\" />\r\n <label class=\"statusText\">\r\n <b [id]=\"interaction.UIHeadersData.statusText\">{{ interaction.UIHeadersData.statusText }}</b>\r\n </label>\r\n <label class=\"verticalDivider\">|</label>\r\n <label class=\"directionText\" *ngIf=\"!interaction.UIHeadersData.displayHoldCounter\">{{ interaction.UIHeadersData.directionText }}</label>\r\n <div class=\"holdCallDurationDiv\" *ngIf=\"interaction.UIHeadersData.displayHoldCounter\">\r\n <amc-holdtimer [holdCounterData]=\"interaction.UIHeadersData.holdCounterData\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\"></amc-holdtimer>\r\n </div>\r\n <img class=\"ViewExpandImage\" [src]=\"interaction.UIHeadersData.minimizeUrl\" alt=\"Minimize\" (click)=\"minimize()\" (keypress)=\"collapseKeypress($event)\" *ngIf=\"!_minimized\" tabindex=\"0\" role=\"button\" aria-label=\"collapse Call Section\">\r\n <img class=\"ViewCollapseImage\" [src]=\"interaction.UIHeadersData.maximizeUrl\" alt=\"Maximize\" (click)=\"maximize()\" (keypress)=\"expandKeypress($event)\" *ngIf=\"_minimized\" tabindex=\"0\" role=\"button\" aria-label=\"expand Call Section\">\r\n <div class=\"DurationDiv\" *ngIf=\"interaction.displayCallTimer\">\r\n <amc-duration [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [startTime]=\"interaction.startTime\"></amc-duration>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"!_minimized\">\r\n\r\n <div *ngIf=\"!isConferenceCall()\">\r\n <div class=\"editor phoneNumberContainer\">\r\n <input class=\"callImage\" type=\"image\" [src]=\"interaction.subheaderData.image.href\" [title]=\"interaction.subheaderData.tooltip || ''\" tabindex=\"-1\">\r\n <input class=\"editor phoneNumberValue\" [attr.aria-labelledby]=\"interaction.UIHeadersData.statusText + ' ' + interaction.subheaderData.value\" readonly type=\"text\" [value]=\"interaction.subheaderData.value\" [id]=\"interaction.subheaderData.value\" tabindex=\"-1\">\r\n </div>\r\n\r\n <div class=\"cadSection\">\r\n <ng-container *ngFor=\"let property of interaction.properties\">\r\n <ng-container *ngIf=\"property.visible\">\r\n <label class=\"col1\" [title]=\"property.displayKey\">{{property.displayKey}}</label>\r\n <amc-property [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" class=\"col2\" [property]=\"property\"> </amc-property>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngFor=\"let property of interaction.associatedData\">\r\n <ng-container *ngIf=\"property.visible\">\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" [title]=\"property.displayKey\">{{property.displayKey}}</label>\r\n <amc-property [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" class=\"col2\" [property]=\"property\"> </amc-property>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <amc-operation *ngIf=\"interaction.chat\" id=\"close-chat\" [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [operations]=\"interaction.operations\"></amc-operation>\r\n <app-chat-box *ngIf=\"interaction.chat\" [isTyping]=\"interaction.chat.isCustomerTyping\" [settings]=\"interaction.chat.settings\"\r\n [messages]=\"interaction.chat.messages\" [newMsgs]=\"newMsgs\" (isAgentTyping)=\"isAgentTyping.emit($event)\" (newMessage)=\"newMessage.emit($event)\"></app-chat-box>\r\n\r\n <div [id]='interaction.interactionId'> </div>\r\n <amc-operation *ngIf=\"!interaction.chat\" [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [operations]=\"interaction.operations\"></amc-operation>\r\n </div>\r\n\r\n <div *ngIf=\"isConferenceCall()\">\r\n <div *ngFor=\"let party of interaction.parties\">\r\n <div class=\"editor phoneNumberContainer\">\r\n <input class=\"callImage\" type=\"image\" [src]=\"party.header.image.href\" [title]=\"party.header.tooltip || ''\" tabindex=\"-1\">\r\n <input class=\"editor phoneNumberValue\" readonly type=\"text\" [value]=\"party.header.value\" tabindex=\"-1\">\r\n </div>\r\n\r\n <div class=\"grid-container\">\r\n <ng-container *ngFor=\"let property of party.properties\">\r\n <ng-container *ngIf=\"property.visible\">\r\n <label class=\"col1\" [title]=\"property.displayKey\">{{ property.displayKey }}</label>\r\n <amc-property [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"party.header.value\" class=\"col2\" [property]=\"property\"> </amc-property>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <amc-operation [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"party.header.value\" [operations]=\"party.operations\"></amc-operation>\r\n <div class=\"AnswerCallFocused\"></div>\r\n </div>\r\n <amc-operation [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [operations]=\"interaction.operations\"></amc-operation>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n", styles: [":host{display:block}.phoneNumberContainer{margin-left:5px!important;padding-left:0;display:flex;align-items:center}.cadSection{margin-bottom:5px}#close-chat{-moz-text-align-last:end;text-align-last:end}.grid-container{margin-left:5px;display:grid;grid-template-columns:auto 1fr;grid-column-gap:10px;max-width:calc(100% - 5px);overflow:hidden}.col1{grid-column:1/2}.col2{grid-column:2/3}.ViewExpandImage{margin:3px}.ViewExpandImage:focus{outline:2px solid rgb(50,150,218);outline-offset:0px}.ViewCollapseImage{margin:3px}.ViewCollapseImage:focus{outline:2px solid rgb(50,150,218);outline-offset:0px}.callImage{cursor:default}.phoneNumberValue:focus{outline-style:none}#call123{border:4px!important}.success{border:2px solid #00adbb!important}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.OperationComponent, selector: "amc-operation", inputs: ["statusText", "callId", "callType", "operations"] }, { kind: "component", type: i3.PropertyComponent, selector: "amc-property", inputs: ["statusText", "callId", "callType", "property"] }, { kind: "component", type: i4.HoldtimerComponent, selector: "amc-holdtimer", inputs: ["holdCounterData", "statusText", "callId"] }, { kind: "component", type: i5.DurationComponent, selector: "amc-duration", inputs: ["statusText", "callId", "startTime"] }, { kind: "component", type: i6.ChatBoxComponent, selector: "app-chat-box", inputs: ["settings", "isTyping", "messages", "newMsgs"], outputs: ["isAgentTyping", "newMessage"] }] });
|
|
83
83
|
}
|
|
84
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
84
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: InteractionComponent, decorators: [{
|
|
85
85
|
type: Component,
|
|
86
86
|
args: [{ selector: 'amc-interaction', template: "<div class=\"AnswerCallFocused\" [id]=\"interaction.interactionId\">\r\n <div class=\"editor callHeaderTop\" (click)=\"clickEvent(interaction.interactionId)\">\r\n <img class=\"statusImage\" aria-hidden=\"true\" [src]=\"interaction.UIHeadersData.statusUrl\" (click)=\"interaction.UIHeadersData.focusHandler.handler(interaction.UIHeadersData.focusHandler.operationName, interaction.UIHeadersData.focusHandler.operationMetadata)\" />\r\n <label class=\"statusText\">\r\n <b [id]=\"interaction.UIHeadersData.statusText\">{{ interaction.UIHeadersData.statusText }}</b>\r\n </label>\r\n <label class=\"verticalDivider\">|</label>\r\n <label class=\"directionText\" *ngIf=\"!interaction.UIHeadersData.displayHoldCounter\">{{ interaction.UIHeadersData.directionText }}</label>\r\n <div class=\"holdCallDurationDiv\" *ngIf=\"interaction.UIHeadersData.displayHoldCounter\">\r\n <amc-holdtimer [holdCounterData]=\"interaction.UIHeadersData.holdCounterData\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\"></amc-holdtimer>\r\n </div>\r\n <img class=\"ViewExpandImage\" [src]=\"interaction.UIHeadersData.minimizeUrl\" alt=\"Minimize\" (click)=\"minimize()\" (keypress)=\"collapseKeypress($event)\" *ngIf=\"!_minimized\" tabindex=\"0\" role=\"button\" aria-label=\"collapse Call Section\">\r\n <img class=\"ViewCollapseImage\" [src]=\"interaction.UIHeadersData.maximizeUrl\" alt=\"Maximize\" (click)=\"maximize()\" (keypress)=\"expandKeypress($event)\" *ngIf=\"_minimized\" tabindex=\"0\" role=\"button\" aria-label=\"expand Call Section\">\r\n <div class=\"DurationDiv\" *ngIf=\"interaction.displayCallTimer\">\r\n <amc-duration [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [startTime]=\"interaction.startTime\"></amc-duration>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"!_minimized\">\r\n\r\n <div *ngIf=\"!isConferenceCall()\">\r\n <div class=\"editor phoneNumberContainer\">\r\n <input class=\"callImage\" type=\"image\" [src]=\"interaction.subheaderData.image.href\" [title]=\"interaction.subheaderData.tooltip || ''\" tabindex=\"-1\">\r\n <input class=\"editor phoneNumberValue\" [attr.aria-labelledby]=\"interaction.UIHeadersData.statusText + ' ' + interaction.subheaderData.value\" readonly type=\"text\" [value]=\"interaction.subheaderData.value\" [id]=\"interaction.subheaderData.value\" tabindex=\"-1\">\r\n </div>\r\n\r\n <div class=\"cadSection\">\r\n <ng-container *ngFor=\"let property of interaction.properties\">\r\n <ng-container *ngIf=\"property.visible\">\r\n <label class=\"col1\" [title]=\"property.displayKey\">{{property.displayKey}}</label>\r\n <amc-property [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" class=\"col2\" [property]=\"property\"> </amc-property>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngFor=\"let property of interaction.associatedData\">\r\n <ng-container *ngIf=\"property.visible\">\r\n <div class=\"editor displayDiv\">\r\n <label class=\"displayLabels\" [title]=\"property.displayKey\">{{property.displayKey}}</label>\r\n <amc-property [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" class=\"col2\" [property]=\"property\"> </amc-property>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <amc-operation *ngIf=\"interaction.chat\" id=\"close-chat\" [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [operations]=\"interaction.operations\"></amc-operation>\r\n <app-chat-box *ngIf=\"interaction.chat\" [isTyping]=\"interaction.chat.isCustomerTyping\" [settings]=\"interaction.chat.settings\"\r\n [messages]=\"interaction.chat.messages\" [newMsgs]=\"newMsgs\" (isAgentTyping)=\"isAgentTyping.emit($event)\" (newMessage)=\"newMessage.emit($event)\"></app-chat-box>\r\n\r\n <div [id]='interaction.interactionId'> </div>\r\n <amc-operation *ngIf=\"!interaction.chat\" [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [operations]=\"interaction.operations\"></amc-operation>\r\n </div>\r\n\r\n <div *ngIf=\"isConferenceCall()\">\r\n <div *ngFor=\"let party of interaction.parties\">\r\n <div class=\"editor phoneNumberContainer\">\r\n <input class=\"callImage\" type=\"image\" [src]=\"party.header.image.href\" [title]=\"party.header.tooltip || ''\" tabindex=\"-1\">\r\n <input class=\"editor phoneNumberValue\" readonly type=\"text\" [value]=\"party.header.value\" tabindex=\"-1\">\r\n </div>\r\n\r\n <div class=\"grid-container\">\r\n <ng-container *ngFor=\"let property of party.properties\">\r\n <ng-container *ngIf=\"property.visible\">\r\n <label class=\"col1\" [title]=\"property.displayKey\">{{ property.displayKey }}</label>\r\n <amc-property [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"party.header.value\" class=\"col2\" [property]=\"property\"> </amc-property>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <amc-operation [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"party.header.value\" [operations]=\"party.operations\"></amc-operation>\r\n <div class=\"AnswerCallFocused\"></div>\r\n </div>\r\n <amc-operation [callType]=\"interaction.UIHeadersData.directionText\" [statusText]=\"interaction.UIHeadersData.statusText\" [callId]=\"interaction.subheaderData.value\" [operations]=\"interaction.operations\"></amc-operation>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n", styles: [":host{display:block}.phoneNumberContainer{margin-left:5px!important;padding-left:0;display:flex;align-items:center}.cadSection{margin-bottom:5px}#close-chat{-moz-text-align-last:end;text-align-last:end}.grid-container{margin-left:5px;display:grid;grid-template-columns:auto 1fr;grid-column-gap:10px;max-width:calc(100% - 5px);overflow:hidden}.col1{grid-column:1/2}.col2{grid-column:2/3}.ViewExpandImage{margin:3px}.ViewExpandImage:focus{outline:2px solid rgb(50,150,218);outline-offset:0px}.ViewCollapseImage{margin:3px}.ViewCollapseImage:focus{outline:2px solid rgb(50,150,218);outline-offset:0px}.callImage{cursor:default}.phoneNumberValue:focus{outline-style:none}#call123{border:4px!important}.success{border:2px solid #00adbb!important}\n"] }]
|
|
87
87
|
}], ctorParameters: function () { return []; }, propDecorators: { interaction: [{
|
|
@@ -27,10 +27,10 @@ export class LoginComponent {
|
|
|
27
27
|
field.isInvalid = true;
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
31
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
30
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: LoginComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
31
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: LoginComponent, selector: "amc-login", inputs: { loginData: "loginData" }, outputs: { loginDetailsProvided: "loginDetailsProvided" }, ngImport: i0, template: "<div class=\"login-container\">\r\n <form (ngSubmit)=\"onLogin(loginForm)\"class=\"login-form\" id=\"login-form\" #loginForm=\"ngForm\">\r\n <div class=\"header-container\">\r\n <label class=\"login-header\" attr.aria-label=\"login\">{{ loginData.header }}</label>\r\n </div>\r\n <div class=\"fields-container\">\r\n <div *ngFor=\"let field of loginData.fields\" class=\"field\">\r\n <label class=\"field-label\">\r\n {{ field.name }}:\r\n </label>\r\n\r\n <input\r\n ngModel\r\n class=\"field-input\"\r\n attr.aria-label=\"{{ field.name }}\"\r\n [name]=\"field.name\"\r\n [type]=\"field.type\"\r\n [value]=\"field.value\"\r\n [placeholder]=\"field.placeholder || ''\"\r\n [required]=\"field.isRequired || false\"\r\n (focusout)=\"focusOutOfInput(loginForm, field)\"/>\r\n\r\n <p class=\"invalid-input\" *ngIf=\"field.isInvalid\">{{ field.invalidMessage }}</p>\r\n </div>\r\n\r\n <button\r\n type=\"submit\"\r\n class=\"form-submit\"\r\n form=\"login-form\"\r\n tabindex=\"0\"\r\n attr.aria-label=\"send\"\r\n [disabled]=\"!loginForm.valid\">Login</button>\r\n </div>\r\n\r\n </form>\r\n</div>\r\n", styles: [".login-container{border:1px solid #939598;white-space:nowrap;font-family:Arial;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;text-overflow:ellipsis;position:relative;font-size:.9em;overflow-x:hidden;overflow-y:hidden}.header-container{border-bottom:1px solid #939598;background-color:#f4f5fb;width:100%;height:28px;position:sticky}.login-header{margin-top:auto;margin-left:7px;padding:5px;font-weight:700;font-size:.9em}.fields-container{overflow-y:auto;font-size:.9em;padding:5px}.field{display:table-row;margin:5px}.field-label{padding:10px;display:table-cell}.field-input{display:table-cell;border:1px solid #939598;border-radius:5px}.field-input:focus{box-shadow:0 0 5px #38badf}.form-submit{margin:15px 10px 10px;display:table-row;border:1px solid #00a4b0;border-radius:5px;background-color:#00a4b0;color:#f7f7f7;width:10em;height:2em;transition:all .2s;font-size:1.1em;position:relative;top:50%;left:50%;transform:translate(-50%,-50%)}.form-submit:hover{background-color:#01858f}.form-submit:disabled{background-color:silver;border-color:silver;color:#fff}input.ng-invalid.ng-touched[required]{border-color:#a94442}.form-submit:focus{outline:2px solid rgb(50,150,218);outline-offset:5px}.invalid-input{margin:0;padding:0;color:#a94442;font-size:x-small}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
32
32
|
}
|
|
33
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
33
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: LoginComponent, decorators: [{
|
|
34
34
|
type: Component,
|
|
35
35
|
args: [{ selector: 'amc-login', template: "<div class=\"login-container\">\r\n <form (ngSubmit)=\"onLogin(loginForm)\"class=\"login-form\" id=\"login-form\" #loginForm=\"ngForm\">\r\n <div class=\"header-container\">\r\n <label class=\"login-header\" attr.aria-label=\"login\">{{ loginData.header }}</label>\r\n </div>\r\n <div class=\"fields-container\">\r\n <div *ngFor=\"let field of loginData.fields\" class=\"field\">\r\n <label class=\"field-label\">\r\n {{ field.name }}:\r\n </label>\r\n\r\n <input\r\n ngModel\r\n class=\"field-input\"\r\n attr.aria-label=\"{{ field.name }}\"\r\n [name]=\"field.name\"\r\n [type]=\"field.type\"\r\n [value]=\"field.value\"\r\n [placeholder]=\"field.placeholder || ''\"\r\n [required]=\"field.isRequired || false\"\r\n (focusout)=\"focusOutOfInput(loginForm, field)\"/>\r\n\r\n <p class=\"invalid-input\" *ngIf=\"field.isInvalid\">{{ field.invalidMessage }}</p>\r\n </div>\r\n\r\n <button\r\n type=\"submit\"\r\n class=\"form-submit\"\r\n form=\"login-form\"\r\n tabindex=\"0\"\r\n attr.aria-label=\"send\"\r\n [disabled]=\"!loginForm.valid\">Login</button>\r\n </div>\r\n\r\n </form>\r\n</div>\r\n", styles: [".login-container{border:1px solid #939598;white-space:nowrap;font-family:Arial;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;text-overflow:ellipsis;position:relative;font-size:.9em;overflow-x:hidden;overflow-y:hidden}.header-container{border-bottom:1px solid #939598;background-color:#f4f5fb;width:100%;height:28px;position:sticky}.login-header{margin-top:auto;margin-left:7px;padding:5px;font-weight:700;font-size:.9em}.fields-container{overflow-y:auto;font-size:.9em;padding:5px}.field{display:table-row;margin:5px}.field-label{padding:10px;display:table-cell}.field-input{display:table-cell;border:1px solid #939598;border-radius:5px}.field-input:focus{box-shadow:0 0 5px #38badf}.form-submit{margin:15px 10px 10px;display:table-row;border:1px solid #00a4b0;border-radius:5px;background-color:#00a4b0;color:#f7f7f7;width:10em;height:2em;transition:all .2s;font-size:1.1em;position:relative;top:50%;left:50%;transform:translate(-50%,-50%)}.form-submit:hover{background-color:#01858f}.form-submit:disabled{background-color:silver;border-color:silver;color:#fff}input.ng-invalid.ng-touched[required]{border-color:#a94442}.form-submit:focus{outline:2px solid rgb(50,150,218);outline-offset:5px}.invalid-input{margin:0;padding:0;color:#a94442;font-size:x-small}\n"] }]
|
|
36
36
|
}], ctorParameters: function () { return []; }, propDecorators: { loginData: [{
|
|
@@ -38,10 +38,10 @@ export class OperationComponent {
|
|
|
38
38
|
operation.handler(operation.operationName, operation.operationMetadata);
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
42
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
41
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: OperationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: OperationComponent, selector: "amc-operation", inputs: { statusText: "statusText", callId: "callId", callType: "callType", operations: "operations" }, ngImport: i0, template: "<div class=\"callOptions\">\r\n <img\r\n class=\"AnswerCallImages\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n attr.aria-label=\"{{ operation.title }}\"\r\n *ngFor=\"let operation of operations\"\r\n [title]=\"operation.title\"\r\n [src]=\"operation.icon\"\r\n [attr.accesskey]=\"operation.accesskey || null\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n [attr.aria-describedby]=\"describedByText || null\"\r\n (click)=\"operation.handler(operation.operationName, operation.operationMetadata)\"\r\n (keypress)=\"operationKeypress($event, operation)\"/>\r\n</div>\r\n", styles: [".AnswerCallImages:focus{outline:2px solid rgb(50,150,218);outline-offset:1px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
43
43
|
}
|
|
44
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
44
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: OperationComponent, decorators: [{
|
|
45
45
|
type: Component,
|
|
46
46
|
args: [{ selector: 'amc-operation', template: "<div class=\"callOptions\">\r\n <img\r\n class=\"AnswerCallImages\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n attr.aria-label=\"{{ operation.title }}\"\r\n *ngFor=\"let operation of operations\"\r\n [title]=\"operation.title\"\r\n [src]=\"operation.icon\"\r\n [attr.accesskey]=\"operation.accesskey || null\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n [attr.aria-describedby]=\"describedByText || null\"\r\n (click)=\"operation.handler(operation.operationName, operation.operationMetadata)\"\r\n (keypress)=\"operationKeypress($event, operation)\"/>\r\n</div>\r\n", styles: [".AnswerCallImages:focus{outline:2px solid rgb(50,150,218);outline-offset:1px}\n"] }]
|
|
47
47
|
}], ctorParameters: function () { return []; }, propDecorators: { statusText: [{
|
|
@@ -88,10 +88,10 @@ export class PropertyComponent {
|
|
|
88
88
|
}
|
|
89
89
|
}
|
|
90
90
|
}
|
|
91
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.
|
|
92
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.
|
|
91
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PropertyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
92
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: PropertyComponent, selector: "amc-property", inputs: { statusText: "statusText", callId: "callId", callType: "callType", property: "property" }, ngImport: i0, template: "<input\r\n readonly\r\n *ngIf=\"!property.customOperations\"\r\n class=\"displayData\"\r\n tabindex=\"0\"\r\n type=\"text\"\r\n [name]=\"processedDisplayValue\"\r\n [title]=\"title || null\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n [value]=\"processedDisplayValue\"/>\r\n\r\n <input\r\n readonly\r\n *ngIf=\"property.customOperations\"\r\n class=\"cursor displayData\"\r\n type=\"text\"\r\n tabindex=\"0\"\r\n [name]=\"processedDisplayValue\"\r\n [title]=\"title || null\"\r\n [value]=\"processedDisplayValue\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n (click)=\"property.customOperations.handler(property.customOperations.eventName, property.customOperations.eventMetadata)\" />\r\n", styles: ["input{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;border:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
93
93
|
}
|
|
94
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.
|
|
94
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: PropertyComponent, decorators: [{
|
|
95
95
|
type: Component,
|
|
96
96
|
args: [{ selector: 'amc-property', template: "<input\r\n readonly\r\n *ngIf=\"!property.customOperations\"\r\n class=\"displayData\"\r\n tabindex=\"0\"\r\n type=\"text\"\r\n [name]=\"processedDisplayValue\"\r\n [title]=\"title || null\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n [value]=\"processedDisplayValue\"/>\r\n\r\n <input\r\n readonly\r\n *ngIf=\"property.customOperations\"\r\n class=\"cursor displayData\"\r\n type=\"text\"\r\n tabindex=\"0\"\r\n [name]=\"processedDisplayValue\"\r\n [title]=\"title || null\"\r\n [value]=\"processedDisplayValue\"\r\n [attr.aria-labelledby]=\"labelledByText || null\"\r\n (click)=\"property.customOperations.handler(property.customOperations.eventName, property.customOperations.eventMetadata)\" />\r\n", styles: ["input{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;border:0}\n"] }]
|
|
97
97
|
}], ctorParameters: function () { return []; }, propDecorators: { statusText: [{
|