Данные календаря внутри разметки в Extensible Calendar v1.5.2 и ExtJS v4.2

Question

Как я могу получить доступ к данным календаря внутри моего мероприятия, я имею в виду не в шаблоне, а где-то еще. Идея состоит в том, чтобы изменить шаблон на основе значения "Подтверждено", которое исходит из хранилища календаря.

Вот мой код, но пока не повезло!

Ext.override(Extensible.calendar.view.DayBody, {
    getEventBodyMarkup: function() {
        if(!this.eventBodyMarkup) {

            // can't seem to get this section to work properly
            if (this.data.Confirmed === 1) // I need to access the event store in here...
                 var statusText='Ok';
            else 
                 var statusText='Ko';

            this.eventBodyMarkup = ['<p class="ellipsis">{Title}</br><strong>{ServiceName}</strong></br>'+statusText+'{Notes}</p>',
                '<tpl if="_isReminder">',
                    '<i class="ext-cal-ic ext-cal-ic-rem">&#160;</i>',
                '</tpl>',
                '<tpl if="_isRecurring">',
                    '<i class="ext-cal-ic ext-cal-ic-rcr">&#160;</i>',
                '</tpl>'
            ].join('');
        }
        return this.eventBodyMarkup;
    },
  }
);

Может ли кто-нибудь помочь мне?

Заранее спасибо!

Answer 1

Это сообщение довольно старое, но я недавно столкнулся с этой проблемой, и функция getEventBodyMarkup предоставляет только отдельную разметку шаблона и не вызывается для каждого события. Я не очень знаком с приложением Extensible Calendar, но мое решение состояло в том, чтобы переопределить функцию getTemplateEventData. Это быстрое решение для вашего примера, но учтите, что я использую v1.0-rc1 на ExtJs 3.4, но процедуру можно легко адаптировать для ExtJs 4+

Ext.apply(Ext.ensible.cal.DayBodyView.prototype,{
  getEventBodyMarkup: function() {
    if(!this.eventBodyMarkup) {
      //just add a template variable/placeholder to your variable
      // in this case i choose _statusText
      this.eventBodyMarkup = ['<p class="ellipsis">{Title}</br>',
        '<strong>{ServiceName}</strong></br>{_statusText}{Notes}</p>',
          '<tpl if="_isReminder">',
            '<i class="ext-cal-ic ext-cal-ic-rem">&#160;</i>',
          '</tpl>',
          '<tpl if="_isRecurring">',
             '<i class="ext-cal-ic ext-cal-ic-rcr">&#160;</i>',
          '</tpl>'
      ].join('');
    }
    return this.eventBodyMarkup;
  }

  // now override the template data provider
  getTemplateEventData : function(evt){
    // --- 
    // essential code from the overwritten function
    // ---
    var M = Extensible.cal.EventMappings,
      extraClasses = [this.getEventSelectorCls(evt[M.EventId.name])],
      colorCls = 'x-cal-default';

    this.getTemplateEventBox(evt);

    if(this.calendarStore && evt[M.CalendarId.name]){
      var rec = this.calendarStore.getById(evt[M.CalendarId.name]);
      colorCls = 'x-cal-' + rec.data[Ext.ensible.cal.CalendarMappings.ColorId.name];
    }
    colorCls += (evt._renderAsAllDay ? '-ad' : '') + (Ext.isIE || Ext.isOpera ? '-x' : '');
    extraClasses.push(colorCls);

    if(this.getEventClass){
      var rec = this.getEventRecord(evt[M.EventId.name]),
      cls = this.getEventClass(rec, !!evt._renderAsAllDay, data, this.store);      
      extraClasses.push(cls);
    }

    // ---
    // Custom code starts here
    // ---
    var data = {}; // is going to store all your custom template vars

    if(this.getEventRecord(evt[M.EventId.name]).data.Confirmed===1) {
      data._statusText="OK";
    } else {
      data._statusText="Ko";
    }

    return Ext.applyIf(data, evt);
  }
});

Надеюсь, вы поняли, что это, вероятно, не лучшая практика, но она решает вашу проблему или других, кто сталкивается с этой проблемой. Убедитесь, что вы не переопределяете никакие зарезервированные переменные в хранилище данных, я использовал Ext.applyIf(...), который предотвращает такие аварии.

Answer 2

Используйте условие if внутри вашего шаблона:

this.eventBodyMarkup = ['<p class="ellipsis">{Title}</br><strong>{ServiceName}</strong></br>'
            '<tpl if="Confirmed==1">OK<tpl else>KO</tpl>{Notes}</tpl></p>',
            '<tpl if="_isReminder">',
                '<i class="ext-cal-ic ext-cal-ic-rem">&#160;</i>',
            '</tpl>',
            '<tpl if="_isRecurring">',
                '<i class="ext-cal-ic ext-cal-ic-rcr">&#160;</i>',
            '</tpl>'
        ].join('');