Mercurial > lada > lada-client

comparison resources/datetime/UX_DateTimePicker.js @ 273:a282da79cfaa

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Added datetimepicker from http://www.sencha.com/forum/showthread.php?137242-Ext.ux.DateTimeField-DateTimePicker-for-ext4-also-DateTimeMenu-TimePickerField
author Torsten Irländer <torsten.irlaender@intevation.de>
date Wed, 07 Aug 2013 11:59:50 +0200
parents
children 4d8819844c48
comparison
equal deleted inserted replaced
272:852dc338894e 273:a282da79cfaa
1 Ext.define("Ext.locale.en.ux.picker.DateTimePicker", {
2 override: "Ext.ux.DateTimePicker",
3 todayText: "Now",
4 timeLabel: 'Time'
5 });
6
7 Ext.define('Ext.ux.DateTimePicker', {
8 extend: 'Ext.picker.Date',
9 alias: 'widget.datetimepicker',
10 todayText: '现在',
11 timeLabel: '时间',
12 requires: ['Ext.ux.form.TimePickerField'],
13
14 initComponent: function() {
15 // keep time part for value
16 var value = this.value || new Date();
17 this.callParent();
18 this.value = value;
19 },
20 onRender: function(container, position) {
21 if(!this.timefield) {
22 this.timefield = Ext.create('Ext.ux.form.TimePickerField', {
23 fieldLabel: this.timeLabel,
24 labelWidth: 40,
25 value: Ext.Date.format(this.value, 'H:i:s')
26 });
27 }
28 this.timefield.ownerCt = this;
29 this.timefield.on('change', this.timeChange, this);
30 this.callParent(arguments);
31
32 var table = Ext.get(Ext.DomQuery.selectNode('table', this.el.dom));
33 var tfEl = Ext.core.DomHelper.insertAfter(table, {
34 tag: 'div',
35 style: 'border:0px;',
36 children: [{
37 tag: 'div',
38 cls: 'x-datepicker-footer ux-timefield'
39 }]
40 }, true);
41 this.timefield.render(this.el.child('div div.ux-timefield'));
42
43 var p = this.getEl().parent('div.x-layer');
44 if(p) {
45 p.setStyle("height", p.getHeight() + 31);
46 }
47 },
48 // listener 时间域修改, timefield change
49 timeChange: function(tf, time, rawtime) {
50 // if(!this.todayKeyListener) { // before render
51 this.value = this.fillDateTime(this.value);
52 // } else {
53 // this.setValue(this.value);
54 // }
55 },
56 // @private
57 fillDateTime: function(value) {
58 if(this.timefield) {
59 var rawtime = this.timefield.getRawValue();
60 value.setHours(rawtime.h);
61 value.setMinutes(rawtime.m);
62 value.setSeconds(rawtime.s);
63 }
64 return value;
65 },
66 // @private
67 changeTimeFiledValue: function(value) {
68 this.timefield.un('change', this.timeChange, this);
69 this.timefield.setValue(this.value);
70 this.timefield.on('change', this.timeChange, this);
71 },
72
73 /* TODO 时间值与输入框绑定, 考虑: 创建this.timeValue 将日期和时间分开保存. */
74 // overwrite
75 setValue: function(value) {
76 this.value = value;
77 this.changeTimeFiledValue(value);
78 return this.update(this.value);
79 },
80 // overwrite
81 getValue: function() {
82 return this.fillDateTime(this.value);
83 },
84
85 // overwrite : fill time before setValue
86 handleDateClick: function(e, t) {
87 var me = this,
88 handler = me.handler;
89
90 e.stopEvent();
91 if(!me.disabled && t.dateValue && !Ext.fly(t.parentNode).hasCls(me.disabledCellCls)) {
92 me.doCancelFocus = me.focusOnSelect === false;
93 me.setValue(this.fillDateTime(new Date(t.dateValue))); // overwrite: fill time before setValue
94 delete me.doCancelFocus;
95 me.fireEvent('select', me, me.value);
96 if(handler) {
97 handler.call(me.scope || me, me, me.value);
98 }
99 me.onSelect();
100 }
101 },
102
103 // overwrite : fill time before setValue
104 selectToday: function() {
105 var me = this,
106 btn = me.todayBtn,
107 handler = me.handler;
108
109 if(btn && !btn.disabled) {
110 // me.setValue(Ext.Date.clearTime(new Date())); //src
111 me.setValue(new Date());// overwrite: fill time before setValue
112 me.fireEvent('select', me, me.value);
113 if(handler) {
114 handler.call(me.scope || me, me, me.value);
115 }
116 me.onSelect();
117 }
118 return me;
119 }
120 });
http://lada.wald.intevation.org