vcomply-workflow-engine 3.0.12 → 3.0.13

package/bundles/vcomply-workflow-engine.umd.js

@@ -36233,7 +36233,7 @@
     PolicyAccessComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'app-policy-access',
-                    template: "<div class=\"policy-access-dialog\">\r\n    <div class=\"policy-access-dialog-head vx-d-flex vx-align-center vx-justify-between vx-pl-4 vx-pr-4\">\r\n        <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Specify Policy Portal Access Type</div>\r\n    </div>\r\n    <div class=\"policy-access-dialog-body\">\r\n        <div class=\"policy-access-dialog-body-inner\">\r\n            <!-- Step 1 -->\r\n            <div class=\"approvers-form-group vx-mb-2\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">STEP 1: ACCESS TYPE <span class=\"vx-fs-14 vx-txt-red\">*</span></div>\r\n                <div class=\"vx-d-flex vx-align-center vx-justify-between\">\r\n                    <app-cs-radio \r\n                        [name]=\"'policyAccessType'\" [checked]=\"policyAccessType === 0\" (checkedEvent)=\"setAccessField(0)\">\r\n                        <div class=\"approval-type vx-d-flex vx-align-center vx-justify-between vx-p-2 vx-pl-3 vx-pr-3\">\r\n                            <div class=\"vx-d-flex vx-align-center\">\r\n                                <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/anyone.svg\" />\r\n                                <div class=\"vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase\">EVERYONE WHO HAS ACCESS TO THIS POLICY CATEGORY</div>\r\n                                <i class=\"icons vx-fs-12 vx-txt-blue vx-ml-2\" [appTooltip]=\"'If selected, this policy will be visible to all users selected as authors, approvers and category owners of the policy categories linked with this policy.'\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\">&#xe91f;</i>\r\n                            </div>\r\n                            <div class=\"vx-d-block\">\r\n                                <span class=\"circle-selection\"></span>\r\n                                <i class=\"icons ckeck-selection vx-fs-16\">&#xe949;</i>\r\n                            </div>\r\n                        </div>\r\n                    </app-cs-radio>\r\n                    <app-cs-radio\r\n                        [name]=\"'policyAccessType'\" [checked]=\"policyAccessType === 1\" (checkedEvent)=\"setAccessField(1)\">\r\n                        <div class=\"approval-type vx-d-flex vx-align-center vx-justify-between vx-p-2 vx-pl-3 vx-pr-3\">\r\n                            <div class=\"vx-d-flex vx-align-center\">\r\n                                <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/round-robin.svg\" />\r\n                                <div class=\"vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase\">SELECT USERS & GROUPS</div>\r\n                                <i class=\"icons vx-fs-12 vx-txt-blue vx-ml-2\" [appTooltip]=\"'This option allows you to specify users or groups that can view this policy, This is the list of all users within your VComply account.'\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\">&#xe91f;</i>\r\n                            </div>\r\n                            <div class=\"vx-d-block\">\r\n                                <span class=\"circle-selection\"></span>\r\n                                <i class=\"icons ckeck-selection vx-fs-16\">&#xe949;</i>\r\n                            </div>\r\n                        </div>\r\n                    </app-cs-radio>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Step 2 -->\r\n            <div class=\"approvers-form-group vx-mb-2\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">STEP 2: SELECT USER(S) <span class=\"vx-fs-14 vx-txt-red\">*</span></div>\r\n                <div class=\"approvers-user-group\">\r\n                    <user-group-list \r\n                        *ngIf=\"policyAccessType === 0\"\r\n                        [userlist]=\"orgUsersList\" \r\n                        [groupEnabled]=\"true\" \r\n                        [groupList]=\"groupsAccessList\"\r\n                        [selectedUsers]=\"usersAccessList\"\r\n                        [selectedGroups]=\"selectedGroups\"\r\n                        [disabledIds]=\"disabledIds\"\r\n                        [nonRemovableUserIds]=\"disabledIds\"\r\n                        [allUserSelectedDisabled]=\"true\"\r\n                        [showFutureUsersSwitch]=\"true\"\r\n                        [futureUsersWillSelect]=\"futureUsersWillSelect\"\r\n                        [isAllDisabled]=\"true\"\r\n                        (cancel)=\"disableSelector()\"\r\n                        (save)=\"saveSelectedUsers($event)\"\r\n                    ></user-group-list>\r\n\r\n                    <user-group-list \r\n                        *ngIf=\"policyAccessType === 1\"\r\n                        [userlist]=\"orgUsersList\" \r\n                        [groupEnabled]=\"true\" \r\n                        [groupList]=\"groupList\"\r\n                        [selectedUsers]=\"selectedUsers\"\r\n                        [selectedGroups]=\"selectedGroups\"\r\n                        [showFutureUsersSwitch]=\"true\"\r\n                        [futureUsersWillSelect]=\"futureUsersWillSelect\"\r\n                        (cancel)=\"disableSelector()\"\r\n                        (save)=\"saveSelectedUsers($event)\"\r\n                    ></user-group-list>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"policy-access-dialog-confirmation\" *ngIf=\"isConfirmationAlertVisible\">\r\n        <div class=\"confirmation-top\">\r\n            <div class=\"icon-block\"><i class=\"icons\">&#xe930;</i></div>\r\n            <div class=\"text\">The policies that you intend to make accessible to the entire organization can be added to the policy portal.\r\n                It is like a shared catalog of all active & updated policies that any logged in user can read/ download for reference.\r\n                Hence, if this option is enabled, it is not necessary for you to set up an attestation schedule or select\r\n                readers to attest the policies.</div>\r\n        </div>\r\n        <div class=\"confirmation-bottom\">\r\n            <div class=\"message\">Are you sure you would like to proceed?</div>\r\n            <div class=\"button-group\">\r\n                <button class=\"no-btn\" (click)=\"saveChanges(false)\">NO</button>\r\n                <button class=\"yes-btn\" (click)=\"saveChanges(true)\">YES</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n<!-- [selectedUsers]=\"policyForm.CCFailEmail\"\r\n[selectedGroups]=\"policyForm.CCFailEmailGroup\"\r\n(save)=\"saveSelectedList('ccFail', $event)\" -->",
+                    template: "<div class=\"policy-access-dialog\">\r\n    <div class=\"policy-access-dialog-head vx-d-flex vx-align-center vx-justify-between vx-pl-4 vx-pr-4\">\r\n        <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Specify Policy Portal Access Type</div>\r\n    </div>\r\n    <div class=\"policy-access-dialog-body\">\r\n        <div class=\"policy-access-dialog-body-inner\">\r\n            <!-- Step 1 -->\r\n            <div class=\"approvers-form-group vx-mb-2\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">STEP 1: ACCESS TYPE <span class=\"vx-fs-14 vx-txt-red\">*</span></div>\r\n                <div class=\"vx-d-flex vx-align-center vx-justify-between\">\r\n                    <app-cs-radio \r\n                        [name]=\"'policyAccessType'\" [checked]=\"policyAccessType === 0\" (checkedEvent)=\"setAccessField(0)\">\r\n                        <div class=\"approval-type vx-d-flex vx-align-center vx-justify-between vx-p-2 vx-pl-3 vx-pr-3\">\r\n                            <div class=\"vx-d-flex vx-align-center\">\r\n                                <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/select-users.svg\" />\r\n                                <div class=\"vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase\">EVERYONE WHO HAS ACCESS TO THIS POLICY CATEGORY</div>\r\n                                <i class=\"icons vx-fs-12 vx-txt-blue vx-ml-2\" [appTooltip]=\"'If selected, this policy will be visible to all users selected as authors, approvers and category owners of the policy categories linked with this policy.'\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\">&#xe91f;</i>\r\n                            </div>\r\n                            <div class=\"vx-d-block\">\r\n                                <span class=\"circle-selection\"></span>\r\n                                <i class=\"icons ckeck-selection vx-fs-16\">&#xe949;</i>\r\n                            </div>\r\n                        </div>\r\n                    </app-cs-radio>\r\n                    <app-cs-radio\r\n                        [name]=\"'policyAccessType'\" [checked]=\"policyAccessType === 1\" (checkedEvent)=\"setAccessField(1)\">\r\n                        <div class=\"approval-type vx-d-flex vx-align-center vx-justify-between vx-p-2 vx-pl-3 vx-pr-3\">\r\n                            <div class=\"vx-d-flex vx-align-center\">\r\n                                <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/everyone-as-per-category.svg\" />\r\n                                <div class=\"vx-fs-11 vx-fw-500 vx-paragraph-txt vx-tt-uppercase\">SELECT USERS & GROUPS</div>\r\n                                <i class=\"icons vx-fs-12 vx-txt-blue vx-ml-2\" [appTooltip]=\"'This option allows you to specify users or groups that can view this policy, This is the list of all users within your VComply account.'\" placement=\"bottom\" delay=\"0\" type=\"white\" [tooltipMandatory]=\"true\">&#xe91f;</i>\r\n                            </div>\r\n                            <div class=\"vx-d-block\">\r\n                                <span class=\"circle-selection\"></span>\r\n                                <i class=\"icons ckeck-selection vx-fs-16\">&#xe949;</i>\r\n                            </div>\r\n                        </div>\r\n                    </app-cs-radio>\r\n                </div>\r\n            </div>\r\n\r\n            <!-- Step 2 -->\r\n            <div class=\"approvers-form-group vx-mb-2\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">STEP 2: SELECT USER(S) <span class=\"vx-fs-14 vx-txt-red\">*</span></div>\r\n                <div class=\"approvers-user-group\">\r\n                    <user-group-list \r\n                        *ngIf=\"policyAccessType === 0\"\r\n                        [userlist]=\"orgUsersList\" \r\n                        [groupEnabled]=\"true\" \r\n                        [groupList]=\"groupsAccessList\"\r\n                        [selectedUsers]=\"usersAccessList\"\r\n                        [selectedGroups]=\"selectedGroups\"\r\n                        [disabledIds]=\"disabledIds\"\r\n                        [nonRemovableUserIds]=\"disabledIds\"\r\n                        [allUserSelectedDisabled]=\"true\"\r\n                        [showFutureUsersSwitch]=\"true\"\r\n                        [futureUsersWillSelect]=\"futureUsersWillSelect\"\r\n                        [isAllDisabled]=\"true\"\r\n                        (cancel)=\"disableSelector()\"\r\n                        (save)=\"saveSelectedUsers($event)\"\r\n                    ></user-group-list>\r\n\r\n                    <user-group-list \r\n                        *ngIf=\"policyAccessType === 1\"\r\n                        [userlist]=\"orgUsersList\" \r\n                        [groupEnabled]=\"true\" \r\n                        [groupList]=\"groupList\"\r\n                        [selectedUsers]=\"selectedUsers\"\r\n                        [selectedGroups]=\"selectedGroups\"\r\n                        [showFutureUsersSwitch]=\"true\"\r\n                        [futureUsersWillSelect]=\"futureUsersWillSelect\"\r\n                        (cancel)=\"disableSelector()\"\r\n                        (save)=\"saveSelectedUsers($event)\"\r\n                    ></user-group-list>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"policy-access-dialog-confirmation\" *ngIf=\"isConfirmationAlertVisible\">\r\n        <div class=\"confirmation-top\">\r\n            <div class=\"icon-block\"><i class=\"icons\">&#xe930;</i></div>\r\n            <div class=\"text\">The policies that you intend to make accessible to the entire organization can be added to the policy portal.\r\n                It is like a shared catalog of all active & updated policies that any logged in user can read/ download for reference.\r\n                Hence, if this option is enabled, it is not necessary for you to set up an attestation schedule or select\r\n                readers to attest the policies.</div>\r\n        </div>\r\n        <div class=\"confirmation-bottom\">\r\n            <div class=\"message\">Are you sure you would like to proceed?</div>\r\n            <div class=\"button-group\">\r\n                <button class=\"no-btn\" (click)=\"saveChanges(false)\">NO</button>\r\n                <button class=\"yes-btn\" (click)=\"saveChanges(true)\">YES</button>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n\r\n<!-- [selectedUsers]=\"policyForm.CCFailEmail\"\r\n[selectedGroups]=\"policyForm.CCFailEmailGroup\"\r\n(save)=\"saveSelectedList('ccFail', $event)\" -->",
                     styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .policy-access-dialog{position:fixed;top:0;right:500px;bottom:0;left:0}::ng-deep .policy-access-dialog:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .policy-access-dialog-head{background:#fbfbfb;height:2.75rem;border-bottom:1px solid #f1f1f1}::ng-deep .policy-access-dialog-body{background:#fff;height:calc(100vh - 2.75rem);padding:2rem;overflow:hidden}::ng-deep .policy-access-dialog-body-inner{height:calc(100vh - 6.75rem)}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio{width:calc(50% - .25rem)}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item{width:100%}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item .radio,::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item .radiomark{display:none!important}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item .value{margin-left:0!important;max-width:100%!important;width:100%}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item .value .approval-type{border-radius:.25rem;border:1px solid #dbdbdb;width:100%}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item .value .approval-type img{height:2rem;margin-right:.75rem}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item .value .approval-type .circle-selection{border-radius:50%;border:1px solid #dbdbdb;display:block;width:1rem;min-width:1rem;height:1rem}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item .value .approval-type .ckeck-selection{color:#34aa44;display:none}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item input[type=radio]:checked~.value .approval-type{background:#EEFCF0;border:1px solid #34AA44}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item input[type=radio]:checked~.value .approval-type .circle-selection{display:none}::ng-deep .policy-access-dialog-body-inner .approvers-form-group app-cs-radio .radio-item input[type=radio]:checked~.value .approval-type .ckeck-selection{display:block}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list{position:static!important}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list:before{display:none!important}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-head{display:none!important}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-body{padding:0!important;height:auto!important;margin-bottom:1rem}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-body-inner{border-radius:.25rem;border:1px solid #dbdbdb;margin-bottom:1rem}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-body .user-group-list-tab{border-bottom:1px solid #dbdbdb;padding:.75rem .75rem 0}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-body .search-block{padding:0 .75rem}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-body .search-block i{left:1.75rem}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-body .user-group-list-mid{padding:0 .75rem;width:100%;height:calc(100vh - 24.4rem)}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-mid{height:calc(100vh - 25.95rem)}::ng-deep .policy-access-dialog-body-inner .approvers-form-group .approvers-user-group user-group-list .user-group-list .user-group-list-footer vui-floating-bar .reviewer-floating-bar{padding:0!important}::ng-deep .policy-access-dialog-confirmation{background:#161B2F;border-radius:.25rem;position:absolute;left:2rem;right:2rem;bottom:2rem;z-index:1}::ng-deep .policy-access-dialog-confirmation .confirmation-top{display:flex;align-items:center;justify-content:flex-start;padding:1.25rem}::ng-deep .policy-access-dialog-confirmation .confirmation-top .icon-block{height:2.25rem;min-width:2.25rem;border-radius:50%;background:#fff;border:1px solid #dbdbdb;display:flex;justify-content:center;align-items:center;margin-right:1rem}::ng-deep .policy-access-dialog-confirmation .confirmation-top .icon-block i{color:#eb2424;font-size:12px}::ng-deep .policy-access-dialog-confirmation .confirmation-top .text{color:#fff;font-size:14px;font-weight:300}::ng-deep .policy-access-dialog-confirmation .confirmation-bottom{background:#282E48;border-radius:0 0 .25rem .25rem;padding:.75rem .75rem .75rem 1.25rem;display:flex;align-items:center;justify-content:space-between}::ng-deep .policy-access-dialog-confirmation .confirmation-bottom .message{font-size:14px;font-weight:500;line-height:20px;color:#fff}::ng-deep .policy-access-dialog-confirmation .confirmation-bottom .button-group{display:flex}::ng-deep .policy-access-dialog-confirmation .confirmation-bottom .button-group button{height:1.5rem;width:4rem;border:1px solid #fff;border-radius:.125rem;display:flex;align-items:center;justify-content:center;line-height:22px;cursor:pointer;font-size:11px;text-transform:uppercase;font-weight:500;padding:0}::ng-deep .policy-access-dialog-confirmation .confirmation-bottom .button-group button.no-btn{background:transparent;color:#fff}::ng-deep .policy-access-dialog-confirmation .confirmation-bottom .button-group button.yes-btn{background:#fff;color:#1e5dd3;margin-left:.25rem}::ng-deep .policy-access-dialog-confirmation.error-confirmation{background:#eb2424}::ng-deep .policy-access-dialog-confirmation.error-confirmation .confirmation-top{justify-content:space-between}::ng-deep .policy-access-dialog-confirmation.error-confirmation .confirmation-top button{height:1.5rem;width:3rem;border:1px solid #fff;border-radius:.125rem;display:flex;align-items:center;justify-content:center;line-height:22px;cursor:pointer;font-size:11px;text-transform:uppercase;font-weight:500;padding:0}::ng-deep .policy-access-dialog-confirmation.error-confirmation .confirmation-top button.ok-btn{background:#fff;color:#eb2424;margin-left:.25rem}\n"]
                 },] }
     ];