mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2025-10-24 21:24:52 +08:00
Merge pull request #2495 from mlorb/ml-sci-4483-sci-4486
Add new task general layout and add notes section [SCI-4483] [SCI-4486]
This commit is contained in:
commit
404be29fc0
8 changed files with 158 additions and 95 deletions
|
|
@ -6,25 +6,51 @@
|
|||
@import "constants";
|
||||
@import "mixins";
|
||||
|
||||
#manage-module-tags-modal {
|
||||
.content-pane.my-modules-protocols-index {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.task-section {
|
||||
border-left: 3px solid $color-concrete;
|
||||
margin: 16px 0;
|
||||
padding-left: 16px;
|
||||
|
||||
.task-section-caret {
|
||||
color: $color-volcano;
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
|
||||
.fas {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
&:not(.collapsed) .fas {
|
||||
@include rotate(90deg);
|
||||
}
|
||||
}
|
||||
|
||||
.task-section-title {
|
||||
display: inline-block;
|
||||
|
||||
h2 {
|
||||
margin-bottom: 8px;
|
||||
margin-top: 11px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#manage-module-tags-modal {
|
||||
.well {
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
.module-header {
|
||||
.task-details {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
+ .protocol-title {
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
margin: 10px 0 15px;
|
||||
}
|
||||
|
||||
.fas.block-icon {
|
||||
color: $color-silver;
|
||||
font-size: 18px;
|
||||
|
|
@ -126,25 +152,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.module-description {
|
||||
float: left;
|
||||
width: 100%;
|
||||
|
||||
.no-description {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 22px;
|
||||
font-weight: bold;
|
||||
padding: 20px 0 5px;
|
||||
}
|
||||
|
||||
.my-module-description-content {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.module-tags {
|
||||
float: left;
|
||||
width: 100%;
|
||||
|
|
@ -250,13 +257,26 @@
|
|||
float: left;
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.task-notes {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
.no-description {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.task-notes-content {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.my-module-recent-protocols {
|
||||
flex-grow: 1;
|
||||
height: 36px;
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<%= render partial: 'shared/tiny_mce_extra_buttons.html.erb' %>
|
||||
<div id="my_module_description_view"
|
||||
class="ql-editor tinymce-view"
|
||||
data-placeholder="<%= t('my_modules.module_header.empty_description_edit_label') %>"
|
||||
data-placeholder="<%= t('my_modules.notes.empty_description_edit_label') %>"
|
||||
data-tinymce-init="tinymce-my-module-description-<%= @my_module.id %>"
|
||||
><%= custom_auto_link(@my_module.tinymce_render(:description),
|
||||
simple_format: false,
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
<%= f.tiny_mce_editor(:description,
|
||||
id: :my_module_description_textarea,
|
||||
class: 'hidden',
|
||||
placeholder: t('my_modules.module_header.empty_description_edit_label'),
|
||||
placeholder: t('my_modules.notes.empty_description_edit_label'),
|
||||
hide_label: true,
|
||||
value: sanitize_input(@my_module.tinymce_render(:description)),
|
||||
autocomplete: 'off',
|
||||
|
|
|
|||
|
|
@ -16,8 +16,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="flex-block">
|
||||
<div class="flex-block-label">
|
||||
<span class="fas block-icon fa-tachometer-alt"></span>
|
||||
|
|
@ -42,24 +40,5 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="module-description">
|
||||
<div class="title">
|
||||
<%= t('my_modules.module_header.description_label') %>
|
||||
</div>
|
||||
<div class="my-module-description-content">
|
||||
<% if can_manage_module?(@my_module) %>
|
||||
<%= render partial: "description_form" %>
|
||||
<% elsif @my_module.description.present? %>
|
||||
<%= custom_auto_link(@my_module.tinymce_render(:description),
|
||||
simple_format: false,
|
||||
tags: %w(img),
|
||||
team: current_team) %>
|
||||
<% else %>
|
||||
<span class="no-description"><%= t('my_modules.module_header.no_description') %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Manage tags modal -->
|
||||
<%= render partial: "my_modules/modals/manage_module_tags_modal", locals: { my_module: @my_module } %>
|
||||
14
app/views/my_modules/_my_module_notes.html.erb
Normal file
14
app/views/my_modules/_my_module_notes.html.erb
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
<div class="task-notes">
|
||||
<div class="task-notes-content">
|
||||
<% if can_manage_module?(@my_module) %>
|
||||
<%= render partial: "description_form" %>
|
||||
<% elsif @my_module.description.present? %>
|
||||
<%= custom_auto_link(@my_module.tinymce_render(:description),
|
||||
simple_format: false,
|
||||
tags: %w(img),
|
||||
team: current_team) %>
|
||||
<% else %>
|
||||
<span class="no-description"><%= t('my_modules.notes.no_description') %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
35
app/views/my_modules/_my_module_protocol.html.erb
Normal file
35
app/views/my_modules/_my_module_protocol.html.erb
Normal file
|
|
@ -0,0 +1,35 @@
|
|||
<div class="protocol-status-container">
|
||||
<div class="protocol-status-bar" data-role="protocol-status-bar">
|
||||
<%= render partial: "my_modules/protocols/protocol_status_bar.html.erb" %>
|
||||
</div>
|
||||
<%= render partial: "my_modules/protocols/protocol_buttons.html.erb" %>
|
||||
<% if can_manage_protocol_in_module?(@protocol) %>
|
||||
<%= render partial: "my_modules/recent_protocol_dropdown.html.erb", locals: {protocol: @my_module.protocol}%>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="protocol-description-content">
|
||||
<% if can_manage_module?(@my_module) %>
|
||||
<%= render partial: "my_modules/protocols/protocol_description_form", locals:
|
||||
{
|
||||
protocol: @my_module.protocol,
|
||||
update_url: update_protocol_description_my_module_path(@my_module, format: :json)
|
||||
}
|
||||
%>
|
||||
<% elsif @my_module.protocol.description.present? %>
|
||||
<%= custom_auto_link(@my_module.protocol.tinymce_render(:description),
|
||||
simple_format: false,
|
||||
tags: %w(img),
|
||||
team: current_team) %>
|
||||
<% else %>
|
||||
<span style="font-size: 16px"><%= t('my_modules.protocols.protocol_status_bar.no_description') %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-role="steps-container">
|
||||
<%= render partial: "protocols/steps.html.erb" %>
|
||||
</div>
|
||||
|
|
@ -5,55 +5,62 @@
|
|||
<%= render partial: "shared/secondary_navigation" %>
|
||||
|
||||
<div class="content-pane my-modules-protocols-index">
|
||||
<span class="module-header">
|
||||
<%= render partial: "module_header" %>
|
||||
</span>
|
||||
|
||||
<div class="protocol-title">
|
||||
<%= t('Protocol') %>
|
||||
</div>
|
||||
|
||||
<div class="protocol-status-container">
|
||||
<div class="protocol-status-bar" data-role="protocol-status-bar">
|
||||
<%= render partial: "my_modules/protocols/protocol_status_bar.html.erb" %>
|
||||
</div>
|
||||
<%= render partial: "my_modules/protocols/protocol_buttons.html.erb" %>
|
||||
<% if can_manage_protocol_in_module?(@protocol) %>
|
||||
<%= render partial: "my_modules/recent_protocol_dropdown.html.erb", locals: {protocol: @my_module.protocol}%>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<div class="protocol-description-content">
|
||||
<% if can_manage_module?(@my_module) %>
|
||||
<%= render partial: "my_modules/protocols/protocol_description_form", locals:
|
||||
{
|
||||
protocol: @my_module.protocol,
|
||||
update_url: update_protocol_description_my_module_path(@my_module, format: :json)
|
||||
}
|
||||
%>
|
||||
<% elsif @my_module.protocol.description.present? %>
|
||||
<%= custom_auto_link(@my_module.protocol.tinymce_render(:description),
|
||||
simple_format: false,
|
||||
tags: %w(img),
|
||||
team: current_team) %>
|
||||
<% else %>
|
||||
<span style="font-size: 16px"><%= t('my_modules.protocols.protocol_status_bar.no_description') %></span>
|
||||
<% end %>
|
||||
</div>
|
||||
<!-- Details -->
|
||||
<div class="task-section">
|
||||
<span class="task-section-title">
|
||||
<h2><%= t('my_modules.details.title') %></h2>
|
||||
</span>
|
||||
<div class="task-details">
|
||||
<%= render partial: "my_module_details" %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-role="steps-container">
|
||||
<%= render partial: "protocols/steps.html.erb" %>
|
||||
<!-- Notes -->
|
||||
<div class="task-section">
|
||||
<div class="task-section-header">
|
||||
<a class="task-section-caret" role="button" data-toggle="collapse" href="#notes-container" aria-expanded="true" aria-controls="notes-container">
|
||||
<i class="fas fa-caret-right"></i>
|
||||
<span class="task-section-title">
|
||||
<h2><%= t('my_modules.notes.title') %></h2>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="collapse in" id="notes-container" aria-expanded="true">
|
||||
<%= render partial: "my_module_notes" %>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Assigned items -->
|
||||
<div class="task-section">
|
||||
<div class="task-section-header">
|
||||
<a class="task-section-caret collapsed" role="button" data-toggle="collapse" href="#assigned-items-container" aria-expanded="false" aria-controls="assigned-items-container">
|
||||
<i class="fas fa-caret-right"></i>
|
||||
<span class="task-section-title">
|
||||
<h2><%= t('my_modules.assigned_items.title') %></h2>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="collapse" id="assigned-items-container">
|
||||
...
|
||||
</div>
|
||||
</div>
|
||||
<!-- Protocol -->
|
||||
<div class="task-section">
|
||||
<div class="task-section-header">
|
||||
<a class="task-section-caret collapsed" role="button" data-toggle="collapse" href="#protocol-container" aria-expanded="false" aria-controls="protocol-container">
|
||||
<i class="fas fa-caret-right"></i>
|
||||
<div class="task-section-title">
|
||||
<h2><%= t('my_modules.protocol.title') %></h2>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="collapse" id="protocol-container">
|
||||
<%= render partial: "my_module_protocol" %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- URL for status bar refreshing -->
|
||||
<div class="hidden" data-role="protocol-status-bar-url" data-url="<%= protocol_status_bar_protocol_path(@protocol) %>"></div>
|
||||
|
||||
|
||||
<!-- Confirm link update modal -->
|
||||
<%= render partial: "my_modules/protocols/confirm_link_update_modal.html.erb" %>
|
||||
|
||||
|
|
|
|||
|
|
@ -593,6 +593,16 @@ en:
|
|||
can_add_user_to_project: "Can not add user to the project."
|
||||
|
||||
my_modules:
|
||||
details:
|
||||
title: "Details"
|
||||
notes:
|
||||
title: "Notes"
|
||||
no_description: "No task description"
|
||||
empty_description_edit_label: "Click here to start writing notes"
|
||||
assigned_items:
|
||||
title: "Assigned items"
|
||||
protocol:
|
||||
title: "Protocol"
|
||||
buttons:
|
||||
complete: "Complete Task"
|
||||
uncomplete: "Uncomplete Task"
|
||||
|
|
@ -632,9 +642,6 @@ en:
|
|||
no_tags: "Add new Task Tags (optional)"
|
||||
manage_tags: "Manage tags"
|
||||
create_new_tag: "create new"
|
||||
no_description: "No task description"
|
||||
description_label: "Description"
|
||||
empty_description_edit_label: "Click here to enter Task Description (optional)"
|
||||
recent_protocols_from_repository: "Recent protocols from the Repository"
|
||||
protocols:
|
||||
head_title: "%{project} | %{module} | Protocols"
|
||||
|
|
|
|||
|
|
@ -42,6 +42,7 @@ Scenario: Successful add new step to a task
|
|||
@javascript
|
||||
Scenario: Successful add new step to a task
|
||||
Given I'm on the Protocols page of a "qPCR" task
|
||||
And I click "Protocol" link
|
||||
And I click first "New Step" link
|
||||
Then I fill in "PES" in "#step_name" field
|
||||
Then I fill in "zivali pa so se odpravile dalje po svetu." in "#step_description_textarea" rich text editor field
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue