@adlfe/campaign-management-library 2.11.3 → 2.11.4

package/bundles/adlfe-campaign-management-library.umd.min.js

@@ -12,5 +12,5 @@
     LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
     OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
     PERFORMANCE OF THIS SOFTWARE.
-    ***************************************************************************** */var _=function(t,e){return(_=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function G(t,e){function n(){this.constructor=t}_(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var $=function(){return($=Object.assign||function(t){for(var e,n=1,a=arguments.length;n<a;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};function J(t,e,n,a){var r,i=arguments.length,o=i<3?e:null===a?a=Object.getOwnPropertyDescriptor(e,n):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,e,n,a);else for(var l=t.length-1;l>=0;l--)(r=t[l])&&(o=(i<3?r(o):i>3?r(e,n,o):r(e,n))||o);return i>3&&o&&Object.defineProperty(e,n,o),o}function Y(t){var e="function"==typeof Symbol&&Symbol.iterator,n=e&&t[e],a=0;if(n)return n.call(t);if(t&&"number"==typeof t.length)return{next:function(){return t&&a>=t.length&&(t=void 0),{value:t&&t[a++],done:!t}}};throw new TypeError(e?"Object is not iterable.":"Symbol.iterator is not defined.")}function X(t,e){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var a,r,i=n.call(t),o=[];try{for(;(void 0===e||e-- >0)&&!(a=i.next()).done;)o.push(a.value)}catch(t){r={error:t}}finally{try{a&&!a.done&&(n=i.return)&&n.call(i)}finally{if(r)throw r.error}}return o}function Z(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(X(arguments[e]));return t}var K,Q=function(){function t(){}return t=J([e.Component({selector:"lib-adl-campaign-management-library-internal",template:"\n\t\t<p>\n\t\t\t<lib-campaign-management></lib-campaign-management>\n\t\t</p>\n\t"})],t)}(),tt=function(){function t(){this.debounceSubject=new F.Subject,this.searchRes=new e.EventEmitter}return t.prototype.ngOnInit=function(){var t,e=this;this.form=new m.FormControl(null!=(t=this.currentValue)?t:""),this.debounceSubject.pipe(E.debounceTime(500)).subscribe((function(t){e.searchRes.emit(t.toLowerCase())}))},t.prototype.searchResult=function(t){this.debounceSubject.next(t.target.value)},t.prototype.clearInput=function(){this.form.setValue(""),this.searchRes.emit(this.form.value)},J([e.Output()],t.prototype,"searchRes",void 0),J([e.Input()],t.prototype,"placeholder",void 0),J([e.Input()],t.prototype,"currentValue",void 0),t=J([e.Component({selector:"lib-search",template:'<div class="search">\r\n\t<mat-form-field appearance="outline"\r\n\t\tfloatLabel="never"\r\n\t\tclass="search">\r\n\t\t<mat-icon matPrefix\r\n\t\t\tclass="mr-2">\r\n\t\t\tsearch\r\n\t\t</mat-icon>\r\n\r\n\t\t<input matInput\r\n\t\t\tautocomplete="off"\r\n\t\t\t[formControl]="form"\r\n\t\t\t[placeholder]="placeholder"\r\n\t\t\t(keyup)="searchResult($event)">\r\n\r\n\t\t<button *ngIf="form.value"\r\n\t\t\tmat-button\r\n\t\t\tmatSuffix\r\n\t\t\tmat-icon-button\r\n\t\t\taria-label="Clear"\r\n\t\t\t(click)="clearInput()">\r\n\t\t\t<mat-icon>close</mat-icon>\r\n\t\t</button>\r\n\t</mat-form-field>\r\n</div>\r\n',styles:["::ng-deep mat-form-field.search .mat-form-field-infix{padding:.64em 0}"]})],t)}(),et=function(){function t(){}return t=J([e.NgModule({declarations:[tt],imports:[a.CommonModule,m.FormsModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,u.MatButtonModule,x.MatIconModule],exports:[tt]})],t)}();!function(t){t[t.Dashboard=1]="Dashboard",t[t.CampaignIndex=2]="CampaignIndex",t[t.CreateCampaign=3]="CreateCampaign",t[t.NewCampaign=4]="NewCampaign",t[t.UpdateNumberBases=5]="UpdateNumberBases"}(K||(K={}));var nt,at,rt,it=function(){function t(){this.currentView=K.CampaignIndex,this.currentViews=K}return t.prototype.onChangeMainArea=function(t){this.currentView=t},t=J([e.Component({selector:"lib-campaign-management",template:'<lib-dashboard *ngIf="currentView === currentViews.Dashboard"\r\n\t(currentView)="onChangeMainArea($event)"></lib-dashboard>\r\n\r\n<lib-campaign-index *ngIf="currentView === currentViews.CampaignIndex"\r\n\t(currentView)="onChangeMainArea($event)">\r\n</lib-campaign-index>\r\n\r\n<lib-new-campaign *ngIf="currentView === currentViews.NewCampaign"\r\n\t(currentView)="onChangeMainArea($event)">\r\n</lib-new-campaign>\r\n'})],t)}(),ot=function(){function t(t,n){this.matSelect=t,this.ngZone=n,this.threshold="15%",this.debounceTime=150,this.infiniteScroll=new e.EventEmitter,this.thrPx=0,this.thrPc=0,this.singleOptionHeight=T.SELECT_ITEM_HEIGHT_EM,this.destroyed$=new F.Subject}return t.prototype.ngOnInit=function(){this.evaluateThreshold()},t.prototype.ngAfterViewInit=function(){var t=this;this.matSelect.openedChange.pipe(E.takeUntil(this.destroyed$)).subscribe((function(e){e&&(t.panel=t.matSelect.panel.nativeElement,t.singleOptionHeight=t.getSelectItemHeightPx(),t.registerScrollListener())}))},t.prototype.ngOnDestroy=function(){this.destroyed$.next(!0),this.destroyed$.complete()},t.prototype.evaluateThreshold=function(){this.threshold.lastIndexOf("%")>-1?(this.thrPx=0,this.thrPc=parseFloat(this.threshold)/100):(this.thrPx=parseFloat(this.threshold),this.thrPc=0)},t.prototype.registerScrollListener=function(){var t=this;F.fromEvent(this.panel,"scroll").pipe(E.takeUntil(this.destroyed$),E.debounceTime(this.debounceTime),E.tap((function(e){t.handleScrollEvent(e)}))).subscribe()},t.prototype.handleScrollEvent=function(t){var e=this;this.ngZone.runOutsideAngular((function(){if(!e.complete){var n=e.matSelect.options.length,a=e.singleOptionHeight*n,r=0!==e.thrPc?a*e.thrPc:e.thrPx;e.panel.clientHeight+t.target.scrollTop+r>=a&&e.ngZone.run((function(){return e.infiniteScroll.emit()}))}}))},t.prototype.getSelectItemHeightPx=function(){return parseFloat(getComputedStyle(this.panel).fontSize)*T.SELECT_ITEM_HEIGHT_EM},t.ctorParameters=function(){return[{type:T.MatSelect},{type:e.NgZone}]},J([e.Input()],t.prototype,"threshold",void 0),J([e.Input()],t.prototype,"debounceTime",void 0),J([e.Input()],t.prototype,"complete",void 0),J([e.Output()],t.prototype,"infiniteScroll",void 0),t=J([e.Directive({selector:"[matSelectInfiniteScroll]"})],t)}(),lt=(function(){function t(){}t.prototype.clone=function(t){return t.country&&(this.country=t.country),t.recomended&&(this.recomended=t.recomended),t.type&&(this.type=t.type),t.setupFeeRateCard&&(this.setupFeeRateCard=t.setupFeeRateCard),t.setupFee&&("true"===t.setupFeeRateCard?this.setupFee=null:this.setupFee=t.setupFee),t.ovrUsgConversationRateCard&&(this.ovrUsgConversationRateCard=t.ovrUsgConversationRateCard),t.costPerCustomer&&(this.costPerCustomer=t.costPerCustomer),t.costPerBusiness&&(this.costPerBusiness=t.costPerBusiness),t.ovrUsgNotficationRateCard&&(this.ovrUsgNotficationRateCard=t.ovrUsgNotficationRateCard),t.ovrUsgConversationCost&&(this.ovrUsgConversationCost=t.ovrUsgConversationCost),t.ovrUsgNotficationCost&&("true"===t.ovrUsgNotficationRateCard?this.ovrUsgNotficationCost=null:this.ovrUsgNotficationCost=t.ovrUsgNotficationCost),t.customPackage&&(this.customPackage=t.customPackage),t.currency&&(this.currency=t.currency),t.name&&(this.name=t.name),t.monthlyRental&&(this.monthlyRental=t.monthlyRental),t.conversationMsg&&(this.conversationMsg=t.conversationMsg),t.businessMsg&&(this.businessMsg=t.businessMsg),t.contacts&&(this.contacts=t.contacts),t.isMultipleFlow&&(this.isMultipleFlow=t.isMultipleFlow),t.tps&&(this.tps=t.tps),t.multichatLiveAgent&&(this.multichatLiveAgent=t.multichatLiveAgent),t.multichatLiveSupervisor&&(this.multichatLiveSupervisor=t.multichatLiveSupervisor),t.numberOfFlow&&(this.numberOfFlow=t.numberOfFlow),t.waOfficialAccount&&(this.waOfficialAccount=t.waOfficialAccount),t.dashboardToSendMessage&&(this.dashboardToSendMessage=t.dashboardToSendMessage),t.reportAdminPanel&&(this.reportAdminPanel=t.reportAdminPanel),t.trainingSupport&&(this.trainingSupport=t.trainingSupport),t.isMultiple&&(this.isMultiple=t.isMultiple),t.checklistWa&&(this.checklistWa=t.checklistWa),t.checklistLine&&(this.checklistLine=t.checklistLine),t.checklistTele&&(this.checklistTele=t.checklistTele),t.specifyPackage&&(this.specifyPackage=t.specifyPackage),t.customDevelopment&&(this.customDevelopment=t.customDevelopment),t.oneUsageCostConversation&&(this.oneUsageCostConversation=t.oneUsageCostConversation),t.signupOrSetup&&(this.signupOrSetup=t.signupOrSetup),t.checklistAdm&&(this.checklistAdm=t.checklistAdm),t.checklistUser&&(this.checklistUser=t.checklistUser),t.checklistClient&&(this.checklistClient=t.checklistClient),t.checklistChatAgentAdmin&&(this.checklistChatAgentAdmin=t.checklistChatAgentAdmin),t.checklistChatAgentUser&&(this.checklistChatAgentUser=t.checklistChatAgentUser),this}}(),function(){}),st=(function(){function t(){this.pageSize=3,this.pageNo=1}t.prototype.convert=function(){return{pageSize:this.pageSize,pageNo:this.pageNo}}}(),function(){function t(){this.pageSize=10,this.pageNo=1}return t.prototype.convert=function(){return{pageSize:this.pageSize,pageNo:this.pageNo}},t}()),dt=(function(t){function e(){return t.call(this)||this}G(e,t),e.prototype.convert=function(){return{filter:this.filter,platform:this.platform,clientId:this.clientId,pageNo:String(this.pageNo),pageSize:String(this.pageSize)}}}(st),function(){function t(){}t.prototype.convert=function(t){return t.category&&(this.category=t.category),t.code&&(this.code=t.code),t.values&&(this.values=t.values),t.param1&&(this.param1=t.param1),t.param2&&(this.param2=t.param2),t.ìcon&&(this.ìcon=t.ìcon),this}}(),function(){function t(){this.channels=[]}t.prototype.clone=function(t){return t.name&&(this.name=t.name),t.type&&(this.type=t.type),t.recomended&&(this.recomended=t.recomended),t.setupFeeRateCard&&(this.setupFeeRateCard=t.setupFeeRateCard),t.countryCode&&(this.countryCode=t.countryCode),t.costPerCustomer&&(this.costPerCustomer=t.costPerCustomer),t.costPerBusiness&&(this.costPerBusiness=t.costPerBusiness),t.customPackage&&(this.customPackage=t.customPackage),t.channels&&(this.channels=[t.channels]),t.customDevelopment&&(this.customDevelopment=t.customDevelopment),t.maxAgent&&(this.maxAgent=t.maxAgent),t.maxContact&&(this.maxContact=t.maxContact),t.maxFlow&&(this.maxFlow=t.maxFlow),t.maxSupervisor&&(this.maxSupervisor=t.maxSupervisor),t.monthlyConversation&&(this.monthlyConversation=t.monthlyConversation),t.monthlyNotification&&(this.monthlyNotification=t.monthlyNotification),t.monthlyRental&&(this.monthlyRental=t.monthlyRental),t.monthlyRentalRateCard&&(this.monthlyRentalRateCard=t.monthlyRentalRateCard),t.ovrUsgConversation&&(this.ovrUsgConversation=t.ovrUsgConversation),t.ovrUsgConversationCost&&(this.ovrUsgConversationCost=t.ovrUsgConversationCost),t.ovrUsgConversationRateCard&&(this.ovrUsgConversationRateCard=t.ovrUsgConversationRateCard),t.ovrUsgNotification&&(this.ovrUsgNotification=t.ovrUsgNotification),t.ovrUsgNotificationCost&&(this.ovrUsgNotificationCost=t.ovrUsgNotificationCost),t.ovrUsgNotificationRateCard&&(this.ovrUsgNotificationRateCard=t.ovrUsgNotificationRateCard),t.reports&&(this.reports=t.reports),t.roles&&(this.roles=t.roles),t.sendMsgDashboard&&(this.sendMsgDashboard=t.sendMsgDashboard),t.setupFee&&(this.setupFee=t.setupFee),t.tps&&(this.tps=t.tps),t.training&&(this.training=t.training),t.waOfficialAcc&&(this.waOfficialAcc=t.waOfficialAcc),this},t.prototype.convert=function(){return{name:this.name,channels:this.channels,customDevelopment:this.customDevelopment,maxAgent:+this.maxAgent,maxContact:+this.maxContact,maxFlow:+this.maxFlow,maxSupervisor:+this.maxSupervisor,monthlyConversation:+this.monthlyConversation,monthlyNotification:+this.monthlyNotification,monthlyRental:+this.monthlyRental,monthlyRentalRateCard:this.monthlyRentalRateCard,ovrUsgConversation:this.ovrUsgConversation,ovrUsgConversationCost:+this.ovrUsgConversationCost,ovrUsgConversationRateCard:this.ovrUsgConversationRateCard,ovrUsgNotification:this.ovrUsgNotification,ovrUsgNotificationCost:+this.ovrUsgNotificationCost,ovrUsgNotificationRateCard:this.ovrUsgNotificationRateCard,reports:this.reports,roles:this.roles,sendMsgDashboard:this.sendMsgDashboard,setupFee:+this.setupFee,tps:+this.tps,training:this.training,waOfficialAcc:this.waOfficialAcc,customPackage:this.customPackage,countryCode:this.countryCode,costPerBusiness:this.costPerBusiness,costPerCustomer:this.costPerCustomer,setupFeeRateCard:this.setupFeeRateCard,type:this.type,recomended:this.recomended}}}(),function(){function t(){}t.prototype.convert=function(t){return t.status&&(this.status=t.status),t.errorCode&&(this.errorCode=t.errorCode),t.message&&(this.message=t.message),t.data&&(this.data=t.data),t.totalRecord>=0&&(this.totalRecord=t.totalRecord),this}}(),location.origin),mt=dt.includes("dashboard.neuapix.com")?"https://api.neuapix.com":dt.includes("dashboard-staging")?"https://api-staging.neuapix.com":dt.includes("dashboard-qa")?"https://apibsp-qa.adlsandbox.net":(dt.includes("demo-dev"),"https://apibsp-dev.adlsandbox.net"),ct=function(){function t(t){this.httpClient=t,this.queryCount=0}return t.prototype.executeApiRequest=function(t,e,n,a){var i,o,l,s=this;void 0===a&&(a=!1);var d,m,c=e,p=new FormData;null===(i=t)||void 0===i||i.filter((function(t){return"header"!==t.in})).forEach((function(e){if(!(m=t.find((function(t){return t.name===e.name})))&&e.required&&"header"!==e.in)window.alert('Parameter "'+e.name+'" is required!, Try again with "'+e.name+'"');else if(m||e.required)switch(e.in){case"body":d=m.value;break;case"path":c=c.replace("{"+m.name+"}",m.value);break;case"query":c=s.setQuery(m.name,m.value,c);break;case"formData":p=s.setFormData(m,p)}else;m=void 0})),this.queryCount=0,c=""+mt+c;var u=$({},(null===(l=null===(o=t)||void 0===o?void 0:o[0])||void 0===l?void 0:l.withoutKeyData)?d:{data:d}),g=(new r.HttpHeaders).set("Authorization","Bearer "+localStorage.getItem("telin.accessToken")).set("Access-Control-Allow-Origin","*");return this.httpClient.request(n,c,{body:d?u:p,responseType:a?"blob":"json",headers:g}).pipe(U.catchError((function(t){return t.error instanceof ErrorEvent?F.of({error:{title:"Network error!",detail:t.message,source:t.statusText,status:t.status.toString()},meta:{code:t.status,message:t.message}}):F.of(t.error)})))},t.prototype.uploadFileToS3=function(t,e){return this.httpClient.put(t,e,{headers:{"Content-Type":e.type}})},t.prototype.setQuery=function(t,e,n){return n=0===this.queryCount?n+"?"+t+"="+e:n+"&"+t+"="+e,this.queryCount++,n},t.prototype.setFormData=function(t,e){if("array"===t.type)for(var n=0;t.value.length>n;n++)e.append(t.name,t.value[n],t.value[n].name);else e.append(t.name,t.value?t.value:null);return e},t.ctorParameters=function(){return[{type:r.HttpClient}]},t.ɵprov=e.ɵɵdefineInjectable({factory:function(){return new t(e.ɵɵinject(r.HttpClient))},token:t,providedIn:"root"}),t=J([e.Injectable({providedIn:"root"})],t)}(),pt=["Broadcast ID","Business Name","Broadcast Name","Template Name","Channel","Status","Number Count","On Progress","Sent","Delivered","Read","Failed","Repeat Count","Start Date","End Date","Action"],ut=["id","clientName","name","templateName","platform","statusName","numberCount","queuedCount","sentCount","delivCount","readCount","failedCount","repeatCount","startTime","endTime","action"],gt=(function(){function t(){}t.prototype.convert=function(t){return t.campaignID&&(this.campaignID=t.campaignID),t.businessName&&(this.businessName=t.businessName),t.campaignName&&(this.campaignName=t.campaignName),t.medium&&(this.medium=t.medium),t.status&&(this.status=t.status),t.numberCount&&(this.numberCount=t.numberCount),t.deilveredCount&&(this.deilveredCount=t.deilveredCount),t.seenCount&&(this.seenCount=t.seenCount),t.responseCount&&(this.responseCount=t.responseCount),t.estimatedCost&&(this.estimatedCost=t.estimatedCost),t.actualCost&&(this.actualCost=t.actualCost),t.startDate&&(this.startDate=t.startDate),t.endDate&&(this.endDate=t.endDate),t.id&&(this.id=t.id),this}}(),function(){function t(){this.columns=[],this.dataSource=new V.MatTableDataSource,this.labels=[],this.page=1,this.pageSize=10,this.totalData=0}return t.prototype.getNumber=function(t,e){return(this.page-1)*e+t},t.prototype.getPageIndex=function(){return this.page-1},t.prototype.isEmpty=function(){return 0===this.totalData},t.prototype.setPage=function(t){this.page=t},t.prototype.setPageSize=function(t){this.pageSize=t},t.prototype.resetPage=function(){this.page=1},t.prototype.setNextPage=function(t){var e,n,a;if(t||1!==this.page){this.totalData=1===this.page?2*this.pageSize:this.pageSize*(this.page+1);var r=this.pageSize-(null===(a=this.dataSource.data)||void 0===a?void 0:a.length);0!==r&&(this.totalData-=r),t||(this.totalData-=this.pageSize)}else this.totalData=null!=(n=null===(e=this.dataSource.data)||void 0===e?void 0:e.length)?n:0},t}()),ft=function(){function t(t,n){this.datePipe=t,this.apiAdapterService=n,this.currentView=new e.EventEmitter,this.currentViews=K,this.subscribers=[]}return t.prototype.ngOnInit=function(){this.campaignParam=new st,this.initTable(),this.campaignCountService(),this.getCampaignList(),localStorage.removeItem("telin.campaign")},t.prototype.initTable=function(){this.table=new gt,this.table.labels=pt,this.table.columns=ut},t.prototype.campaignCountService=function(){var t=this,e=this.apiAdapterService.executeApiRequest([],"/campaign/totals","GET").subscribe((function(e){var n;t.campaignTotal=null===(n=e)||void 0===n?void 0:n.data}));this.subscribers.push(e)},t.prototype.getCampaignList=function(t){var e,n,a,r,i,o,l,s=this;void 0===t&&(t="");var d=[this.initParam("pageNo",this.campaignParam.pageNo,"number"),this.initParam("rowPerPage",this.campaignParam.pageSize,"number"),this.initParam("filter",t,"string")];(null===(e=this.filterValue)||void 0===e?void 0:e.businessName)&&d.push(this.initParam("clientId",this.filterValue.businessName,"string")),(null===(n=this.filterValue)||void 0===n?void 0:n.medium)&&d.push(this.initParam("channel",this.filterValue.medium,"string")),(null===(a=this.filterValue)||void 0===a?void 0:a.templateName)&&d.push(this.initParam("templateName",null===(r=this.filterValue.templateName)||void 0===r?void 0:r.name,"string")),(null===(i=this.filterValue)||void 0===i?void 0:i.status)&&d.push(this.initParam("status",this.filterValue.status,"string")),(null===(o=this.filterValue)||void 0===o?void 0:o.startDate)&&d.push(this.initParam("startDate",this.datePipe.transform(this.filterValue.startDate,"yyyy-MM-dd"),"string")),(null===(l=this.filterValue)||void 0===l?void 0:l.endDate)&&d.push(this.initParam("endDate",this.datePipe.transform(this.filterValue.endDate,"yyyy-MM-dd"),"string"));var m=this.apiAdapterService.executeApiRequest(d,"/campaign","GET").subscribe((function(t){s.table.dataSource.data=t.data,s.table.setNextPage(t.haveNext)}));this.subscribers.push(m)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.updatePage=function(t){t.pageSize?(this.table.totalData=t.pageSize,this.table.setPageSize(t.pageSize),this.table.resetPage()):this.table.setPage(t),this.campaignParam.pageNo=this.table.page,this.campaignParam.pageSize=this.table.pageSize,this.getCampaignList()},t.prototype.updateFilter=function(t){this.table.resetPage(),this.campaignParam.pageNo=this.table.page,this.campaignParam.pageSize=this.table.pageSize,this.filterValue=t,this.getCampaignList()},t.prototype.updateSearch=function(t){this.table.resetPage(),this.campaignParam.pageNo=this.table.page,this.getCampaignList(t)},t.prototype.addCampaign=function(){localStorage.removeItem("telin.campaign"),this.changeCurrentView(this.currentViews.NewCampaign)},t.prototype.changeCurrentView=function(t){this.currentView.emit(t)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:a.DatePipe},{type:ct}]},J([e.Output()],t.prototype,"currentView",void 0),t=J([e.Component({selector:"lib-campaign-index",template:'<div class="billing-list p-4">\r\n    <div class="row mb-3">\r\n        <div class="col-md-8">\r\n            <p class="title mb-1">Broadcast Messaging</p>\r\n\r\n            <mat-chip-list>\r\n                <p class="font-subtitle">Manage Your Broadcast Messages Here.</p>\r\n                <div>\r\n                    <mat-chip class="example-box-total" cdkDrag>\r\n                        {{ campaignTotal?.total }} Total Broadcasts\r\n                    </mat-chip>\r\n                    <mat-chip class="example-box-live" cdkDrag>\r\n                        {{ campaignTotal?.live }} Scheduled Broadcasts\r\n                    </mat-chip>\r\n                    <mat-chip class="example-box-pending" cdkDrag>\r\n                        {{ campaignTotal?.pending }} Pending Approval\r\n                    </mat-chip>\r\n                </div>\r\n            </mat-chip-list>\r\n        </div>\r\n        <div class="col-md-4 mt-auto text-end">\r\n            \x3c!-- <button mat-flat-button\r\n\t\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t\tstyle="height: 46px; margin-right:20px"\r\n\t\t\t\t(click)="changeCurrentView(currentViews.Dashboard)">\r\n\t\t\t\tGo to Dashboard\r\n\t\t\t</button> --\x3e\r\n\r\n            <button\r\n                mat-flat-button\r\n                color="primary-telin-blue2"\r\n                style="height: 46px"\r\n                (click)="addCampaign()"\r\n            >\r\n                <mat-icon class="icon-menu">add</mat-icon>\r\n                Add Broadcast\r\n            </button>\r\n        </div>\r\n\r\n        <div class="col-12 mt-3">\r\n            <div style="background-color: #ffffff; border-radius: 8px">\r\n                <section class="wrapper__action w-100 p-3">\r\n                    <div class="display__left mb-xs">\r\n                        <lib-search\r\n                            [placeholder]="\'Search\'"\r\n                            (searchRes)="updateSearch($event)"\r\n                        ></lib-search>\r\n\r\n                        <div\r\n                            class="alert alert-primary d-flex align-items-center ml-3"\r\n                            role="alert"\r\n                        >\r\n                            <img\r\n                                src="../../../../assets/svg/info-blue.svg"\r\n                                style="width: 24px; height: auto; cursor: pointer"\r\n                                [matTooltip]="\r\n                                    \'The 5 minutes is set to give time for summarizing and consolidating all the data properly\'\r\n                                "\r\n                            />\r\n\r\n                            <div class="text-body font-13px ml-2">\r\n                                The page can be refreshed every 5 minutes to view the updated data\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n\r\n                    <div class="display__right float__right__xs">\r\n                        <div\r\n                            ngbDropdown\r\n                            container="body"\r\n                            class="filter__body"\r\n                            placement="bottom-right"\r\n                            [autoClose]="false"\r\n                            #filterDropdown="ngbDropdown"\r\n                        >\r\n                            <button\r\n                                ngbDropdownToggle\r\n                                mat-stroked-button\r\n                                color="primary-telin1"\r\n                                style="height: 46px"\r\n                            >\r\n                                <em class="material-icons md-18 pointer pr-1">filter_list</em>\r\n                                Filter\r\n                            </button>\r\n\r\n                            <div\r\n                                ngbDropdownMenu\r\n                                id="filter-drop"\r\n                                class="dropdown-menu filter__dropdown"\r\n                            >\r\n                                <lib-filter-in-list-of-campaign\r\n                                    *ngIf="filterDropdown.isOpen()"\r\n                                    class="filter-content"\r\n                                    style="z-index: 900 !important"\r\n                                    [filterValue]="filterValue"\r\n                                    (onChangeFilter)="updateFilter($event)"\r\n                                    (closeDropdown)="filterDropdown.close()"\r\n                                >\r\n                                </lib-filter-in-list-of-campaign>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </section>\r\n\r\n                <lib-viewing-list-of-campaign-table\r\n                    [table]="table"\r\n                    (currentView)="changeCurrentView($event)"\r\n                    (updateTable)="getCampaignList()"\r\n                >\r\n                </lib-viewing-list-of-campaign-table>\r\n\r\n                <div class="pagination-customize row">\r\n                    <div class="col-md-7 col-12 my-auto">\r\n                        <ngb-pagination\r\n                            [collectionSize]="table.totalData"\r\n                            [(page)]="table.page"\r\n                            [pageSize]="table.pageSize"\r\n                            [maxSize]="5"\r\n                            [rotate]="true"\r\n                            (pageChange)="updatePage($event)"\r\n                        ></ngb-pagination>\r\n                    </div>\r\n\r\n                    <div class="col-md-5 col-12">\r\n                        <mat-paginator\r\n                            [length]="table.totalData"\r\n                            [pageSize]="table.pageSize"\r\n                            [pageIndex]="table.getPageIndex()"\r\n                            [pageSizeOptions]="[10, 25, 50, 100, 250]"\r\n                            (page)="updatePage($event)"\r\n                        >\r\n                        </mat-paginator>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n',styles:[".billing-list .title{font-size:24px;font-family:Poppins;font-weight:700}.billing-list .sub--title{font-family:Poppins;font-weight:700}.wrapper{display:inline;width:1000px}.font-softer-black mb-0{padding-left:20px}.example-box-total{color:#659cff!important;border:1px solid #659cff;background-color:#e0ebff}.example-box-live{color:#2bca3b!important;border:1px solid #2bca3b;background-color:#e6fde9}.example-box-pending{color:#fb9334!important;border:1px solid #fb9334;background-color:#ffe8d2}::ng-deep .mat-tab-list .mat-tab-labels .mat-tab-label-active{color:#6177c4;font-weight:700}::ng-deep .mat-chip.mat-standard-chip:after{background-color:inherit!important}::ng-deep .mat-tab-group.tabs-billing{width:100%;margin-top:30px}::ng-deep .mat-tab-group.tabs-billing .mat-tab-header{background-color:#fff;border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:rgba(0,0,0,.1) 0 4px 12px}::ng-deep .mat-tab-group.tabs-billing .mat-tab-body-wrapper{min-height:500px;background-color:#fff;border-bottom-left-radius:8px;border-bottom-right-radius:8px;box-shadow:rgba(0,0,0,.1) 0 4px 12px}::ng-deep .mat-paginator.campaign-paginator .mat-paginator-container{align-items:normal}::ng-deep .mat-paginator.campaign-paginator .mat-tab-body{background-color:#fff}::ng-deep .mat-paginator.campaign-paginator .mat-form-field-underline{bottom:0}"]})],t)}(),vt=[{icon:"icon_wa",inputSvgIcon:"icon-wa-gray",image:"whatsapp.png",label:"WhatsApp",value:"WA"},{icon:"menu_sms",inputSvgIcon:"icon-sms-gray",image:"sms.png",label:"SMS",value:"SMS"},{icon:"icon_email",inputSvgIcon:"icon-email-gray",image:"email-contact.png",label:"Email",value:"EMAIL"},{icon:"icon_line",inputSvgIcon:"icon-line-gray",image:"line.png",label:"Line",value:"LINE"}],ht=[{name:"Text",code:"TEXT"},{name:"Media",code:"MEDIA"},{name:"Template",code:"TEMPLATE"},{name:"Text - Utility",code:"utility"}],bt=[{name:"Text",code:"HTML"},{name:"Template",code:"TEMPLATE"}],yt=[{name:"Text",code:"TEXT"},{name:"Template",code:"TEMPLATE"}],xt=[{name:"Image",code:"IMAGE"},{name:"Video",code:"VIDEO"},{name:"Document",code:"DOCUMENT"}],St=[{title:"Total Campaigns",arrow:"../../../../assets/svg/icon-down-arrow.svg",value:0,date:"",icon:"../../../../assets/svg/icon-total-campaign.svg",dateclass:"redpercent"},{title:"Live Campaigns",arrow:"../../../../assets/svg/icon-down-arrow.svg",value:0,date:"",icon:"../../../../assets/svg/icon-use-campaign.svg",dateclass:"redpercent"},{title:"Pending Approval",arrow:"../../../../assets/svg/icon-down-arrow.svg",value:0,date:"",icon:"../../../../assets/svg/icon-pending-approval-campaign.svg",dateclass:"redpercent"}],wt={legend:{icon:"circle",orient:"horizontal",x:"center",y:"bottom"},tooltip:{},dataset:{source:[["","WA Text","WA Template","WA Media","Product Catalog"]]},xAxis:{type:"category"},yAxis:{},series:[{type:"bar",color:"#E666DA"},{type:"bar",color:"#EB7215"},{type:"bar",color:"#F3B435"},{type:"bar",color:"#35CDF3"}]},Ct={tooltip:{trigger:"axis"},legend:{icon:"circle",data:["Delivery Rate of Campaigns","Total Number of Campaigns","Cost Distribution"],x:"center",y:"bottom"},xAxis:{type:"category",data:[]},yAxis:{type:"value"},series:[{name:"Delivery Rate of Campaigns",data:[],type:"line",smooth:!0,itemStyle:{normal:{color:"blue"}}},{name:"Total Number of Campaigns",data:[],type:"line",smooth:!0,itemStyle:{normal:{color:"green"}}},{name:"Cost Distribution",data:[],type:"line",smooth:!0,itemStyle:{normal:{color:"#E666DA"}}}]},It={WA:!1,SMS:!1,LINE:!1,EMAIL:!1,VOICE:!1},Tt={WA:!0,SMS:!0,LINE:!0,EMAIL:!0,VOICE:!0},At={WA:1,SMS:1,LINE:1,EMAIL:1,VOICE:1},Ot={WA:[],SMS:[],LINE:[],EMAIL:[],VOICE:[]},Vt={campaignName:[{type:"required",message:"General Information is required"},{type:"maxlength",message:"Maximum character 100"}],medium:[{type:"required",message:"Channel is required"}]},Pt={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"}],media:[{type:"required",message:"Media Type is required"}],fileName:[{type:"required",message:"File is required"}],template:[{type:"required",message:"Template is required"}],category:[{type:"required",message:"Category is required"}],catalogue:[{type:"required",message:"Catalog is required"}],product:[{type:"required",message:"Product is required"}],body:[{type:"maxlength",message:"Maximum character 100"}]},Mt={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"}],template:[{type:"required",message:"Template is required"}]},Nt={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"}],template:[{type:"required",message:"Template is required"}]},Dt={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"}],template:[{type:"required",message:"Template is required"}]},Lt={interval:[{type:"required",message:"Interval Time is required"},{type:"intervalTime",message:"Must be greater than 0 and without decimal"}],type:[{type:"required",message:"Main Rules is required"}],accountId:[{type:"required",message:"Account is required"}],subject:[{type:"required",message:"Subject is required"}],message:[{type:"required",message:"Message is required"}],templateName:[{type:"required",message:"Template is required"}]},Ft={startDate:[{type:"required",message:"Select Date is required"}],startTime:[{type:"required",message:"Select Time is required"}]};!function(t){t.Today="today",t.Yesterday="yesterday",t.CurrentWeek="currentWeek",t.LastWeek="last week",t.CurrentMonth="currentMonth",t.LastMonth="last month"}(nt||(nt={})),function(t){t.Draft="DRAFT",t.WaitingApproval="APPROVAL",t.Rejected="REJECTED",t.Scheduled="SCHEDULED",t.Stopped="STOPPED",t.Deleted="DELETED",t.Completed="COMPLETED",t.Failed="FAILED",t.Paused="PAUSED",t.Processing="PROCESS"}(at||(at={})),function(t){t.SingleProduct="product"}(rt||(rt={}));var Et,Rt=function(t){function n(){var e=null!==t&&t.apply(this,arguments)||this;return e.itemsPerPageLabel="Listing per Page",e.getRangeLabel=function(t,e,n){if(0===n||0===e)return"Show 0";var a=t*e;return"Show "+(a+1)+" - "+(a<(n=Math.max(n,0))?Math.min(a+e,n):a+e)},e}return G(n,t),n=J([e.Injectable()],n)}(o.MatPaginatorIntl),kt=function(t){return t?Object.keys(t).reduce((function(e,n){if(isNaN(Number(n))){var a=new lt,r=n.replace(/([A-Z])/g," $1").replace(/([0-9])/g," $1");a.label=r,isNaN(Number(t[n]))?a.value=t[n]:a.value=Number(t[n]),e.push(a)}return e}),[]):[]},Bt=function(){function t(t){this.apiAdapterService=t,this.channelOption=vt,this.filteredChannelOption=[],this.businessNameOption=[],this.filteredBusinessNameOption=[],this.statusOption=[],this.filteredStatusOption=[],this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.pageNoTemplateOption=1,this.subscribers=[],this.closeDropdown=new e.EventEmitter,this.onChangeFilter=new e.EventEmitter}return t.prototype.ngOnInit=function(){this.statusOption=kt(at),this.filteredStatusOption=Z(this.statusOption),this.filteredChannelOption=Z(this.channelOption),this.initForm(),this.getBusinessNameOptionService()},t.prototype.initForm=function(){var t,e,n,a,r,i,o,l,s,d,c,p,u,g;this.form=new m.FormGroup({businessName:new m.FormControl((e=null===(t=this.filterValue)||void 0===t?void 0:t.businessName,null!=e?e:"")),medium:new m.FormControl((a=null===(n=this.filterValue)||void 0===n?void 0:n.medium,null!=a?a:"")),templateName:new m.FormControl((i=null===(r=this.filterValue)||void 0===r?void 0:r.templateName,null!=i?i:"")),status:new m.FormControl((l=null===(o=this.filterValue)||void 0===o?void 0:o.status,null!=l?l:"")),startDate:new m.FormControl((d=null===(s=this.filterValue)||void 0===s?void 0:s.startDate,null!=d?d:"")),endDate:new m.FormControl((p=null===(c=this.filterValue)||void 0===c?void 0:c.endDate,null!=p?p:""))}),(null===(u=this.filterValue)||void 0===u?void 0:u.templateName)&&(this.templateOption=Z(this.templateOption,[null===(g=this.filterValue)||void 0===g?void 0:g.templateName]))},t.prototype.getBusinessNameOptionService=function(){var t=this,e=this.apiAdapterService.executeApiRequest([],"/admin/client/all-with-child?pageNo=1&rowPerPage=1000","GET").subscribe((function(e){t.businessNameOption=e.data,t.filteredBusinessNameOption=Z(t.businessNameOption)}));this.subscribers.push(e)},t.prototype.getTemplateOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingTemplateOption=!0;var a=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform",this.form.get("medium").value,"string"),this.initParam("filter",t,"string"),this.initParam("status","APPROVED","string")],r=this.apiAdapterService.executeApiRequest(a,"/message/template","GET").subscribe((function(t){n.templateOption=e?Z(n.templateOption,t.data):t.data,n.isHaveNextTemplateOption=t.haveNext,n.isLoadingTemplateOption=!1}));this.subscribers.push(r)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService("",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.templateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(t)},t.prototype.businessNameSearch=function(t){var e=t.toLowerCase();this.filteredBusinessNameOption=this.businessNameOption.filter((function(t){return t.name.toLowerCase().includes(e)}))},t.prototype.channelSearch=function(t){var e=t.toLowerCase();this.filteredChannelOption=this.channelOption.filter((function(t){return t.label.toLowerCase().includes(e)}))},t.prototype.statusSearch=function(t){var e=t.toLowerCase();this.filteredStatusOption=this.statusOption.filter((function(t){return t.label.toLowerCase().includes(e)}))},t.prototype.clearDate=function(){this.form.get("startDate").setValue(null),this.form.get("endDate").setValue(null)},t.prototype.validateBackDate=function(){new Date(this.form.get("startDate").value).getTime()>new Date(this.form.get("endDate").value).getTime()&&this.form.get("endDate").setValue("")},t.prototype.onReset=function(){this.form.reset(),this.onChangeFilter.emit(this.form.getRawValue())},t.prototype.onCancel=function(){this.closeDropdown.emit()},t.prototype.onApply=function(){this.onChangeFilter.emit(this.form.getRawValue()),this.closeDropdown.emit()},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ct}]},t.ɵprov=e.ɵɵdefineInjectable({factory:function(){return new t(e.ɵɵinject(ct))},token:t,providedIn:"root"}),J([e.Output()],t.prototype,"onChangeFilter",void 0),J([e.Output()],t.prototype,"closeDropdown",void 0),J([e.Input()],t.prototype,"filterValue",void 0),t=J([e.Component({selector:"lib-filter-in-list-of-campaign",template:'<p class="font-16px font-bold">Filter</p>\r\n\r\n<form [formGroup]="form" class="contact-filter">\r\n    <div class="row">\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-70">\r\n                    <mat-label>Business Name</mat-label>\r\n                    <mat-select placeholder="Select Business Name" formControlName="businessName">\r\n                        <div class="select-search">\r\n                            <lib-search\r\n                                [placeholder]="\'Search\'"\r\n                                (searchRes)="businessNameSearch($event)"\r\n                            ></lib-search>\r\n                        </div>\r\n\r\n                        <mat-option value=""> --- select none --- </mat-option>\r\n                        <mat-option\r\n                            *ngFor="let option of filteredBusinessNameOption"\r\n                            [value]="option.id"\r\n                        >\r\n                            {{ option.name }}\r\n                        </mat-option>\r\n                        <mat-option *ngIf="!filteredBusinessNameOption.length" disabled>\r\n                            No data found\r\n                        </mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-70">\r\n                    <mat-label>Channel</mat-label>\r\n\r\n                    <mat-select placeholder="Select the Channel" formControlName="medium">\r\n                        <mat-option value=""> --- select none --- </mat-option>\r\n                        <mat-option\r\n                            *ngFor="let option of filteredChannelOption"\r\n                            [value]="option.value"\r\n                            (click)="getTemplateOptionService()"\r\n                        >\r\n                            {{ option.label }}\r\n                        </mat-option>\r\n                        <mat-option *ngIf="!filteredChannelOption.length" disabled>\r\n                            No data found\r\n                        </mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\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 Name</mat-label>\r\n\r\n                    <mat-select\r\n                        matSelectInfiniteScroll\r\n                        formControlName="templateName"\r\n                        placeholder="Select template"\r\n                        [complete]="isHaveNextTemplateOption === false"\r\n                        [compareWith]="templateSelectedDisplay"\r\n                        (infiniteScroll)="getNextTemplateBatch()"\r\n                    >\r\n                        <div style="margin: 20px">\r\n                            <lib-search\r\n                                [placeholder]="\'Search\'"\r\n                                [currentValue]="form?.get(\'templateName\').value?.name"\r\n                                (searchRes)="templateSearch($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            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-70">\r\n                    <mat-label>Status</mat-label>\r\n\r\n                    <mat-select placeholder="Select the Status" formControlName="status">\r\n                        <div class="select-search">\r\n                            <lib-search\r\n                                [placeholder]="\'Search\'"\r\n                                (searchRes)="statusSearch($event)"\r\n                            ></lib-search>\r\n                        </div>\r\n\r\n                        <mat-option value=""> --- select none --- </mat-option>\r\n                        <mat-option\r\n                            *ngFor="let option of filteredStatusOption"\r\n                            [value]="option.value"\r\n                        >\r\n                            {{ option.label }}\r\n                        </mat-option>\r\n                        <mat-option *ngIf="!filteredStatusOption.length" disabled>\r\n                            No data found\r\n                        </mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-100">\r\n                    <mat-label> Start Date </mat-label>\r\n                    <input\r\n                        matInput\r\n                        [matDatepicker]="startDatePicker"\r\n                        formControlName="startDate"\r\n                        class="mat-datepicker-input"\r\n                        (dateChange)="validateBackDate()"\r\n                    />\r\n\r\n                    <mat-datepicker-toggle matSuffix [for]="startDatePicker">\r\n                    </mat-datepicker-toggle>\r\n                    <mat-icon\r\n                        *ngIf="form.get(\'startDate\').value"\r\n                        matDatepickerToggleIcon\r\n                        (click)="clearDate()"\r\n                        >clear</mat-icon\r\n                    >\r\n                    <mat-datepicker #startDatePicker></mat-datepicker>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-100">\r\n                    <mat-label> End Date </mat-label>\r\n                    <input\r\n                        matInput\r\n                        [min]="form.get(\'startDate\').value"\r\n                        [matDatepicker]="endDatePicker"\r\n                        formControlName="endDate"\r\n                        class="mat-datepicker-input"\r\n                        (dateChange)="validateBackDate()"\r\n                    />\r\n\r\n                    <mat-datepicker-toggle matSuffix [for]="endDatePicker"> </mat-datepicker-toggle>\r\n                    <mat-icon\r\n                        *ngIf="form.get(\'endDate\').value"\r\n                        matDatepickerToggleIcon\r\n                        (click)="clearDate()"\r\n                        >clear</mat-icon\r\n                    >\r\n                    <mat-datepicker #endDatePicker></mat-datepicker>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div style="display: flex; flex: 1; width: 100%">\r\n            <button\r\n                mat-stroked-button\r\n                color="primary-telin"\r\n                class="telin-font-color w-48"\r\n                style="width: 100%; margin-bottom: 10px"\r\n                (click)="onReset()"\r\n            >\r\n                Reset\r\n            </button>\r\n        </div>\r\n        <div class="d-flex justify-content-between">\r\n            <button mat-stroked-button color="secondary-telin" class="w-48" (click)="onCancel()">\r\n                Cancel\r\n            </button>\r\n\r\n            <button mat-flat-button color="primary-telin-blue2" class="w-48" (click)="onApply()">\r\n                Apply\r\n            </button>\r\n        </div>\r\n    </div>\r\n</form>\r\n',styles:[".contact-filter .platform{display:-ms-grid;display:grid;grid-gap:5px;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto}.button-row{margin:8px 8px 8px 0}.mat-datepicker-input{width:85%}.mat-icon{position:relative;float:right;top:-7px;cursor:pointer;color:rgba(0,0,0,.54)}.select-search{margin:20px}"]}),e.Injectable({providedIn:"root"})],t)}(),qt=function(){function t(){this.subject=new F.Subject}return t.prototype.sendClickEvent=function(){this.subject.next()},t.prototype.getEvent=function(){return this.subject.asObservable()},t.ɵprov=e.ɵɵdefineInjectable({factory:function(){return new t},token:t,providedIn:"root"}),t=J([e.Injectable({providedIn:"root"})],t)}(),Ut=function(){},zt=function(){function t(t,e){this.data=t,this.sharedService=e}var n,a;return t.prototype.deleteRowOn=function(){this.sharedService.sendClickEvent()},t.ctorParameters=function(){return[{type:Ut,decorators:[{type:e.Inject,args:[v.MAT_DIALOG_DATA]}]},{type:qt}]},t=J([e.Component({selector:"app-confirmation",template:'<h2 mat-dialog-title\r\n\tclass="font-sbold text-center">\r\n\t{{ data?.title }}\r\n</h2>\r\n\r\n<mat-dialog-content class="confirmation-content">\r\n\t<div [innerHTML]="data?.content"\r\n\t\tclass="text-center"></div>\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions class="confirmation-actions mt-4">\r\n\t<button *ngIf="data?.btnCancel"\r\n\t\tmat-stroked-button\r\n\t\tcolor="secondary-telin"\r\n\t\tclass="w-48"\r\n\t\tmat-dialog-close>\r\n\t\t{{ data?.btnCancel }}\r\n\t</button>\r\n\r\n\t<button *ngIf="data?.btnSubmit"\r\n\t\tmat-flat-button\r\n\t\tcolor="primary-telin-blue2"\r\n\t\tclass="w-48"\r\n\t\t[mat-dialog-close]="true"\r\n\t\t(click)="deleteRowOn()">\r\n\t\t{{ data?.btnSubmit }}\r\n\t</button>\r\n\r\n\t<button mat-flat-button\r\n\t\t*ngIf="data?.btnSubmitRed"\r\n\t\tclass="font-bold telin-bg-color w-48 text-white"\r\n\t\tcolor="primary-telin"\r\n\t\t[mat-dialog-close]="true"\r\n\t\t(click)="deleteRowOn()">\r\n\t\t{{ data?.btnSubmitRed }}\r\n\t</button>\r\n</mat-dialog-actions>\r\n',styles:["::ng-deep .mat-dialog-container .mat-dialog-actions.confirmation-actions{margin-bottom:-10px}"]}),(n=0,a=e.Inject(v.MAT_DIALOG_DATA),function(t,e){a(t,e,n)})],t)}(),jt=function(){function t(t,e,n){this.dialogRef=t,this.apiAdapterService=e,this.toastr=n,this.isLoading=!1,this.isSubmit=!1,this.isShowButton=!1,this.subscribers=[]}return t.prototype.ngOnInit=function(){var t,e,n;this.getCampaignDetailService(),this.isShowButton=null!=(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.isShowButton)&&n},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.convertUTCDateToLocalDate=function(t){return new Date(t.getTime()-60*t.getTimezoneOffset()*1e3)},t.prototype.getCampaignDetailService=function(){var t,e,n,a,r=this;if(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id){this.isLoading=!0;var i=this.apiAdapterService.executeApiRequest([],"/campaign/"+(null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.id),"GET").subscribe((function(t){var e,n,a,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M,N,D,L,F,E,R,k,B,q,U,z,j,H,W,_,G,J,Y,X,K,Q,tt,et,nt,at,rt,it,ot,lt,st,dt,mt,ct,pt,ut,gt,ft,vt,ht,bt,yt,xt,St,wt,Ct,It,Tt,At,Ot,Vt,Pt,Mt,Nt,Dt,Lt,Ft,Et,Rt,kt;if(t){var Bt={campaignName:null===(e=t.data)||void 0===e?void 0:e.name,medium:null===(n=t.data)||void 0===n?void 0:n.platform,channel:["image","video","document"].includes(null===(a=t.data)||void 0===a?void 0:a.type)?"MEDIA":(null===(i=t.data)||void 0===i?void 0:i.isDirectSend)?"utility":null===(l=null===(o=t.data)||void 0===o?void 0:o.type)||void 0===l?void 0:l.toUpperCase(),media:null===(d=null===(s=t.data)||void 0===s?void 0:s.type)||void 0===d?void 0:d.toUpperCase(),isPrevTemplate:null===(c=null===(m=t)||void 0===m?void 0:m.data)||void 0===c?void 0:c.isPrevTemplate,from:{id:null===(p=t.data)||void 0===p?void 0:p.accountId,name:null===(u=t.data)||void 0===u?void 0:u.accountName,platform:null===(g=t.data)||void 0===g?void 0:g.platform,clientId:null===(f=t.data)||void 0===f?void 0:f.clientId,clientName:null===(v=t.data)||void 0===v?void 0:v.clientName,accountNo:null===(h=t.data)||void 0===h?void 0:h.accountNo,wabaId:(y=null===(b=t.data)||void 0===b?void 0:b.wabaId,null!=y?y:"")},text:null===(S=null===(x=t.data)||void 0===x?void 0:x.details)||void 0===S?void 0:S.text,targetURL:(T=null===(I=null===(C=null===(w=t.data)||void 0===w?void 0:w.details)||void 0===C?void 0:C.image)||void 0===I?void 0:I.url,P=null!=T?T:null===(V=null===(O=null===(A=t.data)||void 0===A?void 0:A.details)||void 0===O?void 0:O.document)||void 0===V?void 0:V.url,L=null!=P?P:null===(D=null===(N=null===(M=t.data)||void 0===M?void 0:M.details)||void 0===N?void 0:N.video)||void 0===D?void 0:D.url,null!=L?L:null===(R=null===(E=null===(F=t.data)||void 0===F?void 0:F.details)||void 0===E?void 0:E.template)||void 0===R?void 0:R.headerURL),paramHeader:null===(q=null===(B=null===(k=t.data)||void 0===k?void 0:k.details)||void 0===B?void 0:B.template)||void 0===q?void 0:q.header,paramBody:null===(j=null===(z=null===(U=t.data)||void 0===U?void 0:U.details)||void 0===z?void 0:z.template)||void 0===j?void 0:j.data,paramButton:null===(_=null===(W=null===(H=t.data)||void 0===H?void 0:H.details)||void 0===W?void 0:W.template)||void 0===_?void 0:_.button,otpValue:null===(K=Z((X=null===(Y=null===(J=null===(G=t.data)||void 0===G?void 0:G.details)||void 0===J?void 0:J.template)||void 0===Y?void 0:Y.data,null!=X?X:[])))||void 0===K?void 0:K.pop(),template:{ID:null===(et=null===(tt=null===(Q=t.data)||void 0===Q?void 0:Q.details)||void 0===tt?void 0:tt.template)||void 0===et?void 0:et.id,name:null===(rt=null===(at=null===(nt=t.data)||void 0===nt?void 0:nt.details)||void 0===at?void 0:at.template)||void 0===rt?void 0:rt.name,lang:null===(lt=null===(ot=null===(it=t.data)||void 0===it?void 0:it.details)||void 0===ot?void 0:ot.template)||void 0===lt?void 0:lt.lang,platform:null===(st=t.data)||void 0===st?void 0:st.platform,headerURL:null===(ct=null===(mt=null===(dt=t.data)||void 0===dt?void 0:dt.details)||void 0===mt?void 0:mt.template)||void 0===ct?void 0:ct.headerURL,header:{examples:null===(gt=null===(ut=null===(pt=t.data)||void 0===pt?void 0:pt.details)||void 0===ut?void 0:ut.template)||void 0===gt?void 0:gt.header},body:{examples:null===(ht=null===(vt=null===(ft=t.data)||void 0===ft?void 0:ft.details)||void 0===vt?void 0:vt.template)||void 0===ht?void 0:ht.data},buttons:null===(xt=null===(yt=null===(bt=t.data)||void 0===bt?void 0:bt.details)||void 0===yt?void 0:yt.template)||void 0===xt?void 0:xt.button,ClientId:null===(St=t.data)||void 0===St?void 0:St.clientId,ClientName:null===(wt=t.data)||void 0===wt?void 0:wt.clientName},isUpload:""!==(null===(Ct=t.data)||void 0===Ct?void 0:Ct.fileId),fileId:null===(It=t.data)||void 0===It?void 0:It.fileId};localStorage.setItem("telin.campaign",JSON.stringify($($({},r.getCampaignStorage),{generalInformation:{id:null===(Tt=t.data)||void 0===Tt?void 0:Tt.id,form:Bt},failover:null===(At=t.data)||void 0===At?void 0:At.failover,targetAudience:null===(Ot=t.data)||void 0===Ot?void 0:Ot.targets,targetAudienceFile:{name:null===(Vt=t.data)||void 0===Vt?void 0:Vt.fileName,targetURL:null===(Pt=t.data)||void 0===Pt?void 0:Pt.targetURL},scheduler:{schedulerType:"MULTI"===(null===(Mt=t.data)||void 0===Mt?void 0:Mt.scheduleType)?"ONE_TIME":null===(Nt=t.data)||void 0===Nt?void 0:Nt.scheduleType,startDate:null===(Lt=null===(Dt=t.data)||void 0===Dt?void 0:Dt.startTime)||void 0===Lt?void 0:Lt.split(" ")[0],startTime:null===(Et=null===(Ft=t.data)||void 0===Ft?void 0:Ft.startTime)||void 0===Et?void 0:Et.split(" ")[1],isRepeat:"MULTI"===(null===(Rt=t.data)||void 0===Rt?void 0:Rt.scheduleType),delivery:null===(kt=t.data)||void 0===kt?void 0:kt.repeat}}))),r.isLoading=!1}}),(function(){r.isLoading=!1}));this.subscribers.push(i)}},t.prototype.rejectCampaignService=function(){var t,e,n=this;this.isSubmit=!0;var a=this.apiAdapterService.executeApiRequest([],"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/reject","POST").subscribe((function(t){var e;if(n.isSubmit=!1,!t||!(null===(e=t)||void 0===e?void 0:e.data))return n.toastr.error("Error Rejecting Campaign!");n.toastr.success("Campaign Rejected Successfully!"),n.onClose()}),(function(){n.toastr.error("Error Rejecting Campaign!"),n.isSubmit=!1}));this.subscribers.push(a)},t.prototype.approveCampaignService=function(){var t,e,n=this;this.isSubmit=!0;var a=this.apiAdapterService.executeApiRequest([],"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/approve","POST").subscribe((function(t){var e;if(n.isSubmit=!1,!t||!(null===(e=t)||void 0===e?void 0:e.data))return n.toastr.error("Error Approving Campaign!");n.toastr.success("Campaign Approved Successfully!"),n.onClose()}),(function(){n.toastr.error("Error Approving Campaign!"),n.isSubmit=!1}));this.subscribers.push(a)},t.prototype.onClose=function(){localStorage.removeItem("telin.campaign"),this.dialogRef.close()},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:v.MatDialogRef},{type:ct},{type:s.ToastrService}]},t=J([e.Component({selector:"lib-pending-approval-dialog-view",template:'<div mat-dialog-title\r\n\tclass="d-flex justify-content-between align-items-center">\r\n\t<h2 class="font-PoppinsBold font-24px">Summary</h2>\r\n\r\n\t<button mat-button\r\n\t\t(click)="onClose()">\r\n\t\t<mat-icon class="icon-menu">close</mat-icon>\r\n\t</button>\r\n</div>\r\n\r\n<mat-dialog-content class="campaign-view">\r\n\t<ng-container *ngIf="!isLoading; else isSpinner">\r\n\t\t<div *ngIf="isSubmit"\r\n\t\t\tclass="overlay-bg">\r\n\t\t\t<img src="../../../../../assets/images/spinner.svg"\r\n\t\t\t\tclass="overlay-bg__center" />\r\n\t\t</div>\r\n\t\t<lib-new-campaign-summary [isShowLabel]="true"></lib-new-campaign-summary>\r\n\t</ng-container>\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions>\r\n\t<button mat-stroked-button\r\n\t\tcolor="secondary-telin"\r\n\t\t[disabled]="isSubmit"\r\n\t\t(click)="onClose()">\r\n\t\tCancel\r\n\t</button>\r\n\r\n\t<ng-container *ngIf="isShowButton">\r\n\t\t<button mat-flat-button\r\n\t\t\tcolor="primary-telin"\r\n\t\t\tclass="font-bold telin-bg-color"\r\n\t\t\tstyle="color: white"\r\n\t\t\t[disabled]="isSubmit"\r\n\t\t\t(click)="rejectCampaignService()">\r\n\t\t\tReject\r\n\t\t</button>\r\n\r\n\t\t<button mat-flat-button\r\n\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t[disabled]="isSubmit"\r\n\t\t\t(click)="approveCampaignService()">\r\n\t\t\tApprove\r\n\t\t</button>\r\n\t</ng-container>\r\n</mat-dialog-actions>\r\n\r\n<ng-template #isSpinner>\r\n\t<div class="text-center my-auto">\r\n\t\t<img src="../../../../../assets/images/spinner.svg" />\r\n\t</div>\r\n</ng-template>\r\n',styles:["::ng-deep .mat-dialog-content.campaign-view{max-height:100%;overflow-x:hidden}.overlay-bg{position:absolute;top:18px;left:18px;right:28px;bottom:18px;z-index:99;background-color:rgba(0,0,0,.25);border-radius:16px}.overlay-bg__center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}"]})],t)}(),Ht=function(){function t(t,n,a){this.dialog=t,this.apiAdapterService=n,this.toastr=a,this.currentView=new e.EventEmitter,this.updateTable=new e.EventEmitter,this.currentViews=K,this.subscribers=[]}return t.prototype.ngOnInit=function(){},t.prototype.sort=function(){this.table.dataSource.sort=this.matSort},t.prototype.actionRow=function(t,e){switch(e){case"pause":this.campaignConfirmationDialog(t.id,{title:"Pause Campaign",content:"Are you sure you want to Pause this Campaign?",url:"/campaign/"+t.id+"/pause",method:"POST",message:"Selected campaign is successfully paused"});break;case"stop":this.campaignConfirmationDialog(t.id,{title:"Stop Campaign",content:"Are you sure you want to Stop this Campaign?",url:"/campaign/"+t.id+"/stop",method:"POST",message:"Selected campaign is successfully stop"});break;case"delete":"COMPLETED"!==t.status&&this.campaignConfirmationDialog(t.id,{title:"Delete Campaign",content:"Are you sure you want to Delete this Campaign?",url:"/campaign/"+t.id+"/delete",method:"DELETE",message:"Selected campaign is successfully deleted"});break;case"live":this.campaignConfirmationDialog(t.id,{title:"Resume Campaign",content:"Are you sure you want to Resume this Campaign?",url:"/campaign/"+t.id+"/resume",method:"POST",message:"Selected campaign is successfully resume"})}},t.prototype.campaignConfirmationDialog=function(t,e){var n=this,a=new Ut;a.title=e.title,a.content=e.content,a.btnSubmit="Yes",a.btnCancel="No";var r=this.dialog.open(zt,{autoFocus:!1,backdropClass:"overlay-backdrop-dialog",data:a}).afterClosed().subscribe((function(t){t&&n.campaignService(e)}));this.subscribers.push(r)},t.prototype.campaignService=function(t){var e=this,n=this.apiAdapterService.executeApiRequest([],t.url,t.method).subscribe((function(){e.toastr.error(t.message),e.updateTable.emit()}));this.subscribers.push(n)},t.prototype.editCampaign=function(t){localStorage.removeItem("telin.campaign"),window.history.replaceState({},"","/secure/campaign/"+t.id),this.currentView.emit(this.currentViews.NewCampaign)},t.prototype.openViewDialog=function(t,e){var n,a=this;void 0===e&&(e=!1),localStorage.setItem("telin.campaign",JSON.stringify({generalInformation:{id:null===(n=t)||void 0===n?void 0:n.id,isShowButton:e}}));var r=this.dialog.open(jt,{autoFocus:!1,height:"calc(100% - 30px)",width:"calc(100% - 30px)",maxWidth:"100%",maxHeight:"100%",backdropClass:"overlay-backdrop-dialog"}).afterClosed().subscribe((function(){a.updateTable.emit()}));this.subscribers.push(r)},t.prototype.convertUTCDateToLocalDate=function(t){return new Date(t.getTime()-60*t.getTimezoneOffset()*1e3)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:v.MatDialog},{type:ct},{type:s.ToastrService}]},J([e.Output()],t.prototype,"currentView",void 0),J([e.Output()],t.prototype,"updateTable",void 0),J([e.Input()],t.prototype,"table",void 0),J([e.ViewChild(O.MatSort,{static:!1})],t.prototype,"matSort",void 0),t=J([e.Component({selector:"lib-viewing-list-of-campaign-table",template:'<div class="account-table">\r\n    <div class="table-responsive">\r\n        <table\r\n            mat-table\r\n            matSort\r\n            matSortDisableClear\r\n            class="table w-100 mb-2"\r\n            [dataSource]="table.dataSource"\r\n            (matSortChange)="sort()"\r\n        >\r\n            <ng-container\r\n                *ngFor="let index of [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14]"\r\n                [matColumnDef]="table.columns[index]"\r\n            >\r\n                <th *matHeaderCellDef [mat-sort-header]="table.columns[index]">\r\n                    {{ table.labels[index] }}\r\n\r\n                    <span\r\n                        *ngIf="index === 7"\r\n                        [matTooltip]="\r\n                            \'Total number of messages that have been processed for this broadcast, but still waiting to receive the delivery statuses\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 8"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been successfully sent out to the contacts in the broadcast messaging\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 9"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been successfully delivered to the recipients devices\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 10"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been opened and read by the recipients\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 11"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been failed sent out to the contacts in the broadcast messaging\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                </th>\r\n\r\n                <td *matCellDef="let row">\r\n                    <ng-container *ngIf="index === 8">\r\n                        {{ row.sentCount + row.platformQueueCount }}\r\n                    </ng-container>\r\n                    <ng-container *ngIf="index !== 8">\r\n                        {{ row[table.columns[index]] }}\r\n\r\n                        <span\r\n                            *ngIf="index === 5 && row.status === \'FAILED\'"\r\n                            class="tooltip-toggle"\r\n                            [attr.aria-label]="row.detailFailed"\r\n                            tabindex="0"\r\n                        >\r\n                            <mat-icon class="icon-menu font-16px" style="color: #ed1c24"\r\n                                >info</mat-icon\r\n                            >\r\n                        </span>\r\n                    </ng-container>\r\n                </td>\r\n            </ng-container>\r\n\r\n            <ng-container [matColumnDef]="table.columns[15]">\r\n                <th *matHeaderCellDef>\r\n                    {{ table.labels[15] }}\r\n                </th>\r\n\r\n                <td *matCellDef="let row" class="d-flex border-bottom-0">\r\n                    <ng-container *ngIf="row.status === \'DRAFT\' || row.status === \'APPROVAL\'">\r\n                        <mat-icon\r\n                            class="icon-menu pointer w-18px mr-3"\r\n                            (click)="openViewDialog(row, row.status === \'APPROVAL\')"\r\n                            >visibility</mat-icon\r\n                        >\r\n\r\n                        <mat-icon\r\n                            class="icon-menu pointer w-18px mr-3"\r\n                            svgIcon="icon_edit"\r\n                            (click)="editCampaign(row)"\r\n                        ></mat-icon>\r\n\r\n                        <mat-icon\r\n                            class="icon-menu pointer w-18px mr-3"\r\n                            svgIcon="icon_delete"\r\n                            (click)="actionRow(row, \'delete\')"\r\n                        ></mat-icon>\r\n                    </ng-container>\r\n\r\n                    <mat-icon\r\n                        *ngIf="row.status === \'PAUSED\'"\r\n                        class="icon-menu live-color pointer w-18px mr-3"\r\n                        (click)="actionRow(row, \'live\')"\r\n                        >play_arrow</mat-icon\r\n                    >\r\n\r\n                    <mat-icon\r\n                        *ngIf="row.status === \'SCHEDULED\'"\r\n                        class="icon-menu pause-color pointer w-18px mr-3"\r\n                        (click)="actionRow(row, \'pause\')"\r\n                        >pause</mat-icon\r\n                    >\r\n\r\n                    <mat-icon\r\n                        *ngIf="row.status === \'SCHEDULED\' || row.status === \'PAUSED\'"\r\n                        class="icon-menu stop-color pointer w-18px mr-3"\r\n                        (click)="actionRow(row, \'stop\')"\r\n                        >stop</mat-icon\r\n                    >\r\n                </td>\r\n            </ng-container>\r\n\r\n            <ng-container matColumnDef="no-content">\r\n                <th class="text-center" *matHeaderCellDef [colSpan]="table.columns.length">\r\n                    Data Not Available\r\n                </th>\r\n            </ng-container>\r\n\r\n            <tr mat-header-row *matHeaderRowDef="table.columns"></tr>\r\n\r\n            <tr\r\n                mat-header-row\r\n                class="no-content"\r\n                *matHeaderRowDef="[\'no-content\']"\r\n                [style.display]="table.dataSource?.data?.length === 0 ? \'table-row\' : \'none\'"\r\n            ></tr>\r\n\r\n            <tr mat-row *matRowDef="let row; columns: table.columns"></tr>\r\n        </table>\r\n    </div>\r\n</div>\r\n',styles:[".w-18px{width:18px}.stop-color{color:orange}.pause-color{background-color:#e9f5f9;color:#0089ab;opacity:25%}.live-color{background-color:#e9f9f2;color:#0089ab;opacity:25%}.tooltip-toggle{cursor:pointer;position:relative}.tooltip-toggle::before{position:absolute;top:-60px;left:-80px;background-color:#2b222a;border-radius:5px;content:attr(aria-label);padding:1rem;text-transform:none;transition:.5s;width:auto}.tooltip-toggle::after,.tooltip-toggle::before{color:#efefef;font-family:monospace;font-size:16px;opacity:0;pointer-events:none;text-align:center}.tooltip-toggle:focus::after,.tooltip-toggle:focus::before,.tooltip-toggle:hover::after,.tooltip-toggle:hover::before{opacity:1;transition:.75s}"]})],t)}(),Wt=function(){function t(){}return t=J([e.NgModule({declarations:[Ht,Bt,ft,ot],imports:[a.CommonModule,m.FormsModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,f.MatDatepickerModule,V.MatTableModule,O.MatSortModule,o.MatPaginatorModule,v.MatDialogModule,P.MatTabsModule,i.MatCardModule,g.MatCheckboxModule,T.MatSelectModule,I.MatRadioModule,u.MatButtonModule,x.MatIconModule,R.MatChipsModule,D.NgbPaginationModule,D.NgbDropdownModule,R.MatChipsModule,y.MatGridListModule,k.MatNativeDateModule,et,B.MatToolbarModule,q.MatTooltipModule],exports:[ft,ot]})],t)}(),_t=function(){function t(t){this.apiAdapterService=t,this.currentViews=K,this.pastTime=nt,this.channelOption=vt,this.performanceCategories=[],this.totalCmpn=[],this.deliveryRt=[],this.costDesc=[],this.convsData=[],this.widgetLiveCampaign=St,this.selectedPlatform="",this.filterEvent="currentWeek",this.subscribers=[],this.currentView=new e.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.changeCurrentView=function(t){this.currentView.emit(t)},t.prototype.filterChart=function(t){var e=this;if(this.selectedPlatform){var n=t==nt.Today?"daily":t==nt.CurrentWeek?"weekly":t==nt.CurrentMonth?"monthly":"",a=this.apiAdapterService.executeApiRequest([],"/campaign/count","GET").subscribe((function(n){var a,r,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O=(null!=(i=null===(r=null===(a=n)||void 0===a?void 0:a.data)||void 0===r?void 0:r.totalCampaignPercent)?i:0)+"% Since "+e.getStatictsWidgetString(t);e.widgetLiveCampaign[0].arrow=(null===(l=null===(o=n)||void 0===o?void 0:o.data)||void 0===l?void 0:l.totalCampaignPercent)>0?"../../../../assets/svg/icon-up-arrow.svg":"../../../../assets/svg/icon-down-arrow.svg",e.widgetLiveCampaign[0].value=null!=(m=null===(d=null===(s=n)||void 0===s?void 0:s.data)||void 0===d?void 0:d.totalCampaign)?m:0,e.widgetLiveCampaign[0].date=O,e.widgetLiveCampaign[0].dateclass=(null===(p=null===(c=n)||void 0===c?void 0:c.data)||void 0===p?void 0:p.totalCampaignPercent)>0?"greenpercent":"redpercent",e.widgetLiveCampaign[1].arrow=(null===(g=null===(u=n)||void 0===u?void 0:u.data)||void 0===g?void 0:g.totalCampaignPercent)>0?"../../../../assets/svg/icon-up-arrow.svg":"../../../../assets/svg/icon-down-arrow.svg",e.widgetLiveCampaign[1].value=null!=(h=null===(v=null===(f=n)||void 0===f?void 0:f.data)||void 0===v?void 0:v.totalLive)?h:0,e.widgetLiveCampaign[1].date=O,e.widgetLiveCampaign[1].dateclass=(null===(y=null===(b=n)||void 0===b?void 0:b.data)||void 0===y?void 0:y.totalCampaignPercent)>0?"greenpercent":"redpercent",e.widgetLiveCampaign[2].arrow=(null===(S=null===(x=n)||void 0===x?void 0:x.data)||void 0===S?void 0:S.totalCampaignPercent)>0?"../../../../assets/svg/icon-up-arrow.svg":"../../../../assets/svg/icon-down-arrow.svg",e.widgetLiveCampaign[2].value=null!=(I=null===(C=null===(w=n)||void 0===w?void 0:w.data)||void 0===C?void 0:C.totalPending)?I:0,e.widgetLiveCampaign[2].date=O,e.widgetLiveCampaign[2].dateclass=(null===(A=null===(T=n)||void 0===T?void 0:T.data)||void 0===A?void 0:A.totalCampaignPercent)>0?"greenpercent":"redpercent"}));this.subscribers.push(a),this.getPerformanceDetails(n),this.getConversationDetails(n)}},t.prototype.getPerformanceDetails=function(t){var e=this;if(this.selectedPlatform){this.setPerformanceChartData();var n=[{name:"timeUnit",value:t,in:"query",type:"String"},{name:"clientId",value:localStorage.getItem("telin.clientId"),in:"query",type:"String"},{name:"platform",value:"WHATSAPP"===this.selectedPlatform?"WA":this.selectedPlatform,in:"query",type:"String"}],a=this.apiAdapterService.executeApiRequest(n,"/report/campaign/performance","GET").subscribe((function(t){var n,a,r,i,o,l,s,d;if(e.performanceCategories=[],e.totalCmpn=[],e.deliveryRt=[],e.costDesc=[],(null===(o=t)||void 0===o?void 0:o.data)&&0!==Object.entries(t.data).length){try{for(var m=Y(t.data.categories),c=m.next();!c.done;c=m.next()){var p=c.value;e.performanceCategories.push(p)}}catch(t){n={error:t}}finally{try{c&&!c.done&&(a=m.return)&&a.call(m)}finally{if(n)throw n.error}}try{for(var u=Y(t.data.series),g=u.next();!g.done;g=u.next()){var f=g.value;"Total Campaign"===f.name?e.totalCmpn=null===(l=f.data)||void 0===l?void 0:l.map((function(t){return t})):"Delivery Rate"===f.name?e.deliveryRt=null===(s=f.data)||void 0===s?void 0:s.map((function(t){return t})):"Cost Distribution"===f.name&&(e.costDesc=null===(d=f.data)||void 0===d?void 0:d.map((function(t){return t})))}}catch(t){r={error:t}}finally{try{g&&!g.done&&(i=u.return)&&i.call(u)}finally{if(r)throw r.error}}e.setPerformanceChartData()}}));this.subscribers.push(a)}},t.prototype.setPerformanceChartData=function(){this.performanceChartData=Ct,this.performanceChartData.xAxis.data=this.performanceCategories,this.performanceChartData.series[0].data=this.deliveryRt,this.performanceChartData.series[1].data=this.totalCmpn,this.performanceChartData.series[2].data=this.costDesc},t.prototype.getConversationDetails=function(t){var e=this;if(this.selectedPlatform){this.setConversationChartData();var n=[{name:"timeUnit",value:t,in:"query",type:"String"},{name:"clientId",value:localStorage.getItem("telin.clientId"),in:"query",type:"String"},{name:"platform",value:"WHATSAPP"===this.selectedPlatform?"WA":this.selectedPlatform,in:"query",type:"String"}],a=this.apiAdapterService.executeApiRequest(n,"/report/campaign/conversation","GET").subscribe((function(t){var n,a,r;if(e.convsData=[],null===(n=t)||void 0===n?void 0:n.data){for(var i=0;i<(null===(a=t.data.categories)||void 0===a?void 0:a.length);i++){e.convsData[i]=new Array,e.convsData[i].push(t.data.categories[i]);for(var o=1;o<=(null===(r=t.data.series)||void 0===r?void 0:r.length);o++)e.convsData[i].push(t.data.series[o-1].data[i])}e.setConversationChartData()}}));this.subscribers.push(a)}},t.prototype.setConversationChartData=function(){var t=this;this.conversationChartData=wt,this.convsData.forEach((function(e){e&&t.conversationChartData.dataset.source.push(e)}))},t.prototype.getStatictsWidgetString=function(t){return t==nt.Today?nt.Yesterday:t==nt.CurrentWeek?nt.LastWeek:t==nt.CurrentMonth?nt.LastMonth:""},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ct}]},J([e.Output()],t.prototype,"currentView",void 0),t=J([e.Component({selector:"lib-dashboard",template:'<section class="dashboard-container">\r\n\t<h2 class="font-PoppinsBold font-32px">Campaign</h2>\r\n\r\n\t<p class="font-PoppinsLight">Welcome to your Campaign Dashboard!</p>\r\n\r\n\t<div class="d-flex align-items-center w-100 mb-4">\r\n\t\t<mat-grid-list cols="2"\r\n\t\t\trowHeight="50px">\r\n\t\t\t<mat-button-toggle-group name="fontStyle"\r\n\t\t\t\taria-label="Font Style"\r\n\t\t\t\tvalue="week">\r\n\t\t\t\t<mat-button-toggle (click)="filterChart(pastTime.Today)"\r\n\t\t\t\t\tvalue="day">\r\n\t\t\t\t\tToday\r\n\t\t\t\t</mat-button-toggle>\r\n\t\t\t\t<mat-button-toggle (click)="filterChart(pastTime.CurrentWeek)"\r\n\t\t\t\t\tvalue="week">\r\n\t\t\t\t\tCurrent Week\r\n\t\t\t\t</mat-button-toggle>\r\n\t\t\t\t<mat-button-toggle (click)="filterChart(pastTime.CurrentMonth)"\r\n\t\t\t\t\tvalue="month">\r\n\t\t\t\t\tCurrent Month\r\n\t\t\t\t</mat-button-toggle>\r\n\t\t\t</mat-button-toggle-group>\r\n\t\t</mat-grid-list>\r\n\r\n\t\t<div class="px-5">\r\n\t\t\t<span> Channel: </span>\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tclass="w-50">\r\n\t\t\t\t<mat-select placeholder="Choose .."\r\n\t\t\t\t\t[(ngModel)]="selectedPlatform">\r\n\t\t\t\t\t<mat-option *ngFor="let option of channelOption"\r\n\t\t\t\t\t\t[value]="option.value"\r\n\t\t\t\t\t\t(click)="filterChart(filterEvent)">\r\n\t\t\t\t\t\t{{ option.label }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class="d-flex gap-4">\r\n\t\t<div class="left-side">\r\n\t\t\t<div class="d-flex justify-content-between gap-4">\r\n\t\t\t\t<div>\r\n\t\t\t\t\t<h5 class="font-PoppinsBold font-24px mb-3">\r\n\t\t\t\t\t\tDeliver more engaging campaigns to your customers on WhatsApp\r\n\t\t\t\t\t</h5>\r\n\r\n\t\t\t\t\t<p class="mb-3">\r\n\t\t\t\t\t\tTurn conversations into sales, generate more qualified leads and recommend the right\r\n\t\t\t\t\t\tproduct or services!\r\n\t\t\t\t\t</p>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<img src="../../../../assets/svg/bg_widget_campaign.svg"\r\n\t\t\t\t\talt="communicate" />\r\n\t\t\t</div>\r\n\r\n\t\t\t<button mat-flat-button\r\n\t\t\t\ttype="button"\r\n\t\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t\tstyle="height: 42px"\r\n\t\t\t\t(click)="changeCurrentView(currentViews.CampaignIndex)">\r\n\t\t\t\tGo to Broadcast Messaging\r\n\t\t\t</button>\r\n\t\t</div>\r\n\r\n\t\t<div class="right-side">\r\n\t\t\t<div class="d-flex gap-4">\r\n\t\t\t\t<div *ngFor="let widgetLive of widgetLiveCampaign"\r\n\t\t\t\t\tclass="widget-card">\r\n\t\t\t\t\t<img style="width: 56px"\r\n\t\t\t\t\t\t[src]="widgetLive.icon"\r\n\t\t\t\t\t\t[alt]="widgetLive.title" />\r\n\r\n\t\t\t\t\t<p class="font-PoppinsLight mt-3">{{ widgetLive.title }}</p>\r\n\r\n\t\t\t\t\t<p class="d-flex align-items-center">\r\n\t\t\t\t\t\t<span class="font-PoppinsBold font-36px mr-2"\r\n\t\t\t\t\t\t\tstyle="font-size: 36px">\r\n\t\t\t\t\t\t\t{{ widgetLive.value }}\r\n\t\t\t\t\t\t</span>\r\n\r\n\t\t\t\t\t\t<img style="margin-top: 5px"\r\n\t\t\t\t\t\t\twidth="25"\r\n\t\t\t\t\t\t\t[src]="widgetLive.arrow" />\r\n\t\t\t\t\t</p>\r\n\r\n\t\t\t\t\t<span class="font-10px"\r\n\t\t\t\t\t\t[classList]="widgetLive.dateclass">\r\n\t\t\t\t\t\t{{ widgetLive.date }}\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class="d-flex gap-4 mt-4">\r\n\t\t<div class="card left-card w-50">\r\n\t\t\t<div class="card-body">\r\n\t\t\t\t<p class="font-PoppinsBold font-20px">Campaign\'s Performance</p>\r\n\r\n\t\t\t\t<div echarts\r\n\t\t\t\t\tclass="demo-chart"\r\n\t\t\t\t\t[options]="performanceChartData"></div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\r\n\t\t<div class="card left-card w-50">\r\n\t\t\t<div class="card-body">\r\n\t\t\t\t<p class="font-PoppinsBold font-20px">Conversation Insights</p>\r\n\r\n\t\t\t\t<div id="chart">\r\n\t\t\t\t\t<div echarts\r\n\t\t\t\t\t\tclass="demo-chart"\r\n\t\t\t\t\t\t[options]="conversationChartData"></div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n</section>\r\n',styles:[".dashboard-container{width:100%;padding:24px}.dashboard-container .mat-button-toggle-group{border-radius:15px}.dashboard-container .mat-button-toggle{background-color:#fff;color:#000}.dashboard-container .mat-button-toggle-checked{background:#ed1c24;color:#fff}.dashboard-container .mat-button-toggle-label-content:visited{color:#fff}.dashboard-container .left-side{flex:50%;min-height:231px;padding:24px;border-radius:10px;background-color:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04)}.dashboard-container .right-side{flex:50%}.dashboard-container .widget-card{width:39%;min-height:231px;padding:24px;border-radius:10px;background-color:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04)}.dashboard-container .line-chart{height:65vh;width:70%;margin-left:2%;background-color:#fff;border-radius:15px;margin-bottom:50px;margin-right:20px;padding:30px}.dashboard-container .doughnut-chart{margin-right:2%;border-radius:15px;height:65vh;background-color:#fff;width:22.5%;margin-bottom:20px;padding:40px}.dashboard-container .greenpercent{color:green}.dashboard-container .redpercent{color:red}.dashboard-container .left-card{box-shadow:12px 12px 20px rgba(44,59,113,.04);border-radius:8px;border-style:none}.dashboard-container .left-card .card-body{min-height:440px}"]})],t)}(),Gt=function(){function t(){}return t=J([e.NgModule({declarations:[_t],imports:[a.CommonModule,c.MatAutocompleteModule,m.FormsModule,y.MatGridListModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,T.MatSelectModule,I.MatRadioModule,w.MatListModule,u.MatButtonModule,x.MatIconModule,M.PickerModule,N.AngularEditorModule,z.MatButtonToggleModule,v.MatDialogModule,P.MatTabsModule,p.MatBadgeModule,D.NgbDropdownModule,l.NgxEchartsModule],exports:[_t]})],t)}(),$t=function(){function t(){}return t.prototype.clone=function(t){var e,n;return this.active=t.active,this.interval=null!=(e=t.interval)?e:0,this.type=null!=(n=t.type)?n:"",t.accounts&&(this.accounts=t.accounts.reduce((function(t,e){return t.push((new Jt).clone(e)),t}),[])),this},t.prototype.convert=function(){return{failover:this}},t}(),Jt=function(){function t(){}return t.prototype.clone=function(t){var e,n,a,r,i,o,l,s,d,m,c,p,u,g;return this.accountId=null!=(n=null===(e=t.accountId)||void 0===e?void 0:e.id)?n:"",this.accountName=null!=(a=t.accountName)?a:"",this.subject=null!=(r=t.subject)?r:"",this.platform=null!=(i=t.platform)?i:"",this.template={id:(l=null===(o=t.template)||void 0===o?void 0:o.ID,null!=l?l:""),name:(d=null===(s=t.template)||void 0===s?void 0:s.name,m=null!=d?d:t.template,null!=m?m:""),lang:(p=null===(c=t.template)||void 0===c?void 0:c.lang,null!=p?p:""),data:(g=null===(u=t.paramBody)||void 0===u?void 0:u.map((function(t){return t.name})),null!=g?g:[])},this},t.prototype.convert=function(){return this},t}(),Yt=function(){function t(){}return t.prototype.clone=function(t){var e,n,a,r,i,o,l,s,d,m,c,p,u,g,f,v;return"IMAGE"!==(null===(e=t)||void 0===e?void 0:e.media)&&"VIDEO"!==(null===(n=t)||void 0===n?void 0:n.media)&&"DOCUMENT"!==(null===(a=t)||void 0===a?void 0:a.media)||(t.channel=t.media),t.campaignName&&(this.name=t.campaignName),"EMAIL"===t.medium&&(this.subject=t.campaignName),(null===(r=t.from)||void 0===r?void 0:r.id)&&(this.accountId=t.from.id),t.channel&&(this.type=null===(i=t.channel)||void 0===i?void 0:i.toLowerCase()),t.text&&(this.text=t.text),"image"===this.type&&t.fileName&&(this.image={url:t.targetURL}),"video"===this.type&&t.fileName&&(this.video={url:t.targetURL}),"document"===this.type&&t.fileName&&(this.document={url:t.targetURL,fileName:t.fileName}),t.template&&(this.template={id:t.template.ID,name:t.template.name,lang:t.template.lang,headerUrl:t.targetURL,header:(l=null===(o=t.paramHeader)||void 0===o?void 0:o.map((function(t){return t.name})),null!=l?l:[]),data:(d=null===(s=t.paramBody)||void 0===s?void 0:s.map((function(t){return t.name})),null!=d?d:[]),button:null===(m=t.paramButton)||void 0===m?void 0:m.reduce((function(t,e){var n;return t.push(null!=(n=e.name.map((function(t){return t.name})))?n:[]),t}),[])},"AUTHENTICATION"===t.template.category&&(this.template={name:t.template.name,lang:t.template.lang,header:null,data:[t.otpValue],button:[[t.otpValue]]}),t.template.ID&&(this.template.id=t.template.ID)),"utility"===this.type&&(this.type="template",this.category="utility",this.template=(null===(c=t)||void 0===c?void 0:c.isUseExistingTemplate)?null===(p=t)||void 0===p?void 0:p.template:{name:"",lang:"id",header:null,button:null,data:[]},this.isNeedSave=t.isNeedSave,(null===(u=t)||void 0===u?void 0:u.isUseExistingTemplate)&&(this.text=null===(v=null===(f=null===(g=t)||void 0===g?void 0:g.template)||void 0===f?void 0:f.body)||void 0===v?void 0:v.text)),this},t.prototype.convert=function(){return this},t}(),Xt=function(){function t(){this.datePipe=new a.DatePipe("en-US")}return t.prototype.clone=function(t){return t.schedulerType&&(this.type=t.delivery?"MULTI":t.schedulerType),t.startDate&&(this.startTime=this.datePipe.transform(t.startDate,"yyyy-MM-dd")+" "+t.startTime),t.delivery&&(this.repeat=t.delivery.toUpperCase()),this},t.prototype.convert=function(){return{type:this.type,startTime:this.startTime,repeat:this.repeat,tz:Intl.DateTimeFormat().resolvedOptions().timeZone}},t}(),Zt=function(){function t(t,n,a){var r=this;this.dialog=t,this.apiAdapterService=n,this.toastr=a,this.currentView=new e.EventEmitter,this.currentViews=K,this.positionWizard=1,this.isLoading=!1,this.isSubmit=!1,this.isGeneralInformationValid=!1,this.isFailoverMechanismValid=!1,this.isNumberBaseInformationValid=!1,this.isSchedulerInformationValid=!1,this.isLine=!1,this.isUploadTargetAudience=!1,this.subscribers=[],this.onCheckTwilioCounterValid=function(){var t,e,n,a,i=r.generalInformationData;if("SMS"!==(null===(t=i)||void 0===t?void 0:t.medium))return!0;if("TEXT"===(null===(e=i)||void 0===e?void 0:e.channel))return!({segments:(o=new j.SegmentedMessage(r.getBody)).segmentsCount,encoding:o.encodingName,characters:o.numberOfUnicodeScalars}.segments>10);var o,l=r.getBody;return Array.from((null===(a=null===(n=i.template)||void 0===n?void 0:n.body)||void 0===a?void 0:a.examples)||[]).map((function(t,e){if(i.paramBody.length>0){var n="{{"+t+"}}",a=i.paramBody[e].name;l=l.split(n).join(a)}})),!({segments:(o=new j.SegmentedMessage(l)).segmentsCount,encoding:o.encodingName,characters:o.numberOfUnicodeScalars}.segments>10)}}return t.prototype.ngOnInit=function(){var t,e;this.campaignID=null===(e=null===(t=window.location.pathname)||void 0===t?void 0:t.split("/"))||void 0===e?void 0:e.pop(),this.initWizard(),this.getCampaignDetailService()},t.prototype.initWizard=function(){this.isLine?this.dataWizard=["General Information","Target Audience","Scheduler","Summary"]:this.dataWizard=["General Information","Failover Mechanism","Target Audience","Scheduler","Summary"]},t.prototype.getCampaignDetailService=function(){var t,e=this;if(!((null===(t=this.campaignID)||void 0===t?void 0:t.length)<10)){this.isLoading=!0;var n=this.apiAdapterService.executeApiRequest([],"/campaign/"+this.campaignID,"GET").subscribe((function(t){var n,a,r,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M,N,D,L,F,E,R,k,B,q,U,z,j,H,W,_,G,J,Y,X,K,Q,tt,et,nt,at,rt,it,ot,lt,st,dt,mt,ct,pt,ut,gt,ft,vt,ht,bt,yt,xt,St,wt,Ct,It,Tt,At,Ot,Vt,Pt,Mt,Nt,Dt,Lt,Ft,Et,Rt,kt,Bt;if(t){var qt={campaignName:null===(n=t.data)||void 0===n?void 0:n.name,medium:null===(a=t.data)||void 0===a?void 0:a.platform,channel:["image","video","document"].includes(null===(r=t.data)||void 0===r?void 0:r.type)?"MEDIA":(null===(i=t.data)||void 0===i?void 0:i.isDirectSend)?"utility":null===(l=null===(o=t.data)||void 0===o?void 0:o.type)||void 0===l?void 0:l.toUpperCase(),media:null===(d=null===(s=t.data)||void 0===s?void 0:s.type)||void 0===d?void 0:d.toUpperCase(),isPrevTemplate:null===(c=null===(m=t)||void 0===m?void 0:m.data)||void 0===c?void 0:c.isPrevTemplate,from:{id:null===(p=t.data)||void 0===p?void 0:p.accountId,name:null===(u=t.data)||void 0===u?void 0:u.accountName,platform:null===(g=t.data)||void 0===g?void 0:g.platform,clientId:null===(f=t.data)||void 0===f?void 0:f.clientId,clientName:null===(v=t.data)||void 0===v?void 0:v.clientName,accountNo:null===(h=t.data)||void 0===h?void 0:h.accountNo,wabaId:(y=null===(b=t.data)||void 0===b?void 0:b.wabaId,null!=y?y:"")},text:null===(S=null===(x=t.data)||void 0===x?void 0:x.details)||void 0===S?void 0:S.text,targetURL:(T=null===(I=null===(C=null===(w=t.data)||void 0===w?void 0:w.details)||void 0===C?void 0:C.image)||void 0===I?void 0:I.url,P=null!=T?T:null===(V=null===(O=null===(A=t.data)||void 0===A?void 0:A.details)||void 0===O?void 0:O.document)||void 0===V?void 0:V.url,L=null!=P?P:null===(D=null===(N=null===(M=t.data)||void 0===M?void 0:M.details)||void 0===N?void 0:N.video)||void 0===D?void 0:D.url,null!=L?L:null===(R=null===(E=null===(F=t.data)||void 0===F?void 0:F.details)||void 0===E?void 0:E.template)||void 0===R?void 0:R.headerURL),paramHeader:null===(q=null===(B=null===(k=t.data)||void 0===k?void 0:k.details)||void 0===B?void 0:B.template)||void 0===q?void 0:q.header,paramBody:null===(j=null===(z=null===(U=t.data)||void 0===U?void 0:U.details)||void 0===z?void 0:z.template)||void 0===j?void 0:j.data,paramButton:null===(_=null===(W=null===(H=t.data)||void 0===H?void 0:H.details)||void 0===W?void 0:W.template)||void 0===_?void 0:_.button,otpValue:null===(K=Z((X=null===(Y=null===(J=null===(G=t.data)||void 0===G?void 0:G.details)||void 0===J?void 0:J.template)||void 0===Y?void 0:Y.data,null!=X?X:[])))||void 0===K?void 0:K.pop(),template:{ID:null===(et=null===(tt=null===(Q=t.data)||void 0===Q?void 0:Q.details)||void 0===tt?void 0:tt.template)||void 0===et?void 0:et.id,name:null===(rt=null===(at=null===(nt=t.data)||void 0===nt?void 0:nt.details)||void 0===at?void 0:at.template)||void 0===rt?void 0:rt.name,lang:null===(lt=null===(ot=null===(it=t.data)||void 0===it?void 0:it.details)||void 0===ot?void 0:ot.template)||void 0===lt?void 0:lt.lang,platform:null===(st=t.data)||void 0===st?void 0:st.platform,headerURL:null===(ct=null===(mt=null===(dt=t.data)||void 0===dt?void 0:dt.details)||void 0===mt?void 0:mt.template)||void 0===ct?void 0:ct.headerURL,header:{examples:null===(gt=null===(ut=null===(pt=t.data)||void 0===pt?void 0:pt.details)||void 0===ut?void 0:ut.template)||void 0===gt?void 0:gt.header},body:{examples:null===(ht=null===(vt=null===(ft=t.data)||void 0===ft?void 0:ft.details)||void 0===vt?void 0:vt.template)||void 0===ht?void 0:ht.data},buttons:null===(xt=null===(yt=null===(bt=t.data)||void 0===bt?void 0:bt.details)||void 0===yt?void 0:yt.template)||void 0===xt?void 0:xt.button,ClientId:null===(St=t.data)||void 0===St?void 0:St.clientId,ClientName:null===(wt=t.data)||void 0===wt?void 0:wt.clientName},isUpload:""!==(null===(Ct=t.data)||void 0===Ct?void 0:Ct.fileId),fileId:null===(It=t.data)||void 0===It?void 0:It.fileId};localStorage.setItem("telin.campaign",JSON.stringify($($({},e.getCampaignStorage),{generalInformation:{id:null===(Tt=t.data)||void 0===Tt?void 0:Tt.id,form:qt},failover:null===(At=t.data)||void 0===At?void 0:At.failover,targetAudience:null===(Ot=t.data)||void 0===Ot?void 0:Ot.targets,targetAudienceFile:{name:null===(Vt=t.data)||void 0===Vt?void 0:Vt.fileName,targetURL:null===(Pt=t.data)||void 0===Pt?void 0:Pt.targetURL},scheduler:{schedulerType:"MULTI"===(null===(Mt=t.data)||void 0===Mt?void 0:Mt.scheduleType)?"ONE_TIME":null===(Nt=t.data)||void 0===Nt?void 0:Nt.scheduleType,startDate:null===(Lt=null===(Dt=t.data)||void 0===Dt?void 0:Dt.startTime)||void 0===Lt?void 0:Lt.split(" ")[0],startTime:null===(Et=null===(Ft=t.data)||void 0===Ft?void 0:Ft.startTime)||void 0===Et?void 0:Et.split(" ")[1],isRepeat:"MULTI"===(null===(Rt=t.data)||void 0===Rt?void 0:Rt.scheduleType),delivery:null===(kt=t.data)||void 0===kt?void 0:kt.repeat}}))),e.isLine="LINE"===(null===(Bt=t.data)||void 0===Bt?void 0:Bt.platform),e.isLoading=!1,e.initWizard()}}),(function(){e.isLoading=!1}));this.subscribers.push(n)}},t.prototype.generalInformation=function(t){var e,n,a;this.isGeneralInformationValid=t.parent.valid&&t.child&&(null===(e=t.child)||void 0===e?void 0:e.valid),this.isLine="LINE"===(null===(a=null===(n=t.parent)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.medium),this.initWizard(),t.parent&&t.child&&(this.generalInformationData=$($({},t.parent.getRawValue()),t.child.getRawValue()))},t.prototype.failoverMechanism=function(t){this.isFailoverMechanismValid=t.valid,this.failoverMechanismData=t.getRawValue()},t.prototype.targetAudience=function(t){var e,n,a,r;this.targetAudienceFile=t.file,this.targetAudienceData=t.targetAudience,this.targetAudienceCount=t.numberCount,this.isUploadTargetAudience=t.isUpload,this.isNumberBaseInformationValid=t.isUpload&&(null===(e=t.file)||void 0===e?void 0:e.name)||!t.isUpload&&t.targetAudience.length>0||(null===(r=null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form)||void 0===r?void 0:r.fileId)},t.prototype.scheduler=function(t){this.schedulerData=t.getRawValue(),this.isSchedulerInformationValid=t.valid},t.prototype.onClickSaveAndNextButton=function(){switch(this.isSubmit=!0,this.positionWizard){case 1:this.saveGeneralInformationService();break;case 2:this.isLine?this.saveNumberBasesService():this.saveFailoverMechanismService();break;case 3:this.isLine?this.saveSchedulerService():this.saveNumberBasesService();break;case 4:this.isLine||this.saveSchedulerService();break;default:this.isSubmit=!1}},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getBody",{get:function(){var t,e,n,a,r,i,o,l;return null!=(l=null===(o=(null===(t=this.generalInformationData)||void 0===t?void 0:t.text)||(null===(a=null===(n=null===(e=this.generalInformationData)||void 0===e?void 0:e.template)||void 0===n?void 0:n.body)||void 0===a?void 0:a.text)||(null===(i=null===(r=this.generalInformationData)||void 0===r?void 0:r.body)||void 0===i?void 0:i.text))||void 0===o?void 0:o.split(/\\n|\n/).join("<br />").split(/\\t|\t/).join("    "))?l:""},enumerable:!0,configurable:!0}),t.prototype.saveGeneralInformationService=function(){var t=this;if(!this.onCheckTwilioCounterValid())return this.toastr.error("Segment cannot more than 10"),void(this.isSubmit=!1);var e=(new Yt).clone($({},this.generalInformationData)).convert();e.template&&this.generalInformationData.template&&(e.template.type=e.template.type||this.generalInformationData.template.category);var n=[{name:"data",value:e,in:"body",type:"object",withoutKeyData:!0}],a=this.apiAdapterService.executeApiRequest(n,this.generalInformationData.id?"/campaign/"+this.generalInformationData.id:"/campaign",this.generalInformationData.id?"PUT":"POST").subscribe((function(e){var n,a;"success"===(null===(a=null===(n=e)||void 0===n?void 0:n.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},t.getCampaignStorage),{generalInformation:{id:e.data.id,form:t.generalInformationData}}))),t.isSubmit=!1,t.positionWizard+=1):t.isSubmit=!1}),(function(){return t.isSubmit=!1}));this.subscribers.push(a)},t.prototype.saveFailoverMechanismService=function(){var t,e,n=this,a=[{name:"data",value:(new $t).clone($({},this.failoverMechanismData)).convert(),in:"body",type:"object",withoutKeyData:!0}],r=this.apiAdapterService.executeApiRequest(a,"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/failover","POST").subscribe((function(t){var e,a;"success"===(null===(a=null===(e=t)||void 0===e?void 0:e.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},n.getCampaignStorage),{failover:n.failoverMechanismData}))),n.isSubmit=!1,n.positionWizard+=1):n.isSubmit=!1}),(function(){return n.isSubmit=!1}));this.subscribers.push(r)},t.prototype.saveNumberBasesService=function(){var t,e,n=this;if(0===this.targetAudienceData.length||this.isUploadTargetAudience)return localStorage.setItem("telin.campaign",JSON.stringify($($({},this.getCampaignStorage),{targetAudience:this.targetAudienceData,targetAudienceCount:this.targetAudienceCount,targetAudienceFile:this.targetAudienceFile}))),this.isSubmit=!1,void(this.positionWizard+=1);var a=[{name:"data",value:{targets:this.targetAudienceData,numberCount:this.targetAudienceCount},in:"body",type:"object",withoutKeyData:!0}],r=this.apiAdapterService.executeApiRequest(a,"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/targetcategory","POST").subscribe((function(t){var e,a;"success"===(null===(a=null===(e=t)||void 0===e?void 0:e.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},n.getCampaignStorage),{targetAudience:n.targetAudienceData,targetAudienceCount:n.targetAudienceCount,targetAudienceFile:n.targetAudienceFile}))),n.isSubmit=!1,n.positionWizard+=1):n.isSubmit=!1}),(function(){return n.isSubmit=!1}));this.subscribers.push(r)},t.prototype.saveSchedulerService=function(){var t,e,n=this,a=[{name:"data",value:(new Xt).clone($({},this.schedulerData)).convert(),in:"body",type:"object",withoutKeyData:!0}],r=this.apiAdapterService.executeApiRequest(a,"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/schedule","POST").subscribe((function(t){var e,a;"success"===(null===(a=null===(e=t)||void 0===e?void 0:e.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},n.getCampaignStorage),{scheduler:n.schedulerData}))),n.isSubmit=!1,n.positionWizard+=1):n.isSubmit=!1}),(function(){return n.isSubmit=!1}));this.subscribers.push(r)},t.prototype.onPrevious=function(){this.positionWizard-=1},t.prototype.changeCurrentView=function(t){this.openConfirmationDialog(t)},t.prototype.openConfirmationDialog=function(t){var e=this,n=new Ut;n.title="Cancel Add Broadcast",n.content="Are you sure you want to cancel<br/> Add Broadcast?",n.btnSubmitRed="Yes",n.btnCancel="No";var a=this.dialog.open(zt,{autoFocus:!1,backdropClass:"overlay-backdrop-dialog",data:n}).afterClosed().subscribe((function(n){var a,r;n&&(window.history.replaceState({},"/"+(null===(r=null===(a=e.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.id),"/secure/campaign"),e.currentView.emit(t))}));this.subscribers.push(a)},t.prototype.onSubmitForApproval=function(){var t,e,n,a,r=this,i=[];this.isSubmit=!0,(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.targetAudienceFile)||void 0===e?void 0:e.name)&&i.push({name:"isFile",value:!0,in:"query",type:"string"});var o=this.apiAdapterService.executeApiRequest(i,"/campaign/"+(null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.id)+"/submit","POST").subscribe((function(t){var e,n,a,i;"success"===(null===(n=null===(e=t)||void 0===e?void 0:e.message)||void 0===n?void 0:n.toLowerCase())?(window.history.replaceState({},"/"+(null===(i=null===(a=r.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===i?void 0:i.id),"/secure/campaign"),r.toastr.success("Campaign submitted for approval!"),r.isSubmit=!1,r.currentView.emit(r.currentViews.CampaignIndex)):r.isSubmit=!1}),(function(){return r.isSubmit=!1}));this.subscribers.push(o)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:v.MatDialog},{type:ct},{type:s.ToastrService}]},J([e.Output()],t.prototype,"currentView",void 0),t=J([e.Component({selector:"lib-new-campaign",template:'<div class="create-campaign p-4">\r\n    <div class="row mb-3">\r\n        <div class="col-md-6">\r\n            <p class="title mb-1" style="font-size: 32px">\r\n                {{ campaignID?.length > 10 ? \'Update Broadcast\' : \'Add Broadcast\' }}\r\n            </p>\r\n\r\n            <p class="font-softer-black mb-0">Please fill the form below</p>\r\n        </div>\r\n    </div>\r\n\r\n    <mat-card class="dashboard-card">\r\n        <mat-card-content class="dashboard-card-content mt-2">\r\n            <lib-wizard\r\n                class="section-progress mb-3"\r\n                [positionWizard]="positionWizard"\r\n                [dataWizard]="dataWizard"\r\n            >\r\n            </lib-wizard>\r\n\r\n            <div class="line-section mb-4"></div>\r\n            <mat-divider></mat-divider>\r\n\r\n            <div *ngIf="!isLoading; else isSpinner" style="margin-top: 50px">\r\n                <lib-new-campaign-general-information\r\n                    *ngIf="positionWizard === 1"\r\n                    (generalInformation)="generalInformation($event)"\r\n                >\r\n                </lib-new-campaign-general-information>\r\n\r\n                <lib-failover-mechanism\r\n                    *ngIf="!isLine && positionWizard === 2"\r\n                    (failover)="failoverMechanism($event)"\r\n                ></lib-failover-mechanism>\r\n\r\n                <lib-new-number-bases\r\n                    *ngIf="(!isLine && positionWizard === 3) || (isLine && positionWizard === 2)"\r\n                    (targetAudience)="targetAudience($event)"\r\n                >\r\n                </lib-new-number-bases>\r\n\r\n                <lib-new-campaign-scheduler\r\n                    *ngIf="(!isLine && positionWizard === 4) || (isLine && positionWizard === 3)"\r\n                    (scheduler)="scheduler($event)"\r\n                >\r\n                </lib-new-campaign-scheduler>\r\n\r\n                <lib-new-campaign-summary\r\n                    *ngIf="(!isLine && positionWizard === 5) || (isLine && positionWizard === 4)"\r\n                >\r\n                </lib-new-campaign-summary>\r\n            </div>\r\n        </mat-card-content>\r\n    </mat-card>\r\n    <div class="section-btn-action mt-3">\r\n        <button class="btn btn-cancel" (click)="changeCurrentView(currentViews.CampaignIndex)">\r\n            Cancel\r\n        </button>\r\n\r\n        <div class="section-btn-action-child">\r\n            <button\r\n                *ngIf="positionWizard !== 1"\r\n                mat-stroked-button\r\n                color="secondary-telin"\r\n                class="mr-2"\r\n                (click)="onPrevious()"\r\n            >\r\n                Previous\r\n            </button>\r\n\r\n            <button\r\n                *ngIf="\r\n                    positionWizard === 1 ||\r\n                    (!isLine && positionWizard === 2) ||\r\n                    (!isLine && positionWizard === 3) ||\r\n                    (isLine && positionWizard === 2) ||\r\n                    (!isLine && positionWizard === 4) ||\r\n                    (isLine && positionWizard === 3)\r\n                "\r\n                mat-flat-button\r\n                color="primary-telin-blue2"\r\n                class="mr-2"\r\n                [disabled]="\r\n                    isSubmit ||\r\n                    (positionWizard === 1 && !isGeneralInformationValid) ||\r\n                    (!isLine && positionWizard === 2 && !isFailoverMechanismValid) ||\r\n                    (((!isLine && positionWizard === 3) || (isLine && positionWizard === 2)) &&\r\n                        !isNumberBaseInformationValid) ||\r\n                    (((!isLine && positionWizard === 4) || (isLine && positionWizard === 3)) &&\r\n                        !isSchedulerInformationValid)\r\n                "\r\n                (click)="onClickSaveAndNextButton()"\r\n            >\r\n                Save & Next\r\n            </button>\r\n\r\n            <ng-container\r\n                *ngIf="(!isLine && positionWizard === 5) || (isLine && positionWizard === 4)"\r\n            >\r\n                <button\r\n                    class="btn btn-submit"\r\n                    [disabled]="isSubmit"\r\n                    (click)="onSubmitForApproval()"\r\n                >\r\n                    Submit for Approval\r\n                </button>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #isSpinner>\r\n    <div class="text-center my-auto">\r\n        <img src="../../../../../assets/images/spinner.svg" />\r\n    </div>\r\n</ng-template>\r\n',styles:[".create-campaign .title{color:#31393c;font-size:22px;font-family:PoppinsBold}.create-campaign .section-progress{display:flex;justify-content:center;flex-direction:row;align-content:stretch}.create-campaign .btn-submit{border-radius:8px;background:linear-gradient(90deg,#5ee928 0,#61c477 100%);color:#fff;margin-right:20px}.create-campaign .btn-cancel{border-radius:8px;width:120px;border-width:1;border-color:#9598a0;background:#f3f6f9;color:#9598a0;margin-right:20px}.create-campaign .section-btn-action{flex-direction:row;display:flex;justify-content:space-between}.create-campaign .section-btn-action .section-btn-action-child{display:flex;flex-direction:row}::ng-deep .mat-card.dashboard-card{box-shadow:rgba(0,0,0,.1) 0 4px 12px}"]})],t)}(),Kt=function(){function t(t){this.apiAdapterService=t,this.msgTypeWAOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.isHaveTemplateParam=!1,this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.validationMessages=Mt,this.msgTypeWAOption=bt,this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("EMAIL"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),from:new m.FormControl(null,m.Validators.required),text:new m.FormControl(null,m.Validators.required),template:new m.FormControl(null,m.Validators.required),paramBody:new m.FormArray([],m.Validators.required),isUpload:new m.FormControl(!1),fileId:new m.FormControl("")}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g,f;0!==Object.entries(this.getCampaignStorage).length&&"EMAIL"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("from").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.from),this.form.get("text").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.text),this.form.get("template").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.template),this.form.get("isUpload").setValue(null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.isUpload),this.form.get("fileId").setValue(null===(g=null===(u=this.getCampaignStorage)||void 0===u?void 0:u.generalInformation)||void 0===g?void 0:g.form.fileId),this.isHaveTemplateParam=this.form.get("isUpload").value,this.getTemplateOptionService(null,null===(f=this.form.get("template").value)||void 0===f?void 0:f.name))},Object.defineProperty(t.prototype,"getIsTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();this.form.get("channel").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.getIsTemplate?(this.form.get("template").setValidators(m.Validators.required),this.form.get("template").updateValueAndValidity(),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("paramBody").updateValueAndValidity()):(this.form.get("text").setValidators(m.Validators.required),this.form.get("text").updateValueAndValidity())},t.prototype.formReset=function(t){void 0===t&&(t=!1),this.form.get("text").reset(),this.form.get("template").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","EMAIL","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?Z(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r,i,o=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var l=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","EMAIL","string"),this.initParam("filter",e,"string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string"),this.initParam("wabaId",(i=null===(r=this.form.get("from").value)||void 0===r?void 0:r.wabaId,null!=i?i:""),"string")];this.isReadOnlyMode&&l.push(this.initParam("summary",!0,"string"));var s=this.apiAdapterService.executeApiRequest(l,"/message/template","GET").subscribe((function(t){var e;o.templateOption=n?Z(o.templateOption,t.data):t.data,o.isHaveNextTemplateOption=t.haveNext,o.isLoadingTemplateOption=!1;var a=null===(e=o.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=o.form.get("template").value)||void 0===e?void 0:e.ID)}));if(a){if(o.form.get("template").setValue(a),o.form.get("isUpload").value)return o.updateDownloadCSV(o.form.get("isUpload").value);o.updateTemplate(o.form.get("template").value)}}));this.subscribers.push(s)},t.prototype.initParameter=function(t){return void 0===t&&(t=""),new m.FormGroup({name:new m.FormControl({value:t,disabled:this.isReadOnlyMode||["UnsubscribeAccount"].includes(t)},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(t);this.form.get("paramBody").push(e)},t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o=this;if(t){this.isHaveTemplateParam=(null===(e=t.body.examples)||void 0===e?void 0:e.length)>0,(null===(n=t.body.examples)||void 0===n?void 0:n.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").updateValueAndValidity();var l=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form;null===(i=t.body.examples)||void 0===i||i.forEach((function(t,e){var n,a,r,i,s,d,m,c=null!=(m=null!=(i=null===(r=null===(a=null===(n=l)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(d=null===(s=l)||void 0===s?void 0:s.paramBody)||void 0===d?void 0:d[e])?m:"";["UnsubscribeAccount"].includes(t)&&(c=t),o.addParamBody(c)}))}},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.updateDownloadCSV=function(t){if(this.form.get("isUpload").setValue(t),t)return this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").clearValidators(),void this.form.get("paramBody").updateValueAndValidity();this.updateTemplate(this.form.get("template").value)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ct}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),t=J([e.Component({selector:"lib-general-information-email",template:'<form autocomplete="off"\r\n\t[formGroup]="form">\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100">\r\n\t\t\t<mat-label class="asterix--after">Message Type</mat-label>\r\n\r\n\t\t\t<mat-select placeholder="Select message type"\r\n\t\t\t\tformControlName="channel">\r\n\t\t\t\t<mat-option *ngFor="let option of msgTypeWAOption"\r\n\t\t\t\t\t[value]="option.code"\r\n\t\t\t\t\t(click)="formReset()">\r\n\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.channel">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'channel\').touched \r\n\t\t\t\t\t&& form.get(\'channel\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100"\r\n\t\t\tstyle="margin-bottom: 20;">\r\n\t\t\t<mat-label class="asterix--after">From</mat-label>\r\n\r\n\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\tformControlName="from"\r\n\t\t\t\tplaceholder="Select from"\r\n\t\t\t\t[complete]="isHaveNextAccountOption === false"\r\n\t\t\t\t[compareWith]="accountSelectedDisplay"\r\n\t\t\t\t(infiniteScroll)="getNextAccountBatch()"\r\n\t\t\t\t(selectionChange)="getTemplateOptionService($event.value)">\r\n\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t[currentValue]="form?.get(\'from\').value?.name"\r\n\t\t\t\t\t\t(searchRes)="updateSearchAccount($event)"></lib-search>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<mat-option *ngFor="let option of accountOption"\r\n\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t{{ option.name + \' (\' + option.accountNo + \')\' }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t\t<mat-option *ngIf="isLoadingAccountOption">Loading...</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.from">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'from\').touched \r\n\t\t\t\t\t&& form.get(\'from\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div *ngIf="form.get(\'channel\').value === \'HTML\'"\r\n\t\tclass="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always">\r\n\t\t\t<mat-label class="asterix--after">Message</mat-label>\r\n\r\n\t\t\t<textarea matInput\r\n\t\t\t\trows="6"\r\n\t\t\t\tcols="50"\r\n\t\t\t\tcdkTextareaAutosize\r\n\t\t\t\tcdkAutosizeMinRows="2"\r\n\t\t\t\tcdkAutosizeMaxRows="15"\r\n\t\t\t\tplaceholder="Enter text"\r\n\t\t\t\tformControlName="text"\r\n\t\t\t\t#autosize="cdkTextareaAutosize"></textarea>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.text">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'text\').touched \r\n\t\t\t\t\t&& form.get(\'text\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="form.get(\'channel\').value === \'TEMPLATE\'">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always"\r\n\t\t\t\tclass="w-100">\r\n\t\t\t\t<mat-label class="asterix--after">Template</mat-label>\r\n\r\n\t\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\t\tformControlName="template"\r\n\t\t\t\t\tplaceholder="Select template"\r\n\t\t\t\t\t[complete]="isHaveNextTemplateOption === false"\r\n\t\t\t\t\t[compareWith]="templateSelectedDisplay"\r\n\t\t\t\t\t(infiniteScroll)="getNextTemplateBatch()"\r\n\t\t\t\t\t(selectionChange)="updateTemplate($event.value)">\r\n\t\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t\t[currentValue]="form?.get(\'template\').value?.name"\r\n\t\t\t\t\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<mat-option *ngFor="let option of templateOption"\r\n\t\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t\t<mat-option *ngIf="isLoadingTemplateOption">Loading...</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.template">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'template\').touched \r\n\t\t\t\t\t\t\t&& form.get(\'template\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\r\n\t\t<div *ngIf="isHaveTemplateParam"\r\n\t\t\tclass="d-flex justify-content-end">\r\n\t\t\t<mat-checkbox labelPosition="before"\r\n\t\t\t\tformControlName="isUpload"\r\n\t\t\t\t(change)="updateDownloadCSV($event.checked)">\r\n\t\t\t\tUsing Download XLSX\r\n\t\t\t</mat-checkbox>\r\n\t\t</div>\r\n\r\n\t\t<ng-container *ngIf="!form.get(\'isUpload\').value && getParamBody?.length > 0">\r\n\t\t\t<p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n\t\t\t<div *ngFor="\r\n\t\t\tlet param of getParamBody;\r\n\t\t\tlet paramBodyIndex = index\r\n\t\t"\r\n\t\t\t\tclass="form-group">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="text"\r\n\t\t\t\t\t\t[placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n\t\t\t\t\t\t[formControl]="param.get(\'name\')" />\r\n\t\t\t\t</mat-form-field>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.asterix--after:after{content:"*";color:red}']})],t)}(),Qt=function(){function t(t){this.apiAdapterService=t,this.msgTypeWAOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.msgTypeWAOption=yt,this.validationMessages=Dt,this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("LINE"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),from:new m.FormControl(null,m.Validators.required),text:new m.FormControl(null),template:new m.FormControl(null),isJSON:new m.FormControl(!1),paramBody:new m.FormArray([],m.Validators.required)}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c;0!==Object.entries(this.getCampaignStorage).length&&"LINE"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("from").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.from),this.form.get("text").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.text),this.form.get("template").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.template),this.getTemplateOptionService(null,null===(c=this.form.get("template").value)||void 0===c?void 0:c.name))},t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();if(this.form.get("channel").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.isText)return this.form.get("text").setValidators(m.Validators.required),void this.form.get("text").updateValueAndValidity();this.form.get("template").setValidators(m.Validators.required),this.form.get("template").updateValueAndValidity(),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("paramBody").updateValueAndValidity()},t.prototype.formReset=function(){this.form.get("text").reset(),this.form.get("template").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","LINE","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?Z(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var i=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","LINE","string"),this.initParam("filter",e,"string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string")];this.isReadOnlyMode&&i.push(this.initParam("summary",!0,"string"));var o=this.apiAdapterService.executeApiRequest(i,"/message/template","GET").subscribe((function(t){var e;r.templateOption=n?Z(r.templateOption,t.data):t.data,r.isHaveNextTemplateOption=t.haveNext,r.isLoadingTemplateOption=!1;var a=null===(e=r.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=r.form.get("template").value)||void 0===e?void 0:e.ID)}));a&&(r.form.get("template").setValue(a),r.updateTemplate(r.form.get("template").value))}));this.subscribers.push(o)},t.prototype.initParameter=function(t){return void 0===t&&(t=""),new m.FormGroup({name:new m.FormControl({value:t,disabled:this.isReadOnlyMode},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(t);this.form.get("paramBody").push(e)},Object.defineProperty(t.prototype,"isText",{get:function(){var t;return this.form.get("channel").value&&"text"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o=this;if(t){var l=t.body.text;this.isJsonString(t.body.text)&&(l=JSON.parse(t.body.text).text),this.form.get("isJSON").setValue(this.isJsonString(t.body.text)),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset();var s=null===(e=l)||void 0===e?void 0:e.match(/{{/g),d=null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form;(null===(r=s)||void 0===r?void 0:r.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),null===(i=s)||void 0===i||i.forEach((function(t,e){var n,a,r,i,l,s,m;o.addParamBody(null!=(m=null!=(i=null===(r=null===(a=null===(n=d)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(s=null===(l=d)||void 0===l?void 0:l.paramBody)||void 0===s?void 0:s[e])?m:"")})),this.form.get("paramBody").updateValueAndValidity()}},t.prototype.isJsonString=function(t){try{JSON.parse(t)}catch(t){return!1}return!0},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(null,t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ct}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),t=J([e.Component({selector:"lib-general-information-line",template:'<form autocomplete="off"\r\n\t[formGroup]="form">\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100">\r\n\t\t\t<mat-label class="asterix--after">Message Type</mat-label>\r\n\r\n\t\t\t<mat-select placeholder="Select message type"\r\n\t\t\t\tformControlName="channel">\r\n\t\t\t\t<mat-option *ngFor="let option of msgTypeWAOption"\r\n\t\t\t\t\t[value]="option.code"\r\n\t\t\t\t\t(click)="formReset()">\r\n\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.channel">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'channel\').touched \r\n\t\t\t\t\t&& form.get(\'channel\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100"\r\n\t\t\tstyle="margin-bottom: 20;">\r\n\t\t\t<mat-label class="asterix--after">From</mat-label>\r\n\r\n\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\tformControlName="from"\r\n\t\t\t\tplaceholder="Select from"\r\n\t\t\t\t[complete]="isHaveNextAccountOption === false"\r\n\t\t\t\t[compareWith]="accountSelectedDisplay"\r\n\t\t\t\t(infiniteScroll)="getNextAccountBatch()"\r\n\t\t\t\t(selectionChange)="getTemplateOptionService($event.value)">\r\n\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t[currentValue]="form?.get(\'from\').value?.name"\r\n\t\t\t\t\t\t(searchRes)="updateSearchAccount($event)"></lib-search>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<mat-option *ngFor="let option of accountOption"\r\n\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t{{ option.name + \' (\' + option.accountNo + \')\' }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t\t<mat-option *ngIf="isLoadingAccountOption">Loading...</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.from">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'from\').touched \r\n\t\t\t\t\t&& form.get(\'from\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="isText">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always">\r\n\t\t\t\t<mat-label class="asterix--after">Text</mat-label>\r\n\r\n\t\t\t\t<textarea matInput\r\n\t\t\t\t\trows="6"\r\n\t\t\t\t\tcols="50"\r\n\t\t\t\t\tcdkTextareaAutosize\r\n\t\t\t\t\tcdkAutosizeMinRows="2"\r\n\t\t\t\t\tcdkAutosizeMaxRows="15"\r\n\t\t\t\t\tformControlName="text"\r\n\t\t\t\t\tplaceholder="Enter text"\r\n\t\t\t\t\t#autosize="cdkTextareaAutosize"></textarea>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.text">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'text\').touched \r\n\t\t\t\t\t\t&& form.get(\'text\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<ng-container *ngIf="isTemplate">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always"\r\n\t\t\t\tclass="w-100">\r\n\t\t\t\t<mat-label class="asterix--after">Template</mat-label>\r\n\r\n\t\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\t\tformControlName="template"\r\n\t\t\t\t\tplaceholder="Select template"\r\n\t\t\t\t\t[complete]="isHaveNextTemplateOption === false"\r\n\t\t\t\t\t[compareWith]="templateSelectedDisplay"\r\n\t\t\t\t\t(infiniteScroll)="getNextTemplateBatch()"\r\n\t\t\t\t\t(selectionChange)="updateTemplate($event.value)">\r\n\t\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<mat-option *ngFor="let option of templateOption"\r\n\t\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t\t<mat-option *ngIf="isLoadingTemplateOption">Loading...</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.template">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'template\').touched \r\n\t\t\t\t\t\t&& form.get(\'template\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\r\n\t\t<ng-container *ngIf="getParamBody?.length > 0">\r\n\t\t\t<p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n\t\t\t<div *ngFor="\r\n\t\t\t\t\tlet param of getParamBody;\r\n\t\t\t\t\tlet paramBodyIndex = index\r\n\t\t\t\t"\r\n\t\t\t\tclass="form-group">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="text"\r\n\t\t\t\t\t\t[placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n\t\t\t\t\t\t[formControl]="param.get(\'name\')" />\r\n\t\t\t\t</mat-form-field>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.asterix--after:after{content:"*";color:red}']})],t)}(),te=function(){function t(t){this.apiAdapterService=t,this.msgTypeWAOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.isHaveTemplateParam=!1,this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.msgTypeWAOption=ht.filter((function(t){return"TEXT"===t.code||"TEMPLATE"===t.code})),this.validationMessages=Nt,this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("SMS"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),from:new m.FormControl(null,m.Validators.required),text:new m.FormControl(null,m.Validators.required),template:new m.FormControl(null,m.Validators.required),paramBody:new m.FormArray([],m.Validators.required),isUpload:new m.FormControl(!1),fileId:new m.FormControl("")}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g,f;0!==Object.entries(this.getCampaignStorage).length&&"SMS"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("from").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.from),this.form.get("text").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.text),this.form.get("template").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.template),this.form.get("isUpload").setValue(null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.isUpload),this.form.get("fileId").setValue(null===(g=null===(u=this.getCampaignStorage)||void 0===u?void 0:u.generalInformation)||void 0===g?void 0:g.form.fileId),this.isHaveTemplateParam=this.form.get("isUpload").value,this.getTemplateOptionService(null,null===(f=this.form.get("template").value)||void 0===f?void 0:f.name))},Object.defineProperty(t.prototype,"getIsTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();this.form.get("channel").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.getIsTemplate?(this.form.get("template").setValidators(m.Validators.required),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("template").updateValueAndValidity(),this.form.get("paramBody").updateValueAndValidity()):(this.form.get("text").setValidators(m.Validators.required),this.form.get("text").updateValueAndValidity())},t.prototype.formReset=function(t){void 0===t&&(t=!1),this.form.get("text").reset(),this.form.get("template").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","SMS","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?Z(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r,i,o=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var l=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","SMS","string"),this.initParam("filter",e,"string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string"),this.initParam("wabaId",(i=null===(r=this.form.get("from").value)||void 0===r?void 0:r.wabaId,null!=i?i:""),"string")];this.isReadOnlyMode&&l.push(this.initParam("summary",!0,"string"));var s=this.apiAdapterService.executeApiRequest(l,"/message/template","GET").subscribe((function(t){var e;o.templateOption=n?Z(o.templateOption,t.data):t.data,o.isHaveNextTemplateOption=t.haveNext,o.isLoadingTemplateOption=!1;var a=null===(e=o.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=o.form.get("template").value)||void 0===e?void 0:e.ID)}));if(a){if(o.form.get("template").setValue(a),o.form.get("isUpload").value)return o.updateDownloadCSV(o.form.get("isUpload").value);o.updateTemplate(o.form.get("template").value)}}));this.subscribers.push(s)},t.prototype.initParameter=function(t){return void 0===t&&(t=""),new m.FormGroup({name:new m.FormControl({value:t,disabled:this.isReadOnlyMode||["UnsubscribeAccount"].includes(t)},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(t);this.form.get("paramBody").push(e)},t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o=this;if(t){this.isHaveTemplateParam=(null===(e=t.body.examples)||void 0===e?void 0:e.length)>0,(null===(n=t.body.examples)||void 0===n?void 0:n.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").updateValueAndValidity();var l=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form;null===(i=t.body.examples)||void 0===i||i.forEach((function(t,e){var n,a,r,i,s,d,m,c=null!=(m=null!=(i=null===(r=null===(a=null===(n=l)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(d=null===(s=l)||void 0===s?void 0:s.paramBody)||void 0===d?void 0:d[e])?m:"";["UnsubscribeAccount"].includes(t)&&(c=t),o.addParamBody(c)}))}},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService("",t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.updateDownloadCSV=function(t){if(this.form.get("isUpload").setValue(t),t)return this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").clearValidators(),void this.form.get("paramBody").updateValueAndValidity();this.updateTemplate(this.form.get("template").value)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ct}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),t=J([e.Component({selector:"lib-general-information-sms",template:'<form autocomplete="off"\r\n\t[formGroup]="form">\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100">\r\n\t\t\t<mat-label class="asterix--after">Message Type</mat-label>\r\n\r\n\t\t\t<mat-select placeholder="Select message type"\r\n\t\t\t\tformControlName="channel">\r\n\t\t\t\t<mat-option *ngFor="let option of msgTypeWAOption"\r\n\t\t\t\t\t[value]="option.code"\r\n\t\t\t\t\t(click)="formReset()">\r\n\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.channel">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'channel\').touched \r\n\t\t\t\t\t&& form.get(\'channel\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100"\r\n\t\t\tstyle="margin-bottom: 20;">\r\n\t\t\t<mat-label class="asterix--after">From</mat-label>\r\n\r\n\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\tformControlName="from"\r\n\t\t\t\tplaceholder="Select from"\r\n\t\t\t\t[complete]="isHaveNextAccountOption === false"\r\n\t\t\t\t[compareWith]="accountSelectedDisplay"\r\n\t\t\t\t(infiniteScroll)="getNextAccountBatch()"\r\n\t\t\t\t(selectionChange)="getTemplateOptionService($event.value)">\r\n\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t[currentValue]="form?.get(\'from\').value?.name"\r\n\t\t\t\t\t\t(searchRes)="updateSearchAccount($event)"></lib-search>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<mat-option *ngFor="let option of accountOption"\r\n\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t{{ option.name + \' (\' + option.accountNo + \')\' }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t\t<mat-option *ngIf="isLoadingAccountOption">Loading...</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.from">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'from\').touched \r\n\t\t\t\t\t&& form.get(\'from\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="form.get(\'channel\').value === \'TEXT\'">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always">\r\n\t\t\t\t<mat-label class="asterix--after">Message</mat-label>\r\n\r\n\t\t\t\t<textarea matInput\r\n\t\t\t\t\trows="6"\r\n\t\t\t\t\tcols="50"\r\n\t\t\t\t\tcdkTextareaAutosize\r\n\t\t\t\t\tcdkAutosizeMinRows="2"\r\n\t\t\t\t\tcdkAutosizeMaxRows="15"\r\n\t\t\t\t\tplaceholder="Enter text"\r\n\t\t\t\t\tformControlName="text"\r\n\t\t\t\t\t#autosize="cdkTextareaAutosize"></textarea>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.text">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'text\').touched \r\n\t\t\t\t\t&& form.get(\'text\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<ng-container *ngIf="form.get(\'channel\').value === \'TEMPLATE\'">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always"\r\n\t\t\t\tclass="w-100">\r\n\t\t\t\t<mat-label class="asterix--after">Template</mat-label>\r\n\r\n\t\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\t\tformControlName="template"\r\n\t\t\t\t\tplaceholder="Select template"\r\n\t\t\t\t\t[complete]="isHaveNextTemplateOption === false"\r\n\t\t\t\t\t[compareWith]="templateSelectedDisplay"\r\n\t\t\t\t\t(infiniteScroll)="getNextTemplateBatch()"\r\n\t\t\t\t\t(selectionChange)="updateTemplate($event.value)">\r\n\t\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t\t[currentValue]="form?.get(\'template\').value?.name"\r\n\t\t\t\t\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<mat-option *ngFor="let option of templateOption"\r\n\t\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t\t<mat-option *ngIf="isLoadingTemplateOption">Loading...</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.template">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'template\').touched \r\n\t\t\t\t\t\t\t&& form.get(\'template\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\r\n\t\t<div *ngIf="isHaveTemplateParam"\r\n\t\t\tclass="d-flex justify-content-end">\r\n\t\t\t<mat-checkbox labelPosition="before"\r\n\t\t\t\tformControlName="isUpload"\r\n\t\t\t\t(change)="updateDownloadCSV($event.checked)">\r\n\t\t\t\tUsing Download XLSX\r\n\t\t\t</mat-checkbox>\r\n\t\t</div>\r\n\r\n\t\t<ng-container *ngIf="!form.get(\'isUpload\').value && getParamBody?.length > 0">\r\n\t\t\t<p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n\t\t\t<div *ngFor="\r\n\t\t\tlet param of getParamBody;\r\n\t\t\tlet paramBodyIndex = index\r\n\t\t"\r\n\t\t\t\tclass="form-group">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="text"\r\n\t\t\t\t\t\t[placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n\t\t\t\t\t\t[formControl]="param.get(\'name\')" />\r\n\t\t\t\t</mat-form-field>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.asterix--after:after{content:"*";color:red}']})],t)}();!function(t){t.GOOGLE_MAP_API_KEY="AIzaSyCHReBe_RpzAgLTrUC5QIDyeKttQ817wRY",t.MEDIUM_TYPE_WHATSAPP="WHATSAPP",t.MEDIA_TYPE_IMAGE="IMAGE",t.MEDIA_TYPE_VIDEO="VIDEO",t.MEDIA_TYPE_DOCUMENT="DOCUMENT",t.MEDIA_TYPE_LOCATION="LOCATION",t.SCHEDULER_TYPE_NOW="NOW",t.SCHEDULER_TYPE_SINGLE="SINGLE",t.SCHEDULER_TYPE_MULTIPLE="MULTIPLE"}(Et||(Et={}));var ee=function(){function t(t,n,a,r){this.ngZone=t,this.mapsAPILoader=n,this.apiAdapterService=a,this.toastr=r,this.msgTypeWAOption=[],this.mediaTypeOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.isHaveTemplateParam=!1,this.isShowParameter=!1,this.extFileAccepted="image/*",this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.templates=[{label:"Create New",value:!1},{label:"Use existing template",value:!0}],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.msgTypeWAOption=ht,this.mediaTypeOption=xt,this.categoryOption=kt(rt),this.validationMessages=Pt,this.maps={zoom:15,latitude:null,longitude:null,isDraggable:!0,isDoubleClickZoom:!0},this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("WA"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),media:new m.FormControl(null),from:new m.FormControl(null),text:new m.FormControl(null),fileName:new m.FormControl(null),targetURL:new m.FormControl(null),fileType:new m.FormControl(null),file:new m.FormControl(null),latitude:new m.FormControl(null),longitude:new m.FormControl(null),template:new m.FormControl(null),paramHeader:new m.FormArray([],m.Validators.required),paramBody:new m.FormArray([],m.Validators.required),paramButton:new m.FormArray([],m.Validators.required),otpValue:new m.FormControl(""),isUpload:new m.FormControl(!1),fileId:new m.FormControl(""),category:new m.FormControl(null),product:new m.FormControl(null),catalogue:new m.FormControl(null),body:new m.FormControl(null),isUseExistingTemplate:new m.FormControl(!1),isNeedSave:new m.FormControl(!1)}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M;0!==Object.entries(this.getCampaignStorage).length&&"WA"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("media").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.media),this.form.get("from").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.from),this.form.get("text").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.text),this.form.get("targetURL").setValue(null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.targetURL),this.form.get("fileName").setValue(null!=(f=null===(g=null===(u=this.getCampaignStorage)||void 0===u?void 0:u.generalInformation)||void 0===g?void 0:g.form.fileName)?f:this.form.get("targetURL").value),this.form.get("template").setValue(null===(h=null===(v=this.getCampaignStorage)||void 0===v?void 0:v.generalInformation)||void 0===h?void 0:h.form.template),this.form.get("isUpload").setValue(null===(y=null===(b=this.getCampaignStorage)||void 0===b?void 0:b.generalInformation)||void 0===y?void 0:y.form.isUpload),this.form.get("fileId").setValue(null===(S=null===(x=this.getCampaignStorage)||void 0===x?void 0:x.generalInformation)||void 0===S?void 0:S.form.fileId),this.form.get("otpValue").setValue(null===(C=null===(w=this.getCampaignStorage)||void 0===w?void 0:w.generalInformation)||void 0===C?void 0:C.form.otpValue),this.form.get("isUseExistingTemplate").setValue(!!(null===(A=null===(T=null===(I=this.getCampaignStorage)||void 0===I?void 0:I.generalInformation)||void 0===T?void 0:T.form)||void 0===A?void 0:A.isPrevTemplate)),this.form.get("isNeedSave").setValue(!!(null===(P=null===(V=null===(O=this.getCampaignStorage)||void 0===O?void 0:O.generalInformation)||void 0===V?void 0:V.form)||void 0===P?void 0:P.isNeedSave)),this.isHaveTemplateParam=this.form.get("isUpload").value,this.getTemplateOptionService(null,null===(M=this.form.get("template").value)||void 0===M?void 0:M.name))},t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();this.form.get("channel").setValidators(m.Validators.required),this.getIsText?(this.form.get("from").setValidators(m.Validators.required),this.form.get("text").setValidators(m.Validators.required),this.form.get("from").updateValueAndValidity(),this.form.get("text").updateValueAndValidity()):this.getIsMedia?(this.form.get("media").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.form.get("fileName").setValidators(m.Validators.required),this.form.get("media").updateValueAndValidity(),this.form.get("from").updateValueAndValidity(),this.form.get("fileName").updateValueAndValidity()):this.getIsTemplate?(this.form.get("from").setValidators(m.Validators.required),this.form.get("template").setValidators(m.Validators.required),this.form.get("paramHeader").setValidators(m.Validators.required),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("paramButton").setValidators(m.Validators.required),this.form.get("from").updateValueAndValidity(),this.form.get("template").updateValueAndValidity(),this.form.get("paramHeader").updateValueAndValidity(),this.form.get("paramBody").updateValueAndValidity(),this.form.get("paramButton").updateValueAndValidity()):this.getIsCatalogue?(this.form.get("from").setValidators(m.Validators.required),this.form.get("category").setValidators(m.Validators.required),this.form.get("catalogue").setValidators(m.Validators.required),this.form.get("product").setValidators(m.Validators.required),this.form.get("body").setValidators(m.Validators.maxLength(100)),this.form.get("from").updateValueAndValidity(),this.form.get("category").updateValueAndValidity(),this.form.get("catalogue").updateValueAndValidity(),this.form.get("product").updateValueAndValidity(),this.form.get("body").updateValueAndValidity()):(this.getIsUtility,this.form.get("from").setValidators(m.Validators.required),this.form.get("text").setValidators(m.Validators.required),this.form.get("from").updateValueAndValidity(),this.form.get("text").updateValueAndValidity())},t.prototype.formReset=function(t){void 0===t&&(t=!1),t||(this.form.get("media").reset(),this.form.get("from").reset()),this.form.get("text").reset(),this.form.get("fileName").reset(),this.form.get("targetURL").reset(),this.form.get("fileType").reset(),this.form.get("file").reset(),this.form.get("latitude").reset(),this.form.get("longitude").reset(),this.form.get("template").reset(),this.form.get("category").reset(),this.form.get("product").reset(),this.form.get("catalogue").reset(),this.form.get("body").reset(),this.form.get("otpValue").reset(),this.form.get("paramHeader").controls=[],this.form.get("paramHeader").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramButton").controls=[],this.form.get("paramButton").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","WA","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?Z(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r,i,o,l=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var s=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","WA","string"),this.initParam("filter",e,"string"),this.initParam("status","APPROVED","string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string"),this.initParam("wabaId",(i=null===(r=this.form.get("from").value)||void 0===r?void 0:r.wabaId,null!=i?i:""),"string")];this.isReadOnlyMode&&s.push(this.initParam("summary",!0,"string")),"utility"===(null===(o=this.form.value)||void 0===o?void 0:o.channel)&&s.push(this.initParam("isDirectSend",!0,"string"));var d=this.apiAdapterService.executeApiRequest(s,"/message/template","GET").subscribe((function(t){var e;l.templateOption=n?Z(l.templateOption,t.data):t.data,l.isHaveNextTemplateOption=t.haveNext,l.isLoadingTemplateOption=!1;var a=null===(e=l.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=l.form.get("template").value)||void 0===e?void 0:e.ID)}));if(a&&(l.form.get("template").setValue(a),l.form.get("isUpload").value))return l.updateDownloadCSV(l.form.get("isUpload").value);l.updateTemplate(l.form.get("template").value)}));this.subscribers.push(d)},t.prototype.initParameter=function(t,e){return void 0===t&&(t=!1),void 0===e&&(e=""),t?new m.FormGroup({name:new m.FormArray([],m.Validators.required)}):new m.FormGroup({name:new m.FormControl({value:e,disabled:this.isReadOnlyMode||["$UnsubscribeAccount"].includes(e)},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamHeader",{get:function(){return this.form.get("paramHeader").controls},enumerable:!0,configurable:!0}),t.prototype.addParamHeader=function(t){void 0===t&&(t="");var e=this.initParameter(!1,t);this.form.get("paramHeader").push(e)},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(!1,t);this.form.get("paramBody").push(e)},Object.defineProperty(t.prototype,"getButton",{get:function(){return this.form.get("paramButton").controls},enumerable:!0,configurable:!0}),t.prototype.getParamButton=function(t){return this.form.get("paramButton").controls[t].get("name").controls},t.prototype.addParamButton=function(){var t=this.initParameter(!0);this.form.get("paramButton").push(t)},Object.defineProperty(t.prototype,"getIsText",{get:function(){var t;return this.form.get("channel").value&&"text"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsMedia",{get:function(){var t;return this.form.get("channel").value&&"media"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsCatalogue",{get:function(){var t;return this.form.get("channel").value&&"catalogue"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsUtility",{get:function(){var t;return this.form.get("channel").value&&"utility"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.onFileSelected=function(t){var e=t.target.files,n=this.extFileAccepted.split("/"),a=n[0];0!==e.length&&("application/pdf"===this.extFileAccepted&&(a=n[1]),e[0].type.includes(a)?e[0].size>1e7?this.toastr.error("Upload media failed, max size 10mb"):(this.form.get("file").setValue(e[0]),this.form.get("fileType").setValue("image"),this.form.get("fileName").setValue(e[0].name),this.form.get("targetURL").setValidators(m.Validators.required),this.form.get("targetURL").updateValueAndValidity(),e[0].type.indexOf("video")>-1&&this.form.get("fileType").setValue("video"),this.uploadMediaService()):this.toastr.error("Sorry, the file you are uploading is not allowed"))},t.prototype.uploadMediaService=function(){var t=this,e=[{name:"file",value:this.form.get("file").value,in:"formData",type:"object"}],n=this.apiAdapterService.executeApiRequest(e,"/message/media","POST").subscribe((function(e){t.form.get("targetURL").clearValidators(),t.form.get("targetURL").updateValueAndValidity(),t.form.get("targetURL").setValue(e.data.targetURL),t.form.get("file").reset(),t.toastr.success("Upload media success")}));this.subscribers.push(n)},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o,l,s,d,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M,N,D,L,F,E,R=this;if(this.isShowParameter=!1,t){this.isHaveTemplateParam=(null===(e=t.header.examples)||void 0===e?void 0:e.length)>0||(null===(n=t.body.examples)||void 0===n?void 0:n.length)>0||(null===(a=t.buttons)||void 0===a?void 0:a.length)>0,["image","video","document"].includes(null===(o=null===(i=null===(r=t)||void 0===r?void 0:r.header)||void 0===i?void 0:i.type)||void 0===o?void 0:o.toLowerCase())&&(this.form.get("fileName").setValue(null!=(u=null!=(d=null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.fileName)?d:null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.targetURL)?u:t.header.url),this.form.get("targetURL").setValue(null!=(v=null===(f=null===(g=this.getCampaignStorage)||void 0===g?void 0:g.generalInformation)||void 0===f?void 0:f.form.targetURL)?v:t.header.url),this.fileTypeChange(null===(y=null===(b=null===(h=t)||void 0===h?void 0:h.header)||void 0===b?void 0:b.type)||void 0===y?void 0:y.toLowerCase())),(null===(x=t.header.examples)||void 0===x?void 0:x.length)>0?this.form.get("paramHeader").setValidators(m.Validators.required):this.form.get("paramHeader").clearValidators(),(null===(S=t.body.examples)||void 0===S?void 0:S.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),(null===(w=t.buttons)||void 0===w?void 0:w.length)>0?this.form.get("paramButton").setValidators(m.Validators.required):this.form.get("paramButton").clearValidators(),this.form.get("paramHeader").controls=[],this.form.get("paramHeader").reset(),this.form.get("paramHeader").updateValueAndValidity(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").updateValueAndValidity(),this.form.get("paramButton").controls=[],this.form.get("paramButton").reset(),this.form.get("paramButton").updateValueAndValidity(),this.form.get("otpValue").setValue(""),this.form.get("otpValue").clearValidators(),this.form.get("otpValue").updateValueAndValidity();var k=null===(I=null===(C=this.getCampaignStorage)||void 0===C?void 0:C.generalInformation)||void 0===I?void 0:I.form;"AUTHENTICATION"===t.category&&(this.form.get("otpValue").setValue(null!=(D=null!=(A=null===(T=k)||void 0===T?void 0:T.otpValue)?A:null===(N=Z(null!=(M=null===(P=null===(V=null===(O=k)||void 0===O?void 0:O.template)||void 0===V?void 0:V.body)||void 0===P?void 0:P.examples)?M:[]))||void 0===N?void 0:N.pop())?D:""),this.form.get("otpValue").setValidators(m.Validators.required),this.form.get("otpValue").updateValueAndValidity()),null===(L=t.header.examples)||void 0===L||L.forEach((function(t,e){var n,a,r,i,o,l,s;R.addParamHeader(null!=(s=null!=(i=null===(r=null===(a=null===(n=k)||void 0===n?void 0:n.paramHeader)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(l=null===(o=k)||void 0===o?void 0:o.paramHeader)||void 0===l?void 0:l[e])?s:"")})),null===(F=t.body.examples)||void 0===F||F.forEach((function(t,e){var n,a,r,i,o,l,s,d=null!=(s=null!=(i=null===(r=null===(a=null===(n=k)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(l=null===(o=k)||void 0===o?void 0:o.paramBody)||void 0===l?void 0:l[e])?s:"";["$UnsubscribeAccount"].includes(t)&&(d=t),R.addParamBody(d)})),null===(E=t.buttons)||void 0===E||E.forEach((function(t,e){var n;R.addParamButton();var a=R.getButton;(null===(n=t.examples)||void 0===n?void 0:n.length)>0?t.examples.forEach((function(n,r){var i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x=null;"FLOW"===t.type?x=R.initParameter(!1,t.flow_id):(R.isShowParameter=!0,x=R.initParameter(!1,null!=(y=null!=(f=null!=(m=null===(d=null===(s=null===(l=null===(o=null===(i=k)||void 0===i?void 0:i.paramButton)||void 0===o?void 0:o[e])||void 0===l?void 0:l.name)||void 0===s?void 0:s[r])||void 0===d?void 0:d.name)?m:null===(g=null===(u=null===(p=null===(c=k)||void 0===c?void 0:c.paramButton)||void 0===p?void 0:p[e])||void 0===u?void 0:u.name)||void 0===g?void 0:g[r])?f:null===(b=null===(h=null===(v=k)||void 0===v?void 0:v.paramButton)||void 0===h?void 0:h[e])||void 0===b?void 0:b[r])?y:"")),a[a.length-1].get("name").push(x)})):(a[a.length-1].get("name").clearValidators(),a[a.length-1].get("name").updateValueAndValidity())}))}},t.prototype.updateMediaType=function(t){t===Et.MEDIA_TYPE_LOCATION&&this.initMaps,this.formReset(!0),this.fileTypeChange(t.toLowerCase())},t.prototype.fileTypeChange=function(t){this.extFileAccepted="image/*",t===Et.MEDIA_TYPE_VIDEO.toLowerCase()?this.extFileAccepted="video/*":t===Et.MEDIA_TYPE_DOCUMENT.toLowerCase()&&(this.extFileAccepted="application/pdf")},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(null,t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.initMaps=function(){var t=this;this.mapsAPILoader.load().then((function(){t.setCurrentLocation(),t.geoCoder=new google.maps.Geocoder;var e=new google.maps.places.Autocomplete(t.mapSearchRef.nativeElement);e.addListener("place_changed",(function(){t.ngZone.run((function(){var n=e.getPlace();n.geometry&&(t.maps.latitude=n.geometry.location.lat(),t.maps.longitude=n.geometry.location.lng(),t.form.get("latitude").setValue(t.maps.latitude),t.form.get("longitude").setValue(t.maps.longitude))}))}))}))},t.prototype.setCurrentLocation=function(){var t=this;"geolocation"in navigator&&navigator.geolocation.getCurrentPosition((function(e){t.form.get("longitude").value||t.form.get("latitude").value||(t.maps.latitude=e.coords.latitude,t.maps.longitude=e.coords.longitude,t.form.get("latitude").setValue(t.maps.latitude),t.form.get("longitude").setValue(t.maps.longitude))}))},t.prototype.markerDragEnd=function(t){t.latLng&&(this.maps.latitude=t.latLng.lat(),this.maps.longitude=t.latLng.lng(),this.form.get("latitude").setValue(this.maps.latitude),this.form.get("longitude").setValue(this.maps.longitude))},t.prototype.updateDownloadCSV=function(t){if(this.form.get("isUpload").setValue(t),t)return this.form.get("paramHeader").controls=[],this.form.get("paramHeader").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramButton").controls=[],this.form.get("paramButton").reset(),this.form.get("paramHeader").clearValidators(),this.form.get("paramBody").clearValidators(),this.form.get("paramButton").clearValidators(),this.form.get("paramHeader").updateValueAndValidity(),this.form.get("paramBody").updateValueAndValidity(),this.form.get("paramButton").updateValueAndValidity(),this.form.get("otpValue").reset(),this.form.get("otpValue").clearValidators(),void this.form.get("otpValue").updateValueAndValidity();this.updateTemplate(this.form.get("template").value)},t.prototype.handleChangeTemplate=function(t){t?(this.form.get("template").setValidators(m.Validators.required),this.form.get("text").reset(),this.form.get("text").clearValidators(),this.form.get("text").updateValueAndValidity(),this.form.get("template").updateValueAndValidity()):(this.form.get("template").reset(),this.form.get("template").clearValidators(),this.form.get("text").setValidators(m.Validators.required),this.form.get("text").updateValueAndValidity(),this.form.get("template").updateValueAndValidity())},t.prototype.handleChangeFrom=function(t){this.form.value.isUseExistingTemplate&&this.getTemplateOptionService(t)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:e.NgZone},{type:n.MapsAPILoader},{type:ct},{type:s.ToastrService}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),J([e.ViewChild("mapSearch")],t.prototype,"mapSearchRef",void 0),t=J([e.Component({selector:"lib-general-information-wa",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',styles:['.asterix--after:after{content:"*";color:red}']})],t)}();var ne=function(){function t(t){this.apiAdapterService=t,this.isHaveNextTemplateOption=$({},Tt),this.isLoadingTemplateOption=$({},It),this.templateOption=$({},Ot),this.isLoadingAccountOption=$({},It),this.isHaveNextAccountOption=$({},Tt),this.accountOption=$({},Ot),this.subscribers=[],this.pageNoTemplateOption=$({},At),this.pageNoAccountOption=$({},At),this.failover=new e.EventEmitter}return t.prototype.ngOnInit=function(){var t=this;this.validationMessages=Lt,this.channelOption=Z(vt).filter((function(e){var n,a,r;return!["LINE",null===(r=null===(a=null===(n=t.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form)||void 0===r?void 0:r.medium].includes(e.value)})),this.initForm(),this.initDisable(),this.initEdit(),this.failover.emit(this.form)},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"interval",{get:function(){return this.form.get("interval")},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({active:new m.FormControl(!1,m.Validators.required),type:new m.FormControl(""),interval:new m.FormControl(null),accounts:new m.FormArray([])}),this.form.valueChanges.subscribe((function(){t.interval.touched&&0===t.interval.value&&t.form.get("interval").setErrors({intervalTime:!0}),t.failover.emit(t.form)}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m;0!==Object.entries(this.getCampaignStorage).length&&(null===(t=this.getCampaignStorage)||void 0===t?void 0:t.failover)&&(this.form.get("active").setValue(null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.failover)||void 0===n?void 0:n.active),this.form.get("type").setValue(null!=(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.failover)||void 0===r?void 0:r.type)?i:""),this.form.get("interval").setValue(null!=(s=null===(l=null===(o=this.getCampaignStorage)||void 0===o?void 0:o.failover)||void 0===l?void 0:l.interval)?s:null),this.activeChange(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.failover)||void 0===m?void 0:m.active),this.validationAccount())},t.prototype.initAccount=function(t,e){var n,a,r,i,o,l,s,d,c,p,u,g,f;return void 0===t&&(t=null),void 0===e&&(e=null),new m.FormGroup({channel:new m.FormControl(e),platform:new m.FormControl(null===(n=e)||void 0===n?void 0:n.value),accountId:new m.FormControl({value:(null===(a=t)||void 0===a?void 0:a.accountId)&&"string"==typeof(null===(r=t)||void 0===r?void 0:r.accountId)?{id:null===(i=t)||void 0===i?void 0:i.accountId,name:null===(o=t)||void 0===o?void 0:o.accountName}:(s=null===(l=t)||void 0===l?void 0:l.accountId,null!=s?s:""),disabled:this.isReadOnlyMode},m.Validators.required),accountName:new m.FormControl((c=null===(d=t)||void 0===d?void 0:d.accountName,null!=c?c:"")),subject:new m.FormControl({value:(u=null===(p=t)||void 0===p?void 0:p.subject,null!=u?u:""),disabled:this.isReadOnlyMode}),template:new m.FormControl({value:(f=null===(g=t)||void 0===g?void 0:g.template,null!=f?f:""),disabled:this.isReadOnlyMode}),paramBody:new m.FormArray([])})},Object.defineProperty(t.prototype,"getAccount",{get:function(){return this.form.get("accounts").controls},enumerable:!0,configurable:!0}),t.prototype.addAccount=function(t,e){var n,a,r,i,o,l;void 0===t&&(t=null),void 0===e&&(e=null);var s=this.initAccount(t,e);this.form.get("accounts").push(s),this.getAccountOptionService(null===(n=e)||void 0===n?void 0:n.value,null!=(r=null===(a=t)||void 0===a?void 0:a.accountName)?r:""),this.getTemplateOptionService(null===(i=e)||void 0===i?void 0:i.value,{},null===(l=null===(o=t)||void 0===o?void 0:o.template)||void 0===l?void 0:l.name)},t.prototype.initParameter=function(){return new m.FormGroup({name:new m.FormControl("",m.Validators.required)})},t.prototype.getParamBody=function(t){return t.get("paramBody").controls},t.prototype.addParamBody=function(t){var e=this.initParameter();t.get("paramBody").push(e)},t.prototype.deleteParamBody=function(t,e){t.get("paramBody").removeAt(e)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e,n){var a=this;void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingAccountOption[t]=!0;var r=[this.initParam("pageNo",this.pageNoAccountOption[t],"number"),this.initParam("rowPerPage",20,"number"),this.initParam("status","APPROVED","string"),this.initParam("platform",t,"string"),this.initParam("filter",e,"string")],i=this.apiAdapterService.executeApiRequest(r,"/admin/account","GET").subscribe((function(e){e.data&&(a.accountOption[t]=n?Z(a.accountOption[t],e.data):e.data,a.isHaveNextAccountOption[t]=e.haveNext,a.isLoadingAccountOption[t]=!1)}));this.subscribers.push(i)},t.prototype.getTemplateOptionService=function(t,e,n,a){var r,i,o,l,s=this;void 0===n&&(n=""),void 0===a&&(a=!1),this.isLoadingTemplateOption[t]=!0;var d=[this.initParam("pageNo",this.pageNoTemplateOption[t],"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform",t,"string"),this.initParam("filter",n,"string"),this.initParam("clientId",(i=null===(r=e)||void 0===r?void 0:r.clientId,null!=i?i:""),"string"),this.initParam("wabaId",(l=null===(o=e)||void 0===o?void 0:o.wabaId,null!=l?l:""),"string")];"WA"===t&&d.push(this.initParam("status","APPROVED","string"));var m=this.apiAdapterService.executeApiRequest(d,"/message/template","GET").subscribe((function(e){s.templateOption[t]=a?Z(s.templateOption[t],e.data):e.data,s.isHaveNextTemplateOption[t]=e.haveNext,s.isLoadingTemplateOption[t]=!1}));this.subscribers.push(m)},t.prototype.getNextAccountBatch=function(t){this.isHaveNextAccountOption[t]&&(this.pageNoAccountOption[t]+=1,this.getAccountOptionService(t,"",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.getNextTemplateBatch=function(t,e){this.isHaveNextTemplateOption[t]&&(this.pageNoTemplateOption[t]+=1,this.getTemplateOptionService(t,e,"",!0))},t.prototype.updateSearch=function(t,e,n){this.pageNoTemplateOption[e]=1,this.getTemplateOptionService(e,n,t)},t.prototype.updateSearchAccount=function(t,e){this.pageNoAccountOption[e]=1,this.getAccountOptionService(e,t)},t.prototype.activeChange=function(t){var e,n,a,r,i,o,l=this;if(this.form.get("type").setValue(null!=(a=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.failover)||void 0===n?void 0:n.type)?a:""),this.form.get("type").setValidators(m.Validators.required),this.form.get("type").updateValueAndValidity(),t){var s=null===(o=null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.failover)||void 0===i?void 0:i.accounts)||void 0===o?void 0:o.filter((function(t){var e,n,a;return t.platform!==(null===(a=null===(n=null===(e=l.getCampaignStorage)||void 0===e?void 0:e.generalInformation)||void 0===n?void 0:n.form)||void 0===a?void 0:a.medium)}));return s?(s.map((function(t){return l.addAccount(t,l.channelOption.find((function(e){return e.value===t.platform})))})),void this.channelOption.filter((function(t){return!s.find((function(e){return e.platform===t.value}))})).map((function(t){return l.addAccount({},t)}))):void this.channelOption.map((function(t){return l.addAccount({},t)}))}this.form.get("type").clearValidators(),this.form.get("type").updateValueAndValidity(),this.form.get("accounts").controls=[],this.form.get("accounts").reset(),this.form.get("accounts").updateValueAndValidity(),this.typeChange("Status")},t.prototype.typeChange=function(t){var e,n,a;if("Time"===t)return this.form.get("interval").setValue(null!=(a=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.failover)||void 0===n?void 0:n.interval)?a:null),this.form.get("interval").setValidators([m.Validators.required,function(t){if(!t.value)return null;var e=Number(t.value);return Number.isNaN(e)||e%1!=0||e<1?{intervalTime:!0}:null}]),void this.form.get("interval").updateValueAndValidity();this.form.get("interval").clearValidators(),this.form.get("interval").updateValueAndValidity()},t.prototype.validationAccount=function(t,e){var n,a,r;void 0===t&&(t=null),void 0===e&&(e=null),null===(n=e)||void 0===n||n.get("accountName").setValue(null!=(r=null===(a=this.accountOption[e.get("platform").value].find((function(e){var n;return e.id===(null===(n=t)||void 0===n?void 0:n.id)})))||void 0===a?void 0:a.name)?r:"");var i=this.getAccount.filter((function(t){return t.get("accountId").value}));this.getAccount.forEach((function(t){var e;t.get("accountId").setValidators(m.Validators.required),t.get("subject").setValidators(m.Validators.required),t.get("template").setValidators(m.Validators.required),!t.get("accountId").value&&(null===(e=i)||void 0===e?void 0:e.length)>0?(t.get("accountId").clearValidators(),t.get("subject").setValue(""),t.get("subject").clearValidators(),t.get("template").setValue(""),t.get("template").clearValidators()):["WA","SMS","VOICE"].includes(t.get("platform").value)&&t.get("subject").clearValidators(),t.get("accountId").updateValueAndValidity(),t.get("subject").updateValueAndValidity(),t.get("template").updateValueAndValidity()})),e&&this.getTemplateOptionService(e.get("platform").value,e.get("accountId").value)},t.prototype.drop=function(t){d.moveItemInArray(this.getAccount,t.previousIndex,t.currentIndex),this.failover.emit(this.form)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ct}]},J([e.Output()],t.prototype,"failover",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),t=J([e.Component({selector:"lib-failover-mechanism",template:'<form [formGroup]="form"\r\n  class="failover-mechanism">\r\n  <mat-slide-toggle class="failover-activated mb-3"\r\n    formControlName="active"\r\n    (change)="activeChange($event.checked)">\r\n    <p class="font-18px font-PoppinsBold mb-0">Failover Mechanism</p>\r\n  </mat-slide-toggle>\r\n\r\n  <ng-container *ngIf="form.get(\'active\').value">\r\n    <p>Switch to a backup communication channel if the primary channel experiences interference or failure.</p>\r\n\r\n    <p class="font-16px font-PoppinsBold asterix--after mt-4 mb-1">Main Rules</p>\r\n\r\n    <p>Set rule for failover main trigger</p>\r\n\r\n    <div class=\'d-flex\'>\r\n      <mat-radio-group class="main-rule-type"\r\n        formControlName="type"\r\n        (change)="typeChange($event.value)">\r\n        <mat-radio-button value="Status">Delivery Status</mat-radio-button>\r\n        <mat-radio-button value="Time">Waiting Time</mat-radio-button>\r\n      </mat-radio-group>\r\n\r\n      <div class=\'information\'>\r\n        <mat-icon svgIcon="information"\r\n          class="mr-2">\r\n        </mat-icon>\r\n        <ol class="tooltip-rules">\r\n          <li class="mb-3">\r\n            If <strong>Delivery Status</strong> is selected, failover messages will be triggered if the\r\n            previous message has failed to deliver.\r\n          </li>\r\n\r\n          <li>\r\n            If <strong>Waiting Time</strong> is selected, failover messages will be triggered according to\r\n            the configured time. Counting will start when a message is sent. If the time is reached before\r\n            the message is delivered/read, then a failover message will be triggered.\r\n          </li>\r\n        </ol>\r\n      </div>\r\n\r\n    </div>\r\n  </ng-container>\r\n\r\n  <div *ngIf="form.get(\'type\').value === \'Time\'"\r\n    class="form-group w-25 my-3">\r\n    <div class=\'d-flex align-items-baseline gap-2\'>\r\n      <mat-form-field appearance="outline"\r\n        floatLabel="always"\r\n        class="w-100">\r\n        <mat-label class="asterix--after">Interval Time</mat-label>\r\n\r\n        <input matInput\r\n          type="number"\r\n          class="text-right"\r\n          formControlName="interval"\r\n          placeholder="Enter Interval Time">\r\n\r\n      </mat-form-field>\r\n      minute(s)\r\n    </div>\r\n\r\n    <mat-error align="start"\r\n      *ngFor="let validation of validationMessages.interval">\r\n      <p class="font-12px mb-0"\r\n        *ngIf="form.get(\'interval\').touched\r\n\t\t\t\t\t\t\t&& form.get(\'interval\').hasError(validation.type)">\r\n        {{ validation.message }}\r\n      </p>\r\n    </mat-error>\r\n  </div>\r\n\r\n  <div *ngIf="form.get(\'active\').value"\r\n    cdkDropList\r\n    class="mt-3"\r\n    formArrayName="accounts"\r\n    (cdkDropListDropped)="drop($event)">\r\n    <div *ngFor="let account of getAccount; let accountIndex = index"\r\n      cdkDrag\r\n      cdkDragHandle>\r\n      <div *ngIf="account.get(\'channel\').value"\r\n        class="d-flex align-items-center gap-2">\r\n        <div class="accounts-card w-50 mb-3 px-3 pt-3">\r\n          <div class="form-group w-75">\r\n            <mat-form-field appearance="outline"\r\n              floatLabel="always"\r\n              class="account-option w-100">\r\n              <mat-label class="asterix--after">\r\n                {{ account.get(\'channel\').value?.label }}\r\n              </mat-label>\r\n\r\n              <mat-icon class="icon-menu"\r\n                [svgIcon]="account.get(\'channel\').value?.inputSvgIcon"></mat-icon>\r\n\r\n              <mat-select matSelectInfiniteScroll\r\n                placeholder="--- Select Account ---"\r\n                [formControl]="account.get(\'accountId\')"\r\n                [complete]="isHaveNextAccountOption[account.get(\'platform\').value] === false"\r\n                [compareWith]="accountSelectedDisplay"\r\n                (infiniteScroll)="getNextAccountBatch(account.get(\'platform\').value)"\r\n                (selectionChange)="validationAccount($event.value, account)">\r\n                <div style="margin: 20px">\r\n                  <lib-search [placeholder]="\'Search\'"\r\n                    [currentValue]="account?.get(\'accountId\').value?.name"\r\n                    (searchRes)="updateSearchAccount($event, account.get(\'platform\').value)"></lib-search>\r\n                </div>\r\n\r\n                <mat-option value=""> --- Select Account --- </mat-option>\r\n                <mat-option *ngFor="let option of accountOption[account.get(\'platform\').value]"\r\n                  [value]="option">\r\n                  {{ option.name + \' (\' + option.accountNo + \')\' }}\r\n                </mat-option>\r\n\r\n                <mat-option *ngIf="isLoadingAccountOption[account.get(\'platform\').value]">Loading...</mat-option>\r\n              </mat-select>\r\n            </mat-form-field>\r\n\r\n            <mat-error align="start"\r\n              *ngFor="let validation of validationMessages.accountId">\r\n              <p class="font-12px mb-0"\r\n                *ngIf="account.get(\'accountId\').touched\r\n                      && account.get(\'accountId\').hasError(validation.type)">\r\n                {{ validation.message }}\r\n              </p>\r\n            </mat-error>\r\n          </div>\r\n\r\n          <ng-container *ngIf="account.get(\'accountId\').value">\r\n            <div *ngIf="account.get(\'platform\').value === \'EMAIL\'"\r\n              class="form-group w-75">\r\n              <mat-form-field appearance="outline"\r\n                floatLabel="always"\r\n                class="w-100">\r\n                <mat-label class="asterix--after">Subject</mat-label>\r\n\r\n                <input matInput\r\n                  type="text"\r\n                  placeholder="Enter Subject"\r\n                  [formControl]="account.get(\'subject\')">\r\n              </mat-form-field>\r\n\r\n              <mat-error align="start"\r\n                *ngFor="let validation of validationMessages.subject">\r\n                <p class="font-12px mb-0"\r\n                  *ngIf="account.get(\'subject\').touched\r\n                        && account.get(\'subject\').hasError(validation.type)">\r\n                  {{ validation.message }}\r\n                </p>\r\n              </mat-error>\r\n            </div>\r\n\r\n            <div *ngIf="[\'WA\', \'SMS\', \'EMAIL\'].includes(account.get(\'platform\').value)"\r\n              class="form-group w-75">\r\n              <mat-form-field appearance="outline"\r\n                floatLabel="always"\r\n                class="w-100">\r\n                <mat-label class="asterix--after">Template</mat-label>\r\n\r\n                <mat-select matSelectInfiniteScroll\r\n                  placeholder="Select template"\r\n                  [formControl]="account.get(\'template\')"\r\n                  [complete]="isHaveNextTemplateOption[account.get(\'platform\').value] === false"\r\n                  [compareWith]="templateSelectedDisplay"\r\n                  (infiniteScroll)="getNextTemplateBatch(account.get(\'platform\').value, account.get(\'accountId\').value)">\r\n                  <div style="margin: 20px">\r\n                    <lib-search [placeholder]="\'Search\'"\r\n                      [currentValue]="account.get(\'template\').value?.name"\r\n                      (searchRes)="updateSearch($event, account.get(\'platform\').value, account.get(\'accountId\').value)"></lib-search>\r\n                  </div>\r\n\r\n                  <mat-option *ngFor="let option of templateOption[account.get(\'platform\').value]"\r\n                    [value]="option">\r\n                    {{ option.name }}\r\n                  </mat-option>\r\n                  <mat-option *ngIf="isLoadingTemplateOption[account.get(\'platform\').value]">Loading...</mat-option>\r\n                </mat-select>\r\n              </mat-form-field>\r\n\r\n              <mat-error align="start"\r\n                *ngFor="let validation of validationMessages.subject">\r\n                <p class="font-12px mb-0"\r\n                  *ngIf="account.get(\'template\').touched\r\n                        && account.get(\'template\').hasError(validation.type)">\r\n                  {{ validation.message }}\r\n                </p>\r\n              </mat-error>\r\n            </div>\r\n\r\n            <ng-container *ngIf="account.get(\'platform\').value === \'VOICE\'">\r\n              <div class="form-group w-75">\r\n                <mat-form-field appearance="outline"\r\n                  floatLabel="always"\r\n                  class="w-100">\r\n                  <mat-label class="asterix--after">Template</mat-label>\r\n\r\n                  <input matInput\r\n                    type="text"\r\n                    placeholder="Enter Template"\r\n                    [formControl]="account.get(\'template\')">\r\n                </mat-form-field>\r\n\r\n                <mat-error align="start"\r\n                  *ngFor="let validation of validationMessages.subject">\r\n                  <p class="font-12px mb-0"\r\n                    *ngIf="account.get(\'template\').touched\r\n                          && account.get(\'template\').hasError(validation.type)">\r\n                    {{ validation.message }}\r\n                  </p>\r\n                </mat-error>\r\n              </div>\r\n\r\n              <div class="w-75 text-right mb-2">\r\n                <button class="btn btn-sm color-blue2"\r\n                  (click)="addParamBody(account)">\r\n                  + Add Parameter\r\n                </button>\r\n              </div>\r\n\r\n              <ng-container *ngIf="getParamBody(account)?.length > 0">\r\n                <p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n                <div *ngFor="let param of getParamBody(account); let paramBodyIndex = index"\r\n                  class="form-group d-flex align-items-center gap-1 w-75">\r\n                  <mat-form-field appearance="outline"\r\n                    floatLabel="always"\r\n                    class="w-100">\r\n                    <mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n                    <input matInput\r\n                      type="text"\r\n                      [placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n                      [formControl]="param.get(\'name\')" />\r\n                  </mat-form-field>\r\n\r\n                  <div class="action-icon pointer"\r\n                    (click)="deleteParamBody(account, paramBodyIndex)"\r\n                    title="Delete">\r\n                    <mat-icon class="icon-menu"\r\n                      svgIcon="icon_delete"></mat-icon>\r\n                  </div>\r\n                </div>\r\n              </ng-container>\r\n\r\n\r\n            </ng-container>\r\n          </ng-container>\r\n        </div>\r\n        <mat-icon class="ml-2"\r\n          svgIcon="drag-handle"></mat-icon>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</form>\r\n',styles:['.failover-mechanism .accounts-card{border:1px solid #e2e2e2;border-radius:16px}.failover-mechanism .information{position:relative;cursor:pointer;margin-left:20px}.failover-mechanism .information .tooltip-rules{position:absolute;top:-100px;left:30px;width:400px;padding:30px 30px 14px;background-color:#fff3cd;font-size:12px;border-radius:5px;z-index:10;opacity:0;transition:.35s}.failover-mechanism .information:hover .tooltip-rules{opacity:1}.asterix--after:after{content:"*";color:red}::ng-deep .mat-form-field.account-option .mat-form-field-infix{display:flex;align-items:center;gap:10px}::ng-deep .mat-slide-toggle.failover-activated .mat-slide-toggle-bar{width:40px;height:20px;border-radius:13px}::ng-deep .mat-slide-toggle.failover-activated .mat-slide-toggle-thumb-container{width:18px;height:18px;top:1px;left:1px}::ng-deep .mat-slide-toggle.failover-activated .mat-slide-toggle-thumb{width:18px;height:18px;border-radius:50%}::ng-deep .mat-slide-toggle.failover-activated.mat-checked .mat-slide-toggle-bar{background-color:#2bca3b}::ng-deep .mat-slide-toggle.failover-activated.mat-checked .mat-slide-toggle-thumb-container{left:4px}::ng-deep .mat-slide-toggle.failover-activated.mat-checked .mat-slide-toggle-thumb{background-color:#fff}::ng-deep .mat-radio-group.main-rule-type .mat-radio-button.mat-radio-checked .mat-radio-outer-circle{border-color:#4285f4}::ng-deep .mat-radio-group.main-rule-type .mat-radio-button.mat-radio-checked .mat-radio-inner-circle{background-color:#4285f4}::ng-deep .mat-radio-group.main-rule-type .mat-radio-button~.mat-radio-button{margin-left:25px}']})],t)}(),ae=function(){function t(t){var n=this;this.sanitizer=t,this.isTouchedWAForm=!1,this.isTouchedSMSForm=!1,this.isTouchedEmailForm=!1,this.isShowMore=!1,this.twilioResultCounter={segments:0,characters:0,encoding:"",fulltext:"Encode - / Chars 0 / Segment 1"},this.onCheckTwilioCounter=function(){var t,e,a,r,i,o=null===(t=n.generalInformationForm)||void 0===t?void 0:t.getRawValue();if("TEXT"===(null===(e=o)||void 0===e?void 0:e.channel)){var l={segments:(d=new j.SegmentedMessage(n.getBodyString)).segmentsCount,encoding:d.encodingName,characters:d.numberOfUnicodeScalars};n.twilioResultCounter=$($({},l),{fulltext:"Encode "+l.encoding+" / Chars "+l.characters+" / Segment "+l.segments})}else{var s=n.getBodyString;Array.from((null===(i=null===(r=null===(a=o)||void 0===a?void 0:a.template)||void 0===r?void 0:r.body)||void 0===i?void 0:i.examples)||[]).map((function(t,e){var n,a="{{"+t+"}}",r=null===(n=o.paramBody[e])||void 0===n?void 0:n.name;s=s.split(a).join(r)}));var d;l={segments:(d=new j.SegmentedMessage(s)).segmentsCount,encoding:d.encodingName,characters:d.numberOfUnicodeScalars};n.twilioResultCounter=$($({},l),{fulltext:"Encode "+l.encoding+" / Chars "+l.characters+" / Segment "+l.segments})}},this.generalInformation=new e.EventEmitter}return t.prototype.ngOnInit=function(){this.channelOption=vt,this.validationMessages=Vt,this.maps={zoom:15,latitude:null,longitude:null,isDraggable:!0,isDoubleClickZoom:!0},this.initForm(),this.initEdit(),this.initDisable()},t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({id:new m.FormControl(null),campaignName:new m.FormControl(null,[m.Validators.required,m.Validators.maxLength(100)]),medium:new m.FormControl(null,[m.Validators.required])}),this.form.valueChanges.subscribe((function(){t.isTouchedWAForm=!t.isTouchedWAForm,t.isTouchedSMSForm=!t.isTouchedSMSForm,t.isTouchedEmailForm=!t.isTouchedEmailForm,t.generalInformation.emit({parent:t.form,child:t.generalInformationForm})})),setInterval((function(){t.onCheckTwilioCounter()}),400)},t.prototype.initEdit=function(){var t,e,n,a,r,i,o=localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{};0!==Object.entries(o).length&&(this.form.get("id").setValue(null===(e=null===(t=o)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id),this.form.get("campaignName").setValue(null===(a=null===(n=o)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form.campaignName),this.form.get("medium").setValue(null===(i=null===(r=o)||void 0===r?void 0:r.generalInformation)||void 0===i?void 0:i.form.medium))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.updateGeneralInformationForm=function(t){this.generalInformationForm=t,this.isShowMore=!1,this.generalInformation.emit({parent:this.form,child:this.generalInformationForm}),"LOCATION"===this.getMedia&&this.getLocation()},Object.defineProperty(t.prototype,"getHeader",{get:function(){var t,e,n;return(null===(n=null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.from)||void 0===n?void 0:n.name)||""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getBodyString",{get:function(){var t,e,n,a,r,i,o,l,s,d,m;return null!=(m=null===(d=(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.text)||(null===(i=null===(r=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.template)||void 0===r?void 0:r.body)||void 0===i?void 0:i.text)||(null===(s=null===(l=null===(o=this.generalInformationForm)||void 0===o?void 0:o.getRawValue())||void 0===l?void 0:l.body)||void 0===s?void 0:s.text))||void 0===d?void 0:d.split(/\\n|\n/).join("<br />").split(/\\t|\t/).join("    "))?m:""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getBody",{get:function(){var t,e,n,a,r,i,o,l,s,d,m,c=(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.text)||(null===(i=null===(r=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.template)||void 0===r?void 0:r.body)||void 0===i?void 0:i.text)||(null===(s=null===(l=null===(o=this.generalInformationForm)||void 0===o?void 0:o.getRawValue())||void 0===l?void 0:l.body)||void 0===s?void 0:s.text);return this.sanitizer.bypassSecurityTrustHtml(this.fixGeneratedHtml(null!=(m=null===(d=c)||void 0===d?void 0:d.split(/\\n|\n/).join("<br />").split(/\\t|\t/).join("    "))?m:""))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getMedia",{get:function(){var t,e;return(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.media)||""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getTemplate",{get:function(){var t,e;return(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.template)||{}},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getTemplateButton",{get:function(){var t,e,n,a,r,i=!this.isShowMore&&(null===(e=null===(t=this.getTemplate)||void 0===t?void 0:t.buttons)||void 0===e?void 0:e.length)>3?2:null===(a=null===(n=this.getTemplate)||void 0===n?void 0:n.buttons)||void 0===a?void 0:a.length;return Z(null===(r=this.getTemplate)||void 0===r?void 0:r.buttons).splice(0,i)||[]},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"displayFile",{get:function(){var t,e,n,a,r,i,o,l;return null!=(l=null===(o=(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.targetURL)||(null===(i=null===(r=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.template)||void 0===r?void 0:r.header)||void 0===i?void 0:i.url))||void 0===o?void 0:o.replace("adlsandbox.com","adlsandbox.net"))?l:""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isText",{get:function(){var t,e;return"TEXT"===(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.channel)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isJSON",{get:function(){var t,e;return null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.isJSON},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getTemplateLine",{get:function(){var t,e,n,a,r,i,o,l;return this.isJSON?JSON.parse(null===(a=null===(n=null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.template)||void 0===n?void 0:n.body)||void 0===a?void 0:a.text):null===(l=null===(o=null===(i=null===(r=this.generalInformationForm)||void 0===r?void 0:r.getRawValue())||void 0===i?void 0:i.template)||void 0===o?void 0:o.body)||void 0===l?void 0:l.text},enumerable:!0,configurable:!0}),t.prototype.getLocation=function(){var t,e,n,a;this.maps.latitude=null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.latitude,this.maps.longitude=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.longitude},t.prototype.fixGeneratedHtml=function(t){return t.replaceAll(/div src="http/g,'img src="http').replaceAll(/div src="data:image/g,'img src="data:image').replaceAll(/Drag and drop your image here/g,"")},t.ctorParameters=function(){return[{type:H.DomSanitizer}]},J([e.Output()],t.prototype,"generalInformation",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),t=J([e.Component({selector:"lib-new-campaign-general-information",template:'<form autocomplete="off" [formGroup]="form">\r\n    <div class="campaign-info">\r\n        <div class="campaign-info-child">\r\n            <mat-card>\r\n                <mat-card-content>\r\n                    <h3 class="font-22px font-PoppinsBold mb-4">General Information</h3>\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">Broadcast Name</mat-label>\r\n\r\n                            <input\r\n                                matInput\r\n                                type="text"\r\n                                formControlName="campaignName"\r\n                                placeholder="Enter Broadcast name"\r\n                            />\r\n                        </mat-form-field>\r\n\r\n                        <div class="d-flex justify-content-between align-items-center w-100">\r\n                            <mat-hint align="start">\r\n                                {{ form.get(\'campaignName\').value?.length || 0 }}/100\r\n                            </mat-hint>\r\n\r\n                            <div>\r\n                                <mat-error\r\n                                    align="end"\r\n                                    *ngFor="let validation of validationMessages.campaignName"\r\n                                >\r\n                                    <p\r\n                                        class="font-12px mb-0"\r\n                                        *ngIf="\r\n                                            form.get(\'campaignName\').touched &&\r\n                                            form.get(\'campaignName\').hasError(validation.type)\r\n                                        "\r\n                                    >\r\n                                        {{ validation.message }}\r\n                                    </p>\r\n                                </mat-error>\r\n                            </div>\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">Channel</mat-label>\r\n\r\n                            <mat-select placeholder="Select channel" formControlName="medium">\r\n                                <mat-option\r\n                                    *ngFor="let option of channelOption"\r\n                                    [value]="option.value"\r\n                                >\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.medium">\r\n                            <p\r\n                                class="font-12px mb-0"\r\n                                *ngIf="\r\n                                    form.get(\'medium\').touched &&\r\n                                    form.get(\'medium\').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                    <ng-container *ngIf="form.get(\'medium\').value === \'WA\'">\r\n                        <lib-general-information-wa\r\n                            [isTouchedForm]="isTouchedWAForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-wa>\r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf="form.get(\'medium\').value === \'LINE\'">\r\n                        <lib-general-information-line\r\n                            [isTouchedForm]="isTouchedSMSForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-line>\r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf="form.get(\'medium\').value === \'SMS\'">\r\n                        <lib-general-information-sms\r\n                            [isTouchedForm]="isTouchedSMSForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-sms>\r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf="form.get(\'medium\').value === \'EMAIL\'">\r\n                        <lib-general-information-email\r\n                            [isTouchedForm]="isTouchedEmailForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-email>\r\n                    </ng-container>\r\n                </mat-card-content>\r\n            </mat-card>\r\n        </div>\r\n\r\n        <div class="campaign-info-child pl-20px">\r\n            <h3 class="font-22px font-PoppinsBold">Broadcast Content</h3>\r\n\r\n            <div\r\n                [ngClass]="\r\n                    form.get(\'medium\').value === \'SMS\' || form.get(\'medium\').value === \'EMAIL\'\r\n                        ? \'campaign-border-preview\'\r\n                        : \'campaign-preview\'\r\n                "\r\n            >\r\n                <section\r\n                    *ngIf="\r\n                        form.get(\'medium\').value === \'SMS\' || form.get(\'medium\').value === \'EMAIL\'\r\n                    "\r\n                >\r\n                    <p\r\n                        *ngIf="getBody"\r\n                        class="body my-2"\r\n                        style="max-width: 500px; word-wrap: break-word"\r\n                        [innerHTML]="getBody"\r\n                    ></p>\r\n                </section>\r\n\r\n                <section *ngIf="form.get(\'medium\').value === \'WA\'" class="campaign-preview__wa">\r\n                    <div class="header-preview">\r\n                        <div class="heading">\r\n                            {{ getHeader }}\r\n                        </div>\r\n                    </div>\r\n                    <div class="body-preview">\r\n                        <section *ngIf="getBody || getMedia || displayFile">\r\n                            <div\r\n                                class="chat"\r\n                                [ngClass]="{ \'no-bottom-border\': getTemplate?.buttons?.length > 0 }"\r\n                            >\r\n                                <img\r\n                                    *ngIf="\r\n                                        (getMedia === \'IMAGE\' ||\r\n                                            getTemplate?.header?.type?.toLowerCase() === \'image\') &&\r\n                                        displayFile\r\n                                    "\r\n                                    style="max-width: 100%"\r\n                                    alt="image"\r\n                                    [src]="displayFile"\r\n                                />\r\n\r\n                                <video\r\n                                    *ngIf="\r\n                                        (getMedia === \'VIDEO\' ||\r\n                                            getTemplate?.header?.type?.toLowerCase() === \'video\') &&\r\n                                        displayFile\r\n                                    "\r\n                                    id="video"\r\n                                    style="width: 100%"\r\n                                    [src]="displayFile"\r\n                                    controls\r\n                                ></video>\r\n\r\n                                <div *ngIf="getMedia === \'DOCUMENT\'" style="display: flex">\r\n                                    <img\r\n                                        style="width: 13px; height: 18px"\r\n                                        alt="document"\r\n                                        src="../../../../../assets/images/icon-file.png"\r\n                                    />\r\n\r\n                                    <span style="margin-left: 10px">Document</span>\r\n                                </div>\r\n\r\n                                <ng-container *ngIf="getMedia === \'LOCATION\'">\r\n                                    <agm-map\r\n                                        style="width: 100%; height: 200px"\r\n                                        [disableDefaultUI]="true"\r\n                                        [latitude]="maps.latitude"\r\n                                        [longitude]="maps.longitude"\r\n                                        [zoom]="maps.zoom"\r\n                                    >\r\n                                        <agm-marker\r\n                                            [latitude]="maps.latitude"\r\n                                            [longitude]="maps.longitude"\r\n                                            [markerDraggable]="false"\r\n                                        ></agm-marker>\r\n                                    </agm-map>\r\n                                    <a\r\n                                        [href]="\r\n                                            \'https://www.google.com/maps/search/?api=1&query=\' +\r\n                                            maps.latitude +\r\n                                            \',\' +\r\n                                            maps.longitude\r\n                                        "\r\n                                    >\r\n                                        https://www.google.com/maps/search/?api=1&query={{\r\n                                            maps.latitude\r\n                                        }},{{ maps.longitude }}\r\n                                    </a>\r\n                                </ng-container>\r\n\r\n                                <p *ngIf="getBody" class="body my-2" [innerHTML]="getBody"></p>\r\n\r\n                                <p\r\n                                    *ngIf="getTemplate?.footer"\r\n                                    class="mb-2"\r\n                                    style="color: rgb(160, 160, 160)"\r\n                                >\r\n                                    {{ getTemplate.footer }}\r\n                                </p>\r\n                            </div>\r\n                        </section>\r\n                        <section *ngIf="getTemplate?.buttons?.length > 0">\r\n                            <div\r\n                                *ngFor="let button of getTemplateButton"\r\n                                class="params-btn pb-0 pointer"\r\n                            >\r\n                                <p class="mb-0">\r\n                                    {{ button?.text || button?.type }}\r\n                                </p>\r\n                            </div>\r\n\r\n                            <div\r\n                                *ngIf="getTemplate?.buttons?.length > 3"\r\n                                class="params-btn pb-0 pointer"\r\n                                (click)="isShowMore = !isShowMore"\r\n                            >\r\n                                <p class="mb-0"><mat-icon>list</mat-icon> See all options</p>\r\n                            </div>\r\n                        </section>\r\n                    </div>\r\n                </section>\r\n\r\n                <section *ngIf="form.get(\'medium\').value === \'LINE\'" class="campaign-preview__line">\r\n                    <div class="header-preview">\r\n                        <div class="heading">\r\n                            {{ getHeader }}\r\n                        </div>\r\n                    </div>\r\n                    <div class="body-preview">\r\n                        \x3c!-- Template Line Text --\x3e\r\n                        <section *ngIf="isText || !isJSON" class="chat">\r\n                            <p class="body my-2" [innerHTML]="getBody"></p>\r\n                        </section>\r\n\r\n                        \x3c!-- Template Line Button | Confirmation --\x3e\r\n                        <section\r\n                            *ngIf="[\'buttons\', \'confirm\'].includes(getTemplateLine?.type)"\r\n                            class="chat"\r\n                            [ngClass]="{ \'no-bottom-border\': getTemplateLine?.actions?.length > 0 }"\r\n                        >\r\n                            <img\r\n                                *ngIf="getTemplateLine?.thumbnailImageUrl"\r\n                                style="max-width: 100%"\r\n                                class="mb-1"\r\n                                [src]="getTemplateLine?.thumbnailImageUrl"\r\n                            />\r\n\r\n                            <p\r\n                                *ngIf="getTemplateLine?.title"\r\n                                class="font-PoppinsBold mb-1"\r\n                                [innerHTML]="getTemplateLine?.title"\r\n                            ></p>\r\n\r\n                            <p\r\n                                *ngIf="getTemplateLine?.text"\r\n                                class="mb-0"\r\n                                [innerHTML]="getTemplateLine?.text"\r\n                            ></p>\r\n                        </section>\r\n\r\n                        \x3c!-- Template Line Carousel --\x3e\r\n                        <div\r\n                            *ngIf="[\'carousel\'].includes(getTemplateLine?.type)"\r\n                            class="d-flex gap-2 overflow-auto"\r\n                        >\r\n                            <div *ngFor="let column of getTemplateLine?.columns">\r\n                                <section\r\n                                    class="chat w-100"\r\n                                    [ngClass]="{ \'no-bottom-border\': column?.actions?.length > 0 }"\r\n                                >\r\n                                    <img\r\n                                        *ngIf="column.thumbnailImageUrl"\r\n                                        style="max-width: 100%"\r\n                                        class="mb-1"\r\n                                        [src]="column.thumbnailImageUrl"\r\n                                    />\r\n\r\n                                    <p\r\n                                        *ngIf="column.title"\r\n                                        class="font-PoppinsBold mb-1"\r\n                                        [innerHTML]="column.title"\r\n                                    ></p>\r\n\r\n                                    <p\r\n                                        *ngIf="column.text"\r\n                                        class="mb-0"\r\n                                        [innerHTML]="column.text"\r\n                                    ></p>\r\n                                </section>\r\n                                <section *ngIf="column?.actions?.length > 0">\r\n                                    <div\r\n                                        *ngFor="let button of column?.actions"\r\n                                        class="params-btn mw-100 pb-0 pointer"\r\n                                    >\r\n                                        <p class="mb-0">\r\n                                            {{ button?.text }}\r\n                                        </p>\r\n                                    </div>\r\n                                </section>\r\n                            </div>\r\n                        </div>\r\n\r\n                        \x3c!-- Template Line Image Carousel --\x3e\r\n                        <div\r\n                            *ngIf="[\'image_carousel\'].includes(getTemplateLine?.type)"\r\n                            class="d-flex gap-2 overflow-auto"\r\n                        >\r\n                            <div *ngFor="let column of getTemplateLine?.columns">\r\n                                <div class="image-container">\r\n                                    <img [src]="column.imageUrl" alt="image" />\r\n\r\n                                    <div class="d-flex justify-content-center">\r\n                                        <p class="font-13px overlay-text">\r\n                                            {{ column.action.label }}\r\n                                        </p>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n\r\n                        \x3c!-- Button Line --\x3e\r\n                        <section\r\n                            *ngIf="\r\n                                getTemplateLine?.type !== \'confirm\' &&\r\n                                getTemplateLine?.actions?.length > 0\r\n                            "\r\n                        >\r\n                            <div\r\n                                *ngFor="let button of getTemplateLine?.actions"\r\n                                class="params-btn pb-0 pointer"\r\n                            >\r\n                                <p class="mb-0">\r\n                                    {{ button?.text }}\r\n                                </p>\r\n                            </div>\r\n                        </section>\r\n                        <section\r\n                            *ngIf="\r\n                                getTemplateLine?.type === \'confirm\' &&\r\n                                getTemplateLine?.actions?.length > 0\r\n                            "\r\n                            class="d-flex justify-content-around mw-70 bg-white"\r\n                        >\r\n                            <div\r\n                                *ngFor="let button of getTemplateLine?.actions"\r\n                                class="params-btn flex pb-0 pointer"\r\n                            >\r\n                                <p class="mb-0">\r\n                                    {{ button?.text }}\r\n                                </p>\r\n                            </div>\r\n                        </section>\r\n                        \x3c!-- ./ Button Line --\x3e\r\n                    </div>\r\n                </section>\r\n            </div>\r\n\r\n            <div class="d-flex" style="flex-direction: column">\r\n                <span\r\n                    *ngIf="form.get(\'medium\').value === \'SMS\'"\r\n                    style="text-align: right; width: 100%"\r\n                >\r\n                    {{ twilioResultCounter.fulltext }}\r\n                </span>\r\n                <span\r\n                    style="text-align: right; width: 100%; color: red"\r\n                    *ngIf="twilioResultCounter.segments > 10 && form.get(\'medium\').value === \'SMS\'"\r\n                >\r\n                    Maximum Segment is 10\r\n                </span>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</form>\r\n\r\n<ng-template #isSpinner>\r\n    <div class="text-center my-auto">\r\n        <img src="../../../../../assets/images/spinner.svg" />\r\n    </div>\r\n</ng-template>\r\n',styles:['.campaign-info{display:flex}.campaign-info-child{flex:1}.campaign-info .asterix--after:after{content:"*";color:red}.campaign-info .pl-20px{padding-left:20px}.campaign-info .mw-70{max-width:70%}.campaign-info .campaign-preview{width:75%}.campaign-info .campaign-preview .header-preview{padding:15px;min-height:60px;border-radius:10px 10px 0 0}.campaign-info .campaign-preview .header-preview .heading{width:100%;color:#e0e0e0;margin-left:5px;font-size:20px}.campaign-info .campaign-preview .body-preview{padding:15px;min-height:470px}.campaign-info .campaign-preview .body-preview .chat{width:70%;padding:11px;font-size:14px;line-height:22px;color:#494949;border-radius:8px;background:#fff;overflow-wrap:break-word;white-space:pre-line;box-shadow:12px 12px 20px rgba(44,59,113,.04)}.campaign-info .campaign-preview .body-preview .chat .body{max-height:400px;overflow-y:auto;overscroll-behavior-y:contain}.campaign-info .campaign-preview .body-preview .chat.no-bottom-border{border-bottom-left-radius:0;border-bottom-right-radius:0}.campaign-info .campaign-preview__wa .header-preview{background:#065f54}.campaign-info .campaign-preview__wa .body-preview{border-bottom-left-radius:8px;border-bottom-right-radius:8px;background-image:url(../../../../../assets/svg/whatsapp-bg.svg);background-position:center;background-repeat:no-repeat;background-size:cover}.campaign-info .campaign-preview__wa .body-preview .params-btn{width:auto;max-width:70%;color:#34b7f1;background:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04);border-radius:0;font-size:16px;line-height:43px;padding:0;text-align:center;font-family:Poppins;overflow-wrap:break-word}.campaign-info .campaign-preview__wa .body-preview .params-btn b{font-family:PoppinsBold}.campaign-info .campaign-preview__line .header-preview{background:#273046}.campaign-info .campaign-preview__line .body-preview{background:#7692bf;border-bottom-left-radius:8px;border-bottom-right-radius:8px}.campaign-info .campaign-preview__line .body-preview .params-btn{width:auto;max-width:70%;color:#34b7f1;background:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04);border-radius:0;font-size:16px;line-height:43px;padding:0;text-align:center;font-family:Poppins;overflow-wrap:break-word}.campaign-info .campaign-preview__line .body-preview .params-btn b{font-family:PoppinsBold}.campaign-info .campaign-preview__line .body-preview .image-container{position:relative;width:200px;height:200px}.campaign-info .campaign-preview__line .body-preview .image-container img{display:block;width:100%;height:100%}.campaign-info .campaign-preview__line .body-preview .image-container .overlay-text{top:170px;position:absolute;padding:2px 5px;color:#fff;background-color:rgba(49,57,60,.62);border-radius:10px}.campaign-info .campaign-border-preview{width:100%;min-height:100px;padding:32px;border:1px solid #e2e2e2;border-radius:8px}']})],t)}(),re=function(){function t(t,n){this.apiAdapterService=t,this.toastr=n,this.isUpload=!1,this.isLoading=!1,this.isShowUploadCSV=!1,this.categorySelected=[],this.selection=new W.SelectionModel(!0,[]),this.extFileAccepted=["application/vnd.ms-excel","application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",".csv"],this.fileSelected=null,this.subscribers=[],this.targetAudience=new e.EventEmitter}return t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.categoryParam=new st,this.initTable(),this.getCategoryList(),this.targetAudience.emit({targetAudience:[],numberCount:0,isUpload:null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.isUpload,file:{name:null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.targetAudienceFile)||void 0===r?void 0:r.name,targetURL:null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.targetAudienceFile)||void 0===o?void 0:o.targetURL}})},t.prototype.initTable=function(){this.table=new gt,this.table.labels=["select","Category","No. Of Customer","Created Date","Updated Date"],this.table.columns=["select","name","totalMembers","createdDate","updatedDate"]},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s=this;0!==Object.entries(this.getCampaignStorage).length&&(this.isShowUploadCSV=null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.isUpload,this.fileSelected={name:null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.targetAudienceFile)||void 0===r?void 0:r.name,targetURL:null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.targetAudienceFile)||void 0===o?void 0:o.targetURL},null===(l=this.table.dataSource.data)||void 0===l||l.forEach((function(t){var e,n;(null===(n=null===(e=s.getCampaignStorage)||void 0===e?void 0:e.targetAudience)||void 0===n?void 0:n.includes(t.id))&&s.onChecked(!0,t)})))},t.prototype.getCategoryList=function(t){var e,n,a,r,i,o,l,s,d,m,c=this;void 0===t&&(t=""),this.isLoading=!0,this.isReadOnlyMode&&(this.categoryParam.pageSize=1e3);var p=[this.initParam("pageNo",this.categoryParam.pageNo,"number"),this.initParam("rowPerPage",this.categoryParam.pageSize,"number"),this.initParam("filter",t,"string"),this.initParam("platform",null===(a=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.generalInformation)||void 0===n?void 0:n.form)||void 0===a?void 0:a.medium,"string")];"LINE"===(null===(o=null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.generalInformation)||void 0===i?void 0:i.form)||void 0===o?void 0:o.medium)&&p.push(this.initParam("accountId",null===(m=null===(d=null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form)||void 0===d?void 0:d.from)||void 0===m?void 0:m.id,"string")),this.isReadOnlyMode&&p.push(this.initParam("summary",!0,"string"));var u=this.apiAdapterService.executeApiRequest(p,"/admin/category","GET").subscribe((function(t){var e;if(c.isReadOnlyMode)return c.table.dataSource.data=null===(e=t.data)||void 0===e?void 0:e.filter((function(t){var e,n;return null===(n=null===(e=c.getCampaignStorage)||void 0===e?void 0:e.targetAudience)||void 0===n?void 0:n.includes(t.id)})),c.categorySelected=c.table.dataSource.data,c.isLoading=!1,void c.initEdit();c.table.dataSource.data=t.data,c.table.setNextPage(t.haveNext),c.isLoading=!1,c.initEdit()}));this.subscribers.push(u)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.updateSearch=function(t){this.table.resetPage(),this.categoryParam.pageNo=this.table.page,this.getCategoryList(t)},t.prototype.updatePage=function(t){var e,n,a,r;this.table.pageSize!==(null===(e=t)||void 0===e?void 0:e.pageSize)&&this.table.resetPage(),this.table.page=this.table.pageSize!==(null===(n=t)||void 0===n?void 0:n.pageSize)?this.table.page:(null===(a=t)||void 0===a?void 0:a.pageIndex)+1,this.table.pageSize=null===(r=t)||void 0===r?void 0:r.pageSize,this.categoryParam.pageNo=this.table.page,this.categoryParam.pageSize=this.table.pageSize,this.getCategoryList()},t.prototype.sort=function(){this.table.dataSource.sort=this.matSort},t.prototype.checkboxLabel=function(t){return t?(this.selection.isSelected(t)?"deselect":"select")+" row "+(t.name+1):(this.isAllSelected()?"deselect":"select")+" all"},t.prototype.isAllSelected=function(){var t,e,n,a,r=this.selection.selected.length,i=null!=(a=null===(n=this.table.dataSource.data)||void 0===n?void 0:n.length)?a:0;if(this.table.dataSource.data&&this.table.dataSource.data.length>0&&this.selection.selected&&this.selection.selected.length>0){var o=function(t){return l.selection.selected.filter((function(e){return e.id===t.id})).length>0?"continue":{value:!1}},l=this;try{for(var s=Y(this.table.dataSource.data),d=s.next();!d.done;d=s.next()){var m=o(d.value);if("object"==typeof m)return m.value}}catch(e){t={error:e}}finally{try{d&&!d.done&&(e=s.return)&&e.call(s)}finally{if(t)throw t.error}}}return r===i},t.prototype.masterToggle=function(t){var e,n,a,r,i,o,l,s,d;if(!t)return this.selection.clear(),this.categorySelected=[],void this.targetAudience.emit({targetAudience:[],numberCount:0,isUpload:this.isShowUploadCSV,file:{name:null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.targetAudienceFile)||void 0===a?void 0:a.name,targetURL:null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.targetAudienceFile)||void 0===i?void 0:i.targetURL}});(e=this.selection).select.apply(e,Z(this.table.dataSource.data)),this.categorySelected=this.selection.selected,this.targetAudience.emit({targetAudience:this.categorySelected.map((function(t){return t.id})),numberCount:this.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:this.isShowUploadCSV,file:{name:null===(l=null===(o=this.getCampaignStorage)||void 0===o?void 0:o.targetAudienceFile)||void 0===l?void 0:l.name,targetURL:null===(d=null===(s=this.getCampaignStorage)||void 0===s?void 0:s.targetAudienceFile)||void 0===d?void 0:d.targetURL}})},t.prototype.onChecked=function(t,e){var n,a,r,i,o,l,s,d,m;if(!t)return(n=this.selection).deselect.apply(n,Z(this.selection.selected.filter((function(t){return t.id===e.id})))),this.categorySelected=this.selection.selected,void this.targetAudience.emit({targetAudience:this.categorySelected.map((function(t){return t.id})),numberCount:this.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:this.isShowUploadCSV,file:{name:null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.targetAudienceFile)||void 0===r?void 0:r.name,targetURL:null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.targetAudienceFile)||void 0===o?void 0:o.targetURL}});this.selection.select(e),this.categorySelected=this.selection.selected,this.targetAudience.emit({targetAudience:this.categorySelected.map((function(t){return t.id})),numberCount:this.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:this.isShowUploadCSV,file:{name:null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.targetAudienceFile)||void 0===s?void 0:s.name,targetURL:null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.targetAudienceFile)||void 0===m?void 0:m.targetURL}})},t.prototype.isChecked=function(t){return!!this.selection.selected.find((function(e){return e.id===t.id}))},t.prototype.onDownloadSampleService=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g=[this.initParam("platform",null===(a=null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.template)||void 0===a?void 0:a.platform,"string"),this.initParam("templateName",null===(l=null===(o=null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.generalInformation)||void 0===i?void 0:i.form)||void 0===o?void 0:o.template)||void 0===l?void 0:l.name,"string"),this.initParam("templateLang",null===(c=null===(m=null===(d=null===(s=this.getCampaignStorage)||void 0===s?void 0:s.generalInformation)||void 0===d?void 0:d.form)||void 0===m?void 0:m.template)||void 0===c?void 0:c.lang,"string"),this.initParam("category",(u=null===(p=this.categorySelected)||void 0===p?void 0:p.map((function(t){return t.id})).join(),null!=u?u:[]),"string")],f=this.apiAdapterService.executeApiRequest(g,"/message/bulkupload/template","GET",!0).subscribe((function(t){!function(t,e){void 0===e&&(e="file.csv");var n=URL.createObjectURL(t),a=document.createElement("a");a.href=n,a.download=e,document.body.appendChild(a),a.dispatchEvent(new MouseEvent("click",{bubbles:!0,cancelable:!0,view:window})),document.body.removeChild(a)}(t,"Sample-UploadParameter.xlsx")}));this.subscribers.push(f)},t.prototype.onFileSelected=function(t){var e=t.target.files;0!==e.length&&(e[0].size>31457280?this.toastr.error("Upload media failed, max size 30mb"):this.getPresignedUrlService(e[0]))},t.prototype.getPresignedUrlService=function(t){var e=this;this.isUpload=!0;var n=[{name:"fileName",value:t.name,in:"query",type:"string"},{name:"fileType",value:t.type,in:"query",type:"string"}],a=this.apiAdapterService.executeApiRequest(n,"/campaign/upload/pre-signed-url","GET").subscribe((function(n){n&&n.data&&e.uploadToS3Service(t,n.data.url,n.data.fileName)}),(function(){return e.isUpload=!1}));this.subscribers.push(a)},t.prototype.uploadToS3Service=function(t,e,n){var a=this;this.apiAdapterService.uploadFileToS3(e,t).subscribe((function(){a.finalizeTargetFileService(n)}),(function(t){a.toastr.error("Failed uploading to S3 storage"),a.isUpload=!1,console.error("S3 Upload Error:",t)}))},t.prototype.finalizeTargetFileService=function(t){var e,n,a=this,r=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.generalInformation)||void 0===n?void 0:n.id,i=[{name:"body",value:{fileName:t},in:"body",type:"object",withoutKeyData:!0}],o=this.apiAdapterService.executeApiRequest(i,"/campaign/"+r+"/targetfile","POST").subscribe((function(e){var n;e&&(a.toastr.info("Upload XLSX has been uploaded successfully"),a.isUpload=!1,a.targetAudience.emit({targetAudience:a.categorySelected.map((function(t){return t.id})),numberCount:a.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:!0,file:{name:t,targetURL:(null===(n=e.data)||void 0===n?void 0:n.targetURL)||""}}))}),(function(){return a.isUpload=!1}));this.subscribers.push(o)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ct},{type:s.ToastrService}]},J([e.Output()],t.prototype,"targetAudience",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.ViewChild(O.MatSort)],t.prototype,"matSort",void 0),t=J([e.Component({selector:"lib-new-number-bases",template:'<h3 class="font-20px font-PoppinsBold asterix--after mb-2"\r\n\t[ngClass]="{ \'mb-3\': !isReadOnlyMode }">\r\n\tTarget Audience\r\n</h3>\r\n<div *ngIf="!isReadOnlyMode"\r\n\tclass="d-flex justify-content-between">\r\n\t<p>Select your target audience (category)</p>\r\n\t<div *ngIf="isShowUploadCSV">\r\n\t\t<button mat-stroked-button\r\n\t\t\tcolor="primary-telin"\r\n\t\t\tclass="telin-font-color mr-2"\r\n\t\t\t(click)="onDownloadSampleService()">\r\n\t\t\tDownload Template\r\n\t\t</button>\r\n\r\n\t\t<button mat-flat-button\r\n\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t[disabled]="isUpload"\r\n\t\t\t(click)="filePicker.click()">\r\n\t\t\tUpload XLSX\r\n\t\t</button>\r\n\r\n\t\t<input #filePicker\r\n\t\t\thidden\r\n\t\t\ttype="file"\r\n\t\t\t[accept]="extFileAccepted.join()"\r\n\t\t\t(change)="onFileSelected($event)" />\r\n\t</div>\r\n</div>\r\n\r\n<p *ngIf="!isReadOnlyMode && (getCampaignStorage?.targetAudienceFile?.name ||\r\ngetCampaignStorage?.targetAudienceFile?.targetURL)"\r\n\tclass="text-right my-2">\r\n\t<span class="fw-bold">Filename:</span> {{ getCampaignStorage?.targetAudienceFile?.name ||\r\n\tgetCampaignStorage?.targetAudienceFile?.targetURL }}\r\n</p>\r\n\r\n<div *ngIf="!isReadOnlyMode || !fileSelected?.name"\r\n\tclass="row align-items-center mb-3">\r\n\t<div class="col-md-4 col-12">\r\n\t\t<lib-search *ngIf="!isReadOnlyMode"\r\n\t\t\t[placeholder]="\'Search\'"\r\n\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t</div>\r\n\t<div class="col-md-8 col-12">\r\n\t\t<p class="text-right mb-0">\r\n\t\t\tCategory Selected:\r\n\t\t\t<span class="font-bold">\r\n\t\t\t\t{{ categorySelected?.length || 0 }}\r\n\t\t\t</span>\r\n\t\t</p>\r\n\t</div>\r\n</div>\r\n\r\n<ng-container *ngIf="!isReadOnlyMode || !fileSelected?.name; else isShowFile">\r\n\t<table *ngIf="!isLoading; else isSpinner"\r\n\t\tmat-table\r\n\t\tmatSort\r\n\t\tmatSortDisableClear\r\n\t\tclass="table w-100 mb-2"\r\n\t\t[dataSource]="table.dataSource"\r\n\t\t(matSortChange)="sort()">\r\n\t\t<ng-container matColumnDef="select">\r\n\t\t\t<th *matHeaderCellDef>\r\n\t\t\t\t<ng-container *ngIf="!isReadOnlyMode">\r\n\t\t\t\t\t<mat-checkbox [aria-label]="checkboxLabel()"\r\n\t\t\t\t\t\t[checked]="selection.hasValue() && isAllSelected()"\r\n\t\t\t\t\t\t[indeterminate]="selection.hasValue() && !isAllSelected()"\r\n\t\t\t\t\t\t(change)="masterToggle($event.checked)">\r\n\t\t\t\t\t</mat-checkbox>\r\n\t\t\t\t</ng-container>\r\n\t\t\t</th>\r\n\t\t\t<td *matCellDef="let row">\r\n\t\t\t\t<ng-container *ngIf="!isReadOnlyMode">\r\n\t\t\t\t\t<mat-checkbox [aria-label]="checkboxLabel(row)"\r\n\t\t\t\t\t\t[checked]="isChecked(row)"\r\n\t\t\t\t\t\t(change)="onChecked($event.checked, row)">\r\n\t\t\t\t\t</mat-checkbox>\r\n\t\t\t\t</ng-container>\r\n\t\t\t</td>\r\n\t\t</ng-container>\r\n\r\n\t\t<ng-container *ngFor="let index of [1, 2, 3, 4]"\r\n\t\t\t[matColumnDef]="table.columns[index]">\r\n\t\t\t<th *matHeaderCellDef\r\n\t\t\t\t[mat-sort-header]="table.columns[index]">\r\n\t\t\t\t{{ table.labels[index] }}\r\n\t\t\t</th>\r\n\r\n\t\t\t<td *matCellDef="let row">\r\n\t\t\t\t<ng-container *ngIf="[1, 2].includes(index)">\r\n\t\t\t\t\t{{ row[table.columns[index]] }}\r\n\t\t\t\t</ng-container>\r\n\t\t\t\t<ng-container *ngIf="[3, 4].includes(index)">\r\n\t\t\t\t\t{{ row[table.columns[index]] | date : \' d MMM y\' }}\r\n\t\t\t\t</ng-container>\r\n\t\t\t</td>\r\n\t\t</ng-container>\r\n\r\n\t\t<ng-container matColumnDef="no-content">\r\n\t\t\t<th class="text-center"\r\n\t\t\t\t*matHeaderCellDef\r\n\t\t\t\t[colSpan]="table.columns.length">\r\n\t\t\t\tData Not Available\r\n\t\t\t</th>\r\n\t\t</ng-container>\r\n\r\n\t\t<tr mat-header-row\r\n\t\t\t*matHeaderRowDef="table.columns"></tr>\r\n\r\n\t\t<tr mat-header-row\r\n\t\t\tclass="no-content"\r\n\t\t\t*matHeaderRowDef="[\'no-content\']"\r\n\t\t\t[style.display]="table.dataSource?.data?.length === 0 ? \'table-row\' : \'none\'"></tr>\r\n\r\n\t\t<tr mat-row\r\n\t\t\t*matRowDef="let row; columns: table.columns"></tr>\r\n\t</table>\r\n\r\n\t<mat-paginator *ngIf="!isReadOnlyMode"\r\n\t\tclass="campaign-paginator"\r\n\t\t[length]="table.totalData"\r\n\t\t[pageSize]="table.pageSize"\r\n\t\t[pageIndex]="table.getPageIndex()"\r\n\t\t[pageSizeOptions]="[10, 25, 50, 100, 250]"\r\n\t\t(page)="updatePage($event)"></mat-paginator>\r\n\r\n\t<ng-template #isSpinner>\r\n\t\t<div class="text-center my-auto">\r\n\t\t\t<img src="../../../../../assets/images/spinner.svg" />\r\n\t\t</div>\r\n\t</ng-template>\r\n</ng-container>\r\n\r\n<ng-template #isShowFile>\r\n\t<p class="font-PoppinsBold font-14px">\r\n\t\tFile: <a [href]="fileSelected?.targetURL"\r\n\t\t\ttarget="_blank">{{ fileSelected?.name }}</a>\r\n\t</p>\r\n</ng-template>\r\n',styles:["::ng-deep .mat-paginator.campaign-paginator .mat-paginator-container{align-items:normal}::ng-deep .mat-paginator.campaign-paginator .mat-tab-body{background-color:#fff}::ng-deep .mat-paginator.campaign-paginator .mat-form-field-underline{bottom:0}"]})],t)}(),ie=function(){function t(t){this.toastr=t,this.datePipe=new a.DatePipe("en-US"),this.scheduler=new e.EventEmitter}return t.prototype.ngOnInit=function(){this.validationMessages=Ft,this.minDate=new Date,this.initForm(),this.initEdit(),this.initDisable()},t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({schedulerType:new m.FormControl(null,m.Validators.required),startDate:new m.FormControl(null),startTime:new m.FormControl(null),isRepeat:new m.FormControl(!1),delivery:new m.FormControl(null)}),this.form.valueChanges.subscribe((function(){t.scheduler.emit(t.form)}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(t){var e,n,a,r,i,o,l,s,d,m;void 0===t&&(t=!0);var c=localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{};0!==Object.entries(c).length&&(t&&this.form.get("schedulerType").setValue(null===(n=null===(e=c)||void 0===e?void 0:e.scheduler)||void 0===n?void 0:n.schedulerType),this.form.get("startDate").setValue(null===(r=null===(a=c)||void 0===a?void 0:a.scheduler)||void 0===r?void 0:r.startDate),this.form.get("startTime").setValue(null===(o=null===(i=c)||void 0===i?void 0:i.scheduler)||void 0===o?void 0:o.startTime),this.form.get("isRepeat").setValue(null===(s=null===(l=c)||void 0===l?void 0:l.scheduler)||void 0===s?void 0:s.isRepeat),this.form.get("delivery").setValue(this.capitalizeFirstLetter(null===(m=null===(d=c)||void 0===d?void 0:d.scheduler)||void 0===m?void 0:m.delivery)))},t.prototype.capitalizeFirstLetter=function(t){var e,n,a;return t?null!=(a=(null===(e=t)||void 0===e?void 0:e.charAt(0).toUpperCase())+(null===(n=t)||void 0===n?void 0:n.slice(1).toLowerCase()))?a:"":""},t.prototype.updateSchedulerType=function(t){if(this.form.get("schedulerType").setValue(t),"NOW"===this.form.get("schedulerType").value)return this.form.get("startDate").setValue(null),this.form.get("startDate").clearValidators(),this.form.get("startDate").updateValueAndValidity(),this.form.get("startTime").setValue(null),this.form.get("startTime").clearValidators(),this.form.get("startTime").updateValueAndValidity(),this.form.get("delivery").setValue(null),this.form.get("delivery").clearValidators(),this.form.get("delivery").updateValueAndValidity(),void this.form.get("isRepeat").setValue(!1);this.form.get("startDate").setValidators(m.Validators.required),this.form.get("startDate").updateValueAndValidity(),this.form.get("startTime").setValidators(m.Validators.required),this.form.get("startTime").updateValueAndValidity(),this.initEdit(!1)},t.prototype.updateTime=function(){this.form.get("startDate").value&&((new Date).getTime()>new Date(this.datePipe.transform(this.form.get("startDate").value,"yyyy-MM-dd")+" "+this.form.get("startTime").value).getTime()&&(this.form.get("startTime").setValue(null),this.toastr.error("Selected time has been surpassed")))},t.prototype.updateRepeat=function(t){if(t)return this.form.get("delivery").setValidators(m.Validators.required),void this.form.get("delivery").updateValueAndValidity();this.form.get("isRepeat").setValue(null),this.form.get("delivery").setValue(null),this.form.get("delivery").clearValidators(),this.form.get("delivery").updateValueAndValidity()},t.ctorParameters=function(){return[{type:s.ToastrService}]},J([e.Output()],t.prototype,"scheduler",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),t=J([e.Component({selector:"lib-new-campaign-scheduler",template:'<h3 class="font-20px font-PoppinsBold mb-4"\r\n\t[ngClass]="{ \'asterix--after\': !isReadOnlyMode }">\r\n\tScheduler\r\n</h3>\r\n\r\n<form [formGroup]="form"\r\n\tautocomplete="off"\r\n\tclass="scheduler">\r\n\t<div class="d-flex gap-4">\r\n\t\t<mat-card class="grid-cards pointer"\r\n\t\t\t[ngClass]="{\r\n        active: form.get(\'schedulerType\').value === \'NOW\',\r\n        \'d-none\': form.get(\'schedulerType\').value !== \'NOW\' && isReadOnlyMode\r\n      }"\r\n\t\t\t(click)="updateSchedulerType(\'NOW\')">\r\n\t\t\t<mat-card-title>\r\n\t\t\t\t<div class="d-flex justify-content-between align-items-center">\r\n\t\t\t\t\t<div class="font-16px font-PoppinsBold">Broadcast Now</div>\r\n\r\n\t\t\t\t\t<mat-radio-button *ngIf="!isReadOnlyMode"\r\n\t\t\t\t\t\tclass="scheduler-type"\r\n\t\t\t\t\t\t[checked]="form.get(\'schedulerType\').value === \'NOW\'"\r\n\t\t\t\t\t\t(click)="updateSchedulerType(\'NOW\')">\r\n\t\t\t\t\t</mat-radio-button>\r\n\t\t\t\t</div>\r\n\t\t\t</mat-card-title>\r\n\t\t\t<mat-card-content class="mb-0">\r\n\t\t\t\t<img src="../../../../../assets/svg/broadcast-now.svg" />\r\n\t\t\t</mat-card-content>\r\n\t\t\t<mat-card-actions>\r\n\t\t\t\t<p class="px-2 py-3 mb-0">\r\n\t\t\t\t\tBroadcast now to ensure the message is delivered directly to the customer!\r\n\t\t\t\t</p>\r\n\t\t\t</mat-card-actions>\r\n\t\t</mat-card>\r\n\r\n\t\t<mat-card class="grid-cards pointer"\r\n\t\t\t[ngClass]="{\r\n        active: form.get(\'schedulerType\').value === \'ONE_TIME\',\r\n        \'d-none\': form.get(\'schedulerType\').value !== \'ONE_TIME\' && isReadOnlyMode\r\n      }"\r\n\t\t\t(click)="updateSchedulerType(\'ONE_TIME\')">\r\n\t\t\t<mat-card-title>\r\n\t\t\t\t<div class="d-flex justify-content-between align-items-center">\r\n\t\t\t\t\t<div class="font-16px font-PoppinsBold">Frequently Scheduler</div>\r\n\r\n\t\t\t\t\t<mat-radio-button *ngIf="!isReadOnlyMode"\r\n\t\t\t\t\t\tclass="scheduler-type"\r\n\t\t\t\t\t\t[checked]="form.get(\'schedulerType\').value === \'ONE_TIME\'"\r\n\t\t\t\t\t\t(click)="updateSchedulerType(\'ONE_TIME\')">\r\n\t\t\t\t\t</mat-radio-button>\r\n\t\t\t\t</div>\r\n\t\t\t</mat-card-title>\r\n\t\t\t<mat-card-content class="mb-0">\r\n\t\t\t\t<img src="../../../../../assets/svg/broadcast-schedule.svg" />\r\n\t\t\t</mat-card-content>\r\n\t\t\t<mat-card-actions>\r\n\t\t\t\t<p class="px-2 py-3 mb-0">\r\n\t\t\t\t\tCreate a broadcast schedule and organize it based on your needs, with a date range.\r\n\t\t\t\t</p>\r\n\t\t\t</mat-card-actions>\r\n\t\t</mat-card>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="form.get(\'schedulerType\').value === \'ONE_TIME\'">\r\n\t\t<p class="font-14px font-PoppinsBold asterix--after py-3 mb-0">Select Date and Time</p>\r\n\r\n\t\t<div class="row mb-3">\r\n\t\t\t<div class="col-md-3 col-12">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\tclass="mat-datepicker-input"\r\n\t\t\t\t\t\tplaceholder="Select Date"\r\n\t\t\t\t\t\tformControlName="startDate"\r\n\t\t\t\t\t\t[min]="minDate"\r\n\t\t\t\t\t\t[matDatepicker]="startDatePicker"\r\n\t\t\t\t\t\t(dateChange)="updateTime()" />\r\n\r\n\t\t\t\t\t<mat-datepicker-toggle class="scheduler-date-toggle"\r\n\t\t\t\t\t\tmatSuffix\r\n\t\t\t\t\t\t[for]="startDatePicker">\r\n\t\t\t\t\t\t<mat-icon class="d-flex"\r\n\t\t\t\t\t\t\tsvgIcon="icon-date-grey"\r\n\t\t\t\t\t\t\tmatDatepickerToggleIcon></mat-icon>\r\n\t\t\t\t\t</mat-datepicker-toggle>\r\n\t\t\t\t\t<mat-datepicker #startDatePicker></mat-datepicker>\r\n\t\t\t\t</mat-form-field>\r\n\r\n\t\t\t\t<mat-error align="end"\r\n\t\t\t\t\t*ngFor="let validation of validationMessages.startDate">\r\n\t\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t\t*ngIf="form.get(\'startDate\').touched && form.get(\'startDate\').hasError(validation.type)">\r\n\t\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t\t</p>\r\n\t\t\t\t</mat-error>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div class="col-md-3 col-12">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="scheduler-time">\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="time"\r\n\t\t\t\t\t\tstep="1"\r\n\t\t\t\t\t\tmin="00:00"\r\n\t\t\t\t\t\tmax="23:59"\r\n\t\t\t\t\t\tformControlName="startTime"\r\n\t\t\t\t\t\tclass="scheduler-time-input"\r\n\t\t\t\t\t\tplaceholder="Select Time"\r\n\t\t\t\t\t\t(change)="updateTime()" />\r\n\t\t\t\t</mat-form-field>\r\n\r\n\t\t\t\t<mat-error align="end"\r\n\t\t\t\t\t*ngFor="let validation of validationMessages.startTime">\r\n\t\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t\t*ngIf="form.get(\'startTime\').touched && form.get(\'startTime\').hasError(validation.type)">\r\n\t\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t\t</p>\r\n\t\t\t\t</mat-error>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\r\n\t\t<mat-slide-toggle class="repeat-broadcast mb-3"\r\n\t\t\tformControlName="isRepeat"\r\n\t\t\t(change)="updateRepeat($event.checked)">\r\n\t\t\t<p class="font-14px font-PoppinsBold mb-0">Repeat Broadcast</p>\r\n\t\t</mat-slide-toggle>\r\n\r\n\t\t<ng-container *ngIf="form.get(\'isRepeat\').value">\r\n\t\t\t<p class="font-14px">The broadcast will be repeat based on the date and time you select</p>\r\n\r\n\t\t\t<div class="row">\r\n\t\t\t\t<div class="col-12">\r\n\t\t\t\t\t<div class="d-flex gap-2">\r\n\t\t\t\t\t\t<ng-container *ngFor="let item of [\'Daily\', \'Weekly\', \'Monthly\']">\r\n\t\t\t\t\t\t\t<button *ngIf="form.get(\'delivery\').value !== item"\r\n\t\t\t\t\t\t\t\tmat-stroked-button\r\n\t\t\t\t\t\t\t\tstyle="min-width: 80px"\r\n\t\t\t\t\t\t\t\t[disabled]="isReadOnlyMode"\r\n\t\t\t\t\t\t\t\t(click)="form.get(\'delivery\').setValue(item)">\r\n\t\t\t\t\t\t\t\t{{ item }}\r\n\t\t\t\t\t\t\t</button>\r\n\r\n\t\t\t\t\t\t\t<button *ngIf="form.get(\'delivery\').value === item"\r\n\t\t\t\t\t\t\t\tmat-flat-button\r\n\t\t\t\t\t\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t\t\t\t\t\tstyle="min-width: 80px"\r\n\t\t\t\t\t\t\t\t[disabled]="isReadOnlyMode"\r\n\t\t\t\t\t\t\t\t(click)="form.get(\'delivery\').setValue(item)">\r\n\t\t\t\t\t\t\t\t{{ item }}\r\n\t\t\t\t\t\t\t</button>\r\n\t\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.scheduler .grid-cards{width:280px;padding:1em;border:1px solid #e2e2e2;border-radius:10px;box-shadow:none}.scheduler .grid-cards.active{background-color:#f8fbff;border:1px solid #4285f4}.scheduler .alert-primary{height:52px;display:flex;align-items:center;background-color:#f3f7fd;border-color:#1369eb;border-radius:8px;color:#231f20}.scheduler .scheduler-time-input::-webkit-calendar-picker-indicator{width:24px;height:24px;margin-top:-5px;filter:invert(43%) sepia(6%) saturate(188%) hue-rotate(187deg) brightness(97%) contrast(93%)}.asterix--after:after{content:"*";color:red}::ng-deep .mat-radio-button.scheduler-type.mat-radio-checked .mat-radio-outer-circle{border-color:#4285f4}::ng-deep .mat-radio-button.scheduler-type.mat-radio-checked .mat-radio-inner-circle{background-color:#4285f4}::ng-deep .mat-datepicker-toggle.scheduler-date-toggle .mat-icon-button{display:flex!important}::ng-deep .mat-datepicker-toggle.scheduler-date-toggle .mat-icon-button .mat-icon{height:100%}::ng-deep .mat-form-field.scheduler-time .mat-form-field-infix{padding:.8em 0}::ng-deep .mat-slide-toggle.repeat-broadcast .mat-slide-toggle-bar{width:40px;height:20px;border-radius:13px}::ng-deep .mat-slide-toggle.repeat-broadcast .mat-slide-toggle-thumb-container{width:18px;height:18px;top:1px;left:1px}::ng-deep .mat-slide-toggle.repeat-broadcast .mat-slide-toggle-thumb{width:18px;height:18px;border-radius:50%}::ng-deep .mat-slide-toggle.repeat-broadcast.mat-checked .mat-slide-toggle-bar{background-color:#2bca3b}::ng-deep .mat-slide-toggle.repeat-broadcast.mat-checked .mat-slide-toggle-thumb-container{left:4px}::ng-deep .mat-slide-toggle.repeat-broadcast.mat-checked .mat-slide-toggle-thumb{background-color:#fff}']})],t)}(),oe=function(){function t(){}return J([e.Input()],t.prototype,"isShowLabel",void 0),t=J([e.Component({selector:"lib-new-campaign-summary",template:'<h3 *ngIf="!isShowLabel"\r\n\tclass="font-20px font-PoppinsBold asterix--after mb-4">Summary</h3>\r\n\r\n<div class="mb-4">\r\n\t<lib-new-campaign-general-information [isReadOnlyMode]="true">\r\n\t</lib-new-campaign-general-information>\r\n</div>\r\n\r\n<div class="mb-4">\r\n\t<lib-new-number-bases [isReadOnlyMode]="true"></lib-new-number-bases>\r\n</div>\r\n\r\n<lib-new-campaign-scheduler [isReadOnlyMode]="true"></lib-new-campaign-scheduler>\r\n',styles:[""]})],t)}(),le=function(){function t(){this.positionWizard=1,this.dataWizard=[]}return t.prototype.ngOnInit=function(){},J([e.Input()],t.prototype,"positionWizard",void 0),J([e.Input()],t.prototype,"dataWizard",void 0),t=J([e.Component({selector:"lib-wizard",template:"<div *ngFor=\"let name of dataWizard; let i = index;\"\r\n\tstyle=\"flex-direction: row; display: flex;\">\r\n\t<div [ngClass]=\"{\r\n\t\t\t\t'circle-active': positionWizard === i + 1,\r\n\t\t\t\t'circle-success': positionWizard > i + 1,\r\n\t\t\t\t'circle-inactive': positionWizard < i + 1\r\n\t\t\t}\">\r\n\t\t<span [ngClass]=\"{\r\n\t\t\t\t'number-active': positionWizard === i + 1,\r\n\t\t\t\t'number-success': positionWizard > i + 1,\r\n\t\t\t\t'number-inactive': positionWizard < i + 1\r\n\t\t\t}\">\r\n\t\t\t{{ i + 1 }}\r\n\t\t</span>\r\n\t</div>\r\n\t<div style=\"align-self: center;\"\r\n\t\tclass=\"ml-2\">\r\n\t\t<span [ngClass]=\"{\r\n\t\t\t\t'active-text': positionWizard === i + 1,\r\n\t\t\t\t'success-text': positionWizard > i + 1,\r\n\t\t\t\t'inactive-text': positionWizard < i + 1\r\n\t\t\t}\">\r\n\t\t\t{{ name }}\r\n\t\t</span>\r\n\t</div>\r\n\t<div *ngIf=\"i + 1 !== dataWizard.length\"\r\n\t\t[ngClass]=\"{\r\n\t\t\t'line': positionWizard < i + 2,\r\n\t\t\t'line-active': positionWizard === i + 2,\r\n\t\t\t'line-complete': positionWizard > i + 2,\r\n\t\t\t'w-50px': dataWizard.length === 5\r\n\t\t}\"></div>\r\n</div>\r\n",styles:[".active-text{font-family:Poppins;font-style:normal;font-weight:500}.success-text{font-family:Poppins;font-style:normal}.inactive-text{color:#848484}.circle-active{padding:9px 16px;border-radius:50%;background-color:#ed1c24}.circle-success{padding:9px 16px;border-radius:50%;background-color:#2bca3b}.circle-inactive{padding:9px 16px;border-radius:50%;background-color:#dde0e2}.number-inactive{color:#848484}.number-success{color:#fff}.number-active{color:#fff;font-family:PoppinsBold}.line{border-bottom:1px solid #e2e2e2;width:120px;position:relative;bottom:20px;margin:0 20px}.line.w-50px{width:50px}.line-complete{border-bottom:1px solid #2bca3b;width:120px;position:relative;bottom:20px;margin:0 20px}.line-active{border-bottom:1px solid #ed1c24;width:120px;position:relative;bottom:20px;margin:0 20px}.line-section{border-bottom:1px solid #dbdfeb;display:flex;position:relative;width:103.2%;right:1.6%}"]})],t)}(),se=function(){function t(){}return t=J([e.NgModule({declarations:[it,le,Zt,ae,ie,oe,re,Qt,ee,te,Kt,jt,ne],imports:[a.CommonModule,n.AgmCoreModule.forRoot({apiKey:"AIzaSyCHReBe_RpzAgLTrUC5QIDyeKttQ817wRY",libraries:["places"]}),Gt,c.MatAutocompleteModule,m.FormsModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,T.MatSelectModule,I.MatRadioModule,w.MatListModule,u.MatButtonModule,l.NgxEchartsModule.forRoot({echarts:L}),x.MatIconModule,M.PickerModule,N.AngularEditorModule,v.MatDialogModule,P.MatTabsModule,p.MatBadgeModule,D.NgbDropdownModule,D.NgbPaginationModule,i.MatCardModule,V.MatTableModule,g.MatCheckboxModule,o.MatPaginatorModule,y.MatGridListModule,f.MatDatepickerModule,O.MatSortModule,et,h.MatDividerModule,C.MatProgressSpinnerModule,A.MatSlideToggleModule,d.DragDropModule,Wt],exports:[it,oe],entryComponents:[jt],providers:[a.DatePipe]})],t)}(),de=function(){function t(){}return t=J([e.NgModule({declarations:[Q],imports:[a.CommonModule,n.AgmCoreModule.forRoot({apiKey:"AIzaSyCHReBe_RpzAgLTrUC5QIDyeKttQ817wRY",libraries:["places"]}),se,l.NgxEchartsModule,i.MatCardModule,r.HttpClientModule,s.ToastrModule.forRoot()],exports:[Q],providers:[{provide:o.MatPaginatorIntl,useClass:Rt}]})],t)}(),me=function(){function t(){}return t=J([e.NgModule({declarations:[zt],imports:[a.CommonModule,v.MatDialogModule,u.MatButtonModule],exports:[zt]})],t)}();t.AdlCampaignManagementLibraryInternalComponent=Q,t.AdlCampaignManagementLibraryInternalModule=de,t.CampaignIndexModule=Wt,t.CampaignManagementComponent=it,t.CampaignManagementModule=se,t.ConfirmationComponent=zt,t.ConfirmationModule=me,t.DashboardModule=Gt,t.SearchModule=et,t.ɵa=le,t.ɵb=Zt,t.ɵc=ae,t.ɵd=ie,t.ɵe=oe,t.ɵf=re,t.ɵg=Qt,t.ɵh=ee,t.ɵi=te,t.ɵj=Kt,t.ɵk=jt,t.ɵl=ne,t.ɵm=_t,t.ɵn=ct,t.ɵo=tt,t.ɵp=Ht,t.ɵq=Bt,t.ɵr=ft,t.ɵs=ct,t.ɵt=ot,t.ɵu=Rt,t.ɵv=zt,t.ɵw=Ut,t.ɵx=qt,Object.defineProperty(t,"__esModule",{value:!0})}));
+    ***************************************************************************** */var _=function(t,e){return(_=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function G(t,e){function n(){this.constructor=t}_(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var $=function(){return($=Object.assign||function(t){for(var e,n=1,a=arguments.length;n<a;n++)for(var r in e=arguments[n])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t}).apply(this,arguments)};function J(t,e,n,a){var r,i=arguments.length,o=i<3?e:null===a?a=Object.getOwnPropertyDescriptor(e,n):a;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,e,n,a);else for(var l=t.length-1;l>=0;l--)(r=t[l])&&(o=(i<3?r(o):i>3?r(e,n,o):r(e,n))||o);return i>3&&o&&Object.defineProperty(e,n,o),o}function Y(t){var e="function"==typeof Symbol&&Symbol.iterator,n=e&&t[e],a=0;if(n)return n.call(t);if(t&&"number"==typeof t.length)return{next:function(){return t&&a>=t.length&&(t=void 0),{value:t&&t[a++],done:!t}}};throw new TypeError(e?"Object is not iterable.":"Symbol.iterator is not defined.")}function Z(t,e){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var a,r,i=n.call(t),o=[];try{for(;(void 0===e||e-- >0)&&!(a=i.next()).done;)o.push(a.value)}catch(t){r={error:t}}finally{try{a&&!a.done&&(n=i.return)&&n.call(i)}finally{if(r)throw r.error}}return o}function X(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(Z(arguments[e]));return t}var K,Q=function(){function t(){}return t=J([e.Component({selector:"lib-adl-campaign-management-library-internal",template:"\n\t\t<p>\n\t\t\t<lib-campaign-management></lib-campaign-management>\n\t\t</p>\n\t"})],t)}(),tt=function(){function t(){this.debounceSubject=new F.Subject,this.searchRes=new e.EventEmitter}return t.prototype.ngOnInit=function(){var t,e=this;this.form=new m.FormControl(null!=(t=this.currentValue)?t:""),this.debounceSubject.pipe(E.debounceTime(500)).subscribe((function(t){e.searchRes.emit(t.toLowerCase())}))},t.prototype.searchResult=function(t){this.debounceSubject.next(t.target.value)},t.prototype.clearInput=function(){this.form.setValue(""),this.searchRes.emit(this.form.value)},J([e.Output()],t.prototype,"searchRes",void 0),J([e.Input()],t.prototype,"placeholder",void 0),J([e.Input()],t.prototype,"currentValue",void 0),t=J([e.Component({selector:"lib-search",template:'<div class="search">\r\n\t<mat-form-field appearance="outline"\r\n\t\tfloatLabel="never"\r\n\t\tclass="search">\r\n\t\t<mat-icon matPrefix\r\n\t\t\tclass="mr-2">\r\n\t\t\tsearch\r\n\t\t</mat-icon>\r\n\r\n\t\t<input matInput\r\n\t\t\tautocomplete="off"\r\n\t\t\t[formControl]="form"\r\n\t\t\t[placeholder]="placeholder"\r\n\t\t\t(keyup)="searchResult($event)">\r\n\r\n\t\t<button *ngIf="form.value"\r\n\t\t\tmat-button\r\n\t\t\tmatSuffix\r\n\t\t\tmat-icon-button\r\n\t\t\taria-label="Clear"\r\n\t\t\t(click)="clearInput()">\r\n\t\t\t<mat-icon>close</mat-icon>\r\n\t\t</button>\r\n\t</mat-form-field>\r\n</div>\r\n',styles:["::ng-deep mat-form-field.search .mat-form-field-infix{padding:.64em 0}"]})],t)}(),et=function(){function t(){}return t=J([e.NgModule({declarations:[tt],imports:[a.CommonModule,m.FormsModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,u.MatButtonModule,x.MatIconModule],exports:[tt]})],t)}();!function(t){t[t.Dashboard=1]="Dashboard",t[t.CampaignIndex=2]="CampaignIndex",t[t.CreateCampaign=3]="CreateCampaign",t[t.NewCampaign=4]="NewCampaign",t[t.UpdateNumberBases=5]="UpdateNumberBases"}(K||(K={}));var nt,at,rt,it=function(){function t(){this.currentView=K.CampaignIndex,this.currentViews=K}return t.prototype.onChangeMainArea=function(t){this.currentView=t},t=J([e.Component({selector:"lib-campaign-management",template:'<lib-dashboard *ngIf="currentView === currentViews.Dashboard"\r\n\t(currentView)="onChangeMainArea($event)"></lib-dashboard>\r\n\r\n<lib-campaign-index *ngIf="currentView === currentViews.CampaignIndex"\r\n\t(currentView)="onChangeMainArea($event)">\r\n</lib-campaign-index>\r\n\r\n<lib-new-campaign *ngIf="currentView === currentViews.NewCampaign"\r\n\t(currentView)="onChangeMainArea($event)">\r\n</lib-new-campaign>\r\n'})],t)}(),ot=function(){function t(t){this.controlContainer=t,this.allowDecimal=!0}var n;return n=t,t.prototype.handleInput=function(t){var e=t.target.value||"",n=this.allowDecimal?e.replace(/[^0-9.]/g,""):e.replace(/\D/g,"");if(this.allowDecimal){var a=n.split(".");a.length>2&&(n=a[0]+"."+a.slice(1).join(""))}this.disallowLeadingZero&&n.startsWith("0")&&n.length>1&&"."!==n[1]&&(n=n.replace(/^0+/,""));var r=n;this.trimLeadingZeros&&""!==n&&!n.includes(".")&&(r=+n),this.formControl.patchValue(r,{emitEvent:!1})},t.prototype.ngOnInit=function(){this.setBaseStateInitialization()},t.prototype.setBaseStateInitialization=function(){if(this.formControlName){var t=this.controlContainer.control;this.formControl=t.get(this.formControlName)}},Object.defineProperty(t.prototype,"isValid",{get:function(){var t,e;return!!((null===(t=this.formControl)||void 0===t?void 0:t.touched)&&(null===(e=this.formControl)||void 0===e?void 0:e.valid))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isInvalid",{get:function(){var t,e;return!!((null===(t=this.formControl)||void 0===t?void 0:t.touched)&&(null===(e=this.formControl)||void 0===e?void 0:e.invalid))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"errors",{get:function(){return this.formControl.errors},enumerable:!0,configurable:!0}),t.prototype.writeValue=function(t){this._value=t},t.prototype.registerOnChange=function(t){this._onBaseChange=t},t.prototype.registerOnTouched=function(t){this._onBaseTouched=t},t.prototype.setDisabledState=function(t){this._isDisabled=t},t.ctorParameters=function(){return[{type:m.ControlContainer}]},J([e.Input()],t.prototype,"formControlName",void 0),J([e.Input()],t.prototype,"formControl",void 0),J([e.Input()],t.prototype,"trimLeadingZeros",void 0),J([e.Input()],t.prototype,"disallowLeadingZero",void 0),J([e.Input()],t.prototype,"allowDecimal",void 0),J([e.Input()],t.prototype,"identifier",void 0),J([e.Input()],t.prototype,"placeholder",void 0),J([e.Input()],t.prototype,"label",void 0),J([e.Input()],t.prototype,"maxLength",void 0),J([e.ContentChild("suffix")],t.prototype,"suffixTmpl",void 0),t=n=J([e.Component({selector:"app-input[type=numeric]",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',providers:[{provide:m.NG_VALUE_ACCESSOR,useExisting:e.forwardRef((function(){return n})),multi:!0}],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}"]})],t)}(),lt=function(){function t(){}return t=J([e.NgModule({imports:[b.MatFormFieldModule,S.MatInputModule,m.ReactiveFormsModule,a.CommonModule],declarations:[ot],exports:[ot]})],t)}(),st=function(){function t(t,n){this.matSelect=t,this.ngZone=n,this.threshold="15%",this.debounceTime=150,this.infiniteScroll=new e.EventEmitter,this.thrPx=0,this.thrPc=0,this.singleOptionHeight=T.SELECT_ITEM_HEIGHT_EM,this.destroyed$=new F.Subject}return t.prototype.ngOnInit=function(){this.evaluateThreshold()},t.prototype.ngAfterViewInit=function(){var t=this;this.matSelect.openedChange.pipe(E.takeUntil(this.destroyed$)).subscribe((function(e){e&&(t.panel=t.matSelect.panel.nativeElement,t.singleOptionHeight=t.getSelectItemHeightPx(),t.registerScrollListener())}))},t.prototype.ngOnDestroy=function(){this.destroyed$.next(!0),this.destroyed$.complete()},t.prototype.evaluateThreshold=function(){this.threshold.lastIndexOf("%")>-1?(this.thrPx=0,this.thrPc=parseFloat(this.threshold)/100):(this.thrPx=parseFloat(this.threshold),this.thrPc=0)},t.prototype.registerScrollListener=function(){var t=this;F.fromEvent(this.panel,"scroll").pipe(E.takeUntil(this.destroyed$),E.debounceTime(this.debounceTime),E.tap((function(e){t.handleScrollEvent(e)}))).subscribe()},t.prototype.handleScrollEvent=function(t){var e=this;this.ngZone.runOutsideAngular((function(){if(!e.complete){var n=e.matSelect.options.length,a=e.singleOptionHeight*n,r=0!==e.thrPc?a*e.thrPc:e.thrPx;e.panel.clientHeight+t.target.scrollTop+r>=a&&e.ngZone.run((function(){return e.infiniteScroll.emit()}))}}))},t.prototype.getSelectItemHeightPx=function(){return parseFloat(getComputedStyle(this.panel).fontSize)*T.SELECT_ITEM_HEIGHT_EM},t.ctorParameters=function(){return[{type:T.MatSelect},{type:e.NgZone}]},J([e.Input()],t.prototype,"threshold",void 0),J([e.Input()],t.prototype,"debounceTime",void 0),J([e.Input()],t.prototype,"complete",void 0),J([e.Output()],t.prototype,"infiniteScroll",void 0),t=J([e.Directive({selector:"[matSelectInfiniteScroll]"})],t)}(),dt=(function(){function t(){}t.prototype.clone=function(t){return t.country&&(this.country=t.country),t.recomended&&(this.recomended=t.recomended),t.type&&(this.type=t.type),t.setupFeeRateCard&&(this.setupFeeRateCard=t.setupFeeRateCard),t.setupFee&&("true"===t.setupFeeRateCard?this.setupFee=null:this.setupFee=t.setupFee),t.ovrUsgConversationRateCard&&(this.ovrUsgConversationRateCard=t.ovrUsgConversationRateCard),t.costPerCustomer&&(this.costPerCustomer=t.costPerCustomer),t.costPerBusiness&&(this.costPerBusiness=t.costPerBusiness),t.ovrUsgNotficationRateCard&&(this.ovrUsgNotficationRateCard=t.ovrUsgNotficationRateCard),t.ovrUsgConversationCost&&(this.ovrUsgConversationCost=t.ovrUsgConversationCost),t.ovrUsgNotficationCost&&("true"===t.ovrUsgNotficationRateCard?this.ovrUsgNotficationCost=null:this.ovrUsgNotficationCost=t.ovrUsgNotficationCost),t.customPackage&&(this.customPackage=t.customPackage),t.currency&&(this.currency=t.currency),t.name&&(this.name=t.name),t.monthlyRental&&(this.monthlyRental=t.monthlyRental),t.conversationMsg&&(this.conversationMsg=t.conversationMsg),t.businessMsg&&(this.businessMsg=t.businessMsg),t.contacts&&(this.contacts=t.contacts),t.isMultipleFlow&&(this.isMultipleFlow=t.isMultipleFlow),t.tps&&(this.tps=t.tps),t.multichatLiveAgent&&(this.multichatLiveAgent=t.multichatLiveAgent),t.multichatLiveSupervisor&&(this.multichatLiveSupervisor=t.multichatLiveSupervisor),t.numberOfFlow&&(this.numberOfFlow=t.numberOfFlow),t.waOfficialAccount&&(this.waOfficialAccount=t.waOfficialAccount),t.dashboardToSendMessage&&(this.dashboardToSendMessage=t.dashboardToSendMessage),t.reportAdminPanel&&(this.reportAdminPanel=t.reportAdminPanel),t.trainingSupport&&(this.trainingSupport=t.trainingSupport),t.isMultiple&&(this.isMultiple=t.isMultiple),t.checklistWa&&(this.checklistWa=t.checklistWa),t.checklistLine&&(this.checklistLine=t.checklistLine),t.checklistTele&&(this.checklistTele=t.checklistTele),t.specifyPackage&&(this.specifyPackage=t.specifyPackage),t.customDevelopment&&(this.customDevelopment=t.customDevelopment),t.oneUsageCostConversation&&(this.oneUsageCostConversation=t.oneUsageCostConversation),t.signupOrSetup&&(this.signupOrSetup=t.signupOrSetup),t.checklistAdm&&(this.checklistAdm=t.checklistAdm),t.checklistUser&&(this.checklistUser=t.checklistUser),t.checklistClient&&(this.checklistClient=t.checklistClient),t.checklistChatAgentAdmin&&(this.checklistChatAgentAdmin=t.checklistChatAgentAdmin),t.checklistChatAgentUser&&(this.checklistChatAgentUser=t.checklistChatAgentUser),this}}(),function(){}),mt=(function(){function t(){this.pageSize=3,this.pageNo=1}t.prototype.convert=function(){return{pageSize:this.pageSize,pageNo:this.pageNo}}}(),function(){function t(){this.pageSize=10,this.pageNo=1}return t.prototype.convert=function(){return{pageSize:this.pageSize,pageNo:this.pageNo}},t}()),ct=(function(t){function e(){return t.call(this)||this}G(e,t),e.prototype.convert=function(){return{filter:this.filter,platform:this.platform,clientId:this.clientId,pageNo:String(this.pageNo),pageSize:String(this.pageSize)}}}(mt),function(){function t(){}t.prototype.convert=function(t){return t.category&&(this.category=t.category),t.code&&(this.code=t.code),t.values&&(this.values=t.values),t.param1&&(this.param1=t.param1),t.param2&&(this.param2=t.param2),t.ìcon&&(this.ìcon=t.ìcon),this}}(),function(){function t(){this.channels=[]}t.prototype.clone=function(t){return t.name&&(this.name=t.name),t.type&&(this.type=t.type),t.recomended&&(this.recomended=t.recomended),t.setupFeeRateCard&&(this.setupFeeRateCard=t.setupFeeRateCard),t.countryCode&&(this.countryCode=t.countryCode),t.costPerCustomer&&(this.costPerCustomer=t.costPerCustomer),t.costPerBusiness&&(this.costPerBusiness=t.costPerBusiness),t.customPackage&&(this.customPackage=t.customPackage),t.channels&&(this.channels=[t.channels]),t.customDevelopment&&(this.customDevelopment=t.customDevelopment),t.maxAgent&&(this.maxAgent=t.maxAgent),t.maxContact&&(this.maxContact=t.maxContact),t.maxFlow&&(this.maxFlow=t.maxFlow),t.maxSupervisor&&(this.maxSupervisor=t.maxSupervisor),t.monthlyConversation&&(this.monthlyConversation=t.monthlyConversation),t.monthlyNotification&&(this.monthlyNotification=t.monthlyNotification),t.monthlyRental&&(this.monthlyRental=t.monthlyRental),t.monthlyRentalRateCard&&(this.monthlyRentalRateCard=t.monthlyRentalRateCard),t.ovrUsgConversation&&(this.ovrUsgConversation=t.ovrUsgConversation),t.ovrUsgConversationCost&&(this.ovrUsgConversationCost=t.ovrUsgConversationCost),t.ovrUsgConversationRateCard&&(this.ovrUsgConversationRateCard=t.ovrUsgConversationRateCard),t.ovrUsgNotification&&(this.ovrUsgNotification=t.ovrUsgNotification),t.ovrUsgNotificationCost&&(this.ovrUsgNotificationCost=t.ovrUsgNotificationCost),t.ovrUsgNotificationRateCard&&(this.ovrUsgNotificationRateCard=t.ovrUsgNotificationRateCard),t.reports&&(this.reports=t.reports),t.roles&&(this.roles=t.roles),t.sendMsgDashboard&&(this.sendMsgDashboard=t.sendMsgDashboard),t.setupFee&&(this.setupFee=t.setupFee),t.tps&&(this.tps=t.tps),t.training&&(this.training=t.training),t.waOfficialAcc&&(this.waOfficialAcc=t.waOfficialAcc),this},t.prototype.convert=function(){return{name:this.name,channels:this.channels,customDevelopment:this.customDevelopment,maxAgent:+this.maxAgent,maxContact:+this.maxContact,maxFlow:+this.maxFlow,maxSupervisor:+this.maxSupervisor,monthlyConversation:+this.monthlyConversation,monthlyNotification:+this.monthlyNotification,monthlyRental:+this.monthlyRental,monthlyRentalRateCard:this.monthlyRentalRateCard,ovrUsgConversation:this.ovrUsgConversation,ovrUsgConversationCost:+this.ovrUsgConversationCost,ovrUsgConversationRateCard:this.ovrUsgConversationRateCard,ovrUsgNotification:this.ovrUsgNotification,ovrUsgNotificationCost:+this.ovrUsgNotificationCost,ovrUsgNotificationRateCard:this.ovrUsgNotificationRateCard,reports:this.reports,roles:this.roles,sendMsgDashboard:this.sendMsgDashboard,setupFee:+this.setupFee,tps:+this.tps,training:this.training,waOfficialAcc:this.waOfficialAcc,customPackage:this.customPackage,countryCode:this.countryCode,costPerBusiness:this.costPerBusiness,costPerCustomer:this.costPerCustomer,setupFeeRateCard:this.setupFeeRateCard,type:this.type,recomended:this.recomended}}}(),function(){function t(){}t.prototype.convert=function(t){return t.status&&(this.status=t.status),t.errorCode&&(this.errorCode=t.errorCode),t.message&&(this.message=t.message),t.data&&(this.data=t.data),t.totalRecord>=0&&(this.totalRecord=t.totalRecord),this}}(),location.origin),pt=ct.includes("dashboard.neuapix.com")?"https://api.neuapix.com":ct.includes("dashboard-staging")?"https://api-staging.neuapix.com":ct.includes("dashboard-qa")?"https://apibsp-qa.adlsandbox.net":(ct.includes("demo-dev"),"https://apibsp-dev.adlsandbox.net"),ut=function(){function t(t){this.httpClient=t,this.queryCount=0}return t.prototype.executeApiRequest=function(t,e,n,a){var i,o,l,s=this;void 0===a&&(a=!1);var d,m,c=e,p=new FormData;null===(i=t)||void 0===i||i.filter((function(t){return"header"!==t.in})).forEach((function(e){if(!(m=t.find((function(t){return t.name===e.name})))&&e.required&&"header"!==e.in)window.alert('Parameter "'+e.name+'" is required!, Try again with "'+e.name+'"');else if(m||e.required)switch(e.in){case"body":d=m.value;break;case"path":c=c.replace("{"+m.name+"}",m.value);break;case"query":c=s.setQuery(m.name,m.value,c);break;case"formData":p=s.setFormData(m,p)}else;m=void 0})),this.queryCount=0,c=""+pt+c;var u=$({},(null===(l=null===(o=t)||void 0===o?void 0:o[0])||void 0===l?void 0:l.withoutKeyData)?d:{data:d}),g=(new r.HttpHeaders).set("Authorization","Bearer "+localStorage.getItem("telin.accessToken")).set("Access-Control-Allow-Origin","*");return this.httpClient.request(n,c,{body:d?u:p,responseType:a?"blob":"json",headers:g}).pipe(U.catchError((function(t){return t.error instanceof ErrorEvent?F.of({error:{title:"Network error!",detail:t.message,source:t.statusText,status:t.status.toString()},meta:{code:t.status,message:t.message}}):F.of(t.error)})))},t.prototype.uploadFileToS3=function(t,e){return this.httpClient.put(t,e,{headers:{"Content-Type":e.type}})},t.prototype.setQuery=function(t,e,n){return n=0===this.queryCount?n+"?"+t+"="+e:n+"&"+t+"="+e,this.queryCount++,n},t.prototype.setFormData=function(t,e){if("array"===t.type)for(var n=0;t.value.length>n;n++)e.append(t.name,t.value[n],t.value[n].name);else e.append(t.name,t.value?t.value:null);return e},t.ctorParameters=function(){return[{type:r.HttpClient}]},t.ɵprov=e.ɵɵdefineInjectable({factory:function(){return new t(e.ɵɵinject(r.HttpClient))},token:t,providedIn:"root"}),t=J([e.Injectable({providedIn:"root"})],t)}(),gt=["Broadcast ID","Business Name","Broadcast Name","Template Name","Channel","Status","Number Count","On Progress","Sent","Delivered","Read","Failed","Repeat Count","Start Date","End Date","Action"],ft=["id","clientName","name","templateName","platform","statusName","numberCount","queuedCount","sentCount","delivCount","readCount","failedCount","repeatCount","startTime","endTime","action"],vt=(function(){function t(){}t.prototype.convert=function(t){return t.campaignID&&(this.campaignID=t.campaignID),t.businessName&&(this.businessName=t.businessName),t.campaignName&&(this.campaignName=t.campaignName),t.medium&&(this.medium=t.medium),t.status&&(this.status=t.status),t.numberCount&&(this.numberCount=t.numberCount),t.deilveredCount&&(this.deilveredCount=t.deilveredCount),t.seenCount&&(this.seenCount=t.seenCount),t.responseCount&&(this.responseCount=t.responseCount),t.estimatedCost&&(this.estimatedCost=t.estimatedCost),t.actualCost&&(this.actualCost=t.actualCost),t.startDate&&(this.startDate=t.startDate),t.endDate&&(this.endDate=t.endDate),t.id&&(this.id=t.id),this}}(),function(){function t(){this.columns=[],this.dataSource=new V.MatTableDataSource,this.labels=[],this.page=1,this.pageSize=10,this.totalData=0}return t.prototype.getNumber=function(t,e){return(this.page-1)*e+t},t.prototype.getPageIndex=function(){return this.page-1},t.prototype.isEmpty=function(){return 0===this.totalData},t.prototype.setPage=function(t){this.page=t},t.prototype.setPageSize=function(t){this.pageSize=t},t.prototype.resetPage=function(){this.page=1},t.prototype.setNextPage=function(t){var e,n,a;if(t||1!==this.page){this.totalData=1===this.page?2*this.pageSize:this.pageSize*(this.page+1);var r=this.pageSize-(null===(a=this.dataSource.data)||void 0===a?void 0:a.length);0!==r&&(this.totalData-=r),t||(this.totalData-=this.pageSize)}else this.totalData=null!=(n=null===(e=this.dataSource.data)||void 0===e?void 0:e.length)?n:0},t}()),ht=function(){function t(t,n){this.datePipe=t,this.apiAdapterService=n,this.currentView=new e.EventEmitter,this.currentViews=K,this.subscribers=[]}return t.prototype.ngOnInit=function(){this.campaignParam=new mt,this.initTable(),this.campaignCountService(),this.getCampaignList(),localStorage.removeItem("telin.campaign")},t.prototype.initTable=function(){this.table=new vt,this.table.labels=gt,this.table.columns=ft},t.prototype.campaignCountService=function(){var t=this,e=this.apiAdapterService.executeApiRequest([],"/campaign/totals","GET").subscribe((function(e){var n;t.campaignTotal=null===(n=e)||void 0===n?void 0:n.data}));this.subscribers.push(e)},t.prototype.getCampaignList=function(t){var e,n,a,r,i,o,l,s=this;void 0===t&&(t="");var d=[this.initParam("pageNo",this.campaignParam.pageNo,"number"),this.initParam("rowPerPage",this.campaignParam.pageSize,"number"),this.initParam("filter",t,"string")];(null===(e=this.filterValue)||void 0===e?void 0:e.businessName)&&d.push(this.initParam("clientId",this.filterValue.businessName,"string")),(null===(n=this.filterValue)||void 0===n?void 0:n.medium)&&d.push(this.initParam("channel",this.filterValue.medium,"string")),(null===(a=this.filterValue)||void 0===a?void 0:a.templateName)&&d.push(this.initParam("templateName",null===(r=this.filterValue.templateName)||void 0===r?void 0:r.name,"string")),(null===(i=this.filterValue)||void 0===i?void 0:i.status)&&d.push(this.initParam("status",this.filterValue.status,"string")),(null===(o=this.filterValue)||void 0===o?void 0:o.startDate)&&d.push(this.initParam("startDate",this.datePipe.transform(this.filterValue.startDate,"yyyy-MM-dd"),"string")),(null===(l=this.filterValue)||void 0===l?void 0:l.endDate)&&d.push(this.initParam("endDate",this.datePipe.transform(this.filterValue.endDate,"yyyy-MM-dd"),"string"));var m=this.apiAdapterService.executeApiRequest(d,"/campaign","GET").subscribe((function(t){s.table.dataSource.data=t.data,s.table.setNextPage(t.haveNext)}));this.subscribers.push(m)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.updatePage=function(t){t.pageSize?(this.table.totalData=t.pageSize,this.table.setPageSize(t.pageSize),this.table.resetPage()):this.table.setPage(t),this.campaignParam.pageNo=this.table.page,this.campaignParam.pageSize=this.table.pageSize,this.getCampaignList()},t.prototype.updateFilter=function(t){this.table.resetPage(),this.campaignParam.pageNo=this.table.page,this.campaignParam.pageSize=this.table.pageSize,this.filterValue=t,this.getCampaignList()},t.prototype.updateSearch=function(t){this.table.resetPage(),this.campaignParam.pageNo=this.table.page,this.getCampaignList(t)},t.prototype.addCampaign=function(){localStorage.removeItem("telin.campaign"),this.changeCurrentView(this.currentViews.NewCampaign)},t.prototype.changeCurrentView=function(t){this.currentView.emit(t)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:a.DatePipe},{type:ut}]},J([e.Output()],t.prototype,"currentView",void 0),t=J([e.Component({selector:"lib-campaign-index",template:'<div class="billing-list p-4">\r\n    <div class="row mb-3">\r\n        <div class="col-md-8">\r\n            <p class="title mb-1">Broadcast Messaging</p>\r\n\r\n            <mat-chip-list>\r\n                <p class="font-subtitle">Manage Your Broadcast Messages Here.</p>\r\n                <div>\r\n                    <mat-chip class="example-box-total" cdkDrag>\r\n                        {{ campaignTotal?.total }} Total Broadcasts\r\n                    </mat-chip>\r\n                    <mat-chip class="example-box-live" cdkDrag>\r\n                        {{ campaignTotal?.live }} Scheduled Broadcasts\r\n                    </mat-chip>\r\n                    <mat-chip class="example-box-pending" cdkDrag>\r\n                        {{ campaignTotal?.pending }} Pending Approval\r\n                    </mat-chip>\r\n                </div>\r\n            </mat-chip-list>\r\n        </div>\r\n        <div class="col-md-4 mt-auto text-end">\r\n            \x3c!-- <button mat-flat-button\r\n\t\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t\tstyle="height: 46px; margin-right:20px"\r\n\t\t\t\t(click)="changeCurrentView(currentViews.Dashboard)">\r\n\t\t\t\tGo to Dashboard\r\n\t\t\t</button> --\x3e\r\n\r\n            <button\r\n                mat-flat-button\r\n                color="primary-telin-blue2"\r\n                style="height: 46px"\r\n                (click)="addCampaign()"\r\n            >\r\n                <mat-icon class="icon-menu">add</mat-icon>\r\n                Add Broadcast\r\n            </button>\r\n        </div>\r\n\r\n        <div class="col-12 mt-3">\r\n            <div style="background-color: #ffffff; border-radius: 8px">\r\n                <section class="wrapper__action w-100 p-3">\r\n                    <div class="display__left mb-xs">\r\n                        <lib-search\r\n                            [placeholder]="\'Search\'"\r\n                            (searchRes)="updateSearch($event)"\r\n                        ></lib-search>\r\n\r\n                        <div\r\n                            class="alert alert-primary d-flex align-items-center ml-3"\r\n                            role="alert"\r\n                        >\r\n                            <img\r\n                                src="../../../../assets/svg/info-blue.svg"\r\n                                style="width: 24px; height: auto; cursor: pointer"\r\n                                [matTooltip]="\r\n                                    \'The 5 minutes is set to give time for summarizing and consolidating all the data properly\'\r\n                                "\r\n                            />\r\n\r\n                            <div class="text-body font-13px ml-2">\r\n                                The page can be refreshed every 5 minutes to view the updated data\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n\r\n                    <div class="display__right float__right__xs">\r\n                        <div\r\n                            ngbDropdown\r\n                            container="body"\r\n                            class="filter__body"\r\n                            placement="bottom-right"\r\n                            [autoClose]="false"\r\n                            #filterDropdown="ngbDropdown"\r\n                        >\r\n                            <button\r\n                                ngbDropdownToggle\r\n                                mat-stroked-button\r\n                                color="primary-telin1"\r\n                                style="height: 46px"\r\n                            >\r\n                                <em class="material-icons md-18 pointer pr-1">filter_list</em>\r\n                                Filter\r\n                            </button>\r\n\r\n                            <div\r\n                                ngbDropdownMenu\r\n                                id="filter-drop"\r\n                                class="dropdown-menu filter__dropdown"\r\n                            >\r\n                                <lib-filter-in-list-of-campaign\r\n                                    *ngIf="filterDropdown.isOpen()"\r\n                                    class="filter-content"\r\n                                    style="z-index: 900 !important"\r\n                                    [filterValue]="filterValue"\r\n                                    (onChangeFilter)="updateFilter($event)"\r\n                                    (closeDropdown)="filterDropdown.close()"\r\n                                >\r\n                                </lib-filter-in-list-of-campaign>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </section>\r\n\r\n                <lib-viewing-list-of-campaign-table\r\n                    [table]="table"\r\n                    (currentView)="changeCurrentView($event)"\r\n                    (updateTable)="getCampaignList()"\r\n                >\r\n                </lib-viewing-list-of-campaign-table>\r\n\r\n                <div class="pagination-customize row">\r\n                    <div class="col-md-7 col-12 my-auto">\r\n                        <ngb-pagination\r\n                            [collectionSize]="table.totalData"\r\n                            [(page)]="table.page"\r\n                            [pageSize]="table.pageSize"\r\n                            [maxSize]="5"\r\n                            [rotate]="true"\r\n                            (pageChange)="updatePage($event)"\r\n                        ></ngb-pagination>\r\n                    </div>\r\n\r\n                    <div class="col-md-5 col-12">\r\n                        <mat-paginator\r\n                            [length]="table.totalData"\r\n                            [pageSize]="table.pageSize"\r\n                            [pageIndex]="table.getPageIndex()"\r\n                            [pageSizeOptions]="[10, 25, 50, 100, 250]"\r\n                            (page)="updatePage($event)"\r\n                        >\r\n                        </mat-paginator>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n',styles:[".billing-list .title{font-size:24px;font-family:Poppins;font-weight:700}.billing-list .sub--title{font-family:Poppins;font-weight:700}.wrapper{display:inline;width:1000px}.font-softer-black mb-0{padding-left:20px}.example-box-total{color:#659cff!important;border:1px solid #659cff;background-color:#e0ebff}.example-box-live{color:#2bca3b!important;border:1px solid #2bca3b;background-color:#e6fde9}.example-box-pending{color:#fb9334!important;border:1px solid #fb9334;background-color:#ffe8d2}::ng-deep .mat-tab-list .mat-tab-labels .mat-tab-label-active{color:#6177c4;font-weight:700}::ng-deep .mat-chip.mat-standard-chip:after{background-color:inherit!important}::ng-deep .mat-tab-group.tabs-billing{width:100%;margin-top:30px}::ng-deep .mat-tab-group.tabs-billing .mat-tab-header{background-color:#fff;border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:rgba(0,0,0,.1) 0 4px 12px}::ng-deep .mat-tab-group.tabs-billing .mat-tab-body-wrapper{min-height:500px;background-color:#fff;border-bottom-left-radius:8px;border-bottom-right-radius:8px;box-shadow:rgba(0,0,0,.1) 0 4px 12px}::ng-deep .mat-paginator.campaign-paginator .mat-paginator-container{align-items:normal}::ng-deep .mat-paginator.campaign-paginator .mat-tab-body{background-color:#fff}::ng-deep .mat-paginator.campaign-paginator .mat-form-field-underline{bottom:0}"]})],t)}(),bt=[{icon:"icon_wa",inputSvgIcon:"icon-wa-gray",image:"whatsapp.png",label:"WhatsApp",value:"WA"},{icon:"menu_sms",inputSvgIcon:"icon-sms-gray",image:"sms.png",label:"SMS",value:"SMS"},{icon:"icon_email",inputSvgIcon:"icon-email-gray",image:"email-contact.png",label:"Email",value:"EMAIL"},{icon:"icon_line",inputSvgIcon:"icon-line-gray",image:"line.png",label:"Line",value:"LINE"}],yt=[{name:"Text",code:"TEXT"},{name:"Media",code:"MEDIA"},{name:"Template",code:"TEMPLATE"},{name:"Text - Utility",code:"utility"}],xt=[{name:"Text",code:"HTML"},{name:"Template",code:"TEMPLATE"}],St=[{name:"Text",code:"TEXT"},{name:"Template",code:"TEMPLATE"}],wt=[{name:"Image",code:"IMAGE"},{name:"Video",code:"VIDEO"},{name:"Document",code:"DOCUMENT"}],Ct=[{title:"Total Campaigns",arrow:"../../../../assets/svg/icon-down-arrow.svg",value:0,date:"",icon:"../../../../assets/svg/icon-total-campaign.svg",dateclass:"redpercent"},{title:"Live Campaigns",arrow:"../../../../assets/svg/icon-down-arrow.svg",value:0,date:"",icon:"../../../../assets/svg/icon-use-campaign.svg",dateclass:"redpercent"},{title:"Pending Approval",arrow:"../../../../assets/svg/icon-down-arrow.svg",value:0,date:"",icon:"../../../../assets/svg/icon-pending-approval-campaign.svg",dateclass:"redpercent"}],It={legend:{icon:"circle",orient:"horizontal",x:"center",y:"bottom"},tooltip:{},dataset:{source:[["","WA Text","WA Template","WA Media","Product Catalog"]]},xAxis:{type:"category"},yAxis:{},series:[{type:"bar",color:"#E666DA"},{type:"bar",color:"#EB7215"},{type:"bar",color:"#F3B435"},{type:"bar",color:"#35CDF3"}]},Tt={tooltip:{trigger:"axis"},legend:{icon:"circle",data:["Delivery Rate of Campaigns","Total Number of Campaigns","Cost Distribution"],x:"center",y:"bottom"},xAxis:{type:"category",data:[]},yAxis:{type:"value"},series:[{name:"Delivery Rate of Campaigns",data:[],type:"line",smooth:!0,itemStyle:{normal:{color:"blue"}}},{name:"Total Number of Campaigns",data:[],type:"line",smooth:!0,itemStyle:{normal:{color:"green"}}},{name:"Cost Distribution",data:[],type:"line",smooth:!0,itemStyle:{normal:{color:"#E666DA"}}}]},At={WA:!1,SMS:!1,LINE:!1,EMAIL:!1,VOICE:!1},Ot={WA:!0,SMS:!0,LINE:!0,EMAIL:!0,VOICE:!0},Vt={WA:1,SMS:1,LINE:1,EMAIL:1,VOICE:1},Pt={WA:[],SMS:[],LINE:[],EMAIL:[],VOICE:[]},Mt={campaignName:[{type:"required",message:"General Information is required"},{type:"maxlength",message:"Maximum character 100"}],medium:[{type:"required",message:"Channel is required"}]},Nt={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"},{type:"maxlength",message:"Maximum character 1024"}],media:[{type:"required",message:"Media Type is required"}],fileName:[{type:"required",message:"File is required"}],template:[{type:"required",message:"Template is required"}],category:[{type:"required",message:"Category is required"}],catalogue:[{type:"required",message:"Catalog is required"}],product:[{type:"required",message:"Product is required"}],body:[{type:"maxlength",message:"Maximum character 100"}]},Dt={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"}],template:[{type:"required",message:"Template is required"}]},Lt={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"}],template:[{type:"required",message:"Template is required"}]},Ft={channel:[{type:"required",message:"Message Type is required"}],from:[{type:"required",message:"From is required"}],text:[{type:"required",message:"Text is required"}],template:[{type:"required",message:"Template is required"}]},Et={interval:[{type:"required",message:"Interval Time is required"},{type:"intervalTime",message:"Must be greater than 0 and without decimal"}],type:[{type:"required",message:"Main Rules is required"}],accountId:[{type:"required",message:"Account is required"}],subject:[{type:"required",message:"Subject is required"}],message:[{type:"required",message:"Message is required"}],templateName:[{type:"required",message:"Template is required"}]},Rt={startDate:[{type:"required",message:"Select Date is required"}],startTime:[{type:"required",message:"Select Time is required"}]};!function(t){t.Today="today",t.Yesterday="yesterday",t.CurrentWeek="currentWeek",t.LastWeek="last week",t.CurrentMonth="currentMonth",t.LastMonth="last month"}(nt||(nt={})),function(t){t.Draft="DRAFT",t.WaitingApproval="APPROVAL",t.Rejected="REJECTED",t.Scheduled="SCHEDULED",t.Stopped="STOPPED",t.Deleted="DELETED",t.Completed="COMPLETED",t.Failed="FAILED",t.Paused="PAUSED",t.Processing="PROCESS"}(at||(at={})),function(t){t.SingleProduct="product"}(rt||(rt={}));var kt,Bt=function(t){function n(){var e=null!==t&&t.apply(this,arguments)||this;return e.itemsPerPageLabel="Listing per Page",e.getRangeLabel=function(t,e,n){if(0===n||0===e)return"Show 0";var a=t*e;return"Show "+(a+1)+" - "+(a<(n=Math.max(n,0))?Math.min(a+e,n):a+e)},e}return G(n,t),n=J([e.Injectable()],n)}(o.MatPaginatorIntl),qt=function(t){return t?Object.keys(t).reduce((function(e,n){if(isNaN(Number(n))){var a=new dt,r=n.replace(/([A-Z])/g," $1").replace(/([0-9])/g," $1");a.label=r,isNaN(Number(t[n]))?a.value=t[n]:a.value=Number(t[n]),e.push(a)}return e}),[]):[]},Ut=function(){function t(t){this.apiAdapterService=t,this.channelOption=bt,this.filteredChannelOption=[],this.businessNameOption=[],this.filteredBusinessNameOption=[],this.statusOption=[],this.filteredStatusOption=[],this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.pageNoTemplateOption=1,this.subscribers=[],this.closeDropdown=new e.EventEmitter,this.onChangeFilter=new e.EventEmitter}return t.prototype.ngOnInit=function(){this.statusOption=qt(at),this.filteredStatusOption=X(this.statusOption),this.filteredChannelOption=X(this.channelOption),this.initForm(),this.getBusinessNameOptionService()},t.prototype.initForm=function(){var t,e,n,a,r,i,o,l,s,d,c,p,u,g;this.form=new m.FormGroup({businessName:new m.FormControl((e=null===(t=this.filterValue)||void 0===t?void 0:t.businessName,null!=e?e:"")),medium:new m.FormControl((a=null===(n=this.filterValue)||void 0===n?void 0:n.medium,null!=a?a:"")),templateName:new m.FormControl((i=null===(r=this.filterValue)||void 0===r?void 0:r.templateName,null!=i?i:"")),status:new m.FormControl((l=null===(o=this.filterValue)||void 0===o?void 0:o.status,null!=l?l:"")),startDate:new m.FormControl((d=null===(s=this.filterValue)||void 0===s?void 0:s.startDate,null!=d?d:"")),endDate:new m.FormControl((p=null===(c=this.filterValue)||void 0===c?void 0:c.endDate,null!=p?p:""))}),(null===(u=this.filterValue)||void 0===u?void 0:u.templateName)&&(this.templateOption=X(this.templateOption,[null===(g=this.filterValue)||void 0===g?void 0:g.templateName]))},t.prototype.getBusinessNameOptionService=function(){var t=this,e=this.apiAdapterService.executeApiRequest([],"/admin/client/all-with-child?pageNo=1&rowPerPage=1000","GET").subscribe((function(e){t.businessNameOption=e.data,t.filteredBusinessNameOption=X(t.businessNameOption)}));this.subscribers.push(e)},t.prototype.getTemplateOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingTemplateOption=!0;var a=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform",this.form.get("medium").value,"string"),this.initParam("filter",t,"string"),this.initParam("status","APPROVED","string")],r=this.apiAdapterService.executeApiRequest(a,"/message/template","GET").subscribe((function(t){n.templateOption=e?X(n.templateOption,t.data):t.data,n.isHaveNextTemplateOption=t.haveNext,n.isLoadingTemplateOption=!1}));this.subscribers.push(r)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService("",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.templateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(t)},t.prototype.businessNameSearch=function(t){var e=t.toLowerCase();this.filteredBusinessNameOption=this.businessNameOption.filter((function(t){return t.name.toLowerCase().includes(e)}))},t.prototype.channelSearch=function(t){var e=t.toLowerCase();this.filteredChannelOption=this.channelOption.filter((function(t){return t.label.toLowerCase().includes(e)}))},t.prototype.statusSearch=function(t){var e=t.toLowerCase();this.filteredStatusOption=this.statusOption.filter((function(t){return t.label.toLowerCase().includes(e)}))},t.prototype.clearDate=function(){this.form.get("startDate").setValue(null),this.form.get("endDate").setValue(null)},t.prototype.validateBackDate=function(){new Date(this.form.get("startDate").value).getTime()>new Date(this.form.get("endDate").value).getTime()&&this.form.get("endDate").setValue("")},t.prototype.onReset=function(){this.form.reset(),this.onChangeFilter.emit(this.form.getRawValue())},t.prototype.onCancel=function(){this.closeDropdown.emit()},t.prototype.onApply=function(){this.onChangeFilter.emit(this.form.getRawValue()),this.closeDropdown.emit()},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ut}]},t.ɵprov=e.ɵɵdefineInjectable({factory:function(){return new t(e.ɵɵinject(ut))},token:t,providedIn:"root"}),J([e.Output()],t.prototype,"onChangeFilter",void 0),J([e.Output()],t.prototype,"closeDropdown",void 0),J([e.Input()],t.prototype,"filterValue",void 0),t=J([e.Component({selector:"lib-filter-in-list-of-campaign",template:'<p class="font-16px font-bold">Filter</p>\r\n\r\n<form [formGroup]="form" class="contact-filter">\r\n    <div class="row">\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-70">\r\n                    <mat-label>Business Name</mat-label>\r\n                    <mat-select placeholder="Select Business Name" formControlName="businessName">\r\n                        <div class="select-search">\r\n                            <lib-search\r\n                                [placeholder]="\'Search\'"\r\n                                (searchRes)="businessNameSearch($event)"\r\n                            ></lib-search>\r\n                        </div>\r\n\r\n                        <mat-option value=""> --- select none --- </mat-option>\r\n                        <mat-option\r\n                            *ngFor="let option of filteredBusinessNameOption"\r\n                            [value]="option.id"\r\n                        >\r\n                            {{ option.name }}\r\n                        </mat-option>\r\n                        <mat-option *ngIf="!filteredBusinessNameOption.length" disabled>\r\n                            No data found\r\n                        </mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-70">\r\n                    <mat-label>Channel</mat-label>\r\n\r\n                    <mat-select placeholder="Select the Channel" formControlName="medium">\r\n                        <mat-option value=""> --- select none --- </mat-option>\r\n                        <mat-option\r\n                            *ngFor="let option of filteredChannelOption"\r\n                            [value]="option.value"\r\n                            (click)="getTemplateOptionService()"\r\n                        >\r\n                            {{ option.label }}\r\n                        </mat-option>\r\n                        <mat-option *ngIf="!filteredChannelOption.length" disabled>\r\n                            No data found\r\n                        </mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\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 Name</mat-label>\r\n\r\n                    <mat-select\r\n                        matSelectInfiniteScroll\r\n                        formControlName="templateName"\r\n                        placeholder="Select template"\r\n                        [complete]="isHaveNextTemplateOption === false"\r\n                        [compareWith]="templateSelectedDisplay"\r\n                        (infiniteScroll)="getNextTemplateBatch()"\r\n                    >\r\n                        <div style="margin: 20px">\r\n                            <lib-search\r\n                                [placeholder]="\'Search\'"\r\n                                [currentValue]="form?.get(\'templateName\').value?.name"\r\n                                (searchRes)="templateSearch($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            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-70">\r\n                    <mat-label>Status</mat-label>\r\n\r\n                    <mat-select placeholder="Select the Status" formControlName="status">\r\n                        <div class="select-search">\r\n                            <lib-search\r\n                                [placeholder]="\'Search\'"\r\n                                (searchRes)="statusSearch($event)"\r\n                            ></lib-search>\r\n                        </div>\r\n\r\n                        <mat-option value=""> --- select none --- </mat-option>\r\n                        <mat-option\r\n                            *ngFor="let option of filteredStatusOption"\r\n                            [value]="option.value"\r\n                        >\r\n                            {{ option.label }}\r\n                        </mat-option>\r\n                        <mat-option *ngIf="!filteredStatusOption.length" disabled>\r\n                            No data found\r\n                        </mat-option>\r\n                    </mat-select>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-100">\r\n                    <mat-label> Start Date </mat-label>\r\n                    <input\r\n                        matInput\r\n                        [matDatepicker]="startDatePicker"\r\n                        formControlName="startDate"\r\n                        class="mat-datepicker-input"\r\n                        (dateChange)="validateBackDate()"\r\n                    />\r\n\r\n                    <mat-datepicker-toggle matSuffix [for]="startDatePicker">\r\n                    </mat-datepicker-toggle>\r\n                    <mat-icon\r\n                        *ngIf="form.get(\'startDate\').value"\r\n                        matDatepickerToggleIcon\r\n                        (click)="clearDate()"\r\n                        >clear</mat-icon\r\n                    >\r\n                    <mat-datepicker #startDatePicker></mat-datepicker>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div class="col-md-12 col-12">\r\n            <div class="form-group">\r\n                <mat-form-field appearance="outline" floatLabel="always" class="w-100">\r\n                    <mat-label> End Date </mat-label>\r\n                    <input\r\n                        matInput\r\n                        [min]="form.get(\'startDate\').value"\r\n                        [matDatepicker]="endDatePicker"\r\n                        formControlName="endDate"\r\n                        class="mat-datepicker-input"\r\n                        (dateChange)="validateBackDate()"\r\n                    />\r\n\r\n                    <mat-datepicker-toggle matSuffix [for]="endDatePicker"> </mat-datepicker-toggle>\r\n                    <mat-icon\r\n                        *ngIf="form.get(\'endDate\').value"\r\n                        matDatepickerToggleIcon\r\n                        (click)="clearDate()"\r\n                        >clear</mat-icon\r\n                    >\r\n                    <mat-datepicker #endDatePicker></mat-datepicker>\r\n                </mat-form-field>\r\n            </div>\r\n        </div>\r\n\r\n        <div style="display: flex; flex: 1; width: 100%">\r\n            <button\r\n                mat-stroked-button\r\n                color="primary-telin"\r\n                class="telin-font-color w-48"\r\n                style="width: 100%; margin-bottom: 10px"\r\n                (click)="onReset()"\r\n            >\r\n                Reset\r\n            </button>\r\n        </div>\r\n        <div class="d-flex justify-content-between">\r\n            <button mat-stroked-button color="secondary-telin" class="w-48" (click)="onCancel()">\r\n                Cancel\r\n            </button>\r\n\r\n            <button mat-flat-button color="primary-telin-blue2" class="w-48" (click)="onApply()">\r\n                Apply\r\n            </button>\r\n        </div>\r\n    </div>\r\n</form>\r\n',styles:[".contact-filter .platform{display:-ms-grid;display:grid;grid-gap:5px;-ms-grid-columns:auto 1fr auto;grid-template-columns:auto 1fr auto}.button-row{margin:8px 8px 8px 0}.mat-datepicker-input{width:85%}.mat-icon{position:relative;float:right;top:-7px;cursor:pointer;color:rgba(0,0,0,.54)}.select-search{margin:20px}"]}),e.Injectable({providedIn:"root"})],t)}(),zt=function(){function t(){this.subject=new F.Subject}return t.prototype.sendClickEvent=function(){this.subject.next()},t.prototype.getEvent=function(){return this.subject.asObservable()},t.ɵprov=e.ɵɵdefineInjectable({factory:function(){return new t},token:t,providedIn:"root"}),t=J([e.Injectable({providedIn:"root"})],t)}(),jt=function(){},Ht=function(){function t(t,e){this.data=t,this.sharedService=e}var n,a;return t.prototype.deleteRowOn=function(){this.sharedService.sendClickEvent()},t.ctorParameters=function(){return[{type:jt,decorators:[{type:e.Inject,args:[v.MAT_DIALOG_DATA]}]},{type:zt}]},t=J([e.Component({selector:"app-confirmation",template:'<h2 mat-dialog-title\r\n\tclass="font-sbold text-center">\r\n\t{{ data?.title }}\r\n</h2>\r\n\r\n<mat-dialog-content class="confirmation-content">\r\n\t<div [innerHTML]="data?.content"\r\n\t\tclass="text-center"></div>\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions class="confirmation-actions mt-4">\r\n\t<button *ngIf="data?.btnCancel"\r\n\t\tmat-stroked-button\r\n\t\tcolor="secondary-telin"\r\n\t\tclass="w-48"\r\n\t\tmat-dialog-close>\r\n\t\t{{ data?.btnCancel }}\r\n\t</button>\r\n\r\n\t<button *ngIf="data?.btnSubmit"\r\n\t\tmat-flat-button\r\n\t\tcolor="primary-telin-blue2"\r\n\t\tclass="w-48"\r\n\t\t[mat-dialog-close]="true"\r\n\t\t(click)="deleteRowOn()">\r\n\t\t{{ data?.btnSubmit }}\r\n\t</button>\r\n\r\n\t<button mat-flat-button\r\n\t\t*ngIf="data?.btnSubmitRed"\r\n\t\tclass="font-bold telin-bg-color w-48 text-white"\r\n\t\tcolor="primary-telin"\r\n\t\t[mat-dialog-close]="true"\r\n\t\t(click)="deleteRowOn()">\r\n\t\t{{ data?.btnSubmitRed }}\r\n\t</button>\r\n</mat-dialog-actions>\r\n',styles:["::ng-deep .mat-dialog-container .mat-dialog-actions.confirmation-actions{margin-bottom:-10px}"]}),(n=0,a=e.Inject(v.MAT_DIALOG_DATA),function(t,e){a(t,e,n)})],t)}(),Wt=function(){function t(t,e,n){this.dialogRef=t,this.apiAdapterService=e,this.toastr=n,this.isLoading=!1,this.isSubmit=!1,this.isShowButton=!1,this.subscribers=[]}return t.prototype.ngOnInit=function(){var t,e,n;this.getCampaignDetailService(),this.isShowButton=null!=(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.isShowButton)&&n},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.convertUTCDateToLocalDate=function(t){return new Date(t.getTime()-60*t.getTimezoneOffset()*1e3)},t.prototype.getCampaignDetailService=function(){var t,e,n,a,r=this;if(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id){this.isLoading=!0;var i=this.apiAdapterService.executeApiRequest([],"/campaign/"+(null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.id),"GET").subscribe((function(t){var e,n,a,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M,N,D,L,F,E,R,k,B,q,U,z,j,H,W,_,G,J,Y,Z,K,Q,tt,et,nt,at,rt,it,ot,lt,st,dt,mt,ct,pt,ut,gt,ft,vt,ht,bt,yt,xt,St,wt,Ct,It,Tt,At,Ot,Vt,Pt,Mt,Nt,Dt,Lt,Ft,Et,Rt,kt,Bt,qt,Ut,zt;if(t){var jt={campaignName:null===(e=t.data)||void 0===e?void 0:e.name,medium:null===(n=t.data)||void 0===n?void 0:n.platform,channel:["image","video","document"].includes(null===(a=t.data)||void 0===a?void 0:a.type)?"MEDIA":(null===(i=t.data)||void 0===i?void 0:i.isDirectSend)?"utility":null===(l=null===(o=t.data)||void 0===o?void 0:o.type)||void 0===l?void 0:l.toUpperCase(),media:null===(d=null===(s=t.data)||void 0===s?void 0:s.type)||void 0===d?void 0:d.toUpperCase(),isPrevTemplate:null===(c=null===(m=t)||void 0===m?void 0:m.data)||void 0===c?void 0:c.isPrevTemplate,templateName:null===(u=null===(p=t)||void 0===p?void 0:p.data)||void 0===u?void 0:u.templateName,ttl:null===(f=null===(g=t)||void 0===g?void 0:g.data)||void 0===f?void 0:f.ttlSeconds,from:{id:null===(v=t.data)||void 0===v?void 0:v.accountId,name:null===(h=t.data)||void 0===h?void 0:h.accountName,platform:null===(b=t.data)||void 0===b?void 0:b.platform,clientId:null===(y=t.data)||void 0===y?void 0:y.clientId,clientName:null===(x=t.data)||void 0===x?void 0:x.clientName,accountNo:null===(S=t.data)||void 0===S?void 0:S.accountNo,wabaId:(C=null===(w=t.data)||void 0===w?void 0:w.wabaId,null!=C?C:"")},text:null===(T=null===(I=t.data)||void 0===I?void 0:I.details)||void 0===T?void 0:T.text,targetURL:(P=null===(V=null===(O=null===(A=t.data)||void 0===A?void 0:A.details)||void 0===O?void 0:O.image)||void 0===V?void 0:V.url,L=null!=P?P:null===(D=null===(N=null===(M=t.data)||void 0===M?void 0:M.details)||void 0===N?void 0:N.document)||void 0===D?void 0:D.url,k=null!=L?L:null===(R=null===(E=null===(F=t.data)||void 0===F?void 0:F.details)||void 0===E?void 0:E.video)||void 0===R?void 0:R.url,null!=k?k:null===(U=null===(q=null===(B=t.data)||void 0===B?void 0:B.details)||void 0===q?void 0:q.template)||void 0===U?void 0:U.headerURL),paramHeader:null===(H=null===(j=null===(z=t.data)||void 0===z?void 0:z.details)||void 0===j?void 0:j.template)||void 0===H?void 0:H.header,paramBody:null===(G=null===(_=null===(W=t.data)||void 0===W?void 0:W.details)||void 0===_?void 0:_.template)||void 0===G?void 0:G.data,paramButton:null===(Z=null===(Y=null===(J=t.data)||void 0===J?void 0:J.details)||void 0===Y?void 0:Y.template)||void 0===Z?void 0:Z.button,otpValue:null===(nt=X((et=null===(tt=null===(Q=null===(K=t.data)||void 0===K?void 0:K.details)||void 0===Q?void 0:Q.template)||void 0===tt?void 0:tt.data,null!=et?et:[])))||void 0===nt?void 0:nt.pop(),template:{ID:null===(it=null===(rt=null===(at=t.data)||void 0===at?void 0:at.details)||void 0===rt?void 0:rt.template)||void 0===it?void 0:it.id,name:null===(st=null===(lt=null===(ot=t.data)||void 0===ot?void 0:ot.details)||void 0===lt?void 0:lt.template)||void 0===st?void 0:st.name,lang:null===(ct=null===(mt=null===(dt=t.data)||void 0===dt?void 0:dt.details)||void 0===mt?void 0:mt.template)||void 0===ct?void 0:ct.lang,platform:null===(pt=t.data)||void 0===pt?void 0:pt.platform,headerURL:null===(ft=null===(gt=null===(ut=t.data)||void 0===ut?void 0:ut.details)||void 0===gt?void 0:gt.template)||void 0===ft?void 0:ft.headerURL,header:{examples:null===(bt=null===(ht=null===(vt=t.data)||void 0===vt?void 0:vt.details)||void 0===ht?void 0:ht.template)||void 0===bt?void 0:bt.header},body:{examples:null===(St=null===(xt=null===(yt=t.data)||void 0===yt?void 0:yt.details)||void 0===xt?void 0:xt.template)||void 0===St?void 0:St.data},buttons:null===(It=null===(Ct=null===(wt=t.data)||void 0===wt?void 0:wt.details)||void 0===Ct?void 0:Ct.template)||void 0===It?void 0:It.button,ClientId:null===(Tt=t.data)||void 0===Tt?void 0:Tt.clientId,ClientName:null===(At=t.data)||void 0===At?void 0:At.clientName},isUpload:""!==(null===(Ot=t.data)||void 0===Ot?void 0:Ot.fileId),fileId:null===(Vt=t.data)||void 0===Vt?void 0:Vt.fileId};localStorage.setItem("telin.campaign",JSON.stringify($($({},r.getCampaignStorage),{generalInformation:{id:null===(Pt=t.data)||void 0===Pt?void 0:Pt.id,form:jt},failover:null===(Mt=t.data)||void 0===Mt?void 0:Mt.failover,targetAudience:null===(Nt=t.data)||void 0===Nt?void 0:Nt.targets,targetAudienceFile:{name:null===(Dt=t.data)||void 0===Dt?void 0:Dt.fileName,targetURL:null===(Lt=t.data)||void 0===Lt?void 0:Lt.targetURL},scheduler:{schedulerType:"MULTI"===(null===(Ft=t.data)||void 0===Ft?void 0:Ft.scheduleType)?"ONE_TIME":null===(Et=t.data)||void 0===Et?void 0:Et.scheduleType,startDate:null===(kt=null===(Rt=t.data)||void 0===Rt?void 0:Rt.startTime)||void 0===kt?void 0:kt.split(" ")[0],startTime:null===(qt=null===(Bt=t.data)||void 0===Bt?void 0:Bt.startTime)||void 0===qt?void 0:qt.split(" ")[1],isRepeat:"MULTI"===(null===(Ut=t.data)||void 0===Ut?void 0:Ut.scheduleType),delivery:null===(zt=t.data)||void 0===zt?void 0:zt.repeat}}))),r.isLoading=!1}}),(function(){r.isLoading=!1}));this.subscribers.push(i)}},t.prototype.rejectCampaignService=function(){var t,e,n=this;this.isSubmit=!0;var a=this.apiAdapterService.executeApiRequest([],"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/reject","POST").subscribe((function(t){var e;if(n.isSubmit=!1,!t||!(null===(e=t)||void 0===e?void 0:e.data))return n.toastr.error("Error Rejecting Campaign!");n.toastr.success("Campaign Rejected Successfully!"),n.onClose()}),(function(){n.toastr.error("Error Rejecting Campaign!"),n.isSubmit=!1}));this.subscribers.push(a)},t.prototype.approveCampaignService=function(){var t,e,n=this;this.isSubmit=!0;var a=this.apiAdapterService.executeApiRequest([],"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/approve","POST").subscribe((function(t){var e;if(n.isSubmit=!1,!t||!(null===(e=t)||void 0===e?void 0:e.data))return n.toastr.error("Error Approving Campaign!");n.toastr.success("Campaign Approved Successfully!"),n.onClose()}),(function(){n.toastr.error("Error Approving Campaign!"),n.isSubmit=!1}));this.subscribers.push(a)},t.prototype.onClose=function(){localStorage.removeItem("telin.campaign"),this.dialogRef.close()},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:v.MatDialogRef},{type:ut},{type:s.ToastrService}]},t=J([e.Component({selector:"lib-pending-approval-dialog-view",template:'<div mat-dialog-title\r\n\tclass="d-flex justify-content-between align-items-center">\r\n\t<h2 class="font-PoppinsBold font-24px">Summary</h2>\r\n\r\n\t<button mat-button\r\n\t\t(click)="onClose()">\r\n\t\t<mat-icon class="icon-menu">close</mat-icon>\r\n\t</button>\r\n</div>\r\n\r\n<mat-dialog-content class="campaign-view">\r\n\t<ng-container *ngIf="!isLoading; else isSpinner">\r\n\t\t<div *ngIf="isSubmit"\r\n\t\t\tclass="overlay-bg">\r\n\t\t\t<img src="../../../../../assets/images/spinner.svg"\r\n\t\t\t\tclass="overlay-bg__center" />\r\n\t\t</div>\r\n\t\t<lib-new-campaign-summary [isShowLabel]="true"></lib-new-campaign-summary>\r\n\t</ng-container>\r\n</mat-dialog-content>\r\n\r\n<mat-dialog-actions>\r\n\t<button mat-stroked-button\r\n\t\tcolor="secondary-telin"\r\n\t\t[disabled]="isSubmit"\r\n\t\t(click)="onClose()">\r\n\t\tCancel\r\n\t</button>\r\n\r\n\t<ng-container *ngIf="isShowButton">\r\n\t\t<button mat-flat-button\r\n\t\t\tcolor="primary-telin"\r\n\t\t\tclass="font-bold telin-bg-color"\r\n\t\t\tstyle="color: white"\r\n\t\t\t[disabled]="isSubmit"\r\n\t\t\t(click)="rejectCampaignService()">\r\n\t\t\tReject\r\n\t\t</button>\r\n\r\n\t\t<button mat-flat-button\r\n\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t[disabled]="isSubmit"\r\n\t\t\t(click)="approveCampaignService()">\r\n\t\t\tApprove\r\n\t\t</button>\r\n\t</ng-container>\r\n</mat-dialog-actions>\r\n\r\n<ng-template #isSpinner>\r\n\t<div class="text-center my-auto">\r\n\t\t<img src="../../../../../assets/images/spinner.svg" />\r\n\t</div>\r\n</ng-template>\r\n',styles:["::ng-deep .mat-dialog-content.campaign-view{max-height:100%;overflow-x:hidden}.overlay-bg{position:absolute;top:18px;left:18px;right:28px;bottom:18px;z-index:99;background-color:rgba(0,0,0,.25);border-radius:16px}.overlay-bg__center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}"]})],t)}(),_t=function(){function t(t,n,a){this.dialog=t,this.apiAdapterService=n,this.toastr=a,this.currentView=new e.EventEmitter,this.updateTable=new e.EventEmitter,this.currentViews=K,this.subscribers=[]}return t.prototype.ngOnInit=function(){},t.prototype.sort=function(){this.table.dataSource.sort=this.matSort},t.prototype.actionRow=function(t,e){switch(e){case"pause":this.campaignConfirmationDialog(t.id,{title:"Pause Campaign",content:"Are you sure you want to Pause this Campaign?",url:"/campaign/"+t.id+"/pause",method:"POST",message:"Selected campaign is successfully paused"});break;case"stop":this.campaignConfirmationDialog(t.id,{title:"Stop Campaign",content:"Are you sure you want to Stop this Campaign?",url:"/campaign/"+t.id+"/stop",method:"POST",message:"Selected campaign is successfully stop"});break;case"delete":"COMPLETED"!==t.status&&this.campaignConfirmationDialog(t.id,{title:"Delete Campaign",content:"Are you sure you want to Delete this Campaign?",url:"/campaign/"+t.id+"/delete",method:"DELETE",message:"Selected campaign is successfully deleted"});break;case"live":this.campaignConfirmationDialog(t.id,{title:"Resume Campaign",content:"Are you sure you want to Resume this Campaign?",url:"/campaign/"+t.id+"/resume",method:"POST",message:"Selected campaign is successfully resume"})}},t.prototype.campaignConfirmationDialog=function(t,e){var n=this,a=new jt;a.title=e.title,a.content=e.content,a.btnSubmit="Yes",a.btnCancel="No";var r=this.dialog.open(Ht,{autoFocus:!1,backdropClass:"overlay-backdrop-dialog",data:a}).afterClosed().subscribe((function(t){t&&n.campaignService(e)}));this.subscribers.push(r)},t.prototype.campaignService=function(t){var e=this,n=this.apiAdapterService.executeApiRequest([],t.url,t.method).subscribe((function(){e.toastr.error(t.message),e.updateTable.emit()}));this.subscribers.push(n)},t.prototype.editCampaign=function(t){localStorage.removeItem("telin.campaign"),window.history.replaceState({},"","/secure/campaign/"+t.id),this.currentView.emit(this.currentViews.NewCampaign)},t.prototype.openViewDialog=function(t,e){var n,a=this;void 0===e&&(e=!1),localStorage.setItem("telin.campaign",JSON.stringify({generalInformation:{id:null===(n=t)||void 0===n?void 0:n.id,isShowButton:e}}));var r=this.dialog.open(Wt,{autoFocus:!1,height:"calc(100% - 30px)",width:"calc(100% - 30px)",maxWidth:"100%",maxHeight:"100%",backdropClass:"overlay-backdrop-dialog"}).afterClosed().subscribe((function(){a.updateTable.emit()}));this.subscribers.push(r)},t.prototype.convertUTCDateToLocalDate=function(t){return new Date(t.getTime()-60*t.getTimezoneOffset()*1e3)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:v.MatDialog},{type:ut},{type:s.ToastrService}]},J([e.Output()],t.prototype,"currentView",void 0),J([e.Output()],t.prototype,"updateTable",void 0),J([e.Input()],t.prototype,"table",void 0),J([e.ViewChild(O.MatSort,{static:!1})],t.prototype,"matSort",void 0),t=J([e.Component({selector:"lib-viewing-list-of-campaign-table",template:'<div class="account-table">\r\n    <div class="table-responsive">\r\n        <table\r\n            mat-table\r\n            matSort\r\n            matSortDisableClear\r\n            class="table w-100 mb-2"\r\n            [dataSource]="table.dataSource"\r\n            (matSortChange)="sort()"\r\n        >\r\n            <ng-container\r\n                *ngFor="let index of [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14]"\r\n                [matColumnDef]="table.columns[index]"\r\n            >\r\n                <th *matHeaderCellDef [mat-sort-header]="table.columns[index]">\r\n                    {{ table.labels[index] }}\r\n\r\n                    <span\r\n                        *ngIf="index === 7"\r\n                        [matTooltip]="\r\n                            \'Total number of messages that have been processed for this broadcast, but still waiting to receive the delivery statuses\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 8"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been successfully sent out to the contacts in the broadcast messaging\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 9"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been successfully delivered to the recipients devices\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 10"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been opened and read by the recipients\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                    <span\r\n                        *ngIf="index === 11"\r\n                        [matTooltip]="\r\n                            \'The total number of messages that have been failed sent out to the contacts in the broadcast messaging\'\r\n                        "\r\n                    >\r\n                        <mat-icon class="icon-menu font-16px">info</mat-icon>\r\n                    </span>\r\n                </th>\r\n\r\n                <td *matCellDef="let row">\r\n                    <ng-container *ngIf="index === 8">\r\n                        {{ row.sentCount + row.platformQueueCount }}\r\n                    </ng-container>\r\n                    <ng-container *ngIf="index !== 8">\r\n                        {{ row[table.columns[index]] }}\r\n\r\n                        <span\r\n                            *ngIf="index === 5 && row.status === \'FAILED\'"\r\n                            class="tooltip-toggle"\r\n                            [attr.aria-label]="row.detailFailed"\r\n                            tabindex="0"\r\n                        >\r\n                            <mat-icon class="icon-menu font-16px" style="color: #ed1c24"\r\n                                >info</mat-icon\r\n                            >\r\n                        </span>\r\n                    </ng-container>\r\n                </td>\r\n            </ng-container>\r\n\r\n            <ng-container [matColumnDef]="table.columns[15]">\r\n                <th *matHeaderCellDef>\r\n                    {{ table.labels[15] }}\r\n                </th>\r\n\r\n                <td *matCellDef="let row" class="d-flex border-bottom-0">\r\n                    <ng-container *ngIf="row.status === \'DRAFT\' || row.status === \'APPROVAL\'">\r\n                        <mat-icon\r\n                            class="icon-menu pointer w-18px mr-3"\r\n                            (click)="openViewDialog(row, row.status === \'APPROVAL\')"\r\n                            >visibility</mat-icon\r\n                        >\r\n\r\n                        <mat-icon\r\n                            class="icon-menu pointer w-18px mr-3"\r\n                            svgIcon="icon_edit"\r\n                            (click)="editCampaign(row)"\r\n                        ></mat-icon>\r\n\r\n                        <mat-icon\r\n                            class="icon-menu pointer w-18px mr-3"\r\n                            svgIcon="icon_delete"\r\n                            (click)="actionRow(row, \'delete\')"\r\n                        ></mat-icon>\r\n                    </ng-container>\r\n\r\n                    <mat-icon\r\n                        *ngIf="row.status === \'PAUSED\'"\r\n                        class="icon-menu live-color pointer w-18px mr-3"\r\n                        (click)="actionRow(row, \'live\')"\r\n                        >play_arrow</mat-icon\r\n                    >\r\n\r\n                    <mat-icon\r\n                        *ngIf="row.status === \'SCHEDULED\'"\r\n                        class="icon-menu pause-color pointer w-18px mr-3"\r\n                        (click)="actionRow(row, \'pause\')"\r\n                        >pause</mat-icon\r\n                    >\r\n\r\n                    <mat-icon\r\n                        *ngIf="row.status === \'SCHEDULED\' || row.status === \'PAUSED\'"\r\n                        class="icon-menu stop-color pointer w-18px mr-3"\r\n                        (click)="actionRow(row, \'stop\')"\r\n                        >stop</mat-icon\r\n                    >\r\n                </td>\r\n            </ng-container>\r\n\r\n            <ng-container matColumnDef="no-content">\r\n                <th class="text-center" *matHeaderCellDef [colSpan]="table.columns.length">\r\n                    Data Not Available\r\n                </th>\r\n            </ng-container>\r\n\r\n            <tr mat-header-row *matHeaderRowDef="table.columns"></tr>\r\n\r\n            <tr\r\n                mat-header-row\r\n                class="no-content"\r\n                *matHeaderRowDef="[\'no-content\']"\r\n                [style.display]="table.dataSource?.data?.length === 0 ? \'table-row\' : \'none\'"\r\n            ></tr>\r\n\r\n            <tr mat-row *matRowDef="let row; columns: table.columns"></tr>\r\n        </table>\r\n    </div>\r\n</div>\r\n',styles:[".w-18px{width:18px}.stop-color{color:orange}.pause-color{background-color:#e9f5f9;color:#0089ab;opacity:25%}.live-color{background-color:#e9f9f2;color:#0089ab;opacity:25%}.tooltip-toggle{cursor:pointer;position:relative}.tooltip-toggle::before{position:absolute;top:-60px;left:-80px;background-color:#2b222a;border-radius:5px;content:attr(aria-label);padding:1rem;text-transform:none;transition:.5s;width:auto}.tooltip-toggle::after,.tooltip-toggle::before{color:#efefef;font-family:monospace;font-size:16px;opacity:0;pointer-events:none;text-align:center}.tooltip-toggle:focus::after,.tooltip-toggle:focus::before,.tooltip-toggle:hover::after,.tooltip-toggle:hover::before{opacity:1;transition:.75s}"]})],t)}(),Gt=function(){function t(){}return t=J([e.NgModule({declarations:[_t,Ut,ht,st],imports:[a.CommonModule,m.FormsModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,f.MatDatepickerModule,V.MatTableModule,O.MatSortModule,o.MatPaginatorModule,v.MatDialogModule,P.MatTabsModule,i.MatCardModule,g.MatCheckboxModule,T.MatSelectModule,I.MatRadioModule,u.MatButtonModule,x.MatIconModule,R.MatChipsModule,D.NgbPaginationModule,D.NgbDropdownModule,R.MatChipsModule,y.MatGridListModule,k.MatNativeDateModule,et,B.MatToolbarModule,q.MatTooltipModule],exports:[ht,st]})],t)}(),$t=function(){function t(t){this.apiAdapterService=t,this.currentViews=K,this.pastTime=nt,this.channelOption=bt,this.performanceCategories=[],this.totalCmpn=[],this.deliveryRt=[],this.costDesc=[],this.convsData=[],this.widgetLiveCampaign=Ct,this.selectedPlatform="",this.filterEvent="currentWeek",this.subscribers=[],this.currentView=new e.EventEmitter}return t.prototype.ngOnInit=function(){},t.prototype.changeCurrentView=function(t){this.currentView.emit(t)},t.prototype.filterChart=function(t){var e=this;if(this.selectedPlatform){var n=t==nt.Today?"daily":t==nt.CurrentWeek?"weekly":t==nt.CurrentMonth?"monthly":"",a=this.apiAdapterService.executeApiRequest([],"/campaign/count","GET").subscribe((function(n){var a,r,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O=(null!=(i=null===(r=null===(a=n)||void 0===a?void 0:a.data)||void 0===r?void 0:r.totalCampaignPercent)?i:0)+"% Since "+e.getStatictsWidgetString(t);e.widgetLiveCampaign[0].arrow=(null===(l=null===(o=n)||void 0===o?void 0:o.data)||void 0===l?void 0:l.totalCampaignPercent)>0?"../../../../assets/svg/icon-up-arrow.svg":"../../../../assets/svg/icon-down-arrow.svg",e.widgetLiveCampaign[0].value=null!=(m=null===(d=null===(s=n)||void 0===s?void 0:s.data)||void 0===d?void 0:d.totalCampaign)?m:0,e.widgetLiveCampaign[0].date=O,e.widgetLiveCampaign[0].dateclass=(null===(p=null===(c=n)||void 0===c?void 0:c.data)||void 0===p?void 0:p.totalCampaignPercent)>0?"greenpercent":"redpercent",e.widgetLiveCampaign[1].arrow=(null===(g=null===(u=n)||void 0===u?void 0:u.data)||void 0===g?void 0:g.totalCampaignPercent)>0?"../../../../assets/svg/icon-up-arrow.svg":"../../../../assets/svg/icon-down-arrow.svg",e.widgetLiveCampaign[1].value=null!=(h=null===(v=null===(f=n)||void 0===f?void 0:f.data)||void 0===v?void 0:v.totalLive)?h:0,e.widgetLiveCampaign[1].date=O,e.widgetLiveCampaign[1].dateclass=(null===(y=null===(b=n)||void 0===b?void 0:b.data)||void 0===y?void 0:y.totalCampaignPercent)>0?"greenpercent":"redpercent",e.widgetLiveCampaign[2].arrow=(null===(S=null===(x=n)||void 0===x?void 0:x.data)||void 0===S?void 0:S.totalCampaignPercent)>0?"../../../../assets/svg/icon-up-arrow.svg":"../../../../assets/svg/icon-down-arrow.svg",e.widgetLiveCampaign[2].value=null!=(I=null===(C=null===(w=n)||void 0===w?void 0:w.data)||void 0===C?void 0:C.totalPending)?I:0,e.widgetLiveCampaign[2].date=O,e.widgetLiveCampaign[2].dateclass=(null===(A=null===(T=n)||void 0===T?void 0:T.data)||void 0===A?void 0:A.totalCampaignPercent)>0?"greenpercent":"redpercent"}));this.subscribers.push(a),this.getPerformanceDetails(n),this.getConversationDetails(n)}},t.prototype.getPerformanceDetails=function(t){var e=this;if(this.selectedPlatform){this.setPerformanceChartData();var n=[{name:"timeUnit",value:t,in:"query",type:"String"},{name:"clientId",value:localStorage.getItem("telin.clientId"),in:"query",type:"String"},{name:"platform",value:"WHATSAPP"===this.selectedPlatform?"WA":this.selectedPlatform,in:"query",type:"String"}],a=this.apiAdapterService.executeApiRequest(n,"/report/campaign/performance","GET").subscribe((function(t){var n,a,r,i,o,l,s,d;if(e.performanceCategories=[],e.totalCmpn=[],e.deliveryRt=[],e.costDesc=[],(null===(o=t)||void 0===o?void 0:o.data)&&0!==Object.entries(t.data).length){try{for(var m=Y(t.data.categories),c=m.next();!c.done;c=m.next()){var p=c.value;e.performanceCategories.push(p)}}catch(t){n={error:t}}finally{try{c&&!c.done&&(a=m.return)&&a.call(m)}finally{if(n)throw n.error}}try{for(var u=Y(t.data.series),g=u.next();!g.done;g=u.next()){var f=g.value;"Total Campaign"===f.name?e.totalCmpn=null===(l=f.data)||void 0===l?void 0:l.map((function(t){return t})):"Delivery Rate"===f.name?e.deliveryRt=null===(s=f.data)||void 0===s?void 0:s.map((function(t){return t})):"Cost Distribution"===f.name&&(e.costDesc=null===(d=f.data)||void 0===d?void 0:d.map((function(t){return t})))}}catch(t){r={error:t}}finally{try{g&&!g.done&&(i=u.return)&&i.call(u)}finally{if(r)throw r.error}}e.setPerformanceChartData()}}));this.subscribers.push(a)}},t.prototype.setPerformanceChartData=function(){this.performanceChartData=Tt,this.performanceChartData.xAxis.data=this.performanceCategories,this.performanceChartData.series[0].data=this.deliveryRt,this.performanceChartData.series[1].data=this.totalCmpn,this.performanceChartData.series[2].data=this.costDesc},t.prototype.getConversationDetails=function(t){var e=this;if(this.selectedPlatform){this.setConversationChartData();var n=[{name:"timeUnit",value:t,in:"query",type:"String"},{name:"clientId",value:localStorage.getItem("telin.clientId"),in:"query",type:"String"},{name:"platform",value:"WHATSAPP"===this.selectedPlatform?"WA":this.selectedPlatform,in:"query",type:"String"}],a=this.apiAdapterService.executeApiRequest(n,"/report/campaign/conversation","GET").subscribe((function(t){var n,a,r;if(e.convsData=[],null===(n=t)||void 0===n?void 0:n.data){for(var i=0;i<(null===(a=t.data.categories)||void 0===a?void 0:a.length);i++){e.convsData[i]=new Array,e.convsData[i].push(t.data.categories[i]);for(var o=1;o<=(null===(r=t.data.series)||void 0===r?void 0:r.length);o++)e.convsData[i].push(t.data.series[o-1].data[i])}e.setConversationChartData()}}));this.subscribers.push(a)}},t.prototype.setConversationChartData=function(){var t=this;this.conversationChartData=It,this.convsData.forEach((function(e){e&&t.conversationChartData.dataset.source.push(e)}))},t.prototype.getStatictsWidgetString=function(t){return t==nt.Today?nt.Yesterday:t==nt.CurrentWeek?nt.LastWeek:t==nt.CurrentMonth?nt.LastMonth:""},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ut}]},J([e.Output()],t.prototype,"currentView",void 0),t=J([e.Component({selector:"lib-dashboard",template:'<section class="dashboard-container">\r\n\t<h2 class="font-PoppinsBold font-32px">Campaign</h2>\r\n\r\n\t<p class="font-PoppinsLight">Welcome to your Campaign Dashboard!</p>\r\n\r\n\t<div class="d-flex align-items-center w-100 mb-4">\r\n\t\t<mat-grid-list cols="2"\r\n\t\t\trowHeight="50px">\r\n\t\t\t<mat-button-toggle-group name="fontStyle"\r\n\t\t\t\taria-label="Font Style"\r\n\t\t\t\tvalue="week">\r\n\t\t\t\t<mat-button-toggle (click)="filterChart(pastTime.Today)"\r\n\t\t\t\t\tvalue="day">\r\n\t\t\t\t\tToday\r\n\t\t\t\t</mat-button-toggle>\r\n\t\t\t\t<mat-button-toggle (click)="filterChart(pastTime.CurrentWeek)"\r\n\t\t\t\t\tvalue="week">\r\n\t\t\t\t\tCurrent Week\r\n\t\t\t\t</mat-button-toggle>\r\n\t\t\t\t<mat-button-toggle (click)="filterChart(pastTime.CurrentMonth)"\r\n\t\t\t\t\tvalue="month">\r\n\t\t\t\t\tCurrent Month\r\n\t\t\t\t</mat-button-toggle>\r\n\t\t\t</mat-button-toggle-group>\r\n\t\t</mat-grid-list>\r\n\r\n\t\t<div class="px-5">\r\n\t\t\t<span> Channel: </span>\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tclass="w-50">\r\n\t\t\t\t<mat-select placeholder="Choose .."\r\n\t\t\t\t\t[(ngModel)]="selectedPlatform">\r\n\t\t\t\t\t<mat-option *ngFor="let option of channelOption"\r\n\t\t\t\t\t\t[value]="option.value"\r\n\t\t\t\t\t\t(click)="filterChart(filterEvent)">\r\n\t\t\t\t\t\t{{ option.label }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class="d-flex gap-4">\r\n\t\t<div class="left-side">\r\n\t\t\t<div class="d-flex justify-content-between gap-4">\r\n\t\t\t\t<div>\r\n\t\t\t\t\t<h5 class="font-PoppinsBold font-24px mb-3">\r\n\t\t\t\t\t\tDeliver more engaging campaigns to your customers on WhatsApp\r\n\t\t\t\t\t</h5>\r\n\r\n\t\t\t\t\t<p class="mb-3">\r\n\t\t\t\t\t\tTurn conversations into sales, generate more qualified leads and recommend the right\r\n\t\t\t\t\t\tproduct or services!\r\n\t\t\t\t\t</p>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<img src="../../../../assets/svg/bg_widget_campaign.svg"\r\n\t\t\t\t\talt="communicate" />\r\n\t\t\t</div>\r\n\r\n\t\t\t<button mat-flat-button\r\n\t\t\t\ttype="button"\r\n\t\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t\tstyle="height: 42px"\r\n\t\t\t\t(click)="changeCurrentView(currentViews.CampaignIndex)">\r\n\t\t\t\tGo to Broadcast Messaging\r\n\t\t\t</button>\r\n\t\t</div>\r\n\r\n\t\t<div class="right-side">\r\n\t\t\t<div class="d-flex gap-4">\r\n\t\t\t\t<div *ngFor="let widgetLive of widgetLiveCampaign"\r\n\t\t\t\t\tclass="widget-card">\r\n\t\t\t\t\t<img style="width: 56px"\r\n\t\t\t\t\t\t[src]="widgetLive.icon"\r\n\t\t\t\t\t\t[alt]="widgetLive.title" />\r\n\r\n\t\t\t\t\t<p class="font-PoppinsLight mt-3">{{ widgetLive.title }}</p>\r\n\r\n\t\t\t\t\t<p class="d-flex align-items-center">\r\n\t\t\t\t\t\t<span class="font-PoppinsBold font-36px mr-2"\r\n\t\t\t\t\t\t\tstyle="font-size: 36px">\r\n\t\t\t\t\t\t\t{{ widgetLive.value }}\r\n\t\t\t\t\t\t</span>\r\n\r\n\t\t\t\t\t\t<img style="margin-top: 5px"\r\n\t\t\t\t\t\t\twidth="25"\r\n\t\t\t\t\t\t\t[src]="widgetLive.arrow" />\r\n\t\t\t\t\t</p>\r\n\r\n\t\t\t\t\t<span class="font-10px"\r\n\t\t\t\t\t\t[classList]="widgetLive.dateclass">\r\n\t\t\t\t\t\t{{ widgetLive.date }}\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n\r\n\t<div class="d-flex gap-4 mt-4">\r\n\t\t<div class="card left-card w-50">\r\n\t\t\t<div class="card-body">\r\n\t\t\t\t<p class="font-PoppinsBold font-20px">Campaign\'s Performance</p>\r\n\r\n\t\t\t\t<div echarts\r\n\t\t\t\t\tclass="demo-chart"\r\n\t\t\t\t\t[options]="performanceChartData"></div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\r\n\t\t<div class="card left-card w-50">\r\n\t\t\t<div class="card-body">\r\n\t\t\t\t<p class="font-PoppinsBold font-20px">Conversation Insights</p>\r\n\r\n\t\t\t\t<div id="chart">\r\n\t\t\t\t\t<div echarts\r\n\t\t\t\t\t\tclass="demo-chart"\r\n\t\t\t\t\t\t[options]="conversationChartData"></div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n</section>\r\n',styles:[".dashboard-container{width:100%;padding:24px}.dashboard-container .mat-button-toggle-group{border-radius:15px}.dashboard-container .mat-button-toggle{background-color:#fff;color:#000}.dashboard-container .mat-button-toggle-checked{background:#ed1c24;color:#fff}.dashboard-container .mat-button-toggle-label-content:visited{color:#fff}.dashboard-container .left-side{flex:50%;min-height:231px;padding:24px;border-radius:10px;background-color:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04)}.dashboard-container .right-side{flex:50%}.dashboard-container .widget-card{width:39%;min-height:231px;padding:24px;border-radius:10px;background-color:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04)}.dashboard-container .line-chart{height:65vh;width:70%;margin-left:2%;background-color:#fff;border-radius:15px;margin-bottom:50px;margin-right:20px;padding:30px}.dashboard-container .doughnut-chart{margin-right:2%;border-radius:15px;height:65vh;background-color:#fff;width:22.5%;margin-bottom:20px;padding:40px}.dashboard-container .greenpercent{color:green}.dashboard-container .redpercent{color:red}.dashboard-container .left-card{box-shadow:12px 12px 20px rgba(44,59,113,.04);border-radius:8px;border-style:none}.dashboard-container .left-card .card-body{min-height:440px}"]})],t)}(),Jt=function(){function t(){}return t=J([e.NgModule({declarations:[$t],imports:[a.CommonModule,c.MatAutocompleteModule,m.FormsModule,y.MatGridListModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,T.MatSelectModule,I.MatRadioModule,w.MatListModule,u.MatButtonModule,x.MatIconModule,M.PickerModule,N.AngularEditorModule,z.MatButtonToggleModule,v.MatDialogModule,P.MatTabsModule,p.MatBadgeModule,D.NgbDropdownModule,l.NgxEchartsModule],exports:[$t]})],t)}(),Yt=function(){function t(){}return t.prototype.clone=function(t){var e,n;return this.active=t.active,this.interval=null!=(e=t.interval)?e:0,this.type=null!=(n=t.type)?n:"",t.accounts&&(this.accounts=t.accounts.reduce((function(t,e){return t.push((new Zt).clone(e)),t}),[])),this},t.prototype.convert=function(){return{failover:this}},t}(),Zt=function(){function t(){}return t.prototype.clone=function(t){var e,n,a,r,i,o,l,s,d,m,c,p,u,g;return this.accountId=null!=(n=null===(e=t.accountId)||void 0===e?void 0:e.id)?n:"",this.accountName=null!=(a=t.accountName)?a:"",this.subject=null!=(r=t.subject)?r:"",this.platform=null!=(i=t.platform)?i:"",this.template={id:(l=null===(o=t.template)||void 0===o?void 0:o.ID,null!=l?l:""),name:(d=null===(s=t.template)||void 0===s?void 0:s.name,m=null!=d?d:t.template,null!=m?m:""),lang:(p=null===(c=t.template)||void 0===c?void 0:c.lang,null!=p?p:""),data:(g=null===(u=t.paramBody)||void 0===u?void 0:u.map((function(t){return t.name})),null!=g?g:[])},this},t.prototype.convert=function(){return this},t}(),Xt=function(){function t(){}return t.prototype.clone=function(t){var e,n,a,r,i,o,l,s,d,m,c,p,u,g,f,v;return"IMAGE"!==(null===(e=t)||void 0===e?void 0:e.media)&&"VIDEO"!==(null===(n=t)||void 0===n?void 0:n.media)&&"DOCUMENT"!==(null===(a=t)||void 0===a?void 0:a.media)||(t.channel=t.media),t.campaignName&&(this.name=t.campaignName),"EMAIL"===t.medium&&(this.subject=t.campaignName),(null===(r=t.from)||void 0===r?void 0:r.id)&&(this.accountId=t.from.id),t.channel&&(this.type=null===(i=t.channel)||void 0===i?void 0:i.toLowerCase()),t.text&&(this.text=t.text),"image"===this.type&&t.fileName&&(this.image={url:t.targetURL}),"video"===this.type&&t.fileName&&(this.video={url:t.targetURL}),"document"===this.type&&t.fileName&&(this.document={url:t.targetURL,fileName:t.fileName}),t.template&&(this.template={id:t.template.ID,name:t.template.name,lang:t.template.lang,headerUrl:t.targetURL,header:(l=null===(o=t.paramHeader)||void 0===o?void 0:o.map((function(t){return t.name})),null!=l?l:[]),data:(d=null===(s=t.paramBody)||void 0===s?void 0:s.map((function(t){return t.name})),null!=d?d:[]),button:null===(m=t.paramButton)||void 0===m?void 0:m.reduce((function(t,e){var n;return t.push(null!=(n=e.name.map((function(t){return t.name})))?n:[]),t}),[])},"AUTHENTICATION"===t.template.category&&(this.template={name:t.template.name,lang:t.template.lang,header:null,data:[t.otpValue],button:[[t.otpValue]]}),t.template.ID&&(this.template.id=t.template.ID)),"utility"===this.type&&(this.type="template",this.category="utility",this.template=(null===(c=t)||void 0===c?void 0:c.isUseExistingTemplate)?null===(p=t)||void 0===p?void 0:p.template:{name:"",lang:"id",header:null,button:null,data:[]},this.isNeedSave=t.isNeedSave,this.ttlSeconds=t.ttl,(null===(u=t)||void 0===u?void 0:u.isUseExistingTemplate)&&(this.text=null===(v=null===(f=null===(g=t)||void 0===g?void 0:g.template)||void 0===f?void 0:f.body)||void 0===v?void 0:v.text)),this},t.prototype.convert=function(){return this},t}(),Kt=function(){function t(){this.datePipe=new a.DatePipe("en-US")}return t.prototype.clone=function(t){return t.schedulerType&&(this.type=t.delivery?"MULTI":t.schedulerType),t.startDate&&(this.startTime=this.datePipe.transform(t.startDate,"yyyy-MM-dd")+" "+t.startTime),t.delivery&&(this.repeat=t.delivery.toUpperCase()),this},t.prototype.convert=function(){return{type:this.type,startTime:this.startTime,repeat:this.repeat,tz:Intl.DateTimeFormat().resolvedOptions().timeZone}},t}(),Qt=function(){function t(t,n,a){var r=this;this.dialog=t,this.apiAdapterService=n,this.toastr=a,this.currentView=new e.EventEmitter,this.currentViews=K,this.positionWizard=1,this.isLoading=!1,this.isSubmit=!1,this.isGeneralInformationValid=!1,this.isFailoverMechanismValid=!1,this.isNumberBaseInformationValid=!1,this.isSchedulerInformationValid=!1,this.isLine=!1,this.isUploadTargetAudience=!1,this.subscribers=[],this.onCheckTwilioCounterValid=function(){var t,e,n,a,i=r.generalInformationData;if("SMS"!==(null===(t=i)||void 0===t?void 0:t.medium))return!0;if("TEXT"===(null===(e=i)||void 0===e?void 0:e.channel))return!({segments:(o=new j.SegmentedMessage(r.getBody)).segmentsCount,encoding:o.encodingName,characters:o.numberOfUnicodeScalars}.segments>10);var o,l=r.getBody;return Array.from((null===(a=null===(n=i.template)||void 0===n?void 0:n.body)||void 0===a?void 0:a.examples)||[]).map((function(t,e){if(i.paramBody.length>0){var n="{{"+t+"}}",a=i.paramBody[e].name;l=l.split(n).join(a)}})),!({segments:(o=new j.SegmentedMessage(l)).segmentsCount,encoding:o.encodingName,characters:o.numberOfUnicodeScalars}.segments>10)}}return t.prototype.ngOnInit=function(){var t,e;this.campaignID=null===(e=null===(t=window.location.pathname)||void 0===t?void 0:t.split("/"))||void 0===e?void 0:e.pop(),this.initWizard(),this.getCampaignDetailService()},t.prototype.initWizard=function(){this.isLine?this.dataWizard=["General Information","Target Audience","Scheduler","Summary"]:this.dataWizard=["General Information","Failover Mechanism","Target Audience","Scheduler","Summary"]},t.prototype.getCampaignDetailService=function(){var t,e=this;if(!((null===(t=this.campaignID)||void 0===t?void 0:t.length)<10)){this.isLoading=!0;var n=this.apiAdapterService.executeApiRequest([],"/campaign/"+this.campaignID,"GET").subscribe((function(t){var n,a,r,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M,N,D,L,F,E,R,k,B,q,U,z,j,H,W,_,G,J,Y,Z,K,Q,tt,et,nt,at,rt,it,ot,lt,st,dt,mt,ct,pt,ut,gt,ft,vt,ht,bt,yt,xt,St,wt,Ct,It,Tt,At,Ot,Vt,Pt,Mt,Nt,Dt,Lt,Ft,Et,Rt,kt,Bt,qt,Ut,zt,jt;if(t){var Ht={campaignName:null===(n=t.data)||void 0===n?void 0:n.name,medium:null===(a=t.data)||void 0===a?void 0:a.platform,channel:["image","video","document"].includes(null===(r=t.data)||void 0===r?void 0:r.type)?"MEDIA":(null===(i=t.data)||void 0===i?void 0:i.isDirectSend)?"utility":null===(l=null===(o=t.data)||void 0===o?void 0:o.type)||void 0===l?void 0:l.toUpperCase(),media:null===(d=null===(s=t.data)||void 0===s?void 0:s.type)||void 0===d?void 0:d.toUpperCase(),isPrevTemplate:null===(c=null===(m=t)||void 0===m?void 0:m.data)||void 0===c?void 0:c.isPrevTemplate,templateName:null===(u=null===(p=t)||void 0===p?void 0:p.data)||void 0===u?void 0:u.templateName,ttl:null===(f=null===(g=t)||void 0===g?void 0:g.data)||void 0===f?void 0:f.ttlSeconds,from:{id:null===(v=t.data)||void 0===v?void 0:v.accountId,name:null===(h=t.data)||void 0===h?void 0:h.accountName,platform:null===(b=t.data)||void 0===b?void 0:b.platform,clientId:null===(y=t.data)||void 0===y?void 0:y.clientId,clientName:null===(x=t.data)||void 0===x?void 0:x.clientName,accountNo:null===(S=t.data)||void 0===S?void 0:S.accountNo,wabaId:(C=null===(w=t.data)||void 0===w?void 0:w.wabaId,null!=C?C:"")},text:null===(T=null===(I=t.data)||void 0===I?void 0:I.details)||void 0===T?void 0:T.text,targetURL:(P=null===(V=null===(O=null===(A=t.data)||void 0===A?void 0:A.details)||void 0===O?void 0:O.image)||void 0===V?void 0:V.url,L=null!=P?P:null===(D=null===(N=null===(M=t.data)||void 0===M?void 0:M.details)||void 0===N?void 0:N.document)||void 0===D?void 0:D.url,k=null!=L?L:null===(R=null===(E=null===(F=t.data)||void 0===F?void 0:F.details)||void 0===E?void 0:E.video)||void 0===R?void 0:R.url,null!=k?k:null===(U=null===(q=null===(B=t.data)||void 0===B?void 0:B.details)||void 0===q?void 0:q.template)||void 0===U?void 0:U.headerURL),paramHeader:null===(H=null===(j=null===(z=t.data)||void 0===z?void 0:z.details)||void 0===j?void 0:j.template)||void 0===H?void 0:H.header,paramBody:null===(G=null===(_=null===(W=t.data)||void 0===W?void 0:W.details)||void 0===_?void 0:_.template)||void 0===G?void 0:G.data,paramButton:null===(Z=null===(Y=null===(J=t.data)||void 0===J?void 0:J.details)||void 0===Y?void 0:Y.template)||void 0===Z?void 0:Z.button,otpValue:null===(nt=X((et=null===(tt=null===(Q=null===(K=t.data)||void 0===K?void 0:K.details)||void 0===Q?void 0:Q.template)||void 0===tt?void 0:tt.data,null!=et?et:[])))||void 0===nt?void 0:nt.pop(),template:{ID:null===(it=null===(rt=null===(at=t.data)||void 0===at?void 0:at.details)||void 0===rt?void 0:rt.template)||void 0===it?void 0:it.id,name:null===(st=null===(lt=null===(ot=t.data)||void 0===ot?void 0:ot.details)||void 0===lt?void 0:lt.template)||void 0===st?void 0:st.name,lang:null===(ct=null===(mt=null===(dt=t.data)||void 0===dt?void 0:dt.details)||void 0===mt?void 0:mt.template)||void 0===ct?void 0:ct.lang,platform:null===(pt=t.data)||void 0===pt?void 0:pt.platform,headerURL:null===(ft=null===(gt=null===(ut=t.data)||void 0===ut?void 0:ut.details)||void 0===gt?void 0:gt.template)||void 0===ft?void 0:ft.headerURL,header:{examples:null===(bt=null===(ht=null===(vt=t.data)||void 0===vt?void 0:vt.details)||void 0===ht?void 0:ht.template)||void 0===bt?void 0:bt.header},body:{examples:null===(St=null===(xt=null===(yt=t.data)||void 0===yt?void 0:yt.details)||void 0===xt?void 0:xt.template)||void 0===St?void 0:St.data},buttons:null===(It=null===(Ct=null===(wt=t.data)||void 0===wt?void 0:wt.details)||void 0===Ct?void 0:Ct.template)||void 0===It?void 0:It.button,ClientId:null===(Tt=t.data)||void 0===Tt?void 0:Tt.clientId,ClientName:null===(At=t.data)||void 0===At?void 0:At.clientName},isUpload:""!==(null===(Ot=t.data)||void 0===Ot?void 0:Ot.fileId),fileId:null===(Vt=t.data)||void 0===Vt?void 0:Vt.fileId};localStorage.setItem("telin.campaign",JSON.stringify($($({},e.getCampaignStorage),{generalInformation:{id:null===(Pt=t.data)||void 0===Pt?void 0:Pt.id,form:Ht},failover:null===(Mt=t.data)||void 0===Mt?void 0:Mt.failover,targetAudience:null===(Nt=t.data)||void 0===Nt?void 0:Nt.targets,targetAudienceFile:{name:null===(Dt=t.data)||void 0===Dt?void 0:Dt.fileName,targetURL:null===(Lt=t.data)||void 0===Lt?void 0:Lt.targetURL},scheduler:{schedulerType:"MULTI"===(null===(Ft=t.data)||void 0===Ft?void 0:Ft.scheduleType)?"ONE_TIME":null===(Et=t.data)||void 0===Et?void 0:Et.scheduleType,startDate:null===(kt=null===(Rt=t.data)||void 0===Rt?void 0:Rt.startTime)||void 0===kt?void 0:kt.split(" ")[0],startTime:null===(qt=null===(Bt=t.data)||void 0===Bt?void 0:Bt.startTime)||void 0===qt?void 0:qt.split(" ")[1],isRepeat:"MULTI"===(null===(Ut=t.data)||void 0===Ut?void 0:Ut.scheduleType),delivery:null===(zt=t.data)||void 0===zt?void 0:zt.repeat}}))),e.isLine="LINE"===(null===(jt=t.data)||void 0===jt?void 0:jt.platform),e.isLoading=!1,e.initWizard()}}),(function(){e.isLoading=!1}));this.subscribers.push(n)}},t.prototype.generalInformation=function(t){var e,n,a;this.isGeneralInformationValid=t.parent.valid&&t.child&&(null===(e=t.child)||void 0===e?void 0:e.valid),this.isLine="LINE"===(null===(a=null===(n=t.parent)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.medium),this.initWizard(),t.parent&&t.child&&(this.generalInformationData=$($({},t.parent.getRawValue()),t.child.getRawValue()))},t.prototype.failoverMechanism=function(t){this.isFailoverMechanismValid=t.valid,this.failoverMechanismData=t.getRawValue()},t.prototype.targetAudience=function(t){var e,n,a,r;this.targetAudienceFile=t.file,this.targetAudienceData=t.targetAudience,this.targetAudienceCount=t.numberCount,this.isUploadTargetAudience=t.isUpload,this.isNumberBaseInformationValid=t.isUpload&&(null===(e=t.file)||void 0===e?void 0:e.name)||!t.isUpload&&t.targetAudience.length>0||(null===(r=null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form)||void 0===r?void 0:r.fileId)},t.prototype.scheduler=function(t){this.schedulerData=t.getRawValue(),this.isSchedulerInformationValid=t.valid},t.prototype.onClickSaveAndNextButton=function(){switch(this.isSubmit=!0,this.positionWizard){case 1:this.saveGeneralInformationService();break;case 2:this.isLine?this.saveNumberBasesService():this.saveFailoverMechanismService();break;case 3:this.isLine?this.saveSchedulerService():this.saveNumberBasesService();break;case 4:this.isLine||this.saveSchedulerService();break;default:this.isSubmit=!1}},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getBody",{get:function(){var t,e,n,a,r,i,o,l;return null!=(l=null===(o=(null===(t=this.generalInformationData)||void 0===t?void 0:t.text)||(null===(a=null===(n=null===(e=this.generalInformationData)||void 0===e?void 0:e.template)||void 0===n?void 0:n.body)||void 0===a?void 0:a.text)||(null===(i=null===(r=this.generalInformationData)||void 0===r?void 0:r.body)||void 0===i?void 0:i.text))||void 0===o?void 0:o.split(/\\n|\n/).join("<br />").split(/\\t|\t/).join("    "))?l:""},enumerable:!0,configurable:!0}),t.prototype.saveGeneralInformationService=function(){var t=this;if(!this.onCheckTwilioCounterValid())return this.toastr.error("Segment cannot more than 10"),void(this.isSubmit=!1);var e=(new Xt).clone($({},this.generalInformationData)).convert();e.template&&this.generalInformationData.template&&(e.template.type=e.template.type||this.generalInformationData.template.category);var n=[{name:"data",value:e,in:"body",type:"object",withoutKeyData:!0}],a=this.apiAdapterService.executeApiRequest(n,this.generalInformationData.id?"/campaign/"+this.generalInformationData.id:"/campaign",this.generalInformationData.id?"PUT":"POST").subscribe((function(e){var n,a;"success"===(null===(a=null===(n=e)||void 0===n?void 0:n.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},t.getCampaignStorage),{generalInformation:{id:e.data.id,form:t.generalInformationData}}))),t.isSubmit=!1,t.positionWizard+=1):t.isSubmit=!1}),(function(){return t.isSubmit=!1}));this.subscribers.push(a)},t.prototype.saveFailoverMechanismService=function(){var t,e,n=this,a=[{name:"data",value:(new Yt).clone($({},this.failoverMechanismData)).convert(),in:"body",type:"object",withoutKeyData:!0}],r=this.apiAdapterService.executeApiRequest(a,"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/failover","POST").subscribe((function(t){var e,a;"success"===(null===(a=null===(e=t)||void 0===e?void 0:e.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},n.getCampaignStorage),{failover:n.failoverMechanismData}))),n.isSubmit=!1,n.positionWizard+=1):n.isSubmit=!1}),(function(){return n.isSubmit=!1}));this.subscribers.push(r)},t.prototype.saveNumberBasesService=function(){var t,e,n=this;if(0===this.targetAudienceData.length||this.isUploadTargetAudience)return localStorage.setItem("telin.campaign",JSON.stringify($($({},this.getCampaignStorage),{targetAudience:this.targetAudienceData,targetAudienceCount:this.targetAudienceCount,targetAudienceFile:this.targetAudienceFile}))),this.isSubmit=!1,void(this.positionWizard+=1);var a=[{name:"data",value:{targets:this.targetAudienceData,numberCount:this.targetAudienceCount},in:"body",type:"object",withoutKeyData:!0}],r=this.apiAdapterService.executeApiRequest(a,"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/targetcategory","POST").subscribe((function(t){var e,a;"success"===(null===(a=null===(e=t)||void 0===e?void 0:e.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},n.getCampaignStorage),{targetAudience:n.targetAudienceData,targetAudienceCount:n.targetAudienceCount,targetAudienceFile:n.targetAudienceFile}))),n.isSubmit=!1,n.positionWizard+=1):n.isSubmit=!1}),(function(){return n.isSubmit=!1}));this.subscribers.push(r)},t.prototype.saveSchedulerService=function(){var t,e,n=this,a=[{name:"data",value:(new Kt).clone($({},this.schedulerData)).convert(),in:"body",type:"object",withoutKeyData:!0}],r=this.apiAdapterService.executeApiRequest(a,"/campaign/"+(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id)+"/schedule","POST").subscribe((function(t){var e,a;"success"===(null===(a=null===(e=t)||void 0===e?void 0:e.message)||void 0===a?void 0:a.toLowerCase())?(localStorage.setItem("telin.campaign",JSON.stringify($($({},n.getCampaignStorage),{scheduler:n.schedulerData}))),n.isSubmit=!1,n.positionWizard+=1):n.isSubmit=!1}),(function(){return n.isSubmit=!1}));this.subscribers.push(r)},t.prototype.onPrevious=function(){this.positionWizard-=1},t.prototype.changeCurrentView=function(t){this.openConfirmationDialog(t)},t.prototype.openConfirmationDialog=function(t){var e=this,n=new jt;n.title="Cancel Add Broadcast",n.content="Are you sure you want to cancel<br/> Add Broadcast?",n.btnSubmitRed="Yes",n.btnCancel="No";var a=this.dialog.open(Ht,{autoFocus:!1,backdropClass:"overlay-backdrop-dialog",data:n}).afterClosed().subscribe((function(n){var a,r;n&&(window.history.replaceState({},"/"+(null===(r=null===(a=e.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.id),"/secure/campaign"),e.currentView.emit(t))}));this.subscribers.push(a)},t.prototype.onSubmitForApproval=function(){var t,e,n,a,r=this,i=[];this.isSubmit=!0,(null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.targetAudienceFile)||void 0===e?void 0:e.name)&&i.push({name:"isFile",value:!0,in:"query",type:"string"});var o=this.apiAdapterService.executeApiRequest(i,"/campaign/"+(null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.id)+"/submit","POST").subscribe((function(t){var e,n,a,i;"success"===(null===(n=null===(e=t)||void 0===e?void 0:e.message)||void 0===n?void 0:n.toLowerCase())?(window.history.replaceState({},"/"+(null===(i=null===(a=r.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===i?void 0:i.id),"/secure/campaign"),r.toastr.success("Campaign submitted for approval!"),r.isSubmit=!1,r.currentView.emit(r.currentViews.CampaignIndex)):r.isSubmit=!1}),(function(){return r.isSubmit=!1}));this.subscribers.push(o)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:v.MatDialog},{type:ut},{type:s.ToastrService}]},J([e.Output()],t.prototype,"currentView",void 0),t=J([e.Component({selector:"lib-new-campaign",template:'<div class="create-campaign p-4">\r\n    <div class="row mb-3">\r\n        <div class="col-md-6">\r\n            <p class="title mb-1" style="font-size: 32px">\r\n                {{ campaignID?.length > 10 ? \'Update Broadcast\' : \'Add Broadcast\' }}\r\n            </p>\r\n\r\n            <p class="font-softer-black mb-0">Please fill the form below</p>\r\n        </div>\r\n    </div>\r\n\r\n    <mat-card class="dashboard-card">\r\n        <mat-card-content class="dashboard-card-content mt-2">\r\n            <lib-wizard\r\n                class="section-progress mb-3"\r\n                [positionWizard]="positionWizard"\r\n                [dataWizard]="dataWizard"\r\n            >\r\n            </lib-wizard>\r\n\r\n            <div class="line-section mb-4"></div>\r\n            <mat-divider></mat-divider>\r\n\r\n            <div *ngIf="!isLoading; else isSpinner" style="margin-top: 50px">\r\n                <lib-new-campaign-general-information\r\n                    *ngIf="positionWizard === 1"\r\n                    (generalInformation)="generalInformation($event)"\r\n                >\r\n                </lib-new-campaign-general-information>\r\n\r\n                <lib-failover-mechanism\r\n                    *ngIf="!isLine && positionWizard === 2"\r\n                    (failover)="failoverMechanism($event)"\r\n                ></lib-failover-mechanism>\r\n\r\n                <lib-new-number-bases\r\n                    *ngIf="(!isLine && positionWizard === 3) || (isLine && positionWizard === 2)"\r\n                    (targetAudience)="targetAudience($event)"\r\n                >\r\n                </lib-new-number-bases>\r\n\r\n                <lib-new-campaign-scheduler\r\n                    *ngIf="(!isLine && positionWizard === 4) || (isLine && positionWizard === 3)"\r\n                    (scheduler)="scheduler($event)"\r\n                >\r\n                </lib-new-campaign-scheduler>\r\n\r\n                <lib-new-campaign-summary\r\n                    *ngIf="(!isLine && positionWizard === 5) || (isLine && positionWizard === 4)"\r\n                >\r\n                </lib-new-campaign-summary>\r\n            </div>\r\n        </mat-card-content>\r\n    </mat-card>\r\n    <div class="section-btn-action mt-3">\r\n        <button class="btn btn-cancel" (click)="changeCurrentView(currentViews.CampaignIndex)">\r\n            Cancel\r\n        </button>\r\n\r\n        <div class="section-btn-action-child">\r\n            <button\r\n                *ngIf="positionWizard !== 1"\r\n                mat-stroked-button\r\n                color="secondary-telin"\r\n                class="mr-2"\r\n                (click)="onPrevious()"\r\n            >\r\n                Previous\r\n            </button>\r\n\r\n            <button\r\n                *ngIf="\r\n                    positionWizard === 1 ||\r\n                    (!isLine && positionWizard === 2) ||\r\n                    (!isLine && positionWizard === 3) ||\r\n                    (isLine && positionWizard === 2) ||\r\n                    (!isLine && positionWizard === 4) ||\r\n                    (isLine && positionWizard === 3)\r\n                "\r\n                mat-flat-button\r\n                color="primary-telin-blue2"\r\n                class="mr-2"\r\n                [disabled]="\r\n                    isSubmit ||\r\n                    (positionWizard === 1 && !isGeneralInformationValid) ||\r\n                    (!isLine && positionWizard === 2 && !isFailoverMechanismValid) ||\r\n                    (((!isLine && positionWizard === 3) || (isLine && positionWizard === 2)) &&\r\n                        !isNumberBaseInformationValid) ||\r\n                    (((!isLine && positionWizard === 4) || (isLine && positionWizard === 3)) &&\r\n                        !isSchedulerInformationValid)\r\n                "\r\n                (click)="onClickSaveAndNextButton()"\r\n            >\r\n                Save & Next\r\n            </button>\r\n\r\n            <ng-container\r\n                *ngIf="(!isLine && positionWizard === 5) || (isLine && positionWizard === 4)"\r\n            >\r\n                <button\r\n                    class="btn btn-submit"\r\n                    [disabled]="isSubmit"\r\n                    (click)="onSubmitForApproval()"\r\n                >\r\n                    Submit for Approval\r\n                </button>\r\n            </ng-container>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #isSpinner>\r\n    <div class="text-center my-auto">\r\n        <img src="../../../../../assets/images/spinner.svg" />\r\n    </div>\r\n</ng-template>\r\n',styles:[".create-campaign .title{color:#31393c;font-size:22px;font-family:PoppinsBold}.create-campaign .section-progress{display:flex;justify-content:center;flex-direction:row;align-content:stretch}.create-campaign .btn-submit{border-radius:8px;background:linear-gradient(90deg,#5ee928 0,#61c477 100%);color:#fff;margin-right:20px}.create-campaign .btn-cancel{border-radius:8px;width:120px;border-width:1;border-color:#9598a0;background:#f3f6f9;color:#9598a0;margin-right:20px}.create-campaign .section-btn-action{flex-direction:row;display:flex;justify-content:space-between}.create-campaign .section-btn-action .section-btn-action-child{display:flex;flex-direction:row}::ng-deep .mat-card.dashboard-card{box-shadow:rgba(0,0,0,.1) 0 4px 12px}"]})],t)}(),te=function(){function t(t){this.apiAdapterService=t,this.msgTypeWAOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.isHaveTemplateParam=!1,this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.validationMessages=Dt,this.msgTypeWAOption=xt,this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("EMAIL"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),from:new m.FormControl(null,m.Validators.required),text:new m.FormControl(null,m.Validators.required),template:new m.FormControl(null,m.Validators.required),paramBody:new m.FormArray([],m.Validators.required),isUpload:new m.FormControl(!1),fileId:new m.FormControl("")}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g,f;0!==Object.entries(this.getCampaignStorage).length&&"EMAIL"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("from").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.from),this.form.get("text").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.text),this.form.get("template").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.template),this.form.get("isUpload").setValue(null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.isUpload),this.form.get("fileId").setValue(null===(g=null===(u=this.getCampaignStorage)||void 0===u?void 0:u.generalInformation)||void 0===g?void 0:g.form.fileId),this.isHaveTemplateParam=this.form.get("isUpload").value,this.getTemplateOptionService(null,null===(f=this.form.get("template").value)||void 0===f?void 0:f.name))},Object.defineProperty(t.prototype,"getIsTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();this.form.get("channel").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.getIsTemplate?(this.form.get("template").setValidators(m.Validators.required),this.form.get("template").updateValueAndValidity(),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("paramBody").updateValueAndValidity()):(this.form.get("text").setValidators(m.Validators.required),this.form.get("text").updateValueAndValidity())},t.prototype.formReset=function(t){void 0===t&&(t=!1),this.form.get("text").reset(),this.form.get("template").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","EMAIL","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?X(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r,i,o=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var l=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","EMAIL","string"),this.initParam("filter",e,"string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string"),this.initParam("wabaId",(i=null===(r=this.form.get("from").value)||void 0===r?void 0:r.wabaId,null!=i?i:""),"string")];this.isReadOnlyMode&&l.push(this.initParam("summary",!0,"string"));var s=this.apiAdapterService.executeApiRequest(l,"/message/template","GET").subscribe((function(t){var e;o.templateOption=n?X(o.templateOption,t.data):t.data,o.isHaveNextTemplateOption=t.haveNext,o.isLoadingTemplateOption=!1;var a=null===(e=o.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=o.form.get("template").value)||void 0===e?void 0:e.ID)}));if(a){if(o.form.get("template").setValue(a),o.form.get("isUpload").value)return o.updateDownloadCSV(o.form.get("isUpload").value);o.updateTemplate(o.form.get("template").value)}}));this.subscribers.push(s)},t.prototype.initParameter=function(t){return void 0===t&&(t=""),new m.FormGroup({name:new m.FormControl({value:t,disabled:this.isReadOnlyMode||["UnsubscribeAccount"].includes(t)},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(t);this.form.get("paramBody").push(e)},t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o=this;if(t){this.isHaveTemplateParam=(null===(e=t.body.examples)||void 0===e?void 0:e.length)>0,(null===(n=t.body.examples)||void 0===n?void 0:n.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").updateValueAndValidity();var l=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form;null===(i=t.body.examples)||void 0===i||i.forEach((function(t,e){var n,a,r,i,s,d,m,c=null!=(m=null!=(i=null===(r=null===(a=null===(n=l)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(d=null===(s=l)||void 0===s?void 0:s.paramBody)||void 0===d?void 0:d[e])?m:"";["UnsubscribeAccount"].includes(t)&&(c=t),o.addParamBody(c)}))}},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.updateDownloadCSV=function(t){if(this.form.get("isUpload").setValue(t),t)return this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").clearValidators(),void this.form.get("paramBody").updateValueAndValidity();this.updateTemplate(this.form.get("template").value)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ut}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),t=J([e.Component({selector:"lib-general-information-email",template:'<form autocomplete="off"\r\n\t[formGroup]="form">\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100">\r\n\t\t\t<mat-label class="asterix--after">Message Type</mat-label>\r\n\r\n\t\t\t<mat-select placeholder="Select message type"\r\n\t\t\t\tformControlName="channel">\r\n\t\t\t\t<mat-option *ngFor="let option of msgTypeWAOption"\r\n\t\t\t\t\t[value]="option.code"\r\n\t\t\t\t\t(click)="formReset()">\r\n\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.channel">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'channel\').touched \r\n\t\t\t\t\t&& form.get(\'channel\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100"\r\n\t\t\tstyle="margin-bottom: 20;">\r\n\t\t\t<mat-label class="asterix--after">From</mat-label>\r\n\r\n\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\tformControlName="from"\r\n\t\t\t\tplaceholder="Select from"\r\n\t\t\t\t[complete]="isHaveNextAccountOption === false"\r\n\t\t\t\t[compareWith]="accountSelectedDisplay"\r\n\t\t\t\t(infiniteScroll)="getNextAccountBatch()"\r\n\t\t\t\t(selectionChange)="getTemplateOptionService($event.value)">\r\n\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t[currentValue]="form?.get(\'from\').value?.name"\r\n\t\t\t\t\t\t(searchRes)="updateSearchAccount($event)"></lib-search>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<mat-option *ngFor="let option of accountOption"\r\n\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t{{ option.name + \' (\' + option.accountNo + \')\' }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t\t<mat-option *ngIf="isLoadingAccountOption">Loading...</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.from">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'from\').touched \r\n\t\t\t\t\t&& form.get(\'from\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div *ngIf="form.get(\'channel\').value === \'HTML\'"\r\n\t\tclass="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always">\r\n\t\t\t<mat-label class="asterix--after">Message</mat-label>\r\n\r\n\t\t\t<textarea matInput\r\n\t\t\t\trows="6"\r\n\t\t\t\tcols="50"\r\n\t\t\t\tcdkTextareaAutosize\r\n\t\t\t\tcdkAutosizeMinRows="2"\r\n\t\t\t\tcdkAutosizeMaxRows="15"\r\n\t\t\t\tplaceholder="Enter text"\r\n\t\t\t\tformControlName="text"\r\n\t\t\t\t#autosize="cdkTextareaAutosize"></textarea>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.text">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'text\').touched \r\n\t\t\t\t\t&& form.get(\'text\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="form.get(\'channel\').value === \'TEMPLATE\'">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always"\r\n\t\t\t\tclass="w-100">\r\n\t\t\t\t<mat-label class="asterix--after">Template</mat-label>\r\n\r\n\t\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\t\tformControlName="template"\r\n\t\t\t\t\tplaceholder="Select template"\r\n\t\t\t\t\t[complete]="isHaveNextTemplateOption === false"\r\n\t\t\t\t\t[compareWith]="templateSelectedDisplay"\r\n\t\t\t\t\t(infiniteScroll)="getNextTemplateBatch()"\r\n\t\t\t\t\t(selectionChange)="updateTemplate($event.value)">\r\n\t\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t\t[currentValue]="form?.get(\'template\').value?.name"\r\n\t\t\t\t\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<mat-option *ngFor="let option of templateOption"\r\n\t\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t\t<mat-option *ngIf="isLoadingTemplateOption">Loading...</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.template">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'template\').touched \r\n\t\t\t\t\t\t\t&& form.get(\'template\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\r\n\t\t<div *ngIf="isHaveTemplateParam"\r\n\t\t\tclass="d-flex justify-content-end">\r\n\t\t\t<mat-checkbox labelPosition="before"\r\n\t\t\t\tformControlName="isUpload"\r\n\t\t\t\t(change)="updateDownloadCSV($event.checked)">\r\n\t\t\t\tUsing Download XLSX\r\n\t\t\t</mat-checkbox>\r\n\t\t</div>\r\n\r\n\t\t<ng-container *ngIf="!form.get(\'isUpload\').value && getParamBody?.length > 0">\r\n\t\t\t<p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n\t\t\t<div *ngFor="\r\n\t\t\tlet param of getParamBody;\r\n\t\t\tlet paramBodyIndex = index\r\n\t\t"\r\n\t\t\t\tclass="form-group">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="text"\r\n\t\t\t\t\t\t[placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n\t\t\t\t\t\t[formControl]="param.get(\'name\')" />\r\n\t\t\t\t</mat-form-field>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.asterix--after:after{content:"*";color:red}']})],t)}(),ee=function(){function t(t){this.apiAdapterService=t,this.msgTypeWAOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.msgTypeWAOption=St,this.validationMessages=Ft,this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("LINE"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),from:new m.FormControl(null,m.Validators.required),text:new m.FormControl(null),template:new m.FormControl(null),isJSON:new m.FormControl(!1),paramBody:new m.FormArray([],m.Validators.required)}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c;0!==Object.entries(this.getCampaignStorage).length&&"LINE"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("from").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.from),this.form.get("text").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.text),this.form.get("template").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.template),this.getTemplateOptionService(null,null===(c=this.form.get("template").value)||void 0===c?void 0:c.name))},t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();if(this.form.get("channel").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.isText)return this.form.get("text").setValidators(m.Validators.required),void this.form.get("text").updateValueAndValidity();this.form.get("template").setValidators(m.Validators.required),this.form.get("template").updateValueAndValidity(),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("paramBody").updateValueAndValidity()},t.prototype.formReset=function(){this.form.get("text").reset(),this.form.get("template").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","LINE","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?X(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var i=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","LINE","string"),this.initParam("filter",e,"string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string")];this.isReadOnlyMode&&i.push(this.initParam("summary",!0,"string"));var o=this.apiAdapterService.executeApiRequest(i,"/message/template","GET").subscribe((function(t){var e;r.templateOption=n?X(r.templateOption,t.data):t.data,r.isHaveNextTemplateOption=t.haveNext,r.isLoadingTemplateOption=!1;var a=null===(e=r.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=r.form.get("template").value)||void 0===e?void 0:e.ID)}));a&&(r.form.get("template").setValue(a),r.updateTemplate(r.form.get("template").value))}));this.subscribers.push(o)},t.prototype.initParameter=function(t){return void 0===t&&(t=""),new m.FormGroup({name:new m.FormControl({value:t,disabled:this.isReadOnlyMode},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(t);this.form.get("paramBody").push(e)},Object.defineProperty(t.prototype,"isText",{get:function(){var t;return this.form.get("channel").value&&"text"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o=this;if(t){var l=t.body.text;this.isJsonString(t.body.text)&&(l=JSON.parse(t.body.text).text),this.form.get("isJSON").setValue(this.isJsonString(t.body.text)),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset();var s=null===(e=l)||void 0===e?void 0:e.match(/{{/g),d=null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form;(null===(r=s)||void 0===r?void 0:r.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),null===(i=s)||void 0===i||i.forEach((function(t,e){var n,a,r,i,l,s,m;o.addParamBody(null!=(m=null!=(i=null===(r=null===(a=null===(n=d)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(s=null===(l=d)||void 0===l?void 0:l.paramBody)||void 0===s?void 0:s[e])?m:"")})),this.form.get("paramBody").updateValueAndValidity()}},t.prototype.isJsonString=function(t){try{JSON.parse(t)}catch(t){return!1}return!0},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(null,t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ut}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),t=J([e.Component({selector:"lib-general-information-line",template:'<form autocomplete="off"\r\n\t[formGroup]="form">\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100">\r\n\t\t\t<mat-label class="asterix--after">Message Type</mat-label>\r\n\r\n\t\t\t<mat-select placeholder="Select message type"\r\n\t\t\t\tformControlName="channel">\r\n\t\t\t\t<mat-option *ngFor="let option of msgTypeWAOption"\r\n\t\t\t\t\t[value]="option.code"\r\n\t\t\t\t\t(click)="formReset()">\r\n\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.channel">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'channel\').touched \r\n\t\t\t\t\t&& form.get(\'channel\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100"\r\n\t\t\tstyle="margin-bottom: 20;">\r\n\t\t\t<mat-label class="asterix--after">From</mat-label>\r\n\r\n\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\tformControlName="from"\r\n\t\t\t\tplaceholder="Select from"\r\n\t\t\t\t[complete]="isHaveNextAccountOption === false"\r\n\t\t\t\t[compareWith]="accountSelectedDisplay"\r\n\t\t\t\t(infiniteScroll)="getNextAccountBatch()"\r\n\t\t\t\t(selectionChange)="getTemplateOptionService($event.value)">\r\n\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t[currentValue]="form?.get(\'from\').value?.name"\r\n\t\t\t\t\t\t(searchRes)="updateSearchAccount($event)"></lib-search>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<mat-option *ngFor="let option of accountOption"\r\n\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t{{ option.name + \' (\' + option.accountNo + \')\' }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t\t<mat-option *ngIf="isLoadingAccountOption">Loading...</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.from">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'from\').touched \r\n\t\t\t\t\t&& form.get(\'from\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="isText">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always">\r\n\t\t\t\t<mat-label class="asterix--after">Text</mat-label>\r\n\r\n\t\t\t\t<textarea matInput\r\n\t\t\t\t\trows="6"\r\n\t\t\t\t\tcols="50"\r\n\t\t\t\t\tcdkTextareaAutosize\r\n\t\t\t\t\tcdkAutosizeMinRows="2"\r\n\t\t\t\t\tcdkAutosizeMaxRows="15"\r\n\t\t\t\t\tformControlName="text"\r\n\t\t\t\t\tplaceholder="Enter text"\r\n\t\t\t\t\t#autosize="cdkTextareaAutosize"></textarea>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.text">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'text\').touched \r\n\t\t\t\t\t\t&& form.get(\'text\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<ng-container *ngIf="isTemplate">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always"\r\n\t\t\t\tclass="w-100">\r\n\t\t\t\t<mat-label class="asterix--after">Template</mat-label>\r\n\r\n\t\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\t\tformControlName="template"\r\n\t\t\t\t\tplaceholder="Select template"\r\n\t\t\t\t\t[complete]="isHaveNextTemplateOption === false"\r\n\t\t\t\t\t[compareWith]="templateSelectedDisplay"\r\n\t\t\t\t\t(infiniteScroll)="getNextTemplateBatch()"\r\n\t\t\t\t\t(selectionChange)="updateTemplate($event.value)">\r\n\t\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<mat-option *ngFor="let option of templateOption"\r\n\t\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t\t<mat-option *ngIf="isLoadingTemplateOption">Loading...</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.template">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'template\').touched \r\n\t\t\t\t\t\t&& form.get(\'template\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\r\n\t\t<ng-container *ngIf="getParamBody?.length > 0">\r\n\t\t\t<p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n\t\t\t<div *ngFor="\r\n\t\t\t\t\tlet param of getParamBody;\r\n\t\t\t\t\tlet paramBodyIndex = index\r\n\t\t\t\t"\r\n\t\t\t\tclass="form-group">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="text"\r\n\t\t\t\t\t\t[placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n\t\t\t\t\t\t[formControl]="param.get(\'name\')" />\r\n\t\t\t\t</mat-form-field>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.asterix--after:after{content:"*";color:red}']})],t)}(),ne=function(){function t(t){this.apiAdapterService=t,this.msgTypeWAOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.isHaveTemplateParam=!1,this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.msgTypeWAOption=yt.filter((function(t){return"TEXT"===t.code||"TEMPLATE"===t.code})),this.validationMessages=Lt,this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("SMS"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),from:new m.FormControl(null,m.Validators.required),text:new m.FormControl(null,m.Validators.required),template:new m.FormControl(null,m.Validators.required),paramBody:new m.FormArray([],m.Validators.required),isUpload:new m.FormControl(!1),fileId:new m.FormControl("")}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g,f;0!==Object.entries(this.getCampaignStorage).length&&"SMS"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("from").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.from),this.form.get("text").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.text),this.form.get("template").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.template),this.form.get("isUpload").setValue(null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.isUpload),this.form.get("fileId").setValue(null===(g=null===(u=this.getCampaignStorage)||void 0===u?void 0:u.generalInformation)||void 0===g?void 0:g.form.fileId),this.isHaveTemplateParam=this.form.get("isUpload").value,this.getTemplateOptionService(null,null===(f=this.form.get("template").value)||void 0===f?void 0:f.name))},Object.defineProperty(t.prototype,"getIsTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();this.form.get("channel").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.getIsTemplate?(this.form.get("template").setValidators(m.Validators.required),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("template").updateValueAndValidity(),this.form.get("paramBody").updateValueAndValidity()):(this.form.get("text").setValidators(m.Validators.required),this.form.get("text").updateValueAndValidity())},t.prototype.formReset=function(t){void 0===t&&(t=!1),this.form.get("text").reset(),this.form.get("template").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","SMS","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?X(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r,i,o=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var l=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","SMS","string"),this.initParam("filter",e,"string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string"),this.initParam("wabaId",(i=null===(r=this.form.get("from").value)||void 0===r?void 0:r.wabaId,null!=i?i:""),"string")];this.isReadOnlyMode&&l.push(this.initParam("summary",!0,"string"));var s=this.apiAdapterService.executeApiRequest(l,"/message/template","GET").subscribe((function(t){var e;o.templateOption=n?X(o.templateOption,t.data):t.data,o.isHaveNextTemplateOption=t.haveNext,o.isLoadingTemplateOption=!1;var a=null===(e=o.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=o.form.get("template").value)||void 0===e?void 0:e.ID)}));if(a){if(o.form.get("template").setValue(a),o.form.get("isUpload").value)return o.updateDownloadCSV(o.form.get("isUpload").value);o.updateTemplate(o.form.get("template").value)}}));this.subscribers.push(s)},t.prototype.initParameter=function(t){return void 0===t&&(t=""),new m.FormGroup({name:new m.FormControl({value:t,disabled:this.isReadOnlyMode||["UnsubscribeAccount"].includes(t)},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(t);this.form.get("paramBody").push(e)},t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o=this;if(t){this.isHaveTemplateParam=(null===(e=t.body.examples)||void 0===e?void 0:e.length)>0,(null===(n=t.body.examples)||void 0===n?void 0:n.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").updateValueAndValidity();var l=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form;null===(i=t.body.examples)||void 0===i||i.forEach((function(t,e){var n,a,r,i,s,d,m,c=null!=(m=null!=(i=null===(r=null===(a=null===(n=l)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(d=null===(s=l)||void 0===s?void 0:s.paramBody)||void 0===d?void 0:d[e])?m:"";["UnsubscribeAccount"].includes(t)&&(c=t),o.addParamBody(c)}))}},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService("",t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.updateDownloadCSV=function(t){if(this.form.get("isUpload").setValue(t),t)return this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").clearValidators(),void this.form.get("paramBody").updateValueAndValidity();this.updateTemplate(this.form.get("template").value)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ut}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),t=J([e.Component({selector:"lib-general-information-sms",template:'<form autocomplete="off"\r\n\t[formGroup]="form">\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100">\r\n\t\t\t<mat-label class="asterix--after">Message Type</mat-label>\r\n\r\n\t\t\t<mat-select placeholder="Select message type"\r\n\t\t\t\tformControlName="channel">\r\n\t\t\t\t<mat-option *ngFor="let option of msgTypeWAOption"\r\n\t\t\t\t\t[value]="option.code"\r\n\t\t\t\t\t(click)="formReset()">\r\n\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.channel">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'channel\').touched \r\n\t\t\t\t\t&& form.get(\'channel\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<div class="form-group">\r\n\t\t<mat-form-field appearance="outline"\r\n\t\t\tfloatLabel="always"\r\n\t\t\tclass="w-100"\r\n\t\t\tstyle="margin-bottom: 20;">\r\n\t\t\t<mat-label class="asterix--after">From</mat-label>\r\n\r\n\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\tformControlName="from"\r\n\t\t\t\tplaceholder="Select from"\r\n\t\t\t\t[complete]="isHaveNextAccountOption === false"\r\n\t\t\t\t[compareWith]="accountSelectedDisplay"\r\n\t\t\t\t(infiniteScroll)="getNextAccountBatch()"\r\n\t\t\t\t(selectionChange)="getTemplateOptionService($event.value)">\r\n\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t[currentValue]="form?.get(\'from\').value?.name"\r\n\t\t\t\t\t\t(searchRes)="updateSearchAccount($event)"></lib-search>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<mat-option *ngFor="let option of accountOption"\r\n\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t{{ option.name + \' (\' + option.accountNo + \')\' }}\r\n\t\t\t\t</mat-option>\r\n\t\t\t\t<mat-option *ngIf="isLoadingAccountOption">Loading...</mat-option>\r\n\t\t\t</mat-select>\r\n\t\t</mat-form-field>\r\n\r\n\t\t<mat-error align="end"\r\n\t\t\t*ngFor="let validation of validationMessages.from">\r\n\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t*ngIf="form.get(\'from\').touched \r\n\t\t\t\t\t&& form.get(\'from\').hasError(validation.type)">\r\n\t\t\t\t{{ validation.message }}\r\n\t\t\t</p>\r\n\t\t</mat-error>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="form.get(\'channel\').value === \'TEXT\'">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always">\r\n\t\t\t\t<mat-label class="asterix--after">Message</mat-label>\r\n\r\n\t\t\t\t<textarea matInput\r\n\t\t\t\t\trows="6"\r\n\t\t\t\t\tcols="50"\r\n\t\t\t\t\tcdkTextareaAutosize\r\n\t\t\t\t\tcdkAutosizeMinRows="2"\r\n\t\t\t\t\tcdkAutosizeMaxRows="15"\r\n\t\t\t\t\tplaceholder="Enter text"\r\n\t\t\t\t\tformControlName="text"\r\n\t\t\t\t\t#autosize="cdkTextareaAutosize"></textarea>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.text">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'text\').touched \r\n\t\t\t\t\t&& form.get(\'text\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<ng-container *ngIf="form.get(\'channel\').value === \'TEMPLATE\'">\r\n\t\t<div class="form-group">\r\n\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\tfloatLabel="always"\r\n\t\t\t\tclass="w-100">\r\n\t\t\t\t<mat-label class="asterix--after">Template</mat-label>\r\n\r\n\t\t\t\t<mat-select matSelectInfiniteScroll\r\n\t\t\t\t\tformControlName="template"\r\n\t\t\t\t\tplaceholder="Select template"\r\n\t\t\t\t\t[complete]="isHaveNextTemplateOption === false"\r\n\t\t\t\t\t[compareWith]="templateSelectedDisplay"\r\n\t\t\t\t\t(infiniteScroll)="getNextTemplateBatch()"\r\n\t\t\t\t\t(selectionChange)="updateTemplate($event.value)">\r\n\t\t\t\t\t<div style="margin: 20px">\r\n\t\t\t\t\t\t<lib-search [placeholder]="\'Search\'"\r\n\t\t\t\t\t\t\t[currentValue]="form?.get(\'template\').value?.name"\r\n\t\t\t\t\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<mat-option *ngFor="let option of templateOption"\r\n\t\t\t\t\t\t[value]="option">\r\n\t\t\t\t\t\t{{ option.name }}\r\n\t\t\t\t\t</mat-option>\r\n\t\t\t\t\t<mat-option *ngIf="isLoadingTemplateOption">Loading...</mat-option>\r\n\t\t\t\t</mat-select>\r\n\t\t\t</mat-form-field>\r\n\r\n\t\t\t<mat-error align="end"\r\n\t\t\t\t*ngFor="let validation of validationMessages.template">\r\n\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t*ngIf="form.get(\'template\').touched \r\n\t\t\t\t\t\t\t&& form.get(\'template\').hasError(validation.type)">\r\n\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t</p>\r\n\t\t\t</mat-error>\r\n\t\t</div>\r\n\r\n\t\t<div *ngIf="isHaveTemplateParam"\r\n\t\t\tclass="d-flex justify-content-end">\r\n\t\t\t<mat-checkbox labelPosition="before"\r\n\t\t\t\tformControlName="isUpload"\r\n\t\t\t\t(change)="updateDownloadCSV($event.checked)">\r\n\t\t\t\tUsing Download XLSX\r\n\t\t\t</mat-checkbox>\r\n\t\t</div>\r\n\r\n\t\t<ng-container *ngIf="!form.get(\'isUpload\').value && getParamBody?.length > 0">\r\n\t\t\t<p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n\t\t\t<div *ngFor="\r\n\t\t\tlet param of getParamBody;\r\n\t\t\tlet paramBodyIndex = index\r\n\t\t"\r\n\t\t\t\tclass="form-group">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="text"\r\n\t\t\t\t\t\t[placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n\t\t\t\t\t\t[formControl]="param.get(\'name\')" />\r\n\t\t\t\t</mat-form-field>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.asterix--after:after{content:"*";color:red}']})],t)}();!function(t){t.GOOGLE_MAP_API_KEY="AIzaSyCHReBe_RpzAgLTrUC5QIDyeKttQ817wRY",t.MEDIUM_TYPE_WHATSAPP="WHATSAPP",t.MEDIA_TYPE_IMAGE="IMAGE",t.MEDIA_TYPE_VIDEO="VIDEO",t.MEDIA_TYPE_DOCUMENT="DOCUMENT",t.MEDIA_TYPE_LOCATION="LOCATION",t.SCHEDULER_TYPE_NOW="NOW",t.SCHEDULER_TYPE_SINGLE="SINGLE",t.SCHEDULER_TYPE_MULTIPLE="MULTIPLE"}(kt||(kt={}));m.Validators.compose,m.Validators.composeAsync;var ae=function(t,e){return function(n){return m.Validators.max(t)(n)?{max:t,actual:n.value,message:e||"Max Value equals to "+t}:null}},re=function(t,e){return function(n){return m.Validators.min(t)(n)?{min:t,actual:n.value,message:e||"Min Value equals to "+t}:null}},ie=function(){function t(t,n,a,r){this.ngZone=t,this.mapsAPILoader=n,this.apiAdapterService=a,this.toastr=r,this.msgTypeWAOption=[],this.mediaTypeOption=[],this.accountOption=[],this.isHaveNextAccountOption=!0,this.isLoadingAccountOption=!1,this.templateOption=[],this.isHaveNextTemplateOption=!0,this.isLoadingTemplateOption=!1,this.isHaveTemplateParam=!1,this.isShowParameter=!1,this.extFileAccepted="image/*",this.pageNoAccountOption=1,this.pageNoTemplateOption=1,this.subscribers=[],this.templates=[{label:"Create New",value:!1},{label:"Use existing template",value:!0}],this.updateGeneralInformationForm=new e.EventEmitter}return Object.defineProperty(t.prototype,"isTouchedForm",{set:function(t){var e=this;this.updateGeneralInformationForm&&setTimeout((function(){e.updateGeneralInformationForm.emit(e.form)}))},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.msgTypeWAOption=yt,this.mediaTypeOption=wt,this.categoryOption=qt(rt),this.validationMessages=Nt,this.maps={zoom:15,latitude:null,longitude:null,isDraggable:!0,isDoubleClickZoom:!0},this.initForm(),this.initDisable(),this.initEdit(),this.initValidation(),this.getAccountOptionService("WA"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)?null===(o=null===(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form)||void 0===i?void 0:i.from)||void 0===o?void 0:o.name:"")},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({channel:new m.FormControl(null,m.Validators.required),media:new m.FormControl(null),from:new m.FormControl(null),text:new m.FormControl(null),fileName:new m.FormControl(null),targetURL:new m.FormControl(null),fileType:new m.FormControl(null),file:new m.FormControl(null),latitude:new m.FormControl(null),longitude:new m.FormControl(null),template:new m.FormControl(null),paramHeader:new m.FormArray([],m.Validators.required),paramBody:new m.FormArray([],m.Validators.required),paramButton:new m.FormArray([],m.Validators.required),otpValue:new m.FormControl(""),isUpload:new m.FormControl(!1),fileId:new m.FormControl(""),category:new m.FormControl(null),product:new m.FormControl(null),catalogue:new m.FormControl(null),body:new m.FormControl(null),isUseExistingTemplate:new m.FormControl(!1),isNeedSave:new m.FormControl(!1),ttl:new m.FormControl(null)}),this.form.valueChanges.subscribe((function(){setTimeout((function(){t.updateGeneralInformationForm.emit(t.form)}))}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M,N,D,L;0!==Object.entries(this.getCampaignStorage).length&&"WA"===(null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.medium)&&(this.form.get("channel").setValue(null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.generalInformation)||void 0===r?void 0:r.form.channel),this.form.get("media").setValue(null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.generalInformation)||void 0===o?void 0:o.form.media),this.form.get("from").setValue(null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.from),this.form.get("text").setValue(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.generalInformation)||void 0===m?void 0:m.form.text),this.form.get("targetURL").setValue(null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.targetURL),this.form.get("fileName").setValue(null!=(f=null===(g=null===(u=this.getCampaignStorage)||void 0===u?void 0:u.generalInformation)||void 0===g?void 0:g.form.fileName)?f:this.form.get("targetURL").value),this.form.get("template").setValue(null===(h=null===(v=this.getCampaignStorage)||void 0===v?void 0:v.generalInformation)||void 0===h?void 0:h.form.template),this.form.get("isUpload").setValue(null===(y=null===(b=this.getCampaignStorage)||void 0===b?void 0:b.generalInformation)||void 0===y?void 0:y.form.isUpload),this.form.get("fileId").setValue(null===(S=null===(x=this.getCampaignStorage)||void 0===x?void 0:x.generalInformation)||void 0===S?void 0:S.form.fileId),this.form.get("otpValue").setValue(null===(C=null===(w=this.getCampaignStorage)||void 0===w?void 0:w.generalInformation)||void 0===C?void 0:C.form.otpValue),this.form.get("isUseExistingTemplate").setValue(!!(null===(A=null===(T=null===(I=this.getCampaignStorage)||void 0===I?void 0:I.generalInformation)||void 0===T?void 0:T.form)||void 0===A?void 0:A.templateName)),this.form.get("isNeedSave").setValue(!!(null===(P=null===(V=null===(O=this.getCampaignStorage)||void 0===O?void 0:O.generalInformation)||void 0===V?void 0:V.form)||void 0===P?void 0:P.isNeedSave)),this.form.get("ttl").setValue(null===(D=null===(N=null===(M=this.getCampaignStorage)||void 0===M?void 0:M.generalInformation)||void 0===N?void 0:N.form)||void 0===D?void 0:D.ttl),this.isHaveTemplateParam=this.form.get("isUpload").value,this.getTemplateOptionService(null,null===(L=this.form.get("template").value)||void 0===L?void 0:L.name))},t.prototype.initValidation=function(){for(var t in this.form.controls)this.form.controls[t].clearValidators(),this.form.controls[t].updateValueAndValidity();this.form.get("channel").setValidators(m.Validators.required),this.getIsText?(this.form.get("from").setValidators(m.Validators.required),this.form.get("text").setValidators(m.Validators.required),this.form.get("from").updateValueAndValidity(),this.form.get("text").updateValueAndValidity()):this.getIsMedia?(this.form.get("media").setValidators(m.Validators.required),this.form.get("from").setValidators(m.Validators.required),this.form.get("fileName").setValidators(m.Validators.required),this.form.get("media").updateValueAndValidity(),this.form.get("from").updateValueAndValidity(),this.form.get("fileName").updateValueAndValidity()):this.getIsTemplate?(this.form.get("from").setValidators(m.Validators.required),this.form.get("template").setValidators(m.Validators.required),this.form.get("paramHeader").setValidators(m.Validators.required),this.form.get("paramBody").setValidators(m.Validators.required),this.form.get("paramButton").setValidators(m.Validators.required),this.form.get("from").updateValueAndValidity(),this.form.get("template").updateValueAndValidity(),this.form.get("paramHeader").updateValueAndValidity(),this.form.get("paramBody").updateValueAndValidity(),this.form.get("paramButton").updateValueAndValidity()):this.getIsCatalogue?(this.form.get("from").setValidators(m.Validators.required),this.form.get("category").setValidators(m.Validators.required),this.form.get("catalogue").setValidators(m.Validators.required),this.form.get("product").setValidators(m.Validators.required),this.form.get("body").setValidators(m.Validators.maxLength(100)),this.form.get("from").updateValueAndValidity(),this.form.get("category").updateValueAndValidity(),this.form.get("catalogue").updateValueAndValidity(),this.form.get("product").updateValueAndValidity(),this.form.get("body").updateValueAndValidity()):this.getIsUtility?(this.form.get("from").setValidators(m.Validators.required),this.form.get("text").setValidators([m.Validators.required,m.Validators.maxLength(1024)]),this.form.get("ttl").setValidators([re(30,"Minimum TTL 30"),ae(43200,"Maximum TTL 43200")]),this.form.get("from").updateValueAndValidity(),this.form.get("text").updateValueAndValidity(),this.form.get("ttl").updateValueAndValidity()):(this.form.get("from").setValidators(m.Validators.required),this.form.get("text").setValidators(m.Validators.required),this.form.get("from").updateValueAndValidity(),this.form.get("text").updateValueAndValidity())},t.prototype.formReset=function(t){void 0===t&&(t=!1),t||(this.form.get("media").reset(),this.form.get("from").reset()),this.form.get("text").reset(),this.form.get("fileName").reset(),this.form.get("targetURL").reset(),this.form.get("fileType").reset(),this.form.get("file").reset(),this.form.get("latitude").reset(),this.form.get("longitude").reset(),this.form.get("template").reset(),this.form.get("category").reset(),this.form.get("product").reset(),this.form.get("catalogue").reset(),this.form.get("body").reset(),this.form.get("otpValue").reset(),this.form.get("paramHeader").controls=[],this.form.get("paramHeader").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramButton").controls=[],this.form.get("paramButton").reset(),this.initValidation()},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e){var n=this;void 0===t&&(t=""),void 0===e&&(e=!1),this.isLoadingAccountOption=!0;var a=[this.initParam("pageNo",this.pageNoAccountOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","WA","string"),this.initParam("status","APPROVED","string"),this.initParam("filter",t,"string")],r=this.apiAdapterService.executeApiRequest(a,"/admin/account","GET").subscribe((function(t){t.data&&(n.accountOption=e?X(n.accountOption,t.data):t.data,n.isHaveNextAccountOption=t.haveNext,n.isLoadingAccountOption=!1)}));this.subscribers.push(r)},t.prototype.getTemplateOptionService=function(t,e,n){var a,r,i,o,l=this;void 0===t&&(t=null),void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingTemplateOption=!0;var s=[this.initParam("pageNo",this.pageNoTemplateOption,"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform","WA","string"),this.initParam("filter",e,"string"),this.initParam("status","APPROVED","string"),this.initParam("clientId",null===(a=this.form.get("from").value)||void 0===a?void 0:a.clientId,"string"),this.initParam("wabaId",(i=null===(r=this.form.get("from").value)||void 0===r?void 0:r.wabaId,null!=i?i:""),"string")];this.isReadOnlyMode&&s.push(this.initParam("summary",!0,"string")),"utility"===(null===(o=this.form.value)||void 0===o?void 0:o.channel)&&s.push(this.initParam("isDirectSend",!0,"string"));var d=this.apiAdapterService.executeApiRequest(s,"/message/template","GET").subscribe((function(t){var e;l.templateOption=n?X(l.templateOption,t.data):t.data,l.isHaveNextTemplateOption=t.haveNext,l.isLoadingTemplateOption=!1;var a=null===(e=l.templateOption)||void 0===e?void 0:e.find((function(t){var e;return t.ID===(null===(e=l.form.get("template").value)||void 0===e?void 0:e.ID)}));if(a&&(l.form.get("template").setValue(a),l.form.get("isUpload").value))return l.updateDownloadCSV(l.form.get("isUpload").value);l.updateTemplate(l.form.get("template").value)}));this.subscribers.push(d)},t.prototype.initParameter=function(t,e){return void 0===t&&(t=!1),void 0===e&&(e=""),t?new m.FormGroup({name:new m.FormArray([],m.Validators.required)}):new m.FormGroup({name:new m.FormControl({value:e,disabled:this.isReadOnlyMode||["$UnsubscribeAccount"].includes(e)},m.Validators.required)})},Object.defineProperty(t.prototype,"getParamHeader",{get:function(){return this.form.get("paramHeader").controls},enumerable:!0,configurable:!0}),t.prototype.addParamHeader=function(t){void 0===t&&(t="");var e=this.initParameter(!1,t);this.form.get("paramHeader").push(e)},Object.defineProperty(t.prototype,"getParamBody",{get:function(){return this.form.get("paramBody").controls},enumerable:!0,configurable:!0}),t.prototype.addParamBody=function(t){void 0===t&&(t="");var e=this.initParameter(!1,t);this.form.get("paramBody").push(e)},Object.defineProperty(t.prototype,"getButton",{get:function(){return this.form.get("paramButton").controls},enumerable:!0,configurable:!0}),t.prototype.getParamButton=function(t){return this.form.get("paramButton").controls[t].get("name").controls},t.prototype.addParamButton=function(){var t=this.initParameter(!0);this.form.get("paramButton").push(t)},Object.defineProperty(t.prototype,"getIsText",{get:function(){var t;return this.form.get("channel").value&&"text"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsMedia",{get:function(){var t;return this.form.get("channel").value&&"media"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsTemplate",{get:function(){var t;return this.form.get("channel").value&&"template"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsCatalogue",{get:function(){var t;return this.form.get("channel").value&&"catalogue"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getIsUtility",{get:function(){var t;return this.form.get("channel").value&&"utility"===(null===(t=this.form.get("channel").value)||void 0===t?void 0:t.toLowerCase())},enumerable:!0,configurable:!0}),t.prototype.getNextAccountBatch=function(){this.isHaveNextAccountOption&&(this.pageNoAccountOption+=1,this.getAccountOptionService("",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.getNextTemplateBatch=function(){this.isHaveNextTemplateOption&&(this.pageNoTemplateOption+=1,this.getTemplateOptionService(null,"",!0))},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.onFileSelected=function(t){var e=t.target.files,n=this.extFileAccepted.split("/"),a=n[0];0!==e.length&&("application/pdf"===this.extFileAccepted&&(a=n[1]),e[0].type.includes(a)?e[0].size>1e7?this.toastr.error("Upload media failed, max size 10mb"):(this.form.get("file").setValue(e[0]),this.form.get("fileType").setValue("image"),this.form.get("fileName").setValue(e[0].name),this.form.get("targetURL").setValidators(m.Validators.required),this.form.get("targetURL").updateValueAndValidity(),e[0].type.indexOf("video")>-1&&this.form.get("fileType").setValue("video"),this.uploadMediaService()):this.toastr.error("Sorry, the file you are uploading is not allowed"))},t.prototype.uploadMediaService=function(){var t=this,e=[{name:"file",value:this.form.get("file").value,in:"formData",type:"object"}],n=this.apiAdapterService.executeApiRequest(e,"/message/media","POST").subscribe((function(e){t.form.get("targetURL").clearValidators(),t.form.get("targetURL").updateValueAndValidity(),t.form.get("targetURL").setValue(e.data.targetURL),t.form.get("file").reset(),t.toastr.success("Upload media success")}));this.subscribers.push(n)},t.prototype.updateTemplate=function(t){var e,n,a,r,i,o,l,s,d,c,p,u,g,f,v,h,b,y,x,S,w,C,I,T,A,O,V,P,M,N,D,L,F,E,R=this;if(this.isShowParameter=!1,t){this.isHaveTemplateParam=(null===(e=t.header.examples)||void 0===e?void 0:e.length)>0||(null===(n=t.body.examples)||void 0===n?void 0:n.length)>0||(null===(a=t.buttons)||void 0===a?void 0:a.length)>0,["image","video","document"].includes(null===(o=null===(i=null===(r=t)||void 0===r?void 0:r.header)||void 0===i?void 0:i.type)||void 0===o?void 0:o.toLowerCase())&&(this.form.get("fileName").setValue(null!=(u=null!=(d=null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form.fileName)?d:null===(p=null===(c=this.getCampaignStorage)||void 0===c?void 0:c.generalInformation)||void 0===p?void 0:p.form.targetURL)?u:t.header.url),this.form.get("targetURL").setValue(null!=(v=null===(f=null===(g=this.getCampaignStorage)||void 0===g?void 0:g.generalInformation)||void 0===f?void 0:f.form.targetURL)?v:t.header.url),this.fileTypeChange(null===(y=null===(b=null===(h=t)||void 0===h?void 0:h.header)||void 0===b?void 0:b.type)||void 0===y?void 0:y.toLowerCase())),(null===(x=t.header.examples)||void 0===x?void 0:x.length)>0?this.form.get("paramHeader").setValidators(m.Validators.required):this.form.get("paramHeader").clearValidators(),(null===(S=t.body.examples)||void 0===S?void 0:S.length)>0?this.form.get("paramBody").setValidators(m.Validators.required):this.form.get("paramBody").clearValidators(),(null===(w=t.buttons)||void 0===w?void 0:w.length)>0?this.form.get("paramButton").setValidators(m.Validators.required):this.form.get("paramButton").clearValidators(),this.form.get("paramHeader").controls=[],this.form.get("paramHeader").reset(),this.form.get("paramHeader").updateValueAndValidity(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramBody").updateValueAndValidity(),this.form.get("paramButton").controls=[],this.form.get("paramButton").reset(),this.form.get("paramButton").updateValueAndValidity(),this.form.get("otpValue").setValue(""),this.form.get("otpValue").clearValidators(),this.form.get("otpValue").updateValueAndValidity();var k=null===(I=null===(C=this.getCampaignStorage)||void 0===C?void 0:C.generalInformation)||void 0===I?void 0:I.form;"AUTHENTICATION"===t.category&&(this.form.get("otpValue").setValue(null!=(D=null!=(A=null===(T=k)||void 0===T?void 0:T.otpValue)?A:null===(N=X(null!=(M=null===(P=null===(V=null===(O=k)||void 0===O?void 0:O.template)||void 0===V?void 0:V.body)||void 0===P?void 0:P.examples)?M:[]))||void 0===N?void 0:N.pop())?D:""),this.form.get("otpValue").setValidators(m.Validators.required),this.form.get("otpValue").updateValueAndValidity()),null===(L=t.header.examples)||void 0===L||L.forEach((function(t,e){var n,a,r,i,o,l,s;R.addParamHeader(null!=(s=null!=(i=null===(r=null===(a=null===(n=k)||void 0===n?void 0:n.paramHeader)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(l=null===(o=k)||void 0===o?void 0:o.paramHeader)||void 0===l?void 0:l[e])?s:"")})),null===(F=t.body.examples)||void 0===F||F.forEach((function(t,e){var n,a,r,i,o,l,s,d=null!=(s=null!=(i=null===(r=null===(a=null===(n=k)||void 0===n?void 0:n.paramBody)||void 0===a?void 0:a[e])||void 0===r?void 0:r.name)?i:null===(l=null===(o=k)||void 0===o?void 0:o.paramBody)||void 0===l?void 0:l[e])?s:"";["$UnsubscribeAccount"].includes(t)&&(d=t),R.addParamBody(d)})),null===(E=t.buttons)||void 0===E||E.forEach((function(t,e){var n;R.addParamButton();var a=R.getButton;(null===(n=t.examples)||void 0===n?void 0:n.length)>0?t.examples.forEach((function(n,r){var i,o,l,s,d,m,c,p,u,g,f,v,h,b,y,x=null;"FLOW"===t.type?x=R.initParameter(!1,t.flow_id):(R.isShowParameter=!0,x=R.initParameter(!1,null!=(y=null!=(f=null!=(m=null===(d=null===(s=null===(l=null===(o=null===(i=k)||void 0===i?void 0:i.paramButton)||void 0===o?void 0:o[e])||void 0===l?void 0:l.name)||void 0===s?void 0:s[r])||void 0===d?void 0:d.name)?m:null===(g=null===(u=null===(p=null===(c=k)||void 0===c?void 0:c.paramButton)||void 0===p?void 0:p[e])||void 0===u?void 0:u.name)||void 0===g?void 0:g[r])?f:null===(b=null===(h=null===(v=k)||void 0===v?void 0:v.paramButton)||void 0===h?void 0:h[e])||void 0===b?void 0:b[r])?y:"")),a[a.length-1].get("name").push(x)})):(a[a.length-1].get("name").clearValidators(),a[a.length-1].get("name").updateValueAndValidity())}))}},t.prototype.updateMediaType=function(t){t===kt.MEDIA_TYPE_LOCATION&&this.initMaps,this.formReset(!0),this.fileTypeChange(t.toLowerCase())},t.prototype.fileTypeChange=function(t){this.extFileAccepted="image/*",t===kt.MEDIA_TYPE_VIDEO.toLowerCase()?this.extFileAccepted="video/*":t===kt.MEDIA_TYPE_DOCUMENT.toLowerCase()&&(this.extFileAccepted="application/pdf")},t.prototype.updateSearch=function(t){this.pageNoTemplateOption=1,this.getTemplateOptionService(null,t)},t.prototype.updateSearchAccount=function(t){this.pageNoAccountOption=1,this.getAccountOptionService(t)},t.prototype.initMaps=function(){var t=this;this.mapsAPILoader.load().then((function(){t.setCurrentLocation(),t.geoCoder=new google.maps.Geocoder;var e=new google.maps.places.Autocomplete(t.mapSearchRef.nativeElement);e.addListener("place_changed",(function(){t.ngZone.run((function(){var n=e.getPlace();n.geometry&&(t.maps.latitude=n.geometry.location.lat(),t.maps.longitude=n.geometry.location.lng(),t.form.get("latitude").setValue(t.maps.latitude),t.form.get("longitude").setValue(t.maps.longitude))}))}))}))},t.prototype.setCurrentLocation=function(){var t=this;"geolocation"in navigator&&navigator.geolocation.getCurrentPosition((function(e){t.form.get("longitude").value||t.form.get("latitude").value||(t.maps.latitude=e.coords.latitude,t.maps.longitude=e.coords.longitude,t.form.get("latitude").setValue(t.maps.latitude),t.form.get("longitude").setValue(t.maps.longitude))}))},t.prototype.markerDragEnd=function(t){t.latLng&&(this.maps.latitude=t.latLng.lat(),this.maps.longitude=t.latLng.lng(),this.form.get("latitude").setValue(this.maps.latitude),this.form.get("longitude").setValue(this.maps.longitude))},t.prototype.updateDownloadCSV=function(t){if(this.form.get("isUpload").setValue(t),t)return this.form.get("paramHeader").controls=[],this.form.get("paramHeader").reset(),this.form.get("paramBody").controls=[],this.form.get("paramBody").reset(),this.form.get("paramButton").controls=[],this.form.get("paramButton").reset(),this.form.get("paramHeader").clearValidators(),this.form.get("paramBody").clearValidators(),this.form.get("paramButton").clearValidators(),this.form.get("paramHeader").updateValueAndValidity(),this.form.get("paramBody").updateValueAndValidity(),this.form.get("paramButton").updateValueAndValidity(),this.form.get("otpValue").reset(),this.form.get("otpValue").clearValidators(),void this.form.get("otpValue").updateValueAndValidity();this.updateTemplate(this.form.get("template").value)},t.prototype.handleChangeTemplate=function(t){t?(this.form.get("template").setValidators(m.Validators.required),this.form.get("text").reset(),this.form.get("text").clearValidators(),this.form.get("text").updateValueAndValidity(),this.form.get("template").updateValueAndValidity()):(this.form.get("template").reset(),this.form.get("template").clearValidators(),this.form.get("text").setValidators([m.Validators.required,m.Validators.max(1024)]),this.form.get("text").updateValueAndValidity(),this.form.get("template").updateValueAndValidity())},t.prototype.handleChangeFrom=function(t){this.form.value.isUseExistingTemplate&&this.getTemplateOptionService(t)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:e.NgZone},{type:n.MapsAPILoader},{type:ut},{type:s.ToastrService}]},J([e.Output()],t.prototype,"updateGeneralInformationForm",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.Input()],t.prototype,"isTouchedForm",null),J([e.ViewChild("mapSearch")],t.prototype,"mapSearchRef",void 0),t=J([e.Component({selector:"lib-general-information-wa",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',styles:['.asterix--after:after{content:"*";color:red}']})],t)}();var oe=function(){function t(t){this.apiAdapterService=t,this.isHaveNextTemplateOption=$({},Ot),this.isLoadingTemplateOption=$({},At),this.templateOption=$({},Pt),this.isLoadingAccountOption=$({},At),this.isHaveNextAccountOption=$({},Ot),this.accountOption=$({},Pt),this.subscribers=[],this.pageNoTemplateOption=$({},Vt),this.pageNoAccountOption=$({},Vt),this.failover=new e.EventEmitter}return t.prototype.ngOnInit=function(){var t=this;this.validationMessages=Et,this.channelOption=X(bt).filter((function(e){var n,a,r;return!["LINE",null===(r=null===(a=null===(n=t.getCampaignStorage)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form)||void 0===r?void 0:r.medium].includes(e.value)})),this.initForm(),this.initDisable(),this.initEdit(),this.failover.emit(this.form)},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"interval",{get:function(){return this.form.get("interval")},enumerable:!0,configurable:!0}),t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({active:new m.FormControl(!1,m.Validators.required),type:new m.FormControl(""),interval:new m.FormControl(null),accounts:new m.FormArray([])}),this.form.valueChanges.subscribe((function(){t.interval.touched&&0===t.interval.value&&t.form.get("interval").setErrors({intervalTime:!0}),t.failover.emit(t.form)}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s,d,m;0!==Object.entries(this.getCampaignStorage).length&&(null===(t=this.getCampaignStorage)||void 0===t?void 0:t.failover)&&(this.form.get("active").setValue(null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.failover)||void 0===n?void 0:n.active),this.form.get("type").setValue(null!=(i=null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.failover)||void 0===r?void 0:r.type)?i:""),this.form.get("interval").setValue(null!=(s=null===(l=null===(o=this.getCampaignStorage)||void 0===o?void 0:o.failover)||void 0===l?void 0:l.interval)?s:null),this.activeChange(null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.failover)||void 0===m?void 0:m.active),this.validationAccount())},t.prototype.initAccount=function(t,e){var n,a,r,i,o,l,s,d,c,p,u,g,f;return void 0===t&&(t=null),void 0===e&&(e=null),new m.FormGroup({channel:new m.FormControl(e),platform:new m.FormControl(null===(n=e)||void 0===n?void 0:n.value),accountId:new m.FormControl({value:(null===(a=t)||void 0===a?void 0:a.accountId)&&"string"==typeof(null===(r=t)||void 0===r?void 0:r.accountId)?{id:null===(i=t)||void 0===i?void 0:i.accountId,name:null===(o=t)||void 0===o?void 0:o.accountName}:(s=null===(l=t)||void 0===l?void 0:l.accountId,null!=s?s:""),disabled:this.isReadOnlyMode},m.Validators.required),accountName:new m.FormControl((c=null===(d=t)||void 0===d?void 0:d.accountName,null!=c?c:"")),subject:new m.FormControl({value:(u=null===(p=t)||void 0===p?void 0:p.subject,null!=u?u:""),disabled:this.isReadOnlyMode}),template:new m.FormControl({value:(f=null===(g=t)||void 0===g?void 0:g.template,null!=f?f:""),disabled:this.isReadOnlyMode}),paramBody:new m.FormArray([])})},Object.defineProperty(t.prototype,"getAccount",{get:function(){return this.form.get("accounts").controls},enumerable:!0,configurable:!0}),t.prototype.addAccount=function(t,e){var n,a,r,i,o,l;void 0===t&&(t=null),void 0===e&&(e=null);var s=this.initAccount(t,e);this.form.get("accounts").push(s),this.getAccountOptionService(null===(n=e)||void 0===n?void 0:n.value,null!=(r=null===(a=t)||void 0===a?void 0:a.accountName)?r:""),this.getTemplateOptionService(null===(i=e)||void 0===i?void 0:i.value,{},null===(l=null===(o=t)||void 0===o?void 0:o.template)||void 0===l?void 0:l.name)},t.prototype.initParameter=function(){return new m.FormGroup({name:new m.FormControl("",m.Validators.required)})},t.prototype.getParamBody=function(t){return t.get("paramBody").controls},t.prototype.addParamBody=function(t){var e=this.initParameter();t.get("paramBody").push(e)},t.prototype.deleteParamBody=function(t,e){t.get("paramBody").removeAt(e)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.getAccountOptionService=function(t,e,n){var a=this;void 0===e&&(e=""),void 0===n&&(n=!1),this.isLoadingAccountOption[t]=!0;var r=[this.initParam("pageNo",this.pageNoAccountOption[t],"number"),this.initParam("rowPerPage",20,"number"),this.initParam("status","APPROVED","string"),this.initParam("platform",t,"string"),this.initParam("filter",e,"string")],i=this.apiAdapterService.executeApiRequest(r,"/admin/account","GET").subscribe((function(e){e.data&&(a.accountOption[t]=n?X(a.accountOption[t],e.data):e.data,a.isHaveNextAccountOption[t]=e.haveNext,a.isLoadingAccountOption[t]=!1)}));this.subscribers.push(i)},t.prototype.getTemplateOptionService=function(t,e,n,a){var r,i,o,l,s=this;void 0===n&&(n=""),void 0===a&&(a=!1),this.isLoadingTemplateOption[t]=!0;var d=[this.initParam("pageNo",this.pageNoTemplateOption[t],"number"),this.initParam("rowPerPage",20,"number"),this.initParam("platform",t,"string"),this.initParam("filter",n,"string"),this.initParam("clientId",(i=null===(r=e)||void 0===r?void 0:r.clientId,null!=i?i:""),"string"),this.initParam("wabaId",(l=null===(o=e)||void 0===o?void 0:o.wabaId,null!=l?l:""),"string")];"WA"===t&&d.push(this.initParam("status","APPROVED","string"));var m=this.apiAdapterService.executeApiRequest(d,"/message/template","GET").subscribe((function(e){s.templateOption[t]=a?X(s.templateOption[t],e.data):e.data,s.isHaveNextTemplateOption[t]=e.haveNext,s.isLoadingTemplateOption[t]=!1}));this.subscribers.push(m)},t.prototype.getNextAccountBatch=function(t){this.isHaveNextAccountOption[t]&&(this.pageNoAccountOption[t]+=1,this.getAccountOptionService(t,"",!0))},t.prototype.accountSelectedDisplay=function(t,e){return t&&e&&t.id==e.id?t.name+" ("+t.accountNo+")":""},t.prototype.templateSelectedDisplay=function(t,e){return t&&e&&t.name==e.name?""+t.name:""},t.prototype.getNextTemplateBatch=function(t,e){this.isHaveNextTemplateOption[t]&&(this.pageNoTemplateOption[t]+=1,this.getTemplateOptionService(t,e,"",!0))},t.prototype.updateSearch=function(t,e,n){this.pageNoTemplateOption[e]=1,this.getTemplateOptionService(e,n,t)},t.prototype.updateSearchAccount=function(t,e){this.pageNoAccountOption[e]=1,this.getAccountOptionService(e,t)},t.prototype.activeChange=function(t){var e,n,a,r,i,o,l=this;if(this.form.get("type").setValue(null!=(a=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.failover)||void 0===n?void 0:n.type)?a:""),this.form.get("type").setValidators(m.Validators.required),this.form.get("type").updateValueAndValidity(),t){var s=null===(o=null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.failover)||void 0===i?void 0:i.accounts)||void 0===o?void 0:o.filter((function(t){var e,n,a;return t.platform!==(null===(a=null===(n=null===(e=l.getCampaignStorage)||void 0===e?void 0:e.generalInformation)||void 0===n?void 0:n.form)||void 0===a?void 0:a.medium)}));return s?(s.map((function(t){return l.addAccount(t,l.channelOption.find((function(e){return e.value===t.platform})))})),void this.channelOption.filter((function(t){return!s.find((function(e){return e.platform===t.value}))})).map((function(t){return l.addAccount({},t)}))):void this.channelOption.map((function(t){return l.addAccount({},t)}))}this.form.get("type").clearValidators(),this.form.get("type").updateValueAndValidity(),this.form.get("accounts").controls=[],this.form.get("accounts").reset(),this.form.get("accounts").updateValueAndValidity(),this.typeChange("Status")},t.prototype.typeChange=function(t){var e,n,a;if("Time"===t)return this.form.get("interval").setValue(null!=(a=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.failover)||void 0===n?void 0:n.interval)?a:null),this.form.get("interval").setValidators([m.Validators.required,function(t){if(!t.value)return null;var e=Number(t.value);return Number.isNaN(e)||e%1!=0||e<1?{intervalTime:!0}:null}]),void this.form.get("interval").updateValueAndValidity();this.form.get("interval").clearValidators(),this.form.get("interval").updateValueAndValidity()},t.prototype.validationAccount=function(t,e){var n,a,r;void 0===t&&(t=null),void 0===e&&(e=null),null===(n=e)||void 0===n||n.get("accountName").setValue(null!=(r=null===(a=this.accountOption[e.get("platform").value].find((function(e){var n;return e.id===(null===(n=t)||void 0===n?void 0:n.id)})))||void 0===a?void 0:a.name)?r:"");var i=this.getAccount.filter((function(t){return t.get("accountId").value}));this.getAccount.forEach((function(t){var e;t.get("accountId").setValidators(m.Validators.required),t.get("subject").setValidators(m.Validators.required),t.get("template").setValidators(m.Validators.required),!t.get("accountId").value&&(null===(e=i)||void 0===e?void 0:e.length)>0?(t.get("accountId").clearValidators(),t.get("subject").setValue(""),t.get("subject").clearValidators(),t.get("template").setValue(""),t.get("template").clearValidators()):["WA","SMS","VOICE"].includes(t.get("platform").value)&&t.get("subject").clearValidators(),t.get("accountId").updateValueAndValidity(),t.get("subject").updateValueAndValidity(),t.get("template").updateValueAndValidity()})),e&&this.getTemplateOptionService(e.get("platform").value,e.get("accountId").value)},t.prototype.drop=function(t){d.moveItemInArray(this.getAccount,t.previousIndex,t.currentIndex),this.failover.emit(this.form)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ut}]},J([e.Output()],t.prototype,"failover",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),t=J([e.Component({selector:"lib-failover-mechanism",template:'<form [formGroup]="form"\r\n  class="failover-mechanism">\r\n  <mat-slide-toggle class="failover-activated mb-3"\r\n    formControlName="active"\r\n    (change)="activeChange($event.checked)">\r\n    <p class="font-18px font-PoppinsBold mb-0">Failover Mechanism</p>\r\n  </mat-slide-toggle>\r\n\r\n  <ng-container *ngIf="form.get(\'active\').value">\r\n    <p>Switch to a backup communication channel if the primary channel experiences interference or failure.</p>\r\n\r\n    <p class="font-16px font-PoppinsBold asterix--after mt-4 mb-1">Main Rules</p>\r\n\r\n    <p>Set rule for failover main trigger</p>\r\n\r\n    <div class=\'d-flex\'>\r\n      <mat-radio-group class="main-rule-type"\r\n        formControlName="type"\r\n        (change)="typeChange($event.value)">\r\n        <mat-radio-button value="Status">Delivery Status</mat-radio-button>\r\n        <mat-radio-button value="Time">Waiting Time</mat-radio-button>\r\n      </mat-radio-group>\r\n\r\n      <div class=\'information\'>\r\n        <mat-icon svgIcon="information"\r\n          class="mr-2">\r\n        </mat-icon>\r\n        <ol class="tooltip-rules">\r\n          <li class="mb-3">\r\n            If <strong>Delivery Status</strong> is selected, failover messages will be triggered if the\r\n            previous message has failed to deliver.\r\n          </li>\r\n\r\n          <li>\r\n            If <strong>Waiting Time</strong> is selected, failover messages will be triggered according to\r\n            the configured time. Counting will start when a message is sent. If the time is reached before\r\n            the message is delivered/read, then a failover message will be triggered.\r\n          </li>\r\n        </ol>\r\n      </div>\r\n\r\n    </div>\r\n  </ng-container>\r\n\r\n  <div *ngIf="form.get(\'type\').value === \'Time\'"\r\n    class="form-group w-25 my-3">\r\n    <div class=\'d-flex align-items-baseline gap-2\'>\r\n      <mat-form-field appearance="outline"\r\n        floatLabel="always"\r\n        class="w-100">\r\n        <mat-label class="asterix--after">Interval Time</mat-label>\r\n\r\n        <input matInput\r\n          type="number"\r\n          class="text-right"\r\n          formControlName="interval"\r\n          placeholder="Enter Interval Time">\r\n\r\n      </mat-form-field>\r\n      minute(s)\r\n    </div>\r\n\r\n    <mat-error align="start"\r\n      *ngFor="let validation of validationMessages.interval">\r\n      <p class="font-12px mb-0"\r\n        *ngIf="form.get(\'interval\').touched\r\n\t\t\t\t\t\t\t&& form.get(\'interval\').hasError(validation.type)">\r\n        {{ validation.message }}\r\n      </p>\r\n    </mat-error>\r\n  </div>\r\n\r\n  <div *ngIf="form.get(\'active\').value"\r\n    cdkDropList\r\n    class="mt-3"\r\n    formArrayName="accounts"\r\n    (cdkDropListDropped)="drop($event)">\r\n    <div *ngFor="let account of getAccount; let accountIndex = index"\r\n      cdkDrag\r\n      cdkDragHandle>\r\n      <div *ngIf="account.get(\'channel\').value"\r\n        class="d-flex align-items-center gap-2">\r\n        <div class="accounts-card w-50 mb-3 px-3 pt-3">\r\n          <div class="form-group w-75">\r\n            <mat-form-field appearance="outline"\r\n              floatLabel="always"\r\n              class="account-option w-100">\r\n              <mat-label class="asterix--after">\r\n                {{ account.get(\'channel\').value?.label }}\r\n              </mat-label>\r\n\r\n              <mat-icon class="icon-menu"\r\n                [svgIcon]="account.get(\'channel\').value?.inputSvgIcon"></mat-icon>\r\n\r\n              <mat-select matSelectInfiniteScroll\r\n                placeholder="--- Select Account ---"\r\n                [formControl]="account.get(\'accountId\')"\r\n                [complete]="isHaveNextAccountOption[account.get(\'platform\').value] === false"\r\n                [compareWith]="accountSelectedDisplay"\r\n                (infiniteScroll)="getNextAccountBatch(account.get(\'platform\').value)"\r\n                (selectionChange)="validationAccount($event.value, account)">\r\n                <div style="margin: 20px">\r\n                  <lib-search [placeholder]="\'Search\'"\r\n                    [currentValue]="account?.get(\'accountId\').value?.name"\r\n                    (searchRes)="updateSearchAccount($event, account.get(\'platform\').value)"></lib-search>\r\n                </div>\r\n\r\n                <mat-option value=""> --- Select Account --- </mat-option>\r\n                <mat-option *ngFor="let option of accountOption[account.get(\'platform\').value]"\r\n                  [value]="option">\r\n                  {{ option.name + \' (\' + option.accountNo + \')\' }}\r\n                </mat-option>\r\n\r\n                <mat-option *ngIf="isLoadingAccountOption[account.get(\'platform\').value]">Loading...</mat-option>\r\n              </mat-select>\r\n            </mat-form-field>\r\n\r\n            <mat-error align="start"\r\n              *ngFor="let validation of validationMessages.accountId">\r\n              <p class="font-12px mb-0"\r\n                *ngIf="account.get(\'accountId\').touched\r\n                      && account.get(\'accountId\').hasError(validation.type)">\r\n                {{ validation.message }}\r\n              </p>\r\n            </mat-error>\r\n          </div>\r\n\r\n          <ng-container *ngIf="account.get(\'accountId\').value">\r\n            <div *ngIf="account.get(\'platform\').value === \'EMAIL\'"\r\n              class="form-group w-75">\r\n              <mat-form-field appearance="outline"\r\n                floatLabel="always"\r\n                class="w-100">\r\n                <mat-label class="asterix--after">Subject</mat-label>\r\n\r\n                <input matInput\r\n                  type="text"\r\n                  placeholder="Enter Subject"\r\n                  [formControl]="account.get(\'subject\')">\r\n              </mat-form-field>\r\n\r\n              <mat-error align="start"\r\n                *ngFor="let validation of validationMessages.subject">\r\n                <p class="font-12px mb-0"\r\n                  *ngIf="account.get(\'subject\').touched\r\n                        && account.get(\'subject\').hasError(validation.type)">\r\n                  {{ validation.message }}\r\n                </p>\r\n              </mat-error>\r\n            </div>\r\n\r\n            <div *ngIf="[\'WA\', \'SMS\', \'EMAIL\'].includes(account.get(\'platform\').value)"\r\n              class="form-group w-75">\r\n              <mat-form-field appearance="outline"\r\n                floatLabel="always"\r\n                class="w-100">\r\n                <mat-label class="asterix--after">Template</mat-label>\r\n\r\n                <mat-select matSelectInfiniteScroll\r\n                  placeholder="Select template"\r\n                  [formControl]="account.get(\'template\')"\r\n                  [complete]="isHaveNextTemplateOption[account.get(\'platform\').value] === false"\r\n                  [compareWith]="templateSelectedDisplay"\r\n                  (infiniteScroll)="getNextTemplateBatch(account.get(\'platform\').value, account.get(\'accountId\').value)">\r\n                  <div style="margin: 20px">\r\n                    <lib-search [placeholder]="\'Search\'"\r\n                      [currentValue]="account.get(\'template\').value?.name"\r\n                      (searchRes)="updateSearch($event, account.get(\'platform\').value, account.get(\'accountId\').value)"></lib-search>\r\n                  </div>\r\n\r\n                  <mat-option *ngFor="let option of templateOption[account.get(\'platform\').value]"\r\n                    [value]="option">\r\n                    {{ option.name }}\r\n                  </mat-option>\r\n                  <mat-option *ngIf="isLoadingTemplateOption[account.get(\'platform\').value]">Loading...</mat-option>\r\n                </mat-select>\r\n              </mat-form-field>\r\n\r\n              <mat-error align="start"\r\n                *ngFor="let validation of validationMessages.subject">\r\n                <p class="font-12px mb-0"\r\n                  *ngIf="account.get(\'template\').touched\r\n                        && account.get(\'template\').hasError(validation.type)">\r\n                  {{ validation.message }}\r\n                </p>\r\n              </mat-error>\r\n            </div>\r\n\r\n            <ng-container *ngIf="account.get(\'platform\').value === \'VOICE\'">\r\n              <div class="form-group w-75">\r\n                <mat-form-field appearance="outline"\r\n                  floatLabel="always"\r\n                  class="w-100">\r\n                  <mat-label class="asterix--after">Template</mat-label>\r\n\r\n                  <input matInput\r\n                    type="text"\r\n                    placeholder="Enter Template"\r\n                    [formControl]="account.get(\'template\')">\r\n                </mat-form-field>\r\n\r\n                <mat-error align="start"\r\n                  *ngFor="let validation of validationMessages.subject">\r\n                  <p class="font-12px mb-0"\r\n                    *ngIf="account.get(\'template\').touched\r\n                          && account.get(\'template\').hasError(validation.type)">\r\n                    {{ validation.message }}\r\n                  </p>\r\n                </mat-error>\r\n              </div>\r\n\r\n              <div class="w-75 text-right mb-2">\r\n                <button class="btn btn-sm color-blue2"\r\n                  (click)="addParamBody(account)">\r\n                  + Add Parameter\r\n                </button>\r\n              </div>\r\n\r\n              <ng-container *ngIf="getParamBody(account)?.length > 0">\r\n                <p class="font-16px font-PoppinsBold mt-3">Body Parameter</p>\r\n\r\n                <div *ngFor="let param of getParamBody(account); let paramBodyIndex = index"\r\n                  class="form-group d-flex align-items-center gap-1 w-75">\r\n                  <mat-form-field appearance="outline"\r\n                    floatLabel="always"\r\n                    class="w-100">\r\n                    <mat-label>Parameter {{ paramBodyIndex + 1 }}</mat-label>\r\n\r\n                    <input matInput\r\n                      type="text"\r\n                      [placeholder]="\'Parameter \' + (paramBodyIndex + 1)"\r\n                      [formControl]="param.get(\'name\')" />\r\n                  </mat-form-field>\r\n\r\n                  <div class="action-icon pointer"\r\n                    (click)="deleteParamBody(account, paramBodyIndex)"\r\n                    title="Delete">\r\n                    <mat-icon class="icon-menu"\r\n                      svgIcon="icon_delete"></mat-icon>\r\n                  </div>\r\n                </div>\r\n              </ng-container>\r\n\r\n\r\n            </ng-container>\r\n          </ng-container>\r\n        </div>\r\n        <mat-icon class="ml-2"\r\n          svgIcon="drag-handle"></mat-icon>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</form>\r\n',styles:['.failover-mechanism .accounts-card{border:1px solid #e2e2e2;border-radius:16px}.failover-mechanism .information{position:relative;cursor:pointer;margin-left:20px}.failover-mechanism .information .tooltip-rules{position:absolute;top:-100px;left:30px;width:400px;padding:30px 30px 14px;background-color:#fff3cd;font-size:12px;border-radius:5px;z-index:10;opacity:0;transition:.35s}.failover-mechanism .information:hover .tooltip-rules{opacity:1}.asterix--after:after{content:"*";color:red}::ng-deep .mat-form-field.account-option .mat-form-field-infix{display:flex;align-items:center;gap:10px}::ng-deep .mat-slide-toggle.failover-activated .mat-slide-toggle-bar{width:40px;height:20px;border-radius:13px}::ng-deep .mat-slide-toggle.failover-activated .mat-slide-toggle-thumb-container{width:18px;height:18px;top:1px;left:1px}::ng-deep .mat-slide-toggle.failover-activated .mat-slide-toggle-thumb{width:18px;height:18px;border-radius:50%}::ng-deep .mat-slide-toggle.failover-activated.mat-checked .mat-slide-toggle-bar{background-color:#2bca3b}::ng-deep .mat-slide-toggle.failover-activated.mat-checked .mat-slide-toggle-thumb-container{left:4px}::ng-deep .mat-slide-toggle.failover-activated.mat-checked .mat-slide-toggle-thumb{background-color:#fff}::ng-deep .mat-radio-group.main-rule-type .mat-radio-button.mat-radio-checked .mat-radio-outer-circle{border-color:#4285f4}::ng-deep .mat-radio-group.main-rule-type .mat-radio-button.mat-radio-checked .mat-radio-inner-circle{background-color:#4285f4}::ng-deep .mat-radio-group.main-rule-type .mat-radio-button~.mat-radio-button{margin-left:25px}']})],t)}(),le=function(){function t(t){var n=this;this.sanitizer=t,this.isTouchedWAForm=!1,this.isTouchedSMSForm=!1,this.isTouchedEmailForm=!1,this.isShowMore=!1,this.twilioResultCounter={segments:0,characters:0,encoding:"",fulltext:"Encode - / Chars 0 / Segment 1"},this.onCheckTwilioCounter=function(){var t,e,a,r,i,o=null===(t=n.generalInformationForm)||void 0===t?void 0:t.getRawValue();if("TEXT"===(null===(e=o)||void 0===e?void 0:e.channel)){var l={segments:(d=new j.SegmentedMessage(n.getBodyString)).segmentsCount,encoding:d.encodingName,characters:d.numberOfUnicodeScalars};n.twilioResultCounter=$($({},l),{fulltext:"Encode "+l.encoding+" / Chars "+l.characters+" / Segment "+l.segments})}else{var s=n.getBodyString;Array.from((null===(i=null===(r=null===(a=o)||void 0===a?void 0:a.template)||void 0===r?void 0:r.body)||void 0===i?void 0:i.examples)||[]).map((function(t,e){var n,a="{{"+t+"}}",r=null===(n=o.paramBody[e])||void 0===n?void 0:n.name;s=s.split(a).join(r)}));var d;l={segments:(d=new j.SegmentedMessage(s)).segmentsCount,encoding:d.encodingName,characters:d.numberOfUnicodeScalars};n.twilioResultCounter=$($({},l),{fulltext:"Encode "+l.encoding+" / Chars "+l.characters+" / Segment "+l.segments})}},this.generalInformation=new e.EventEmitter}return t.prototype.ngOnInit=function(){this.channelOption=bt,this.validationMessages=Mt,this.maps={zoom:15,latitude:null,longitude:null,isDraggable:!0,isDoubleClickZoom:!0},this.initForm(),this.initEdit(),this.initDisable()},t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({id:new m.FormControl(null),campaignName:new m.FormControl(null,[m.Validators.required,m.Validators.maxLength(100)]),medium:new m.FormControl(null,[m.Validators.required])}),this.form.valueChanges.subscribe((function(){t.isTouchedWAForm=!t.isTouchedWAForm,t.isTouchedSMSForm=!t.isTouchedSMSForm,t.isTouchedEmailForm=!t.isTouchedEmailForm,t.generalInformation.emit({parent:t.form,child:t.generalInformationForm})})),setInterval((function(){t.onCheckTwilioCounter()}),400)},t.prototype.initEdit=function(){var t,e,n,a,r,i,o=localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{};0!==Object.entries(o).length&&(this.form.get("id").setValue(null===(e=null===(t=o)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.id),this.form.get("campaignName").setValue(null===(a=null===(n=o)||void 0===n?void 0:n.generalInformation)||void 0===a?void 0:a.form.campaignName),this.form.get("medium").setValue(null===(i=null===(r=o)||void 0===r?void 0:r.generalInformation)||void 0===i?void 0:i.form.medium))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.updateGeneralInformationForm=function(t){this.generalInformationForm=t,this.isShowMore=!1,this.generalInformation.emit({parent:this.form,child:this.generalInformationForm}),"LOCATION"===this.getMedia&&this.getLocation()},Object.defineProperty(t.prototype,"getHeader",{get:function(){var t,e,n;return(null===(n=null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.from)||void 0===n?void 0:n.name)||""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getBodyString",{get:function(){var t,e,n,a,r,i,o,l,s,d,m;return null!=(m=null===(d=(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.text)||(null===(i=null===(r=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.template)||void 0===r?void 0:r.body)||void 0===i?void 0:i.text)||(null===(s=null===(l=null===(o=this.generalInformationForm)||void 0===o?void 0:o.getRawValue())||void 0===l?void 0:l.body)||void 0===s?void 0:s.text))||void 0===d?void 0:d.split(/\\n|\n/).join("<br />").split(/\\t|\t/).join("    "))?m:""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getBody",{get:function(){var t,e,n,a,r,i,o,l,s,d,m,c=(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.text)||(null===(i=null===(r=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.template)||void 0===r?void 0:r.body)||void 0===i?void 0:i.text)||(null===(s=null===(l=null===(o=this.generalInformationForm)||void 0===o?void 0:o.getRawValue())||void 0===l?void 0:l.body)||void 0===s?void 0:s.text);return this.sanitizer.bypassSecurityTrustHtml(this.fixGeneratedHtml(null!=(m=null===(d=c)||void 0===d?void 0:d.split(/\\n|\n/).join("<br />").split(/\\t|\t/).join("    "))?m:""))},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getMedia",{get:function(){var t,e;return(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.media)||""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getTemplate",{get:function(){var t,e;return(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.template)||{}},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getTemplateButton",{get:function(){var t,e,n,a,r,i=!this.isShowMore&&(null===(e=null===(t=this.getTemplate)||void 0===t?void 0:t.buttons)||void 0===e?void 0:e.length)>3?2:null===(a=null===(n=this.getTemplate)||void 0===n?void 0:n.buttons)||void 0===a?void 0:a.length;return X(null===(r=this.getTemplate)||void 0===r?void 0:r.buttons).splice(0,i)||[]},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"displayFile",{get:function(){var t,e,n,a,r,i,o,l;return null!=(l=null===(o=(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.targetURL)||(null===(i=null===(r=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.template)||void 0===r?void 0:r.header)||void 0===i?void 0:i.url))||void 0===o?void 0:o.replace("adlsandbox.com","adlsandbox.net"))?l:""},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isText",{get:function(){var t,e;return"TEXT"===(null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.channel)},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"isJSON",{get:function(){var t,e;return null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.isJSON},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"getTemplateLine",{get:function(){var t,e,n,a,r,i,o,l;return this.isJSON?JSON.parse(null===(a=null===(n=null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.template)||void 0===n?void 0:n.body)||void 0===a?void 0:a.text):null===(l=null===(o=null===(i=null===(r=this.generalInformationForm)||void 0===r?void 0:r.getRawValue())||void 0===i?void 0:i.template)||void 0===o?void 0:o.body)||void 0===l?void 0:l.text},enumerable:!0,configurable:!0}),t.prototype.getLocation=function(){var t,e,n,a;this.maps.latitude=null===(e=null===(t=this.generalInformationForm)||void 0===t?void 0:t.getRawValue())||void 0===e?void 0:e.latitude,this.maps.longitude=null===(a=null===(n=this.generalInformationForm)||void 0===n?void 0:n.getRawValue())||void 0===a?void 0:a.longitude},t.prototype.fixGeneratedHtml=function(t){return t.replaceAll(/div src="http/g,'img src="http').replaceAll(/div src="data:image/g,'img src="data:image').replaceAll(/Drag and drop your image here/g,"")},t.ctorParameters=function(){return[{type:H.DomSanitizer}]},J([e.Output()],t.prototype,"generalInformation",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),t=J([e.Component({selector:"lib-new-campaign-general-information",template:'<form autocomplete="off" [formGroup]="form">\r\n    <div class="campaign-info">\r\n        <div class="campaign-info-child">\r\n            <mat-card>\r\n                <mat-card-content>\r\n                    <h3 class="font-22px font-PoppinsBold mb-4">General Information</h3>\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">Broadcast Name</mat-label>\r\n\r\n                            <input\r\n                                matInput\r\n                                type="text"\r\n                                formControlName="campaignName"\r\n                                placeholder="Enter Broadcast name"\r\n                            />\r\n                        </mat-form-field>\r\n\r\n                        <div class="d-flex justify-content-between align-items-center w-100">\r\n                            <mat-hint align="start">\r\n                                {{ form.get(\'campaignName\').value?.length || 0 }}/100\r\n                            </mat-hint>\r\n\r\n                            <div>\r\n                                <mat-error\r\n                                    align="end"\r\n                                    *ngFor="let validation of validationMessages.campaignName"\r\n                                >\r\n                                    <p\r\n                                        class="font-12px mb-0"\r\n                                        *ngIf="\r\n                                            form.get(\'campaignName\').touched &&\r\n                                            form.get(\'campaignName\').hasError(validation.type)\r\n                                        "\r\n                                    >\r\n                                        {{ validation.message }}\r\n                                    </p>\r\n                                </mat-error>\r\n                            </div>\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">Channel</mat-label>\r\n\r\n                            <mat-select placeholder="Select channel" formControlName="medium">\r\n                                <mat-option\r\n                                    *ngFor="let option of channelOption"\r\n                                    [value]="option.value"\r\n                                >\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.medium">\r\n                            <p\r\n                                class="font-12px mb-0"\r\n                                *ngIf="\r\n                                    form.get(\'medium\').touched &&\r\n                                    form.get(\'medium\').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                    <ng-container *ngIf="form.get(\'medium\').value === \'WA\'">\r\n                        <lib-general-information-wa\r\n                            [isTouchedForm]="isTouchedWAForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-wa>\r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf="form.get(\'medium\').value === \'LINE\'">\r\n                        <lib-general-information-line\r\n                            [isTouchedForm]="isTouchedSMSForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-line>\r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf="form.get(\'medium\').value === \'SMS\'">\r\n                        <lib-general-information-sms\r\n                            [isTouchedForm]="isTouchedSMSForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-sms>\r\n                    </ng-container>\r\n\r\n                    <ng-container *ngIf="form.get(\'medium\').value === \'EMAIL\'">\r\n                        <lib-general-information-email\r\n                            [isTouchedForm]="isTouchedEmailForm"\r\n                            [isReadOnlyMode]="isReadOnlyMode"\r\n                            (updateGeneralInformationForm)="updateGeneralInformationForm($event)"\r\n                        ></lib-general-information-email>\r\n                    </ng-container>\r\n                </mat-card-content>\r\n            </mat-card>\r\n        </div>\r\n\r\n        <div class="campaign-info-child pl-20px">\r\n            <h3 class="font-22px font-PoppinsBold">Broadcast Content</h3>\r\n\r\n            <div\r\n                [ngClass]="\r\n                    form.get(\'medium\').value === \'SMS\' || form.get(\'medium\').value === \'EMAIL\'\r\n                        ? \'campaign-border-preview\'\r\n                        : \'campaign-preview\'\r\n                "\r\n            >\r\n                <section\r\n                    *ngIf="\r\n                        form.get(\'medium\').value === \'SMS\' || form.get(\'medium\').value === \'EMAIL\'\r\n                    "\r\n                >\r\n                    <p\r\n                        *ngIf="getBody"\r\n                        class="body my-2"\r\n                        style="max-width: 500px; word-wrap: break-word"\r\n                        [innerHTML]="getBody"\r\n                    ></p>\r\n                </section>\r\n\r\n                <section *ngIf="form.get(\'medium\').value === \'WA\'" class="campaign-preview__wa">\r\n                    <div class="header-preview">\r\n                        <div class="heading">\r\n                            {{ getHeader }}\r\n                        </div>\r\n                    </div>\r\n                    <div class="body-preview">\r\n                        <section *ngIf="getBody || getMedia || displayFile">\r\n                            <div\r\n                                class="chat"\r\n                                [ngClass]="{ \'no-bottom-border\': getTemplate?.buttons?.length > 0 }"\r\n                            >\r\n                                <img\r\n                                    *ngIf="\r\n                                        (getMedia === \'IMAGE\' ||\r\n                                            getTemplate?.header?.type?.toLowerCase() === \'image\') &&\r\n                                        displayFile\r\n                                    "\r\n                                    style="max-width: 100%"\r\n                                    alt="image"\r\n                                    [src]="displayFile"\r\n                                />\r\n\r\n                                <video\r\n                                    *ngIf="\r\n                                        (getMedia === \'VIDEO\' ||\r\n                                            getTemplate?.header?.type?.toLowerCase() === \'video\') &&\r\n                                        displayFile\r\n                                    "\r\n                                    id="video"\r\n                                    style="width: 100%"\r\n                                    [src]="displayFile"\r\n                                    controls\r\n                                ></video>\r\n\r\n                                <div *ngIf="getMedia === \'DOCUMENT\'" style="display: flex">\r\n                                    <img\r\n                                        style="width: 13px; height: 18px"\r\n                                        alt="document"\r\n                                        src="../../../../../assets/images/icon-file.png"\r\n                                    />\r\n\r\n                                    <span style="margin-left: 10px">Document</span>\r\n                                </div>\r\n\r\n                                <ng-container *ngIf="getMedia === \'LOCATION\'">\r\n                                    <agm-map\r\n                                        style="width: 100%; height: 200px"\r\n                                        [disableDefaultUI]="true"\r\n                                        [latitude]="maps.latitude"\r\n                                        [longitude]="maps.longitude"\r\n                                        [zoom]="maps.zoom"\r\n                                    >\r\n                                        <agm-marker\r\n                                            [latitude]="maps.latitude"\r\n                                            [longitude]="maps.longitude"\r\n                                            [markerDraggable]="false"\r\n                                        ></agm-marker>\r\n                                    </agm-map>\r\n                                    <a\r\n                                        [href]="\r\n                                            \'https://www.google.com/maps/search/?api=1&query=\' +\r\n                                            maps.latitude +\r\n                                            \',\' +\r\n                                            maps.longitude\r\n                                        "\r\n                                    >\r\n                                        https://www.google.com/maps/search/?api=1&query={{\r\n                                            maps.latitude\r\n                                        }},{{ maps.longitude }}\r\n                                    </a>\r\n                                </ng-container>\r\n\r\n                                <p *ngIf="getBody" class="body my-2" [innerHTML]="getBody"></p>\r\n\r\n                                <p\r\n                                    *ngIf="getTemplate?.footer"\r\n                                    class="mb-2"\r\n                                    style="color: rgb(160, 160, 160)"\r\n                                >\r\n                                    {{ getTemplate.footer }}\r\n                                </p>\r\n                            </div>\r\n                        </section>\r\n                        <section *ngIf="getTemplate?.buttons?.length > 0">\r\n                            <div\r\n                                *ngFor="let button of getTemplateButton"\r\n                                class="params-btn pb-0 pointer"\r\n                            >\r\n                                <p class="mb-0">\r\n                                    {{ button?.text || button?.type }}\r\n                                </p>\r\n                            </div>\r\n\r\n                            <div\r\n                                *ngIf="getTemplate?.buttons?.length > 3"\r\n                                class="params-btn pb-0 pointer"\r\n                                (click)="isShowMore = !isShowMore"\r\n                            >\r\n                                <p class="mb-0"><mat-icon>list</mat-icon> See all options</p>\r\n                            </div>\r\n                        </section>\r\n                    </div>\r\n                </section>\r\n\r\n                <section *ngIf="form.get(\'medium\').value === \'LINE\'" class="campaign-preview__line">\r\n                    <div class="header-preview">\r\n                        <div class="heading">\r\n                            {{ getHeader }}\r\n                        </div>\r\n                    </div>\r\n                    <div class="body-preview">\r\n                        \x3c!-- Template Line Text --\x3e\r\n                        <section *ngIf="isText || !isJSON" class="chat">\r\n                            <p class="body my-2" [innerHTML]="getBody"></p>\r\n                        </section>\r\n\r\n                        \x3c!-- Template Line Button | Confirmation --\x3e\r\n                        <section\r\n                            *ngIf="[\'buttons\', \'confirm\'].includes(getTemplateLine?.type)"\r\n                            class="chat"\r\n                            [ngClass]="{ \'no-bottom-border\': getTemplateLine?.actions?.length > 0 }"\r\n                        >\r\n                            <img\r\n                                *ngIf="getTemplateLine?.thumbnailImageUrl"\r\n                                style="max-width: 100%"\r\n                                class="mb-1"\r\n                                [src]="getTemplateLine?.thumbnailImageUrl"\r\n                            />\r\n\r\n                            <p\r\n                                *ngIf="getTemplateLine?.title"\r\n                                class="font-PoppinsBold mb-1"\r\n                                [innerHTML]="getTemplateLine?.title"\r\n                            ></p>\r\n\r\n                            <p\r\n                                *ngIf="getTemplateLine?.text"\r\n                                class="mb-0"\r\n                                [innerHTML]="getTemplateLine?.text"\r\n                            ></p>\r\n                        </section>\r\n\r\n                        \x3c!-- Template Line Carousel --\x3e\r\n                        <div\r\n                            *ngIf="[\'carousel\'].includes(getTemplateLine?.type)"\r\n                            class="d-flex gap-2 overflow-auto"\r\n                        >\r\n                            <div *ngFor="let column of getTemplateLine?.columns">\r\n                                <section\r\n                                    class="chat w-100"\r\n                                    [ngClass]="{ \'no-bottom-border\': column?.actions?.length > 0 }"\r\n                                >\r\n                                    <img\r\n                                        *ngIf="column.thumbnailImageUrl"\r\n                                        style="max-width: 100%"\r\n                                        class="mb-1"\r\n                                        [src]="column.thumbnailImageUrl"\r\n                                    />\r\n\r\n                                    <p\r\n                                        *ngIf="column.title"\r\n                                        class="font-PoppinsBold mb-1"\r\n                                        [innerHTML]="column.title"\r\n                                    ></p>\r\n\r\n                                    <p\r\n                                        *ngIf="column.text"\r\n                                        class="mb-0"\r\n                                        [innerHTML]="column.text"\r\n                                    ></p>\r\n                                </section>\r\n                                <section *ngIf="column?.actions?.length > 0">\r\n                                    <div\r\n                                        *ngFor="let button of column?.actions"\r\n                                        class="params-btn mw-100 pb-0 pointer"\r\n                                    >\r\n                                        <p class="mb-0">\r\n                                            {{ button?.text }}\r\n                                        </p>\r\n                                    </div>\r\n                                </section>\r\n                            </div>\r\n                        </div>\r\n\r\n                        \x3c!-- Template Line Image Carousel --\x3e\r\n                        <div\r\n                            *ngIf="[\'image_carousel\'].includes(getTemplateLine?.type)"\r\n                            class="d-flex gap-2 overflow-auto"\r\n                        >\r\n                            <div *ngFor="let column of getTemplateLine?.columns">\r\n                                <div class="image-container">\r\n                                    <img [src]="column.imageUrl" alt="image" />\r\n\r\n                                    <div class="d-flex justify-content-center">\r\n                                        <p class="font-13px overlay-text">\r\n                                            {{ column.action.label }}\r\n                                        </p>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n\r\n                        \x3c!-- Button Line --\x3e\r\n                        <section\r\n                            *ngIf="\r\n                                getTemplateLine?.type !== \'confirm\' &&\r\n                                getTemplateLine?.actions?.length > 0\r\n                            "\r\n                        >\r\n                            <div\r\n                                *ngFor="let button of getTemplateLine?.actions"\r\n                                class="params-btn pb-0 pointer"\r\n                            >\r\n                                <p class="mb-0">\r\n                                    {{ button?.text }}\r\n                                </p>\r\n                            </div>\r\n                        </section>\r\n                        <section\r\n                            *ngIf="\r\n                                getTemplateLine?.type === \'confirm\' &&\r\n                                getTemplateLine?.actions?.length > 0\r\n                            "\r\n                            class="d-flex justify-content-around mw-70 bg-white"\r\n                        >\r\n                            <div\r\n                                *ngFor="let button of getTemplateLine?.actions"\r\n                                class="params-btn flex pb-0 pointer"\r\n                            >\r\n                                <p class="mb-0">\r\n                                    {{ button?.text }}\r\n                                </p>\r\n                            </div>\r\n                        </section>\r\n                        \x3c!-- ./ Button Line --\x3e\r\n                    </div>\r\n                </section>\r\n            </div>\r\n\r\n            <div class="d-flex" style="flex-direction: column">\r\n                <span\r\n                    *ngIf="form.get(\'medium\').value === \'SMS\'"\r\n                    style="text-align: right; width: 100%"\r\n                >\r\n                    {{ twilioResultCounter.fulltext }}\r\n                </span>\r\n                <span\r\n                    style="text-align: right; width: 100%; color: red"\r\n                    *ngIf="twilioResultCounter.segments > 10 && form.get(\'medium\').value === \'SMS\'"\r\n                >\r\n                    Maximum Segment is 10\r\n                </span>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</form>\r\n\r\n<ng-template #isSpinner>\r\n    <div class="text-center my-auto">\r\n        <img src="../../../../../assets/images/spinner.svg" />\r\n    </div>\r\n</ng-template>\r\n',styles:['.campaign-info{display:flex}.campaign-info-child{flex:1}.campaign-info .asterix--after:after{content:"*";color:red}.campaign-info .pl-20px{padding-left:20px}.campaign-info .mw-70{max-width:70%}.campaign-info .campaign-preview{width:75%}.campaign-info .campaign-preview .header-preview{padding:15px;min-height:60px;border-radius:10px 10px 0 0}.campaign-info .campaign-preview .header-preview .heading{width:100%;color:#e0e0e0;margin-left:5px;font-size:20px}.campaign-info .campaign-preview .body-preview{padding:15px;min-height:470px}.campaign-info .campaign-preview .body-preview .chat{width:70%;padding:11px;font-size:14px;line-height:22px;color:#494949;border-radius:8px;background:#fff;overflow-wrap:break-word;white-space:pre-line;box-shadow:12px 12px 20px rgba(44,59,113,.04)}.campaign-info .campaign-preview .body-preview .chat .body{max-height:400px;overflow-y:auto;overscroll-behavior-y:contain}.campaign-info .campaign-preview .body-preview .chat.no-bottom-border{border-bottom-left-radius:0;border-bottom-right-radius:0}.campaign-info .campaign-preview__wa .header-preview{background:#065f54}.campaign-info .campaign-preview__wa .body-preview{border-bottom-left-radius:8px;border-bottom-right-radius:8px;background-image:url(../../../../../assets/svg/whatsapp-bg.svg);background-position:center;background-repeat:no-repeat;background-size:cover}.campaign-info .campaign-preview__wa .body-preview .params-btn{width:auto;max-width:70%;color:#34b7f1;background:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04);border-radius:0;font-size:16px;line-height:43px;padding:0;text-align:center;font-family:Poppins;overflow-wrap:break-word}.campaign-info .campaign-preview__wa .body-preview .params-btn b{font-family:PoppinsBold}.campaign-info .campaign-preview__line .header-preview{background:#273046}.campaign-info .campaign-preview__line .body-preview{background:#7692bf;border-bottom-left-radius:8px;border-bottom-right-radius:8px}.campaign-info .campaign-preview__line .body-preview .params-btn{width:auto;max-width:70%;color:#34b7f1;background:#fff;box-shadow:12px 12px 20px rgba(44,59,113,.04);border-radius:0;font-size:16px;line-height:43px;padding:0;text-align:center;font-family:Poppins;overflow-wrap:break-word}.campaign-info .campaign-preview__line .body-preview .params-btn b{font-family:PoppinsBold}.campaign-info .campaign-preview__line .body-preview .image-container{position:relative;width:200px;height:200px}.campaign-info .campaign-preview__line .body-preview .image-container img{display:block;width:100%;height:100%}.campaign-info .campaign-preview__line .body-preview .image-container .overlay-text{top:170px;position:absolute;padding:2px 5px;color:#fff;background-color:rgba(49,57,60,.62);border-radius:10px}.campaign-info .campaign-border-preview{width:100%;min-height:100px;padding:32px;border:1px solid #e2e2e2;border-radius:8px}']})],t)}(),se=function(){function t(t,n){this.apiAdapterService=t,this.toastr=n,this.isUpload=!1,this.isLoading=!1,this.isShowUploadCSV=!1,this.categorySelected=[],this.selection=new W.SelectionModel(!0,[]),this.extFileAccepted=["application/vnd.ms-excel","application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",".csv"],this.fileSelected=null,this.subscribers=[],this.targetAudience=new e.EventEmitter}return t.prototype.ngOnInit=function(){var t,e,n,a,r,i,o;this.categoryParam=new mt,this.initTable(),this.getCategoryList(),this.targetAudience.emit({targetAudience:[],numberCount:0,isUpload:null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.isUpload,file:{name:null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.targetAudienceFile)||void 0===r?void 0:r.name,targetURL:null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.targetAudienceFile)||void 0===o?void 0:o.targetURL}})},t.prototype.initTable=function(){this.table=new vt,this.table.labels=["select","Category","No. Of Customer","Created Date","Updated Date"],this.table.columns=["select","name","totalMembers","createdDate","updatedDate"]},Object.defineProperty(t.prototype,"getCampaignStorage",{get:function(){return localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{}},enumerable:!0,configurable:!0}),t.prototype.initEdit=function(){var t,e,n,a,r,i,o,l,s=this;0!==Object.entries(this.getCampaignStorage).length&&(this.isShowUploadCSV=null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.isUpload,this.fileSelected={name:null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.targetAudienceFile)||void 0===r?void 0:r.name,targetURL:null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.targetAudienceFile)||void 0===o?void 0:o.targetURL},null===(l=this.table.dataSource.data)||void 0===l||l.forEach((function(t){var e,n;(null===(n=null===(e=s.getCampaignStorage)||void 0===e?void 0:e.targetAudience)||void 0===n?void 0:n.includes(t.id))&&s.onChecked(!0,t)})))},t.prototype.getCategoryList=function(t){var e,n,a,r,i,o,l,s,d,m,c=this;void 0===t&&(t=""),this.isLoading=!0,this.isReadOnlyMode&&(this.categoryParam.pageSize=1e3);var p=[this.initParam("pageNo",this.categoryParam.pageNo,"number"),this.initParam("rowPerPage",this.categoryParam.pageSize,"number"),this.initParam("filter",t,"string"),this.initParam("platform",null===(a=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.generalInformation)||void 0===n?void 0:n.form)||void 0===a?void 0:a.medium,"string")];"LINE"===(null===(o=null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.generalInformation)||void 0===i?void 0:i.form)||void 0===o?void 0:o.medium)&&p.push(this.initParam("accountId",null===(m=null===(d=null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.generalInformation)||void 0===s?void 0:s.form)||void 0===d?void 0:d.from)||void 0===m?void 0:m.id,"string")),this.isReadOnlyMode&&p.push(this.initParam("summary",!0,"string"));var u=this.apiAdapterService.executeApiRequest(p,"/admin/category","GET").subscribe((function(t){var e;if(c.isReadOnlyMode)return c.table.dataSource.data=null===(e=t.data)||void 0===e?void 0:e.filter((function(t){var e,n;return null===(n=null===(e=c.getCampaignStorage)||void 0===e?void 0:e.targetAudience)||void 0===n?void 0:n.includes(t.id)})),c.categorySelected=c.table.dataSource.data,c.isLoading=!1,void c.initEdit();c.table.dataSource.data=t.data,c.table.setNextPage(t.haveNext),c.isLoading=!1,c.initEdit()}));this.subscribers.push(u)},t.prototype.initParam=function(t,e,n){return{name:t,value:e,in:"query",type:n}},t.prototype.updateSearch=function(t){this.table.resetPage(),this.categoryParam.pageNo=this.table.page,this.getCategoryList(t)},t.prototype.updatePage=function(t){var e,n,a,r;this.table.pageSize!==(null===(e=t)||void 0===e?void 0:e.pageSize)&&this.table.resetPage(),this.table.page=this.table.pageSize!==(null===(n=t)||void 0===n?void 0:n.pageSize)?this.table.page:(null===(a=t)||void 0===a?void 0:a.pageIndex)+1,this.table.pageSize=null===(r=t)||void 0===r?void 0:r.pageSize,this.categoryParam.pageNo=this.table.page,this.categoryParam.pageSize=this.table.pageSize,this.getCategoryList()},t.prototype.sort=function(){this.table.dataSource.sort=this.matSort},t.prototype.checkboxLabel=function(t){return t?(this.selection.isSelected(t)?"deselect":"select")+" row "+(t.name+1):(this.isAllSelected()?"deselect":"select")+" all"},t.prototype.isAllSelected=function(){var t,e,n,a,r=this.selection.selected.length,i=null!=(a=null===(n=this.table.dataSource.data)||void 0===n?void 0:n.length)?a:0;if(this.table.dataSource.data&&this.table.dataSource.data.length>0&&this.selection.selected&&this.selection.selected.length>0){var o=function(t){return l.selection.selected.filter((function(e){return e.id===t.id})).length>0?"continue":{value:!1}},l=this;try{for(var s=Y(this.table.dataSource.data),d=s.next();!d.done;d=s.next()){var m=o(d.value);if("object"==typeof m)return m.value}}catch(e){t={error:e}}finally{try{d&&!d.done&&(e=s.return)&&e.call(s)}finally{if(t)throw t.error}}}return r===i},t.prototype.masterToggle=function(t){var e,n,a,r,i,o,l,s,d;if(!t)return this.selection.clear(),this.categorySelected=[],void this.targetAudience.emit({targetAudience:[],numberCount:0,isUpload:this.isShowUploadCSV,file:{name:null===(a=null===(n=this.getCampaignStorage)||void 0===n?void 0:n.targetAudienceFile)||void 0===a?void 0:a.name,targetURL:null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.targetAudienceFile)||void 0===i?void 0:i.targetURL}});(e=this.selection).select.apply(e,X(this.table.dataSource.data)),this.categorySelected=this.selection.selected,this.targetAudience.emit({targetAudience:this.categorySelected.map((function(t){return t.id})),numberCount:this.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:this.isShowUploadCSV,file:{name:null===(l=null===(o=this.getCampaignStorage)||void 0===o?void 0:o.targetAudienceFile)||void 0===l?void 0:l.name,targetURL:null===(d=null===(s=this.getCampaignStorage)||void 0===s?void 0:s.targetAudienceFile)||void 0===d?void 0:d.targetURL}})},t.prototype.onChecked=function(t,e){var n,a,r,i,o,l,s,d,m;if(!t)return(n=this.selection).deselect.apply(n,X(this.selection.selected.filter((function(t){return t.id===e.id})))),this.categorySelected=this.selection.selected,void this.targetAudience.emit({targetAudience:this.categorySelected.map((function(t){return t.id})),numberCount:this.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:this.isShowUploadCSV,file:{name:null===(r=null===(a=this.getCampaignStorage)||void 0===a?void 0:a.targetAudienceFile)||void 0===r?void 0:r.name,targetURL:null===(o=null===(i=this.getCampaignStorage)||void 0===i?void 0:i.targetAudienceFile)||void 0===o?void 0:o.targetURL}});this.selection.select(e),this.categorySelected=this.selection.selected,this.targetAudience.emit({targetAudience:this.categorySelected.map((function(t){return t.id})),numberCount:this.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:this.isShowUploadCSV,file:{name:null===(s=null===(l=this.getCampaignStorage)||void 0===l?void 0:l.targetAudienceFile)||void 0===s?void 0:s.name,targetURL:null===(m=null===(d=this.getCampaignStorage)||void 0===d?void 0:d.targetAudienceFile)||void 0===m?void 0:m.targetURL}})},t.prototype.isChecked=function(t){return!!this.selection.selected.find((function(e){return e.id===t.id}))},t.prototype.onDownloadSampleService=function(){var t,e,n,a,r,i,o,l,s,d,m,c,p,u,g=[this.initParam("platform",null===(a=null===(n=null===(e=null===(t=this.getCampaignStorage)||void 0===t?void 0:t.generalInformation)||void 0===e?void 0:e.form)||void 0===n?void 0:n.template)||void 0===a?void 0:a.platform,"string"),this.initParam("templateName",null===(l=null===(o=null===(i=null===(r=this.getCampaignStorage)||void 0===r?void 0:r.generalInformation)||void 0===i?void 0:i.form)||void 0===o?void 0:o.template)||void 0===l?void 0:l.name,"string"),this.initParam("templateLang",null===(c=null===(m=null===(d=null===(s=this.getCampaignStorage)||void 0===s?void 0:s.generalInformation)||void 0===d?void 0:d.form)||void 0===m?void 0:m.template)||void 0===c?void 0:c.lang,"string"),this.initParam("category",(u=null===(p=this.categorySelected)||void 0===p?void 0:p.map((function(t){return t.id})).join(),null!=u?u:[]),"string")],f=this.apiAdapterService.executeApiRequest(g,"/message/bulkupload/template","GET",!0).subscribe((function(t){!function(t,e){void 0===e&&(e="file.csv");var n=URL.createObjectURL(t),a=document.createElement("a");a.href=n,a.download=e,document.body.appendChild(a),a.dispatchEvent(new MouseEvent("click",{bubbles:!0,cancelable:!0,view:window})),document.body.removeChild(a)}(t,"Sample-UploadParameter.xlsx")}));this.subscribers.push(f)},t.prototype.onFileSelected=function(t){var e=t.target.files;0!==e.length&&(e[0].size>31457280?this.toastr.error("Upload media failed, max size 30mb"):this.getPresignedUrlService(e[0]))},t.prototype.getPresignedUrlService=function(t){var e=this;this.isUpload=!0;var n=[{name:"fileName",value:t.name,in:"query",type:"string"},{name:"fileType",value:t.type,in:"query",type:"string"}],a=this.apiAdapterService.executeApiRequest(n,"/campaign/upload/pre-signed-url","GET").subscribe((function(n){n&&n.data&&e.uploadToS3Service(t,n.data.url,n.data.fileName)}),(function(){return e.isUpload=!1}));this.subscribers.push(a)},t.prototype.uploadToS3Service=function(t,e,n){var a=this;this.apiAdapterService.uploadFileToS3(e,t).subscribe((function(){a.finalizeTargetFileService(n)}),(function(t){a.toastr.error("Failed uploading to S3 storage"),a.isUpload=!1,console.error("S3 Upload Error:",t)}))},t.prototype.finalizeTargetFileService=function(t){var e,n,a=this,r=null===(n=null===(e=this.getCampaignStorage)||void 0===e?void 0:e.generalInformation)||void 0===n?void 0:n.id,i=[{name:"body",value:{fileName:t},in:"body",type:"object",withoutKeyData:!0}],o=this.apiAdapterService.executeApiRequest(i,"/campaign/"+r+"/targetfile","POST").subscribe((function(e){var n;e&&(a.toastr.info("Upload XLSX has been uploaded successfully"),a.isUpload=!1,a.targetAudience.emit({targetAudience:a.categorySelected.map((function(t){return t.id})),numberCount:a.categorySelected.reduce((function(t,e){return t+e.totalMembers}),0),isUpload:!0,file:{name:t,targetURL:(null===(n=e.data)||void 0===n?void 0:n.targetURL)||""}}))}),(function(){return a.isUpload=!1}));this.subscribers.push(o)},t.prototype.ngOnDestroy=function(){this.subscribers.forEach((function(t){return t.unsubscribe()}))},t.ctorParameters=function(){return[{type:ut},{type:s.ToastrService}]},J([e.Output()],t.prototype,"targetAudience",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),J([e.ViewChild(O.MatSort)],t.prototype,"matSort",void 0),t=J([e.Component({selector:"lib-new-number-bases",template:'<h3 class="font-20px font-PoppinsBold asterix--after mb-2"\r\n\t[ngClass]="{ \'mb-3\': !isReadOnlyMode }">\r\n\tTarget Audience\r\n</h3>\r\n<div *ngIf="!isReadOnlyMode"\r\n\tclass="d-flex justify-content-between">\r\n\t<p>Select your target audience (category)</p>\r\n\t<div *ngIf="isShowUploadCSV">\r\n\t\t<button mat-stroked-button\r\n\t\t\tcolor="primary-telin"\r\n\t\t\tclass="telin-font-color mr-2"\r\n\t\t\t(click)="onDownloadSampleService()">\r\n\t\t\tDownload Template\r\n\t\t</button>\r\n\r\n\t\t<button mat-flat-button\r\n\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t[disabled]="isUpload"\r\n\t\t\t(click)="filePicker.click()">\r\n\t\t\tUpload XLSX\r\n\t\t</button>\r\n\r\n\t\t<input #filePicker\r\n\t\t\thidden\r\n\t\t\ttype="file"\r\n\t\t\t[accept]="extFileAccepted.join()"\r\n\t\t\t(change)="onFileSelected($event)" />\r\n\t</div>\r\n</div>\r\n\r\n<p *ngIf="!isReadOnlyMode && (getCampaignStorage?.targetAudienceFile?.name ||\r\ngetCampaignStorage?.targetAudienceFile?.targetURL)"\r\n\tclass="text-right my-2">\r\n\t<span class="fw-bold">Filename:</span> {{ getCampaignStorage?.targetAudienceFile?.name ||\r\n\tgetCampaignStorage?.targetAudienceFile?.targetURL }}\r\n</p>\r\n\r\n<div *ngIf="!isReadOnlyMode || !fileSelected?.name"\r\n\tclass="row align-items-center mb-3">\r\n\t<div class="col-md-4 col-12">\r\n\t\t<lib-search *ngIf="!isReadOnlyMode"\r\n\t\t\t[placeholder]="\'Search\'"\r\n\t\t\t(searchRes)="updateSearch($event)"></lib-search>\r\n\t</div>\r\n\t<div class="col-md-8 col-12">\r\n\t\t<p class="text-right mb-0">\r\n\t\t\tCategory Selected:\r\n\t\t\t<span class="font-bold">\r\n\t\t\t\t{{ categorySelected?.length || 0 }}\r\n\t\t\t</span>\r\n\t\t</p>\r\n\t</div>\r\n</div>\r\n\r\n<ng-container *ngIf="!isReadOnlyMode || !fileSelected?.name; else isShowFile">\r\n\t<table *ngIf="!isLoading; else isSpinner"\r\n\t\tmat-table\r\n\t\tmatSort\r\n\t\tmatSortDisableClear\r\n\t\tclass="table w-100 mb-2"\r\n\t\t[dataSource]="table.dataSource"\r\n\t\t(matSortChange)="sort()">\r\n\t\t<ng-container matColumnDef="select">\r\n\t\t\t<th *matHeaderCellDef>\r\n\t\t\t\t<ng-container *ngIf="!isReadOnlyMode">\r\n\t\t\t\t\t<mat-checkbox [aria-label]="checkboxLabel()"\r\n\t\t\t\t\t\t[checked]="selection.hasValue() && isAllSelected()"\r\n\t\t\t\t\t\t[indeterminate]="selection.hasValue() && !isAllSelected()"\r\n\t\t\t\t\t\t(change)="masterToggle($event.checked)">\r\n\t\t\t\t\t</mat-checkbox>\r\n\t\t\t\t</ng-container>\r\n\t\t\t</th>\r\n\t\t\t<td *matCellDef="let row">\r\n\t\t\t\t<ng-container *ngIf="!isReadOnlyMode">\r\n\t\t\t\t\t<mat-checkbox [aria-label]="checkboxLabel(row)"\r\n\t\t\t\t\t\t[checked]="isChecked(row)"\r\n\t\t\t\t\t\t(change)="onChecked($event.checked, row)">\r\n\t\t\t\t\t</mat-checkbox>\r\n\t\t\t\t</ng-container>\r\n\t\t\t</td>\r\n\t\t</ng-container>\r\n\r\n\t\t<ng-container *ngFor="let index of [1, 2, 3, 4]"\r\n\t\t\t[matColumnDef]="table.columns[index]">\r\n\t\t\t<th *matHeaderCellDef\r\n\t\t\t\t[mat-sort-header]="table.columns[index]">\r\n\t\t\t\t{{ table.labels[index] }}\r\n\t\t\t</th>\r\n\r\n\t\t\t<td *matCellDef="let row">\r\n\t\t\t\t<ng-container *ngIf="[1, 2].includes(index)">\r\n\t\t\t\t\t{{ row[table.columns[index]] }}\r\n\t\t\t\t</ng-container>\r\n\t\t\t\t<ng-container *ngIf="[3, 4].includes(index)">\r\n\t\t\t\t\t{{ row[table.columns[index]] | date : \' d MMM y\' }}\r\n\t\t\t\t</ng-container>\r\n\t\t\t</td>\r\n\t\t</ng-container>\r\n\r\n\t\t<ng-container matColumnDef="no-content">\r\n\t\t\t<th class="text-center"\r\n\t\t\t\t*matHeaderCellDef\r\n\t\t\t\t[colSpan]="table.columns.length">\r\n\t\t\t\tData Not Available\r\n\t\t\t</th>\r\n\t\t</ng-container>\r\n\r\n\t\t<tr mat-header-row\r\n\t\t\t*matHeaderRowDef="table.columns"></tr>\r\n\r\n\t\t<tr mat-header-row\r\n\t\t\tclass="no-content"\r\n\t\t\t*matHeaderRowDef="[\'no-content\']"\r\n\t\t\t[style.display]="table.dataSource?.data?.length === 0 ? \'table-row\' : \'none\'"></tr>\r\n\r\n\t\t<tr mat-row\r\n\t\t\t*matRowDef="let row; columns: table.columns"></tr>\r\n\t</table>\r\n\r\n\t<mat-paginator *ngIf="!isReadOnlyMode"\r\n\t\tclass="campaign-paginator"\r\n\t\t[length]="table.totalData"\r\n\t\t[pageSize]="table.pageSize"\r\n\t\t[pageIndex]="table.getPageIndex()"\r\n\t\t[pageSizeOptions]="[10, 25, 50, 100, 250]"\r\n\t\t(page)="updatePage($event)"></mat-paginator>\r\n\r\n\t<ng-template #isSpinner>\r\n\t\t<div class="text-center my-auto">\r\n\t\t\t<img src="../../../../../assets/images/spinner.svg" />\r\n\t\t</div>\r\n\t</ng-template>\r\n</ng-container>\r\n\r\n<ng-template #isShowFile>\r\n\t<p class="font-PoppinsBold font-14px">\r\n\t\tFile: <a [href]="fileSelected?.targetURL"\r\n\t\t\ttarget="_blank">{{ fileSelected?.name }}</a>\r\n\t</p>\r\n</ng-template>\r\n',styles:["::ng-deep .mat-paginator.campaign-paginator .mat-paginator-container{align-items:normal}::ng-deep .mat-paginator.campaign-paginator .mat-tab-body{background-color:#fff}::ng-deep .mat-paginator.campaign-paginator .mat-form-field-underline{bottom:0}"]})],t)}(),de=function(){function t(t){this.toastr=t,this.datePipe=new a.DatePipe("en-US"),this.scheduler=new e.EventEmitter}return t.prototype.ngOnInit=function(){this.validationMessages=Rt,this.minDate=new Date,this.initForm(),this.initEdit(),this.initDisable()},t.prototype.initForm=function(){var t=this;this.form=new m.FormGroup({schedulerType:new m.FormControl(null,m.Validators.required),startDate:new m.FormControl(null),startTime:new m.FormControl(null),isRepeat:new m.FormControl(!1),delivery:new m.FormControl(null)}),this.form.valueChanges.subscribe((function(){t.scheduler.emit(t.form)}))},t.prototype.initDisable=function(){this.isReadOnlyMode&&this.form.disable()},t.prototype.initEdit=function(t){var e,n,a,r,i,o,l,s,d,m;void 0===t&&(t=!0);var c=localStorage.getItem("telin.campaign")?JSON.parse(localStorage.getItem("telin.campaign")):{};0!==Object.entries(c).length&&(t&&this.form.get("schedulerType").setValue(null===(n=null===(e=c)||void 0===e?void 0:e.scheduler)||void 0===n?void 0:n.schedulerType),this.form.get("startDate").setValue(null===(r=null===(a=c)||void 0===a?void 0:a.scheduler)||void 0===r?void 0:r.startDate),this.form.get("startTime").setValue(null===(o=null===(i=c)||void 0===i?void 0:i.scheduler)||void 0===o?void 0:o.startTime),this.form.get("isRepeat").setValue(null===(s=null===(l=c)||void 0===l?void 0:l.scheduler)||void 0===s?void 0:s.isRepeat),this.form.get("delivery").setValue(this.capitalizeFirstLetter(null===(m=null===(d=c)||void 0===d?void 0:d.scheduler)||void 0===m?void 0:m.delivery)))},t.prototype.capitalizeFirstLetter=function(t){var e,n,a;return t?null!=(a=(null===(e=t)||void 0===e?void 0:e.charAt(0).toUpperCase())+(null===(n=t)||void 0===n?void 0:n.slice(1).toLowerCase()))?a:"":""},t.prototype.updateSchedulerType=function(t){if(this.form.get("schedulerType").setValue(t),"NOW"===this.form.get("schedulerType").value)return this.form.get("startDate").setValue(null),this.form.get("startDate").clearValidators(),this.form.get("startDate").updateValueAndValidity(),this.form.get("startTime").setValue(null),this.form.get("startTime").clearValidators(),this.form.get("startTime").updateValueAndValidity(),this.form.get("delivery").setValue(null),this.form.get("delivery").clearValidators(),this.form.get("delivery").updateValueAndValidity(),void this.form.get("isRepeat").setValue(!1);this.form.get("startDate").setValidators(m.Validators.required),this.form.get("startDate").updateValueAndValidity(),this.form.get("startTime").setValidators(m.Validators.required),this.form.get("startTime").updateValueAndValidity(),this.initEdit(!1)},t.prototype.updateTime=function(){this.form.get("startDate").value&&((new Date).getTime()>new Date(this.datePipe.transform(this.form.get("startDate").value,"yyyy-MM-dd")+" "+this.form.get("startTime").value).getTime()&&(this.form.get("startTime").setValue(null),this.toastr.error("Selected time has been surpassed")))},t.prototype.updateRepeat=function(t){if(t)return this.form.get("delivery").setValidators(m.Validators.required),void this.form.get("delivery").updateValueAndValidity();this.form.get("isRepeat").setValue(null),this.form.get("delivery").setValue(null),this.form.get("delivery").clearValidators(),this.form.get("delivery").updateValueAndValidity()},t.ctorParameters=function(){return[{type:s.ToastrService}]},J([e.Output()],t.prototype,"scheduler",void 0),J([e.Input()],t.prototype,"isReadOnlyMode",void 0),t=J([e.Component({selector:"lib-new-campaign-scheduler",template:'<h3 class="font-20px font-PoppinsBold mb-4"\r\n\t[ngClass]="{ \'asterix--after\': !isReadOnlyMode }">\r\n\tScheduler\r\n</h3>\r\n\r\n<form [formGroup]="form"\r\n\tautocomplete="off"\r\n\tclass="scheduler">\r\n\t<div class="d-flex gap-4">\r\n\t\t<mat-card class="grid-cards pointer"\r\n\t\t\t[ngClass]="{\r\n        active: form.get(\'schedulerType\').value === \'NOW\',\r\n        \'d-none\': form.get(\'schedulerType\').value !== \'NOW\' && isReadOnlyMode\r\n      }"\r\n\t\t\t(click)="updateSchedulerType(\'NOW\')">\r\n\t\t\t<mat-card-title>\r\n\t\t\t\t<div class="d-flex justify-content-between align-items-center">\r\n\t\t\t\t\t<div class="font-16px font-PoppinsBold">Broadcast Now</div>\r\n\r\n\t\t\t\t\t<mat-radio-button *ngIf="!isReadOnlyMode"\r\n\t\t\t\t\t\tclass="scheduler-type"\r\n\t\t\t\t\t\t[checked]="form.get(\'schedulerType\').value === \'NOW\'"\r\n\t\t\t\t\t\t(click)="updateSchedulerType(\'NOW\')">\r\n\t\t\t\t\t</mat-radio-button>\r\n\t\t\t\t</div>\r\n\t\t\t</mat-card-title>\r\n\t\t\t<mat-card-content class="mb-0">\r\n\t\t\t\t<img src="../../../../../assets/svg/broadcast-now.svg" />\r\n\t\t\t</mat-card-content>\r\n\t\t\t<mat-card-actions>\r\n\t\t\t\t<p class="px-2 py-3 mb-0">\r\n\t\t\t\t\tBroadcast now to ensure the message is delivered directly to the customer!\r\n\t\t\t\t</p>\r\n\t\t\t</mat-card-actions>\r\n\t\t</mat-card>\r\n\r\n\t\t<mat-card class="grid-cards pointer"\r\n\t\t\t[ngClass]="{\r\n        active: form.get(\'schedulerType\').value === \'ONE_TIME\',\r\n        \'d-none\': form.get(\'schedulerType\').value !== \'ONE_TIME\' && isReadOnlyMode\r\n      }"\r\n\t\t\t(click)="updateSchedulerType(\'ONE_TIME\')">\r\n\t\t\t<mat-card-title>\r\n\t\t\t\t<div class="d-flex justify-content-between align-items-center">\r\n\t\t\t\t\t<div class="font-16px font-PoppinsBold">Frequently Scheduler</div>\r\n\r\n\t\t\t\t\t<mat-radio-button *ngIf="!isReadOnlyMode"\r\n\t\t\t\t\t\tclass="scheduler-type"\r\n\t\t\t\t\t\t[checked]="form.get(\'schedulerType\').value === \'ONE_TIME\'"\r\n\t\t\t\t\t\t(click)="updateSchedulerType(\'ONE_TIME\')">\r\n\t\t\t\t\t</mat-radio-button>\r\n\t\t\t\t</div>\r\n\t\t\t</mat-card-title>\r\n\t\t\t<mat-card-content class="mb-0">\r\n\t\t\t\t<img src="../../../../../assets/svg/broadcast-schedule.svg" />\r\n\t\t\t</mat-card-content>\r\n\t\t\t<mat-card-actions>\r\n\t\t\t\t<p class="px-2 py-3 mb-0">\r\n\t\t\t\t\tCreate a broadcast schedule and organize it based on your needs, with a date range.\r\n\t\t\t\t</p>\r\n\t\t\t</mat-card-actions>\r\n\t\t</mat-card>\r\n\t</div>\r\n\r\n\t<ng-container *ngIf="form.get(\'schedulerType\').value === \'ONE_TIME\'">\r\n\t\t<p class="font-14px font-PoppinsBold asterix--after py-3 mb-0">Select Date and Time</p>\r\n\r\n\t\t<div class="row mb-3">\r\n\t\t\t<div class="col-md-3 col-12">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="w-100">\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\tclass="mat-datepicker-input"\r\n\t\t\t\t\t\tplaceholder="Select Date"\r\n\t\t\t\t\t\tformControlName="startDate"\r\n\t\t\t\t\t\t[min]="minDate"\r\n\t\t\t\t\t\t[matDatepicker]="startDatePicker"\r\n\t\t\t\t\t\t(dateChange)="updateTime()" />\r\n\r\n\t\t\t\t\t<mat-datepicker-toggle class="scheduler-date-toggle"\r\n\t\t\t\t\t\tmatSuffix\r\n\t\t\t\t\t\t[for]="startDatePicker">\r\n\t\t\t\t\t\t<mat-icon class="d-flex"\r\n\t\t\t\t\t\t\tsvgIcon="icon-date-grey"\r\n\t\t\t\t\t\t\tmatDatepickerToggleIcon></mat-icon>\r\n\t\t\t\t\t</mat-datepicker-toggle>\r\n\t\t\t\t\t<mat-datepicker #startDatePicker></mat-datepicker>\r\n\t\t\t\t</mat-form-field>\r\n\r\n\t\t\t\t<mat-error align="end"\r\n\t\t\t\t\t*ngFor="let validation of validationMessages.startDate">\r\n\t\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t\t*ngIf="form.get(\'startDate\').touched && form.get(\'startDate\').hasError(validation.type)">\r\n\t\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t\t</p>\r\n\t\t\t\t</mat-error>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div class="col-md-3 col-12">\r\n\t\t\t\t<mat-form-field appearance="outline"\r\n\t\t\t\t\tfloatLabel="always"\r\n\t\t\t\t\tclass="scheduler-time">\r\n\t\t\t\t\t<input matInput\r\n\t\t\t\t\t\ttype="time"\r\n\t\t\t\t\t\tstep="1"\r\n\t\t\t\t\t\tmin="00:00"\r\n\t\t\t\t\t\tmax="23:59"\r\n\t\t\t\t\t\tformControlName="startTime"\r\n\t\t\t\t\t\tclass="scheduler-time-input"\r\n\t\t\t\t\t\tplaceholder="Select Time"\r\n\t\t\t\t\t\t(change)="updateTime()" />\r\n\t\t\t\t</mat-form-field>\r\n\r\n\t\t\t\t<mat-error align="end"\r\n\t\t\t\t\t*ngFor="let validation of validationMessages.startTime">\r\n\t\t\t\t\t<p class="font-12px mb-0"\r\n\t\t\t\t\t\t*ngIf="form.get(\'startTime\').touched && form.get(\'startTime\').hasError(validation.type)">\r\n\t\t\t\t\t\t{{ validation.message }}\r\n\t\t\t\t\t</p>\r\n\t\t\t\t</mat-error>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\r\n\t\t<mat-slide-toggle class="repeat-broadcast mb-3"\r\n\t\t\tformControlName="isRepeat"\r\n\t\t\t(change)="updateRepeat($event.checked)">\r\n\t\t\t<p class="font-14px font-PoppinsBold mb-0">Repeat Broadcast</p>\r\n\t\t</mat-slide-toggle>\r\n\r\n\t\t<ng-container *ngIf="form.get(\'isRepeat\').value">\r\n\t\t\t<p class="font-14px">The broadcast will be repeat based on the date and time you select</p>\r\n\r\n\t\t\t<div class="row">\r\n\t\t\t\t<div class="col-12">\r\n\t\t\t\t\t<div class="d-flex gap-2">\r\n\t\t\t\t\t\t<ng-container *ngFor="let item of [\'Daily\', \'Weekly\', \'Monthly\']">\r\n\t\t\t\t\t\t\t<button *ngIf="form.get(\'delivery\').value !== item"\r\n\t\t\t\t\t\t\t\tmat-stroked-button\r\n\t\t\t\t\t\t\t\tstyle="min-width: 80px"\r\n\t\t\t\t\t\t\t\t[disabled]="isReadOnlyMode"\r\n\t\t\t\t\t\t\t\t(click)="form.get(\'delivery\').setValue(item)">\r\n\t\t\t\t\t\t\t\t{{ item }}\r\n\t\t\t\t\t\t\t</button>\r\n\r\n\t\t\t\t\t\t\t<button *ngIf="form.get(\'delivery\').value === item"\r\n\t\t\t\t\t\t\t\tmat-flat-button\r\n\t\t\t\t\t\t\t\tcolor="primary-telin-blue2"\r\n\t\t\t\t\t\t\t\tstyle="min-width: 80px"\r\n\t\t\t\t\t\t\t\t[disabled]="isReadOnlyMode"\r\n\t\t\t\t\t\t\t\t(click)="form.get(\'delivery\').setValue(item)">\r\n\t\t\t\t\t\t\t\t{{ item }}\r\n\t\t\t\t\t\t\t</button>\r\n\t\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</form>\r\n',styles:['.scheduler .grid-cards{width:280px;padding:1em;border:1px solid #e2e2e2;border-radius:10px;box-shadow:none}.scheduler .grid-cards.active{background-color:#f8fbff;border:1px solid #4285f4}.scheduler .alert-primary{height:52px;display:flex;align-items:center;background-color:#f3f7fd;border-color:#1369eb;border-radius:8px;color:#231f20}.scheduler .scheduler-time-input::-webkit-calendar-picker-indicator{width:24px;height:24px;margin-top:-5px;filter:invert(43%) sepia(6%) saturate(188%) hue-rotate(187deg) brightness(97%) contrast(93%)}.asterix--after:after{content:"*";color:red}::ng-deep .mat-radio-button.scheduler-type.mat-radio-checked .mat-radio-outer-circle{border-color:#4285f4}::ng-deep .mat-radio-button.scheduler-type.mat-radio-checked .mat-radio-inner-circle{background-color:#4285f4}::ng-deep .mat-datepicker-toggle.scheduler-date-toggle .mat-icon-button{display:flex!important}::ng-deep .mat-datepicker-toggle.scheduler-date-toggle .mat-icon-button .mat-icon{height:100%}::ng-deep .mat-form-field.scheduler-time .mat-form-field-infix{padding:.8em 0}::ng-deep .mat-slide-toggle.repeat-broadcast .mat-slide-toggle-bar{width:40px;height:20px;border-radius:13px}::ng-deep .mat-slide-toggle.repeat-broadcast .mat-slide-toggle-thumb-container{width:18px;height:18px;top:1px;left:1px}::ng-deep .mat-slide-toggle.repeat-broadcast .mat-slide-toggle-thumb{width:18px;height:18px;border-radius:50%}::ng-deep .mat-slide-toggle.repeat-broadcast.mat-checked .mat-slide-toggle-bar{background-color:#2bca3b}::ng-deep .mat-slide-toggle.repeat-broadcast.mat-checked .mat-slide-toggle-thumb-container{left:4px}::ng-deep .mat-slide-toggle.repeat-broadcast.mat-checked .mat-slide-toggle-thumb{background-color:#fff}']})],t)}(),me=function(){function t(){}return J([e.Input()],t.prototype,"isShowLabel",void 0),t=J([e.Component({selector:"lib-new-campaign-summary",template:'<h3 *ngIf="!isShowLabel"\r\n\tclass="font-20px font-PoppinsBold asterix--after mb-4">Summary</h3>\r\n\r\n<div class="mb-4">\r\n\t<lib-new-campaign-general-information [isReadOnlyMode]="true">\r\n\t</lib-new-campaign-general-information>\r\n</div>\r\n\r\n<div class="mb-4">\r\n\t<lib-new-number-bases [isReadOnlyMode]="true"></lib-new-number-bases>\r\n</div>\r\n\r\n<lib-new-campaign-scheduler [isReadOnlyMode]="true"></lib-new-campaign-scheduler>\r\n',styles:[""]})],t)}(),ce=function(){function t(){this.positionWizard=1,this.dataWizard=[]}return t.prototype.ngOnInit=function(){},J([e.Input()],t.prototype,"positionWizard",void 0),J([e.Input()],t.prototype,"dataWizard",void 0),t=J([e.Component({selector:"lib-wizard",template:"<div *ngFor=\"let name of dataWizard; let i = index;\"\r\n\tstyle=\"flex-direction: row; display: flex;\">\r\n\t<div [ngClass]=\"{\r\n\t\t\t\t'circle-active': positionWizard === i + 1,\r\n\t\t\t\t'circle-success': positionWizard > i + 1,\r\n\t\t\t\t'circle-inactive': positionWizard < i + 1\r\n\t\t\t}\">\r\n\t\t<span [ngClass]=\"{\r\n\t\t\t\t'number-active': positionWizard === i + 1,\r\n\t\t\t\t'number-success': positionWizard > i + 1,\r\n\t\t\t\t'number-inactive': positionWizard < i + 1\r\n\t\t\t}\">\r\n\t\t\t{{ i + 1 }}\r\n\t\t</span>\r\n\t</div>\r\n\t<div style=\"align-self: center;\"\r\n\t\tclass=\"ml-2\">\r\n\t\t<span [ngClass]=\"{\r\n\t\t\t\t'active-text': positionWizard === i + 1,\r\n\t\t\t\t'success-text': positionWizard > i + 1,\r\n\t\t\t\t'inactive-text': positionWizard < i + 1\r\n\t\t\t}\">\r\n\t\t\t{{ name }}\r\n\t\t</span>\r\n\t</div>\r\n\t<div *ngIf=\"i + 1 !== dataWizard.length\"\r\n\t\t[ngClass]=\"{\r\n\t\t\t'line': positionWizard < i + 2,\r\n\t\t\t'line-active': positionWizard === i + 2,\r\n\t\t\t'line-complete': positionWizard > i + 2,\r\n\t\t\t'w-50px': dataWizard.length === 5\r\n\t\t}\"></div>\r\n</div>\r\n",styles:[".active-text{font-family:Poppins;font-style:normal;font-weight:500}.success-text{font-family:Poppins;font-style:normal}.inactive-text{color:#848484}.circle-active{padding:9px 16px;border-radius:50%;background-color:#ed1c24}.circle-success{padding:9px 16px;border-radius:50%;background-color:#2bca3b}.circle-inactive{padding:9px 16px;border-radius:50%;background-color:#dde0e2}.number-inactive{color:#848484}.number-success{color:#fff}.number-active{color:#fff;font-family:PoppinsBold}.line{border-bottom:1px solid #e2e2e2;width:120px;position:relative;bottom:20px;margin:0 20px}.line.w-50px{width:50px}.line-complete{border-bottom:1px solid #2bca3b;width:120px;position:relative;bottom:20px;margin:0 20px}.line-active{border-bottom:1px solid #ed1c24;width:120px;position:relative;bottom:20px;margin:0 20px}.line-section{border-bottom:1px solid #dbdfeb;display:flex;position:relative;width:103.2%;right:1.6%}"]})],t)}(),pe=function(){function t(){}return t=J([e.NgModule({declarations:[it,ce,Qt,le,de,me,se,ee,ie,ne,te,Wt,oe],imports:[a.CommonModule,n.AgmCoreModule.forRoot({apiKey:"AIzaSyCHReBe_RpzAgLTrUC5QIDyeKttQ817wRY",libraries:["places"]}),Jt,c.MatAutocompleteModule,m.FormsModule,m.ReactiveFormsModule,b.MatFormFieldModule,S.MatInputModule,T.MatSelectModule,I.MatRadioModule,w.MatListModule,u.MatButtonModule,l.NgxEchartsModule.forRoot({echarts:L}),x.MatIconModule,M.PickerModule,N.AngularEditorModule,v.MatDialogModule,P.MatTabsModule,p.MatBadgeModule,D.NgbDropdownModule,D.NgbPaginationModule,i.MatCardModule,V.MatTableModule,g.MatCheckboxModule,o.MatPaginatorModule,y.MatGridListModule,f.MatDatepickerModule,O.MatSortModule,et,h.MatDividerModule,C.MatProgressSpinnerModule,A.MatSlideToggleModule,d.DragDropModule,Gt,lt],exports:[it,me],entryComponents:[Wt],providers:[a.DatePipe]})],t)}(),ue=function(){function t(){}return t=J([e.NgModule({declarations:[Q],imports:[a.CommonModule,n.AgmCoreModule.forRoot({apiKey:"AIzaSyCHReBe_RpzAgLTrUC5QIDyeKttQ817wRY",libraries:["places"]}),pe,l.NgxEchartsModule,i.MatCardModule,r.HttpClientModule,s.ToastrModule.forRoot()],exports:[Q],providers:[{provide:o.MatPaginatorIntl,useClass:Bt}]})],t)}(),ge=function(){function t(){}return t=J([e.NgModule({declarations:[Ht],imports:[a.CommonModule,v.MatDialogModule,u.MatButtonModule],exports:[Ht]})],t)}();t.AdlCampaignManagementLibraryInternalComponent=Q,t.AdlCampaignManagementLibraryInternalModule=ue,t.CampaignIndexModule=Gt,t.CampaignManagementComponent=it,t.CampaignManagementModule=pe,t.ConfirmationComponent=Ht,t.ConfirmationModule=ge,t.DashboardModule=Jt,t.SearchModule=et,t.ɵa=ce,t.ɵb=Qt,t.ɵc=le,t.ɵd=de,t.ɵe=me,t.ɵf=se,t.ɵg=ee,t.ɵh=ie,t.ɵi=ne,t.ɵj=te,t.ɵk=Wt,t.ɵl=oe,t.ɵm=$t,t.ɵn=ut,t.ɵo=tt,t.ɵp=_t,t.ɵq=Ut,t.ɵr=ht,t.ɵs=ut,t.ɵt=st,t.ɵu=lt,t.ɵv=ot,t.ɵw=Bt,t.ɵx=Ht,t.ɵy=jt,t.ɵz=zt,Object.defineProperty(t,"__esModule",{value:!0})}));
 //# sourceMappingURL=adlfe-campaign-management-library.umd.min.js.map