Mercurial > lada > lada-client
changeset 650:67963fcb7739
Removed old DateTimeField and replaced them with the new one.
author | Raimund Renkert <raimund.renkert@intevation.de> |
---|---|
date | Wed, 18 Mar 2015 13:55:14 +0100 |
parents | 1f51b6020f8c |
children | f4fef1d3a2ce |
files | app.js app/view/form/Probe.js app/view/widget/base/Datetime.js resources/lib/datetime/UX_DateTimeField.js resources/lib/datetime/UX_DateTimeMenu.js resources/lib/datetime/UX_DateTimePicker.js resources/lib/datetime/UX_TimePickerField.js |
diffstat | 7 files changed, 15 insertions(+), 395 deletions(-) [+] |
line wrap: on
line diff
--- a/app.js Wed Mar 18 13:54:18 2015 +0100 +++ b/app.js Wed Mar 18 13:55:14 2015 +0100 @@ -9,10 +9,6 @@ Ext.Loader.setConfig({ enabled: true, paths: { - 'Ext.ux.form.DateTimeField': 'resources/lib/datetime/UX_DateTimeField.js', - 'Ext.ux.DateTimeMenu': 'resources/lib/datetime/UX_DateTimeMenu.js', - 'Ext.ux.DateTimePicker': 'resources/lib/datetime/UX_DateTimePicker.js', - 'Ext.ux.form.TimePickerField': 'resources/lib/datetime/UX_TimePickerField.js', 'Ext.i18n': 'resources/lib/i18n/' } });
--- a/app/view/form/Probe.js Wed Mar 18 13:54:18 2015 +0100 +++ b/app/view/form/Probe.js Wed Mar 18 13:55:14 2015 +0100 @@ -240,19 +240,19 @@ align: 'stretch' }, items: [{ - xtype: 'datef', + xtype: 'datetime', fieldLabel: 'Beginn', labelWidth: 90, anchor: '100%', name: 'probeentnahmeBeginn', - format: 'd.m.Y H:i', + format: 'd.m.Y H:i' }, { - xtype: 'datef', + xtype: 'datetime', fieldLabel: 'Ende', labelWidth: 90, anchor: '100%', name: 'probeentnahmeEnde', - format: 'd.m.Y H:i', + format: 'd.m.Y H:i' }] }, { xtype: 'fieldset', @@ -262,22 +262,22 @@ margin: '0, 5, 5, 5', layout: { type: 'vbox', - align: 'stretch', + align: 'stretch' }, items: [{ - xtype: 'datef', + xtype: 'datetime', fieldLabel: 'Von', labelWidth: 90, anchor: '100%', name: 'solldatumBeginn', - format: 'd.m.Y H:i', - }, { - xtype: 'datef', + format: 'd.m.Y H:i' + }, { + xtype: 'datetime', fieldLabel: 'Bis', labelWidth: 90, anchor: '100%', name: 'solldatumEnde', - format: 'd.m.Y H:i', + format: 'd.m.Y H:i' }] }] }]
--- a/app/view/widget/base/Datetime.js Wed Mar 18 13:54:18 2015 +0100 +++ b/app/view/widget/base/Datetime.js Wed Mar 18 13:55:14 2015 +0100 @@ -13,17 +13,18 @@ extend: 'Ext.panel.Panel', alias: 'widget.datetime', requires: [ - 'Ext.ux.form.DateTimeField' + 'Lada.view.widget.base.DateTimeField' ], layout: 'hbox', border: 0, + margin: '0, 0, 5, 0', + initComponent: function() { - this.margin = this.fieldMargin; - var dateField = Ext.create('Ext.ux.form.DateTimeField', { - format: 'd.m.Y', + var dateField = Ext.create('Lada.view.widget.base.DateTimeField', { + format: this.format || 'd.m.Y H:i', emptyText: 'Wählen Sie einen Zeitpunkt', fieldLabel: this.fieldLabel, labelWidth: this.labelWidth,
--- a/resources/lib/datetime/UX_DateTimeField.js Wed Mar 18 13:54:18 2015 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,43 +0,0 @@ -Ext.define('Ext.ux.form.DateTimeField', { - extend: 'Ext.form.field.Date', - alias: 'widget.datetimefield', - requires: ['Ext.ux.DateTimePicker'], - - initComponent: function() { - this.format = this.format + ' ' + 'H:i:s'; - this.callParent(); - }, - // overwrite - createPicker: function() { - var me = this, - format = Ext.String.format; - - return Ext.create('Ext.ux.DateTimePicker', { - ownerCt: me.ownerCt, - renderTo: document.body, - floating: true, - hidden: true, - focusOnShow: true, - minDate: me.minValue, - maxDate: me.maxValue, - disabledDatesRE: me.disabledDatesRE, - disabledDatesText: me.disabledDatesText, - disabledDays: me.disabledDays, - disabledDaysText: me.disabledDaysText, - format: me.format, - showToday: me.showToday, - startDay: me.startDay, - minText: format(me.minText, me.formatDate(me.minValue)), - maxText: format(me.maxText, me.formatDate(me.maxValue)), - listeners: { - scope: me, - select: me.onSelect - }, - keyNavConfig: { - esc: function() { - me.collapse(); - } - } - }); - } - }); \ No newline at end of file
--- a/resources/lib/datetime/UX_DateTimeMenu.js Wed Mar 18 13:54:18 2015 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,39 +0,0 @@ -Ext.define('Ext.ux.DateTimeMenu', { - extend: 'Ext.menu.Menu', - - alias: 'widget.datetimemenu', - - requires: ['Ext.ux.DateTimePicker'], - - hideOnClick: true, - pickerId: null, - - initComponent: function() { - var me = this; - - Ext.apply(me, { - showSeparator: false, - plain: true, - border: false, - bodyPadding: 0, - items: Ext.applyIf({ - cls: Ext.baseCSSPrefix + 'menu-date-item', - id: me.pickerId, - xtype: 'datetimepicker' - }, me.initialConfig) - }); - - me.callParent(arguments); - - me.picker = me.down('datetimepicker'); - me.relayEvents(me.picker, ['select']); - - if (me.hideOnClick) { - me.on('select', me.hidePickerOnSelect, me); - } - }, - - hidePickerOnSelect: function() { - Ext.menu.Manager.hideAll(); - } - });
--- a/resources/lib/datetime/UX_DateTimePicker.js Wed Mar 18 13:54:18 2015 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,114 +0,0 @@ -Ext.define('Ext.ux.DateTimePicker', { - extend: 'Ext.picker.Date', - alias: 'widget.datetimepicker', - todayText: "Now", - timeLabel: 'Time', - requires: ['Ext.ux.form.TimePickerField'], - - initComponent: function() { - // keep time part for value - var value = this.value || new Date(); - this.callParent(); - this.value = value; - }, - onRender: function(container, position) { - if(!this.timefield) { - this.timefield = Ext.create('Ext.ux.form.TimePickerField', { - fieldLabel: this.timeLabel, - labelWidth: 40, - value: Ext.Date.format(this.value, 'H:i:s') - }); - } - this.timefield.ownerCt = this; - this.timefield.on('change', this.timeChange, this); - this.callParent(arguments); - - var table = Ext.get(Ext.DomQuery.selectNode('table', this.el.dom)); - var tfEl = Ext.core.DomHelper.insertAfter(table, { - tag: 'div', - style: 'border:0px;', - children: [{ - tag: 'div', - cls: 'x-datepicker-footer ux-timefield' - }] - }, true); - this.timefield.render(this.el.child('div div.ux-timefield')); - - var p = this.getEl().parent('div.x-layer'); - if(p) { - p.setStyle("height", p.getHeight() + 31); - } - }, - // listener 时间域修改, timefield change - timeChange: function(tf, time, rawtime) { - // if(!this.todayKeyListener) { // before render - this.value = this.fillDateTime(this.value); - // } else { - // this.setValue(this.value); - // } - }, - // @private - fillDateTime: function(value) { - if(this.timefield) { - var rawtime = this.timefield.getRawValue(); - value.setHours(rawtime.h); - value.setMinutes(rawtime.m); - value.setSeconds(rawtime.s); - } - return value; - }, - // @private - changeTimeFiledValue: function(value) { - this.timefield.un('change', this.timeChange, this); - this.timefield.setValue(this.value); - this.timefield.on('change', this.timeChange, this); - }, - - /* TODO 时间值与输入框绑定, 考虑: 创建this.timeValue 将日期和时间分开保存. */ - // overwrite - setValue: function(value) { - this.value = value; - this.changeTimeFiledValue(value); - return this.update(this.value); - }, - // overwrite - getValue: function() { - return this.fillDateTime(this.value); - }, - - // overwrite : fill time before setValue - handleDateClick: function(e, t) { - var me = this, - handler = me.handler; - - e.stopEvent(); - if(!me.disabled && t.dateValue && !Ext.fly(t.parentNode).hasCls(me.disabledCellCls)) { - me.doCancelFocus = me.focusOnSelect === false; - me.setValue(this.fillDateTime(new Date(t.dateValue))); // overwrite: fill time before setValue - delete me.doCancelFocus; - me.fireEvent('select', me, me.value); - if(handler) { - handler.call(me.scope || me, me, me.value); - } - me.onSelect(); - } - }, - - // overwrite : fill time before setValue - selectToday: function() { - var me = this, - btn = me.todayBtn, - handler = me.handler; - - if(btn && !btn.disabled) { - // me.setValue(Ext.Date.clearTime(new Date())); //src - me.setValue(new Date());// overwrite: fill time before setValue - me.fireEvent('select', me, me.value); - if(handler) { - handler.call(me.scope || me, me, me.value); - } - me.onSelect(); - } - return me; - } - });
--- a/resources/lib/datetime/UX_TimePickerField.js Wed Mar 18 13:54:18 2015 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,181 +0,0 @@ -/** - * 时间输入框, 三个整数框分别输入时,分,秒. - * @author wangzilong - * update Ext - 4.1 2012/04/27 - */ -Ext.define('Ext.ux.form.TimePickerField', { - extend: 'Ext.form.field.Base', - alias: 'widget.timepicker', - alternateClassName: 'Ext.form.field.TimePickerField', - requires: ['Ext.form.field.Number'], - - // 隐藏BaseField的输入框 , hidden basefield's input - inputType: 'hidden', - - style: 'padding:4px 0 0 0;margin-bottom:0px', - - /** - * @cfg {String} value - * initValue, format: 'H:i:s' - */ - value: null, - - /** - * @cfg {Object} spinnerCfg - * 数字输入框参数, number input config - */ - spinnerCfg: { - width: 40 - }, - - /** Override. */ - initComponent: function() { - var me = this; - - me.value = me.value || Ext.Date.format(new Date(), 'H:i:s'); - - me.callParent();// called setValue - - me.spinners = []; - var cfg = Ext.apply({}, me.spinnerCfg, { - readOnly: me.readOnly, - disabled: me.disabled, - style: 'float: left', - listeners: { - change: { - fn: me.onSpinnerChange, - scope: me - } - } - }); - - me.hoursSpinner = Ext.create('Ext.form.field.Number', Ext.apply({}, cfg, { - minValue: 0, - maxValue: 23 - })); - me.minutesSpinner = Ext.create('Ext.form.field.Number', Ext.apply({}, cfg, { - minValue: 0, - maxValue: 59 - })); - // TODO 使用timeformat 判断是否创建秒输入框, maybe second field is not always need. - me.secondsSpinner = Ext.create('Ext.form.field.Number', Ext.apply({}, cfg, { - minValue: 0, - maxValue: 59 - })); - - me.spinners.push(me.hoursSpinner, me.minutesSpinner, me.secondsSpinner); - - }, - /** - * @private - * Override. - */ - onRender: function() { - var me = this, spinnerWrapDom, spinnerWrap; - me.callParent(arguments); - - // render to original BaseField input td - // spinnerWrap = Ext.get(Ext.DomQuery.selectNode('div', this.el.dom)); // 4.0.2 - spinnerWrapDom = Ext.dom.Query.select('td', this.getEl().dom)[1]; // 4.0 ->4.1 div->td - spinnerWrap = Ext.get(spinnerWrapDom); - me.callSpinnersFunction('render', spinnerWrap); - - Ext.core.DomHelper.append(spinnerWrap, { - tag: 'div', - cls: 'x-form-clear-left' - }); - - this.setRawValue(this.value); - }, - - _valueSplit: function(v) { - if(Ext.isDate(v)) { - v = Ext.Date.format(v, 'H:i:s'); - } - var split = v.split(':'); - return { - h: split.length > 0 ? split[0] : 0, - m: split.length > 1 ? split[1] : 0, - s: split.length > 2 ? split[2] : 0 - }; - }, - onSpinnerChange: function() { - if(!this.rendered) { - return; - } - this.fireEvent('change', this, this.getValue(), this.getRawValue()); - }, - // 依次调用各输入框函数, call each spinner's function - callSpinnersFunction: function(funName, args) { - for(var i = 0; i < this.spinners.length; i++) { - this.spinners[i][funName](args); - } - }, - // @private get time as object, - getRawValue: function() { - if(!this.rendered) { - var date = this.value || new Date(); - return this._valueSplit(date); - } else { - return { - h: this.hoursSpinner.getValue(), - m: this.minutesSpinner.getValue(), - s: this.secondsSpinner.getValue() - }; - } - }, - - // private - setRawValue: function(value) { - value = this._valueSplit(value); - if(this.hoursSpinner) { - this.hoursSpinner.setValue(value.h); - this.minutesSpinner.setValue(value.m); - this.secondsSpinner.setValue(value.s); - } - }, - // overwrite - getValue: function() { - var v = this.getRawValue(); - return Ext.String.leftPad(v.h, 2, '0') + ':' + Ext.String.leftPad(v.m, 2, '0') + ':' - + Ext.String.leftPad(v.s, 2, '0'); - }, - // overwrite - setValue: function(value) { - this.value = Ext.isDate(value) ? Ext.Date.format(value, 'H:i:s') : value; - if(!this.rendered) { - return; - } - this.setRawValue(this.value); - this.validate(); - }, - // overwrite - disable: function() { - this.callParent(arguments); - this.callSpinnersFunction('disable', arguments); - }, - // overwrite - enable: function() { - this.callParent(arguments); - this.callSpinnersFunction('enable', arguments); - }, - // overwrite - setReadOnly: function() { - this.callParent(arguments); - this.callSpinnersFunction('setReadOnly', arguments); - }, - // overwrite - clearInvalid: function() { - this.callParent(arguments); - this.callSpinnersFunction('clearInvalid', arguments); - }, - // overwrite - isValid: function(preventMark) { - return this.hoursSpinner.isValid(preventMark) && this.minutesSpinner.isValid(preventMark) - && this.secondsSpinner.isValid(preventMark); - }, - // overwrite - validate: function() { - return this.hoursSpinner.validate() && this.minutesSpinner.validate() && this.secondsSpinner.validate(); - } - }); \ No newline at end of file