1 define(['ModuleView', 'UICalendarBox', 'text!ListPath/tpl.calendar.bar.html'], function (ModuleView, UICalendarBox, tpl) { 2 return _.inherit(ModuleView, { initData: function () { .template = tpl; 8 this.events = { 9 'click .js_pre_day': 'preAction', 10 'click .js_next_day': 'nextAction', 11 'click .js_show_calendar': 'showCalendar' 12 }; .dateEntity.subscribe('init', this.render, this); 16 this.dateEntity.subscribe(this.render, this); 17 18 }, 19 20 initDate: function () { 21 var t = new Date().getTime(); (_.getUrlParam().startdatetime) t = _.getUrlParam().startdatetime; 25 this.dateEntity.initData({ 26 date: t 27 }); 28 }, 29 30 getViewModel: function () { 31 var data = this.dateEntity.get(); 32 data.formatStr = this.dateEntity.getDateStr(); 33 data.canPreDay = this.dateEntity.canPreDay(); 34 return data; 35 }, 36 37 preAction: function () { 38 if (this.dateEntity.preDay()) return; 39 this.view.showToast('前一天不可预订'); 40 }, 41 42 nextAction: function () { 43 this.dateEntity.nextDay(); 44 }, 45 46 showCalendar: function () { 47 var scope = this, endDate = new Date(); 48 var secDate = new Date(); 49 secDate.setTime(this.dateEntity.getDate()); 50 51 endDate.setTime(new Date().getTime() + 2592000000); (!this.calendar) { 54 this.calendar = new UICalendarBox({ 55 endTime: endDate, 56 selectDate: secDate, 57 onItemClick: function (date, el, e) { 58 scope.dateEntity.set(date); 59 this.hide(); 60 } 61 }); 62 } else { 63 this.calendar.calendar.selectDate = secDate; 64 this.calendar.calendar.refresh(); 65 } 66 this.calendar.show(); 67 } 68 69 }); 70 71 });

这个组件模块干了几个事情：

① 首先，dateEntity实体需要由list.js这个主view注入

② 这里为dateEntity注册了两个数据响应事件：