@symphony-talent/component-library 3.47.0 → 3.49.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/atoms/input-chips/input-chips.component.mjs +3 -3
- package/esm2020/lib/atoms/input-dropdown/input-dropdown.component.mjs +3 -3
- package/esm2020/lib/atoms/input-editable-text/input-editable-text.component.mjs +36 -6
- package/esm2020/lib/atoms/input-editable-text/input-editable-text.model.mjs +1 -1
- package/esm2020/lib/molecules/advertise-postingboard-selection-item/advertise-postingboard-selection-item.component.mjs +21 -3
- package/esm2020/lib/organisms/action-bar/action-bar.component.mjs +5 -3
- package/esm2020/lib/organisms/action-bar-advertise-job-list/action-bar-advertise-job-list.component.mjs +1 -1
- package/esm2020/lib/organisms/action-bar-job-list/action-bar-job-list.component.mjs +5 -3
- package/esm2020/lib/organisms/advertise-postingboard-selection-list/advertise-postingboard-selection-list.component.mjs +9 -5
- package/esm2020/lib/pages/modals/advertise-modal/advertise-modal.component.mjs +13 -4
- package/esm2020/lib/pages/modals/advertise-modal/advertise-modal.model.mjs +1 -1
- package/esm2020/projects/component-library/lib/atoms/input-chips/input-chips.component.mjs +3 -3
- package/esm2020/projects/component-library/lib/atoms/input-dropdown/input-dropdown.component.mjs +3 -3
- package/esm2020/projects/component-library/lib/atoms/input-editable-text/input-editable-text.component.mjs +36 -6
- package/esm2020/projects/component-library/lib/atoms/input-editable-text/input-editable-text.model.mjs +1 -1
- package/esm2020/projects/component-library/lib/molecules/advertise-postingboard-selection-item/advertise-postingboard-selection-item.component.mjs +21 -3
- package/esm2020/projects/component-library/lib/organisms/action-bar/action-bar.component.mjs +5 -3
- package/esm2020/projects/component-library/lib/organisms/action-bar-advertise-job-list/action-bar-advertise-job-list.component.mjs +1 -1
- package/esm2020/projects/component-library/lib/organisms/action-bar-job-list/action-bar-job-list.component.mjs +5 -3
- package/esm2020/projects/component-library/lib/organisms/advertise-postingboard-selection-list/advertise-postingboard-selection-list.component.mjs +9 -5
- package/esm2020/projects/component-library/lib/pages/modals/advertise-modal/advertise-modal.component.mjs +13 -4
- package/esm2020/projects/component-library/lib/pages/modals/advertise-modal/advertise-modal.model.mjs +1 -1
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +87 -22
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +87 -22
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +87 -22
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +87 -22
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/lib/atoms/input-editable-text/input-editable-text.component.d.ts +8 -3
- package/lib/atoms/input-editable-text/input-editable-text.model.d.ts +3 -0
- package/lib/molecules/advertise-postingboard-selection-item/advertise-postingboard-selection-item.component.d.ts +5 -1
- package/lib/organisms/action-bar/action-bar.component.d.ts +2 -1
- package/lib/organisms/action-bar-job-list/action-bar-job-list.component.d.ts +2 -1
- package/lib/organisms/advertise-postingboard-selection-list/advertise-postingboard-selection-list.component.d.ts +2 -0
- package/lib/pages/modals/advertise-modal/advertise-modal.model.d.ts +3 -0
- package/package.json +1 -1
- package/projects/component-library/lib/atoms/input-editable-text/input-editable-text.component.d.ts +8 -3
- package/projects/component-library/lib/atoms/input-editable-text/input-editable-text.model.d.ts +3 -0
- package/projects/component-library/lib/molecules/advertise-postingboard-selection-item/advertise-postingboard-selection-item.component.d.ts +5 -1
- package/projects/component-library/lib/organisms/action-bar/action-bar.component.d.ts +2 -1
- package/projects/component-library/lib/organisms/action-bar-job-list/action-bar-job-list.component.d.ts +2 -1
- package/projects/component-library/lib/organisms/advertise-postingboard-selection-list/advertise-postingboard-selection-list.component.d.ts +2 -0
- package/projects/component-library/lib/pages/modals/advertise-modal/advertise-modal.model.d.ts +3 -0
|
@@ -1131,10 +1131,10 @@ class InputDropdownComponent {
|
|
|
1131
1131
|
}
|
|
1132
1132
|
}
|
|
1133
1133
|
InputDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1134
|
-
InputDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputDropdownComponent, selector: "symphony-input-dropdown", inputs: { inputDropdownListModel: "inputDropdownListModel", disableBtn: "disableBtn", isInverse: "isInverse", isRequired: "isRequired" }, outputs: { selectItem: "selectItem", clearSelection: "clearSelection" }, ngImport: i0, template: "<div\n *ngIf=\"inputDropdownListModel.componentHeading\"\n class=\"sfx-dropdown-label sfx-d-inline-block\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n>\n {{ inputDropdownListModel.componentHeading }}\n <span class=\"requiredField\" *ngIf=\"isRequired\">*</span>\n</div>\n<div\n class=\"btn-group sfx-dropdown sfx-d-inline-block\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n [isDisabled]=\"disableBtn\"\n dropdown\n>\n <button\n id=\"moreDrop\"\n dropdownToggle\n type=\"button\"\n class=\"btn dropdown-toggle\"\n aria-controls=\"dropdown-basic\"\n >\n {{ inputDropdownListModel.selectedName }}\n
|
|
1134
|
+
InputDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputDropdownComponent, selector: "symphony-input-dropdown", inputs: { inputDropdownListModel: "inputDropdownListModel", disableBtn: "disableBtn", isInverse: "isInverse", isRequired: "isRequired" }, outputs: { selectItem: "selectItem", clearSelection: "clearSelection" }, ngImport: i0, template: "<div\n *ngIf=\"inputDropdownListModel.componentHeading\"\n class=\"sfx-dropdown-label sfx-d-inline-block\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n>\n {{ inputDropdownListModel.componentHeading }}\n <span class=\"requiredField\" *ngIf=\"isRequired\">*</span>\n</div>\n<div\n class=\"btn-group sfx-dropdown sfx-d-inline-block sfx-wid-100\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n [isDisabled]=\"disableBtn\"\n dropdown\n>\n <button\n id=\"moreDrop\"\n dropdownToggle\n type=\"button\"\n class=\"btn dropdown-toggle sfx-ellipse\"\n aria-controls=\"dropdown-basic\"\n >\n {{ inputDropdownListModel.selectedName }}\n <i *ngIf=\"!disableBtn\" class=\"si-arrow-hide-reveal\"></i>\n </button>\n <hr />\n <ul\n id=\"dropdown-basic\"\n *dropdownMenu\n class=\"dropdown-menu\"\n role=\"menu\"\n aria-labelledby=\"moreDrop\"\n [ngClass]=\"{ 'sfx-pb-0': inputDropdownListModel.showClearButton === true }\"\n >\n <li\n *ngFor=\"let action of inputDropdownListModel.dropdownList\"\n [ngClass]=\"{ disabled: action.isDisabled }\"\n (click)=\"itemClick(action)\"\n >\n <a class=\"dropdown-item\" href=\"javascript:;\">{{ action.name }}</a>\n </li>\n <div\n *ngIf=\"inputDropdownListModel.showClearButton\"\n class=\"divider dropdown-divider\"\n ></div>\n <a\n class=\"sfx-filter-item-footer\"\n *ngIf=\"inputDropdownListModel.showClearButton\"\n >\n <button\n type=\"button\"\n (click)=\"onClearSelection()\"\n class=\"pull-left sfx-clear-button\"\n >\n Clear All\n </button>\n </a>\n </ul>\n</div>\n", styles: [".sfx-dropdown-label{font-family:neuzeit_groteskbold;line-height:25px;margin-bottom:.27rem;margin-left:calc(.3rem + 1px)}.sfx-dropdown{min-width:100%}.sfx-dropdown.open button.dropdown-toggle.btn:hover{color:#fff!important}.sfx-dropdown.open button.dropdown-toggle.btn:focus{color:#fff!important}.sfx-dropdown hr{margin:0;border-top:none;height:1px;width:100%}.sfx-dropdown button.dropdown-toggle.btn{width:calc(100% - .6rem);height:40px;background:transparent;border-color:#d0d0d0;color:#000!important;margin:.3rem;text-align:left;box-shadow:none;padding:10px 15px;min-height:40px;border-radius:4px!important;text-transform:none}.sfx-dropdown button.dropdown-toggle.btn:before{color:#fff}.sfx-dropdown button.dropdown-toggle.btn:disabled{opacity:1;background:#1d1d1d;border-color:#1d1d1d}.sfx-dropdown button.dropdown-toggle.btn:disabled:before{color:#565656}.sfx-dropdown i{position:absolute;right:6px;top:12px;transform:rotate(180deg);z-index:10;transition:linear .1s;font-size:18px}.sfx-dropdown .dropdown-menu{box-shadow:0 10px 10px #0003;background:#fff;width:100%;border:none;max-height:280px;overflow-y:auto;padding:0 0 10px;margin:0;border-radius:0}.sfx-dropdown .dropdown-menu li a.dropdown-item{padding:.625rem 1.25rem;color:#000;font-family:neuzeit_groteskbold,sans-serif;word-break:break-word;white-space:normal}.sfx-dropdown .dropdown-menu li a.dropdown-item:hover{background:#000;color:#fff}.sfx-dropdown ::-webkit-scrollbar{width:10px}.sfx-dropdown ::-webkit-scrollbar-track{background:#fff}.sfx-dropdown ::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}.sfx-dropdown ::-webkit-scrollbar-thumb:hover{background:#555}.sfx-dropdown.btn-group.open{background:#fff;box-shadow:0 10px 10px #0003}.sfx-dropdown.btn-group.open i{transform:rotate(0);color:#fff}.sfx-dropdown.btn-group.open hr{margin:0;border-top:1px solid #d0d0d0;width:100%;height:0}.sfx-dropdown.btn-group.open button.dropdown-toggle.btn{background:#000;color:#fff!important;border-color:#000}.sfx-dropdown .sfx-clear-button{background:transparent;border:none;color:#000;font-family:neuzeit_groteskbold;padding:15px 20px 26px}.is-inverse.sfx-dropdown-label{color:#fff}.is-inverse button.dropdown-toggle.btn{color:#fff!important;border-color:#565656}.is-inverse i{color:#fff}.sfx-pb-0{padding-bottom:0!important}.requiredField{color:red!important}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.BsDropdownDirective, selector: "[bsDropdown],[dropdown]", inputs: ["autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen", "placement", "triggers", "container", "dropup"], outputs: ["onShown", "onHidden", "isOpenChange"], exportAs: ["bs-dropdown"] }, { type: i1$1.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i1$1.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
1135
1135
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputDropdownComponent, decorators: [{
|
|
1136
1136
|
type: Component,
|
|
1137
|
-
args: [{ selector: 'symphony-input-dropdown', template: "<div\n *ngIf=\"inputDropdownListModel.componentHeading\"\n class=\"sfx-dropdown-label sfx-d-inline-block\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n>\n {{ inputDropdownListModel.componentHeading }}\n <span class=\"requiredField\" *ngIf=\"isRequired\">*</span>\n</div>\n<div\n class=\"btn-group sfx-dropdown sfx-d-inline-block\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n [isDisabled]=\"disableBtn\"\n dropdown\n>\n <button\n id=\"moreDrop\"\n dropdownToggle\n type=\"button\"\n class=\"btn dropdown-toggle\"\n aria-controls=\"dropdown-basic\"\n >\n {{ inputDropdownListModel.selectedName }}\n
|
|
1137
|
+
args: [{ selector: 'symphony-input-dropdown', template: "<div\n *ngIf=\"inputDropdownListModel.componentHeading\"\n class=\"sfx-dropdown-label sfx-d-inline-block\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n>\n {{ inputDropdownListModel.componentHeading }}\n <span class=\"requiredField\" *ngIf=\"isRequired\">*</span>\n</div>\n<div\n class=\"btn-group sfx-dropdown sfx-d-inline-block sfx-wid-100\"\n [ngClass]=\"{ 'is-inverse': isInverse }\"\n [isDisabled]=\"disableBtn\"\n dropdown\n>\n <button\n id=\"moreDrop\"\n dropdownToggle\n type=\"button\"\n class=\"btn dropdown-toggle sfx-ellipse\"\n aria-controls=\"dropdown-basic\"\n >\n {{ inputDropdownListModel.selectedName }}\n <i *ngIf=\"!disableBtn\" class=\"si-arrow-hide-reveal\"></i>\n </button>\n <hr />\n <ul\n id=\"dropdown-basic\"\n *dropdownMenu\n class=\"dropdown-menu\"\n role=\"menu\"\n aria-labelledby=\"moreDrop\"\n [ngClass]=\"{ 'sfx-pb-0': inputDropdownListModel.showClearButton === true }\"\n >\n <li\n *ngFor=\"let action of inputDropdownListModel.dropdownList\"\n [ngClass]=\"{ disabled: action.isDisabled }\"\n (click)=\"itemClick(action)\"\n >\n <a class=\"dropdown-item\" href=\"javascript:;\">{{ action.name }}</a>\n </li>\n <div\n *ngIf=\"inputDropdownListModel.showClearButton\"\n class=\"divider dropdown-divider\"\n ></div>\n <a\n class=\"sfx-filter-item-footer\"\n *ngIf=\"inputDropdownListModel.showClearButton\"\n >\n <button\n type=\"button\"\n (click)=\"onClearSelection()\"\n class=\"pull-left sfx-clear-button\"\n >\n Clear All\n </button>\n </a>\n </ul>\n</div>\n", styles: [".sfx-dropdown-label{font-family:neuzeit_groteskbold;line-height:25px;margin-bottom:.27rem;margin-left:calc(.3rem + 1px)}.sfx-dropdown{min-width:100%}.sfx-dropdown.open button.dropdown-toggle.btn:hover{color:#fff!important}.sfx-dropdown.open button.dropdown-toggle.btn:focus{color:#fff!important}.sfx-dropdown hr{margin:0;border-top:none;height:1px;width:100%}.sfx-dropdown button.dropdown-toggle.btn{width:calc(100% - .6rem);height:40px;background:transparent;border-color:#d0d0d0;color:#000!important;margin:.3rem;text-align:left;box-shadow:none;padding:10px 15px;min-height:40px;border-radius:4px!important;text-transform:none}.sfx-dropdown button.dropdown-toggle.btn:before{color:#fff}.sfx-dropdown button.dropdown-toggle.btn:disabled{opacity:1;background:#1d1d1d;border-color:#1d1d1d}.sfx-dropdown button.dropdown-toggle.btn:disabled:before{color:#565656}.sfx-dropdown i{position:absolute;right:6px;top:12px;transform:rotate(180deg);z-index:10;transition:linear .1s;font-size:18px}.sfx-dropdown .dropdown-menu{box-shadow:0 10px 10px #0003;background:#fff;width:100%;border:none;max-height:280px;overflow-y:auto;padding:0 0 10px;margin:0;border-radius:0}.sfx-dropdown .dropdown-menu li a.dropdown-item{padding:.625rem 1.25rem;color:#000;font-family:neuzeit_groteskbold,sans-serif;word-break:break-word;white-space:normal}.sfx-dropdown .dropdown-menu li a.dropdown-item:hover{background:#000;color:#fff}.sfx-dropdown ::-webkit-scrollbar{width:10px}.sfx-dropdown ::-webkit-scrollbar-track{background:#fff}.sfx-dropdown ::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}.sfx-dropdown ::-webkit-scrollbar-thumb:hover{background:#555}.sfx-dropdown.btn-group.open{background:#fff;box-shadow:0 10px 10px #0003}.sfx-dropdown.btn-group.open i{transform:rotate(0);color:#fff}.sfx-dropdown.btn-group.open hr{margin:0;border-top:1px solid #d0d0d0;width:100%;height:0}.sfx-dropdown.btn-group.open button.dropdown-toggle.btn{background:#000;color:#fff!important;border-color:#000}.sfx-dropdown .sfx-clear-button{background:transparent;border:none;color:#000;font-family:neuzeit_groteskbold;padding:15px 20px 26px}.is-inverse.sfx-dropdown-label{color:#fff}.is-inverse button.dropdown-toggle.btn{color:#fff!important;border-color:#565656}.is-inverse i{color:#fff}.sfx-pb-0{padding-bottom:0!important}.requiredField{color:red!important}\n"] }]
|
|
1138
1138
|
}], ctorParameters: function () { return []; }, propDecorators: { inputDropdownListModel: [{
|
|
1139
1139
|
type: Input
|
|
1140
1140
|
}], disableBtn: [{
|
|
@@ -1356,7 +1356,7 @@ class InputChipsComponent {
|
|
|
1356
1356
|
validateEmail(form) {
|
|
1357
1357
|
let errorCount = form.get(this.controlErrorCount).value;
|
|
1358
1358
|
let control = this.form.controls[this.controlName];
|
|
1359
|
-
const REGEXP = new RegExp('^[a-
|
|
1359
|
+
const REGEXP = new RegExp('^[a-zA-Z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$');
|
|
1360
1360
|
for (let i = 0; i < control.value.length; i++) {
|
|
1361
1361
|
if (!REGEXP.test(control.value[i].value)) {
|
|
1362
1362
|
errorCount = errorCount + 1;
|
|
@@ -1395,7 +1395,7 @@ class EmailValidator {
|
|
|
1395
1395
|
static createValidator(form, controlErrorCount) {
|
|
1396
1396
|
return (control) => {
|
|
1397
1397
|
let errorCount = form.get(controlErrorCount).value;
|
|
1398
|
-
const REGEXP = new RegExp('^[a-
|
|
1398
|
+
const REGEXP = new RegExp('^[a-zA-Z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$');
|
|
1399
1399
|
for (let i = 0; i < control.value.length; i++) {
|
|
1400
1400
|
if (!REGEXP.test(control.value[i].value)) {
|
|
1401
1401
|
errorCount = errorCount + 1;
|
|
@@ -3196,12 +3196,14 @@ class ActionBarComponent {
|
|
|
3196
3196
|
}
|
|
3197
3197
|
}
|
|
3198
3198
|
ActionBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3199
|
-
ActionBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarComponent, selector: "symphony-action-bar", inputs: { isToggled: "isToggled" }, outputs: { toggleClick: "toggleClick" }, ngImport: i0, template: "<div class=\"sfx-title-wrap sfx-pb-30 sfx-action-bar\">\n <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3 sfx-p-0 sfx-action-button\">\n <div class=\"max-contentwidth\" (click)=\"toggleClicked()\">\n <symphony-icon-wrapper\n [ngClass]=\"{ 'action-arrow-down': isToggled }\"\n class=\"sfx-d-inline-block\"\n ><symphony-icon\n [icon]=\"'si-arrow-bold-next'\"\n [size]=\"'13px'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n <symphony-paragraph class=\"sfx-d-inline-block sfx-ml-20\"\n >Actions</symphony-paragraph\n >\n </div>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-8 col-lg-9 sfx-p-0\">\n <div class=\"pull-right sfx-actions-controls\">\n <ng-content select=\"[grid-controls]\"></ng-content>\n </div>\n </div>\n</div>\n<div\n *ngIf=\"isToggled\"\n class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-border-bottom-gray-1 sfx-pr-0\"\n>\n <div class=\"col-xs-11 col-sm-11 col-md-11 col-lg-11 sfx-actions-items\">\n <ng-content select=\"[grid-actions]\"></ng-content>\n </div>\n</div>\n", styles: [".sfx-action-bar{display:inline-block;width:100%;border-bottom:5px solid #000000}.sfx-action-bar .sfx-action-button .max-contentwidth{width:max-content}.sfx-action-bar .sfx-action-button .icon-wrapper{padding:10px 0}.sfx-action-bar .sfx-action-button .icon-wrapper i{font-weight:600;margin-left:1px}.sfx-action-bar .sfx-action-button .action-arrow-down{transform:rotate(90deg)}.sfx-action-bar .sfx-action-button .action-arrow-down i{margin-left:0}.sfx-actions-items{margin-top:1.875rem;padding-bottom:1.25rem}\n"], components: [{ type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["isInverse", "hasHoverWithoutBorder"], outputs: ["clicked"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary"] }], directives: [{ type: i1.
|
|
3199
|
+
ActionBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarComponent, selector: "symphony-action-bar", inputs: { isToggled: "isToggled", hasActionToggle: "hasActionToggle" }, outputs: { toggleClick: "toggleClick" }, ngImport: i0, template: "<div class=\"sfx-title-wrap sfx-pb-30 sfx-action-bar\">\n <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3 sfx-p-0 sfx-action-button\">\n <div class=\"max-contentwidth\" (click)=\"toggleClicked()\" *ngIf=\"hasActionToggle\">\n <symphony-icon-wrapper\n [ngClass]=\"{ 'action-arrow-down': isToggled }\"\n class=\"sfx-d-inline-block\"\n ><symphony-icon\n [icon]=\"'si-arrow-bold-next'\"\n [size]=\"'13px'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n <symphony-paragraph class=\"sfx-d-inline-block sfx-ml-20\"\n >Actions</symphony-paragraph\n >\n </div>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-8 col-lg-9 sfx-p-0\">\n <div class=\"pull-right sfx-actions-controls\">\n <ng-content select=\"[grid-controls]\"></ng-content>\n </div>\n </div>\n</div>\n<div\n *ngIf=\"isToggled\"\n class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-border-bottom-gray-1 sfx-pr-0\"\n>\n <div class=\"col-xs-11 col-sm-11 col-md-11 col-lg-11 sfx-actions-items\">\n <ng-content select=\"[grid-actions]\"></ng-content>\n </div>\n</div>\n", styles: [".sfx-action-bar{display:inline-block;width:100%;border-bottom:5px solid #000000}.sfx-action-bar .sfx-action-button .max-contentwidth{width:max-content}.sfx-action-bar .sfx-action-button .icon-wrapper{padding:10px 0}.sfx-action-bar .sfx-action-button .icon-wrapper i{font-weight:600;margin-left:1px}.sfx-action-bar .sfx-action-button .action-arrow-down{transform:rotate(90deg)}.sfx-action-bar .sfx-action-button .action-arrow-down i{margin-left:0}.sfx-actions-items{margin-top:1.875rem;padding-bottom:1.25rem}\n"], components: [{ type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["isInverse", "hasHoverWithoutBorder"], outputs: ["clicked"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3200
3200
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarComponent, decorators: [{
|
|
3201
3201
|
type: Component,
|
|
3202
|
-
args: [{ selector: 'symphony-action-bar', encapsulation: ViewEncapsulation.None, template: "<div class=\"sfx-title-wrap sfx-pb-30 sfx-action-bar\">\n <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3 sfx-p-0 sfx-action-button\">\n <div class=\"max-contentwidth\" (click)=\"toggleClicked()\">\n <symphony-icon-wrapper\n [ngClass]=\"{ 'action-arrow-down': isToggled }\"\n class=\"sfx-d-inline-block\"\n ><symphony-icon\n [icon]=\"'si-arrow-bold-next'\"\n [size]=\"'13px'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n <symphony-paragraph class=\"sfx-d-inline-block sfx-ml-20\"\n >Actions</symphony-paragraph\n >\n </div>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-8 col-lg-9 sfx-p-0\">\n <div class=\"pull-right sfx-actions-controls\">\n <ng-content select=\"[grid-controls]\"></ng-content>\n </div>\n </div>\n</div>\n<div\n *ngIf=\"isToggled\"\n class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-border-bottom-gray-1 sfx-pr-0\"\n>\n <div class=\"col-xs-11 col-sm-11 col-md-11 col-lg-11 sfx-actions-items\">\n <ng-content select=\"[grid-actions]\"></ng-content>\n </div>\n</div>\n", styles: [".sfx-action-bar{display:inline-block;width:100%;border-bottom:5px solid #000000}.sfx-action-bar .sfx-action-button .max-contentwidth{width:max-content}.sfx-action-bar .sfx-action-button .icon-wrapper{padding:10px 0}.sfx-action-bar .sfx-action-button .icon-wrapper i{font-weight:600;margin-left:1px}.sfx-action-bar .sfx-action-button .action-arrow-down{transform:rotate(90deg)}.sfx-action-bar .sfx-action-button .action-arrow-down i{margin-left:0}.sfx-actions-items{margin-top:1.875rem;padding-bottom:1.25rem}\n"] }]
|
|
3202
|
+
args: [{ selector: 'symphony-action-bar', encapsulation: ViewEncapsulation.None, template: "<div class=\"sfx-title-wrap sfx-pb-30 sfx-action-bar\">\n <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3 sfx-p-0 sfx-action-button\">\n <div class=\"max-contentwidth\" (click)=\"toggleClicked()\" *ngIf=\"hasActionToggle\">\n <symphony-icon-wrapper\n [ngClass]=\"{ 'action-arrow-down': isToggled }\"\n class=\"sfx-d-inline-block\"\n ><symphony-icon\n [icon]=\"'si-arrow-bold-next'\"\n [size]=\"'13px'\"\n ></symphony-icon>\n </symphony-icon-wrapper>\n <symphony-paragraph class=\"sfx-d-inline-block sfx-ml-20\"\n >Actions</symphony-paragraph\n >\n </div>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-8 col-lg-9 sfx-p-0\">\n <div class=\"pull-right sfx-actions-controls\">\n <ng-content select=\"[grid-controls]\"></ng-content>\n </div>\n </div>\n</div>\n<div\n *ngIf=\"isToggled\"\n class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-border-bottom-gray-1 sfx-pr-0\"\n>\n <div class=\"col-xs-11 col-sm-11 col-md-11 col-lg-11 sfx-actions-items\">\n <ng-content select=\"[grid-actions]\"></ng-content>\n </div>\n</div>\n", styles: [".sfx-action-bar{display:inline-block;width:100%;border-bottom:5px solid #000000}.sfx-action-bar .sfx-action-button .max-contentwidth{width:max-content}.sfx-action-bar .sfx-action-button .icon-wrapper{padding:10px 0}.sfx-action-bar .sfx-action-button .icon-wrapper i{font-weight:600;margin-left:1px}.sfx-action-bar .sfx-action-button .action-arrow-down{transform:rotate(90deg)}.sfx-action-bar .sfx-action-button .action-arrow-down i{margin-left:0}.sfx-actions-items{margin-top:1.875rem;padding-bottom:1.25rem}\n"] }]
|
|
3203
3203
|
}], ctorParameters: function () { return []; }, propDecorators: { isToggled: [{
|
|
3204
3204
|
type: Input
|
|
3205
|
+
}], hasActionToggle: [{
|
|
3206
|
+
type: Input
|
|
3205
3207
|
}], toggleClick: [{
|
|
3206
3208
|
type: Output
|
|
3207
3209
|
}] } });
|
|
@@ -3272,14 +3274,16 @@ class ActionBarJobListComponent {
|
|
|
3272
3274
|
}
|
|
3273
3275
|
}
|
|
3274
3276
|
ActionBarJobListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarJobListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3275
|
-
ActionBarJobListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarJobListComponent, selector: "symphony-action-bar-job-list", inputs: { gridActionModel: "gridActionModel", gridControlsModel: "gridControlsModel" }, outputs: { gridControlClick: "gridControlClick", gridActionClick: "gridActionClick" }, ngImport: i0, template: "<symphony-action-bar>\n <symphony-grid-controls\n (Clicked)=\"onGridControlClick($event)\"\n (menuClicked)=\"onGridControlClick($event)\"\n [model]=\"gridControlsModel\"\n grid-controls\n ></symphony-grid-controls>\n <symphony-grid-actions\n (buttonClicked)=\"onGridActionClick($event)\"\n [model]=\"gridActionModel\"\n grid-actions\n ></symphony-grid-actions>\n</symphony-action-bar>\n", styles: [""], components: [{ type: ActionBarComponent, selector: "symphony-action-bar", inputs: ["isToggled"], outputs: ["toggleClick"] }, { type: GridControlsComponent, selector: "symphony-grid-controls", inputs: ["model"], outputs: ["Clicked", "menuClicked"] }, { type: GridActionsComponent, selector: "symphony-grid-actions", inputs: ["model", "isInverse"], outputs: ["buttonClicked"] }] });
|
|
3277
|
+
ActionBarJobListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarJobListComponent, selector: "symphony-action-bar-job-list", inputs: { gridActionModel: "gridActionModel", gridControlsModel: "gridControlsModel", hasActionToggle: "hasActionToggle" }, outputs: { gridControlClick: "gridControlClick", gridActionClick: "gridActionClick" }, ngImport: i0, template: "<symphony-action-bar [hasActionToggle]=\"hasActionToggle\">\n <symphony-grid-controls\n (Clicked)=\"onGridControlClick($event)\"\n (menuClicked)=\"onGridControlClick($event)\"\n [model]=\"gridControlsModel\"\n grid-controls\n ></symphony-grid-controls>\n <symphony-grid-actions\n (buttonClicked)=\"onGridActionClick($event)\"\n [model]=\"gridActionModel\"\n grid-actions\n ></symphony-grid-actions>\n</symphony-action-bar>\n", styles: [""], components: [{ type: ActionBarComponent, selector: "symphony-action-bar", inputs: ["isToggled", "hasActionToggle"], outputs: ["toggleClick"] }, { type: GridControlsComponent, selector: "symphony-grid-controls", inputs: ["model"], outputs: ["Clicked", "menuClicked"] }, { type: GridActionsComponent, selector: "symphony-grid-actions", inputs: ["model", "isInverse"], outputs: ["buttonClicked"] }] });
|
|
3276
3278
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarJobListComponent, decorators: [{
|
|
3277
3279
|
type: Component,
|
|
3278
|
-
args: [{ selector: 'symphony-action-bar-job-list', template: "<symphony-action-bar>\n <symphony-grid-controls\n (Clicked)=\"onGridControlClick($event)\"\n (menuClicked)=\"onGridControlClick($event)\"\n [model]=\"gridControlsModel\"\n grid-controls\n ></symphony-grid-controls>\n <symphony-grid-actions\n (buttonClicked)=\"onGridActionClick($event)\"\n [model]=\"gridActionModel\"\n grid-actions\n ></symphony-grid-actions>\n</symphony-action-bar>\n", styles: [""] }]
|
|
3280
|
+
args: [{ selector: 'symphony-action-bar-job-list', template: "<symphony-action-bar [hasActionToggle]=\"hasActionToggle\">\n <symphony-grid-controls\n (Clicked)=\"onGridControlClick($event)\"\n (menuClicked)=\"onGridControlClick($event)\"\n [model]=\"gridControlsModel\"\n grid-controls\n ></symphony-grid-controls>\n <symphony-grid-actions\n (buttonClicked)=\"onGridActionClick($event)\"\n [model]=\"gridActionModel\"\n grid-actions\n ></symphony-grid-actions>\n</symphony-action-bar>\n", styles: [""] }]
|
|
3279
3281
|
}], ctorParameters: function () { return []; }, propDecorators: { gridActionModel: [{
|
|
3280
3282
|
type: Input
|
|
3281
3283
|
}], gridControlsModel: [{
|
|
3282
3284
|
type: Input
|
|
3285
|
+
}], hasActionToggle: [{
|
|
3286
|
+
type: Input
|
|
3283
3287
|
}], gridControlClick: [{
|
|
3284
3288
|
type: Output
|
|
3285
3289
|
}], gridActionClick: [{
|
|
@@ -5048,45 +5052,87 @@ class InputEditableTextComponent {
|
|
|
5048
5052
|
constructor() {
|
|
5049
5053
|
this.type = 'number';
|
|
5050
5054
|
this.confirm = new EventEmitter();
|
|
5055
|
+
this.validate = new EventEmitter();
|
|
5056
|
+
this.editMode = new EventEmitter();
|
|
5057
|
+
}
|
|
5058
|
+
ngOnInit() {
|
|
5059
|
+
if (this.model.minValue) {
|
|
5060
|
+
this.maxMinPlaceholder = `${this.model.minValue}`;
|
|
5061
|
+
}
|
|
5062
|
+
if (this.model.minValue && this.model.maxValue) {
|
|
5063
|
+
this.maxMinPlaceholder = `${this.model.inputMask}${this.model.minValue} - ${this.model.inputMask}${this.model.maxValue}`;
|
|
5064
|
+
}
|
|
5051
5065
|
}
|
|
5052
5066
|
onEditClick() {
|
|
5053
5067
|
this.model.isInEditMode = true;
|
|
5054
5068
|
this.previousValue = this.model.value;
|
|
5069
|
+
this.editMode.emit(this.model);
|
|
5055
5070
|
}
|
|
5056
5071
|
onConfirmClick() {
|
|
5057
|
-
this.model.
|
|
5058
|
-
|
|
5072
|
+
if (!this.model.isInvalid) {
|
|
5073
|
+
this.model.isInEditMode = false;
|
|
5074
|
+
this.confirm.emit(this.model);
|
|
5075
|
+
}
|
|
5059
5076
|
}
|
|
5060
5077
|
onCloseClick() {
|
|
5061
5078
|
this.model.value = this.previousValue;
|
|
5062
5079
|
this.model.isInEditMode = false;
|
|
5063
5080
|
}
|
|
5081
|
+
onValidate(event) {
|
|
5082
|
+
if (Number(this.model.value) < this.model.minValue) {
|
|
5083
|
+
this.model.isInvalid = true;
|
|
5084
|
+
}
|
|
5085
|
+
else if (this.model.maxValue &&
|
|
5086
|
+
Number(this.model.value) > this.model.maxValue) {
|
|
5087
|
+
this.model.isInvalid = true;
|
|
5088
|
+
}
|
|
5089
|
+
else {
|
|
5090
|
+
this.model.isInvalid = false;
|
|
5091
|
+
}
|
|
5092
|
+
this.validate.emit(this.model);
|
|
5093
|
+
}
|
|
5064
5094
|
}
|
|
5065
5095
|
InputEditableTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5066
|
-
InputEditableTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputEditableTextComponent, selector: "symphony-input-editable-text", inputs: { model: "model", type: "type" }, outputs: { confirm: "confirm" }, ngImport: i0, template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\n <div>\n <symphony-paragraph\n >{{ model.inputMask }}{{ model.value }}</symphony-paragraph\n >\n </div>\n <div *ngIf=\"model.isEditable\" (click)=\"onEditClick()\" class=\"sfx-pl-10\">\n <symphony-icon [icon]=\"'si-edit'\" [size]=\"'14px'\"></symphony-icon>\n </div>\n <div *ngIf=\"!model.isEditable\" class=\"no-icon-padding\"></div>\n </div>\n </div>\n <div
|
|
5096
|
+
InputEditableTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputEditableTextComponent, selector: "symphony-input-editable-text", inputs: { model: "model", type: "type" }, outputs: { confirm: "confirm", validate: "validate", editMode: "editMode" }, ngImport: i0, template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\n <div>\n <symphony-paragraph\n >{{ model.inputMask }}{{ model.value }}</symphony-paragraph\n >\n </div>\n <div *ngIf=\"model.isEditable\" (click)=\"onEditClick()\" class=\"sfx-pl-10\">\n <symphony-icon [icon]=\"'si-edit'\" [size]=\"'14px'\"></symphony-icon>\n </div>\n <div *ngIf=\"!model.isEditable\" class=\"no-icon-padding\"></div>\n </div>\n </div>\n <div\n *ngIf=\"model.isInEditMode\"\n class=\"editMode\"\n [ngClass]=\"{\n invalid: model.isInvalid\n }\"\n >\n <span class=\"sfx-pr-10\"\n ><input\n type=\"{{ type }}\"\n *ngIf=\"maxMinPlaceholder\"\n [placeholder]=\"maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n <input\n type=\"{{ type }}\"\n *ngIf=\"!maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n </span>\n <span class=\"edit-i-postion\"\n ><symphony-icon\n [ngClass]=\"{\n 'invalid-confirm': model.isInvalid\n }\"\n [icon]=\"'si-confirmation'\"\n (click)=\"onConfirmClick()\"\n ></symphony-icon\n ></span>\n <span class=\"sfx-ml-10 edit-i-postion\"\n ><symphony-icon\n [icon]=\"'si-close-modal'\"\n (click)=\"onCloseClick()\"\n ></symphony-icon\n ></span>\n </div>\n</div>\n", styles: [".color-sample{float:left;border-radius:50%;height:30px;width:30px;margin-top:10px;margin-right:20px}.background-color-black{background-color:#000}.background-color-grey{background-color:#bababa}.background-color-light-grey-1{background-color:#d0d0d0}.background-color-light-grey-2{background-color:#d9d9d9}.background-color-light-grey-3{background-color:#ebebeb}.background-color-medium-black{background-color:#464646}.background-color-space-grey{background-color:#141414}.background-color-white{background-color:#fff}.background-color-green{background-color:#00d56b}.background-color-ice-blue{background-color:#03bcce}.background-color-lavender{background-color:#af5af9}.background-color-orange{background-color:#ffa700}.background-color-pink{background-color:#ff6cff}.background-color-purple{background-color:#801afc}.background-color-red{background-color:#f0001e}.background-color-skyblue{background-color:#007dbb}.background-color-turquoise{background-color:#00ebb5}.background-color-yellow{background-color:#fde928}.background-color-cyan{background-color:#00ffd8}.background-color-strong-orange{background-color:#ffa700}.background-color-soft-lime-green{background-color:#67f95a}.background-color-bright-violet{background-color:#7428fd}.background-color-lime-green{background-color:#00bb5e}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;padding:0}input{border-width:0px;border:none;width:75px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}.editMode{border:1px solid #d9d9d9;padding:7.5px 10px;border-radius:4px}.editMode.invalid{border:1px solid #f0001e}.editMode .edit-i-postion{position:relative;top:2px}.editMode .min-max-placeholder::placeholder{color:#bababa}.invalid-confirm{color:#d0d0d0}.invalid-confirm:hover{cursor:no-drop}.invalid-confirm i{pointer-events:none}\n"], components: [{ type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
5067
5097
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextComponent, decorators: [{
|
|
5068
5098
|
type: Component,
|
|
5069
|
-
args: [{ selector: 'symphony-input-editable-text', template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\n <div>\n <symphony-paragraph\n >{{ model.inputMask }}{{ model.value }}</symphony-paragraph\n >\n </div>\n <div *ngIf=\"model.isEditable\" (click)=\"onEditClick()\" class=\"sfx-pl-10\">\n <symphony-icon [icon]=\"'si-edit'\" [size]=\"'14px'\"></symphony-icon>\n </div>\n <div *ngIf=\"!model.isEditable\" class=\"no-icon-padding\"></div>\n </div>\n </div>\n <div
|
|
5099
|
+
args: [{ selector: 'symphony-input-editable-text', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\n <div>\n <symphony-paragraph\n >{{ model.inputMask }}{{ model.value }}</symphony-paragraph\n >\n </div>\n <div *ngIf=\"model.isEditable\" (click)=\"onEditClick()\" class=\"sfx-pl-10\">\n <symphony-icon [icon]=\"'si-edit'\" [size]=\"'14px'\"></symphony-icon>\n </div>\n <div *ngIf=\"!model.isEditable\" class=\"no-icon-padding\"></div>\n </div>\n </div>\n <div\n *ngIf=\"model.isInEditMode\"\n class=\"editMode\"\n [ngClass]=\"{\n invalid: model.isInvalid\n }\"\n >\n <span class=\"sfx-pr-10\"\n ><input\n type=\"{{ type }}\"\n *ngIf=\"maxMinPlaceholder\"\n [placeholder]=\"maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n <input\n type=\"{{ type }}\"\n *ngIf=\"!maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n </span>\n <span class=\"edit-i-postion\"\n ><symphony-icon\n [ngClass]=\"{\n 'invalid-confirm': model.isInvalid\n }\"\n [icon]=\"'si-confirmation'\"\n (click)=\"onConfirmClick()\"\n ></symphony-icon\n ></span>\n <span class=\"sfx-ml-10 edit-i-postion\"\n ><symphony-icon\n [icon]=\"'si-close-modal'\"\n (click)=\"onCloseClick()\"\n ></symphony-icon\n ></span>\n </div>\n</div>\n", styles: [".color-sample{float:left;border-radius:50%;height:30px;width:30px;margin-top:10px;margin-right:20px}.background-color-black{background-color:#000}.background-color-grey{background-color:#bababa}.background-color-light-grey-1{background-color:#d0d0d0}.background-color-light-grey-2{background-color:#d9d9d9}.background-color-light-grey-3{background-color:#ebebeb}.background-color-medium-black{background-color:#464646}.background-color-space-grey{background-color:#141414}.background-color-white{background-color:#fff}.background-color-green{background-color:#00d56b}.background-color-ice-blue{background-color:#03bcce}.background-color-lavender{background-color:#af5af9}.background-color-orange{background-color:#ffa700}.background-color-pink{background-color:#ff6cff}.background-color-purple{background-color:#801afc}.background-color-red{background-color:#f0001e}.background-color-skyblue{background-color:#007dbb}.background-color-turquoise{background-color:#00ebb5}.background-color-yellow{background-color:#fde928}.background-color-cyan{background-color:#00ffd8}.background-color-strong-orange{background-color:#ffa700}.background-color-soft-lime-green{background-color:#67f95a}.background-color-bright-violet{background-color:#7428fd}.background-color-lime-green{background-color:#00bb5e}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;padding:0}input{border-width:0px;border:none;width:75px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}.editMode{border:1px solid #d9d9d9;padding:7.5px 10px;border-radius:4px}.editMode.invalid{border:1px solid #f0001e}.editMode .edit-i-postion{position:relative;top:2px}.editMode .min-max-placeholder::placeholder{color:#bababa}.invalid-confirm{color:#d0d0d0}.invalid-confirm:hover{cursor:no-drop}.invalid-confirm i{pointer-events:none}\n"] }]
|
|
5070
5100
|
}], ctorParameters: function () { return []; }, propDecorators: { model: [{
|
|
5071
5101
|
type: Input
|
|
5072
5102
|
}], type: [{
|
|
5073
5103
|
type: Input
|
|
5074
5104
|
}], confirm: [{
|
|
5075
5105
|
type: Output
|
|
5106
|
+
}], validate: [{
|
|
5107
|
+
type: Output
|
|
5108
|
+
}], editMode: [{
|
|
5109
|
+
type: Output
|
|
5076
5110
|
}] } });
|
|
5077
5111
|
|
|
5078
5112
|
class AdvertisePostingboardSelectionItemComponent {
|
|
5079
5113
|
constructor() {
|
|
5080
5114
|
this.priceChange = new EventEmitter();
|
|
5115
|
+
this.validationChange = new EventEmitter();
|
|
5116
|
+
this.editModeChange = new EventEmitter();
|
|
5081
5117
|
this.postingBoardSelect = new EventEmitter();
|
|
5082
5118
|
}
|
|
5083
5119
|
ngOnInit() {
|
|
5084
5120
|
this.mapModel();
|
|
5085
5121
|
}
|
|
5086
5122
|
onBoardPriceChange(priceChangeEvent) {
|
|
5123
|
+
this.model.isInEditMode = priceChangeEvent.isInEditMode;
|
|
5087
5124
|
this.model.boardPrice = +priceChangeEvent.value;
|
|
5088
5125
|
this.priceChange.emit(this.model);
|
|
5089
5126
|
}
|
|
5127
|
+
onBoardValidateChange(validateChange) {
|
|
5128
|
+
this.model.isInEditMode = validateChange.isInEditMode;
|
|
5129
|
+
this.model.isInvalid = validateChange.isInvalid;
|
|
5130
|
+
this.validationChange.emit(this.model);
|
|
5131
|
+
}
|
|
5132
|
+
onBoardEditMode(editModeChange) {
|
|
5133
|
+
this.model.isInEditMode = editModeChange.isInEditMode;
|
|
5134
|
+
this.editModeChange.emit(this.model);
|
|
5135
|
+
}
|
|
5090
5136
|
onPostingBoardSelect(postingBoardSelectEvent) {
|
|
5091
5137
|
this.model.isSelected = postingBoardSelectEvent.isActive;
|
|
5092
5138
|
this.postingBoardSelect.emit(this.model);
|
|
@@ -5099,19 +5145,25 @@ class AdvertisePostingboardSelectionItemComponent {
|
|
|
5099
5145
|
isEditable: this.model.isEditable,
|
|
5100
5146
|
isInEditMode: this.model.isInEditMode,
|
|
5101
5147
|
id: this.model.id,
|
|
5148
|
+
minValue: this.model.minValue,
|
|
5149
|
+
maxValue: this.model.maxValue
|
|
5102
5150
|
};
|
|
5103
5151
|
}
|
|
5104
5152
|
}
|
|
5105
5153
|
}
|
|
5106
5154
|
AdvertisePostingboardSelectionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5107
|
-
AdvertisePostingboardSelectionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertisePostingboardSelectionItemComponent, selector: "symphony-advertise-postingboard-selection-item", inputs: { model: "model" }, outputs: { priceChange: "priceChange", postingBoardSelect: "postingBoardSelect" }, ngImport: i0, template: "<div *ngIf=\"model && model.isVisible\" class=\"posting-board-selection-item\">\n <div class=\"inline-block\">\n <symphony-input-checkbox\n [label]=\"model.boardName\"\n [isActive]=\"model.isSelected\"\n (clicked)=\"onPostingBoardSelect($event)\"\n ></symphony-input-checkbox>\n </div>\n <div class=\"inline-block editText\">\n <symphony-input-editable-text\n [model]=\"editableTextModel\"\n (confirm)=\"onBoardPriceChange($event)\"\n ></symphony-input-editable-text>\n </div>\n</div>\n", styles: [".posting-board-selection-item{position:relative;padding-right:100px}.posting-board-selection-item .editText{position:absolute;right:0}.inline-block{display:inline-block}\n"], components: [{ type: InputCheckboxComponent, selector: "symphony-input-checkbox", inputs: ["isActive", "label", "isRequired"], outputs: ["clicked"] }, { type: InputEditableTextComponent, selector: "symphony-input-editable-text", inputs: ["model", "type"], outputs: ["confirm"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
5155
|
+
AdvertisePostingboardSelectionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertisePostingboardSelectionItemComponent, selector: "symphony-advertise-postingboard-selection-item", inputs: { model: "model" }, outputs: { priceChange: "priceChange", validationChange: "validationChange", editModeChange: "editModeChange", postingBoardSelect: "postingBoardSelect" }, ngImport: i0, template: "<div *ngIf=\"model && model.isVisible\" class=\"posting-board-selection-item\">\n <div class=\"inline-block\">\n <symphony-input-checkbox\n [label]=\"model.boardName\"\n [isActive]=\"model.isSelected\"\n (clicked)=\"onPostingBoardSelect($event)\"\n ></symphony-input-checkbox>\n </div>\n <div class=\"inline-block editText\">\n <symphony-input-editable-text\n [model]=\"editableTextModel\"\n (confirm)=\"onBoardPriceChange($event)\"\n (validate)=\"onBoardValidateChange($event)\"\n (editMode)=\"onBoardEditMode($event)\"\n ></symphony-input-editable-text>\n </div>\n</div>\n", styles: [".posting-board-selection-item{position:relative;padding-right:100px}.posting-board-selection-item .editText{position:absolute;right:0}.inline-block{display:inline-block}\n"], components: [{ type: InputCheckboxComponent, selector: "symphony-input-checkbox", inputs: ["isActive", "label", "isRequired"], outputs: ["clicked"] }, { type: InputEditableTextComponent, selector: "symphony-input-editable-text", inputs: ["model", "type"], outputs: ["confirm", "validate", "editMode"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
5108
5156
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemComponent, decorators: [{
|
|
5109
5157
|
type: Component,
|
|
5110
|
-
args: [{ selector: 'symphony-advertise-postingboard-selection-item', template: "<div *ngIf=\"model && model.isVisible\" class=\"posting-board-selection-item\">\n <div class=\"inline-block\">\n <symphony-input-checkbox\n [label]=\"model.boardName\"\n [isActive]=\"model.isSelected\"\n (clicked)=\"onPostingBoardSelect($event)\"\n ></symphony-input-checkbox>\n </div>\n <div class=\"inline-block editText\">\n <symphony-input-editable-text\n [model]=\"editableTextModel\"\n (confirm)=\"onBoardPriceChange($event)\"\n ></symphony-input-editable-text>\n </div>\n</div>\n", styles: [".posting-board-selection-item{position:relative;padding-right:100px}.posting-board-selection-item .editText{position:absolute;right:0}.inline-block{display:inline-block}\n"] }]
|
|
5158
|
+
args: [{ selector: 'symphony-advertise-postingboard-selection-item', template: "<div *ngIf=\"model && model.isVisible\" class=\"posting-board-selection-item\">\n <div class=\"inline-block\">\n <symphony-input-checkbox\n [label]=\"model.boardName\"\n [isActive]=\"model.isSelected\"\n (clicked)=\"onPostingBoardSelect($event)\"\n ></symphony-input-checkbox>\n </div>\n <div class=\"inline-block editText\">\n <symphony-input-editable-text\n [model]=\"editableTextModel\"\n (confirm)=\"onBoardPriceChange($event)\"\n (validate)=\"onBoardValidateChange($event)\"\n (editMode)=\"onBoardEditMode($event)\"\n ></symphony-input-editable-text>\n </div>\n</div>\n", styles: [".posting-board-selection-item{position:relative;padding-right:100px}.posting-board-selection-item .editText{position:absolute;right:0}.inline-block{display:inline-block}\n"] }]
|
|
5111
5159
|
}], ctorParameters: function () { return []; }, propDecorators: { model: [{
|
|
5112
5160
|
type: Input
|
|
5113
5161
|
}], priceChange: [{
|
|
5114
5162
|
type: Output
|
|
5163
|
+
}], validationChange: [{
|
|
5164
|
+
type: Output
|
|
5165
|
+
}], editModeChange: [{
|
|
5166
|
+
type: Output
|
|
5115
5167
|
}], postingBoardSelect: [{
|
|
5116
5168
|
type: Output
|
|
5117
5169
|
}] } });
|
|
@@ -5121,19 +5173,23 @@ class AdvertisePostingboardSelectionListComponent {
|
|
|
5121
5173
|
this.postingBoardChange = new EventEmitter();
|
|
5122
5174
|
}
|
|
5123
5175
|
onPostingBoardSelect(selectedBoard) {
|
|
5124
|
-
console.log('onPostingBoardSelect');
|
|
5125
5176
|
this.postingBoardChange.emit(selectedBoard);
|
|
5126
5177
|
}
|
|
5127
5178
|
onPriceChange(priceChangeBoard) {
|
|
5128
|
-
console.log('onPriceChange');
|
|
5129
5179
|
this.postingBoardChange.emit(priceChangeBoard);
|
|
5130
5180
|
}
|
|
5181
|
+
onValidationChange(validationChangeBoard) {
|
|
5182
|
+
this.postingBoardChange.emit(validationChangeBoard);
|
|
5183
|
+
}
|
|
5184
|
+
onEditModeChange(editModeChangeBoard) {
|
|
5185
|
+
this.postingBoardChange.emit(editModeChangeBoard);
|
|
5186
|
+
}
|
|
5131
5187
|
}
|
|
5132
5188
|
AdvertisePostingboardSelectionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5133
|
-
AdvertisePostingboardSelectionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertisePostingboardSelectionListComponent, selector: "symphony-advertise-postingboard-selection-list", inputs: { model: "model" }, outputs: { postingBoardChange: "postingBoardChange" }, ngImport: i0, template: "<symphony-advertise-postingboard-selection-item\n *ngFor=\"let item of model\"\n [model]=\"item\"\n (postingBoardSelect)=\"onPostingBoardSelect($event)\"\n (priceChange)=\"onPriceChange($event)\"\n></symphony-advertise-postingboard-selection-item>\n", styles: [""], components: [{ type: AdvertisePostingboardSelectionItemComponent, selector: "symphony-advertise-postingboard-selection-item", inputs: ["model"], outputs: ["priceChange", "postingBoardSelect"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
5189
|
+
AdvertisePostingboardSelectionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertisePostingboardSelectionListComponent, selector: "symphony-advertise-postingboard-selection-list", inputs: { model: "model" }, outputs: { postingBoardChange: "postingBoardChange" }, ngImport: i0, template: "<symphony-advertise-postingboard-selection-item\n *ngFor=\"let item of model\"\n [model]=\"item\"\n (postingBoardSelect)=\"onPostingBoardSelect($event)\"\n (priceChange)=\"onPriceChange($event)\"\n (validationChange)=\"onValidationChange($event)\"\n (editModeChange)=\"onEditModeChange($event)\"\n></symphony-advertise-postingboard-selection-item>\n", styles: [""], components: [{ type: AdvertisePostingboardSelectionItemComponent, selector: "symphony-advertise-postingboard-selection-item", inputs: ["model"], outputs: ["priceChange", "validationChange", "editModeChange", "postingBoardSelect"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
5134
5190
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListComponent, decorators: [{
|
|
5135
5191
|
type: Component,
|
|
5136
|
-
args: [{ selector: 'symphony-advertise-postingboard-selection-list', template: "<symphony-advertise-postingboard-selection-item\n *ngFor=\"let item of model\"\n [model]=\"item\"\n (postingBoardSelect)=\"onPostingBoardSelect($event)\"\n (priceChange)=\"onPriceChange($event)\"\n></symphony-advertise-postingboard-selection-item>\n", styles: [""] }]
|
|
5192
|
+
args: [{ selector: 'symphony-advertise-postingboard-selection-list', template: "<symphony-advertise-postingboard-selection-item\n *ngFor=\"let item of model\"\n [model]=\"item\"\n (postingBoardSelect)=\"onPostingBoardSelect($event)\"\n (priceChange)=\"onPriceChange($event)\"\n (validationChange)=\"onValidationChange($event)\"\n (editModeChange)=\"onEditModeChange($event)\"\n></symphony-advertise-postingboard-selection-item>\n", styles: [""] }]
|
|
5137
5193
|
}], ctorParameters: function () { return []; }, propDecorators: { model: [{
|
|
5138
5194
|
type: Input
|
|
5139
5195
|
}], postingBoardChange: [{
|
|
@@ -5264,11 +5320,20 @@ class AdvertiseModalComponent {
|
|
|
5264
5320
|
this.closeButtonClicked.emit();
|
|
5265
5321
|
}
|
|
5266
5322
|
onPostingBoardChange(selectedBoard) {
|
|
5267
|
-
const selectedJobBoards = this.model.jobBoards.filter(jb => jb.isSelected)
|
|
5268
|
-
|
|
5269
|
-
if (selectedJobBoards > 0) {
|
|
5323
|
+
const selectedJobBoards = this.model.jobBoards.filter(jb => jb.isSelected);
|
|
5324
|
+
if (selectedJobBoards.length > 0) {
|
|
5270
5325
|
this.updateOrderSummary();
|
|
5271
5326
|
}
|
|
5327
|
+
const invalidJobBoards = selectedJobBoards.filter(jb => jb.isInvalid)
|
|
5328
|
+
.length;
|
|
5329
|
+
if (invalidJobBoards > 0) {
|
|
5330
|
+
this.isJobBoardNextButtonDisabled = true;
|
|
5331
|
+
}
|
|
5332
|
+
const editModeJobBoards = selectedJobBoards.filter(jb => jb.isInEditMode)
|
|
5333
|
+
.length;
|
|
5334
|
+
if (editModeJobBoards > 0) {
|
|
5335
|
+
this.isJobBoardNextButtonDisabled = true;
|
|
5336
|
+
}
|
|
5272
5337
|
}
|
|
5273
5338
|
addLineItem(invoiceAreaIndex, selectedBoard) {
|
|
5274
5339
|
this.orderSummary.invoiceAreas[invoiceAreaIndex].lineItems.push({
|
|
@@ -5883,7 +5948,7 @@ class ActionBarAdvertiseJobListComponent {
|
|
|
5883
5948
|
}
|
|
5884
5949
|
}
|
|
5885
5950
|
ActionBarAdvertiseJobListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarAdvertiseJobListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5886
|
-
ActionBarAdvertiseJobListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarAdvertiseJobListComponent, selector: "symphony-action-bar-advertise-job-list", inputs: { gridActionModel: "gridActionModel", gridControlsModel: "gridControlsModel" }, outputs: { gridControlClick: "gridControlClick", gridActionClick: "gridActionClick" }, ngImport: i0, template: "<symphony-action-bar>\n <symphony-grid-controls\n (Clicked)=\"onGridControlClick($event)\"\n (menuClicked)=\"onGridControlClick($event)\"\n [model]=\"gridControlsModel\"\n grid-controls\n ></symphony-grid-controls>\n <symphony-grid-actions\n (buttonClicked)=\"onGridActionClick($event)\"\n [model]=\"gridActionModel\"\n grid-actions\n ></symphony-grid-actions>\n</symphony-action-bar>\n", styles: [""], components: [{ type: ActionBarComponent, selector: "symphony-action-bar", inputs: ["isToggled"], outputs: ["toggleClick"] }, { type: GridControlsComponent, selector: "symphony-grid-controls", inputs: ["model"], outputs: ["Clicked", "menuClicked"] }, { type: GridActionsComponent, selector: "symphony-grid-actions", inputs: ["model", "isInverse"], outputs: ["buttonClicked"] }] });
|
|
5951
|
+
ActionBarAdvertiseJobListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarAdvertiseJobListComponent, selector: "symphony-action-bar-advertise-job-list", inputs: { gridActionModel: "gridActionModel", gridControlsModel: "gridControlsModel" }, outputs: { gridControlClick: "gridControlClick", gridActionClick: "gridActionClick" }, ngImport: i0, template: "<symphony-action-bar>\n <symphony-grid-controls\n (Clicked)=\"onGridControlClick($event)\"\n (menuClicked)=\"onGridControlClick($event)\"\n [model]=\"gridControlsModel\"\n grid-controls\n ></symphony-grid-controls>\n <symphony-grid-actions\n (buttonClicked)=\"onGridActionClick($event)\"\n [model]=\"gridActionModel\"\n grid-actions\n ></symphony-grid-actions>\n</symphony-action-bar>\n", styles: [""], components: [{ type: ActionBarComponent, selector: "symphony-action-bar", inputs: ["isToggled", "hasActionToggle"], outputs: ["toggleClick"] }, { type: GridControlsComponent, selector: "symphony-grid-controls", inputs: ["model"], outputs: ["Clicked", "menuClicked"] }, { type: GridActionsComponent, selector: "symphony-grid-actions", inputs: ["model", "isInverse"], outputs: ["buttonClicked"] }] });
|
|
5887
5952
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarAdvertiseJobListComponent, decorators: [{
|
|
5888
5953
|
type: Component,
|
|
5889
5954
|
args: [{ selector: 'symphony-action-bar-advertise-job-list', template: "<symphony-action-bar>\n <symphony-grid-controls\n (Clicked)=\"onGridControlClick($event)\"\n (menuClicked)=\"onGridControlClick($event)\"\n [model]=\"gridControlsModel\"\n grid-controls\n ></symphony-grid-controls>\n <symphony-grid-actions\n (buttonClicked)=\"onGridActionClick($event)\"\n [model]=\"gridActionModel\"\n grid-actions\n ></symphony-grid-actions>\n</symphony-action-bar>\n", styles: [""] }]
|