@symphony-talent/component-library 3.38.1 → 3.38.4
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/pages/modals/advertise-modal/advertise-modal.component.mjs +26 -22
- package/esm2020/projects/component-library/lib/pages/modals/advertise-modal/advertise-modal.component.mjs +26 -22
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +24 -20
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +24 -20
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +24 -20
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +24 -20
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/lib/pages/modals/advertise-modal/advertise-modal.component.d.ts +2 -1
- package/package.json +1 -1
- package/projects/component-library/lib/pages/modals/advertise-modal/advertise-modal.component.d.ts +2 -1
|
@@ -5010,11 +5010,12 @@ class AdvertiseModalComponent {
|
|
|
5010
5010
|
this.buttonClicked = new EventEmitter();
|
|
5011
5011
|
this.closeButtonClicked = new EventEmitter();
|
|
5012
5012
|
this.postingBoardChange = new EventEmitter();
|
|
5013
|
+
this.keywordSearchChange = new EventEmitter();
|
|
5013
5014
|
this.fundsInfo = {
|
|
5014
5015
|
icon: Icons.CONFIRMATION,
|
|
5015
5016
|
iconFirst: true,
|
|
5016
5017
|
text: 'Sufficient Funds',
|
|
5017
|
-
iconColor: '#00D56B'
|
|
5018
|
+
iconColor: '#00D56B'
|
|
5018
5019
|
};
|
|
5019
5020
|
this.payPerClickBoards = [];
|
|
5020
5021
|
this.jobBoards = [];
|
|
@@ -5029,7 +5030,7 @@ class AdvertiseModalComponent {
|
|
|
5029
5030
|
title: 'Are you sure you want to abandon your order?',
|
|
5030
5031
|
content: 'All selections will be deleted and you will have to start over.',
|
|
5031
5032
|
btnPrimary: 'Continue Order',
|
|
5032
|
-
btnSecondary: 'Abandon Order'
|
|
5033
|
+
btnSecondary: 'Abandon Order'
|
|
5033
5034
|
};
|
|
5034
5035
|
}
|
|
5035
5036
|
ngOnChanges(changes) {
|
|
@@ -5046,29 +5047,29 @@ class AdvertiseModalComponent {
|
|
|
5046
5047
|
title: 'Pay-Per-Click',
|
|
5047
5048
|
total: {
|
|
5048
5049
|
textLeft: 'Cost Programatic Boards',
|
|
5049
|
-
textRight: `x (${this.jobCount}) Jobs = $0
|
|
5050
|
-
}
|
|
5050
|
+
textRight: `x (${this.jobCount}) Jobs = $0`
|
|
5051
|
+
}
|
|
5051
5052
|
},
|
|
5052
5053
|
{
|
|
5053
5054
|
lineItems: [],
|
|
5054
5055
|
title: 'Job Boards',
|
|
5055
5056
|
total: {
|
|
5056
5057
|
textLeft: 'Cost Job Boards',
|
|
5057
|
-
textRight: `x (${this.jobCount}) Jobs = $0
|
|
5058
|
-
}
|
|
5059
|
-
}
|
|
5058
|
+
textRight: `x (${this.jobCount}) Jobs = $0`
|
|
5059
|
+
}
|
|
5060
|
+
}
|
|
5060
5061
|
],
|
|
5061
5062
|
total: {
|
|
5062
5063
|
textLeft: '',
|
|
5063
5064
|
textRight: '$0',
|
|
5064
|
-
label: 'Total:'
|
|
5065
|
-
}
|
|
5065
|
+
label: 'Total:'
|
|
5066
|
+
}
|
|
5066
5067
|
};
|
|
5067
5068
|
}
|
|
5068
5069
|
updateModalHeader() {
|
|
5069
5070
|
let subTitleTooltip = '';
|
|
5070
5071
|
let jobNumber = 1;
|
|
5071
|
-
this.model.jobsToAdvertise.forEach(
|
|
5072
|
+
this.model.jobsToAdvertise.forEach(job => {
|
|
5072
5073
|
subTitleTooltip = subTitleTooltip + `${job.jobTitle} [${job.id}]`;
|
|
5073
5074
|
if (jobNumber != this.model.jobsToAdvertise.length) {
|
|
5074
5075
|
subTitleTooltip = subTitleTooltip + '</br>';
|
|
@@ -5080,11 +5081,11 @@ class AdvertiseModalComponent {
|
|
|
5080
5081
|
text: `${this.model.jobsToAdvertise.length} Jobs`,
|
|
5081
5082
|
iconFirst: false,
|
|
5082
5083
|
icon: Icons.INFO,
|
|
5083
|
-
placement: 'right'
|
|
5084
|
+
placement: 'right'
|
|
5084
5085
|
};
|
|
5085
5086
|
}
|
|
5086
5087
|
onKeywordSearch(keyword) {
|
|
5087
|
-
this.
|
|
5088
|
+
this.keywordSearchChange.emit(keyword);
|
|
5088
5089
|
}
|
|
5089
5090
|
onButtonClick(text) {
|
|
5090
5091
|
this.buttonClicked.emit(text);
|
|
@@ -5098,31 +5099,32 @@ class AdvertiseModalComponent {
|
|
|
5098
5099
|
addLineItem(invoiceAreaIndex, selectedBoard) {
|
|
5099
5100
|
this.orderSummary.invoiceAreas[invoiceAreaIndex].lineItems.push({
|
|
5100
5101
|
textLeft: selectedBoard.boardName,
|
|
5101
|
-
textRight: `$${selectedBoard.boardPrice}
|
|
5102
|
+
textRight: `$${selectedBoard.boardPrice}`
|
|
5102
5103
|
});
|
|
5103
5104
|
}
|
|
5104
5105
|
calculateInvoiceAreaTotal(invoiceAreaIndex) {
|
|
5105
5106
|
let invoiceAreaTotal = 0;
|
|
5106
|
-
this.orderSummary.invoiceAreas[invoiceAreaIndex].lineItems.forEach(
|
|
5107
|
+
this.orderSummary.invoiceAreas[invoiceAreaIndex].lineItems.forEach(li => {
|
|
5107
5108
|
invoiceAreaTotal = invoiceAreaTotal + +li.textRight.replace('$', '');
|
|
5108
5109
|
});
|
|
5109
5110
|
this.orderSummary.invoiceAreas[invoiceAreaIndex].total.textRight = `x (${this.model.jobsToAdvertise.length}) Jobs = $${invoiceAreaTotal * this.model.jobsToAdvertise.length}`;
|
|
5110
5111
|
return invoiceAreaTotal * this.model.jobsToAdvertise.length;
|
|
5111
5112
|
}
|
|
5112
5113
|
calculateOrderTotal(payPerClickAreaTotal, jobBoardAreaTotal) {
|
|
5113
|
-
const selectedJobBoards = this.model.jobBoards.filter(
|
|
5114
|
+
const selectedJobBoards = this.model.jobBoards.filter(jb => jb.isSelected)
|
|
5115
|
+
.length;
|
|
5114
5116
|
const jobToAdvertiseCount = this.model.jobsToAdvertise.length;
|
|
5115
5117
|
const orderSummaryText = `(${selectedJobBoards}) Boards x ${this.model.jobsToAdvertise.length} Jobs = (${selectedJobBoards * jobToAdvertiseCount}) Ads`;
|
|
5116
5118
|
this.orderSummary.total = {
|
|
5117
5119
|
label: 'Total:',
|
|
5118
5120
|
textLeft: orderSummaryText,
|
|
5119
|
-
textRight: `$${payPerClickAreaTotal + jobBoardAreaTotal}
|
|
5121
|
+
textRight: `$${payPerClickAreaTotal + jobBoardAreaTotal}`
|
|
5120
5122
|
};
|
|
5121
5123
|
}
|
|
5122
5124
|
updateOrderSummary() {
|
|
5123
5125
|
this.orderSummary.invoiceAreas[0].lineItems = [];
|
|
5124
5126
|
this.orderSummary.invoiceAreas[1].lineItems = [];
|
|
5125
|
-
this.model.jobBoards.forEach(
|
|
5127
|
+
this.model.jobBoards.forEach(jb => {
|
|
5126
5128
|
if (jb.isSelected) {
|
|
5127
5129
|
if (jb.isPayPerClick) {
|
|
5128
5130
|
this.addLineItem(0, jb);
|
|
@@ -5135,7 +5137,7 @@ class AdvertiseModalComponent {
|
|
|
5135
5137
|
const payPerClickAreaTotal = this.calculateInvoiceAreaTotal(0);
|
|
5136
5138
|
const jobBoardAreaTotal = this.calculateInvoiceAreaTotal(1);
|
|
5137
5139
|
this.calculateOrderTotal(payPerClickAreaTotal, jobBoardAreaTotal);
|
|
5138
|
-
if (this.model.jobBoards.filter(
|
|
5140
|
+
if (this.model.jobBoards.filter(jb => jb.isSelected).length === 0) {
|
|
5139
5141
|
this.isJobBoardNextButtonDisabled = true;
|
|
5140
5142
|
}
|
|
5141
5143
|
else {
|
|
@@ -5145,10 +5147,10 @@ class AdvertiseModalComponent {
|
|
|
5145
5147
|
}
|
|
5146
5148
|
}
|
|
5147
5149
|
AdvertiseModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertiseModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5148
|
-
AdvertiseModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertiseModalComponent, selector: "symphony-advertise-modal", inputs: { model: "model" }, outputs: { buttonClicked: "buttonClicked", closeButtonClicked: "closeButtonClicked", postingBoardChange: "postingBoardChange" }, usesOnChanges: true, ngImport: i0, template: "<symphony-two-column-modal-template *ngIf=\"!model.navigation.showCancel\">\n <symphony-h4\n *ngIf=\"model.navigation.showJobBoardsSelection && !model.isLoading\"\n sfx-modal-title\n >Select Your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showOrderReview\" sfx-modal-title\n >Review you Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showConfirmation\" sfx-modal-title\n >Confirmation of your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showProcessing\" sfx-modal-title\n >Processing Order...</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.isLoading\" sfx-modal-title\n >Loading Job Boards...</symphony-h4\n >\n <symphony-icon\n sfx-close-button\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCloseButtonClick()\"\n ></symphony-icon>\n <symphony-h5-with-icon sfx-modal-subtitle [model]=\"subTitle\">\n </symphony-h5-with-icon>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showJobBoardsSelection\"\n [showHeader]=\"true\"\n sfx-modal-body-area\n >\n <symphony-input-text\n sfx-left-col-header\n [noMargin]=\"true\"\n [placeholder]=\"'Search Ad Boards'\"\n [icon]=\"'si-search-new'\"\n (textChange)=\"onKeywordSearch($event)\"\n >\n </symphony-input-text>\n <div class=\"right-col-header-inner\" sfx-right-col-header>\n <symphony-h5-with-icon\n sfx-right-col-header\n *ngIf=\"model.showFunds\"\n class=\"pull-right\"\n [model]=\"fundsInfo\"\n ></symphony-h5-with-icon>\n </div>\n <div sfx-left-column class=\"posting-boards sfx-pr-10\">\n <symphony-advertise-postingboard-selection-list\n [model]=\"
|
|
5150
|
+
AdvertiseModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertiseModalComponent, selector: "symphony-advertise-modal", inputs: { model: "model" }, outputs: { buttonClicked: "buttonClicked", closeButtonClicked: "closeButtonClicked", postingBoardChange: "postingBoardChange", keywordSearchChange: "keywordSearchChange" }, usesOnChanges: true, ngImport: i0, template: "<symphony-two-column-modal-template *ngIf=\"!model.navigation.showCancel\">\n <symphony-h4\n *ngIf=\"model.navigation.showJobBoardsSelection && !model.isLoading\"\n sfx-modal-title\n >Select Your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showOrderReview\" sfx-modal-title\n >Review you Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showConfirmation\" sfx-modal-title\n >Confirmation of your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showProcessing\" sfx-modal-title\n >Processing Order...</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.isLoading\" sfx-modal-title\n >Loading Job Boards...</symphony-h4\n >\n <symphony-icon\n sfx-close-button\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCloseButtonClick()\"\n ></symphony-icon>\n <symphony-h5-with-icon sfx-modal-subtitle [model]=\"subTitle\">\n </symphony-h5-with-icon>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showJobBoardsSelection\"\n [showHeader]=\"true\"\n sfx-modal-body-area\n >\n <symphony-input-text\n sfx-left-col-header\n [noMargin]=\"true\"\n [placeholder]=\"'Search Ad Boards'\"\n [icon]=\"'si-search-new'\"\n (textChange)=\"onKeywordSearch($event)\"\n >\n </symphony-input-text>\n <div class=\"right-col-header-inner\" sfx-right-col-header>\n <symphony-h5-with-icon\n sfx-right-col-header\n *ngIf=\"model.showFunds\"\n class=\"pull-right\"\n [model]=\"fundsInfo\"\n ></symphony-h5-with-icon>\n </div>\n <div sfx-left-column class=\"posting-boards sfx-pr-10\">\n <symphony-advertise-postingboard-selection-list\n [model]=\"model.jobBoards\"\n (postingBoardChange)=\"onPostingBoardChange($event)\"\n ></symphony-advertise-postingboard-selection-list>\n </div>\n\n <symphony-order-summary\n sfx-right-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showOrderReview\"\n sfx-modal-body-area\n >\n <div sfx-left-column class=\"posting-boards\">\n <symphony-advertise-order-review></symphony-advertise-order-review>\n </div>\n\n <symphony-order-summary\n sfx-right-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showConfirmation\"\n sfx-modal-body-area\n >\n <symphony-order-summary\n sfx-left-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n <div sfx-right-column class=\"posting-boards\">\n <div class=\"stage\">\n <div class=\"box bounce-7\">\n <div class=\"complete-container\">\n <symphony-h2>Your order is complete</symphony-h2>\n <div class=\"success-icon-spacing\">\n <symphony-icon\n [icon]=\"'si-confirmation'\"\n [iconColor]=\"'#00D56B'\"\n [size]=\"'50px'\"\n ></symphony-icon>\n </div>\n </div>\n </div>\n </div>\n </div>\n </symphony-two-column-body-template>\n\n <div\n *ngIf=\"!model.isLoading && model.navigation.showProcessing\"\n sfx-modal-body-area\n class=\"posting-boards sfx-p-30\"\n >\n <div class=\"processing-container\">\n <symphony-paragraph\n ><b>SmashFlyX</b> is submitting your order to your selected job boards.\n Some orders happen immediately, while others take a little more time.\n Check your order status if you don't recieve a confirmation in the next\n 24hours.</symphony-paragraph\n >\n </div>\n <div class=\"sfx-mt-80\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n </div>\n\n <div class=\"loader-container\" *ngIf=\"model.isLoading\" sfx-modal-body-area>\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-primary\n [text]=\"'Review Order'\"\n [disabled]=\"isJobBoardNextButtonDisabled\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-back\n [text]=\"'Edit Order'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-primary\n [text]=\"'Buy'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showConfirmation\"\n sfx-button-primary\n [text]=\"'Finish & Close'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n</symphony-two-column-modal-template>\n<symphony-confirmation-modal\n *ngIf=\"!model.isLoading && model.navigation.showCancel\"\n (buttonClicked)=\"onButtonClick($event)\"\n (closeButtonClicked)=\"onCloseButtonClick()\"\n [model]=\"cancelContent\"\n>\n</symphony-confirmation-modal>\n", styles: [".right-col-header-inner{padding-top:10px}.posting-boards{height:400px;overflow-x:auto}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.loader-container{padding-top:246px;padding-bottom:245px}.complete-container{text-align:center;margin-top:25%}.success-icon-spacing{margin-top:25px}.processing-container{width:400px;text-align:justify}.stage{display:flex;height:240px;width:100%}.box{align-self:flex-end;animation-duration:2s;animation-iteration-count:1;height:200px;margin:0 auto;transform-origin:bottom;width:200px}.bounce-7{animation-name:bounce-7;animation-timing-function:cubic-bezier(.24,.82,.24,.82)}@keyframes bounce-7{0%{transform:scale(1) translateY(0)}10%{transform:scale(1.1,.9) translateY(0)}30%{transform:scale(.9,1.1) translateY(-15px)}50%{transform:scale(1.05,.95) translateY(0)}57%{transform:scale(1) translateY(-7px)}64%{transform:scale(1) translateY(0)}to{transform:scale(1) translateY(0)}}\n"], components: [{ type: TwoColumnModalTemplateComponent, selector: "symphony-two-column-modal-template" }, { type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: H5WithIconComponent, selector: "symphony-h5-with-icon", inputs: ["model"] }, { type: TwoColumnBodyTemplateComponent, selector: "symphony-two-column-body-template", inputs: ["showHeader"] }, { type: InputTextComponent, selector: "symphony-input-text", inputs: ["placeholder", "icon", "label", "isInverse", "noMargin"], outputs: ["textChange"] }, { type: AdvertisePostingboardSelectionListComponent, selector: "symphony-advertise-postingboard-selection-list", inputs: ["model"], outputs: ["postingBoardChange"] }, { type: OrderSummaryComponent, selector: "symphony-order-summary", inputs: ["model"] }, { type: AdvertiseOrderReviewComponent, selector: "symphony-advertise-order-review" }, { type: H2Component, selector: "symphony-h2", inputs: ["text", "isSecondary"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary"] }, { type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message"] }, { type: ButtonComponent, selector: "symphony-button", inputs: ["text", "disabled", "isSecondary", "isInverse"], outputs: ["clicked"] }, { type: ConfirmationModalComponent, selector: "symphony-confirmation-modal", inputs: ["model"], outputs: ["buttonClicked", "closeButtonClicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
5149
5151
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertiseModalComponent, decorators: [{
|
|
5150
5152
|
type: Component,
|
|
5151
|
-
args: [{ selector: 'symphony-advertise-modal', template: "<symphony-two-column-modal-template *ngIf=\"!model.navigation.showCancel\">\n <symphony-h4\n *ngIf=\"model.navigation.showJobBoardsSelection && !model.isLoading\"\n sfx-modal-title\n >Select Your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showOrderReview\" sfx-modal-title\n >Review you Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showConfirmation\" sfx-modal-title\n >Confirmation of your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showProcessing\" sfx-modal-title\n >Processing Order...</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.isLoading\" sfx-modal-title\n >Loading Job Boards...</symphony-h4\n >\n <symphony-icon\n sfx-close-button\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCloseButtonClick()\"\n ></symphony-icon>\n <symphony-h5-with-icon sfx-modal-subtitle [model]=\"subTitle\">\n </symphony-h5-with-icon>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showJobBoardsSelection\"\n [showHeader]=\"true\"\n sfx-modal-body-area\n >\n <symphony-input-text\n sfx-left-col-header\n [noMargin]=\"true\"\n [placeholder]=\"'Search Ad Boards'\"\n [icon]=\"'si-search-new'\"\n (textChange)=\"onKeywordSearch($event)\"\n >\n </symphony-input-text>\n <div class=\"right-col-header-inner\" sfx-right-col-header>\n <symphony-h5-with-icon\n sfx-right-col-header\n *ngIf=\"model.showFunds\"\n class=\"pull-right\"\n [model]=\"fundsInfo\"\n ></symphony-h5-with-icon>\n </div>\n <div sfx-left-column class=\"posting-boards sfx-pr-10\">\n <symphony-advertise-postingboard-selection-list\n [model]=\"
|
|
5153
|
+
args: [{ selector: 'symphony-advertise-modal', template: "<symphony-two-column-modal-template *ngIf=\"!model.navigation.showCancel\">\n <symphony-h4\n *ngIf=\"model.navigation.showJobBoardsSelection && !model.isLoading\"\n sfx-modal-title\n >Select Your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showOrderReview\" sfx-modal-title\n >Review you Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showConfirmation\" sfx-modal-title\n >Confirmation of your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showProcessing\" sfx-modal-title\n >Processing Order...</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.isLoading\" sfx-modal-title\n >Loading Job Boards...</symphony-h4\n >\n <symphony-icon\n sfx-close-button\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCloseButtonClick()\"\n ></symphony-icon>\n <symphony-h5-with-icon sfx-modal-subtitle [model]=\"subTitle\">\n </symphony-h5-with-icon>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showJobBoardsSelection\"\n [showHeader]=\"true\"\n sfx-modal-body-area\n >\n <symphony-input-text\n sfx-left-col-header\n [noMargin]=\"true\"\n [placeholder]=\"'Search Ad Boards'\"\n [icon]=\"'si-search-new'\"\n (textChange)=\"onKeywordSearch($event)\"\n >\n </symphony-input-text>\n <div class=\"right-col-header-inner\" sfx-right-col-header>\n <symphony-h5-with-icon\n sfx-right-col-header\n *ngIf=\"model.showFunds\"\n class=\"pull-right\"\n [model]=\"fundsInfo\"\n ></symphony-h5-with-icon>\n </div>\n <div sfx-left-column class=\"posting-boards sfx-pr-10\">\n <symphony-advertise-postingboard-selection-list\n [model]=\"model.jobBoards\"\n (postingBoardChange)=\"onPostingBoardChange($event)\"\n ></symphony-advertise-postingboard-selection-list>\n </div>\n\n <symphony-order-summary\n sfx-right-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showOrderReview\"\n sfx-modal-body-area\n >\n <div sfx-left-column class=\"posting-boards\">\n <symphony-advertise-order-review></symphony-advertise-order-review>\n </div>\n\n <symphony-order-summary\n sfx-right-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showConfirmation\"\n sfx-modal-body-area\n >\n <symphony-order-summary\n sfx-left-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n <div sfx-right-column class=\"posting-boards\">\n <div class=\"stage\">\n <div class=\"box bounce-7\">\n <div class=\"complete-container\">\n <symphony-h2>Your order is complete</symphony-h2>\n <div class=\"success-icon-spacing\">\n <symphony-icon\n [icon]=\"'si-confirmation'\"\n [iconColor]=\"'#00D56B'\"\n [size]=\"'50px'\"\n ></symphony-icon>\n </div>\n </div>\n </div>\n </div>\n </div>\n </symphony-two-column-body-template>\n\n <div\n *ngIf=\"!model.isLoading && model.navigation.showProcessing\"\n sfx-modal-body-area\n class=\"posting-boards sfx-p-30\"\n >\n <div class=\"processing-container\">\n <symphony-paragraph\n ><b>SmashFlyX</b> is submitting your order to your selected job boards.\n Some orders happen immediately, while others take a little more time.\n Check your order status if you don't recieve a confirmation in the next\n 24hours.</symphony-paragraph\n >\n </div>\n <div class=\"sfx-mt-80\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n </div>\n\n <div class=\"loader-container\" *ngIf=\"model.isLoading\" sfx-modal-body-area>\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-primary\n [text]=\"'Review Order'\"\n [disabled]=\"isJobBoardNextButtonDisabled\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-back\n [text]=\"'Edit Order'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-primary\n [text]=\"'Buy'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showConfirmation\"\n sfx-button-primary\n [text]=\"'Finish & Close'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n</symphony-two-column-modal-template>\n<symphony-confirmation-modal\n *ngIf=\"!model.isLoading && model.navigation.showCancel\"\n (buttonClicked)=\"onButtonClick($event)\"\n (closeButtonClicked)=\"onCloseButtonClick()\"\n [model]=\"cancelContent\"\n>\n</symphony-confirmation-modal>\n", styles: [".right-col-header-inner{padding-top:10px}.posting-boards{height:400px;overflow-x:auto}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.loader-container{padding-top:246px;padding-bottom:245px}.complete-container{text-align:center;margin-top:25%}.success-icon-spacing{margin-top:25px}.processing-container{width:400px;text-align:justify}.stage{display:flex;height:240px;width:100%}.box{align-self:flex-end;animation-duration:2s;animation-iteration-count:1;height:200px;margin:0 auto;transform-origin:bottom;width:200px}.bounce-7{animation-name:bounce-7;animation-timing-function:cubic-bezier(.24,.82,.24,.82)}@keyframes bounce-7{0%{transform:scale(1) translateY(0)}10%{transform:scale(1.1,.9) translateY(0)}30%{transform:scale(.9,1.1) translateY(-15px)}50%{transform:scale(1.05,.95) translateY(0)}57%{transform:scale(1) translateY(-7px)}64%{transform:scale(1) translateY(0)}to{transform:scale(1) translateY(0)}}\n"] }]
|
|
5152
5154
|
}], ctorParameters: function () { return []; }, propDecorators: { model: [{
|
|
5153
5155
|
type: Input
|
|
5154
5156
|
}], buttonClicked: [{
|
|
@@ -5157,6 +5159,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
|
|
|
5157
5159
|
type: Output
|
|
5158
5160
|
}], postingBoardChange: [{
|
|
5159
5161
|
type: Output
|
|
5162
|
+
}], keywordSearchChange: [{
|
|
5163
|
+
type: Output
|
|
5160
5164
|
}] } });
|
|
5161
5165
|
|
|
5162
5166
|
class TwoColumnModalModule {
|