[Lada-commits] [PATCH 2 of 4] Added error and warning handling to date time field

[Wald Commits]

# HG changeset patch
# User Raimund Renkert <raimund.renkert at intevation.de>
# Date 1418911388 -3600
# Node ID 0a948bb99b609fac7cf499678e0a76806a822abe
# Parent  6a5b48b175428ecd5a3dd956974577009acf7b50
Added error and warning handling to date time field.

diff -r 6a5b48b17542 -r 0a948bb99b60 app/view/proben/EditForm.js
--- 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
+                    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
+                            }
                         }
-                    }
+                    }, {
+                        xtype: 'datetime',
+                        fieldLabel: 'Probennahme Ende',
+                        fieldMargin: '0, 10, 5, 0',
+                        labelWidth: 125,
+                        name: 'probeentnahmeEnde',
+                        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: '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
+                            }
                         }
-                    }
-                }, {
-                    fieldLabel: 'Probennahme Ende',
-                    margin: '0, 10, 5, 0',
-                    labelWidth: 125,
-                    name: 'probeentnahmeEnde',
-                    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
+                            }
                         }
-                    }
-                }, {
-                    fieldLabel: 'Sollzeit Bis',
-                    margin: '0, 10, 5, 0',
-                    labelWidth: 100,
-                    name: 'solldatumEnde',
-                    listeners: {
-                        dirtychange: {
-                            fn: this.updateOnChange,
-                            scope: me
-                        }
-                    }
+                    }]
                 }]
             }]
                 }]
diff -r 6a5b48b17542 -r 0a948bb99b60 app/view/widgets/Datetime.js
--- 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();
     }
 });