IF YOU WOULD LIKE TO GET AN ACCOUNT, please write an email to s dot adaszewski at gmail dot com. User accounts are meant only to report issues and/or generate pull requests. This is a purpose-specific Git hosting for ADARED projects. Thank you for your understanding!
Kaynağa Gözat

Working on history in browse dialog.

master
Stanislaw Adaszewski 4 yıl önce
ebeveyn
işleme
7aacacb072
2 değiştirilmiş dosya ile 68 ekleme ve 11 silme
  1. +28
    -4
      frontend/src/js/dialog/wb-browse-dialog-project-list.js
  2. +40
    -7
      frontend/src/js/dialog/wb-browse-dialog.js

+ 28
- 4
frontend/src/js/dialog/wb-browse-dialog-project-list.js Dosyayı Görüntüle

@@ -7,6 +7,7 @@ class WBBrowseDialogProjectList extends Component {
constructor(...args) {
super(...args);
this.state.rows = [];
this.state.history = [];
}
componentDidMount() {
@@ -28,9 +29,30 @@ class WBBrowseDialogProjectList extends Component {
this.fetchRows();
}
popHistory() {
const state = this.state.history.pop();
this.setState(state);
this.fetchRows();
}
prepareRows(items) {
const { resetSearch, pushHistory } = this.props;
const ownerUuid = ( 'ownerUuid' in this.state ?
this.state.ownerUuid : this.props.ownerUuid );
return items.map(it => [
it.name,
(
<a href="#" onclick={ e => {
e.preventDefault();
this.setState({
'ownerUuid': it.uuid,
'page': 0
});
this.fetchRows();
this.state.history.push({ 'ownerUuid': ownerUuid });
pushHistory(this);
resetSearch();
} }>{ it.name }</a>
),
it.file_count,
it.file_size_total
]);
@@ -57,7 +79,7 @@ class WBBrowseDialogProjectList extends Component {
prom = prom.then(xhr => {
this.setState({
'rows': this.prepareRows(xhr.response.items),
'numPages': xhr.response.items_available / itemsPerPage
'numPages': Math.ceil(xhr.response.items_available / itemsPerPage)
});
});
}
@@ -69,14 +91,16 @@ class WBBrowseDialogProjectList extends Component {
rows={ rows } />
<WBPagination numPages={ numPages } activePage={ page }
onPageChanged={ i => this.changePage(i) } />
onPageChanged={ i => this.changePage(i) }
chunkSize="3" />
</div>
);
}
}
WBBrowseDialogProjectList.defaultProps = {
'itemsPerPage': 5
'itemsPerPage': 5,
'resetSearch': () => {}
};
export default WBBrowseDialogProjectList;

+ 40
- 7
frontend/src/js/dialog/wb-browse-dialog.js Dosyayı Görüntüle

@@ -1,9 +1,36 @@
import { h, Component } from 'preact';
import WBBrowseDialogProjectList from 'wb-browse-dialog-project-list';
import WBBrowseDialogCollectionList from 'wb-browse-dialog-project-list';
import linkState from 'linkstate';
class WBBrowseDialog extends Component {
render({ app, id }, { mode }) {
constructor(...args) {
super(...args);
this.state.history = [];
}
resetSearch() {
this.setState({
'textSearch': null,
'textSearchInput': null
});
}
pushHistory(child) {
const { history } = this.state;
history.push([ child, { textSearch } ]);
this.state.history = history.slice(history.length - 1000);
}
popHistory() {
if (this.history.length === 0)
return;
const entry = history.pop();
this.setState(entry[1]);
entry[0].popHistory();
}
render({ app, id }, { mode, textSearch, textSearchInput }) {
return (
<div class="modal" id={ id } tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document">
@@ -16,9 +43,10 @@ class WBBrowseDialog extends Component {
</div>
<div class="modal-body">
<button class="btn btn-sm btn-outline-primary">Back</button>
<input class="form-control" type="search" placeholder="Search" />
<div>
<h5>Go to: <a href="#">Home</a>, <a href="#">All Projects</a>,
<a href="#">All Users</a>, <a href="#">Shared with Me</a></h5>
</div>
<div class="input-group mb-3">
<div class="input-group-prepend">
@@ -26,15 +54,20 @@ class WBBrowseDialog extends Component {
</div>
<input type="text" class="form-control" placeholder="Search"
aria-label="Search" />
aria-label="Search" value={ textSearchInput }
onChange={ linkState(this, 'textSearchInput') } />
<div class="input-group-append">
<button class="btn btn-outline-primary" type="button">Search</button>
<button class="btn btn-outline-primary" type="button"
onclick={ () => this.setState({ 'textSearch': this.state.textSearchInput }) }>Search</button>
</div>
</div>
<h5>Projects</h5>
<WBBrowseDialogProjectList app={ app } />
<WBBrowseDialogProjectList app={ app } textSearch={ textSearch }
resetSearch={ () => this.resetSearch() }
pushHistory={ () => this.pushHistory() }
popHistory={ () => this.popHistory() } />
{ mode === 'collection-content' ? (
<h5>Content</h5>


Yükleniyor…
İptal
Kaydet