From 11c8c039cc8c5a1948281f410bdb440d5a9f1608 Mon Sep 17 00:00:00 2001 From: Anton Tananaev Date: Tue, 8 Nov 2016 12:04:28 +1300 Subject: Specify min width for columns --- web/app/Style.js | 2 + web/app/view/AttributeAliases.js | 23 ++++++---- web/app/view/Attributes.js | 23 ++++++---- web/app/view/DeviceGeofences.js | 14 +++--- web/app/view/Devices.js | 94 ++++++++++++++++++++-------------------- web/app/view/Geofences.js | 23 ++++++---- web/app/view/GroupGeofences.js | 14 +++--- web/app/view/Groups.js | 16 ++++--- web/app/view/Notifications.js | 72 +++++++++++++++--------------- web/app/view/Report.js | 10 +++++ web/app/view/ReportController.js | 27 ------------ web/app/view/State.js | 33 ++++++++------ web/app/view/Statistics.js | 55 +++++++++++------------ web/app/view/UserDevices.js | 22 ++++++---- web/app/view/UserGeofences.js | 14 +++--- web/app/view/UserGroups.js | 14 +++--- web/app/view/Users.js | 30 +++++++------ 17 files changed, 263 insertions(+), 223 deletions(-) diff --git a/web/app/Style.js b/web/app/Style.js index b4201bb..8db8667 100644 --- a/web/app/Style.js +++ b/web/app/Style.js @@ -35,6 +35,8 @@ Ext.define('Traccar.Style', { reportHeight: 250, reportTime: 100, + columnWidthNormal: 100, + mapDefaultLat: 12.966667, mapDefaultLon: 77.566667, mapDefaultZoom: 4, diff --git a/web/app/view/AttributeAliases.js b/web/app/view/AttributeAliases.js index c693435..6408ad3 100644 --- a/web/app/view/AttributeAliases.js +++ b/web/app/view/AttributeAliases.js @@ -51,13 +51,18 @@ Ext.define('Traccar.view.AttributeAliases', { selectionchange: 'onSelectionChange' }, - columns: [{ - text: Strings.sharedAttribute, - dataIndex: 'attribute', - flex: 1 - }, { - text: Strings.sharedAlias, - dataIndex: 'alias', - flex: 1 - }] + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.sharedAttribute, + dataIndex: 'attribute' + }, { + text: Strings.sharedAlias, + dataIndex: 'alias' + }] + } }); diff --git a/web/app/view/Attributes.js b/web/app/view/Attributes.js index 88d6de8..aa2db36 100644 --- a/web/app/view/Attributes.js +++ b/web/app/view/Attributes.js @@ -36,13 +36,18 @@ Ext.define('Traccar.view.Attributes', { selectionchange: 'onSelectionChange' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }, { - text: Strings.stateValue, - dataIndex: 'value', - flex: 1 - }] + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.sharedName, + dataIndex: 'name' + }, { + text: Strings.stateValue, + dataIndex: 'value' + }] + } }); diff --git a/web/app/view/DeviceGeofences.js b/web/app/view/DeviceGeofences.js index 784583f..986ca3a 100644 --- a/web/app/view/DeviceGeofences.js +++ b/web/app/view/DeviceGeofences.js @@ -36,9 +36,13 @@ Ext.define('Traccar.view.DeviceGeofences', { beforeselect: 'onBeforeSelect' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }] + forceFit: true, + + columns: { + items: [{ + text: Strings.sharedName, + minWidth: Traccar.Style.columnWidthNormal, + dataIndex: 'name' + }] + } }); diff --git a/web/app/view/Devices.js b/web/app/view/Devices.js index 1973976..1789a11 100644 --- a/web/app/view/Devices.js +++ b/web/app/view/Devices.js @@ -153,52 +153,52 @@ Ext.define('Traccar.view.Devices', { selectionchange: 'onSelectionChange' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }, { - text: Strings.deviceIdentifier, - dataIndex: 'uniqueId', - hidden: true, - flex: 1 - }, { - text: Strings.devicePhone, - dataIndex: 'phone', - hidden: true, - flex: 1 - }, { - text: Strings.deviceModel, - dataIndex: 'model', - hidden: true, - flex: 1 - }, { - text: Strings.deviceContact, - dataIndex: 'contact', - hidden: true, - flex: 1 - }, { - text: Strings.deviceLastUpdate, - dataIndex: 'lastUpdate', - flex: 1, - renderer: function (value, metaData, record) { - switch (record.get('status')) { - case 'online': - metaData.tdCls = 'view-color-green'; - break; - case 'offline': - metaData.tdCls = 'view-color-red'; - break; - default: - metaData.tdCls = 'view-color-yellow'; - break; - } - if (Traccar.app.getPreference('twelveHourFormat', false)) { - return Ext.Date.format(value, Traccar.Style.dateTimeFormat12); - } else { - return Ext.Date.format(value, Traccar.Style.dateTimeFormat24); - } - } - }] + forceFit: true, + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.sharedName, + dataIndex: 'name' + }, { + text: Strings.deviceIdentifier, + dataIndex: 'uniqueId', + hidden: true + }, { + text: Strings.devicePhone, + dataIndex: 'phone', + hidden: true + }, { + text: Strings.deviceModel, + dataIndex: 'model', + hidden: true + }, { + text: Strings.deviceContact, + dataIndex: 'contact', + hidden: true + }, { + text: Strings.deviceLastUpdate, + dataIndex: 'lastUpdate', + renderer: function (value, metaData, record) { + switch (record.get('status')) { + case 'online': + metaData.tdCls = 'view-color-green'; + break; + case 'offline': + metaData.tdCls = 'view-color-red'; + break; + default: + metaData.tdCls = 'view-color-yellow'; + 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/Geofences.js b/web/app/view/Geofences.js index 0da87d0..3df2160 100644 --- a/web/app/view/Geofences.js +++ b/web/app/view/Geofences.js @@ -37,13 +37,18 @@ Ext.define('Traccar.view.Geofences', { selectionchange: 'onSelectionChange' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }, { - text: Strings.sharedDescription, - dataIndex: 'description', - flex: 1 - }] + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.sharedName, + dataIndex: 'name' + }, { + text: Strings.sharedDescription, + dataIndex: 'description' + }] + } }); diff --git a/web/app/view/GroupGeofences.js b/web/app/view/GroupGeofences.js index 26a16a6..12c785f 100644 --- a/web/app/view/GroupGeofences.js +++ b/web/app/view/GroupGeofences.js @@ -36,9 +36,13 @@ Ext.define('Traccar.view.GroupGeofences', { beforeselect: 'onBeforeSelect' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }] + forceFit: true, + + columns: { + items: [{ + text: Strings.sharedName, + minWidth: Traccar.Style.columnWidthNormal, + dataIndex: 'name' + }] + } }); diff --git a/web/app/view/Groups.js b/web/app/view/Groups.js index 07345cb..0c166f1 100644 --- a/web/app/view/Groups.js +++ b/web/app/view/Groups.js @@ -46,9 +46,15 @@ Ext.define('Traccar.view.Groups', { selectionchange: 'onSelectionChange' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }] + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.sharedName, + dataIndex: 'name' + }] + } }); diff --git a/web/app/view/Notifications.js b/web/app/view/Notifications.js index 22b031f..900ebe3 100644 --- a/web/app/view/Notifications.js +++ b/web/app/view/Notifications.js @@ -34,39 +34,43 @@ Ext.define('Traccar.view.Notifications', { markDirty: false }, - columns: [{ - text: Strings.notificationType, - dataIndex: 'type', - flex: 1, - renderer: function (value) { - var typeKey = 'event' + value.charAt(0).toUpperCase() + value.slice(1); - return Strings[typeKey]; - } - }, { - text: Strings.notificationWeb, - dataIndex: 'attributes.web', - xtype: 'checkcolumn', - flex: 1, - listeners: { - beforeCheckChange: 'onBeforeCheckChange', - checkChange: 'onCheckChange' - }, - renderer: function (value, metaData, record) { - var fields = this.dataIndex.split('\.', 2); - return (new Ext.ux.CheckColumn()).renderer(record.get(fields[0])[fields[1]], metaData); - } - }, { - text: Strings.notificationMail, - dataIndex: 'attributes.mail', - xtype: 'checkcolumn', - flex: 1, - listeners: { - beforeCheckChange: 'onBeforeCheckChange', - checkChange: 'onCheckChange' + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal }, - renderer: function (value, metaData, record) { - var fields = this.dataIndex.split('\.', 2); - return (new Ext.ux.CheckColumn()).renderer(record.get(fields[0])[fields[1]], metaData); - } - }] + items: [{ + text: Strings.notificationType, + dataIndex: 'type', + renderer: function (value) { + var typeKey = 'event' + value.charAt(0).toUpperCase() + value.slice(1); + return Strings[typeKey]; + } + }, { + text: Strings.notificationWeb, + dataIndex: 'attributes.web', + xtype: 'checkcolumn', + listeners: { + beforeCheckChange: 'onBeforeCheckChange', + checkChange: 'onCheckChange' + }, + renderer: function (value, metaData, record) { + var fields = this.dataIndex.split('\.', 2); + return (new Ext.ux.CheckColumn()).renderer(record.get(fields[0])[fields[1]], metaData); + } + }, { + text: Strings.notificationMail, + dataIndex: 'attributes.mail', + xtype: 'checkcolumn', + listeners: { + beforeCheckChange: 'onBeforeCheckChange', + checkChange: 'onCheckChange' + }, + renderer: function (value, metaData, record) { + var fields = this.dataIndex.split('\.', 2); + return (new Ext.ux.CheckColumn()).renderer(record.get(fields[0])[fields[1]], metaData); + } + }] + } }); diff --git a/web/app/view/Report.js b/web/app/view/Report.js index f9b79ad..5851c4c 100644 --- a/web/app/view/Report.js +++ b/web/app/view/Report.js @@ -69,5 +69,15 @@ Ext.define('Traccar.view.Report', { listeners: { selectionchange: 'onSelectionChange' + }, + + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [ + ] } }); diff --git a/web/app/view/ReportController.js b/web/app/view/ReportController.js index 67fcf12..224a2a8 100644 --- a/web/app/view/ReportController.js +++ b/web/app/view/ReportController.js @@ -227,58 +227,48 @@ Ext.define('Traccar.view.ReportController', { routeColumns: [{ text: Strings.positionValid, dataIndex: 'valid', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('valid') }, { text: Strings.positionFixTime, dataIndex: 'fixTime', - flex: 1, xtype: 'datecolumn', renderer: Traccar.AttributeFormatter.getFormatter('fixTime') }, { text: Strings.positionLatitude, dataIndex: 'latitude', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('latitude') }, { text: Strings.positionLongitude, dataIndex: 'longitude', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('latitude') }, { text: Strings.positionAltitude, dataIndex: 'altitude', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('altitude') }, { text: Strings.positionSpeed, dataIndex: 'speed', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('speed') }, { text: Strings.positionAddress, dataIndex: 'address', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('address') }], eventsColumns: [{ text: Strings.positionFixTime, dataIndex: 'serverTime', - flex: 1, xtype: 'datecolumn', renderer: Traccar.AttributeFormatter.getFormatter('serverTime') }, { text: Strings.reportDeviceName, dataIndex: 'deviceId', - flex: 1, renderer: function (value) { return Ext.getStore('Devices').findRecord('id', value).get('name'); } }, { text: Strings.sharedType, dataIndex: 'type', - flex: 1, renderer: function (value) { var typeKey = 'event' + value.charAt(0).toUpperCase() + value.slice(1); return Strings[typeKey]; @@ -286,7 +276,6 @@ Ext.define('Traccar.view.ReportController', { }, { text: Strings.sharedGeofence, dataIndex: 'geofenceId', - flex: 1, renderer: function (value) { if (value !== 0) { return Ext.getStore('Geofences').findRecord('id', value).get('name'); @@ -297,86 +286,70 @@ Ext.define('Traccar.view.ReportController', { summaryColumns: [{ text: Strings.reportDeviceName, dataIndex: 'deviceId', - flex: 1, renderer: function (value) { return Ext.getStore('Devices').findRecord('id', value).get('name'); } }, { text: Strings.sharedDistance, dataIndex: 'distance', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('distance') }, { text: Strings.reportAverageSpeed, dataIndex: 'averageSpeed', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('speed') }, { text: Strings.reportMaximumSpeed, dataIndex: 'maxSpeed', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('speed') }, { text: Strings.reportEngineHours, dataIndex: 'engineHours', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('hours') }], tripsColumns: [{ text: Strings.reportDeviceName, dataIndex: 'deviceId', - flex: 1, renderer: function (value) { return Ext.getStore('Devices').findRecord('id', value).get('name'); } }, { text: Strings.reportStartTime, dataIndex: 'startTime', - flex: 1, xtype: 'datecolumn', renderer: Traccar.AttributeFormatter.getFormatter('startTime') }, { text: Strings.reportStartAddress, dataIndex: 'startAddress', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('address') }, { text: Strings.reportEndTime, dataIndex: 'endTime', - flex: 1, xtype: 'datecolumn', renderer: Traccar.AttributeFormatter.getFormatter('endTime') }, { text: Strings.reportEndAddress, dataIndex: 'endAddress', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('address') }, { text: Strings.sharedDistance, dataIndex: 'distance', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('distance') }, { text: Strings.reportAverageSpeed, dataIndex: 'averageSpeed', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('speed') }, { text: Strings.reportMaximumSpeed, dataIndex: 'maxSpeed', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('speed') }, { text: Strings.reportDuration, dataIndex: 'duration', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('duration') }, { text: Strings.reportSpentFuel, dataIndex: 'spentFuel', - flex: 1, renderer: Traccar.AttributeFormatter.getFormatter('spentFuel') }] - }); diff --git a/web/app/view/State.js b/web/app/view/State.js index 67cd075..3356fd7 100644 --- a/web/app/view/State.js +++ b/web/app/view/State.js @@ -49,19 +49,24 @@ Ext.define('Traccar.view.State', { selectionchange: 'onSelectionChange' }, - columns: [{ - text: Strings.stateName, - dataIndex: 'name', - flex: 1 - }, { - text: Strings.stateValue, - dataIndex: 'value', - flex: 1, - renderer: function (value, metaData, record) { - if (record.get('attribute') === 'alarm') { - metaData.tdCls = 'view-color-red'; + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.stateName, + dataIndex: 'name' + }, { + text: Strings.stateValue, + dataIndex: 'value', + renderer: function (value, metaData, record) { + if (record.get('attribute') === 'alarm') { + metaData.tdCls = 'view-color-red'; + } + return value; } - return value; - } - }] + }] + } }); diff --git a/web/app/view/Statistics.js b/web/app/view/Statistics.js index 137850e..7232951 100644 --- a/web/app/view/Statistics.js +++ b/web/app/view/Statistics.js @@ -48,31 +48,32 @@ Ext.define('Traccar.view.Statistics', { handler: 'onShowClick' }], - columns: [{ - text: Strings.statisticsCaptureTime, - dataIndex: 'captureTime', - flex: 1, - xtype: 'datecolumn', - renderer: Traccar.AttributeFormatter.defaultFormatter() - }, { - text: Strings.statisticsActiveUsers, - dataIndex: 'activeUsers', - flex: 1 - }, { - text: Strings.statisticsActiveDevices, - dataIndex: 'activeDevices', - flex: 1 - }, { - text: Strings.statisticsRequests, - dataIndex: 'requests', - flex: 1 - }, { - text: Strings.statisticsMessagesReceived, - dataIndex: 'messagesReceived', - flex: 1 - }, { - text: Strings.statisticsMessagesStored, - dataIndex: 'messagesStored', - flex: 1 - }] + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.statisticsCaptureTime, + dataIndex: 'captureTime', + xtype: 'datecolumn', + renderer: Traccar.AttributeFormatter.defaultFormatter() + }, { + text: Strings.statisticsActiveUsers, + dataIndex: 'activeUsers' + }, { + text: Strings.statisticsActiveDevices, + dataIndex: 'activeDevices' + }, { + text: Strings.statisticsRequests, + dataIndex: 'requests' + }, { + text: Strings.statisticsMessagesReceived, + dataIndex: 'messagesReceived' + }, { + text: Strings.statisticsMessagesStored, + dataIndex: 'messagesStored' + }] + } }); diff --git a/web/app/view/UserDevices.js b/web/app/view/UserDevices.js index f573134..1f68a29 100644 --- a/web/app/view/UserDevices.js +++ b/web/app/view/UserDevices.js @@ -36,13 +36,17 @@ Ext.define('Traccar.view.UserDevices', { beforeselect: 'onBeforeSelect' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }, { - text: Strings.deviceIdentifier, - dataIndex: 'uniqueId', - flex: 1 - }] + forceFit: true, + + columns: { + items: [{ + text: Strings.sharedName, + minWidth: Traccar.Style.columnWidthNormal, + dataIndex: 'name' + }, { + text: Strings.deviceIdentifier, + minWidth: Traccar.Style.columnWidthNormal, + dataIndex: 'uniqueId' + }] + } }); diff --git a/web/app/view/UserGeofences.js b/web/app/view/UserGeofences.js index d90ed1b..c960acc 100644 --- a/web/app/view/UserGeofences.js +++ b/web/app/view/UserGeofences.js @@ -36,9 +36,13 @@ Ext.define('Traccar.view.UserGeofences', { beforeselect: 'onBeforeSelect' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }] + forceFit: true, + + columns: { + items: [{ + text: Strings.sharedName, + minWidth: Traccar.Style.columnWidthNormal, + dataIndex: 'name' + }] + } }); diff --git a/web/app/view/UserGroups.js b/web/app/view/UserGroups.js index 648ac3f..6b53dd9 100644 --- a/web/app/view/UserGroups.js +++ b/web/app/view/UserGroups.js @@ -36,9 +36,13 @@ Ext.define('Traccar.view.UserGroups', { beforeselect: 'onBeforeSelect' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }] + forceFit: true, + + columns: { + items: [{ + text: Strings.sharedName, + minWidth: Traccar.Style.columnWidthNormal, + dataIndex: 'name' + }] + } }); diff --git a/web/app/view/Users.js b/web/app/view/Users.js index 28581c5..f4b2733 100644 --- a/web/app/view/Users.js +++ b/web/app/view/Users.js @@ -66,17 +66,21 @@ Ext.define('Traccar.view.Users', { selectionchange: 'onSelectionChange' }, - columns: [{ - text: Strings.sharedName, - dataIndex: 'name', - flex: 1 - }, { - text: Strings.userEmail, - dataIndex: 'email', - flex: 1 - }, { - text: Strings.userAdmin, - dataIndex: 'admin', - flex: 1 - }] + forceFit: true, + + columns: { + defaults: { + minWidth: Traccar.Style.columnWidthNormal + }, + items: [{ + text: Strings.sharedName, + dataIndex: 'name' + }, { + text: Strings.userEmail, + dataIndex: 'email' + }, { + text: Strings.userAdmin, + dataIndex: 'admin' + }] + } }); -- cgit v1.2.3