scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-04-02 18:31:30 +08:00
Code Issues Projects Releases Packages Wiki Activity

Add switch for active/archive repository view

Browse source
This commit is contained in:
aignatov-bio 2020-06-03 13:42:09 +02:00
parent a29a8d67f4
commit 012b7b3d23
7 changed files with 181 additions and 37 deletions
app
assets
javascripts/repositories
index.js
stylesheets
repository
index.scss
shared
content_pane.scss
helpers
repositories_datatable_helper.rb
views
repositories
index.html.erb
shared
_view_switch.html.erb
config/locales
en.yml

20
app/assets/javascripts/repositories/index.js
View file

@ -4,9 +4,10 @@
var REPOSITORIES_TABLE;
function initRepositoriesDataTable(tableContainer) {
function initRepositoriesDataTable(tableContainer, archived = false) {
var tableTemplate = archived ? $('#archivedRepositoriesListTable') : $('#activeRepositoriesListTable');
if (REPOSITORIES_TABLE) REPOSITORIES_TABLE.destroy();
$('.content-body').html($('#activeRepositoriesListTable').html());
$('.content-body').html(tableTemplate.html());
$.get($(tableContainer).data('source'), function(data) {
REPOSITORIES_TABLE = $(tableContainer).DataTable({
aaData: data,
@ -39,7 +40,7 @@
var dataTableWrapper = $(tableContainer).closest('.dataTables_wrapper');
DataTableHelpers.initLengthApearance(dataTableWrapper);
DataTableHelpers.initSearchField(dataTableWrapper);
$('.content-body .toolbar').html($('#activeRepositoriesListButtons').html());
$('.content-body .toolbar').html($('#repositoriesListButtons').html());
dataTableWrapper.find('.main-actions, .pagination-row').removeClass('hidden');
$('.create-new-repository').initializeModal('#create-repo-modal');
}
@ -47,5 +48,18 @@
});
}
function initRepositoryViewSwitcher() {
var viewSwitch = $('.view-switch');
viewSwitch.on('click', '.view-switch-archived', function() {
$('.repositories-index').toggleClass('archived active');
initRepositoriesDataTable('#repositoriesList', true);
});
viewSwitch.on('click', '.view-switch-active', function() {
$('.repositories-index').toggleClass('archived active');
initRepositoriesDataTable('#repositoriesList');
});
}
initRepositoriesDataTable('#repositoriesList');
initRepositoryViewSwitcher();
}());

13
app/assets/stylesheets/repository/index.scss Normal file
View file

@ -0,0 +1,13 @@
.repositories-index {
&.active {
[data-view-mode="archived"] {
display: none
}
}
&.archived {
[data-view-mode="active"] {
display: none
}
}
}

31
app/assets/stylesheets/shared/content_pane.scss
View file

@ -17,6 +17,37 @@
h1 {
margin: 0;
}
.view-switch {
margin-left: auto;
.caret {
margin: 8px 0 8px 8px;
}
&.open {
.caret {
transform: rotateX(180deg)
}
}
.dropdown-menu {
@include font-button;
min-width: 250px;
li {
cursor: pointer;
padding: 1em;
.button-icon {
margin-right: .5em;
}
&:hover {
background: $color-concrete;
}
}
}
}
}
.content-body {

2
app/helpers/repositories_datatable_helper.rb
View file

@ -15,6 +15,8 @@ module RepositoriesDatatableHelper
'4': escape_input(repository.team.name),
'5': I18n.l(repository.created_at, format: :full),
'6': escape_input(repository.created_by.full_name),
'7': 'Archived on',
'8': 'Archived by',
'repositoryUrl': repository_path(repository)
)
end

131
app/views/repositories/index.html.erb
View file

