mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2024-12-25 01:03:18 +08:00
Add barcodes to repository item card [SCI-5883][SCI-5884] (#3447)
* Add barcodes to repository item card [SCI-5883][SCI-5884] * Fix markup [SCI-5883]
This commit is contained in:
aignatov-bio
GitHub
parent
7551432687
commit
be777a8919
12 changed files with 156 additions and 28 deletions
|
|
@ -1,3 +1,5 @@
|
|||
/* global dropdownSelector bwipjs */
|
||||
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
|
|
@ -16,6 +18,15 @@
|
|||
$(this).find('.modal-body #repository_row-info-table').DataTable().destroy();
|
||||
$(this).remove();
|
||||
});
|
||||
|
||||
let barCodeCanvas = bwipjs.toCanvas('bar-code-canvas', {
|
||||
bcid: 'qrcode',
|
||||
text: $('#modal-info-repository-row #bar-code-canvas').data('id').toString(),
|
||||
scale: 3
|
||||
});
|
||||
$('#modal-info-repository-row #bar-code-image').attr('src', barCodeCanvas.toDataURL('image/png'));
|
||||
|
||||
|
||||
$('#repository_row-info-table').DataTable({
|
||||
dom: 'RBltpi',
|
||||
stateSave: false,
|
||||
|
|
@ -40,4 +51,27 @@
|
|||
e.preventDefault();
|
||||
return false;
|
||||
});
|
||||
|
||||
$(document).on('click', '.print-label-button', function() {
|
||||
$.ajax({
|
||||
method: 'GET',
|
||||
url: $(this).data('url'),
|
||||
dataType: 'json'
|
||||
}).done(function(xhr, settings, data) {
|
||||
$('body').append($.parseHTML(data.responseJSON.html));
|
||||
$('#modal-print-repository-row-label').modal('show', {
|
||||
backdrop: true,
|
||||
keyboard: false
|
||||
}).on('hidden.bs.modal', function() {
|
||||
$(this).remove();
|
||||
});
|
||||
|
||||
dropdownSelector.init('#modal-print-repository-row-label #printers', {
|
||||
noEmptyOption: true,
|
||||
singleSelect: true,
|
||||
closeOnSelect: true,
|
||||
selectAppearance: 'simple'
|
||||
});
|
||||
});
|
||||
});
|
||||
})();
|
||||
|
|
|
|||
|
|
@ -0,0 +1,21 @@
|
|||
#modal-print-repository-row-label {
|
||||
|
||||
.id-label {
|
||||
margin-left: .5em;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.printers-container {
|
||||
margin-bottom: 1em;
|
||||
min-height: 4em;
|
||||
}
|
||||
|
||||
.print-copies-input {
|
||||
margin-left: .5em;
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
#modal-info-repository-row {
|
||||
.bar-code-container {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
|
@ -5,7 +5,7 @@ class RepositoryRowsController < ApplicationController
|
|||
include MyModulesHelper
|
||||
|
||||
before_action :load_repository, except: :show
|
||||
before_action :load_repository_row, only: %i(update assigned_task_list)
|
||||
before_action :load_repository_row, only: %i(update assigned_task_list print_modal)
|
||||
before_action :check_read_permissions, except: %i(show create update delete_records copy_records)
|
||||
before_action :check_snapshotting_status, only: %i(create update delete_records copy_records)
|
||||
before_action :check_create_permissions, only: :create
|
||||
|
|
@ -71,6 +71,19 @@ class RepositoryRowsController < ApplicationController
|
|||
end
|
||||
end
|
||||
|
||||
def print_modal
|
||||
@printers = ['test1', 'test2', 'test3']
|
||||
respond_to do |format|
|
||||
format.json do
|
||||
render json: {
|
||||
html: render_to_string(
|
||||
partial: 'repositories/print_label_modal.html.erb'
|
||||
)
|
||||
}
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
def update
|
||||
row_update = RepositoryRows::UpdateRepositoryRowService
|
||||
.call(repository_row: @repository_row, user: current_user, params: update_params)
|
||||
|
|
|
|||
1
app/javascript/packs/custom/bwipjs.js
Normal file
1
app/javascript/packs/custom/bwipjs.js
Normal file
|
|
@ -0,0 +1 @@
|
|||
window.bwipjs = require('bwip-js');
|
||||
29
app/views/repositories/_print_label_modal.html.erb
Normal file
29
app/views/repositories/_print_label_modal.html.erb
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
<div class="modal fade" id="modal-print-repository-row-label" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
|
||||
<div class="modal-dialog" role="document">
|
||||
<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">
|
||||
<%= t('repository_row.modal_print_label.head_title', repository_row: @repository_row.name) %>
|
||||
<span class="id-label">
|
||||
<%= t('repository_row.modal_print_label.id_label', repository_row_id: @repository_row.id) %>
|
||||
</span>
|
||||
</h4>
|
||||
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class=printers-container>
|
||||
<label><%= t('repository_row.modal_print_label.printer') %></label>
|
||||
<%= select_tag "printers", options_for_select(@printers) %>
|
||||
</div>
|
||||
<p class="sci-input-container">
|
||||
<label><%= t('repository_row.modal_print_label.number_of_copies') %></label>
|
||||
<%= number_field_tag :copies, 1, min: 1, class: 'sci-input-field print-copies-input' %>
|
||||
</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-primary" data-dismiss="modal"><%= t('repository_row.modal_print_label.print_label') %></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -15,33 +15,41 @@
|
|||
<%= t('repositories.repository', name: @repository_row.repository.name) %>
|
||||
<%= @repository_row.repository.archived? ? I18n.t('atwho.res.archived') : '' %>
|
||||
</ol>
|
||||
<p>
|
||||
<span>
|
||||
<%= t('repository_row.modal_info.ID') %>
|
||||
<%= @repository_row.parent_id || @repository_row.id %>
|
||||
</span>
|
||||
<br>
|
||||
<span>
|
||||
<%= t('repository_row.modal_info.added_on') %>:
|
||||
<%= l(@repository_row.created_at, format: :full) %>
|
||||
</span>
|
||||
<br>
|
||||
<span>
|
||||
<%= t('repository_row.modal_info.added_by') %>:
|
||||
<%= @repository_row.created_by.full_name %>
|
||||
</span>
|
||||
<% @repository_row.repository_cells.each do |repository_cell| %>
|
||||
<br>
|
||||
<span>
|
||||
<%= t 'repository_row.modal_info.column_name', cf: repository_cell.repository_column.name %>
|
||||
<% if repository_cell.value_type == 'RepositoryAssetValue' %>
|
||||
<%= render partial: 'assets/asset_link', locals: { asset: repository_cell.value.asset, display_image_tag: false }, formats: :html %>
|
||||
<% else %>
|
||||
<%= custom_auto_link(repository_cell.value.formatted, simple_format: false, team: current_team) %>
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<p>
|
||||
<span>
|
||||
<%= t('repository_row.modal_info.ID') %>
|
||||
<%= @repository_row.parent_id || @repository_row.id %>
|
||||
</span>
|
||||
<br>
|
||||
<span>
|
||||
<%= t('repository_row.modal_info.added_on') %>:
|
||||
<%= l(@repository_row.created_at, format: :full) %>
|
||||
</span>
|
||||
<br>
|
||||
<span>
|
||||
<%= t('repository_row.modal_info.added_by') %>:
|
||||
<%= @repository_row.created_by.full_name %>
|
||||
</span>
|
||||
<% @repository_row.repository_cells.each do |repository_cell| %>
|
||||
<br>
|
||||
<span>
|
||||
<%= t 'repository_row.modal_info.column_name', cf: repository_cell.repository_column.name %>
|
||||
<% if repository_cell.value_type == 'RepositoryAssetValue' %>
|
||||
<%= render partial: 'assets/asset_link', locals: { asset: repository_cell.value.asset, display_image_tag: false }, formats: :html %>
|
||||
<% else %>
|
||||
<%= custom_auto_link(repository_cell.value.formatted, simple_format: false, team: current_team) %>
|
||||
<% end %>
|
||||
</span>
|
||||
<% end %>
|
||||
</span>
|
||||
<% end %>
|
||||
</p>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-4 bar-code-container">
|
||||
<canvas id="bar-code-canvas" class="hidden" data-id="<%= @repository_row.parent_id || @repository_row.id %>"></canvas>
|
||||
<img id="bar-code-image"></img>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% if @repository_row.repository.is_a?(Repository) %>
|
||||
<% if @assigned_modules.size.positive? %>
|
||||
|
|
@ -98,7 +106,9 @@
|
|||
<% end %>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal"><%= t('general.close')%></button>
|
||||
<button type="button" class="btn btn-secondary" data-dismiss="modal"><%= t('general.close')%></button>
|
||||
<button type="button" class="btn btn-primary print-label-button" data-dismiss="modal" data-url="<%= print_modal_repository_repository_row_path(@repository_row.repository, @repository_row) %>"><%= t('repository_row.modal_print_label.print_label') %></button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -172,6 +172,7 @@
|
|||
<%= javascript_pack_tag 'emoji_button' %>
|
||||
<%= javascript_pack_tag 'pdfjs/pdf_js' %>
|
||||
<%= stylesheet_pack_tag 'pdfjs/pdf_js_styles' %>
|
||||
<%= javascript_pack_tag 'custom/bwipjs' %>
|
||||
|
||||
<script type="text/javascript" charset="utf-8">
|
||||
var formatJS = "<%= datetime_picker_format_date_only %>"
|
||||
|
|
|
|||
|
|
@ -1607,6 +1607,12 @@ en:
|
|||
title: "This item is assigned to %{nr} tasks."
|
||||
private_tasks: "%{nr} task(s) are private and will not be displayed."
|
||||
no_tasks: "This item in not assigned to any task."
|
||||
modal_print_label:
|
||||
head_title: "Print label - %{repository_row}"
|
||||
id_label: "ID: %{repository_row_id}"
|
||||
printer: "Printer"
|
||||
number_of_copies: "Number of copies"
|
||||
print_label: "Print label"
|
||||
activities:
|
||||
index:
|
||||
global_activities_title: "Global activities"
|
||||
|
|
|
|||
|
|
@ -561,6 +561,7 @@ Rails.application.routes.draw do
|
|||
resources :repository_columns, only: %i(index new edit destroy)
|
||||
resources :repository_rows, only: %i(create show update) do
|
||||
member do
|
||||
get :print_modal
|
||||
get :assigned_task_list
|
||||
end
|
||||
end
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@
|
|||
"babel-loader": "^8.0.0",
|
||||
"babel-plugin-transform-react-remove-prop-types": "^0.4.24",
|
||||
"bootstrap-sass": "^3.3.7",
|
||||
"bwip-js": "^3.0.1",
|
||||
"coffee-loader": "^0.8.0",
|
||||
"coffeescript": "^1.12.6",
|
||||
"compression-webpack-plugin": "^1.1.11",
|
||||
|
|
|
|||
|
|
@ -1823,6 +1823,11 @@ builtin-status-codes@^3.0.0:
|
|||
resolved "https://registry.yarnpkg.com/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz#85982878e21b98e1c66425e03d0174788f569ee8"
|
||||
integrity sha1-hZgoeOIbmOHGZCXgPQF0eI9Wnug=
|
||||
|
||||
bwip-js@^3.0.1:
|
||||
version "3.0.1"
|
||||
resolved "https://registry.yarnpkg.com/bwip-js/-/bwip-js-3.0.1.tgz#13cbfbea186f038308635624e9db17796eda047e"
|
||||
integrity sha512-3kC5orAnLaRnXhW6tmH+pZL9nmKBPPzPHFsBi8rDMr68JapkwN0I2CqJKFUT9c1THN/dfLq95R2t3nE4jgNQPw==
|
||||
|
||||
bytes@3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/bytes/-/bytes-3.0.0.tgz#d32815404d689699f85a4ea4fa8755dd13a96048"
|
||||
|
|
|
|||
Loading…
Reference in a new issue