Bugzilla – Attachment 92079 Details for
Bug 22209
Move stock rotation stage and item forms into modals
Home
|
New
|
Browse
|
Search
|
[?]
|
Reports
|
Help
|
New Account
|
Log In
[x]
|
Forgot Password
Login:
[x]
[patch]
Bug 22209: Move stock rotation stage and item forms into modals
Bug-22209-Move-stock-rotation-stage-and-item-forms.patch (text/plain), 19.97 KB, created by
Katrin Fischer
on 2019-08-08 14:40:47 UTC
(
hide
)
Description:
Bug 22209: Move stock rotation stage and item forms into modals
Filename:
MIME Type:
Creator:
Katrin Fischer
Created:
2019-08-08 14:40:47 UTC
Size:
19.97 KB
patch
obsolete
>From 5a00303943afa0c01b003302cba4f77f86d87f4b Mon Sep 17 00:00:00 2001 >From: Owen Leonard <oleonard@myacpl.org> >Date: Mon, 8 Jul 2019 18:27:52 +0000 >Subject: [PATCH] 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> >--- > .../prog/en/includes/stockrotation-toolbar.inc | 2 + > .../prog/en/modules/tools/stockrotation.tt | 187 ++++++++++++++------- > 2 files changed, 126 insertions(+), 63 deletions(-) > >diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/stockrotation-toolbar.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/stockrotation-toolbar.inc >index 064c688a3e..a75408f0cf 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/includes/stockrotation-toolbar.inc >+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/stockrotation-toolbar.inc >@@ -5,8 +5,10 @@ > [% END %] > [% IF op == 'manage_stages' %] > <a id="editrota" class="btn btn-default" href="/cgi-bin/koha/tools/stockrotation.pl?op=create_edit_rota&rota_id=[% rota_id | uri %]"><i class="fa fa-pencil"></i> Edit rota</a> >+ <a class="btn btn-default" href="#" id="addstage" data-toggle="modal" data-target="#addStageModal"><i class="fa fa-plus"></i> Add stage</a> > [% END %] > [% IF op == 'manage_items' %] > <a id="editrota" class="btn btn-default" href="/cgi-bin/koha/tools/stockrotation.pl?op=create_edit_rota&rota_id=[% rota_id | uri %]"><i class="fa fa-pencil"></i> Edit rota</a> >+ <a class="btn btn-default" href="#" id="additems" data-toggle="modal" data-target="#addItemsModal"><i class="fa fa-plus"></i> Add items</a> > [% END %] > </div> >diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/stockrotation.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/stockrotation.tt >index 6be2492f85..9c092235ed 100644 >--- a/koha-tmpl/intranet-tmpl/prog/en/modules/tools/stockrotation.tt >+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/tools/stockrotation.tt >@@ -133,11 +133,11 @@ > <label for="cyclical">Cyclical:</label> > <select name="cyclical" id="cyclical"> > [% IF rota.cyclical %] >- <option value="1" selected>Yes</option> >+ <option value="1" selected="selected">Yes</option> > <option value="0">No</option> > [% ELSE %] > <option value="1">Yes</option> >- <option value="0" selected>No</option> >+ <option value="0" selected="selected">No</option> > [% END %] > </select> > </li> >@@ -167,7 +167,7 @@ > </div> > [% END %] > >- <h2>Manage [% rota.title | html %] stages</h2> >+ <h2>Manage <em>[% rota.title | html %]</em> stages</h2> > <div id="ajax_status" > data-saving-msg="Saving changes..." > data-success-msg="" >@@ -180,37 +180,50 @@ > <span id="ajax_failed_msg"></span> > </div> > >- <form id="stage_form" method="post" enctype="multipart/form-data" class="validated"> >- <fieldset class="rows"> >- <legend>Add stage</legend> >- <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>[% 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="Submit"> >- </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> >+ <!-- 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">×</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"> >@@ -243,6 +256,13 @@ > [% 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> >@@ -269,7 +289,7 @@ > <select name="branchcode" id="branch"> > [% FOREACH branch IN branches %] > [% IF branch.branchcode == stage.branchcode_id %] >- <option value="[% branch.branchcode | html %]" selected>[% Branches.GetName(branch.branchcode) | html %]</option> >+ <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 %] >@@ -332,38 +352,49 @@ > </div> > [% END %] > >- <h2>Manage [% rota.title | html %] items</h2> >+ <h2>Manage items assigned to <em>[% rota.title | html %]</em></h2> > >- <div> >+ <!-- 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"> >- <fieldset class="rows"> >- <legend>Add item to "[% rota.title | html %]"</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> >- <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="add_items_to_rota"> >- </form> >- </div> >+ <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">×</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 %] >- <h3>Manage items assigned to "[% rota.title | html %]"</h3> > <table id="stock_rotation_manage_items" class="items_table" role="grid"> > <thead> > <tr> >@@ -434,6 +465,13 @@ > [% 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> >@@ -504,6 +542,26 @@ > > <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&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&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 --> >@@ -517,6 +575,9 @@ > <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 %] > >-- >2.11.0
You cannot view the attachment while viewing its details because your browser does not support IFRAMEs.
View the attachment on a separate page
.
View Attachment As Diff
View Attachment As Raw
Actions:
View
|
Diff
|
Splinter Review
Attachments on
bug 22209
:
91418
|
91508
| 92079