changeset 1111:a73726bba79c

Use custom row expander in probe list grid to display messung grid.
author Raimund Renkert <raimund.renkert@intevation.de>
date Tue, 17 May 2016 17:12:07 +0200
parents 4a55e665f2d1
children e76551a6da27
files app.js app/controller/Filter.js app/controller/grid/Messung.js app/controller/grid/ProbeList.js app/model/ProbeList.js app/view/grid/Messung.js app/view/widget/DynamicGrid.js resources/css/lada.css
diffstat 8 files changed, 113 insertions(+), 23 deletions(-) [+]
line wrap: on
line diff
--- a/app.js	Tue May 17 17:10:39 2016 +0200
+++ b/app.js	Tue May 17 17:12:07 2016 +0200
@@ -29,6 +29,8 @@
         'Lada.override.RowEditor',
         'Lada.override.i18n.DE',
         'Lada.override.JSON',
+        'Lada.override.RowExpander',
+        'Lada.view.plugin.GridRowExpander',
         'Ext.i18n.Bundle',
         'Ext.layout.container.Column',
         'Lada.store.Deskriptoren',
--- a/app/controller/Filter.js	Tue May 17 17:10:39 2016 +0200
+++ b/app/controller/Filter.js	Tue May 17 17:12:07 2016 +0200
@@ -126,7 +126,15 @@
             switch (queryType) {
                 case 'probe':
                     gridstore = Ext.create('Lada.store.ProbenList');
-                    frgrid = Ext.create('Lada.view.grid.ProbeList');
+                    frgrid = Ext.create('Lada.view.grid.ProbeList', {
+                        plugins: [{
+                            ptype: 'gridrowexpander',
+                            gridType: 'Lada.view.grid.Messung',
+                            gridConfig: {
+                                bottomBar: false
+                            }
+                        }]
+                    });
                     break;
                 case 'messung':
                     gridstore = Ext.create('Lada.store.MessungenList');
--- a/app/controller/grid/Messung.js	Tue May 17 17:10:39 2016 +0200
+++ b/app/controller/grid/Messung.js	Tue May 17 17:12:07 2016 +0200
@@ -39,30 +39,68 @@
      * Window.
      */
     editItem: function(grid, record) {
-        var probe = grid.up('window').record;
-        /* Only open a new Window when:
-           statusEdit = True
-           -or-
-           the value of status is not 0
-           -or-
-           the owner = True
+        // we have a window with a probe record!
+        if (grid.up('window')) {
+            var probe = grid.up('window').record;
+            /* Only open a new Window when:
+               statusEdit = True
+               -or-
+               the value of status is not 0
+               -or-
+               the owner = True
 
-           the statusWert attribute is not present in the original data.
-           it is appended, when the value and name of the status were
-           determined.
-        */
-        if (record.get('statusEdit')
-            || record.get('statusWert') > 0
-            || record.get('owner')) {
-            var win = Ext.create('Lada.view.window.MessungEdit', {
-                parentWindow: grid.up('window'),
-                probe: probe,
-                record: record,
-                grid: grid
-            });
-            win.show();
-            win.initData();
+               the statusWert attribute is not present in the original data.
+               it is appended, when the value and name of the status were
+               determined.
+            */
+            if (record.get('statusEdit')
+                || record.get('statusWert') > 0
+                || record.get('owner')) {
+                var win = Ext.create('Lada.view.window.MessungEdit', {
+                    parentWindow: grid.up('window'),
+                    probe: probe,
+                    record: record,
+                    grid: grid
+                });
+                win.show();
+                win.initData();
+            }
+            return;
         }
+        var probeRecord = Ext.create('Lada.model.ProbeList');
+        probeRecord.setId(record.get('probeId'));
+        probeRecord.set('owner', record.get('owner'));
+        probeRecord.set('readonly', record.get('readonly'));
+
+        var probeWin = Ext.create('Lada.view.window.ProbeEdit', {
+            record: probeRecord,
+            style: 'z-index: -1;' //Fixes an Issue where windows could not be created in IE8
+        });
+
+        probeWin.setPosition(30);
+        probeWin.show();
+        probeWin.initData();
+
+        Ext.ClassManager.get('Lada.model.Probe').load(record.get('probeId'), {
+            failure: function(record, action) {
+                me.setLoading(false);
+                // TODO
+                console.log('An unhandled Failure occured. See following Response and Record');
+                console.log(action);
+                console.log(record);
+            },
+            success: function(precord, response) {
+                var messungWin = Ext.create('Lada.view.window.MessungEdit', {
+                    parentWindow: grid.up('window'),
+                    probe: precord,
+                    record: record,
+                    grid: grid
+                });
+                messungWin.show();
+                messungWin.setPosition(window.innerWidth - 30 - messungWin.width);
+                messungWin.initData();
+            }
+        });
     },
 
     /**
--- a/app/controller/grid/ProbeList.js	Tue May 17 17:10:39 2016 +0200
+++ b/app/controller/grid/ProbeList.js	Tue May 17 17:12:07 2016 +0200
@@ -37,6 +37,10 @@
             },
             'probelistgrid toolbar button[action=print]': {
                 click: this.printSelection
+            },
+            'probelistgrid gridview': {
+                expandbody: this.expandBody,
+                collapsebody: this.collapseBody
             }
         });
         this.callParent(arguments);
@@ -338,5 +342,21 @@
         if (btn === 'yes') {
             location.reload();
         }
+    },
+
+    expandBody: function(rowNode, record, expandRow) {
+//        var row = Ext.get('probe-row-' + record.get('id'));
+//        var messungGrid = Ext.create('Lada.view.grid.Messung', {
+//            recordId: record.get('id'),
+//            bottomBar: false,
+//            rowLines: true
+//        });
+//        row.swallowEvent(['click', 'mousedown', 'mouseup', 'dblclick'], true);
+//        messungGrid.render(row);
+    },
+
+    collapseBody: function(rowNode, record, expandRow) {
+//        var element = Ext.get('probe-row-' + record.get('id')).down('div');
+//        element.destroy();
     }
 });
--- a/app/model/ProbeList.js	Tue May 17 17:10:39 2016 +0200
+++ b/app/model/ProbeList.js	Tue May 17 17:12:07 2016 +0200
@@ -14,6 +14,9 @@
     extend: 'Ext.data.Model',
 
     fields: [{
+        name: 'pid',
+        mapping: 'id'
+    }, {
         name: 'readonly'
     }, {
         name: 'owner'
--- a/app/view/grid/Messung.js	Tue May 17 17:10:39 2016 +0200
+++ b/app/view/grid/Messung.js	Tue May 17 17:12:07 2016 +0200
@@ -26,6 +26,7 @@
     warnings: null,
     errors: null,
     readOnly: true,
+    bottomBar: true,
     allowDeselect: true,
 
     initComponent: function() {
@@ -159,6 +160,9 @@
         };
         this.initData();
         this.callParent(arguments);
+        if (!this.bottomBar) {
+            this.down('toolbar[dock=bottom]').hide();
+        }
         this.setReadOnly(true); //Grid is always initialised as RO
     },
 
--- a/app/view/widget/DynamicGrid.js	Tue May 17 17:10:39 2016 +0200
+++ b/app/view/widget/DynamicGrid.js	Tue May 17 17:12:07 2016 +0200
@@ -83,6 +83,9 @@
         fields.push(new Ext.data.Field({
             name: 'statusEdit'
         }));
+        fields.push(new Ext.data.Field({
+            name: 'id'
+        }));
 
         resultColumns.push({
             xtype: 'actioncolumn',
--- a/resources/css/lada.css	Tue May 17 17:10:39 2016 +0200
+++ b/resources/css/lada.css	Tue May 17 17:12:07 2016 +0200
@@ -73,3 +73,15 @@
 ::-ms-reveal {
    display: none;
 }
+
+.row-expander-grid .x-grid-row-selected .x-grid-td {
+    background-color : #c6c6c6;
+}
+
+.row-expander-grid .x-grid-row-over .x-grid-td {
+    background-color : #e0e0e0;
+}
+
+.row-expander-grid .x-grid-with-row-lines .x-grid-td {
+    border-bottom: 1px solid #e0e0e0;
+}

http://lada.wald.intevation.org