Koha/koha-tmpl/intranet-tmpl/prog/en/modules/tools/stockrotation.tt
Owen Leonard ecde51a1f9
Bug 22209: Move stock rotation stage and item forms into modals
This patch makes a number of interface changes to the Stock Rotation
management interface:

 - "Add stage" and "Add items" forms are now triggered by clicking new
   buttons in the toolbar.
 - "Manage stages" and "Manage items" menu items have been added to a
   sidebar menu to be displayed when stages or items are being managed.
 - JavaScript has been added to move focus to the first form field in
   the modal when it is displayed. The "autofocus" attribute is not
   sufficent here because the modal is hidden by default.
 - Add messages to be shown when there are no items or stages to be
   displayed.
 - Correct "selected" attributes to use XHTML-style: selected="selected"
  (https://wiki.koha-community.org/wiki/Coding_Guidelines#HTML_Templates)

To test, apply the patch and go to Tools -> Stock rotation.

 - Create a rota if you don't already have one.
   - Manage stages for your rota.
     - If your rota has no stages you should see a message along with an
       "Add stage" button. The button should trigger the "Add stage"
       modal.
     - Test the "Add stage" button in the toolbar. It should trigger a
       modal dialog containing the form for adding a new stage. The
       cursor focus should automatically be on the "library" field.
     - Submitting the form should correctly add the stage.
     - Verify that there is a new menu in the sidebar, "Manage stages"
       and "Manage items."
   - Manage items for your rota.
     - If your rota has no items you should see a message along with an
       "Add items" button. The button should trigger the "Add items"
       modal.
     - Test the "Add items" button in the toolbar. It should trigger a
       modal dialog containing the form for adding new items. The cursor
       focus should automatically be on the "barcode" field.
     - Submitting either a barcode or a file of barcodes should work
       correctly.
     - Verify that the new menu items are shown in the sidebar.

Signed-off-by: Maryse Simard <maryse.simard@inlibro.com>
Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
2019-08-08 16:05:50 +01:00

584 lines
34 KiB
Text

[% USE raw %]
[% USE Asset %]
[% USE Koha %]
[% USE Branches %]
[% USE KohaDates %]
[% USE ColumnsSettings %]
[% SET footerjs = 1 %]
[% INCLUDE 'doc-head-open.inc' %]
<title>Koha &rsaquo; Stock rotation</title>
[% INCLUDE 'doc-head-close.inc' %]
</head>
<body id="tools_stockrotation" class="tools">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs">
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
&rsaquo; <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a>
[% IF no_op_set %]
&rsaquo; Stock rotation
[% ELSE %]
&rsaquo; <a href="/cgi-bin/koha/tools/stockrotation.pl">Stock rotation</a>
[% END %]
[% IF (op == 'create_edit_rota' && rota.rota_id) %]
&rsaquo; Edit rota
[% ELSIF (op == 'create_edit_rota' && !rota.rota_id) %]
&rsaquo; Create rota
[% ELSIF (op == 'manage_stages') %]
&rsaquo; Manage stages
[% ELSIF (op == 'create_edit_stage' && stage.id) %]
<a href="?op=manage_stages&amp;rota_id=[% rota_id | uri %]">&rsaquo; Manage stages</a>
&rsaquo; Edit stage
[% ELSIF (op == 'create_edit_stage' && !stage.id) %]
<a href="?op=manage_stages&amp;rota_id=[% rota_id | uri %]">&rsaquo; Manage stages</a>
&rsaquo; Create stage
[% ELSIF (op == 'manage_items') %]
&rsaquo; Manage items
[% END %]
</div>
<div class="main container-fluid">
<div class="row">
<div class="col-sm-10 col-sm-push-2">
<main>
<div id="stockrotation">
[% IF no_op_set %]
[% INCLUDE 'stockrotation-toolbar.inc' %]
<h2>Stock rotation</h2>
[% IF existing_rotas.size > 0 %]
<table id="stock_rotation" class="rotas_table" role="grid">
<thead>
<tr>
<th class="anti-the">Name</th>
<th>Cyclical</th>
<th>Active</th>
<th>Description</th>
<th>Number of items</th>
<th class="NoSort noExport">&nbsp;</th>
</tr>
</thead>
<tbody>
[% FOREACH rota IN existing_rotas %]
<tr>
<td>[% rota.title | html %]</td>
<td>[% rota.cyclical ? 'Yes' : 'No' | html %]</td>
<td>[% rota.active ? 'Yes' : 'No' | html %]</td>
<td>[% rota.description | html %]</td>
<td>[% rota.stockrotationitems.count | html %]</td>
<td class="actions">
<a class="btn btn-default btn-xs" href="?op=create_edit_rota&amp;rota_id=[% rota.rota_id | uri %]">
<i class="fa fa-pencil"></i>
Edit
</a>
<div class="btn-group dropup" role="group">
<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Manage
<i class="fa fa-caret-down"></i>
</button>
<ul class="dropdown-menu pull-right">
<li><a href="?op=manage_stages&amp;rota_id=[% rota.rota_id | uri %]">Stages</a></li>
[% IF CAN_user_stockrotation_manage_rota_items && rota.stockrotationstages.count > 0 %]
<li><a href="?op=manage_items&amp;rota_id=[% rota.rota_id | uri %]">Items</a></li>
[% END %]
</ul>
</div>
<a class="btn btn-default btn-xs" href="?op=toggle_rota&amp;rota_id=[% rota.rota_id | uri %]">
<i class="fa fa-power-off"></i>
[% IF !rota.active %]
Activate
[% ELSE %]
Deactivate
[% END %]
</a>
</td>
</tr>
[% END %]
</tbody>
</table>
[% END %]
[% ELSIF (op == 'create_edit_rota') %]
[% IF rota.rota_id %]
<h2>Edit "[% rota.title | html %]"</h2>
[% ELSE %]
<h2>Create new rota</h2>
[% END %]
[% IF error == 'invalid_form' %]
<div class="dialog alert">
<h3>There was a problem with your form submission</h3>
</div>
[% END %]
<form id="rota_form" method="post" enctype="multipart/form-data" class="validated">
<fieldset class="rows">
<ol>
<li>
<label class="required" for="title">Name:</label>
<input type="text" id="title" name="title" value="[% rota.title | html %]" required="required" placeholder="Rota name">
<span class="required">Required</span>
</li>
<li>
<label for="cyclical">Cyclical:</label>
<select name="cyclical" id="cyclical">
[% IF rota.cyclical %]
<option value="1" selected="selected">Yes</option>
<option value="0">No</option>
[% ELSE %]
<option value="1">Yes</option>
<option value="0" selected="selected">No</option>
[% END %]
</select>
</li>
<li>
<label for="description">Description:</label>
<textarea id="description" name="description" placeholder="Rota description">[% rota.description | html %]</textarea>
</li>
</ol>
</fieldset>
<fieldset class="action">
<input type="submit" value="Save">
<a href="/cgi-bin/koha/tools/stockrotation.pl" class="cancel">Cancel</a>
</fieldset>
[% IF rota.rota_id %]
<input type="hidden" name="id" value="[% rota.rota_id | html %]">
[% END %]
<input type="hidden" name="op" value="process_rota">
</form>
[% ELSIF (op == 'manage_stages') %]
[% INCLUDE 'stockrotation-toolbar.inc' %]
[% IF error == 'invalid_form' %]
<div class="dialog alert">
<h3>There was a problem with your form submission</h3>
</div>
[% END %]
<h2>Manage <em>[% rota.title | html %]</em> stages</h2>
<div id="ajax_status"
data-saving-msg="Saving changes..."
data-success-msg=""
data-failed-msg="Error: ">
<span id="ajax_saving_msg"></span>
<i id="ajax_saving_icon" class="fa fa-spinner fa-spin"></i>
<i id="ajax_success_icon" class="fa fa-check"></i>
<i id="ajax_failed_icon" class="fa fa-times"></i>
<span id="ajax_success_msg"></span>
<span id="ajax_failed_msg"></span>
</div>
<!-- Add stage modal -->
<div class="modal" id="addStageModal" tabindex="-1" role="dialog" aria-labelledby="addStageLabel">
<form id="stage_form" method="post" enctype="multipart/form-data" class="validated">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="addStageLabel">Add stage to <em>[% rota.title | html %]</em></h4>
</div>
<div class="modal-body">
<fieldset class="rows">
<ol>
<li>
<label class="required" for="branch">Library:</label>
<select name="branchcode" id="branch">
[% FOREACH branch IN branches %]
[% IF branch.branchcode == stage.branchcode_id %]
<option value="[% branch.branchcode | html %]" selected="selected">[% Branches.GetName(branch.branchcode) | html %]</option>
[% ELSE %]
<option value="[% branch.branchcode | html %]">[% Branches.GetName(branch.branchcode) | html %]</option>
[% END %]
[% END %]
</select>
<span class="required">Required</span>
</li>
<li>
<label class="required" for="duration">Duration:</label>
<input type="text" id="duration" name="duration" value="[% stage.duration | html %]" required="required" placeholder="Duration (days)">
<span class="required">Required</span>
</li>
</ol>
</fieldset> <!-- /.rows -->
</div> <!-- /.modal-body -->
<div class="modal-footer">
<input type="hidden" name="stage_id" value="[% stage.id | html %]">
<input type="hidden" name="rota_id" value="[% rota_id | html %]">
<input type="hidden" name="op" value="process_stage">
<button type="submit" class="btn btn-default">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div> <!-- /.modal-footer -->
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</form> <!-- /#stage_form -->
</div> <!-- /#addStageModal -->
[% IF existing_stages.size > 0 %]
<div id="manage_stages">
<div id="manage_stages_help">
Stages can be re-ordered by using the <i class="drag_handle fa fa-lg fa-bars"></i>handle to drag and drop them to their new position
</div>
<div id="stage_list_headings">
<span class="stagename">Library</span>
<span class="stageduration">Duration (days)</span>
</div>
<ul id="sortable_stages" data-rota-id="[% rota.rota_id | html %]">
[% FOREACH stage IN existing_stages %]
<li id="stage_[% stage.stage_id | html %]">
<span data-toggle="tooltip" title="Drag and drop to move this stage to another position" data-placement="right" class="stagename">
[% IF existing_stages.size > 1 %]
<i class="drag_handle fa fa-lg fa-bars"></i>
[% END %]
[% Branches.GetName(stage.branchcode_id) | html %]
</span>
<span class="stageduration">[% stage.duration | html %]</span>
<span class="stageactions">
<a class="btn btn-default btn-xs" href="?op=create_edit_stage&amp;stage_id=[% stage.stage_id | uri %]">
<i class="fa fa-pencil"></i> Edit
</a>
<a class="btn btn-default btn-xs" href="?op=confirm_delete_stage&amp;stage_id=[% stage.stage_id | uri %]">
<i class="fa fa-trash"></i> Delete
</a>
</span>
</li>
[% END %]
</ul>
</div>
[% ELSE %]
<div class="dialog message">
<h4>This rota has no stages.</h4>
<p><button type="button" data-toggle="modal" data-target="#addStageModal"><i class="fa fa-plus"></i> Add a stage</button></p>
</div>
[% END %]
<p><a href="stockrotation.pl">Return to rotas</a></p>
[% ELSIF (op == 'create_edit_stage') %]
[% IF stage.id %]
<h2>Edit "[% Branches.GetName(stage.branchcode_id) | html %]"</h2>
[% ELSE %]
<h2>Create new stage</h2>
[% END %]
[% IF error == 'invalid_form' %]
<div class="dialog alert">
<h3>There was a problem with your form submission</h3>
</div>
[% END %]
<form id="stage_form" method="post" enctype="multipart/form-data" class="validated">
<fieldset class="rows">
<ol>
<li>
<label class="required" for="branch">Library:</label>
<select name="branchcode" id="branch">
[% FOREACH branch IN branches %]
[% IF branch.branchcode == stage.branchcode_id %]
<option value="[% branch.branchcode | html %]" selected="selected">[% Branches.GetName(branch.branchcode) | html %]</option>
[% ELSE %]
<option value="[% branch.branchcode | html %]">[% Branches.GetName(branch.branchcode) | html %]</option>
[% END %]
[% END %]
</select>
<span class="required">Required</span>
</li>
<li>
<label class="required" for="duration">Duration:</label>
<input type="text" id="duration" name="duration" value="[% stage.duration | html %]" required="required" placeholder="Duration (days)">
<span class="required">Required</span>
</li>
</ol>
</fieldset>
<fieldset class="action">
<input type="submit" value="Save">
<a href="/cgi-bin/koha/tools/stockrotation.pl?op=manage_stages&amp;rota_id=[% rota_id | uri %]" class="cancel">Cancel</a>
</fieldset>
<input type="hidden" name="stage_id" value="[% stage.id | html %]">
<input type="hidden" name="rota_id" value="[% rota_id | html %]">
<input type="hidden" name="op" value="process_stage">
</form>
[% ELSIF (op == 'confirm_remove_from_rota') %]
<div class="dialog alert">
<h3>Are you sure you wish to remove this item from it's rota</h3>
<p>
<a class="btn btn-default btn-xs approve" href="?op=remove_item_from_stage&amp;item_id=[% item_id | uri %]&amp;stage_id=[% stage_id | uri %]&amp;rota_id=[% rota_id | uri %]"><i class="fa fa-fw fa-check"></i>Yes</a>
<a class="btn btn-default btn-xs deny" href="?op=manage_items&amp;rota_id=[% rota_id | uri %]"><i class="fa fa-fw fa-remove"></i>No</a>
</p>
</div>
[% ELSIF (op == 'confirm_delete_stage') %]
<div class="dialog alert">
<h3>Are you sure you want to delete this stage?</h3>
[% IF stage.stockrotationitems.count > 0 %]
<p>This stage contains the following item(s):</p>
<ul>
[% FOREACH item IN stage.stockrotationitems %]
<li>[% item.itemnumber.biblio.title | html %] (Barcode: [% item.itemnumber.barcode | html %])</li>
[% END %]
</ul>
[% END %]
<p>
<a class="btn btn-default btn-xs approve" href="?op=delete_stage&amp;stage_id=[% stage.stage_id | uri %]"><i class="fa fa-fw fa-check"></i>Yes</a>
<a class="btn btn-default btn-xs deny" href="?op=manage_stages&amp;rota_id=[% stage.rota.rota_id | uri %]"><i class="fa fa-fw fa-remove"></i>No</a>
</p>
</div>
[% ELSIF (op == 'manage_items') %]
[% INCLUDE 'stockrotation-toolbar.inc' %]
[% IF error %]
<div class="dialog alert">
[% IF error == "item_not_found" %]
<h3>The item was not found</h3>
[% ELSIF error == "already_on_rota" %]
<h3>This item is already on this rota</h3>
[% END %]
</div>
[% END %]
<h2>Manage items assigned to <em>[% rota.title | html %]</em></h2>
<!-- Add items modal -->
<div class="modal" id="addItemsModal" tabindex="-1" role="dialog" aria-labelledby="addItemsLabel">
<form id="add_rota_item_form" method="post" enctype="multipart/form-data" class="validated">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title" id="addItemsLabel">Add item to <em>[% rota.title | html %]</em></h4>
</div>
<div class="modal-body">
<fieldset class="rows">
<legend>Add an item by barcode</legend>
<ol>
<li>
<label for="barcode">Barcode:</label>
<input type="text" id="barcode" name="barcode" placeholder="Item barcode" autofocus>
</li>
</ol>
</fieldset>
<fieldset class="rows">
<legend>Use a barcode file</legend>
<ol>
<li>
<label for="barcodefile">Barcode file:</label>
<input type="file" id="barcodefile" name="barcodefile">
</li>
</ol>
</fieldset> <!-- /.rows -->
</div> <!-- /.modal-body -->
<div class="modal-footer">
<input type="hidden" name="rota_id" value="[% rota.id | html %]">
<input type="hidden" name="op" value="add_items_to_rota">
<button type="submit" class="btn btn-default">Save</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div> <!-- /.modal-footer -->
</div> <!-- /.modal-content -->
</div> <!-- /.modal-dialog -->
</form> <!-- /#dd_rota_item_form -->
</div> <!-- /#addItemsModal -->
[% IF items.count > 0 %]
<table id="stock_rotation_manage_items" class="items_table" role="grid">
<thead>
<tr>
<th>Barcode</th>
<th>Title</th>
<th>Author</th>
<th>Call number</th>
<th class="NoSearch">In transit</th>
<th class="NoSort noExport">Stages &amp; duration in days<br>(current stage highlighted)</th>
<th class="NoSort noExport">&nbsp;</th>
</tr>
</thead>
<tbody>
[% FOREACH item IN items %]
<tr>
<td><a href="/cgi-bin/koha/catalogue/moredetail.pl?itemnumber=[% item.id | uri %]&amp;biblionumber=[% item.itemnumber.biblio.id | uri %]#item[% item.id | uri %]">[% item.itemnumber.barcode | html %]</a></td>
<td><a href="/cgi-bin/koha/catalogue/detail.pl?biblionumber=[% item.itemnumber.biblio.id | uri %]">[% item.itemnumber.biblio.title | html %]</a></td>
<td>[% item.itemnumber.biblio.author | html %]</td>
<td>[% item.itemnumber.itemcallnumber | html %]</td>
<td>[% item.itemnumber.get_transfer ? 'Yes' : 'No' | html %]</td>
<td>
[% FOREACH this_stage IN stages %]
[% IF this_stage.stage_id == item.stage.stage_id %]
<span class="stage highlight_stage">
[% ELSE %]
<span class="stage">
[% END %]
[% Branches.GetName(this_stage.branchcode_id) | html %] ([% this_stage.duration | html %])
</span>
&raquo;
[% END %]
[% IF stages.size > 0 %]
<span class="stage">[% rota.cyclical ? 'START' : 'END' | html %]</span>
[% END %]
</td>
<td class="actions">
[% in_transit = item.itemnumber.get_transfer %]
[% IF !in_transit && stages.size > 1 %]
<a class="btn btn-default btn-xs" href="?op=move_to_next_stage&amp;rota_id=[% rota.id | uri %]&amp;item_id=[% item.id | uri %]&amp;stage_id=[% item.stage.stage_id | uri %]">
[% ELSE %]
<a class="btn btn-default btn-xs" disabled>
[% END %]
<i class="fa fa-arrow-right"></i>
Move to next stage
</a>
[% IF !in_transit %]
<a class="btn btn-default btn-xs" href="?op=toggle_in_demand&amp;stage_id=[% item.stage.stage_id | uri %]&amp;item_id=[% item.id | uri %]&amp;rota_id=[% rota.id | uri %]">
[% ELSE %]
<a class="btn btn-default btn-xs" disabled>
[% END %]
<i class="fa fa-fire"></i>
[% IF item.indemand %]
<span>Remove &quot;In demand&quot;</span>
[% ELSE %]
<span>Add &quot;In demand&quot;</span>
[% END %]
</a>
[% IF !in_transit %]
<a class="btn btn-default btn-xs" href="?op=confirm_remove_from_rota&amp;stage_id=[% item.stage.stage_id | uri %]&amp;item_id=[% item.id | uri %]&amp;rota_id=[% rota.id | uri %]">
[% ELSE %]
<a class="btn btn-default btn-xs" disabled>
[% END %]
<i class="fa fa-trash"></i>
Remove from rota
</a>
</td>
</tr>
[% END %]
</tbody>
</table>
[% ELSE %]
<div class="dialog message">
<h4>There are no items assigned to this rota.</h4>
<p><button type="button" data-toggle="modal" data-target="#addItemsModal"><i class="fa fa-plus"></i> Add items</button></p>
</div>
[% END %]
<p><a href="stockrotation.pl">Return to rotas</a></p>
[% ELSIF op == 'add_items_to_rota' %]
<div class="dialog message">
<h3>Add items to rota report</h3>
</div>
<div>
[% IF barcode_status.ok.size > 0 %]
<h4>Items added to rota:</h4>
<ul>
[% FOREACH item_ok IN barcode_status.ok %]
<li>[% item_ok.biblio.title | html %]</li>
[% END %]
</ul>
[% END %]
[% IF barcode_status.on_this.size > 0 %]
<h4>Items already on this rota:</h4>
<ul>
[% FOREACH item_on_this IN barcode_status.on_this %]
<li>[% item_on_this.biblio.title | html %]</li>
[% END %]
</ul>
[% END %]
[% IF barcode_status.not_found.size > 0 %]
<h4>Barcodes not found:</h4>
<ul>
[% FOREACH barcode_not_found IN barcode_status.not_found %]
<li>[% barcode_not_found | html %]</li>
[% END %]
</ul>
[% END %]
[% IF barcode_status.on_other.size > 0 %]
<h4>Items found on other rotas:</h4>
<ul>
[% FOREACH item_on_other IN barcode_status.on_other %]
<li>[% item_on_other.biblio.title | html %]</li>
[% END %]
</ul>
[% END %]
</div>
[% IF barcode_status.on_other.size > 0 %]
<form id="add_rota_item_form" method="post" enctype="multipart/form-data">
<fieldset>
<legend>Select items to move to this rota:</legend>
[% FOREACH item_on_other IN barcode_status.on_other %]
<li><input type="checkbox" name="move_item" value="[% item_on_other.itemnumber | html %]"> [% item_on_other.biblio.title | html %] (Currently on &quot;[% item_on_other.stockrotationitem.stage.rota.title | html %]&quot;)</li>
[% END %]
</fieldset>
<fieldset class="action">
<input type="submit" value="Save">
</fieldset>
<input type="hidden" name="rota_id" value="[% rota_id | html %]">
<input type="hidden" name="op" value="move_items_to_rota">
</form>
[% END %]
<p><a href="?op=manage_items&amp;rota_id=[% rota_id | uri %]">Return to rota</a></p>
[% END %]
</div>
</main>
</div> <!-- /.col-sm-10.col-sm-push-2 -->
<div class="col-sm-2 col-sm-pull-10">
<aside>
[% IF ( op == 'manage_stages' || op == 'manage_items' ) %]
<div id="menu">
<ul>
[% IF op == 'manage_stages' %]
<li class="active">
[% ELSE %]
<li>
[% END %]
<a href="/cgi-bin/koha/tools/stockrotation.pl?op=manage_stages&amp;rota_id=[% rota_id | uri %]">Manage stages</a>
</li>
[% IF op == 'manage_items' %]
<li class="active">
[% ELSE %]
<li>
[% END %]
<a href="/cgi-bin/koha/tools/stockrotation.pl?op=manage_items&amp;rota_id=[% rota_id | uri %]">Manage items</a>
</li>
</ul>
</div>
[% END %]
[% INCLUDE 'tools-menu.inc' %]
</aside>
</div> <!-- /.col-sm-2.col-sm-pull-10 -->
</div> <!-- /.row -->
[% MACRO jsinclude BLOCK %]
[% Asset.js("js/tools-menu.js") | $raw %]
[% INCLUDE 'datatables.inc' %]
[% INCLUDE 'columns_settings.inc' %]
[% Asset.js("js/pages/stockrotation.js") | $raw %]
<script>
var stock_rotation_items_columns_settings = [% ColumnsSettings.GetColumns( 'tools', 'stockrotation', 'stock_rotation_manage_items', 'json' ) | $raw %];
var stock_rotation_columns_settings = [% ColumnsSettings.GetColumns( 'tools', 'stockrotation', 'stock_rotation', 'json' ) | $raw %];
$("#addStageModal, #addItemsModal").on("shown.bs.modal", function(){
$("#branch, #barcode").focus();
});
</script>
[% END %]
[% INCLUDE 'intranet-bottom.inc' %]