scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-01-26 09:43:29 +08:00
Code Issues Projects Releases Packages Wiki Activity

Add styling for template values [SCI-5630] (#3264)

Browse source
This commit is contained in:
aignatov-bio 2021-05-03 15:17:09 +02:00 committed by GitHub
parent ad678a7452
commit 7752267808
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 118 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
app/assets/javascripts/reports/new.js
View file

@ -1159,7 +1159,7 @@ function reportHandsonTableConverter() {
}
}
$('.reports-new').on('change', '.report-experiment-checkbox', function() {
$('.project-contents-container').on('change', '.report-experiment-checkbox', function() {
$(this).closest('li').find('.report-my-module-checkbox').prop('checked', this.checked);
selectAllState();
hideUnchekedElements($('.hide-unchecked-checkbox').prop('checked'));
@ -1290,9 +1290,19 @@ function reportHandsonTableConverter() {
SelectAllRepositoriesStatus();
}
function initTemplateValuesContainer() {
$('.report-template-values-container').on('click', '.collapse-all', function() {
$('.report-template-values-container .values-container').collapse('hide');
})
.on('click', '.expand-all', function() {
$('.report-template-values-container .values-container').collapse('show');
});
}
initGenerateButton();
initReportWizard();
initDropdowns();
initTaskContents();
initProjectContents();
initTemplateValuesContainer();
}());

74
app/assets/stylesheets/reports/new.scss
View file

@ -278,24 +278,72 @@
padding: 1em 2em;
width: 60%;
.description {
@include font-main;
}
.project-selector,
.template-selector {
display: inline-block;
.template-editor-header {
align-items: center;
display: flex;
margin-bottom: 1em;
width: 100%;
label {
@include font-small;
.title {
margin: 0 auto 0 0;
}
}
#projectDescription {
height: 110px;
padding: .5em;
.template-editor-description {
@include font-main;
}
.fa-caret-down {
cursor: pointer;
margin-right: .25em;
&.collapsed {
@include rotate(-90deg);
}
}
.values-container {
.checkbox-value-container {
margin-bottom: 1em;
}
.sci-input-container {
margin-bottom: 1em;
input[type="text"] {
display: block;
max-width: 40%;
}
textarea {
height: 10em;
}
input[type="date"] {
display: block;
max-width: 40%;
}
}
.sci-checkbox-container {
float: left;
margin-right: .5em;
}
ul {
list-style-type: none;
padding-left: 0;
li {
padding: .25em 0;
}
}
.sci-select-container {
display: inline-block;
margin-bottom: 1em;
width: 40%;
}
}
}

2
app/components/reports/checkbox_input_component.html.erb
View file

@ -1,4 +1,4 @@
<div>
<div class="checkbox-value-container">
<div class="sci-checkbox-container">
<%= check_box_tag @name, true, (@value == 'true'), class: 'sci-checkbox', data: { type: 'CheckboxInputComponent' } %>
<span class="sci-checkbox-label"></span>

2
app/components/reports/project_members_input_component.html.erb
View file

@ -1,5 +1,5 @@
<% if @editing %>
<div class="sci-input-container">
<div class="sci-select-container">
<%= label_tag @name, @label %>
<%= select_tag @name, options_from_collection_for_select(@project_members, :id, :name), placeholder: @placeholder, class: 'sci-input-field report-template-value-dropdown', data: { type: 'ProjectMembersInputComponent' } %>
</div>

61
app/views/layouts/reports/template_values_editor.html.erb
View file

@ -1,21 +1,48 @@
<h1>
<%= t('projects.reports.wizard.first_step.values_editor.title') %>
</h1>
<h3>
<div class="template-editor-header">
<h1 class="title">
<%= t('projects.reports.wizard.first_step.values_editor.title') %>
</h1>
<div class="collapse-buttons sci-btn-group pull-right">
<button class="btn btn-light collapse-all">
<i class="fas fa-caret-up"></i>
<%= t("projects.reports.wizard.second_step.collapse_all") %>
</button>
<button class="btn btn-light expand-all">
<i class="fas fa-caret-down"></i>
<%= t("projects.reports.wizard.second_step.expand_all") %>
</button>
</div>
</div>
<div class="template-editor-description">
<%= t('projects.reports.wizard.first_step.values_editor.description') %>
</h3>
</div>
<h1>
<%= t('projects.reports.wizard.first_step.values_editor.header') %>
</h1>
<%= yield :header %>
<div class="section">
<h1>
<i class="fas fa-caret-down " data-toggle="collapse" href="#headerContainer" aria-expanded="false"></i>
<%= t('projects.reports.wizard.first_step.values_editor.header') %>
</h1>
<div class="values-container collapse in" id="headerContainer">
<%= yield :header %>
</div>
</div>
<h1>
<%= t('projects.reports.wizard.first_step.values_editor.cover') %>
</h1>
<%= yield :cover %>
<div class="section">
<h1>
<i class="fas fa-caret-down " data-toggle="collapse" href="#coverContainer" aria-expanded="false"></i>
<%= t('projects.reports.wizard.first_step.values_editor.cover') %>
</h1>
<div class="values-container collapse in" id="coverContainer">
<%= yield :cover %>
</div>
</div>
<h1>
<%= t('projects.reports.wizard.first_step.values_editor.footer') %>
</h1>
<%= yield :footer %>
<div class="section">
<h1>
<i class="fas fa-caret-down " data-toggle="collapse" href="#footerContainer" aria-expanded="false"></i>
<%= t('projects.reports.wizard.first_step.values_editor.footer') %>
</h1>
<div class="values-container collapse in" id="footerContainer">
<%= yield :footer %>
</div>
</div>