mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2025-01-01 21:21:50 +08:00
add content to preview modal
This commit is contained in:
parent
2cfcba0ceb
commit
40e3240a99
8 changed files with 219 additions and 6 deletions
|
@ -204,6 +204,7 @@ function initProtocolPreviewModal() {
|
|||
modalTitle.html(data.title);
|
||||
modalBody.html(data.html);
|
||||
modal.modal("show");
|
||||
initHandsOnTable($(document));
|
||||
},
|
||||
error: function (error) {
|
||||
// TODO
|
||||
|
@ -375,7 +376,6 @@ function initModals() {
|
|||
// Protocol preview modal close action
|
||||
$("#protocol-preview-modal").on("hidden.bs.modal", function(e) {
|
||||
$(this).find(".modal-title").html("");
|
||||
// Destroy the embedded data
|
||||
$(this).find(".modal-body").html("");
|
||||
});
|
||||
}
|
||||
|
|
|
@ -284,6 +284,7 @@ function toggleButtons(show) {
|
|||
|
||||
// Creates handsontable where needed
|
||||
function initHandsOnTable(root) {
|
||||
|
||||
root.find("[data-role='hot-table']").each(function() {
|
||||
var $container = $(this).find("[data-role='step-hot-table']");
|
||||
var contents = $(this).find('.hot-contents');
|
||||
|
|
|
@ -1139,6 +1139,24 @@ ul.content-module-activities {
|
|||
}
|
||||
}
|
||||
|
||||
/* Preview protocol modal */
|
||||
@media (min-width: 768px) {
|
||||
#protocol-preview-modal .modal-dialog {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
#protocol-preview-modal .modal-dialog {
|
||||
.modal-body {
|
||||
max-height: 75vh;
|
||||
overflow-y: auto;
|
||||
width: 100%;
|
||||
|
||||
.ql-editor {
|
||||
min-height: initial;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Import protocol/s modal */
|
||||
#import-protocol-modal .modal-dialog {
|
||||
width: 70%;
|
||||
|
|
|
@ -26,7 +26,8 @@ class ProtocolsController < ApplicationController
|
|||
]
|
||||
before_action :check_view_all_permissions, only: [
|
||||
:index,
|
||||
:datatable
|
||||
:datatable,
|
||||
:preview
|
||||
]
|
||||
before_action :check_unlink_permissions, only: [
|
||||
:unlink,
|
||||
|
|
|
@ -136,3 +136,17 @@
|
|||
|
||||
<%= stylesheet_link_tag 'datatables' %>
|
||||
<%= javascript_include_tag "protocols/index" %>
|
||||
<%= javascript_include_tag "protocols/steps" %>
|
||||
|
||||
<!-- Libraries for formulas -->
|
||||
<%= javascript_include_tag "lodash" %>
|
||||
<%= javascript_include_tag "numeral" %>
|
||||
<%= javascript_include_tag "numeric" %>
|
||||
<%= javascript_include_tag "md5" %>
|
||||
<%= javascript_include_tag "jstat" %>
|
||||
<%= javascript_include_tag "formula" %>
|
||||
<%= javascript_include_tag "parser" %>
|
||||
<%= javascript_include_tag "ruleJS" %>
|
||||
<%= javascript_include_tag "handsontable.formula" %>
|
||||
<%= javascript_include_tag "big.min" %>
|
||||
<%= stylesheet_link_tag "handsontable.formula" %>
|
|
@ -3,8 +3,8 @@
|
|||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
|
||||
<h4 class="modal-title" id="protocol-preview-modal-label">
|
||||
</h4>
|
||||
<h2 class="modal-title" id="protocol-preview-modal-label">
|
||||
</h2>
|
||||
</div>
|
||||
<div class="modal-body"></div>
|
||||
<div class="modal-footer">
|
||||
|
@ -12,4 +12,4 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -0,0 +1,179 @@
|
|||
<div class="row">
|
||||
<div class="col-xs-6 col-sm-4 col-md-4">
|
||||
<div class="badge-icon bg-primary">
|
||||
<span class="glyphicon glyphicon-calendar"></span>
|
||||
</div>
|
||||
<div class="well well-sm">
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.created_at" %>:</span>
|
||||
<strong><%= l(@protocol.created_at, format: :full) %></strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-6 col-sm-4 col-md-4">
|
||||
<div class="badge-icon bg-primary">
|
||||
<span class="glyphicon glyphicon-calendar"></span>
|
||||
</div>
|
||||
<div class="well well-sm">
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.updated_at" %>:</span>
|
||||
<strong data-role="updated-at-refresh"><%= render partial: "protocols/header/updated_at_label.html.erb" %></strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-4 col-md-4">
|
||||
<div class="badge-icon bg-primary">
|
||||
<span class="glyphicon glyphicon-user"></span>
|
||||
</div>
|
||||
<div class="well well-sm">
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.added_by" %>:</span>
|
||||
<strong><%= @protocol.added_by.full_name %></strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<div class="badge-icon bg-primary">
|
||||
<span class="glyphicon glyphicon-text-color"></span>
|
||||
</div>
|
||||
<div class="well well-sm">
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.keywords" %>:</span>
|
||||
<%= render partial: "protocols/header/keywords_label.html.erb" %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-md-6">
|
||||
<div class="badge-icon bg-primary">
|
||||
<span class="glyphicon glyphicon-education"></span>
|
||||
</div>
|
||||
<div class="well well-sm">
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.authors" %>:</span>
|
||||
<%= render partial: "protocols/header/authors_label.html.erb" %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-12 col-md-12">
|
||||
<div class="badge-icon bg-primary">
|
||||
<span class="glyphicon glyphicon-info-sign"></span>
|
||||
</div>
|
||||
<div class="well well-sm">
|
||||
<span class="hidden-xs hidden-sm hidden-md"><%=t "protocols.header.description" %>:</span>
|
||||
<%= render partial: "protocols/header/description_label.html.erb" %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-role="steps-container">
|
||||
<div class="row">
|
||||
<div class="col-xs-8">
|
||||
<h2><%= t("protocols.steps.subtitle") %></h2>
|
||||
</div>
|
||||
</div>
|
||||
<div id="steps">
|
||||
<% protocol.steps.order(:position).each do |step| %>
|
||||
<div class ="step <%= step.completed? ? "completed" : "not-completed" %>">
|
||||
<div class="badge-num">
|
||||
<span class="badge bg-primary size-digit-<%= (step.position + 1).to_s.length %>"><%= step.position + 1 %></span>
|
||||
</div>
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<strong><%= step.name %></strong> |
|
||||
<span><%= raw t("protocols.steps.published_on", timestamp: l(step.created_at, format: :full), user: step.user.full_name) %></span>
|
||||
</div>
|
||||
<div class="panel-collapse collapse in" id="step-panel-<%= step.id %>" role="tabpanel" aria-expanded="true">
|
||||
<div class="panel-body">
|
||||
<div class="row">
|
||||
<div class="col-xs-12">
|
||||
<% if strip_tags(step.description).blank? %>
|
||||
<em><%= t("protocols.steps.no_description") %></em>
|
||||
<% else %>
|
||||
<div class="ql-editor">
|
||||
<%= step.description.html_safe %>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<% unless step.tables.blank? then %>
|
||||
<hr>
|
||||
<div class="col-xs-12">
|
||||
<strong><%= t("protocols.steps.tables") %></strong>
|
||||
<% step.tables.each do |table| %>
|
||||
<div data-role="hot-table" class="hot-table">
|
||||
<%= hidden_field(table, :contents, value: table.contents_utf_8, class: "hot-contents") %>
|
||||
<div data-role="step-hot-table" class="step-result-hot-table"></div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<% assets = ordered_assets(step) %>
|
||||
<% unless assets.blank? then %>
|
||||
<hr>
|
||||
<div class="col-xs-12">
|
||||
<strong><%= t("protocols.steps.files") %></strong>
|
||||
<ul class="list-unstyled">
|
||||
<% assets.each do |asset| %>
|
||||
<li>
|
||||
<%= image_tag preview_asset_path(asset) if asset.is_image? %>
|
||||
<p><%= truncate(asset.file_file_name,
|
||||
length: Constants::FILENAME_TRUNCATION_LENGTH) %></p>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<% unless step.checklists.blank? then %>
|
||||
<hr>
|
||||
<div class="col-xs-12">
|
||||
<% step.checklists.each do |checklist| %>
|
||||
<strong><%= checklist.name %></strong>
|
||||
<% if checklist.checklist_items.empty? %>
|
||||
</br>
|
||||
<%= t("protocols.steps.empty_checklist") %>
|
||||
</br>
|
||||
<% else %>
|
||||
<% ordered_checklist_items(checklist).each do |checklist_item| %>
|
||||
<div class="checkbox">
|
||||
<label>
|
||||
<% if protocol.in_module? %>
|
||||
<input type="checkbox" value="" <%= "checked" if checklist_item.checked? %> disabled="disabled"/>
|
||||
<% else %>
|
||||
<input type="checkbox" value="" disabled="disabled" />
|
||||
<% end %>
|
||||
<%= checklist_item.text %>
|
||||
</label>
|
||||
</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<% if protocol.steps.count == 0 %>
|
||||
<div data-role="no-steps-text">
|
||||
<em><%= t("protocols.steps.no_steps") %></em>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<%= javascript_include_tag "protocols/steps" %>
|
||||
|
||||
<!-- Libraries for formulas -->
|
||||
<%= javascript_include_tag "lodash" %>
|
||||
<%= javascript_include_tag "numeral" %>
|
||||
<%= javascript_include_tag "numeric" %>
|
||||
<%= javascript_include_tag "md5" %>
|
||||
<%= javascript_include_tag "jstat" %>
|
||||
<%= javascript_include_tag "formula" %>
|
||||
<%= javascript_include_tag "parser" %>
|
||||
<%= javascript_include_tag "ruleJS" %>
|
||||
<%= javascript_include_tag "handsontable.formula" %>
|
||||
<%= javascript_include_tag "big.min" %>
|
||||
<%= stylesheet_link_tag "handsontable.formula" %>
|
|
@ -1202,7 +1202,7 @@ en:
|
|||
thead_archived_on: "Archived at"
|
||||
thead_updated_at: "Last modified at"
|
||||
preview:
|
||||
title: "Protocol preview"
|
||||
title: "%{protocol} preview"
|
||||
linked_children:
|
||||
title: "Tasks linked to protocol %{protocol}"
|
||||
used_in: "Number of tasks linked to this protocol: %{nr}"
|
||||
|
|
Loading…
Reference in a new issue