diff options
| -rw-r--r-- | web/app.css | 10 | ||||
| -rw-r--r-- | web/app/Style.js | 6 | ||||
| -rw-r--r-- | web/app/controller/Root.js | 21 | ||||
| -rw-r--r-- | web/app/model/Device.js | 6 | ||||
| -rw-r--r-- | web/app/view/Devices.js | 23 | ||||
| -rw-r--r-- | web/l10n/en.json | 1 |
6 files changed, 57 insertions, 10 deletions
diff --git a/web/app.css b/web/app.css index 3c4507e38..eb0fdf136 100644 --- a/web/app.css +++ b/web/app.css @@ -1,3 +1,13 @@ +.status-color-online { + background-color: rgba(77, 250, 144, 0.3); +} +.status-color-unknown { + background-color: rgba(250, 190, 77, 0.3); +} +.status-color-offline { + background-color: rgba(255, 84, 104, 0.3); +} + .state-indicator { position: absolute; top: -999em; diff --git a/web/app/Style.js b/web/app/Style.js index 58ab059ad..b75503c32 100644 --- a/web/app/Style.js +++ b/web/app/Style.js @@ -48,9 +48,9 @@ Ext.define('Traccar.Style', { mapTextOffset: 10, mapTextFont: 'bold 12px sans-serif', - mapColorOnline: '#4DFA90', - mapColorUnknown: '#FABE4D', - mapColorOffline: '#FF5468', + mapColorOnline: 'rgba(77, 250, 144, 1.0)', + mapColorUnknown: 'rgba(250, 190, 77, 1.0)', + mapColorOffline: 'rgba(255, 84, 104, 1.0)', mapColorReport: 'rgba(21, 127, 204, 1.0)', mapRadiusNormal: 10, diff --git a/web/app/controller/Root.js b/web/app/controller/Root.js index 041e0b902..733055cdf 100644 --- a/web/app/controller/Root.js +++ b/web/app/controller/Root.js @@ -97,19 +97,32 @@ Ext.define('Traccar.controller.Root', { first: first }, callback: Traccar.app.getErrorHandler(this, function (options, success, response) { - var i, store, data, devices, positions, position; + var i, deviceStore, positionStore, data, devices, positions, device, position; if (success) { - store = Ext.getStore('LatestPositions'); + deviceStore = Ext.getStore('Devices'); + positionStore = Ext.getStore('LatestPositions'); data = Ext.decode(response.responseText).data; devices = data.devices; positions = data.positions; + for (i = 0; i < devices.length; i++) { + device = deviceStore.findRecord('id', devices[i].id, 0, false, false, true); + if (device) { + device.set({ + status: devices[i].status, + lastUpdate: devices[i].lastUpdate + }, { + dirty: false + }); + } + } + for (i = 0; i < positions.length; i++) { - position = store.findRecord('deviceId', positions[i].deviceId, 0, false, false, true); + position = positionStore.findRecord('deviceId', positions[i].deviceId, 0, false, false, true); if (position) { position.set(positions[i]); } else { - store.add(Ext.create('Traccar.model.Position', positions[i])); + positionStore.add(Ext.create('Traccar.model.Position', positions[i])); } } diff --git a/web/app/model/Device.js b/web/app/model/Device.js index e9ed1f680..983e3e62e 100644 --- a/web/app/model/Device.js +++ b/web/app/model/Device.js @@ -27,5 +27,11 @@ Ext.define('Traccar.model.Device', { }, { name: 'uniqueId', type: 'string' + }, { + name: 'status', + type: 'string' + }, { + name: 'lastUpdate', + type: 'date' }] }); diff --git a/web/app/view/Devices.js b/web/app/view/Devices.js index 9dcd76a55..128cd3be1 100644 --- a/web/app/view/Devices.js +++ b/web/app/view/Devices.js @@ -52,10 +52,27 @@ Ext.define('Traccar.view.Devices', { columns: [{ text: Strings.deviceName, - dataIndex: 'name', flex: 1 + dataIndex: 'name', + flex: 1 }, { - text: Strings.deviceIdentifier, - dataIndex: 'uniqueId', flex: 1 + text: Strings.deviceLastUpdate, + 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; + } + return Ext.Date.format(value, Traccar.Style.dateTimeFormat); + } }] }); diff --git a/web/l10n/en.json b/web/l10n/en.json index a3489fbe1..b18c85afd 100644 --- a/web/l10n/en.json +++ b/web/l10n/en.json @@ -31,6 +31,7 @@ "deviceTitle": "Devices", "deviceName": "Name", "deviceIdentifier": "Identifier", + "deviceLastUpdate": "Last Update", "deviceCommand": "Command", "settingsTitle": "Settings", "settingsUser": "Account", |