Mercurial > lada > lada-client
changeset 1274:a792eecf1614
Updated Layout and Map for 'ortsbezug'-window. WIP!
| author | Raimund Renkert <raimund.renkert@intevation.de> |
|---|---|
| date | Tue, 10 Jan 2017 10:03:57 +0100 |
| parents | a4c1a9862a88 |
| children | 1df7a0899ebe |
| files | app/controller/form/Ortszuordnung.js app/view/form/Ortszuordnung.js app/view/grid/Ortszuordnung.js app/view/panel/Map.js app/view/window/Ortszuordnung.js resources/i18n/Lada_de-DE.properties |
| diffstat | 6 files changed, 219 insertions(+), 86 deletions(-) [+] |
line wrap: on
line diff
--- a/app/controller/form/Ortszuordnung.js Wed Dec 14 10:21:48 2016 +0100 +++ b/app/controller/form/Ortszuordnung.js Tue Jan 10 10:03:57 2017 +0100 @@ -18,7 +18,7 @@ init: function() { this.control({ 'ortszuordnungform button[action=setOrt]': { - toggle: this.pickOrt + toggle: this.chooseLocation }, 'ortszuordnungform button[action=save]': { click: this.save @@ -143,6 +143,22 @@ } }, + chooseLocation: function(button, pressed, opts) { + var win = button.up('window'); + var gridPanel = win.down('panel[name=ortgrid]'); + if (pressed) { + win.setHeight(Ext.getBody().getViewSize().height - 50); + win.setY(25); + gridPanel.show(); + } + else { + var y = (Ext.getBody().getViewSize().height - 465) / 2 + win.setHeight(465); + win.setY(y); + gridPanel.hide(); + } + }, + /** * The dirtyForm function enables or disables the save and discard
--- a/app/view/form/Ortszuordnung.js Wed Dec 14 10:21:48 2016 +0100 +++ b/app/view/form/Ortszuordnung.js Tue Jan 10 10:03:57 2017 +0100 @@ -21,7 +21,7 @@ ], layout: 'fit', - margin: 5, + margin: '5, 5, 0, 5', border: 0, record: null, @@ -70,65 +70,92 @@ }], items: [{ layout: 'vbox', - border: 0, - margin: '0, 10, 0, 0', - items: [{ - xtype: 'tfield', - labelWidth: 125, - maxLength: 100, - name: 'ortszusatztext', - fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszusatztext') - }, { - xtype: 'textfield', - labelWidth: 125, - maxLength: 1, - allowBlank: false, - regex: /[UEZA]/, - activeError: 'U, E, Z oder A eingeben', - name: 'ortszuordnungTyp', - fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszuordnungtyp') - }, { - xtype: 'textfield', - submitValue: true, - readOnly: true, - hidden: true, - name: 'ortId' - }] - }, { - layout: 'vbox', - flex: 1, - margin: '0, 10, 0, 0', + autoscroll: true, border: 0, items: [{ - xtype: 'displayfield', - labelWidth: 125, - fieldLabel: i18n.getMsg('orte.gemeinde'), - name: 'gemeinde' + layout: 'vbox', + border: 0, + margin: '0, 10, 0, 0', + items: [{ + xtype: 'tfield', + labelWidth: 125, + maxLength: 100, + name: 'ortszusatztext', + fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszusatztext') + }, { + xtype: 'textfield', + labelWidth: 125, + maxLength: 1, + allowBlank: false, + regex: /[UEZA]/, + activeError: 'U, E, Z oder A eingeben', + name: 'ortszuordnungTyp', + fieldLabel: i18n.getMsg('ortszuordnung.form.field.ortszuordnungtyp') + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.ortid'), + submitValue: true, + name: 'ortId' + }] }, { - xtype: 'displayfield', - labelWidth: 125, - fieldLabel: i18n.getMsg('staat'), - name: 'staat' - }] - }, { - layout: 'vbox', - flex: 1, - margin: '0, 10, 0, 0', - border: 0, - items: [{ - xtype: 'displayfield', - labelWidth: 125, - fieldLabel: i18n.getMsg('orte.lon'), - name: 'lon' - }, { - xtype: 'displayfield', - labelWidth: 125, - fieldLabel: i18n.getMsg('orte.lat'), - name: 'lat' + layout: 'vbox', + flex: 1, + margin: '0, 10, 0, 0', + border: 0, + items: [{ + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.kurztext'), + name: 'kurztext' + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.langtext'), + name: 'langtext' + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('staat'), + name: 'staatISO' + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.gemeinde'), + name: 'gemeinde' + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.gemeindename'), + name: 'gemeinde' + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.kda'), + name: 'kdaId' + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.koordx'), + name: 'koordXExtern' + }, { + xtype: 'displayfield', + labelWidth: 125, + fieldLabel: i18n.getMsg('orte.koordy'), + name: 'koordYExtern' + }] }] }] - }] - }]; + //}, { + // layout: 'vbox', + // flex: 1, + // margin: '0, 10, 0, 0', + // border: 0, + // items: [{ + // xtype: '' + // }] + }] + }]; this.callParent(arguments); },
--- a/app/view/grid/Ortszuordnung.js Wed Dec 14 10:21:48 2016 +0100 +++ b/app/view/grid/Ortszuordnung.js Tue Jan 10 10:03:57 2017 +0100 @@ -73,7 +73,7 @@ header: 'Ort-ID', dataIndex: 'ortId', flex: 2, - renderer: function(value) { + renderer: function(value, meta, zuordnung) { var store = Ext.data.StoreManager.get('orte'); var record = store.getById(value); if (!record) {
--- a/app/view/panel/Map.js Wed Dec 14 10:21:48 2016 +0100 +++ b/app/view/panel/Map.js Tue Jan 10 10:03:57 2017 +0100 @@ -29,10 +29,11 @@ * OpenLayers map options. */ mapOptions: { - maxExtent: new OpenLayers.Bounds(2.9, 42.95, 18.1, 60.6), - scales: [5000000, 3000000, 2000000, 1000000, 500000, 250000, 100000, 25000], - units: 'dd', - projection: new OpenLayers.Projection('EPSG:4326') + maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34), + //scales: [5000000, 3000000, 2000000, 1000000, 500000, 250000, 100000, 25000], + //numZoomLevels: 7, + projection: 'EPSG:3857', + displayProjection: new OpenLayers.Projection('EPSG:4326') }, @@ -43,17 +44,16 @@ initComponent: function() { var id = Ext.id(); this.layers = [ - new OpenLayers.Layer.WMS( + new OpenLayers.Layer.TMS( 'Standard' + id, - 'http://osm.intevation.de/cgi-bin/standard.fcgi?', + 'http://www.imis.bfs.de/mapcache/tms/', { - layers: 'OSM-WMS-Dienst', - format: 'image/png', - BGCOLOR: '0xFFFFFF' - }, { + layername: 'osm_bfs_google@GoogleMapsCompatible', isBaseLayer: true, - buffer: 0, - visibility: true + displayInLayerSwitcher: false, + type: 'png', + visibility: true, + projection: 'EPSG:3857', }) ]; this.map = new OpenLayers.Map('map_' + id, { @@ -138,7 +138,7 @@ // Create a new Feature Layer and add it to the map if (!this.featureLayer) { - this.featureLayer = new OpenLayers.Layer.Vector('vector_' + this.map.name, { + this.featureLayer = new OpenLayers.Layer.Vector('alle Messpunkte', { styleMap: new OpenLayers.StyleMap({ 'default': new OpenLayers.Style(OpenLayers.Util.applyDefaults({ externalGraphic: 'resources/lib/OpenLayers/img/marker-green.png', @@ -157,7 +157,11 @@ fontColor: 'blue', fontWeight: 'bold' }) - }) + }), + projection: new OpenLayers.Projection('EPSG:4326'), + preFeatureInsert: function(feature) { + feature.geometry.transform(new OpenLayers.Projection('EPSG:4326'), new OpenLayers.Projection('EPSG:3857')); + } }); this.selectControl = new OpenLayers.Control.SelectFeature(this.featureLayer, { clickout: false,
--- a/app/view/window/Ortszuordnung.js Wed Dec 14 10:21:48 2016 +0100 +++ b/app/view/window/Ortszuordnung.js Tue Jan 10 10:03:57 2017 +0100 @@ -21,7 +21,7 @@ collapsible: true, maximizable: true, autoshow: true, - layout: 'vbox', + layout: 'fit', constrain: true, probe: null, @@ -68,7 +68,7 @@ handler: this.close }]; this.width = 900; - this.height = 515; + this.height = 465; this.bodyStyle = {background: '#fff'}; // add listeners to change the window appearence when it becomes inactive @@ -81,16 +81,61 @@ } }); + this.items = [{ - xtype: 'ortszuordnungform', - layout: 'fit', - width: '100%', - margin: 5 - }, { - xtype: 'ortpanel', - flex: 1, - toolbarPos: 'bottom', - margin: 5 + layout: 'border', + bodyStyle: {background: '#fff'}, + border: 0, + items: [{ + xtype: 'map', + region: 'center', + layout: 'border', + margin: '13, 5, 10, 5', + minHeight: 380, + externalOrteStore: true + }, { + xtype: 'ortszuordnungform', + region: 'east', + minHeight: 380, + }, { + region: 'south', + border: 0, + layout: 'fit', + name: 'ortgrid', + hidden: true, + maxHeight: '45%', + items: [{ + xtype: 'ortstammdatengrid', + maxHeight: '45%' + }], + dockedItems: [{ + xtype: 'toolbar', + dock: 'bottom', + border: '0, 1, 1, 1', + style: { + borderBottom: '1px solid #b5b8c8 !important', + borderLeft: '1px solid #b5b8c8 !important', + borderRight: '1px solid #b5b8c8 !important' + }, + items: [{ + xtype: 'textfield', + labelWidth: 50, + fieldLabel: i18n.getMsg('ortszuordnung.ortsuche'), + }, '->', { + text: i18n.getMsg('orte.new'), + action: 'createort', + }, { + text: i18n.getMsg('orte.frommap'), + action: 'frommap', + }, { + text: i18n.getMsg('orte.clone'), + action: 'clone', + }, { + text: i18n.getMsg('orte.select'), + action: 'select', + }] + }] + }] }]; this.callParent(arguments); }, @@ -99,6 +144,7 @@ * Initialise the Data of this Window */ initData: function() { + var me = this; if (!this.record) { this.record = Ext.create('Lada.model.Ortszuordnung'); if (!this.record.get('letzteAenderung')) { @@ -107,7 +153,36 @@ this.record.set('probeId', this.probe.get('id')); } this.down('ortszuordnungform').setRecord(this.record); - this.down('ortpanel').setStore(); + var map = this.down('map'); + var osg = this.down('ortstammdatengrid'); + var ortstore = Ext.create('Lada.store.Orte', { + defaultPageSize: 0, + autoLoad: false, + listeners: { + beforeload: { + fn: function() { + osg.setLoading(true); + map.setLoading(true); + } + }, + load: { + fn: function() { + osg.setLoading(false); + map.setLoading(false); + osg.setStore(ortstore); + var store = Ext.create('Lada.store.Orte', { + autoLoad: false + }); + store.add(ortstore.getRange()); + var rec = store.getById(me.record.get('ortId')); + store.remove(rec); + console.log(rec); + map.addLocations(store); + } + } + } + }); + ortstore.load(); }, /** @@ -116,8 +191,9 @@ */ afterRender: function(){ this.superclass.afterRender.apply(this, arguments); - var map = this.down('ortpanel').down('map'); - map.map.zoomToMaxExtent(); + var map = this.down('map'); + map.map.addControl(new OpenLayers.Control.LayerSwitcher()); + //map.map.zoomToMaxExtent(); }, /**
--- a/resources/i18n/Lada_de-DE.properties Wed Dec 14 10:21:48 2016 +0100 +++ b/resources/i18n/Lada_de-DE.properties Tue Jan 10 10:03:57 2017 +0100 @@ -149,10 +149,20 @@ ortszuordnung.form.fset.title:Ortszuordnung ortszuordnung.form.field.ortszusatztext:Ortszusatztext ortszuordnung.form.field.ortszuordnungtyp:Typ der Ortszuordnung -ortszuordnung.form.setOrt:Neuen Ort setzen +ortszuordnung.form.setOrt: Zuordnung ändern ortszuordnung.form.setOrt.qtip:Wenn dieser Button gedrückt ist, kann der neue Ort durch Auswahl in der unten stehenden Liste gewählt werden. ortszuordnung.form.setOrt.pressed:Ort wählen orte.gemeinde:Gemeinde +orte.ortid:Id +orte.gemeindename:Name +orte.kda:Koordinatenart +orte.koordx:X-Koordinate +orte.koordy:Y-Koordinate +orte.new:Neuer Messpunkt +orte.frommap:Messpunkt aus Karte +orte.clone:Ähnlicher Messpunkt +orte.select:Messpunkt auswählen +ortszuordnung.ortsuche:Suche staat:Staat orte.lat:Breitengrad orte.lon:Längengrad