Group fields in Group and Calendar dialog

2 files changed, 44 insertions, 30 deletions

diff --git a/web/app/view/CalendarDialog.js b/web/app/view/CalendarDialog.js
index 795c2c62..93c2d429 100644
--- a/web/app/view/CalendarDialog.js
+++ b/web/app/view/CalendarDialog.js
@@ -29,25 +29,29 @@ Ext.define('Traccar.view.CalendarDialog', {
     items: {
         xtype: 'form',
         items: [{
-            xtype: 'textfield',
-            name: 'name',
-            fieldLabel: Strings.sharedName,
-            allowBlank: false
-        }, {
-            xtype: 'filefield',
-            name: 'file',
-            fieldLabel: Strings.sharedFile,
-            allowBlank: false,
-            buttonConfig: {
-                glyph: 'xf093@FontAwesome',
-                text: '',
-                tooltip: Strings.sharedSelectFile,
-                tooltipType: 'title',
-                minWidth: 0
-            },
-            listeners: {
-                change: 'onFileChange'
-            }
+            xtype: 'fieldset',
+            title: Strings.sharedRequired,
+            items: [{
+                xtype: 'textfield',
+                name: 'name',
+                fieldLabel: Strings.sharedName,
+                allowBlank: false
+            }, {
+                xtype: 'filefield',
+                name: 'file',
+                fieldLabel: Strings.sharedFile,
+                allowBlank: false,
+                buttonConfig: {
+                    glyph: 'xf093@FontAwesome',
+                    text: '',
+                    tooltip: Strings.sharedSelectFile,
+                    tooltipType: 'title',
+                    minWidth: 0
+                },
+                listeners: {
+                    change: 'onFileChange'
+                }
+            }]
         }, {
             xtype: 'hiddenfield',
             name: 'data',
diff --git a/web/app/view/GroupDialog.js b/web/app/view/GroupDialog.js
index 01fdc85e..95102302 100644
--- a/web/app/view/GroupDialog.js
+++ b/web/app/view/GroupDialog.js
@@ -23,18 +23,28 @@ Ext.define('Traccar.view.GroupDialog', {
     items: {
         xtype: 'form',
         items: [{
-            xtype: 'textfield',
-            name: 'name',
-            fieldLabel: Strings.sharedName,
-            allowBlank: false
+            xtype: 'fieldset',
+            title: Strings.sharedRequired,
+            items: [{
+                xtype: 'textfield',
+                name: 'name',
+                fieldLabel: Strings.sharedName,
+                allowBlank: false
+            }]
         }, {
-            xtype: 'combobox',
-            name: 'groupId',
-            fieldLabel: Strings.groupParent,
-            store: 'Groups',
-            queryMode: 'local',
-            displayField: 'name',
-            valueField: 'id'
+            xtype: 'fieldset',
+            title: Strings.sharedExtra,
+            collapsible: true,
+            collapsed: true,
+            items: [{
+                xtype: 'combobox',
+                name: 'groupId',
+                fieldLabel: Strings.groupParent,
+                store: 'Groups',
+                queryMode: 'local',
+                displayField: 'name',
+                valueField: 'id'
+            }]
         }]
     }
 });