[Lada-commits] [PATCH 1 of 2] Updated UI, added window for filter management and added fieldset for query
Wald Commits
scm-commit at wald.intevation.org
Tue Feb 2 15:26:53 CET 2016
# HG changeset patch
# User Raimund Renkert <raimund.renkert at intevation.de>
# Date 1454423116 -3600
# Node ID af9879d72310320f7d1d42db0c6558befe6688d8
# Parent 94a6b5415d73f7b3e9537b874a0ee7611ce34b93
Updated UI, added window for filter management and added fieldset for query
details.
diff -r 94a6b5415d73 -r af9879d72310 app.js
--- a/app.js Thu Jan 21 08:59:13 2016 +0100
+++ b/app.js Tue Feb 02 15:25:16 2016 +0100
@@ -106,7 +106,6 @@
},
onLoginSuccess: function(response) {
- Ext.create('Lada.view.Viewport');
/* Parse Username and Timestamp */
var json = Ext.decode(response.responseText);
@@ -164,6 +163,19 @@
storeId: 'statusstufe',
autoLoad: 'true'
});
+ Ext.create('Lada.store.ProbeQueries', {
+ storeId: 'probequeries',
+ autoLoad: 'true'
+ });
+ Ext.create('Lada.store.MessprogrammQueries', {
+ storeId: 'messprogrammqueries',
+ autoLoad: 'true'
+ });
+ Ext.create('Lada.store.StammdatenQueries', {
+ storeId: 'stammdatenqueries',
+ autoLoad: 'true'
+ });
+
//A Store containing all MST a User is allowed to set.
Ext.create('Lada.store.Messstellen', {
storeId: 'messstellenFiltered',
@@ -174,6 +186,7 @@
return false;
}
});
+ Ext.create('Lada.view.Viewport');
},
getServerVersion: function() {
@@ -219,6 +232,7 @@
'Lada.controller.Map',
'Lada.controller.form.Location',
'Lada.controller.form.Messprogramm',
- 'Lada.controller.grid.Messmethode'
+ 'Lada.controller.grid.Messmethode',
+ 'Lada.controller.FilterManagement'
]
});
diff -r 94a6b5415d73 -r af9879d72310 app/controller/Filter.js
--- a/app/controller/Filter.js Thu Jan 21 08:59:13 2016 +0100
+++ b/app/controller/Filter.js Tue Feb 02 15:25:16 2016 +0100
@@ -15,6 +15,7 @@
requires: [
'Lada.view.widget.Messstelle',
+ 'Lada.view.window.FilterManagement',
'Lada.view.widget.Umwelt'
],
@@ -25,6 +26,10 @@
displayFields: null,
+ managementWindow: null,
+
+ mode: 'proben',
+
/**
* Initialize this Controller
* It has 4 Listeners
@@ -65,6 +70,9 @@
selectSql: function(element, record) {
var filters = element.up('panel[name=main]').down('fieldset[name=filtervariables]');
+ if (!record[0]) {
+ return;
+ }
// Set "Filter Auswahl" Description
var desc = element.up('fieldset').down('displayfield[name=description]');
desc.setValue(record[0].data.description);
@@ -74,19 +82,13 @@
var contentPanel = element.up('panel[name=main]').down('panel[name=contentpanel]');
var queryType = record[0].get('type'); //The type of the query, might be proben, messprogramme,
// or a stammdatendtype
+ var details = element.up('panel[name=main]').down('filterdetails');
+ details.setRecord(record[0]);
this.reset(element);
contentPanel.removeAll(); //clear the panel: make space for new grids
- // Set "Filter Auswahl" Columns
- var columns = element.up('fieldset').down('displayfield[name=columns]');
- var columnString = [];
- for (var i = 0; i < this.displayFields.length; i++) {
- columnString.push(this.displayFields[i].header);
- }
- columns.setValue(columnString.join(', '));
-
// Setup Columns
if (this.displayFields) {
this.displayFields.reverse();
diff -r 94a6b5415d73 -r af9879d72310 app/controller/FilterManagement.js
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/controller/FilterManagement.js Tue Feb 02 15:25:16 2016 +0100
@@ -0,0 +1,61 @@
+/* Copyright (C) 2013 by Bundesamt fuer Strahlenschutz
+ * Software engineering by Intevation GmbH
+ *
+ * This file is Free Software under the GNU GPL (v>=3)
+ * and comes with ABSOLUTELY NO WARRANTY! Check out
+ * the documentation coming with IMIS-Labordaten-Application for details.
+ */
+
+/**
+ *
+ */
+Ext.define('Lada.controller.FilterManagement', {
+ extend: 'Ext.app.Controller',
+
+ /**
+ * @private
+ * Initialize the controller.
+ */
+ init: function() {
+ var me = this;
+ this.control({
+ 'filtermanagement grid favcolumn': {
+ checkchange: me.checkchange
+ },
+ 'filtermanagement': {
+ close: me.windowClosed
+ }
+ });
+ },
+
+ checkchange: function(column, ndx, value) {
+ var store = column.up('grid').store;
+ var record = store.getAt(ndx);
+ if (value) {
+ Ext.Ajax.request({
+ url: 'lada-server/rest/favorite',
+ method: 'POST',
+ jsonData: {
+ 'queryId': record.get('id')
+ },
+ success: function() {
+ record.set('favorite', true);
+ }
+ });
+ }
+ else {
+ Ext.Ajax.request({
+ url: 'lada-server/rest/favorite?queryId=' + record.get('id'),
+ method: 'DELETE',
+ success: function() {
+ record.set('favorite', false);
+ }
+ });
+ }
+ },
+
+ windowClosed: function() {
+ var combobox = Ext.ComponentQuery.query('combobox[name=filter]')[0];
+ this.getController('Lada.controller.Filter').updateFilter(combobox);
+ }
+});
diff -r 94a6b5415d73 -r af9879d72310 app/controller/ModeSwitcher.js
--- a/app/controller/ModeSwitcher.js Thu Jan 21 08:59:13 2016 +0100
+++ b/app/controller/ModeSwitcher.js Tue Feb 02 15:25:16 2016 +0100
@@ -46,48 +46,8 @@
filters.removeAll();
filters.hide();
- //Initialise variables which will define the querystore
- // and the store which has to be loaded into the grid.
- var querystorename = '';
-
- // In dependence of the checkboxes input value,
- // define the store of the filter.
- // app/controller/Filter.js contains similar code.
- if (field.inputValue === 'messprogramme' && cbox) {
- querystorename = 'Lada.store.MessprogrammQueries';
- }
- else if (field.inputValue === 'proben' && cbox) {
- querystorename = 'Lada.store.ProbeQueries';
- }
- else if (field.inputValue === 'stammdaten' && cbox) {
- querystorename = 'Lada.store.StammdatenQueries';
- }
-
- if (querystorename) {
- var store = Ext.StoreManager.lookup(querystorename);
-
- if (!store) {
- store = Ext.create(querystorename, {
- //Select first Item on Load
- listeners: {
- load: function(store){
- var records = new Array();
- records.push(store.getAt(0));
-
- cbox.select(records[0]);
- cbox.fireEvent('select', cbox, records);
- }
- }
- });
- }
-
- if (store) {
- if (!store.autoLoad) {
- store.load();
- }
- //cbox.reset();
- cbox.bindStore(store);
- }
- }
+ var filterController = this.getController('Lada.controller.Filter');
+ filterController.mode = field.inputValue;
+ filterController.updateFilter(cbox);
}
});
diff -r 94a6b5415d73 -r af9879d72310 app/model/Query.js
--- a/app/model/Query.js Thu Jan 21 08:59:13 2016 +0100
+++ b/app/model/Query.js Tue Feb 02 15:25:16 2016 +0100
@@ -19,6 +19,8 @@
}, {
name: 'description'
}, {
+ name: 'favorite'
+ }, {
name: 'sql'
}, {
name: 'results'
diff -r 94a6b5415d73 -r af9879d72310 app/store/ProbeQueries.js
--- a/app/store/ProbeQueries.js Thu Jan 21 08:59:13 2016 +0100
+++ b/app/store/ProbeQueries.js Tue Feb 02 15:25:16 2016 +0100
@@ -12,7 +12,7 @@
Ext.define('Lada.store.ProbeQueries', {
extend: 'Ext.data.Store',
model: 'Lada.model.Query',
- autoLoad: true,
+// autoLoad: true,
proxy: {
type: 'rest',
url: 'lada-server/rest/query/probe',
diff -r 94a6b5415d73 -r af9879d72310 app/view/FilterPanel.js
--- a/app/view/FilterPanel.js Thu Jan 21 08:59:13 2016 +0100
+++ b/app/view/FilterPanel.js Tue Feb 02 15:25:16 2016 +0100
@@ -17,7 +17,7 @@
'Ext.layout.container.Column'
],
- title: 'Filter-Auswahl',
+ title: 'Filter',
initComponent: function() {
this.layout = {
type: 'vbox',
@@ -25,24 +25,36 @@
};
var me = this;
this.items = [{
- xtype: 'combobox',
- name: 'filter',
- editable: false,
- store: Ext.create('Lada.store.ProbeQueries',{
- listeners: {
- load: function(s){
- var records = new Array();
- records.push(s.getAt(0));
-
- var combo = me.down('combobox[name=filter]');
- combo.select(records[0]);
- combo.fireEvent('select', combo, records);
- }
- }
- }),
- displayField: 'name',
- valueField: 'id',
- emptyText: 'Wählen Sie eine Abfrage'
+ layout: 'hbox',
+ border: false,
+ items: [{
+ xtype: 'combobox',
+ name: 'filter',
+ editable: false,
+ flex: 1,
+ displayField: 'name',
+ valueField: 'id',
+ queryMode: 'local',
+ emptyText: 'Wählen Sie eine Abfrage'
+ }, {
+ xtype: 'button',
+ action: 'details',
+ enableToggle: true,
+ text: 'Details',
+ margin: '0 0 0 10'
+ }]
+ }, {
+ xtype: 'checkbox',
+ name: 'favorites',
+ boxLabel: 'nur Favoriten',
+ margin: '0, 0, 0, 5',
+ checked: true
+ }, {
+ xtype: 'displayfield',
+ name: 'description',
+ shrinkWrap: 3,
+ margin: '0, 0, 0 ,5',
+ value: '-/-'
}, {
xtype: 'panel',
border: false,
@@ -55,27 +67,31 @@
}, {
xtype: 'button',
action: 'reset',
- text: 'Zurücksetzen'
+ text: 'Zurücksetzen',
+ margin: '0 10 0 0'
+ }, {
+ xtype: 'button',
+ action: 'manage',
+ text: 'Filterauswahl bearbeiten'
}],
hidden: false
- }, {
- xtype: 'panel',
- maxWidth: '500',
- border: false,
- margin: '0 10',
- items: [{
- xtype: 'displayfield',
- name: 'description',
- fieldLabel: 'Beschreibung',
- shrinkWrap: 3,
- value: '-/-'
- }, {
- xtype: 'displayfield',
- name: 'columns',
- fieldLabel: 'Spalten',
- value: '-/-'
- }]
}];
this.callParent(arguments);
+ var combo = me.down('combobox[name=filter]');
+ combo.store = Ext.create('Ext.data.Store', {
+ model: 'Lada.model.Query'
+ });
+ var store = Ext.StoreManager.get('probequeries');
+ store.on('load', function storeLoad () {
+ var entries = store.queryBy(function(record) {
+ if (record.get('favorite')) {
+ return true;
+ }
+ });
+ combo.store.add(entries.items);
+ combo.select(combo.store.getAt(0));
+ combo.fireEvent('select', combo, [combo.store.getAt(0)]);
+ store.un('load', storeLoad);
+ });
}
});
diff -r 94a6b5415d73 -r af9879d72310 app/view/Viewport.js
--- a/app/view/Viewport.js Thu Jan 21 08:59:13 2016 +0100
+++ b/app/view/Viewport.js Tue Feb 02 15:25:16 2016 +0100
@@ -17,7 +17,8 @@
extend: 'Ext.container.Viewport',
requires: [
'Lada.view.ModeSwitcher',
- 'Lada.view.FilterPanel'
+ 'Lada.view.FilterPanel',
+ 'Lada.view.panel.FilterDetails'
],
layout: 'fit',
initComponent: function() {
@@ -66,12 +67,11 @@
margin: '0, 10, 0, 10'
}, {
// Variables settings for the current selected sql statement.
- xtype: 'fieldset',
- name: 'filtervariables',
- title: 'Variablenbelegung',
+ xtype: 'filterdetails',
+ name: 'filterdetails',
+ title: i18n.getMsg('filterdetails.title'),
hidden: true,
- margin: '0, 10, 0, 10',
- items: []
+ margin: '0, 10, 0, 10'
}]
}, {
xtype: 'panel',
diff -r 94a6b5415d73 -r af9879d72310 app/view/panel/FilterDetails.js
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/view/panel/FilterDetails.js Tue Feb 02 15:25:16 2016 +0100
@@ -0,0 +1,63 @@
+/**
+ *
+ */
+Ext.define('Lada.view.panel.FilterDetails', {
+ extend: 'Ext.form.FieldSet',
+ alias: 'widget.filterdetails',
+
+ record: null,
+
+ title: 'test',
+
+ /**
+ * @private
+ * Initialize the view.
+ */
+ initComponent: function() {
+ var me = this;
+ var i18n = Lada.getApplication().bundle;
+ //me.title = i18n.getMsg('filterdetails.title');
+
+ me.items = [{
+ xtype: 'displayfield',
+ margin: '5, 5, 5, 5',
+ name: 'name',
+ fieldLabel: 'Name'
+ }, {
+ xtype: 'displayfield',
+ margin: '0, 5, 5, 5',
+ name: 'beschreibung',
+ fieldLabel: 'Beschreibung'
+ }, {
+ xtype: 'displayfield',
+ margin: '0, 5, 5, 5',
+ name: 'filters',
+ fieldLabel: 'Filter'
+ }, {
+ xtype: 'displayfield',
+ margin: '0, 5, 5, 5',
+ name: 'columns',
+ fieldLabel: 'Spalten'
+ }];
+
+ this.callParent(arguments);
+ },
+
+ setRecord: function(record) {
+ this.record = record;
+ this.down('displayfield[name=name]').setValue(record.get('name'));
+ this.down('displayfield[name=beschreibung]').setValue(record.get('description'));
+ var columnString = [];
+ var value = record.get('results');
+ for (var i = 0; i < value.length; i++) {
+ columnString.push(value[i].header);
+ }
+ this.down('displayfield[name=columns]').setValue(columnString.join(', '));
+ value = record.get('filters');
+ var filterString = [];
+ for (var i = 0; i < value.length; i++) {
+ filterString.push(value[i].label);
+ }
+ this.down('displayfield[name=filters]').setValue(filterString.join(', '));
+ }
+});
diff -r 94a6b5415d73 -r af9879d72310 app/view/widget/base/FavColumn.js
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/view/widget/base/FavColumn.js Tue Feb 02 15:25:16 2016 +0100
@@ -0,0 +1,31 @@
+/* Copyright (C) 2013 by Bundesamt fuer Strahlenschutz
+ * Software engineering by Intevation GmbH
+ *
+ * This file is Free Software under the GNU GPL (v>=3)
+ * and comes with ABSOLUTELY NO WARRANTY! Check out
+ * the documentation coming with IMIS-Labordaten-Application for details.
+ */
+
+Ext.define('Lada.view.widget.base.FavColumn', {
+ extend: 'Ext.grid.column.CheckColumn',
+ alias: 'widget.favcolumn',
+/*
+ constructor: function() {
+ this.addEvents(
+ 'checkchange'
+ );
+ this.callParent(arguments);
+ },
+*/
+ renderer: function(value, metaData, record) {
+ var cssPrefix = Ext.baseCSSPrefix;
+ var cls = [cssPrefix + 'grid-checkheader'];
+ if (value) {
+ cls.push(cssPrefix + 'grid-favcolumn-checked');
+ }
+ else {
+ cls.push(cssPrefix + 'grid-favcolumn-unchecked');
+ }
+ return '<div class="' + cls.join(' ') + '"> </div>';
+ }
+});
diff -r 94a6b5415d73 -r af9879d72310 app/view/window/FilterManagement.js
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/app/view/window/FilterManagement.js Tue Feb 02 15:25:16 2016 +0100
@@ -0,0 +1,167 @@
+/* Copyright (C) 2013 by Bundesamt fuer Strahlenschutz
+ * Software engineering by Intevation GmbH
+ *
+ * This file is Free Software under the GNU GPL (v>=3)
+ * and comes with ABSOLUTELY NO WARRANTY! Check out
+ * the documentation coming with IMIS-Labordaten-Application for details.
+ */
+
+/**
+ *
+ */
+Ext.define('Lada.view.window.FilterManagement', {
+ extend: 'Ext.window.Window',
+ alias: 'widget.filtermanagement',
+
+ requires: [
+ 'Lada.view.widget.base.FavColumn'
+ ],
+
+ layout: 'fit',
+ width: window.innerWidth - 100,
+ height: 500,
+ closeAction: 'hide',
+
+ /**
+ * @private
+ * Initialize the view.
+ */
+ initComponent: function() {
+ var i18n = Lada.getApplication().bundle;
+ var me = this;
+ this.buttons = [{
+ text: i18n.getMsg('close'),
+ scope: this,
+ handler: this.close
+ }];
+ var probenstore = Ext.StoreManager.get('probequeries');
+ var messpstore = Ext.StoreManager.get('messprogrammqueries');
+ var stammstore = Ext.StoreManager.get('stammdatenqueries');
+ me.items = [{
+ xtype: 'tabpanel',
+ items: [{
+ title: i18n.getMsg('querygrid.probe.title'),
+ xtype: 'grid',
+ viewConfig: {
+ markDirty: false,
+ getRowClass: function() {
+ return 'x-lada-multiline-grid';
+ }
+ },
+ store: probenstore,
+ columns: [{
+ header: i18n.getMsg('querygrid.header.favorite'),
+ width: 48,
+ dataIndex: 'favorite',
+ xtype: 'favcolumn'
+ }, {
+ header: i18n.getMsg('querygrid.header.name'),
+ dataIndex: 'name',
+ width: 200
+ }, {
+ header: i18n.getMsg('querygrid.header.description'),
+ dataIndex: 'description',
+ minWidth: 200,
+ flex: 3
+ }, {
+ header: i18n.getMsg('querygrid.header.columns'),
+ dataIndex: 'results',
+ width: 250,
+ flex: 2,
+ renderer: function(value) {
+ var columnString = [];
+ for (var i = 0; i < value.length; i++) {
+ columnString.push(value[i].header);
+ }
+ return columnString.join(', ');
+ }
+ }, {
+ header: i18n.getMsg('querygrid.header.filters'),
+ dataIndex: 'filters',
+ width: 200,
+ renderer: function(value) {
+ var columnString = [];
+ for (var i = 0; i < value.length; i++) {
+ columnString.push(value[i].label);
+ }
+ return columnString.join(', ');
+ }
+ }]
+ }, {
+ title: i18n.getMsg('querygrid.messprogramm.title'),
+ xtype: 'grid',
+ viewConfig: {
+ markDirty: false,
+ getRowClass: function() {
+ return 'x-lada-multiline-grid';
+ }
+ },
+ store: messpstore,
+ columns: [{
+ header: i18n.getMsg('querygrid.header.favorite'),
+ width: 48,
+ dataIndex: 'favorite',
+ xtype: 'favcolumn'
+ }, {
+ header: i18n.getMsg('querygrid.header.name'),
+ dataIndex: 'name',
+ width: 200
+ }, {
+ header: i18n.getMsg('querygrid.header.description'),
+ dataIndex: 'description',
+ minWidth: 200,
+ flex: 3
+ }, {
+ header: i18n.getMsg('querygrid.header.columns'),
+ dataIndex: 'results',
+ width: 250,
+ flex: 2,
+ renderer: function(value) {
+ var columnString = [];
+ for (var i = 0; i < value.length; i++) {
+ columnString.push(value[i].header);
+ }
+ return columnString.join(', ');
+ }
+ }, {
+ header: i18n.getMsg('querygrid.header.filters'),
+ dataIndex: 'filters',
+ width: 200,
+ renderer: function(value) {
+ var columnString = [];
+ for (var i = 0; i < value.length; i++) {
+ columnString.push(value[i].label);
+ }
+ return columnString.join(', ');
+ }
+ }]
+ }, {
+ title: i18n.getMsg('querygrid.stammdaten.title'),
+ xtype: 'grid',
+ viewConfig: {
+ markDirty: false,
+ getRowClass: function() {
+ return 'x-lada-multiline-grid';
+ }
+ },
+ store: stammstore,
+ columns: [{
+ header: i18n.getMsg('querygrid.header.favorite'),
+ width: 48,
+ dataIndex: 'favorite',
+ xtype: 'favcolumn'
+ }, {
+ header: i18n.getMsg('querygrid.header.name'),
+ dataIndex: 'name',
+ width: 200
+ }, {
+ header: i18n.getMsg('querygrid.header.description'),
+ dataIndex: 'description',
+ flex: 1
+ }]
+ }]
+ }];
+
+ this.callParent(arguments);
+ }
+});
diff -r 94a6b5415d73 -r af9879d72310 resources/css/lada.css
--- a/resources/css/lada.css Thu Jan 21 08:59:13 2016 +0100
+++ b/resources/css/lada.css Tue Feb 02 15:25:16 2016 +0100
@@ -14,6 +14,10 @@
border-color: #FF0000;
}
+.x-lada-multiline-grid .x-grid-cell-inner{
+ white-space: normal !important;
+}
+
.window-inactive .x-window-header-text {color: #a9a9a9;}
@@ -34,6 +38,21 @@
background-image: url(../img/view-time-schedule-edit.png);
}
+.x-grid-checkheader {
+ height: 16px;
+ background-image: url('images/unchecked.gif');
+ background-position: 50%;
+ background-repeat: no-repeat;
+ background-color: transparent;
+}
+
+.x-grid-favcolumn-checked {
+ background-image: url(../img/favorites.png);
+}
+
+.x-grid-favcolumn-unchecked {
+ background-image: url(../img/favorites_off.png);
+}
/* do not display clear-button (x) in IE10+ Input fields */
::-ms-clear {
diff -r 94a6b5415d73 -r af9879d72310 resources/i18n/Lada_de-DE.properties
--- a/resources/i18n/Lada_de-DE.properties Thu Jan 21 08:59:13 2016 +0100
+++ b/resources/i18n/Lada_de-DE.properties Tue Feb 02 15:25:16 2016 +0100
@@ -236,3 +236,13 @@
pn.gridTitle:Probenehmer
pn.button.add:Probenehmer hinzufügen
pn.button.delete:Probenehmer löschen
+
+filterdetails.title:Filterdetails
+querygrid.header.favorite:Favorit
+querygrid.header.name:Name
+querygrid.header.description:Beschreibung
+querygrid.header.columns:Spalten
+querygrid.header.filters:Filter
+querygrid.probe.title:Probenfilter
+querygrid.messprogramm.title:Messprogrammfilter
+querygrid.stammdaten.title:Stammdatenfilter
More information about the Lada-commits
mailing list