@ -3,46 +3,109 @@
<% if current_team %>
<%= render partial: "sidebar", locals: { repositories: @repositories } %>
<div class="content-pane flexible">
<div class="content-pane flexible <%= params[:archived] ? 'archived' : 'active' %> repositories-index">
<div class="content-header">
<h1><%= t('libraries.index.head_title') %></h1>
<h1 data-view-mode="active"><%= t('libraries.index.head_title') %></h1>
<h1 data-view-mode="archived"><%= t('libraries.index.head_title_archived') %></h1>
<%= render layout: "shared/view_switch" do %>
<li class="view-switch-archived" data-view-mode="active">
<i class="fas fa-archive button-icon"></i>
<%= t('libraries.index.switch_view.archived') %>
</li>
<li class="view-switch-active" data-view-mode="archived">
<i class="fas fa-rocket button-icon"></i>
<%= t('libraries.index.switch_view.active') %>
</li>
<% end %>
</div>
<div class="content-body">
</div>
<template id="activeRepositoriesListTable">
<table id="repositoriesList" class="table"
data-source="<%= team_repositories_path(current_team, format: :json) %>"
>
<thead>
<tr>
<th>
<div class="sci-checkbox-container">
<input value="1" type="checkbox" class="sci-checkbox">
<span class="sci-checkbox-label"></span>
</div>
</th>
<th><%= t('libraries.index.table.name') %></th>
<th><%= t('libraries.index.table.number_of_items') %></th>
<th><%= t('libraries.index.table.shared') %></th>
<th><%= t('libraries.index.table.shared') %></th>
<th>Added on</th>
<th>Added by</th>
</tr>
</thead>
</table>
</template>
<template id="activeRepositoriesListButtons">
<% if can_create_repositories?(current_team) %>
<a class="btn btn-primary btn-lg create-new-repository"
data-remote="true"
href="<%= create_modal_team_repositories_path(current_team) %>">
<span class="fas fa-plus"></span>
<span class="hidden-xs"><%= t('libraries.index.no_libraries.create_new_button') %></span>
</a>
<% end %>
</template>
</div>
<% end %>
<!-- Active table template -->
<template id="activeRepositoriesListTable">
<table id="repositoriesList" class="table"
data-source="<%= team_repositories_path(current_team, format: :json) %>"
>
<thead>
<tr>
<th>
<div class="sci-checkbox-container">
<input value="1" type="checkbox" class="sci-checkbox">
<span class="sci-checkbox-label"></span>
</div>
</th>
<th><%= t('libraries.index.table.name') %></th>
<th><%= t('libraries.index.table.number_of_items') %></th>
<th><%= t('libraries.index.table.shared') %></th>
<th><%= t('libraries.index.table.ownership') %></th>
<th><%= t('libraries.index.table.added_on') %></th>
<th><%= t('libraries.index.table.added_by') %></th>
</tr>
</thead>
</table>
</template>
<!-- Archived table template -->
<template id="archivedRepositoriesListTable">
<table id="repositoriesList" class="table"
data-source="<%= team_repositories_path(current_team, archived: true, format: :json) %>"
>
<thead>
<tr>
<th>
<div class="sci-checkbox-container">
<input value="1" type="checkbox" class="sci-checkbox">
<span class="sci-checkbox-label"></span>
</div>
</th>
<th><%= t('libraries.index.table.name') %></th>
<th><%= t('libraries.index.table.number_of_items') %></th>
<th><%= t('libraries.index.table.shared') %></th>
<th><%= t('libraries.index.table.ownership') %></th>
<th><%= t('libraries.index.table.added_on') %></th>
<th><%= t('libraries.index.table.added_by') %></th>
<th><%= t('libraries.index.table.archived_on') %></th>
<th><%= t('libraries.index.table.archived_by') %></th>
</tr>
</thead>
</table>
</template>
<!-- Repositories action buttons -->
<template id="repositoriesListButtons">
<% if can_create_repositories?(current_team) %>
<a class="btn btn-primary btn-lg create-new-repository"
data-remote="true"
data-view-mode="active"
href="<%= create_modal_team_repositories_path(current_team) %>">
<span class="fas fa-plus"></span>
<span class="hidden-xs"><%= t('libraries.index.no_libraries.create_new_button') %></span>
</a>
<% end %>
<a class="btn btn-light" data-view-mode="active" href="#">
<span class="fas fa-pencil-alt"></span>
<%= t('libraries.index.buttons.edit') %>
</a>
<a class="btn btn-light" data-view-mode="active" href="#">
<span class="fas fa-copy"></span>
<%= t('libraries.index.buttons.duplicate') %>
</a>
<a class="btn btn-light" data-view-mode="active" href="#">
<span class="fas fa-archive"></span>
<%= t('libraries.index.buttons.archive') %>
</a>
<a class="btn btn-light" data-view-mode="archived" href="#">
<span class="fas fa-undo"></span>
<%= t('libraries.index.buttons.restore') %>
</a>
<a class="btn btn-light" data-view-mode="archived" href="#">
<span class="fas fa-trash"></span>
<%= t('libraries.index.buttons.delete') %>
</a>
</template>
<%= javascript_include_tag "repositories/index" %>
<%= stylesheet_link_tag 'datatables' %>

9
app/views/shared/_view_switch.html.erb Normal file
View file

@ -0,0 +1,9 @@
<div class="dropdown view-switch">
<a href="#" class="btn btn-light view-switch-button" id="viewSwitchButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
<span>View</span>
<span class="caret pull-right"></span>
</a>
<ul class="dropdown-menu dropdown-menu-right" aria-labelledby="viewSwitchButton">
<%= yield %>
</ul>
</div>

12
config/locales/en.yml
View file

@ -1312,6 +1312,7 @@ en:
error_flash: "Something went wrong! Please try again later."
index:
head_title: "Inventories"
head_title_archived: "Archived Inventories"
table:
name: "Name"
number_of_items: "No. of items"
@ -1319,6 +1320,17 @@ en:
ownership: "Ownership"
added_on: "Added on"
added_by: "Added by"
archived_on: "Archived on"
archived_by: "Archived by"
switch_view:
active: Show active inventories
archived: Show archived inventories
buttons:
edit: "Edit"
duplicate: "Duplicate"
archive: "Archive"
restore: "Restore"
delete: "Delete"
no_libraries:
create_new_button: "New Inventory"
show: