github/weave-scope
1
0
Fork 0
mirror of https://github.com/weaveworks/scope.git synced 2026-03-04 10:41:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1641 from weaveworks/fix-column-widths

Browse Source 
Force some known column widths to prevent truncation of others
This commit is contained in:
Paul Bellamy
2016-07-05 14:39:18 +01:00
committed by GitHub
parent 8cb1ecdf2c f11c559499
commit b89e9ec891
1 changed files with 21 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
client/app/scripts/components/node-details/node-details-table.js
View File

@@ -5,10 +5,18 @@ import ShowMore from '../show-more';
import NodeDetailsTableNodeLink from './node-details-table-node-link';
import NodeDetailsTableNodeMetric from './node-details-table-node-metric';
function isNumberField(field) {
return field.dataType && field.dataType === 'number';
}
const COLUMN_WIDTHS = {
port: '44px',
count: '70px'
};
export default class NodeDetailsTable extends React.Component {
constructor(props, context) {
@@ -98,13 +106,21 @@ export default class NodeDetailsTable extends React.Component {
// Beauty hack: adjust first column width if there are only few columns;
// this assumes the other columns are narrow metric columns of 20% table width
if (headers.length === 2) {
headers[0].width = 66;
headers[0].width = '66%';
} else if (headers.length === 3) {
headers[0].width = 50;
headers[0].width = '50%';
} else if (headers.length >= 3) {
headers[0].width = 33;
headers[0].width = '33%';
}
//
// More beauty hacking, ports and counts can only get so big, free up WS for other longer
// fields like IPs!
//
headers.forEach(h => {
h.width = COLUMN_WIDTHS[h.id];
});
return (
<tr>
{headers.map(header => {
@@ -125,7 +141,7 @@ export default class NodeDetailsTable extends React.Component {
// set header width in percent
const style = {};
if (header.width) {
style.width = `${header.width}%`;
style.width = header.width;
}
return (
@@ -210,6 +226,7 @@ export default class NodeDetailsTable extends React.Component {
}
}
NodeDetailsTable.defaultProps = {
nodeIdKey: 'id' // key to identify a node in a row (used for topology links)
};