Mercurial > lada > lada-client
changeset 542:0a948bb99b60
Added error and warning handling to date time field.
| author | Raimund Renkert <raimund.renkert@intevation.de> |
|---|---|
| date | Thu, 18 Dec 2014 15:03:08 +0100 |
| parents | 6a5b48b17542 |
| children | ce188e2fab06 |
| files | app/view/proben/EditForm.js app/view/widgets/Datetime.js |
| diffstat | 2 files changed, 113 insertions(+), 47 deletions(-) [+] |
line wrap: on
line diff
--- a/app/view/proben/EditForm.js Thu Dec 18 15:02:00 2014 +0100 +++ b/app/view/proben/EditForm.js Thu Dec 18 15:03:08 2014 +0100 @@ -19,6 +19,7 @@ 'Lada.view.widgets.Testdatensatz', 'Lada.view.widgets.Probenart', 'Lada.view.widgets.Uwb', + 'Lada.view.widgets.TextField', 'Lada.view.zusatzwerte.List', 'Lada.view.kommentare.List', 'Lada.view.orte.List', @@ -67,8 +68,13 @@ border: 0, items: [{ border: 0, - width: '47%', + width: '50%', minWidth: 290, + layout: { + type: 'vbox', + align: 'stretch' + }, + margin: '0, 10, 0, 0', items: [{ xtype: 'mst', name: 'mstId', @@ -82,7 +88,7 @@ } } }, { - xtype: 'textfield', + xtype: 'tfield', name: 'hauptprobenNr', maxLength: 20, fieldLabel: 'Hauptprobennr.', @@ -254,55 +260,68 @@ // Zeit xtype: 'fieldset', title: 'Zeit', - defaultType: 'datetime', layout: { - type: 'table', - columns: 2 + type: 'hbox' }, items: [{ - fieldLabel: 'Probennahme Beginn', - margin: '0, 10, 5, 0', - labelWidth: 125, - name: 'probeentnahmeBeginn', - listeners: { - dirtychange: { - fn: this.updateOnChange, - scope: me - } - } - }, { - fieldLabel: 'Sollzeit Von', - margin: '0, 10, 5, 0', - labelWidth: 100, - name: 'solldatumBeginn', - listeners: { - dirtychange: { - fn: this.updateOnChange, - scope: me + layout: { + type: 'vbox', + align: 'stretch' + }, + border: 0, + items: [{ + xtype: 'datetime', + fieldLabel: 'Probennahme Beginn', + fieldMargin: '0, 10, 5, 0', + labelWidth: 125, + name: 'probeentnahmeBeginn', + listeners: { + dirtychange: { + fn: this.updateOnChange, + scope: me + } } - } - }, { - fieldLabel: 'Probennahme Ende', - margin: '0, 10, 5, 0', - labelWidth: 125, - name: 'probeentnahmeEnde', - listeners: { - dirtychange: { - fn: this.updateOnChange, - scope: me + }, { + xtype: 'datetime', + fieldLabel: 'Probennahme Ende', + fieldMargin: '0, 10, 5, 0', + labelWidth: 125, + name: 'probeentnahmeEnde', + listeners: { + dirtychange: { + fn: this.updateOnChange, + scope: me + } } - } + }] }, { - fieldLabel: 'Sollzeit Bis', - margin: '0, 10, 5, 0', - labelWidth: 100, - name: 'solldatumEnde', - listeners: { - dirtychange: { - fn: this.updateOnChange, - scope: me + layout: 'vbox', + border: 0, + items: [{ + xtype: 'datetime', + fieldLabel: 'Sollzeit Von', + fieldMargin: '0, 10, 5, 0', + labelWidth: 90, + name: 'solldatumBeginn', + listeners: { + dirtychange: { + fn: this.updateOnChange, + scope: me + } } - } + }, { + xtype: 'datetime', + fieldLabel: 'Sollzeit Bis', + fieldMargin: '0, 10, 5, 0', + labelWidth: 90, + name: 'solldatumEnde', + listeners: { + dirtychange: { + fn: this.updateOnChange, + scope: me + } + } + }] }] }] }]
--- a/app/view/widgets/Datetime.js Thu Dec 18 15:02:00 2014 +0100 +++ b/app/view/widgets/Datetime.js Thu Dec 18 15:03:08 2014 +0100 @@ -10,12 +10,59 @@ * Datetimepicker with german date format. */ Ext.define('Lada.view.widgets.Datetime', { - extend: 'Ext.ux.form.DateTimeField', + extend: 'Ext.panel.Panel', alias: 'widget.datetime', - format: 'd.m.Y', - emptyText: 'Wählen Sie einen Zeitpunkt', + + layout: 'hbox', + + border: 0, initComponent: function() { + var dateField = Ext.create('Ext.ux.form.DateTimeField', { + format: 'd.m.Y', + emptyText: 'Wählen Sie einen Zeitpunkt', + fieldLabel: this.fieldLabel, + margin: this.fieldMargin, + labelWidth: this.labelWidth, + flex: 1, + name: this.name, + listeners: this.listeners + }); + this.items = [{ + xtype: 'image', + name: 'warnImg', + src: 'gfx/icon-warning.gif', + margin: '2, 5, 2, 5', + width: 16, + height: 16, + hidden: true + }, { + xtype: 'image', + name: 'errorImg', + src: 'gfx/icon-error.gif', + margin: '2, 5, 2, 5', + width: 16, + height: 16, + hidden: true + }, dateField]; this.callParent(arguments); + }, + + showWarnings: function(warnings) { + var img = this.down('image[name=warnImg]'); + Ext.create('Ext.tip.ToolTip', { + target: img.getEl(), + html: warnings + }); + img.show(); + }, + + showErrors: function(errors) { + var img = this.down('image[name=errorImg]'); + Ext.create('Ext.tip.ToolTip', { + target: img.getEl(), + html: errors + }); + img.show(); } });