Scheudler component with Webpack/React

[pmiklashevich]

Im using full version of scheduler 5.0.4 and Ext 6.2.1 trial version. I have "packages" folder with bryntum scheduler package in my app directory.

Can you please provide a runnable test case to let me check the code? Attach a zip-archive with your code. Do not forget to remove Scheduler and Ext sources!

[dyzio163]

I've started from scratch and now it's working but I have another issue. My scheduler component doesn't render events, also starte date is not correct. Here how it looks:

scheduler.PNG (15.62 KiB) Viewed 4714 times

Code:

Ext.define("RoomPlanner.view.main.Scheduler", {
  extend: "Sch.panel.SchedulerGrid",
  xtype: "configurationscheduler",
  requires : [
    'Sch.panel.SchedulerGrid'
  ],
  height: 800,
  title             : 'Room planner',
  viewPreset        : 'weekAndDay',
  startDate: new Date(2017, 0, 1),
  endDate: new Date(2017, 0, 14),
  resourceStore : {
    type    : 'resourcestore',
    sorters : {
      property  : 'Name',
      direction : 'ASC'
    },
    data    : [
      { Id : 'r1', Name : 'Mike' },
      { Id : 'r2', Name : 'Linda' },
      { Id : 'r3', Name : 'Don' },
      { Id : 'r4', Name : 'Karen' },
      { Id : 'r5', Name : 'Doug' },
      { Id : 'r6', Name : 'Peter' }
    ]
  },

  eventStore : {
    type  : 'eventstore',
    model : 'Sch.model.Event',
    data  : [
      {
        ResourceId  : 'r1',
        StartDate   : new Date(2017, 0, 1, 10),
        EndDate     : new Date(2017, 0, 1, 12)
      },
      {
        ResourceId  : 'r2',
        StartDate   : new Date(2017, 0, 1, 12),
        EndDate     : new Date(2017, 0, 1, 13)
      },
      {
        ResourceId  : 'r3',
        StartDate   : new Date(2017, 0, 1, 14),
        EndDate     : new Date(2017, 0, 1, 16)
      },
      {
        ResourceId  : 'r6',
        StartDate   : new Date(2017, 0, 1, 16),
        EndDate     : new Date(2017, 0, 1, 18)
      }
    ]
  }
});

[mats]

That looks like your CSS isn't included/loaded correctly. Please verify if you have any 404s?

[dyzio163]

I don't see any 404s. I have univeral app and I only added this line to "app.json" file:

"theme": "bryntum-scheduler-theme-triton"

Of course I copied "bryntum-scheduler-theme-triton" folder to "packages" directory. Does anything else is required?

[pmiklashevich]

Triton theme requires bryntum-scheduler-theme-base theme which also should be copied under the 'package' folder

[dyzio163]

I copied bryntum-scheduler-theme-base too - the same situation. Should I change app.json file too?

[pmiklashevich]

Try to clean up your browser cache and reload the page. If it doesn't help please provide an additional information or the runnable test case (without ext and bryntum files).

[dyzio163]

Doesn't help.

Here is app solution:

room-planner-alpha.zip

(152.1 KiB) Downloaded 152 times

[pmiklashevich]

Your test case is not runnable. You forgot to include .sencha folder.
<import file="${basedir}/.sencha/app/build-impl.xml"/> is missing.

I need to add Ext and Bryntum's packages. Then execute 'sencha app build'. Logs are green and I can run your test case.

Can you please ensure that your test case is ready to use?

[dyzio163]

Please check this package:

room-planner-alpha.zip

(219.16 KiB) Downloaded 159 times