1

当我尝试通过单击 Ext JS 4 日历创建新事件时,出现无法调用未定义错误的方法“getTime”。

这是我的活动商店定义:

Ext.calendar.data.EventMappings = {
    // These are the same fields as defined in the standard EventRecord object but the
    // names and mappings have all been customized. Note that the name of each field
    // definition object (e.g., 'EventId') should NOT be changed for the default fields
    // as it is the key used to access the field data programmatically.
    EventId:     {name: 'id', mapping:'id', type:'int'}, // int by default
    CalendarId:  {name: 'cid', mapping: 'cid', type: 'int'}, // int by default
    Title:       {name: 'title', mapping: 'title'},
    StartDate:   {name: 'start', mapping: 'start', type: 'date', dateFormat: 'c'},
    EndDate:     {name: 'end', mapping: 'end', type: 'date', dateFormat: 'c'},
    RRule:       {name: 'recur_rule', mapping: 'recur_rule'},
    Location:    {name: 'loc', mapping: 'loc'},
    Notes:       {name: 'notes', mapping: 'notes'},
    Url:         {name: 'url', mapping: 'url', type : 'int' },
    IsAllDay:    {name: 'ad', mapping: 'ad', type: 'boolean'},
    Reminder:    {name: 'rem', mapping: 'rem'},

    // We can also add some new fields that do not exist in the standard EventRecord:
    CreatedBy:   {name: 'collabUserId', mapping: 'collabUserId', type: 'int'}
};
// Don't forget to reconfigure!
Ext.calendar.data.EventModel.reconfigure();

Ext.define(appName + '.store.Events', {
    extend      : 'Ext.calendar.data.MemoryEventStore',
//  model       : appName + '.model.Event',
    autoLoad    : false,
    autoSync    : true,
    proxy       : {
        type    : 'ajax',
//        url     : 'randevu/loadEvents.ajax',
        api     : {
            read    : 'randevu/loadEvents.ajax',
            create  : 'randevu/saveOrUpdateEvent.ajax',
            update  : 'randevu/saveOrUpdateEvent.ajax',
            destroy : 'randevu/deleteEvent.ajax'
        },
        reader  : {
            type    : 'json',
            root    : 'data',
            successProperty : 'success',
            totalProperty   : 'totalCount',
            idProperty      : 'id'
        },
        writer  : {
            type    : 'json',
            writeAllFields : true,
            encode  : true,
            root    : 'data'
        }
    }
});

我的日历视图:

