From 3b642d7514aac1b0b2d70f9d6af1d645dc254b01 Mon Sep 17 00:00:00 2001
From: Kai Reinhard <K.Reinhard@micromata.de>
Date: Tue, 18 Dec 2018 01:31:25 +0000
Subject: [PATCH] tree view...
---
borgbutler-webapp/src/components/views/archives/FileListEntry.jsx | 12 ++++++++++--
borgbutler-webapp/src/components/views/archives/FileListPanel.jsx | 31 ++++++++++++++++++++++++++++---
borgbutler-webapp/src/components/views/archives/FileListTable.jsx | 11 ++++++++---
3 files changed, 46 insertions(+), 8 deletions(-)
diff --git a/borgbutler-webapp/src/components/views/archives/FileListEntry.jsx b/borgbutler-webapp/src/components/views/archives/FileListEntry.jsx
index 41a5511..a31d06b 100644
--- a/borgbutler-webapp/src/components/views/archives/FileListEntry.jsx
+++ b/borgbutler-webapp/src/components/views/archives/FileListEntry.jsx
@@ -32,7 +32,13 @@
});
}
-function FileListEntry({archiveId, entry, search}) {
+function FileListEntry({archiveId, entry, search, mode, changeCurrentDirectory}) {
+ let path;
+ if (mode === 'tree') {
+ path = <a href={'#'} onClick={() => changeCurrentDirectory(entry.path)}><Highlight search={search}>{entry.path}</Highlight></a>;
+ } else {
+ path = <Highlight search={search}>{entry.path} tree</Highlight>;
+ }
return (
<tr>
<td className={'tt'}>{entry.mode}</td>
@@ -42,7 +48,7 @@
<div className={'btn'} onClick={() => download(archiveId, entry.fileNumber)}>
<IconDownload/></div>
</td>
- <td className={'tt'}><Highlight search={search}>{entry.path}</Highlight></td>
+ <td className={'tt'}>{path}</td>
</tr>
);
}
@@ -50,6 +56,8 @@
FileListEntry.propTypes = {
entry: PropTypes.shape({}).isRequired,
search: PropTypes.string,
+ mode: PropTypes.string,
+ changeCurrentDirectory: PropTypes.func.isRequired
};
export default FileListEntry;
\ No newline at end of file
diff --git a/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx b/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx
index 8e01937..ba8f72f 100644
--- a/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx
+++ b/borgbutler-webapp/src/components/views/archives/FileListPanel.jsx
@@ -1,5 +1,5 @@
import React from 'react'
-import {Button} from 'reactstrap';
+import {Button, Breadcrumb, BreadcrumbItem} from 'reactstrap';
import {getRestServiceUrl} from '../../../utilities/global';
import ErrorAlert from '../../general/ErrorAlert';
import FileListTable from "./FileListTable";
@@ -24,9 +24,21 @@
handleInputChange = (event) => {
event.preventDefault();
- this.setState({filter: {...this.state.filter, [event.target.name]: event.target.value}});
+ let target = event.target.name;
+ this.setState({filter: {...this.state.filter, [event.target.name]: event.target.value}},
+ () => {
+ if (target === 'mode') {
+ this.fetchArchiveFileList();
+ }
+ });
};
+ changeCurrentDirectory = (currentDirectory) => {
+ this.setState({filter: {...this.state.filter, currentDirectory: currentDirectory}},
+ () => {
+ this.fetchArchiveFileList();
+ });
+ };
fetchArchiveFileList = (force) => {
let forceReload = false;
@@ -62,6 +74,7 @@
render = () => {
let content = undefined;
+ let breadcrumb = undefined;
if (this.state.isFetching) {
content = <i>Loading...</i>;
@@ -81,6 +94,15 @@
borg backup server</Button>
</React.Fragment>;
} else {
+ if (this.state.filter.mode === 'tree') {
+ breadcrumb = <Breadcrumb>
+ <BreadcrumbItem><a href="#">Home</a></BreadcrumbItem>
+ <BreadcrumbItem><a href="#">Library</a></BreadcrumbItem>
+ <BreadcrumbItem active>Data</BreadcrumbItem>
+ </Breadcrumb>;
+ } else {
+ breadcrumb = '';
+ }
content = <React.Fragment>
<FileListFilter
filter={this.state.filter}
@@ -90,10 +112,13 @@
this.fetchArchiveFileList();
}}
/>
+ {breadcrumb}
<FileListTable
archiveId={this.props.archiveId}
entries={this.state.fileList}
- search={this.state.filter.search}/>
+ search={this.state.filter.search}
+ mode={this.state.filter.mode}
+ changeCurrentDirectory={this.changeCurrentDirectory}/>
</React.Fragment>;
}
}
diff --git a/borgbutler-webapp/src/components/views/archives/FileListTable.jsx b/borgbutler-webapp/src/components/views/archives/FileListTable.jsx
index a10e512..a0d086b 100644
--- a/borgbutler-webapp/src/components/views/archives/FileListTable.jsx
+++ b/borgbutler-webapp/src/components/views/archives/FileListTable.jsx
@@ -3,7 +3,7 @@
import {Table} from 'reactstrap';
import FileListEntry from './FileListEntry';
-function FileListTable({archiveId, entries, search}) {
+function FileListTable({archiveId, entries, search, mode, changeCurrentDirectory}) {
const lowercaseSearch = search.split(' ')[0].toLowerCase();
return (
<Table striped bordered hover size={'sm'} responsive>
@@ -22,6 +22,8 @@
archiveId={archiveId}
entry={entry}
search={lowercaseSearch}
+ mode={mode}
+ changeCurrentDirectory={changeCurrentDirectory}
key={index}
/>)}
</tbody>
@@ -32,12 +34,15 @@
FileListTable.propTypes = {
archiveId: PropTypes.string,
entries: PropTypes.array,
- search: PropTypes.string
+ search: PropTypes.string,
+ mode: PropTypes.string,
+ changeCurrentDirectory: PropTypes.func.isRequired
};
FileListTable.defaultProps = {
entries: [],
- search: ''
+ search: '',
+ mode: 'flat'
};
export default FileListTable;
--
Gitblit v1.10.0