Рабочие дни и разные часы для разных специалистов с угловой синхронизацией графика

Question

У меня очень динамичное расписание, где у меня будут профессионалы, которые посещают разные дни, когда в тот день он встречается в течение периода, с разным временем начала и окончания.

Пример, который я использовал для сборкиэто по этой ссылке: Расписание различных рабочих дней

В настоящее время я создаю список ресурсов с этими специалистами, и их дни посещают следующее:

 const resourceObject = {
    text: professional.name, id: professional.id,
    color: '#848484', workDays: days, startHour: '', endHour: ''
  };

Iсоздайте список resourceDataSource и добавьте вышеупомянутый объект внутри него, чтобы в календаре я мог знать, какие дни посещает каждый профессионал.

Моя проблема в том, что таким образом я не могу установить время начала и время окончаниядля определенного дня.

Как я могу поддерживать эту логику программирования, назначая разное время начала и окончания для определенных дней?

{dayWork: 1, startTime: '13:00', endTime: '18:00', id: professionalId}
{dayWork 2, startTime: '08:00', endTime: '19:00', id: professionalId}

component.html:

<ng-template #resourceHeaderTemplate let-data>
    <div class='template-wrap'>
        <div class="avatar resource-image {{getDoctorImage(data)}}"></div>
        <div class="resource-details">
            <div class="resource-name">{{getDoctorName(data)}}</div>
        </div>
    </div>
</ng-template>
<e-resources>
    <e-resource field='DoctorId' title='Professional' name='Doctors' [dataSource]='resourceDataSource'
        textField='text' idField='id' colorField='color' workDaysField='workDays' startHourField='startHour'
        endHourField='endHour'>
    </e-resource>
</e-resources>

Answer 1

Syncfusion Greetings.

Мы подготовили приведенный ниже пример, чтобы иметь разные рабочие часы в день для каждого ресурса, используя события DataBinding и actionBegin.

https://stackblitz.com/edit/angular-ysiqa8-pzqfrc?file=app.component.ts

onDataBinding(args: any): void {
    if (this.flag) {
      if (
        this.scheduleObj.currentView !== "Month" &&
        this.scheduleObj.currentView !== "Agenda"
      ) {
        var currentViewDates = this.scheduleObj.getCurrentViewDates();
        for (var i = 0; i < currentViewDates.length; i++) {
          switch ((currentViewDates[i] as any).getDay()) {
            case 0:
              this.scheduleObj.setWorkHours([currentViewDates[i]], '06:00', '14:00', 0);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '08:00', '13:00', 1);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '07:00', '20:00', 2);
              break;
            case 1:
              this.scheduleObj.setWorkHours([currentViewDates[i]], '08:00', '14:00', 0);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '09:00', '13:00', 1);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '07:00', '20:00', 2);
              break;
            case 2:
              this.scheduleObj.setWorkHours([currentViewDates[i]], '07:00', '20:00', 0);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '08:00', '14:00', 1);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '09:00', '18:00', 2);
              break;
            case 3:
              this.scheduleObj.setWorkHours([currentViewDates[i]], '05:00', '10:00', 0);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '11:00', '15:00', 1);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '10:00', '14:00', 2);
              break;
            case 4:
              this.scheduleObj.setWorkHours([currentViewDates[i]], '10:00', '15:00', 0);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '08:00', '12:00', 1);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '09:00', '13:00', 2);
              break;
            case 5:
              this.scheduleObj.setWorkHours([currentViewDates[i]], '09:00', '14:00', 0);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '10:00', '19:00', 1);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '08:00', '18:00', 2);
               break;
            case 6:
              this.scheduleObj.setWorkHours([currentViewDates[i]], '07:00', '19:00', 0);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '08:00', '14:00', 1);
              this.scheduleObj.setWorkHours([currentViewDates[i]], '09:00', '20:00', 2);
          }
        }
      }
      this.flag = false;
    }

onActionBegin(args: ActionEventArgs): void {
        let isEventChange: boolean = (args.requestType === 'eventChange');
        if (args.requestType == "eventCreate" ||args.requestType == "eventChange" || args.requestType == "eventRemove" ) {
          this.flag = false;
        } else {
          this.flag = true;
        }
    }