Ext.define(appName + '.view.randevu.RandevuPanel', {
    extend      : appName + '.view.base.BasePanel',
    requires    : [ 'Ext.calendar.util.Date',
        'Ext.calendar.CalendarPanel',
        'Ext.calendar.data.MemoryCalendarStore',
        'Ext.calendar.data.MemoryEventStore',
        'Ext.calendar.data.Events',
        'Ext.calendar.data.Calendars',
        'Ext.calendar.form.EventWindow',
        appName + '.view.user.UserCombo'
    ],
    alias       : 'widget.randevupanel',
    iconCls     : 'icon-calendar',
    width       : '100%',
//    titleAlign  : 'center',
    layout      : {
        type    : 'hbox',
        align   : 'stretch'
    },
    defaults    : { flex : 1 }, //auto stretch
    initComponent: function() {

        var me = this;

        this.calendarStore = OnlineRandevuSistemi.app.getStore('Calendars');
        this.eventStore = OnlineRandevuSistemi.app.getStore('Events');

        this.updateTitle = function(startDt, endDt) {
            var p = Ext.getCmp('app-center'),
                fmt = Ext.Date.format;

            if(Ext.Date.clearTime(startDt).getTime() == Ext.Date.clearTime(endDt).getTime()){
                p.setTitle(fmt(startDt, 'F j, Y'));
            }
            else if(startDt.getFullYear() == endDt.getFullYear()){
                if(startDt.getMonth() == endDt.getMonth()){
                    p.setTitle(fmt(startDt, 'F j') + ' - ' + fmt(endDt, 'j, Y'));
                }
                else{
                    p.setTitle(fmt(startDt, 'F j') + ' - ' + fmt(endDt, 'F j, Y'));
                }
            }
            else{
                p.setTitle(fmt(startDt, 'F j, Y') + ' - ' + fmt(endDt, 'F j, Y'));
            }
        };

        this.showEditWindow = function(rec, animateTarget){
            console.log(rec);
            if(!this.editWin){
                this.editWin = Ext.create('Ext.calendar.form.EventWindow', {
                    calendarStore: this.calendarStore,
                    listeners: {
                        'eventadd': {
                            fn: function(win, rec){
                                win.hide();
                                rec.data.IsNew = false;
                                this.eventStore.add(rec);
//                                this.eventStore.sync();
                                this.showMsg('<b>'+ rec.data.Title +'</b> etkinliği eklendi.');
                            },
                            scope: this
                        },
                        'eventupdate': {
                            fn: function(win, rec){
                                win.hide();
                                rec.commit();
//                                this.eventStore.sync();
                                this.showMsg('<b>'+ rec.data.Title + '</b> etkinliği düzenlendi.');
                            },
                            scope: this
                        },
                        'eventdelete': {
                            fn: function(win, rec){
                                this.eventStore.remove(rec);
//                                this.eventStore.sync();
                                win.hide();
                                this.showMsg('<b>'+ rec.data.Title +'</b> etkinliği silindi.');
                            },
                            scope: this
                        },
                        'editdetails': {
                            fn: function(win, rec){
                                win.hide();
                                Ext.getCmp('app-calendar').showEditForm(rec);
                            }
                        }
                    }
                });
            }
            this.editWin.show(rec, animateTarget);
        };

        this.showMsg = function(msg){
            Ext.example.msg('Bilgilendirme', msg);
//            Ext.fly('app-msg').update(msg).removeCls('x-hidden');
        };
        this.clearMsg = function(){
            Ext.fly('app-msg').update('').addCls('x-hidden');
        };

        this.title = bundle.getMsg('randevupanel.title');

        this.items = [{
            id: 'app-center',
            title: '...', // will be updated to the current view's date range
            titleAlign : 'center',
            region: 'center',
            layout: 'border',
            listeners: {
                'afterrender': function(){
                    Ext.getCmp('app-center').header.addCls('app-center-header');
                }
            },
            items: [{
                xtype: 'container',
                id:'app-west',
                region: 'west',
                width: Ext.themeName === 'neptune' ? 214 : 179,
                items: [{
                    xtype: 'datepicker',
                    id: 'app-nav-picker',
                    cls: 'ext-cal-nav-picker',
                    listeners: {
                        'select': {
                            fn: function(dp, dt){
                                Ext.getCmp('app-calendar').setStartDate(dt);
                            },
                            scope: this
                        }
                    }
                }]
            },{
                xtype: 'calendarpanel',
                eventStore: this.eventStore,
//                eventStore: 'Events',
                calendarStore: this.calendarStore,
                border: false,
                id:'app-calendar',
                region: 'center',
                activeItem: 3, // month view

                monthViewCfg: {
                    showHeader: true,
                    showWeekLinks: true,
                    showWeekNumbers: true
                },

                listeners: {
                    'eventclick': {
                        fn: function(vw, rec, el){
                            this.showEditWindow(rec, el);
                            this.clearMsg();
                        },
                        scope: this
                    },
                    'eventover': function(vw, rec, el){
                        //console.log('Entered evt rec='+rec.data.Title+', view='+ vw.id +', el='+el.id);
                    },
                    'eventout': function(vw, rec, el){
                        //console.log('Leaving evt rec='+rec.data.Title+', view='+ vw.id +', el='+el.id);
                    },
                    'eventadd': {
                        fn: function(cp, rec){
                            this.showMsg('Event '+ rec.data.Title +' was added');
                        },
                        scope: this
                    },
                    'eventupdate': {
                        fn: function(cp, rec){
                            this.showMsg('Event '+ rec.data.Title +' was updated');
                        },
                        scope: this
                    },
                    'eventcancel': {
                        fn: function(cp, rec){
                            // edit canceled
                        },
                        scope: this
                    },
                    'viewchange': {
                        fn: function(p, vw, dateInfo){
                            if(this.editWin){
                                this.editWin.hide();
                            }
                            if(dateInfo){
                                // will be null when switching to the event edit form so ignore
                                Ext.getCmp('app-nav-picker').setValue(dateInfo.activeDate);
                                this.updateTitle(dateInfo.viewStart, dateInfo.viewEnd);
                            }
                        },
                        scope: this
                    },
                    'dayclick': {
                        fn: function(vw, dt, ad, el){
                            this.showEditWindow({
                                StartDate: dt,
                                IsAllDay: ad
                            }, el);
                            this.clearMsg();
                        },
                        scope: this
                    },
                    'rangeselect': {
                        fn: function(win, dates, onComplete){
                            this.showEditWindow(dates);
                            this.editWin.on('hide', onComplete, this, {single:true});
                            this.clearMsg();
                        },
                        scope: this
                    },
                    'eventmove': {
                        fn: function(vw, rec){
                            var mappings = Ext.calendar.data.EventMappings,
                                time = rec.data[mappings.IsAllDay.name] ? '' : ' \\a\\t g:i a';

                            rec.commit();

                            this.showMsg('Event '+ rec.data[mappings.Title.name] +' was moved to '+
                                Ext.Date.format(rec.data[mappings.StartDate.name], ('F jS'+time)));
                            this.eventStore.sync();
                        },
                        scope: this
                    },
                    'eventresize': {
                        fn: function(vw, rec){
                            rec.commit();
                            this.showMsg('Event '+ rec.data.Title +' was updated');
                        },
                        scope: this
                    },
                    'eventdelete': {
                        fn: function(win, rec){
                            this.eventStore.remove(rec);
                            this.showMsg('Event '+ rec.data.Title +' was deleted');
                        },
                        scope: this
                    },
                    'initdrag': {
                        fn: function(vw){
                            if(this.editWin && this.editWin.isVisible()){
                                this.editWin.hide();
                            }
                        },
                        scope: this
                    }
                }
            }]
        }];

        this.scdUserLabel = Ext.create('Ext.form.DisplayField', {
            hideLabel   : true,
            value       : 'Misafir Oturumu'
        });

        this.btnLogin = Ext.create('Ext.Button', {
            text    : bundle.getMsg('randevupanel.btnLogin.text'),
            iconCls : 'icon-sign-in',
            action  : 'login',
            tooltip : bundle.getMsg('randevupanel.btnLogin.tip')
        });
        this.btnLogout = Ext.create('Ext.Button', {
            text    : bundle.getMsg('randevupanel.btnLogout.text'),
            iconCls : 'icon-sign-out',
            action  : 'logout',
            hidden  : true,
            tooltip : bundle.getMsg('randevupanel.btnLogout.tip')
        });

        this.tbar = Ext.create('Ext.Toolbar', {
            items   : [ ' ', me.scdUserLabel, '->', me.btnLogin, me.btnLogout ]
        });


        this.callParent(arguments);
    }
});
4

0 回答 0