- | {e.id} |
- {new Date(e.created_at).toLocaleString()} |
- {e.download} |
- {e.upload} |
- {e.ping} |
+ {fields.visible.map((e, i) => {
+ return (
+ {e.value} |
+ );
+ })}
{e.server_host != null ?
@@ -67,13 +111,17 @@ export default class TableRow extends Component {
More info
- Server ID: {e.server_id}
- Name: {e.server_name}
- Host: {e.server_host}
- URL: Speedtest.net
- {e.scheduled != undefined &&
- Type: {e.scheduled == true ? 'scheduled' : 'manual'}
- }
+ {fields.modal.map((e, i) => {
+ if(e.type === 'url') {
+ return (
+ {e.key}: Speedtest.net
+ );
+ } else {
+ return (
+ {e.key}: {e.value}
+ );
+ }
+ })}
diff --git a/resources/js/components/Graphics/TestsTable.js b/resources/js/components/Graphics/TestsTable.js
index 700398ab..9b137eb3 100644
--- a/resources/js/components/Graphics/TestsTable.js
+++ b/resources/js/components/Graphics/TestsTable.js
@@ -14,7 +14,51 @@ export default class TestsTable extends Component {
data: [],
showTable: false,
refresh: true,
- interval: null
+ interval: null,
+ allFields: {
+ id: {
+ type: 'int',
+ alias: 'ID'
+ },
+ created_at: {
+ type: 'date',
+ alias: 'Time'
+ },
+ download: {
+ type: 'float',
+ alias: 'Download (Mbit/s)'
+ },
+ upload: {
+ type: 'float',
+ alias: 'Upload (Mbit/s)'
+ },
+ ping: {
+ type: 'float',
+ alias: 'Ping (ms)'
+ },
+ server_id: {
+ type: 'int',
+ alias: 'Server ID'
+ },
+ server_name: {
+ type: 'string',
+ alias: 'Name'
+ },
+ server_host: {
+ type: 'string',
+ alias: 'Host'
+ },
+ url: {
+ type: 'url',
+ alias: 'URL'
+ },
+ scheduled: {
+ type: 'bool',
+ alias: 'Type',
+ if_true: 'scheduled',
+ if_false: 'manual'
+ }
+ }
}
}
@@ -84,6 +128,7 @@ export default class TestsTable extends Component {
var data = this.state.data;
var show = this.state.showTable;
var refresh = this.state.refresh;
+ let allFields = this.state.allFields;
if(data.length > 0) {
return (
@@ -102,18 +147,18 @@ export default class TestsTable extends Component {
- | ID |
- Time |
- Download (Mbit/s) |
- Upload (Mbit/s) |
- Ping (ms) |
+ {window.config.tables.visible_columns.map((e, i) => {
+ return (
+ {allFields[e].alias} |
+ );
+ })}
More |
{data.map((e,i) => {
return (
-
+
);
})}
diff --git a/resources/js/components/Settings/SettingsIndex.js b/resources/js/components/Settings/SettingsIndex.js
index a8c6cc43..ddd5c8cf 100644
--- a/resources/js/components/Settings/SettingsIndex.js
+++ b/resources/js/components/Settings/SettingsIndex.js
@@ -63,6 +63,16 @@ export default class SettingsIndex extends Component {
type: 'checkbox',
}
],
+ Tables: [
+ {
+ obj: data.visible_columns,
+ type: 'list'
+ },
+ {
+ obj: data.hidden_columns,
+ type: 'list'
+ }
+ ],
Graphs: [
{
obj: data.download_upload_graph_enabled,
@@ -268,7 +278,7 @@ export default class SettingsIndex extends Component {
{loading ?
:
-
+
}
diff --git a/resources/js/components/Settings/SettingsTabs.js b/resources/js/components/Settings/SettingsTabs.js
index 32ff3b4d..fe93dfc6 100644
--- a/resources/js/components/Settings/SettingsTabs.js
+++ b/resources/js/components/Settings/SettingsTabs.js
@@ -11,13 +11,14 @@ import GraphsSettings from './tabs/GraphsSettings';
import HealthchecksSettings from './tabs/HealthchecksSettings';
import NotificationsSettings from './tabs/NotificationsSettings';
import Authentication from '../Authentication/Authentication';
+import TableSettings from './tabs/TableSettings';
export default class SettingsTabs extends Component {
constructor(props) {
super(props)
this.state = {
- tab: "General",
+ tab: "Tables",
data: this.props.data
}
}
@@ -26,6 +27,7 @@ export default class SettingsTabs extends Component {
var tabs = [
'General',
'Graphs',
+ 'Tables',
'Notifications',
'healthchecks.io',
'Reset',
@@ -121,6 +123,11 @@ export default class SettingsTabs extends Component {
data={data.Graphs}
generateInputs={this.generateInputs}
save={this.save} />
+ case 'Tables':
+ return
case 'Notifications':
return {
+ if (!result.destination) return;
+
+ let visible = this.state.visible;
+ let hidden = this.state.hidden;
+
+ let from = result.source.droppableId == 'visibleColumns' ? visible.obj.value : hidden.obj.value;
+ let to = result.destination.droppableId == 'visibleColumns' ? visible.obj.value : hidden.obj.value;
+
+ let [reorderedItem] = from.splice(result.source.index, 1);
+ to.splice(result.destination.index, 0, reorderedItem);
+
+ this.setState({
+ visible: visible,
+ hidden: hidden
+ });
+ }
+
+ save = () => {
+ var url = 'api/settings/bulk?token=' + window.token;
+
+ Axios.post(url, {
+ data: [
+ {
+ name: 'visible_columns',
+ value: this.state.visible.obj.value
+ },
+ {
+ name: 'hidden_columns',
+ value: this.state.hidden.obj.value
+ }
+ ],
+ })
+ .then((resp) => {
+ toast.success('Table settings updated');
+ this.props.refreshConfig();
+ })
+ .catch((err) => {
+ toast.error('Something went wrong');
+ console.log(err);
+ })
+ }
+
+ render() {
+ let visible = this.state.visible;
+ let hidden = this.state.hidden;
+
+ return (
+
+
+ {visible.obj.description}
+
+
+
+ Visible Columns
+
+ {(provided) => (
+
+ {visible.obj.value.map((e, i) => {
+ return (
+
+ {(provided) => (
+ - {e}
+ )}
+
+ );
+ })}
+ {provided.placeholder}
+
+ )}
+
+
+ Hidden Columns
+
+ {(provided) => (
+
+ {hidden.obj.value.map((e, i) => {
+ return (
+
+ {(provided) => (
+ - {e}
+ )}
+
+ );
+ })}
+ {provided.placeholder}
+
+ )}
+
+
+
+
+
+
+
-
+
)} />
|