Reduce width of report config dialog

2 files changed, 8 insertions, 12 deletions

diff --git a/web/app/Style.js b/web/app/Style.js
index 302e6d4c..2c04b83b 100644
--- a/web/app/Style.js
+++ b/web/app/Style.js
@@ -25,6 +25,8 @@ Ext.define('Traccar.Style', {
     windowWidth: 640,
     windowHeight: 480,
 
+    formFieldWidth: 277,
+
     dateTimeFormat24: 'Y-m-d H:i:s',
     dateTimeFormat12: 'Y-m-d g:i:s a',
     timeFormat24: 'H:i',
@@ -35,7 +37,6 @@ Ext.define('Traccar.Style', {
     deviceWidth: 350,
 
     reportHeight: 250,
-    reportTime: 100,
 
     columnWidthNormal: 100,
 
@@ -78,7 +79,6 @@ Ext.define('Traccar.Style', {
     coordinatePrecision: 6,
     numberPrecision: 2,
 
-    reportTagfieldWidth: 375,
     reportGridStyle: 'borderTop: 1px solid lightgray',
 
     chartPadding: '20 40 10 10',
diff --git a/web/app/view/ReportConfigDialog.js b/web/app/view/ReportConfigDialog.js
index 421d0fe0..40a69590 100644
--- a/web/app/view/ReportConfigDialog.js
+++ b/web/app/view/ReportConfigDialog.js
@@ -30,8 +30,8 @@ Ext.define('Traccar.view.ReportConfigDialog', {
     items: [{
         fieldLabel: Strings.reportDevice,
         xtype: 'tagfield',
-        width: Traccar.Style.reportTagfieldWidth,
         reference: 'deviceField',
+        maxWidth: Traccar.Style.formFieldWidth,
         store: 'Devices',
         valueField: 'id',
         displayField: 'name',
@@ -39,8 +39,8 @@ Ext.define('Traccar.view.ReportConfigDialog', {
     }, {
         fieldLabel: Strings.reportGroup,
         xtype: 'tagfield',
-        width: Traccar.Style.reportTagfieldWidth,
         reference: 'groupField',
+        maxWidth: Traccar.Style.formFieldWidth,
         store: 'Groups',
         valueField: 'id',
         displayField: 'name',
@@ -48,7 +48,6 @@ Ext.define('Traccar.view.ReportConfigDialog', {
     }, {
         fieldLabel: Strings.reportEventTypes,
         xtype: 'tagfield',
-        width: Traccar.Style.reportTagfieldWidth,
         reference: 'eventTypeField',
         store: 'ReportEventTypes',
         hidden: true,
@@ -58,7 +57,6 @@ Ext.define('Traccar.view.ReportConfigDialog', {
     }, {
         fieldLabel: Strings.reportChartType,
         xtype: 'combobox',
-        width: Traccar.Style.reportTagfieldWidth,
         reference: 'chartTypeField',
         store: 'ReportChartTypes',
         hidden: true,
@@ -75,10 +73,10 @@ Ext.define('Traccar.view.ReportConfigDialog', {
         value: false
     }, {
         xtype: 'fieldcontainer',
-        layout: 'hbox',
+        layout: 'vbox',
+        fieldLabel: Strings.reportFrom,
         items: [{
             xtype: 'datefield',
-            fieldLabel: Strings.reportFrom,
             reference: 'fromDateField',
             startDay: Traccar.Style.weekStartDay,
             format: Traccar.Style.dateFormat,
@@ -86,15 +84,14 @@ Ext.define('Traccar.view.ReportConfigDialog', {
         }, {
             xtype: 'customTimeField',
             reference: 'fromTimeField',
-            maxWidth: Traccar.Style.reportTime,
             value: new Date(new Date().getTime() - 30 * 60 * 1000)
         }]
     }, {
         xtype: 'fieldcontainer',
-        layout: 'hbox',
+        layout: 'vbox',
+        fieldLabel: Strings.reportTo,
         items: [{
             xtype: 'datefield',
-            fieldLabel: Strings.reportTo,
             reference: 'toDateField',
             startDay: Traccar.Style.weekStartDay,
             format: Traccar.Style.dateFormat,
@@ -102,7 +99,6 @@ Ext.define('Traccar.view.ReportConfigDialog', {
         }, {
             xtype: 'customTimeField',
             reference: 'toTimeField',
-            maxWidth: Traccar.Style.reportTime,
             value: new Date()
         }]
     }],