aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorAnton Tananaev <anton.tananaev@gmail.com>2016-03-12 01:09:25 +1300
committerAnton Tananaev <anton.tananaev@gmail.com>2016-03-12 01:09:25 +1300
commit525d5b80d792e742e6d101ce85531294f5dc5300 (patch)
treebfb04052505d7e079389bbc33cc1b771d9e4b53c
parent8e2cdf251d2c887beb2f9fa5a4fa22351e11f89a (diff)
downloadtraccar-server-525d5b80d792e742e6d101ce85531294f5dc5300.tar.gz
traccar-server-525d5b80d792e742e6d101ce85531294f5dc5300.tar.bz2
traccar-server-525d5b80d792e742e6d101ce85531294f5dc5300.zip
Replace devices grid with tree view
-rw-r--r--web/app/view/Devices.js45
-rw-r--r--web/app/view/DevicesController.js66
2 files changed, 87 insertions, 24 deletions
diff --git a/web/app/view/Devices.js b/web/app/view/Devices.js
index 5712feb81..ebe3ca195 100644
--- a/web/app/view/Devices.js
+++ b/web/app/view/Devices.js
@@ -1,5 +1,5 @@
/*
- * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ * Copyright 2015 - 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.
@@ -15,7 +15,7 @@
*/
Ext.define('Traccar.view.Devices', {
- extend: 'Ext.grid.Panel',
+ extend: 'Ext.tree.Panel',
xtype: 'devicesView',
requires: [
@@ -25,7 +25,17 @@ Ext.define('Traccar.view.Devices', {
],
controller: 'devices',
- store: 'Devices',
+ rootVisible: false,
+ store: {
+ type: 'tree',
+ parentIdProperty: 'groupId',
+ proxy: {
+ type: 'memory',
+ reader: {
+ type: 'json'
+ }
+ }
+ },
title: Strings.deviceTitle,
selType: 'rowmodel',
@@ -53,10 +63,12 @@ Ext.define('Traccar.view.Devices', {
},
listeners: {
- selectionchange: 'onSelectionChange'
+ selectionchange: 'onSelectionChange',
+ beforeselect: 'onBeforeSelect'
},
columns: [{
+ xtype: 'treecolumn',
text: Strings.sharedName,
dataIndex: 'name',
flex: 1
@@ -65,19 +77,20 @@ Ext.define('Traccar.view.Devices', {
dataIndex: 'lastUpdate',
flex: 1,
renderer: function (value, metaData, record) {
- var status = record.get('status');
- switch (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 (record.get('leaf')) {
+ 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;
+ }
+ return Ext.Date.format(value, Traccar.Style.dateTimeFormat);
}
- return Ext.Date.format(value, Traccar.Style.dateTimeFormat);
}
}]
diff --git a/web/app/view/DevicesController.js b/web/app/view/DevicesController.js
index 8c6c72725..4d8231d94 100644
--- a/web/app/view/DevicesController.js
+++ b/web/app/view/DevicesController.js
@@ -1,5 +1,5 @@
/*
- * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ * Copyright 2015 - 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.
@@ -30,9 +30,54 @@ Ext.define('Traccar.view.DevicesController', {
selectDevice: 'selectDevice',
selectReport: 'selectReport'
}
+ },
+ store: {
+ '#Groups': {
+ datachanged: 'storeUpdate',
+ update: 'storeUpdate'
+ },
+ '#Devices': {
+ datachanged: 'storeUpdate',
+ update: 'storeUpdate'
+ }
}
}
},
+
+ storeUpdate: function () {
+ var nodes = [];
+ Ext.getStore('Groups').each(function (record) {
+ var groupId, node = {
+ id: 'g' + record.get('id'),
+ original: record,
+ name: record.get('name')
+ };
+ groupId = record.get('groupId');
+ if (groupId !== 0) {
+ node.groupId = 'g' + groupId;
+ }
+ nodes.push(node);
+ }, this);
+ Ext.getStore('Devices').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) {
+ node.groupId = 'g' + groupId;
+ }
+ nodes.push(node);
+ }, this);
+ this.getView().getStore().getProxy().setData(nodes);
+ this.getView().getStore().load();
+ this.getView().expandAll();
+ },
+
init: function () {
var readonly = Traccar.app.getServer().get('readonly') && !Traccar.app.getUser().get('admin');
this.lookupReference('toolbarAddButton').setVisible(!readonly);
@@ -43,7 +88,7 @@ Ext.define('Traccar.view.DevicesController', {
onAddClick: function () {
var device, dialog;
device = Ext.create('Traccar.model.Device');
- device.store = this.getView().getStore();
+ device.store = Ext.getStore('Devices');
dialog = Ext.create('Traccar.view.DeviceDialog');
dialog.down('form').loadRecord(device);
dialog.show();
@@ -51,14 +96,14 @@ Ext.define('Traccar.view.DevicesController', {
onEditClick: function () {
var device, dialog;
- device = this.getView().getSelectionModel().getSelection()[0];
+ device = this.getView().getSelectionModel().getSelection()[0].get('original');
dialog = Ext.create('Traccar.view.DeviceDialog');
dialog.down('form').loadRecord(device);
dialog.show();
},
onRemoveClick: function () {
- var device = this.getView().getSelectionModel().getSelection()[0];
+ var device = this.getView().getSelectionModel().getSelection()[0].get('original');
Ext.Msg.show({
title: Strings.deviceDialog,
message: Strings.sharedRemoveConfirm,
@@ -80,7 +125,7 @@ Ext.define('Traccar.view.DevicesController', {
onCommandClick: function () {
var device, command, dialog;
- device = this.getView().getSelectionModel().getSelection()[0];
+ device = this.getView().getSelectionModel().getSelection()[0].get('original');
command = Ext.create('Traccar.model.Command');
command.set('deviceId', device.get('id'));
dialog = Ext.create('Traccar.view.CommandDialog');
@@ -89,17 +134,22 @@ Ext.define('Traccar.view.DevicesController', {
},
onSelectionChange: function (selected) {
- var empty = selected.getCount() === 0;
+ var empty = selected.getCount() === 0 || !this.getView().getSelectionModel().getSelection()[0].get('leaf');
this.lookupReference('toolbarEditButton').setDisabled(empty);
this.lookupReference('toolbarRemoveButton').setDisabled(empty);
this.lookupReference('deviceCommandButton').setDisabled(empty);
if (!empty) {
- this.fireEvent('selectDevice', selected.getLastSelected(), true);
+ this.fireEvent('selectDevice', selected.getLastSelected().get('original'), true);
}
},
+ onBeforeSelect: function (row, record) {
+ return record.get('leaf');
+ },
+
selectDevice: function (device, center) {
- this.getView().getSelectionModel().select([device], false, true);
+ var node = this.getView().getStore().getNodeById('d' + device.get('id'));
+ this.getView().getSelectionModel().select([node], false, true);
},
selectReport: function (position) {