Hello
I want to filter Resource on Schedule(TabPanel) when checked value of CheckBox on Panel
My code is below.
Please advice me.
import {
SchedulerPro,
StringHelper,
TabPanel,
Checkbox,
Store,
Panel
} from './node_modules/@bryntum/schedulerpro/schedulerpro.module.js';
const panel = new Panel({
title: 'DP-Variation',
appendTo: 'nav',
items: {
dp3check: {
type: 'checkBox',
text: 'DP-3',
onClick: (value) => {
//alert(value.source.initialConfig.text);
value = value.source.initialConfig.text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
SchedulerProDPVariation.projectStores.eventStore.filter({
filters: event => new RegExp(value, 'i').test(event.name),
replace: true
});
},
autoUpdateRecord: true
},
dp3Xcheck: {
type: 'checkBox',
text: 'A'
},
dp4check: {
type: 'checkBox',
text: 'B'
}
},
onFilterChange({
value
}) {
value = this.text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
// value = value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
// Replace all previous filters and set a new filter
SchedulerProDPVariation.eventStore.filter({
filters: event => new RegExp(value, 'i').test(event.name),
replace: true
});
}
});
class SchedulerProDPVariation extends SchedulerPro {
construct() {
super.construct(...arguments);
}
static get $name() {
return 'SchedulerProDPVariation'
}
static get type() {
return 'schedulerprodpVariation'
}
// static resourceData(value) {
// this.configurable.project.resourcesData = value;
// this.onEquipmentStoreLoad();
// }
static get configurable() {
return {
startDate: new Date(2022, 0, 1),
endDate: new Date(2028, 0, 12),
features: {
// Enable the feature
filter: true
},
presets: [
{
base: 'hourAndDay',
id: 'MyHourAndDay',
// other preset configs....
},
{
base: 'weekAndMonth',
id: 'MyWeekAndMonth',
// other preset configs....
},
{
base: 'year',
id: 'MyYear',
},
{
base: 'manyYears',
id: 'MyManyYears',
}
],
viewPreset: 'MyManyYears',
// other scheduler configs....
resourceStore : {
fields : ['name', 'siteDL', 'siteA', 'siteB', 'siteC', 'region'],
data : [
{
id: 1,
region: 'JP',
name: 'A',
siteDL: 'aaa',
siteA: 'bbb',
siteB: 'abc',
siteC: 'def'
},
{
id: 2,
region: 'US',
name: 'B',
siteDL: 'dddd',
siteA: 'ccc',
siteB: 'adss',
siteC: 'asds'
}
]
},
project: {
eventsData: [
{id: 1, startDate: '2022-01-01', duration: 3, durationUnit: 'y', name: 'Event 1'},
{id: 2, startDate: '2024-01-01', duration: 5, durationUnit: 'y', name: 'Event 2'}
],
assignmentsData: [
{event: 1, resource: 1},
{event: 2, resource: 2}
],
dependenciesData: [
{fromEvent: 1, toEvent: 2}
]
},
columns: [
{text: 'DP Validation', field: 'name', width: 100},
{
text: 'Site', align: 'center', autoWidth: true, children: [
{
field: 'siteDL',
text: 'DL',
autoWidth: true
},
{
field: 'siteA',
text: 'SA',
autoWidth: true
},
{
field: 'siteB',
text: 'SB',
autoWidth: true
},
{
field: 'siteC',
text: 'SC',
autoWidth: true
}
]
},
{text: 'Region', field: 'region', autoWidth: true}
],
}
}
}
SchedulerProDPVariation.initClass();