Revert device panel back to grid

4 files changed, 24 insertions, 134 deletions

diff --git a/web/app/Application.js b/web/app/Application.js
index 3e3da0569..69ce8f891 100644
--- a/web/app/Application.js
+++ b/web/app/Application.js
@@ -36,7 +36,6 @@ Ext.define('Traccar.Application', {
     stores: [
         'Groups',
         'Devices',
-        'DevicesTree',
         'AllGroups',
         'AllDevices',
         'Positions',
diff --git a/web/app/store/DevicesTree.js b/web/app/store/DevicesTree.js
deleted file mode 100644
index eaf451a3e..000000000
--- a/web/app/store/DevicesTree.js
+++ /dev/null
@@ -1,100 +0,0 @@
-/*
- * Copyright 2016 Anton Tananaev (anton.tananaev@gmail.com)
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-Ext.define('Traccar.store.DevicesTree', {
-    extend: 'Ext.data.TreeStore',
-
-    parentIdProperty: 'groupId',
-
-    proxy: {
-        type: 'memory',
-        reader: {
-            type: 'json'
-        }
-    },
-
-    constructor: function () {
-        this.callParent(arguments);
-
-        Ext.getStore('Groups').on({
-            scope: this,
-            load: this.onGroupLoad,
-            update: this.onGroupUpdate
-        });
-
-        Ext.getStore('Devices').on({
-            scope: this,
-            load: this.onDeviceLoad,
-            update: this.onDeviceUpdate
-        });
-    },
-
-    reloadData: function () {
-        var groupsStore, devicesStore, nodes = [];
-        groupsStore = Ext.getStore('Groups');
-        devicesStore = Ext.getStore('Devices');
-
-        groupsStore.each(function (record) {
-            var groupId, node = {
-                id: 'g' + record.get('id'),
-                original: record,
-                name: record.get('name'),
-                leaf: true
-            };
-            groupId = record.get('groupId');
-            if (groupId !== 0 && groupsStore.indexOfId(groupId) !== -1) {
-                node.groupId = 'g' + groupId;
-            }
-            nodes.push(node);
-        }, this);
-        devicesStore.each(function (record) {
-            var groupId, node = {
-                id: 'd' + record.get('id'),
-                original: record,
-                name: record.get('name'),
-                status: record.get('status'),
-                lastUpdate: record.get('lastUpdate'),
-                leaf: true
-            };
-            groupId = record.get('groupId');
-            if (groupId !== 0 && groupsStore.indexOfId(groupId) !== -1) {
-                node.groupId = 'g' + groupId;
-            }
-            nodes.push(node);
-        }, this);
-
-        this.getProxy().setData(nodes);
-        this.load();
-    },
-
-    onGroupLoad: function () {
-        console.log('onGroupLoad');
-        this.reloadData();
-    },
-
-    onDeviceLoad: function () {
-        console.log('onDeviceLoad');
-        this.reloadData();
-    },
-
-    onGroupUpdate: function () {
-        console.log('onGroupUpdate');
-    },
-
-    onDeviceUpdate: function () {
-        console.log('onDeviceUpdate');
-    }
-});
diff --git a/web/app/view/Devices.js b/web/app/view/Devices.js
index 70e11aab5..eeaaf901b 100644
--- a/web/app/view/Devices.js
+++ b/web/app/view/Devices.js
@@ -15,7 +15,7 @@
  */
 
 Ext.define('Traccar.view.Devices', {
-    extend: 'Ext.tree.Panel',
+    extend: 'Ext.grid.Panel',
     xtype: 'devicesView',
 
     requires: [
@@ -26,7 +26,7 @@ Ext.define('Traccar.view.Devices', {
 
     controller: 'devices',
     rootVisible: false,
-    store: 'DevicesTree',
+    store: 'Devices',
 
     title: Strings.deviceTitle,
     selType: 'rowmodel',
@@ -80,12 +80,10 @@ Ext.define('Traccar.view.Devices', {
     }],*/
 
     listeners: {
-        selectionchange: 'onSelectionChange',
-        beforeselect: 'onBeforeSelect'
+        selectionchange: 'onSelectionChange'
     },
 
     columns: [{
-        xtype: 'treecolumn',
         text: Strings.sharedName,
         dataIndex: 'name',
         flex: 1
@@ -94,23 +92,21 @@ Ext.define('Traccar.view.Devices', {
         dataIndex: 'lastUpdate',
         flex: 1,
         renderer: function (value, metaData, record) {
-            if (record.get('original') instanceof Traccar.model.Device) {
-                switch (record.get('status')) {
-                    case 'online':
-                        metaData.tdCls = 'status-color-online';
-                        break;
-                    case 'offline':
-                        metaData.tdCls = 'status-color-offline';
-                        break;
-                    default:
-                        metaData.tdCls = 'status-color-unknown';
-                        break;
-                }
-                if (Traccar.app.getPreference('twelveHourFormat', false)) {
-                    return Ext.Date.format(value, Traccar.Style.dateTimeFormat12);
-                } else {
-                    return Ext.Date.format(value, Traccar.Style.dateTimeFormat24);
-                }
+            switch (record.get('status')) {
+                case 'online':
+                    metaData.tdCls = 'status-color-online';
+                    break;
+                case 'offline':
+                    metaData.tdCls = 'status-color-offline';
+                    break;
+                default:
+                    metaData.tdCls = 'status-color-unknown';
+                    break;
+            }
+            if (Traccar.app.getPreference('twelveHourFormat', false)) {
+                return Ext.Date.format(value, Traccar.Style.dateTimeFormat12);
+            } else {
+                return Ext.Date.format(value, Traccar.Style.dateTimeFormat24);
             }
         }
     }]
diff --git a/web/app/view/DevicesController.js b/web/app/view/DevicesController.js
index 864e3f2aa..948a5d14e 100644
--- a/web/app/view/DevicesController.js
+++ b/web/app/view/DevicesController.js
@@ -44,7 +44,7 @@ Ext.define('Traccar.view.DevicesController', {
     onAddClick: function () {
         var device, dialog;
         device = Ext.create('Traccar.model.Device');
-        device.store = Ext.getStore('Devices');
+        device.store = this.getView().getStore();
         dialog = Ext.create('Traccar.view.DeviceDialog');
         dialog.down('form').loadRecord(device);
         dialog.show();
@@ -52,14 +52,14 @@ Ext.define('Traccar.view.DevicesController', {
 
     onEditClick: function () {
         var device, dialog;
-        device = this.getView().getSelectionModel().getSelection()[0].get('original');
+        device = this.getView().getSelectionModel().getSelection()[0];
         dialog = Ext.create('Traccar.view.DeviceDialog');
         dialog.down('form').loadRecord(device);
         dialog.show();
     },
 
     onRemoveClick: function () {
-        var device = this.getView().getSelectionModel().getSelection()[0].get('original');
+        var device = this.getView().getSelectionModel().getSelection()[0];
         Ext.Msg.show({
             title: Strings.deviceDialog,
             message: Strings.sharedRemoveConfirm,
@@ -81,7 +81,7 @@ Ext.define('Traccar.view.DevicesController', {
 
     onCommandClick: function () {
         var device, command, dialog;
-        device = this.getView().getSelectionModel().getSelection()[0].get('original');
+        device = this.getView().getSelectionModel().getSelection()[0];
         command = Ext.create('Traccar.model.Command');
         command.set('deviceId', device.get('id'));
         dialog = Ext.create('Traccar.view.CommandDialog');
@@ -95,17 +95,12 @@ Ext.define('Traccar.view.DevicesController', {
         this.lookupReference('toolbarRemoveButton').setDisabled(empty);
         this.lookupReference('deviceCommandButton').setDisabled(empty);
         if (!empty) {
-            this.fireEvent('selectDevice', selected.getLastSelected().get('original'), true);
+            this.fireEvent('selectDevice', selected.getLastSelected(), true);
         }
     },
 
-    onBeforeSelect: function (row, record) {
-        return record.get('original') instanceof Traccar.model.Device;
-    },
-
     selectDevice: function (device, center) {
-        var node = this.getView().getStore().getNodeById('d' + device.get('id'));
-        this.getView().getSelectionModel().select([node], false, true);
+        this.getView().getSelectionModel().select([device], false, true);
     },
 
     selectReport: function (position) {