Group device fields

1 files changed, 54 insertions, 44 deletions

diff --git a/web/app/view/DeviceDialog.js b/web/app/view/DeviceDialog.js
index 705ab923..2b29e30d 100644
--- a/web/app/view/DeviceDialog.js
+++ b/web/app/view/DeviceDialog.js
@@ -23,52 +23,62 @@ Ext.define('Traccar.view.DeviceDialog', {
     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: 'textfield',
+                name: 'uniqueId',
+                fieldLabel: Strings.deviceIdentifier,
+                allowBlank: false
+            }]
         }, {
-            xtype: 'textfield',
-            name: 'uniqueId',
-            fieldLabel: Strings.deviceIdentifier,
-            allowBlank: false
-        }, {
-            xtype: 'combobox',
-            name: 'groupId',
-            fieldLabel: Strings.groupParent,
-            store: 'Groups',
-            queryMode: 'local',
-            displayField: 'name',
-            valueField: 'id'
-        }, {
-            xtype: 'textfield',
-            name: 'phone',
-            fieldLabel: Strings.sharedPhone
-        }, {
-            xtype: 'textfield',
-            name: 'model',
-            fieldLabel: Strings.deviceModel
-        }, {
-            xtype: 'textfield',
-            name: 'contact',
-            fieldLabel: Strings.deviceContact
-        }, {
-            xtype: 'combobox',
-            name: 'category',
-            fieldLabel: Strings.deviceCategory,
-            store: 'DeviceImages',
-            queryMode: 'local',
-            displayField: 'name',
-            valueField: 'key',
-            editable: false,
-            listConfig: {
-                getInnerTpl: function () {
-                    return '<table><tr valign="middle" ><td><div align="center" style="width:40px;height:40px;" >' +
-                    '{[new XMLSerializer().serializeToString(Traccar.DeviceImages.getImageSvg(' +
-                    'Traccar.Style.mapColorOnline, false, 0, values.key))]}</div></td>' +
-                    '<td>- {name}</td></tr></table>';
+            xtype: 'fieldset',
+            title: Strings.sharedPreferences,
+            collapsible: true,
+            collapsed: true,
+            items: [{
+                xtype: 'combobox',
+                name: 'groupId',
+                fieldLabel: Strings.groupParent,
+                store: 'Groups',
+                queryMode: 'local',
+                displayField: 'name',
+                valueField: 'id'
+            }, {
+                xtype: 'textfield',
+                name: 'phone',
+                fieldLabel: Strings.sharedPhone
+            }, {
+                xtype: 'textfield',
+                name: 'model',
+                fieldLabel: Strings.deviceModel
+            }, {
+                xtype: 'textfield',
+                name: 'contact',
+                fieldLabel: Strings.deviceContact
+            }, {
+                xtype: 'combobox',
+                name: 'category',
+                fieldLabel: Strings.deviceCategory,
+                store: 'DeviceImages',
+                queryMode: 'local',
+                displayField: 'name',
+                valueField: 'key',
+                editable: false,
+                listConfig: {
+                    getInnerTpl: function () {
+                        return '<table><tr valign="middle" ><td><div align="center" style="width:40px;height:40px;" >' +
+                        '{[new XMLSerializer().serializeToString(Traccar.DeviceImages.getImageSvg(' +
+                        'Traccar.Style.mapColorOnline, false, 0, values.key))]}</div></td>' +
+                        '<td>- {name}</td></tr></table>';
+                    }
                 }
-            }
+            }]
         }]
     }
 });