具有角度日程同步融合的不同专业人员的工作日和不同时间

Question

我有一个非常动态的日程安排，我会让专业人员在不同的日子参加，他在那一天见面的时间段，开始时间和结束时间不同。

我用来组装这个的例子在这个链接：Schedule Different Work Days

我目前正在与这些专业人士建立一个资源列表，他们参加的日子如下：

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

我创建了一个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 问候。

我们使用 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;
        }
    }