You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
98 lines
2.3 KiB
JavaScript
98 lines
2.3 KiB
JavaScript
"use strict";
|
|
|
|
const React = require("react");
|
|
|
|
const Layout = require("../layout.jsx");
|
|
const DebugView = require("../../components/debug-view.jsx");
|
|
|
|
module.exports = {
|
|
query: {
|
|
resources: {
|
|
lvm: {
|
|
volumeGroups: {
|
|
name: true,
|
|
totalSpace: true,
|
|
freeSpace: true,
|
|
physicalVolumes: {
|
|
path: true,
|
|
format: true,
|
|
totalSpace: true,
|
|
freeSpace: true,
|
|
isAllocatable: true,
|
|
isUsed: true,
|
|
isDuplicate: true,
|
|
},
|
|
logicalVolumes: {
|
|
name: true,
|
|
path: true,
|
|
size: true,
|
|
status: true,
|
|
type: true,
|
|
healthStatus: true,
|
|
isReadOnly: true,
|
|
creationTime: true
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
template: function ({ data }) {
|
|
function SegmentBar({ items }) {
|
|
let columns = items
|
|
.map((item) => `${item.value}fr`)
|
|
.join(" ");
|
|
|
|
return (
|
|
<div className="bar" style={{ gridTemplateColumns: columns }}>
|
|
{items.map((item) => {
|
|
return (
|
|
<div key={item.key} className="barSegment" title={item.label}>{item.label}</div>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Layout title="LVM">
|
|
{data.resources.lvm.volumeGroups.map((volumeGroup) => {
|
|
return (<>
|
|
<h2>{volumeGroup.name}</h2>
|
|
<div className="volumeGroup">
|
|
<div className="label">Physical volumes:</div>
|
|
<SegmentBar
|
|
items={volumeGroup.physicalVolumes.map((physicalVolume) => {
|
|
return {
|
|
key: physicalVolume.path,
|
|
value: Math.round(physicalVolume.totalSpace.toMiB().amount),
|
|
label: `${physicalVolume.path} (${physicalVolume.totalSpace.toDisplay(2)})`
|
|
};
|
|
})}
|
|
/>
|
|
<div className="label">Volume group:</div>
|
|
<SegmentBar
|
|
items={[{
|
|
key: volumeGroup.name,
|
|
value: 1,
|
|
label: `${volumeGroup.name} (${volumeGroup.totalSpace.toDisplay(2)})`
|
|
}]}
|
|
/>
|
|
<div className="label">Logical volumes:</div>
|
|
<SegmentBar
|
|
items={volumeGroup.logicalVolumes.map((logicalVolume) => {
|
|
return {
|
|
key: logicalVolume.name,
|
|
value: Math.round(logicalVolume.size.toMiB().amount),
|
|
label: `${logicalVolume.name} (${logicalVolume.size.toDisplay(2)})`
|
|
};
|
|
})}
|
|
/>
|
|
</div>
|
|
</>);
|
|
})}
|
|
<DebugView value={data} />
|
|
</Layout>
|
|
);
|
|
}
|
|
};
|