my bad. to change theme dynamically Mehant suppgest below code line. this.store.dispatch(new SetStyle(3)); but i didn't work for me. Also is there any way to change Button css for particular theme and it applies for all the button.
I imported Service and Model in app.component.ts
this.brandSettingsService.getById(this.id).toPromise().then((data : any) => { this.brandSetting = data; });
if (res instanceof SetTenant) {
//console.log(res.payload) // logs new tenant e.g. {id: '6391bd36-d4b1-8a22-5fd6-39f461b01b37', name: 'Amazon'}
document.documentElement.style.setProperty(
'--logo',
`url('`+ this.brandSetting.brandLogoPath + `')`,
);
document.documentElement.style.setProperty(
'--logo-reverse',
`url('`+ this.brandSetting.brandLogoPath + `')`,
);
}
got unauthorized error. how can i call the service without login to system.
core.js:6185 ERROR Error: Uncaught (in promise): HttpErrorResponse: {"headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"status":401,"statusText":"Unauthorized","url":"https://localhost:44369/api/app/brandSetting/B612C372-953D-107B-DCA5-39F468142176","ok":false,"name":"HttpErrorResponse","message":"Http failure response for https://localhost:44369/api/app/brandSetting/B612C372-953D-107B-DCA5-39F468142176: 401 Unauthorized","error":null}
Yes, it is working now for me. can you tell me how to set the theme for tenant dynamically just the same way logo setting here.
Yes. I dont see below console log.
console.log(res.payload) // logs new tenant e.g. {id: '6391bd36-d4b1-8a22-5fd6-39f461b01b37', name: 'Amazon'}
Yes. here is the sample code.
this.actions.pipe(ofActionSuccessful(SetStyle, SetTenant)).subscribe((res) => {
console.log(this.store.selectSnapshot(SessionState.getTenant)) // logs current tenant
if (res instanceof SetStyle) {
console.log(res.payload) // logs style number e.g. 1
document.documentElement.style.setProperty(
'--logo',
`url('http://abp.io/assets/abp-logo-light.svg')`,
);
document.documentElement.style.setProperty(
'--logo-reverse',
`url('http://abp.io/assets/abp-logo-light.svg')`,
);
}
else if (res instanceof SetTenant) {
console.log(res.payload) // logs new tenant e.g. {id: '6391bd36-d4b1-8a22-5fd6-39f461b01b37', name: 'Amazon'}
document.documentElement.style.setProperty(
'--logo',
`url('../assets/images/logo/tenant.png')`,
);
document.documentElement.style.setProperty(
'--logo-reverse',
`url('../assets/images/logo/tenant.png')`,
);
}
});
}
Hi In my case, SetTenant instance event not occurring after tenant switch hence below code is out of reach.
else if (res instanceof SetTenant) { console.log(res.payload) // logs new tenant e.g. {id: '6391bd36-d4b1-8a22-5fd6-39f461b01b37', name: 'Amazon'} // your logic here }
Thanks. 2nd approch looks good for me but it applies to all theme. How to set Logo css propetry for specifc Theme and specifc Tenant.