@adlfe/campaign-management-library 2.11.3 → 2.11.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/adlfe-campaign-management-library.d.ts +6 -4
- package/adlfe-campaign-management-library.metadata.json +1 -1
- package/bundles/adlfe-campaign-management-library.umd.js +285 -86
- package/bundles/adlfe-campaign-management-library.umd.js.map +1 -1
- package/bundles/adlfe-campaign-management-library.umd.min.js +1 -1
- package/bundles/adlfe-campaign-management-library.umd.min.js.map +1 -1
- package/esm2015/adlfe-campaign-management-library.js +7 -5
- package/esm2015/lib/campaign-management/campaign-management.module.js +4 -2
- package/esm2015/lib/campaign-management/components/input-numeric/input-numeric.component.js +113 -0
- package/esm2015/lib/campaign-management/components/input-numeric/input-numeric.module.js +18 -0
- package/esm2015/lib/campaign-management/models/general-information-wa-req.model.js +2 -1
- package/esm2015/lib/campaign-management/modules/campaign-index/dialog/pending-approval-dialog-view/pending-approval-dialog-view.component.js +40 -38
- package/esm2015/lib/campaign-management/modules/new-campaign/components/general-information-wa/general-information-wa.component.js +17 -7
- package/esm2015/lib/campaign-management/modules/new-campaign/new-campaign.component.js +41 -39
- package/esm2015/lib/campaign-management/validators/index.js +12 -0
- package/esm2015/lib/campaign-management/validators/max.validator.js +14 -0
- package/esm2015/lib/campaign-management/validators/min.validator.js +14 -0
- package/esm2015/lib/campaign-management/validators/required.validator.js +10 -0
- package/esm2015/lib/core/const/validation-message.const.js +5 -2
- package/esm5/adlfe-campaign-management-library.js +7 -5
- package/esm5/lib/campaign-management/campaign-management.module.js +4 -2
- package/esm5/lib/campaign-management/components/input-numeric/input-numeric.component.js +127 -0
- package/esm5/lib/campaign-management/components/input-numeric/input-numeric.module.js +21 -0
- package/esm5/lib/campaign-management/models/general-information-wa-req.model.js +2 -1
- package/esm5/lib/campaign-management/modules/campaign-index/dialog/pending-approval-dialog-view/pending-approval-dialog-view.component.js +40 -38
- package/esm5/lib/campaign-management/modules/new-campaign/components/general-information-wa/general-information-wa.component.js +17 -7
- package/esm5/lib/campaign-management/modules/new-campaign/new-campaign.component.js +41 -39
- package/esm5/lib/campaign-management/validators/index.js +12 -0
- package/esm5/lib/campaign-management/validators/max.validator.js +14 -0
- package/esm5/lib/campaign-management/validators/min.validator.js +14 -0
- package/esm5/lib/campaign-management/validators/required.validator.js +10 -0
- package/esm5/lib/core/const/validation-message.const.js +5 -2
- package/fesm2015/adlfe-campaign-management-library.js +345 -165
- package/fesm2015/adlfe-campaign-management-library.js.map +1 -1
- package/fesm5/adlfe-campaign-management-library.js +362 -165
- package/fesm5/adlfe-campaign-management-library.js.map +1 -1
- package/lib/campaign-management/components/input-numeric/input-numeric.component.d.ts +30 -0
- package/lib/campaign-management/components/input-numeric/input-numeric.module.d.ts +2 -0
- package/lib/campaign-management/models/general-information-wa-req.model.d.ts +1 -0
- package/lib/campaign-management/validators/index.d.ts +8 -0
- package/lib/campaign-management/validators/max.validator.d.ts +2 -0
- package/lib/campaign-management/validators/min.validator.d.ts +2 -0
- package/lib/campaign-management/validators/required.validator.d.ts +2 -0
- package/package.json +1 -1
- package/types.d.ts +0 -1
|
@@ -343,6 +343,142 @@
|
|
|
343
343
|
return CampaignManagementComponent;
|
|
344
344
|
}());
|
|
345
345
|
|
|
346
|
+
var InputNumericComponent = /** @class */ (function () {
|
|
347
|
+
function InputNumericComponent(controlContainer) {
|
|
348
|
+
this.controlContainer = controlContainer;
|
|
349
|
+
this.allowDecimal = true;
|
|
350
|
+
}
|
|
351
|
+
InputNumericComponent_1 = InputNumericComponent;
|
|
352
|
+
InputNumericComponent.prototype.handleInput = function (event) {
|
|
353
|
+
var inputElement = event.target;
|
|
354
|
+
var value = inputElement.value || '';
|
|
355
|
+
var numeric = this.allowDecimal ? value.replace(/[^0-9.]/g, '') : value.replace(/\D/g, '');
|
|
356
|
+
if (this.allowDecimal) {
|
|
357
|
+
var parts = numeric.split('.');
|
|
358
|
+
if (parts.length > 2) {
|
|
359
|
+
numeric = parts[0] + '.' + parts.slice(1).join('');
|
|
360
|
+
}
|
|
361
|
+
}
|
|
362
|
+
if (this.disallowLeadingZero &&
|
|
363
|
+
numeric.startsWith('0') &&
|
|
364
|
+
numeric.length > 1 &&
|
|
365
|
+
numeric[1] !== '.') {
|
|
366
|
+
numeric = numeric.replace(/^0+/, '');
|
|
367
|
+
}
|
|
368
|
+
var finalValue = numeric;
|
|
369
|
+
if (this.trimLeadingZeros && numeric !== '' && !numeric.includes('.')) {
|
|
370
|
+
finalValue = +numeric;
|
|
371
|
+
}
|
|
372
|
+
this.formControl.patchValue(finalValue, { emitEvent: false });
|
|
373
|
+
};
|
|
374
|
+
InputNumericComponent.prototype.ngOnInit = function () {
|
|
375
|
+
this.setBaseStateInitialization();
|
|
376
|
+
};
|
|
377
|
+
InputNumericComponent.prototype.setBaseStateInitialization = function () {
|
|
378
|
+
if (!this.formControlName)
|
|
379
|
+
return;
|
|
380
|
+
var formGroup = this.controlContainer.control;
|
|
381
|
+
this.formControl = formGroup.get(this.formControlName);
|
|
382
|
+
};
|
|
383
|
+
Object.defineProperty(InputNumericComponent.prototype, "isValid", {
|
|
384
|
+
get: function () {
|
|
385
|
+
var _a, _b;
|
|
386
|
+
return !!(((_a = this.formControl) === null || _a === void 0 ? void 0 : _a.touched) && ((_b = this.formControl) === null || _b === void 0 ? void 0 : _b.valid));
|
|
387
|
+
},
|
|
388
|
+
enumerable: true,
|
|
389
|
+
configurable: true
|
|
390
|
+
});
|
|
391
|
+
Object.defineProperty(InputNumericComponent.prototype, "isInvalid", {
|
|
392
|
+
get: function () {
|
|
393
|
+
var _a, _b;
|
|
394
|
+
return !!(((_a = this.formControl) === null || _a === void 0 ? void 0 : _a.touched) && ((_b = this.formControl) === null || _b === void 0 ? void 0 : _b.invalid));
|
|
395
|
+
},
|
|
396
|
+
enumerable: true,
|
|
397
|
+
configurable: true
|
|
398
|
+
});
|
|
399
|
+
Object.defineProperty(InputNumericComponent.prototype, "errors", {
|
|
400
|
+
get: function () {
|
|
401
|
+
return this.formControl.errors;
|
|
402
|
+
},
|
|
403
|
+
enumerable: true,
|
|
404
|
+
configurable: true
|
|
405
|
+
});
|
|
406
|
+
InputNumericComponent.prototype.writeValue = function (value) {
|
|
407
|
+
this._value = value;
|
|
408
|
+
};
|
|
409
|
+
InputNumericComponent.prototype.registerOnChange = function (fn) {
|
|
410
|
+
this._onBaseChange = fn;
|
|
411
|
+
};
|
|
412
|
+
InputNumericComponent.prototype.registerOnTouched = function (fn) {
|
|
413
|
+
this._onBaseTouched = fn;
|
|
414
|
+
};
|
|
415
|
+
InputNumericComponent.prototype.setDisabledState = function (isDisabled) {
|
|
416
|
+
this._isDisabled = isDisabled;
|
|
417
|
+
};
|
|
418
|
+
var InputNumericComponent_1;
|
|
419
|
+
InputNumericComponent.ctorParameters = function () { return [
|
|
420
|
+
{ type: forms.ControlContainer }
|
|
421
|
+
]; };
|
|
422
|
+
__decorate([
|
|
423
|
+
core.Input()
|
|
424
|
+
], InputNumericComponent.prototype, "formControlName", void 0);
|
|
425
|
+
__decorate([
|
|
426
|
+
core.Input()
|
|
427
|
+
], InputNumericComponent.prototype, "formControl", void 0);
|
|
428
|
+
__decorate([
|
|
429
|
+
core.Input()
|
|
430
|
+
], InputNumericComponent.prototype, "trimLeadingZeros", void 0);
|
|
431
|
+
__decorate([
|
|
432
|
+
core.Input()
|
|
433
|
+
], InputNumericComponent.prototype, "disallowLeadingZero", void 0);
|
|
434
|
+
__decorate([
|
|
435
|
+
core.Input()
|
|
436
|
+
], InputNumericComponent.prototype, "allowDecimal", void 0);
|
|
437
|
+
__decorate([
|
|
438
|
+
core.Input()
|
|
439
|
+
], InputNumericComponent.prototype, "identifier", void 0);
|
|
440
|
+
__decorate([
|
|
441
|
+
core.Input()
|
|
442
|
+
], InputNumericComponent.prototype, "placeholder", void 0);
|
|
443
|
+
__decorate([
|
|
444
|
+
core.Input()
|
|
445
|
+
], InputNumericComponent.prototype, "label", void 0);
|
|
446
|
+
__decorate([
|
|
447
|
+
core.Input()
|
|
448
|
+
], InputNumericComponent.prototype, "maxLength", void 0);
|
|
449
|
+
__decorate([
|
|
450
|
+
core.ContentChild('suffix')
|
|
451
|
+
], InputNumericComponent.prototype, "suffixTmpl", void 0);
|
|
452
|
+
InputNumericComponent = InputNumericComponent_1 = __decorate([
|
|
453
|
+
core.Component({
|
|
454
|
+
selector: 'app-input[type=numeric]',
|
|
455
|
+
template: "<div class=\"grid\">\r\n <mat-form-field class=\"w-full\" appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label *ngIf=\"label\">\r\n <span>{{ label }}</span>\r\n </mat-label>\r\n <input\r\n type=\"text\"\r\n [id]=\"identifier\"\r\n [attr.data-testid]=\"identifier\"\r\n matInput\r\n [placeholder]=\"placeholder\"\r\n [formControl]=\"formControl\"\r\n (input)=\"handleInput($event)\"\r\n [attr.maxlength]=\"maxLength\"\r\n />\r\n <span *ngIf=\"suffixTmpl\" matSuffix>\r\n <ng-container *ngTemplateOutlet=\"suffixTmpl\"></ng-container>\r\n </span>\r\n </mat-form-field>\r\n <mat-error align=\"end\" class=\"leading-zero\" *ngIf=\"isInvalid\">\r\n <small class=\"text-xs\">\r\n {{ errors?.message }}\r\n </small>\r\n </mat-error>\r\n</div>\r\n",
|
|
456
|
+
providers: [
|
|
457
|
+
{
|
|
458
|
+
provide: forms.NG_VALUE_ACCESSOR,
|
|
459
|
+
useExisting: core.forwardRef(function () { return InputNumericComponent_1; }),
|
|
460
|
+
multi: true,
|
|
461
|
+
},
|
|
462
|
+
],
|
|
463
|
+
styles: [":host ::ng-deep .mat-form-field-appearance-outline .mat-form-field-prefix,:host ::ng-deep .mat-form-field-appearance-outline .mat-form-field-suffix{top:0}"]
|
|
464
|
+
})
|
|
465
|
+
], InputNumericComponent);
|
|
466
|
+
return InputNumericComponent;
|
|
467
|
+
}());
|
|
468
|
+
|
|
469
|
+
var InputNumericModule = /** @class */ (function () {
|
|
470
|
+
function InputNumericModule() {
|
|
471
|
+
}
|
|
472
|
+
InputNumericModule = __decorate([
|
|
473
|
+
core.NgModule({
|
|
474
|
+
imports: [formField.MatFormFieldModule, input.MatInputModule, forms.ReactiveFormsModule, common.CommonModule],
|
|
475
|
+
declarations: [InputNumericComponent],
|
|
476
|
+
exports: [InputNumericComponent],
|
|
477
|
+
})
|
|
478
|
+
], InputNumericModule);
|
|
479
|
+
return InputNumericModule;
|
|
480
|
+
}());
|
|
481
|
+
|
|
346
482
|
var MatSelectInfiniteScrollDirective = /** @class */ (function () {
|
|
347
483
|
function MatSelectInfiniteScrollDirective(matSelect, ngZone) {
|
|
348
484
|
this.matSelect = matSelect;
|
|
@@ -1466,7 +1602,10 @@
|
|
|
1466
1602
|
var GeneralInformationWAMessageValidationConst = {
|
|
1467
1603
|
channel: [{ type: 'required', message: 'Message Type is required' }],
|
|
1468
1604
|
from: [{ type: 'required', message: 'From is required' }],
|
|
1469
|
-
text: [
|
|
1605
|
+
text: [
|
|
1606
|
+
{ type: 'required', message: 'Text is required' },
|
|
1607
|
+
{ type: 'maxlength', message: 'Maximum character 1024' },
|
|
1608
|
+
],
|
|
1470
1609
|
media: [{ type: 'required', message: 'Media Type is required' }],
|
|
1471
1610
|
fileName: [{ type: 'required', message: 'File is required' }],
|
|
1472
1611
|
template: [{ type: 'required', message: 'Template is required' }],
|
|
@@ -1861,7 +2000,7 @@
|
|
|
1861
2000
|
var subs = this.apiAdapterService
|
|
1862
2001
|
.executeApiRequest([], "/campaign/" + ((_d = (_c = this.getCampaignStorage) === null || _c === void 0 ? void 0 : _c.generalInformation) === null || _d === void 0 ? void 0 : _d.id), 'GET')
|
|
1863
2002
|
.subscribe(function (resp) {
|
|
1864
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63;
|
|
2003
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67;
|
|
1865
2004
|
if (!resp)
|
|
1866
2005
|
return;
|
|
1867
2006
|
var generalInformation = {
|
|
@@ -1873,59 +2012,61 @@
|
|
|
1873
2012
|
: (_f = (_e = resp.data) === null || _e === void 0 ? void 0 : _e.type) === null || _f === void 0 ? void 0 : _f.toUpperCase(),
|
|
1874
2013
|
media: (_h = (_g = resp.data) === null || _g === void 0 ? void 0 : _g.type) === null || _h === void 0 ? void 0 : _h.toUpperCase(),
|
|
1875
2014
|
isPrevTemplate: (_k = (_j = resp) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.isPrevTemplate,
|
|
2015
|
+
templateName: (_m = (_l = resp) === null || _l === void 0 ? void 0 : _l.data) === null || _m === void 0 ? void 0 : _m.templateName,
|
|
2016
|
+
ttl: (_p = (_o = resp) === null || _o === void 0 ? void 0 : _o.data) === null || _p === void 0 ? void 0 : _p.ttlSeconds,
|
|
1876
2017
|
from: {
|
|
1877
|
-
id: (
|
|
1878
|
-
name: (
|
|
1879
|
-
platform: (
|
|
1880
|
-
clientId: (
|
|
1881
|
-
clientName: (
|
|
1882
|
-
accountNo: (
|
|
1883
|
-
wabaId: (
|
|
2018
|
+
id: (_q = resp.data) === null || _q === void 0 ? void 0 : _q.accountId,
|
|
2019
|
+
name: (_r = resp.data) === null || _r === void 0 ? void 0 : _r.accountName,
|
|
2020
|
+
platform: (_s = resp.data) === null || _s === void 0 ? void 0 : _s.platform,
|
|
2021
|
+
clientId: (_t = resp.data) === null || _t === void 0 ? void 0 : _t.clientId,
|
|
2022
|
+
clientName: (_u = resp.data) === null || _u === void 0 ? void 0 : _u.clientName,
|
|
2023
|
+
accountNo: (_v = resp.data) === null || _v === void 0 ? void 0 : _v.accountNo,
|
|
2024
|
+
wabaId: (_x = (_w = resp.data) === null || _w === void 0 ? void 0 : _w.wabaId, (_x !== null && _x !== void 0 ? _x : '')),
|
|
1884
2025
|
},
|
|
1885
|
-
text: (
|
|
1886
|
-
targetURL: (
|
|
1887
|
-
paramHeader: (
|
|
1888
|
-
paramBody: (
|
|
1889
|
-
paramButton: (
|
|
1890
|
-
otpValue: (
|
|
2026
|
+
text: (_z = (_y = resp.data) === null || _y === void 0 ? void 0 : _y.details) === null || _z === void 0 ? void 0 : _z.text,
|
|
2027
|
+
targetURL: (_11 = (_7 = (_3 = (_2 = (_1 = (_0 = resp.data) === null || _0 === void 0 ? void 0 : _0.details) === null || _1 === void 0 ? void 0 : _1.image) === null || _2 === void 0 ? void 0 : _2.url, (_3 !== null && _3 !== void 0 ? _3 : (_6 = (_5 = (_4 = resp.data) === null || _4 === void 0 ? void 0 : _4.details) === null || _5 === void 0 ? void 0 : _5.document) === null || _6 === void 0 ? void 0 : _6.url)), (_7 !== null && _7 !== void 0 ? _7 : (_10 = (_9 = (_8 = resp.data) === null || _8 === void 0 ? void 0 : _8.details) === null || _9 === void 0 ? void 0 : _9.video) === null || _10 === void 0 ? void 0 : _10.url)), (_11 !== null && _11 !== void 0 ? _11 : (_14 = (_13 = (_12 = resp.data) === null || _12 === void 0 ? void 0 : _12.details) === null || _13 === void 0 ? void 0 : _13.template) === null || _14 === void 0 ? void 0 : _14.headerURL)),
|
|
2028
|
+
paramHeader: (_17 = (_16 = (_15 = resp.data) === null || _15 === void 0 ? void 0 : _15.details) === null || _16 === void 0 ? void 0 : _16.template) === null || _17 === void 0 ? void 0 : _17.header,
|
|
2029
|
+
paramBody: (_20 = (_19 = (_18 = resp.data) === null || _18 === void 0 ? void 0 : _18.details) === null || _19 === void 0 ? void 0 : _19.template) === null || _20 === void 0 ? void 0 : _20.data,
|
|
2030
|
+
paramButton: (_23 = (_22 = (_21 = resp.data) === null || _21 === void 0 ? void 0 : _21.details) === null || _22 === void 0 ? void 0 : _22.template) === null || _23 === void 0 ? void 0 : _23.button,
|
|
2031
|
+
otpValue: (_28 = __spread((_27 = (_26 = (_25 = (_24 = resp.data) === null || _24 === void 0 ? void 0 : _24.details) === null || _25 === void 0 ? void 0 : _25.template) === null || _26 === void 0 ? void 0 : _26.data, (_27 !== null && _27 !== void 0 ? _27 : [])))) === null || _28 === void 0 ? void 0 : _28.pop(),
|
|
1891
2032
|
template: {
|
|
1892
|
-
ID: (
|
|
1893
|
-
name: (
|
|
1894
|
-
lang: (
|
|
1895
|
-
platform: (
|
|
1896
|
-
headerURL: (
|
|
2033
|
+
ID: (_31 = (_30 = (_29 = resp.data) === null || _29 === void 0 ? void 0 : _29.details) === null || _30 === void 0 ? void 0 : _30.template) === null || _31 === void 0 ? void 0 : _31.id,
|
|
2034
|
+
name: (_34 = (_33 = (_32 = resp.data) === null || _32 === void 0 ? void 0 : _32.details) === null || _33 === void 0 ? void 0 : _33.template) === null || _34 === void 0 ? void 0 : _34.name,
|
|
2035
|
+
lang: (_37 = (_36 = (_35 = resp.data) === null || _35 === void 0 ? void 0 : _35.details) === null || _36 === void 0 ? void 0 : _36.template) === null || _37 === void 0 ? void 0 : _37.lang,
|
|
2036
|
+
platform: (_38 = resp.data) === null || _38 === void 0 ? void 0 : _38.platform,
|
|
2037
|
+
headerURL: (_41 = (_40 = (_39 = resp.data) === null || _39 === void 0 ? void 0 : _39.details) === null || _40 === void 0 ? void 0 : _40.template) === null || _41 === void 0 ? void 0 : _41.headerURL,
|
|
1897
2038
|
header: {
|
|
1898
|
-
examples: (
|
|
2039
|
+
examples: (_44 = (_43 = (_42 = resp.data) === null || _42 === void 0 ? void 0 : _42.details) === null || _43 === void 0 ? void 0 : _43.template) === null || _44 === void 0 ? void 0 : _44.header,
|
|
1899
2040
|
},
|
|
1900
2041
|
body: {
|
|
1901
|
-
examples: (
|
|
2042
|
+
examples: (_47 = (_46 = (_45 = resp.data) === null || _45 === void 0 ? void 0 : _45.details) === null || _46 === void 0 ? void 0 : _46.template) === null || _47 === void 0 ? void 0 : _47.data,
|
|
1902
2043
|
},
|
|
1903
|
-
buttons: (
|
|
1904
|
-
ClientId: (
|
|
1905
|
-
ClientName: (
|
|
2044
|
+
buttons: (_50 = (_49 = (_48 = resp.data) === null || _48 === void 0 ? void 0 : _48.details) === null || _49 === void 0 ? void 0 : _49.template) === null || _50 === void 0 ? void 0 : _50.button,
|
|
2045
|
+
ClientId: (_51 = resp.data) === null || _51 === void 0 ? void 0 : _51.clientId,
|
|
2046
|
+
ClientName: (_52 = resp.data) === null || _52 === void 0 ? void 0 : _52.clientName,
|
|
1906
2047
|
},
|
|
1907
|
-
isUpload: ((
|
|
1908
|
-
fileId: (
|
|
2048
|
+
isUpload: ((_53 = resp.data) === null || _53 === void 0 ? void 0 : _53.fileId) !== '',
|
|
2049
|
+
fileId: (_54 = resp.data) === null || _54 === void 0 ? void 0 : _54.fileId,
|
|
1909
2050
|
};
|
|
1910
2051
|
localStorage.setItem('telin.campaign', JSON.stringify(__assign(__assign({}, _this.getCampaignStorage), {
|
|
1911
2052
|
generalInformation: {
|
|
1912
|
-
id: (
|
|
2053
|
+
id: (_55 = resp.data) === null || _55 === void 0 ? void 0 : _55.id,
|
|
1913
2054
|
form: generalInformation,
|
|
1914
2055
|
},
|
|
1915
|
-
failover: (
|
|
1916
|
-
targetAudience: (
|
|
2056
|
+
failover: (_56 = resp.data) === null || _56 === void 0 ? void 0 : _56.failover,
|
|
2057
|
+
targetAudience: (_57 = resp.data) === null || _57 === void 0 ? void 0 : _57.targets,
|
|
1917
2058
|
targetAudienceFile: {
|
|
1918
|
-
name: (
|
|
1919
|
-
targetURL: (
|
|
2059
|
+
name: (_58 = resp.data) === null || _58 === void 0 ? void 0 : _58.fileName,
|
|
2060
|
+
targetURL: (_59 = resp.data) === null || _59 === void 0 ? void 0 : _59.targetURL,
|
|
1920
2061
|
},
|
|
1921
2062
|
scheduler: {
|
|
1922
|
-
schedulerType: ((
|
|
2063
|
+
schedulerType: ((_60 = resp.data) === null || _60 === void 0 ? void 0 : _60.scheduleType) === 'MULTI'
|
|
1923
2064
|
? 'ONE_TIME'
|
|
1924
|
-
: (
|
|
1925
|
-
startDate: (
|
|
1926
|
-
startTime: (
|
|
1927
|
-
isRepeat: ((
|
|
1928
|
-
delivery: (
|
|
2065
|
+
: (_61 = resp.data) === null || _61 === void 0 ? void 0 : _61.scheduleType,
|
|
2066
|
+
startDate: (_63 = (_62 = resp.data) === null || _62 === void 0 ? void 0 : _62.startTime) === null || _63 === void 0 ? void 0 : _63.split(' ')[0],
|
|
2067
|
+
startTime: (_65 = (_64 = resp.data) === null || _64 === void 0 ? void 0 : _64.startTime) === null || _65 === void 0 ? void 0 : _65.split(' ')[1],
|
|
2068
|
+
isRepeat: ((_66 = resp.data) === null || _66 === void 0 ? void 0 : _66.scheduleType) === 'MULTI',
|
|
2069
|
+
delivery: (_67 = resp.data) === null || _67 === void 0 ? void 0 : _67.repeat,
|
|
1929
2070
|
},
|
|
1930
2071
|
})));
|
|
1931
2072
|
_this.isLoading = false;
|
|
@@ -2607,6 +2748,7 @@
|
|
|
2607
2748
|
this.category = 'utility';
|
|
2608
2749
|
this.template = ((_l = source) === null || _l === void 0 ? void 0 : _l.isUseExistingTemplate) ? (_m = source) === null || _m === void 0 ? void 0 : _m.template : { name: '', lang: 'id', header: null, button: null, data: [] };
|
|
2609
2750
|
this.isNeedSave = source.isNeedSave;
|
|
2751
|
+
this.ttlSeconds = source.ttl;
|
|
2610
2752
|
if ((_o = source) === null || _o === void 0 ? void 0 : _o.isUseExistingTemplate) {
|
|
2611
2753
|
this.text = (_r = (_q = (_p = source) === null || _p === void 0 ? void 0 : _p.template) === null || _q === void 0 ? void 0 : _q.body) === null || _r === void 0 ? void 0 : _r.text;
|
|
2612
2754
|
}
|
|
@@ -2736,7 +2878,7 @@
|
|
|
2736
2878
|
var subs = this.apiAdapterService
|
|
2737
2879
|
.executeApiRequest([], "/campaign/" + this.campaignID, 'GET')
|
|
2738
2880
|
.subscribe(function (resp) {
|
|
2739
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64;
|
|
2881
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54, _55, _56, _57, _58, _59, _60, _61, _62, _63, _64, _65, _66, _67, _68;
|
|
2740
2882
|
if (!resp)
|
|
2741
2883
|
return;
|
|
2742
2884
|
var generalInformation = {
|
|
@@ -2748,62 +2890,64 @@
|
|
|
2748
2890
|
: (_f = (_e = resp.data) === null || _e === void 0 ? void 0 : _e.type) === null || _f === void 0 ? void 0 : _f.toUpperCase(),
|
|
2749
2891
|
media: (_h = (_g = resp.data) === null || _g === void 0 ? void 0 : _g.type) === null || _h === void 0 ? void 0 : _h.toUpperCase(),
|
|
2750
2892
|
isPrevTemplate: (_k = (_j = resp) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.isPrevTemplate,
|
|
2893
|
+
templateName: (_m = (_l = resp) === null || _l === void 0 ? void 0 : _l.data) === null || _m === void 0 ? void 0 : _m.templateName,
|
|
2894
|
+
ttl: (_p = (_o = resp) === null || _o === void 0 ? void 0 : _o.data) === null || _p === void 0 ? void 0 : _p.ttlSeconds,
|
|
2751
2895
|
from: {
|
|
2752
|
-
id: (
|
|
2753
|
-
name: (
|
|
2754
|
-
platform: (
|
|
2755
|
-
clientId: (
|
|
2756
|
-
clientName: (
|
|
2757
|
-
accountNo: (
|
|
2758
|
-
wabaId: (
|
|
2896
|
+
id: (_q = resp.data) === null || _q === void 0 ? void 0 : _q.accountId,
|
|
2897
|
+
name: (_r = resp.data) === null || _r === void 0 ? void 0 : _r.accountName,
|
|
2898
|
+
platform: (_s = resp.data) === null || _s === void 0 ? void 0 : _s.platform,
|
|
2899
|
+
clientId: (_t = resp.data) === null || _t === void 0 ? void 0 : _t.clientId,
|
|
2900
|
+
clientName: (_u = resp.data) === null || _u === void 0 ? void 0 : _u.clientName,
|
|
2901
|
+
accountNo: (_v = resp.data) === null || _v === void 0 ? void 0 : _v.accountNo,
|
|
2902
|
+
wabaId: (_x = (_w = resp.data) === null || _w === void 0 ? void 0 : _w.wabaId, (_x !== null && _x !== void 0 ? _x : '')),
|
|
2759
2903
|
},
|
|
2760
|
-
text: (
|
|
2761
|
-
targetURL: (
|
|
2762
|
-
paramHeader: (
|
|
2763
|
-
paramBody: (
|
|
2764
|
-
paramButton: (
|
|
2765
|
-
otpValue: (
|
|
2904
|
+
text: (_z = (_y = resp.data) === null || _y === void 0 ? void 0 : _y.details) === null || _z === void 0 ? void 0 : _z.text,
|
|
2905
|
+
targetURL: (_11 = (_7 = (_3 = (_2 = (_1 = (_0 = resp.data) === null || _0 === void 0 ? void 0 : _0.details) === null || _1 === void 0 ? void 0 : _1.image) === null || _2 === void 0 ? void 0 : _2.url, (_3 !== null && _3 !== void 0 ? _3 : (_6 = (_5 = (_4 = resp.data) === null || _4 === void 0 ? void 0 : _4.details) === null || _5 === void 0 ? void 0 : _5.document) === null || _6 === void 0 ? void 0 : _6.url)), (_7 !== null && _7 !== void 0 ? _7 : (_10 = (_9 = (_8 = resp.data) === null || _8 === void 0 ? void 0 : _8.details) === null || _9 === void 0 ? void 0 : _9.video) === null || _10 === void 0 ? void 0 : _10.url)), (_11 !== null && _11 !== void 0 ? _11 : (_14 = (_13 = (_12 = resp.data) === null || _12 === void 0 ? void 0 : _12.details) === null || _13 === void 0 ? void 0 : _13.template) === null || _14 === void 0 ? void 0 : _14.headerURL)),
|
|
2906
|
+
paramHeader: (_17 = (_16 = (_15 = resp.data) === null || _15 === void 0 ? void 0 : _15.details) === null || _16 === void 0 ? void 0 : _16.template) === null || _17 === void 0 ? void 0 : _17.header,
|
|
2907
|
+
paramBody: (_20 = (_19 = (_18 = resp.data) === null || _18 === void 0 ? void 0 : _18.details) === null || _19 === void 0 ? void 0 : _19.template) === null || _20 === void 0 ? void 0 : _20.data,
|
|
2908
|
+
paramButton: (_23 = (_22 = (_21 = resp.data) === null || _21 === void 0 ? void 0 : _21.details) === null || _22 === void 0 ? void 0 : _22.template) === null || _23 === void 0 ? void 0 : _23.button,
|
|
2909
|
+
otpValue: (_28 = __spread((_27 = (_26 = (_25 = (_24 = resp.data) === null || _24 === void 0 ? void 0 : _24.details) === null || _25 === void 0 ? void 0 : _25.template) === null || _26 === void 0 ? void 0 : _26.data, (_27 !== null && _27 !== void 0 ? _27 : [])))) === null || _28 === void 0 ? void 0 : _28.pop(),
|
|
2766
2910
|
template: {
|
|
2767
|
-
ID: (
|
|
2768
|
-
name: (
|
|
2769
|
-
lang: (
|
|
2770
|
-
platform: (
|
|
2771
|
-
headerURL: (
|
|
2911
|
+
ID: (_31 = (_30 = (_29 = resp.data) === null || _29 === void 0 ? void 0 : _29.details) === null || _30 === void 0 ? void 0 : _30.template) === null || _31 === void 0 ? void 0 : _31.id,
|
|
2912
|
+
name: (_34 = (_33 = (_32 = resp.data) === null || _32 === void 0 ? void 0 : _32.details) === null || _33 === void 0 ? void 0 : _33.template) === null || _34 === void 0 ? void 0 : _34.name,
|
|
2913
|
+
lang: (_37 = (_36 = (_35 = resp.data) === null || _35 === void 0 ? void 0 : _35.details) === null || _36 === void 0 ? void 0 : _36.template) === null || _37 === void 0 ? void 0 : _37.lang,
|
|
2914
|
+
platform: (_38 = resp.data) === null || _38 === void 0 ? void 0 : _38.platform,
|
|
2915
|
+
headerURL: (_41 = (_40 = (_39 = resp.data) === null || _39 === void 0 ? void 0 : _39.details) === null || _40 === void 0 ? void 0 : _40.template) === null || _41 === void 0 ? void 0 : _41.headerURL,
|
|
2772
2916
|
header: {
|
|
2773
|
-
examples: (
|
|
2917
|
+
examples: (_44 = (_43 = (_42 = resp.data) === null || _42 === void 0 ? void 0 : _42.details) === null || _43 === void 0 ? void 0 : _43.template) === null || _44 === void 0 ? void 0 : _44.header,
|
|
2774
2918
|
},
|
|
2775
2919
|
body: {
|
|
2776
|
-
examples: (
|
|
2920
|
+
examples: (_47 = (_46 = (_45 = resp.data) === null || _45 === void 0 ? void 0 : _45.details) === null || _46 === void 0 ? void 0 : _46.template) === null || _47 === void 0 ? void 0 : _47.data,
|
|
2777
2921
|
},
|
|
2778
|
-
buttons: (
|
|
2779
|
-
ClientId: (
|
|
2780
|
-
ClientName: (
|
|
2922
|
+
buttons: (_50 = (_49 = (_48 = resp.data) === null || _48 === void 0 ? void 0 : _48.details) === null || _49 === void 0 ? void 0 : _49.template) === null || _50 === void 0 ? void 0 : _50.button,
|
|
2923
|
+
ClientId: (_51 = resp.data) === null || _51 === void 0 ? void 0 : _51.clientId,
|
|
2924
|
+
ClientName: (_52 = resp.data) === null || _52 === void 0 ? void 0 : _52.clientName,
|
|
2781
2925
|
},
|
|
2782
|
-
isUpload: ((
|
|
2783
|
-
fileId: (
|
|
2926
|
+
isUpload: ((_53 = resp.data) === null || _53 === void 0 ? void 0 : _53.fileId) !== '',
|
|
2927
|
+
fileId: (_54 = resp.data) === null || _54 === void 0 ? void 0 : _54.fileId,
|
|
2784
2928
|
};
|
|
2785
2929
|
localStorage.setItem('telin.campaign', JSON.stringify(__assign(__assign({}, _this.getCampaignStorage), {
|
|
2786
2930
|
generalInformation: {
|
|
2787
|
-
id: (
|
|
2931
|
+
id: (_55 = resp.data) === null || _55 === void 0 ? void 0 : _55.id,
|
|
2788
2932
|
form: generalInformation,
|
|
2789
2933
|
},
|
|
2790
|
-
failover: (
|
|
2791
|
-
targetAudience: (
|
|
2934
|
+
failover: (_56 = resp.data) === null || _56 === void 0 ? void 0 : _56.failover,
|
|
2935
|
+
targetAudience: (_57 = resp.data) === null || _57 === void 0 ? void 0 : _57.targets,
|
|
2792
2936
|
targetAudienceFile: {
|
|
2793
|
-
name: (
|
|
2794
|
-
targetURL: (
|
|
2937
|
+
name: (_58 = resp.data) === null || _58 === void 0 ? void 0 : _58.fileName,
|
|
2938
|
+
targetURL: (_59 = resp.data) === null || _59 === void 0 ? void 0 : _59.targetURL,
|
|
2795
2939
|
},
|
|
2796
2940
|
scheduler: {
|
|
2797
|
-
schedulerType: ((
|
|
2941
|
+
schedulerType: ((_60 = resp.data) === null || _60 === void 0 ? void 0 : _60.scheduleType) === 'MULTI'
|
|
2798
2942
|
? 'ONE_TIME'
|
|
2799
|
-
: (
|
|
2800
|
-
startDate: (
|
|
2801
|
-
startTime: (
|
|
2802
|
-
isRepeat: ((
|
|
2803
|
-
delivery: (
|
|
2943
|
+
: (_61 = resp.data) === null || _61 === void 0 ? void 0 : _61.scheduleType,
|
|
2944
|
+
startDate: (_63 = (_62 = resp.data) === null || _62 === void 0 ? void 0 : _62.startTime) === null || _63 === void 0 ? void 0 : _63.split(' ')[0],
|
|
2945
|
+
startTime: (_65 = (_64 = resp.data) === null || _64 === void 0 ? void 0 : _64.startTime) === null || _65 === void 0 ? void 0 : _65.split(' ')[1],
|
|
2946
|
+
isRepeat: ((_66 = resp.data) === null || _66 === void 0 ? void 0 : _66.scheduleType) === 'MULTI',
|
|
2947
|
+
delivery: (_67 = resp.data) === null || _67 === void 0 ? void 0 : _67.repeat,
|
|
2804
2948
|
},
|
|
2805
2949
|
})));
|
|
2806
|
-
_this.isLine = ((
|
|
2950
|
+
_this.isLine = ((_68 = resp.data) === null || _68 === void 0 ? void 0 : _68.platform) === 'LINE';
|
|
2807
2951
|
_this.isLoading = false;
|
|
2808
2952
|
_this.initWizard();
|
|
2809
2953
|
}, function () {
|
|
@@ -4039,6 +4183,49 @@
|
|
|
4039
4183
|
EnumData["SCHEDULER_TYPE_MULTIPLE"] = "MULTIPLE";
|
|
4040
4184
|
})(EnumData || (EnumData = {}));
|
|
4041
4185
|
|
|
4186
|
+
var maxValidator = function (max, message) {
|
|
4187
|
+
return function (AC) {
|
|
4188
|
+
var isError = forms.Validators.max(max)(AC);
|
|
4189
|
+
if (isError)
|
|
4190
|
+
return {
|
|
4191
|
+
max: max,
|
|
4192
|
+
actual: AC.value,
|
|
4193
|
+
message: message || "Max Value equals to " + max,
|
|
4194
|
+
};
|
|
4195
|
+
return null;
|
|
4196
|
+
};
|
|
4197
|
+
};
|
|
4198
|
+
|
|
4199
|
+
var minValidator = function (min, message) {
|
|
4200
|
+
return function (AC) {
|
|
4201
|
+
var isError = forms.Validators.min(min)(AC);
|
|
4202
|
+
if (isError)
|
|
4203
|
+
return {
|
|
4204
|
+
min: min,
|
|
4205
|
+
actual: AC.value,
|
|
4206
|
+
message: message || "Min Value equals to " + min,
|
|
4207
|
+
};
|
|
4208
|
+
return null;
|
|
4209
|
+
};
|
|
4210
|
+
};
|
|
4211
|
+
|
|
4212
|
+
var requiredValidator = function (message) {
|
|
4213
|
+
return function (ac) {
|
|
4214
|
+
var isError = forms.Validators.required(ac);
|
|
4215
|
+
if (isError)
|
|
4216
|
+
return { message: message };
|
|
4217
|
+
return null;
|
|
4218
|
+
};
|
|
4219
|
+
};
|
|
4220
|
+
|
|
4221
|
+
var Validators = {
|
|
4222
|
+
compose: forms.Validators.compose,
|
|
4223
|
+
composeAync: forms.Validators.composeAsync,
|
|
4224
|
+
max: maxValidator,
|
|
4225
|
+
min: minValidator,
|
|
4226
|
+
required: requiredValidator,
|
|
4227
|
+
};
|
|
4228
|
+
|
|
4042
4229
|
var GeneralInformationWAComponent = /** @class */ (function () {
|
|
4043
4230
|
function GeneralInformationWAComponent(ngZone, mapsAPILoader, apiAdapterService, toastr) {
|
|
4044
4231
|
this.ngZone = ngZone;
|
|
@@ -4134,6 +4321,7 @@
|
|
|
4134
4321
|
body: new forms.FormControl(null),
|
|
4135
4322
|
isUseExistingTemplate: new forms.FormControl(false),
|
|
4136
4323
|
isNeedSave: new forms.FormControl(false),
|
|
4324
|
+
ttl: new forms.FormControl(null),
|
|
4137
4325
|
});
|
|
4138
4326
|
this.form.valueChanges.subscribe(function () {
|
|
4139
4327
|
setTimeout(function () {
|
|
@@ -4148,7 +4336,7 @@
|
|
|
4148
4336
|
this.form.disable();
|
|
4149
4337
|
};
|
|
4150
4338
|
GeneralInformationWAComponent.prototype.initEdit = function () {
|
|
4151
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6;
|
|
4339
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9;
|
|
4152
4340
|
if (Object.entries(this.getCampaignStorage).length === 0 ||
|
|
4153
4341
|
((_c = (_b = (_a = this.getCampaignStorage) === null || _a === void 0 ? void 0 : _a.generalInformation) === null || _b === void 0 ? void 0 : _b.form) === null || _c === void 0 ? void 0 : _c.medium) !== 'WA')
|
|
4154
4342
|
return;
|
|
@@ -4176,12 +4364,13 @@
|
|
|
4176
4364
|
.setValue((_z = (_y = this.getCampaignStorage) === null || _y === void 0 ? void 0 : _y.generalInformation) === null || _z === void 0 ? void 0 : _z.form.otpValue);
|
|
4177
4365
|
this.form
|
|
4178
4366
|
.get('isUseExistingTemplate')
|
|
4179
|
-
.setValue(!!((_2 = (_1 = (_0 = this.getCampaignStorage) === null || _0 === void 0 ? void 0 : _0.generalInformation) === null || _1 === void 0 ? void 0 : _1.form) === null || _2 === void 0 ? void 0 : _2.
|
|
4367
|
+
.setValue(!!((_2 = (_1 = (_0 = this.getCampaignStorage) === null || _0 === void 0 ? void 0 : _0.generalInformation) === null || _1 === void 0 ? void 0 : _1.form) === null || _2 === void 0 ? void 0 : _2.templateName));
|
|
4180
4368
|
this.form
|
|
4181
4369
|
.get('isNeedSave')
|
|
4182
4370
|
.setValue(!!((_5 = (_4 = (_3 = this.getCampaignStorage) === null || _3 === void 0 ? void 0 : _3.generalInformation) === null || _4 === void 0 ? void 0 : _4.form) === null || _5 === void 0 ? void 0 : _5.isNeedSave));
|
|
4371
|
+
this.form.get('ttl').setValue((_8 = (_7 = (_6 = this.getCampaignStorage) === null || _6 === void 0 ? void 0 : _6.generalInformation) === null || _7 === void 0 ? void 0 : _7.form) === null || _8 === void 0 ? void 0 : _8.ttl);
|
|
4183
4372
|
this.isHaveTemplateParam = this.form.get('isUpload').value;
|
|
4184
|
-
this.getTemplateOptionService(null, (
|
|
4373
|
+
this.getTemplateOptionService(null, (_9 = this.form.get('template').value) === null || _9 === void 0 ? void 0 : _9.name);
|
|
4185
4374
|
};
|
|
4186
4375
|
GeneralInformationWAComponent.prototype.initValidation = function () {
|
|
4187
4376
|
for (var key in this.form.controls) {
|
|
@@ -4229,9 +4418,16 @@
|
|
|
4229
4418
|
}
|
|
4230
4419
|
else if (this.getIsUtility) {
|
|
4231
4420
|
this.form.get('from').setValidators(forms.Validators.required);
|
|
4232
|
-
this.form.get('text').setValidators(forms.Validators.required);
|
|
4421
|
+
this.form.get('text').setValidators([forms.Validators.required, forms.Validators.maxLength(1024)]);
|
|
4422
|
+
this.form
|
|
4423
|
+
.get('ttl')
|
|
4424
|
+
.setValidators([
|
|
4425
|
+
Validators.min(30, 'Minimum TTL 30'),
|
|
4426
|
+
Validators.max(43200, 'Maximum TTL 43200'),
|
|
4427
|
+
]);
|
|
4233
4428
|
this.form.get('from').updateValueAndValidity();
|
|
4234
4429
|
this.form.get('text').updateValueAndValidity();
|
|
4430
|
+
this.form.get('ttl').updateValueAndValidity();
|
|
4235
4431
|
}
|
|
4236
4432
|
else {
|
|
4237
4433
|
this.form.get('from').setValidators(forms.Validators.required);
|
|
@@ -4684,7 +4880,7 @@
|
|
|
4684
4880
|
else {
|
|
4685
4881
|
this.form.get('template').reset();
|
|
4686
4882
|
this.form.get('template').clearValidators();
|
|
4687
|
-
this.form.get('text').setValidators(forms.Validators.required);
|
|
4883
|
+
this.form.get('text').setValidators([forms.Validators.required, forms.Validators.max(1024)]);
|
|
4688
4884
|
this.form.get('text').updateValueAndValidity();
|
|
4689
4885
|
this.form.get('template').updateValueAndValidity();
|
|
4690
4886
|
}
|
|
@@ -4719,7 +4915,7 @@
|
|
|
4719
4915
|
GeneralInformationWAComponent = __decorate([
|
|
4720
4916
|
core.Component({
|
|
4721
4917
|
selector: 'lib-general-information-wa',
|
|
4722
|
-
template: "<form autocomplete=\"off\" [formGroup]=\"form\">\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Message Type</mat-label>\r\n\r\n <mat-select placeholder=\"Select message type\" formControlName=\"channel\">\r\n <mat-option\r\n *ngFor=\"let option of msgTypeWAOption\"\r\n [value]=\"option.code\"\r\n (click)=\"formReset()\"\r\n >\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.channel\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('channel')?.touched && form.get('channel')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n\r\n <div\r\n *ngIf=\"!getIsTemplate\"\r\n role=\"alert\"\r\n class=\"alert alert-warning d-flex align-items-center\"\r\n style=\"margin-top: 16px; border: 1px solid rgb(243, 124, 44)\"\r\n >\r\n <mat-icon style=\"margin-right: 10px !important\">error_outline</mat-icon>\r\n <div>\r\n If you select this channel, keep in mind that the message might not be delivered to\r\n all selected customers. This is because the customer must have had a conversation\r\n previously with BSP.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <ng-container *ngIf=\"getIsText\">\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from').touched && form.get('from').hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label class=\"asterix--after\">Text</mat-label>\r\n\r\n <textarea\r\n matInput\r\n rows=\"6\"\r\n cols=\"50\"\r\n cdkTextareaAutosize\r\n cdkAutosizeMinRows=\"2\"\r\n cdkAutosizeMaxRows=\"15\"\r\n formControlName=\"text\"\r\n placeholder=\"Enter text\"\r\n #autosize=\"cdkTextareaAutosize\"\r\n ></textarea>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.text\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('text')?.touched && form.get('text')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsMedia\">\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Media Type</mat-label>\r\n\r\n <mat-select\r\n placeholder=\"Select media type\"\r\n formControlName=\"media\"\r\n (selectionChange)=\"updateMediaType($event.value)\"\r\n >\r\n <mat-option *ngFor=\"let option of mediaTypeOption\" [value]=\"option.code\">\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.media\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('media').touched && form.get('media').hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from').touched && form.get('from').hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <ng-container *ngIf=\"form.get('media').value?.toLowerCase() !== 'location'\">\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">File</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n autocomplete=\"off\"\r\n (click)=\"filePicker.click()\"\r\n formControlName=\"fileName\"\r\n />\r\n\r\n <button\r\n mat-button\r\n matSuffix\r\n mat-icon-button\r\n aria-label=\"Choose File\"\r\n (click)=\"filePicker.click()\"\r\n >\r\n <mat-icon>attach_file</mat-icon>\r\n </button>\r\n\r\n <input\r\n #filePicker\r\n hidden\r\n type=\"file\"\r\n [accept]=\"extFileAccepted\"\r\n (change)=\"onFileSelected($event)\"\r\n />\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.fileName\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('fileName').touched &&\r\n form.get('fileName').hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"form.get('media').value?.toLowerCase() === 'location'\">\r\n <div class=\"w-100\">\r\n <h4 class=\"asterix--after\">Location</h4>\r\n\r\n <div class=\"w-100\">\r\n <agm-map\r\n style=\"width: 100%; height: 400px\"\r\n [latitude]=\"maps.latitude\"\r\n [longitude]=\"maps.longitude\"\r\n [disableDoubleClickZoom]=\"maps.isDoubleClickZoom\"\r\n [zoom]=\"maps.zoom\"\r\n >\r\n <agm-marker\r\n [latitude]=\"maps.latitude\"\r\n [longitude]=\"maps.longitude\"\r\n [markerDraggable]=\"maps.isDraggable\"\r\n (dragEnd)=\"markerDragEnd($event)\"\r\n ></agm-marker>\r\n </agm-map>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Location</mat-label>\r\n\r\n <input\r\n #mapSearch\r\n matInput\r\n type=\"text\"\r\n maxlength=\"100\"\r\n placeholder=\"Enter location here\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsTemplate\">\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n (selectionChange)=\"getTemplateOptionService($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from')?.touched && form.get('from')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Template</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"template\"\r\n placeholder=\"Select template\"\r\n [complete]=\"isHaveNextTemplateOption === false\"\r\n [compareWith]=\"templateSelectedDisplay\"\r\n (infiniteScroll)=\"getNextTemplateBatch()\"\r\n (selectionChange)=\"updateTemplate($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('template').value?.name\"\r\n (searchRes)=\"updateSearch($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of templateOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingTemplateOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.template\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('template')?.touched &&\r\n form.get('template')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div *ngIf=\"isHaveTemplateParam\" class=\"d-flex justify-content-end\">\r\n <mat-checkbox\r\n labelPosition=\"before\"\r\n formControlName=\"isUpload\"\r\n (change)=\"updateDownloadCSV($event.checked)\"\r\n >\r\n Using Download XLSX\r\n </mat-checkbox>\r\n </div>\r\n\r\n <ng-container *ngIf=\"!form.get('isUpload')?.value\">\r\n <div\r\n *ngIf=\"form.get('template')?.value?.category === 'AUTHENTICATION'\"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label> OTP Value </mat-label>\r\n\r\n <input matInput type=\"text\" formControlName=\"otpValue\" />\r\n </mat-form-field>\r\n </div>\r\n\r\n <ng-container *ngIf=\"getParamHeader?.length > 0\">\r\n <p class=\"font-16px font-PoppinsBold\">Header Parameter</p>\r\n\r\n <div\r\n *ngFor=\"let param of getParamHeader; let paramHeaderIndex = index\"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Parameter {{ paramHeaderIndex + 1 }}</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n [placeholder]=\"'Parameter ' + (paramHeaderIndex + 1)\"\r\n [formControl]=\"param.get('name')\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getParamBody?.length > 0\">\r\n <p class=\"font-16px font-PoppinsBold mt-3\">Body Parameter</p>\r\n\r\n <div\r\n *ngFor=\"let param of getParamBody; let paramBodyIndex = index\"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n [placeholder]=\"'Parameter ' + (paramBodyIndex + 1)\"\r\n [formControl]=\"param.get('name')\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"isShowParameter\">\r\n <p class=\"font-16px font-PoppinsBold mt-3\">Button Parameter</p>\r\n\r\n <ng-container *ngFor=\"let button of getButton; let buttonIndex = index\">\r\n <ng-container *ngIf=\"getParamButton(buttonIndex)?.length > 0\">\r\n <p class=\"font-14px font-PoppinsBold mt-3\">Button {{ buttonIndex + 1 }}</p>\r\n\r\n <div\r\n *ngFor=\"\r\n let param of getParamButton(buttonIndex);\r\n let paramIndex = index\r\n \"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Parameter {{ paramIndex + 1 }}</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n [placeholder]=\"'Parameter ' + (paramIndex + 1)\"\r\n [formControl]=\"param.get('name')\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"\r\n ['image', 'video', 'document'].includes(\r\n form.get('template')?.value?.header?.type?.toLowerCase()\r\n )\r\n \"\r\n >\r\n <p class=\"font-16px font-PoppinsBold mt-3\">File</p>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">File</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n autocomplete=\"off\"\r\n (click)=\"filePicker.click()\"\r\n formControlName=\"fileName\"\r\n />\r\n\r\n <button\r\n mat-button\r\n matSuffix\r\n mat-icon-button\r\n aria-label=\"Choose File\"\r\n (click)=\"filePicker.click()\"\r\n >\r\n <mat-icon>attach_file</mat-icon>\r\n </button>\r\n\r\n <input\r\n #filePicker\r\n hidden\r\n type=\"file\"\r\n [accept]=\"extFileAccepted\"\r\n (change)=\"onFileSelected($event)\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsCatalogue\">\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from')?.touched && form.get('from')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">Category</mat-label>\r\n\r\n <mat-select formControlName=\"category\" placeholder=\"Select category\">\r\n <mat-option *ngFor=\"let option of categoryOption\" [value]=\"option.value\">\r\n {{ option.label }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.category\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('category')?.touched &&\r\n form.get('category')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">Catalog</mat-label>\r\n\r\n <mat-select formControlName=\"catalogue\" placeholder=\"Select catalog\">\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.catalogue\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('catalogue')?.touched &&\r\n form.get('catalogue')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"form.get('category')?.value === 'product'\"\r\n style=\"padding: 8px; border-radius: 8px; border: 1px solid #6177c4\"\r\n >\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Product</mat-label>\r\n\r\n <mat-select formControlName=\"product\" placeholder=\"Select product\">\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.product\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('product')?.touched &&\r\n form.get('product')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Body</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n maxlength=\"100\"\r\n formControlName=\"body\"\r\n placeholder=\"Enter body\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsUtility\">\r\n <div style=\"display: grid; gap: 0.5rem\">\r\n <mat-label class=\"asterix--after\">Template</mat-label>\r\n <mat-radio-group\r\n style=\"display: flex; gap: 0.5rem; flex-wrap: wrap\"\r\n formControlName=\"isUseExistingTemplate\"\r\n (change)=\"handleChangeTemplate($event.value)\"\r\n >\r\n <mat-radio-button\r\n [value]=\"option.value\"\r\n *ngFor=\"let option of templates\"\r\n color=\"primary\"\r\n >\r\n {{ option.label }}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n (selectionChange)=\"handleChangeFrom($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from')?.touched && form.get('from')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <ng-container *ngIf=\"!form.get('isUseExistingTemplate')?.value; else existingTmpl\">\r\n <div\r\n role=\"alert\"\r\n class=\"alert alert-warning d-flex align-items-center\"\r\n style=\"margin-top: 8px; border: 1px solid rgb(243, 124, 44)\"\r\n >\r\n <mat-icon style=\"margin-right: 10px !important\">error_outline</mat-icon>\r\n <div>\r\n Direct Send access restricted for 30 days due to continued misuse. Final warning\r\n before permanent revocation.\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label class=\"asterix--after\">Body</mat-label>\r\n\r\n <textarea\r\n matInput\r\n rows=\"6\"\r\n cols=\"50\"\r\n cdkTextareaAutosize\r\n cdkAutosizeMinRows=\"2\"\r\n cdkAutosizeMaxRows=\"15\"\r\n formControlName=\"text\"\r\n placeholder=\"Enter text\"\r\n #autosize=\"cdkTextareaAutosize\"\r\n ></textarea>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.text\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('text').touched && form.get('text').hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div *ngIf=\"!isReadOnlyMode\">\r\n <mat-checkbox formControlName=\"isNeedSave\">\r\n Save this message as future template\r\n </mat-checkbox>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-template #existingTmpl>\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Template</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"template\"\r\n placeholder=\"Select template\"\r\n [complete]=\"isHaveNextTemplateOption === false\"\r\n [compareWith]=\"templateSelectedDisplay\"\r\n (infiniteScroll)=\"getNextTemplateBatch()\"\r\n (selectionChange)=\"updateTemplate($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('template').value?.name\"\r\n (searchRes)=\"updateSearch($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of templateOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingTemplateOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.template\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('template')?.touched &&\r\n form.get('template')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n</form>\r\n",
|
|
4918
|
+
template: "<form autocomplete=\"off\" [formGroup]=\"form\">\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Message Type</mat-label>\r\n\r\n <mat-select placeholder=\"Select message type\" formControlName=\"channel\">\r\n <mat-option\r\n *ngFor=\"let option of msgTypeWAOption\"\r\n [value]=\"option.code\"\r\n (click)=\"formReset()\"\r\n >\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.channel\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('channel')?.touched && form.get('channel')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n\r\n <div\r\n *ngIf=\"!getIsTemplate\"\r\n role=\"alert\"\r\n class=\"alert alert-warning d-flex align-items-center\"\r\n style=\"margin-top: 16px; border: 1px solid rgb(243, 124, 44)\"\r\n >\r\n <mat-icon style=\"margin-right: 10px !important\">error_outline</mat-icon>\r\n <div>\r\n If you select this channel, keep in mind that the message might not be delivered to\r\n all selected customers. This is because the customer must have had a conversation\r\n previously with BSP.\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <ng-container *ngIf=\"getIsText\">\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from').touched && form.get('from').hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label class=\"asterix--after\">Text</mat-label>\r\n\r\n <textarea\r\n matInput\r\n rows=\"6\"\r\n cols=\"50\"\r\n cdkTextareaAutosize\r\n cdkAutosizeMinRows=\"2\"\r\n cdkAutosizeMaxRows=\"15\"\r\n formControlName=\"text\"\r\n placeholder=\"Enter text\"\r\n #autosize=\"cdkTextareaAutosize\"\r\n ></textarea>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.text\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('text')?.touched && form.get('text')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsMedia\">\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Media Type</mat-label>\r\n\r\n <mat-select\r\n placeholder=\"Select media type\"\r\n formControlName=\"media\"\r\n (selectionChange)=\"updateMediaType($event.value)\"\r\n >\r\n <mat-option *ngFor=\"let option of mediaTypeOption\" [value]=\"option.code\">\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.media\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('media').touched && form.get('media').hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from').touched && form.get('from').hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <ng-container *ngIf=\"form.get('media').value?.toLowerCase() !== 'location'\">\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">File</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n autocomplete=\"off\"\r\n (click)=\"filePicker.click()\"\r\n formControlName=\"fileName\"\r\n />\r\n\r\n <button\r\n mat-button\r\n matSuffix\r\n mat-icon-button\r\n aria-label=\"Choose File\"\r\n (click)=\"filePicker.click()\"\r\n >\r\n <mat-icon>attach_file</mat-icon>\r\n </button>\r\n\r\n <input\r\n #filePicker\r\n hidden\r\n type=\"file\"\r\n [accept]=\"extFileAccepted\"\r\n (change)=\"onFileSelected($event)\"\r\n />\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.fileName\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('fileName').touched &&\r\n form.get('fileName').hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"form.get('media').value?.toLowerCase() === 'location'\">\r\n <div class=\"w-100\">\r\n <h4 class=\"asterix--after\">Location</h4>\r\n\r\n <div class=\"w-100\">\r\n <agm-map\r\n style=\"width: 100%; height: 400px\"\r\n [latitude]=\"maps.latitude\"\r\n [longitude]=\"maps.longitude\"\r\n [disableDoubleClickZoom]=\"maps.isDoubleClickZoom\"\r\n [zoom]=\"maps.zoom\"\r\n >\r\n <agm-marker\r\n [latitude]=\"maps.latitude\"\r\n [longitude]=\"maps.longitude\"\r\n [markerDraggable]=\"maps.isDraggable\"\r\n (dragEnd)=\"markerDragEnd($event)\"\r\n ></agm-marker>\r\n </agm-map>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Location</mat-label>\r\n\r\n <input\r\n #mapSearch\r\n matInput\r\n type=\"text\"\r\n maxlength=\"100\"\r\n placeholder=\"Enter location here\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsTemplate\">\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n (selectionChange)=\"getTemplateOptionService($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from')?.touched && form.get('from')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Template</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"template\"\r\n placeholder=\"Select template\"\r\n [complete]=\"isHaveNextTemplateOption === false\"\r\n [compareWith]=\"templateSelectedDisplay\"\r\n (infiniteScroll)=\"getNextTemplateBatch()\"\r\n (selectionChange)=\"updateTemplate($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('template').value?.name\"\r\n (searchRes)=\"updateSearch($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of templateOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingTemplateOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.template\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('template')?.touched &&\r\n form.get('template')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div *ngIf=\"isHaveTemplateParam\" class=\"d-flex justify-content-end\">\r\n <mat-checkbox\r\n labelPosition=\"before\"\r\n formControlName=\"isUpload\"\r\n (change)=\"updateDownloadCSV($event.checked)\"\r\n >\r\n Using Download XLSX\r\n </mat-checkbox>\r\n </div>\r\n\r\n <ng-container *ngIf=\"!form.get('isUpload')?.value\">\r\n <div\r\n *ngIf=\"form.get('template')?.value?.category === 'AUTHENTICATION'\"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label> OTP Value </mat-label>\r\n\r\n <input matInput type=\"text\" formControlName=\"otpValue\" />\r\n </mat-form-field>\r\n </div>\r\n\r\n <ng-container *ngIf=\"getParamHeader?.length > 0\">\r\n <p class=\"font-16px font-PoppinsBold\">Header Parameter</p>\r\n\r\n <div\r\n *ngFor=\"let param of getParamHeader; let paramHeaderIndex = index\"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Parameter {{ paramHeaderIndex + 1 }}</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n [placeholder]=\"'Parameter ' + (paramHeaderIndex + 1)\"\r\n [formControl]=\"param.get('name')\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getParamBody?.length > 0\">\r\n <p class=\"font-16px font-PoppinsBold mt-3\">Body Parameter</p>\r\n\r\n <div\r\n *ngFor=\"let param of getParamBody; let paramBodyIndex = index\"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n [placeholder]=\"'Parameter ' + (paramBodyIndex + 1)\"\r\n [formControl]=\"param.get('name')\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"isShowParameter\">\r\n <p class=\"font-16px font-PoppinsBold mt-3\">Button Parameter</p>\r\n\r\n <ng-container *ngFor=\"let button of getButton; let buttonIndex = index\">\r\n <ng-container *ngIf=\"getParamButton(buttonIndex)?.length > 0\">\r\n <p class=\"font-14px font-PoppinsBold mt-3\">Button {{ buttonIndex + 1 }}</p>\r\n\r\n <div\r\n *ngFor=\"\r\n let param of getParamButton(buttonIndex);\r\n let paramIndex = index\r\n \"\r\n class=\"form-group\"\r\n >\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Parameter {{ paramIndex + 1 }}</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n [placeholder]=\"'Parameter ' + (paramIndex + 1)\"\r\n [formControl]=\"param.get('name')\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container\r\n *ngIf=\"\r\n ['image', 'video', 'document'].includes(\r\n form.get('template')?.value?.header?.type?.toLowerCase()\r\n )\r\n \"\r\n >\r\n <p class=\"font-16px font-PoppinsBold mt-3\">File</p>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">File</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n autocomplete=\"off\"\r\n (click)=\"filePicker.click()\"\r\n formControlName=\"fileName\"\r\n />\r\n\r\n <button\r\n mat-button\r\n matSuffix\r\n mat-icon-button\r\n aria-label=\"Choose File\"\r\n (click)=\"filePicker.click()\"\r\n >\r\n <mat-icon>attach_file</mat-icon>\r\n </button>\r\n\r\n <input\r\n #filePicker\r\n hidden\r\n type=\"file\"\r\n [accept]=\"extFileAccepted\"\r\n (change)=\"onFileSelected($event)\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsCatalogue\">\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from')?.touched && form.get('from')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">Category</mat-label>\r\n\r\n <mat-select formControlName=\"category\" placeholder=\"Select category\">\r\n <mat-option *ngFor=\"let option of categoryOption\" [value]=\"option.value\">\r\n {{ option.label }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.category\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('category')?.touched &&\r\n form.get('category')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">Catalog</mat-label>\r\n\r\n <mat-select formControlName=\"catalogue\" placeholder=\"Select catalog\">\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.catalogue\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('catalogue')?.touched &&\r\n form.get('catalogue')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"form.get('category')?.value === 'product'\"\r\n style=\"padding: 8px; border-radius: 8px; border: 1px solid #6177c4\"\r\n >\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Product</mat-label>\r\n\r\n <mat-select formControlName=\"product\" placeholder=\"Select product\">\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.product\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('product')?.touched &&\r\n form.get('product')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label>Body</mat-label>\r\n\r\n <input\r\n matInput\r\n type=\"text\"\r\n maxlength=\"100\"\r\n formControlName=\"body\"\r\n placeholder=\"Enter body\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"getIsUtility\">\r\n <div style=\"display: grid; gap: 0.5rem\">\r\n <mat-label class=\"asterix--after\">Template</mat-label>\r\n <mat-radio-group\r\n style=\"display: flex; gap: 0.5rem; flex-wrap: wrap\"\r\n formControlName=\"isUseExistingTemplate\"\r\n (change)=\"handleChangeTemplate($event.value)\"\r\n >\r\n <mat-radio-button\r\n [value]=\"option.value\"\r\n *ngFor=\"let option of templates\"\r\n color=\"primary\"\r\n >\r\n {{ option.label }}\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field\r\n appearance=\"outline\"\r\n floatLabel=\"always\"\r\n class=\"w-100\"\r\n style=\"margin-bottom: 20\"\r\n >\r\n <mat-label class=\"asterix--after\">From</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"from\"\r\n placeholder=\"Select from\"\r\n [complete]=\"isHaveNextAccountOption === false\"\r\n [compareWith]=\"accountSelectedDisplay\"\r\n (infiniteScroll)=\"getNextAccountBatch()\"\r\n (selectionChange)=\"handleChangeFrom($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('from').value?.name\"\r\n (searchRes)=\"updateSearchAccount($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of accountOption\" [value]=\"option\">\r\n {{ option.name + ' (' + option.accountNo + ')' }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingAccountOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.from\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"form.get('from')?.touched && form.get('from')?.hasError(validation.type)\"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <ng-container *ngIf=\"!form.get('isUseExistingTemplate')?.value; else existingTmpl\">\r\n <div\r\n role=\"alert\"\r\n class=\"alert alert-warning d-flex align-items-center\"\r\n style=\"margin-top: 8px; border: 1px solid rgb(243, 124, 44)\"\r\n >\r\n <mat-icon style=\"margin-right: 10px !important\">error_outline</mat-icon>\r\n <div>\r\n Direct Send access restricted for 30 days due to continued misuse. Final warning\r\n before permanent revocation.\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\">\r\n <mat-label class=\"asterix--after\">Body</mat-label>\r\n\r\n <textarea\r\n matInput\r\n rows=\"6\"\r\n cols=\"50\"\r\n cdkTextareaAutosize\r\n cdkAutosizeMinRows=\"2\"\r\n cdkAutosizeMaxRows=\"15\"\r\n formControlName=\"text\"\r\n placeholder=\"Enter text\"\r\n #autosize=\"cdkTextareaAutosize\"\r\n ></textarea>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.text\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('text').touched && form.get('text').hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <app-input\r\n type=\"numeric\"\r\n formControlName=\"ttl\"\r\n label=\"TTL\"\r\n placeholder=\"Enter ttl\"\r\n [trimLeadingZeros]=\"true\"\r\n ></app-input>\r\n </div>\r\n\r\n <div *ngIf=\"!isReadOnlyMode\">\r\n <mat-checkbox formControlName=\"isNeedSave\">\r\n Save this message as future template\r\n </mat-checkbox>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-template #existingTmpl>\r\n <div\r\n role=\"alert\"\r\n class=\"alert alert-warning d-flex align-items-center\"\r\n style=\"margin-top: 8px; border: 1px solid rgb(243, 124, 44)\"\r\n >\r\n <mat-icon style=\"margin-right: 10px !important\">error_outline</mat-icon>\r\n <div>\r\n Direct Send access restricted for 30 days due to continued misuse. Final warning\r\n before permanent revocation.\r\n </div>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <mat-form-field appearance=\"outline\" floatLabel=\"always\" class=\"w-100\">\r\n <mat-label class=\"asterix--after\">Template</mat-label>\r\n\r\n <mat-select\r\n matSelectInfiniteScroll\r\n formControlName=\"template\"\r\n placeholder=\"Select template\"\r\n [complete]=\"isHaveNextTemplateOption === false\"\r\n [compareWith]=\"templateSelectedDisplay\"\r\n (infiniteScroll)=\"getNextTemplateBatch()\"\r\n (selectionChange)=\"updateTemplate($event.value)\"\r\n >\r\n <div style=\"margin: 20px\">\r\n <lib-search\r\n [placeholder]=\"'Search'\"\r\n [currentValue]=\"form?.get('template').value?.name\"\r\n (searchRes)=\"updateSearch($event)\"\r\n ></lib-search>\r\n </div>\r\n\r\n <mat-option *ngFor=\"let option of templateOption\" [value]=\"option\">\r\n {{ option.name }}\r\n </mat-option>\r\n <mat-option *ngIf=\"isLoadingTemplateOption\">Loading...</mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n\r\n <mat-error align=\"end\" *ngFor=\"let validation of validationMessages.template\">\r\n <p\r\n class=\"font-12px mb-0\"\r\n *ngIf=\"\r\n form.get('template')?.touched &&\r\n form.get('template')?.hasError(validation.type)\r\n \"\r\n >\r\n {{ validation.message }}\r\n </p>\r\n </mat-error>\r\n </div>\r\n\r\n <div class=\"form-group\">\r\n <app-input\r\n type=\"numeric\"\r\n formControlName=\"ttl\"\r\n label=\"TTL\"\r\n placeholder=\"Enter ttl\"\r\n [trimLeadingZeros]=\"true\"\r\n ></app-input>\r\n </div>\r\n </ng-template>\r\n </ng-container>\r\n</form>\r\n",
|
|
4723
4919
|
styles: [".asterix--after:after{content:\"*\";color:red}"]
|
|
4724
4920
|
})
|
|
4725
4921
|
], GeneralInformationWAComponent);
|
|
@@ -5877,6 +6073,7 @@
|
|
|
5877
6073
|
slideToggle.MatSlideToggleModule,
|
|
5878
6074
|
dragDrop.DragDropModule,
|
|
5879
6075
|
CampaignIndexModule,
|
|
6076
|
+
InputNumericModule,
|
|
5880
6077
|
],
|
|
5881
6078
|
exports: [CampaignManagementComponent, SummaryComponent],
|
|
5882
6079
|
entryComponents: [PendingApprovalDialogViewComponent],
|
|
@@ -5953,10 +6150,12 @@
|
|
|
5953
6150
|
exports.ɵr = CampaignIndexComponent;
|
|
5954
6151
|
exports.ɵs = ApiAdapterServiceService;
|
|
5955
6152
|
exports.ɵt = MatSelectInfiniteScrollDirective;
|
|
5956
|
-
exports.ɵu =
|
|
5957
|
-
exports.ɵv =
|
|
5958
|
-
exports.ɵw =
|
|
5959
|
-
exports.ɵx =
|
|
6153
|
+
exports.ɵu = InputNumericModule;
|
|
6154
|
+
exports.ɵv = InputNumericComponent;
|
|
6155
|
+
exports.ɵw = CustomPaginator;
|
|
6156
|
+
exports.ɵx = ConfirmationComponent;
|
|
6157
|
+
exports.ɵy = ConfirmationModel;
|
|
6158
|
+
exports.ɵz = SharedServicesService;
|
|
5960
6159
|
|
|
5961
6160
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5962
6161
|
|