[ANGULAR] how to change eventstyle after event modifiction by drag or event window
Posted: Fri Jan 15, 2021 5:35 pm
by plus
When I load my data I use rounded eventstyle. Wht I wish to do is to change eventstyle after modification
What is the right way o obtain this result? I tried to change style in evenstore events, I do this because I have to change a filed in my table (modified true/false)
Maybe, I have to use beforeEventDropFinalize?
In beforeEventDropFinalize I tried to use repaintEventsForResource ma doesn'twork
The strange thing is that when I call repaintEventsForResource eventStyle is 'plain' (as i want)
I suppose that I have to use eventrender but this event is raised only when I load my data for the first time not when I change a data
Do you have any suggest?
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
Posted: Fri Jan 15, 2021 7:07 pm
by pmiklashevich
You can extend the EventModel and implement getter and setter for the eventStyle field. Please try it in the Basic demo (non-angular demo, but the same is true for angular):
Scheduler/examples/basic/app.js
import EventModel from '../../lib/Scheduler/model/EventModel.js';
class StyledEventModel extends EventModel {
static get $name() {
return 'StyledEventModel';
}
get eventStyle() {
return super.eventStyle || (this.isModified ? 'line' : 'rounded');
}
set eventStyle(style) {
super.eventStyle = style;
}
}
.....
const scheduler = new Scheduler({
appendTo : 'container',
minHeight : '20em',
resources : resources,
//events : events,
eventStore : {
modelClass : StyledEventModel,
data : events
},
Cheers!
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
Posted: Tue Jan 19, 2021 4:27 pm
by plus
I tried your code but I have this error (view attachment)
(property) StyledEventModel.eventStyle: string
'eventStyle' is defined as a property in class 'EventModel', but is overridden here in 'StyledEventModel' as an accessor.ts(2611)
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
Posted: Tue Jan 19, 2021 5:54 pm
by pmiklashevich
What angular/typescript version are you using? I don't see this error in our Angular Basic demo. But the error message looks correct. Since you know that you override a field which is declared as a property on the EventModel, you can try to suppress the error.
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
class StyledEventModel extends EventModel {
static get $name(): string {
return 'StyledEventModel';
}
// @ts-ignore
get eventStyle(): string {
return this.isModified ? 'line' : 'rounded';
}
}
We will investigate how we can improve typings to prevent similar errors in the future.
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
Posted: Wed Jan 20, 2021 3:39 pm
by plus
Thank for your reply, I used // @ts-nocheck and this solved
Now works, but there si another small problem..
I can see eventstyle change only if I move the bottom scroolbar.
initial situation (01.png)
I move an event and I want change eventstyle and use stack position but doesn't change (02.png)
I move the scroolbar in the bottom and everything is as I want (03.png)
The sideeffect is that this resolve another problem I wrote in another post (When I drag event abobe another I wish stack but this doesn't work if I handle beforeEventDropFinalize)
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
Posted: Wed Jan 20, 2021 3:45 pm
by pmiklashevich
Please try to use another approach. Instead of overriding the EventModel property, please define eventRenderer function and set the eventStyle there:
Re: [ANGULAR] how to change eventstyle after event modifiction by drag or event window
Posted: Wed Jan 20, 2021 5:32 pm
by plus
This work in the same way. I prefere this solution but also in this case, I see the right result only after click on scroolbar
How can I force or call a render action?