Bug 31986: Add page-section to various administration pages
[srvgit] / koha-tmpl / intranet-tmpl / prog / en / modules / admin / aqbudgets.tt
index 9f96af5..195c2a6 100644 (file)
+[% USE raw %]
+[% USE Asset %]
+[% USE AuthorisedValues %]
+[% USE Branches %]
+[% USE Price %]
+[% SET footerjs = 1 %]
 [% INCLUDE 'doc-head-open.inc' %]
-<title>Koha &rsaquo; Administration &rsaquo; Funds[% IF op == 'add_form' %] &rsaquo; [% IF ( budget_id ) %]Modify fund[% IF ( budget_name ) %] '[% budget_name %]'[% END %][% ELSE %]Add fund [% END %][% END %]</title>
-[% INCLUDE 'doc-head-close.inc' %]
-<script type="text/javascript">
-//<![CDATA[
-var MSG_BUDGET_PARENT_ALLOCATION = "- " + _("Fund amount exceeds parent allocation") + "\n";
-var MSG_BUDGET_PERIOD_ALLOCATION = "- " + _("Fund amount exceeds period allocation") + "\n";
-var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget") + "\n";
-//]]>
-</script>
-
-<script type="text/javascript" src="[% themelang %]/js/acq.js"></script>
-[% IF op == 'add_form' %]
-<script type="text/javascript">
-//<![CDATA[
-
-    function userPopup() {
-        window.open("/cgi-bin/koha/admin/aqbudget_user_search.pl?type=user",
-            'PatronPopup',
-            'width=740,height=450,location=yes,toolbar=no,'
-            + 'scrollbars=yes,resize=yes'
-        );
-    }
-
-    function ownerPopup() {
-        window.open("/cgi-bin/koha/admin/aqbudget_user_search.pl?type=owner",
-            'PatronPopup',
-            'width=740,height=450,location=yes,toolbar=no,'
-            + 'scrollbars=yes,resize=yes'
-        );
-    }
-
-    function edit_owner(borrowernumber, surname, firstname) {
-        $('#budget_owner_name').empty();
-        $('#budget_owner_id').val('');
-        if (borrowernumber) {
-            var ownerlink = '<a href="/cgi-bin/koha/members/moremember.pl'
-                + '?borrowernumber=' + borrowernumber + '">'
-                + firstname + ' ' + surname + '</a>';
-            $('#budget_owner_name').html(ownerlink);
-            $('#budget_owner_id').val(borrowernumber);
-        }
-    }
-
-    function ownerRemove() {
-        edit_owner(0);
-    }
-
-    function add_user(borrowernumber, surname, firstname) {
-        var ids = $("#budget_users_id").val().split(':');
-        if(borrowernumber && ids.indexOf(borrowernumber) == -1) {
-            var li = '<li id="user_' + borrowernumber + '">'
-                + '<a href="/cgi-bin/koha/members/moremember.pl?borrowernumber='
-                + borrowernumber + '">' + firstname + ' ' + surname
-                + '</a> [<a style="cursor:pointer"'
-                + 'onclick="del_user(' + borrowernumber +')">Remove</a>]</li>';
-            $(li).insertBefore("li#add_user_button");
-            ids.push(borrowernumber);
-            $("#budget_users_id").val(ids.join(':'));
-        } else {
-            return -1;
-        }
-        return 0;
-    }
-
-    function del_user(borrowernumber) {
-        var ids = $("#budget_users_id").val().split(':');
-        if (borrowernumber) {
-            var idx = ids.indexOf(borrowernumber+'');
-            if (idx != -1) {
-                ids.splice(idx, 1);
-                $("#budget_users_id").val(ids.join(':'));
-                $("li#user_" + borrowernumber).remove();
-            }
-        }
-    }
-
-    function Check(f) {
-        var ok=1;
-        var _alertString="";
-        var alertString2;
-
-        if (!(isNotNull(f.budget_code,1))) {
-            _alertString += _("- Budget code cannot be blank") + "\n";
-        }
-
-        if (!(isNotNull(f.budget_name,1))) {
-            _alertString += _("- Budget name cannot be blank") + "\n";
-        }
-
-        if (!(isNotNull(f.budget_amount,1))) {
-            _alertString += _("- Budget amount cannot be blank") + "\n";
-        }
-
-        var budgetId;
-        if   (typeof(f.budget_id ) != "undefined")  {
-            budgetId = f.budget_id.value
-        }
-
-        var newBudgetParent;
-
-//  hack to test if selected parent_id in scrolling-list...
-//  if value == 'undef' its got a selected_parent :/
-        if(f.budget_parent_id){
-            var chkAdd   =  f.budget_parent_id.value ;
-            if  (     typeof(chkAdd ) != "undefined") {
-                newBudgetParent  =  f.budget_parent_id.value
-            } else {
-                newBudgetParent  =  f.budget_parent_id.item(0).value
-            }
-
-            if   (budgetId  > 0)  {  ; //its a mod ...
-                // if parent == curent-budget, fail...
-                if ( newBudgetParent  ==  budgetId     ) {
-                        _alertString += _("- Budget parent is current budget") + "\n";
-                }
 
-                else if (newBudgetParent) {
-                    var result = checkBudgetParent(  budgetId , newBudgetParent   );
-                    if (result) {
-                        _alertString += result;
-                    }
-                }
-            }
-        }
-
-         // else do lookup
-        var budgetTotal = Math.abs(f.budget_amount.value);
-        var result =   budgetExceedsParent  (budgetTotal, budgetId, newBudgetParent, f.budget_period_id.value)
-        if (result) {
-            _alertString += result;
-        }
-
-        if (_alertString.length==0) {
-            document.Aform.submit();
-        } else {
-            alertString2 = _("Form not submitted because of the following problem(s)");
-            alertString2 += "\n------------------------------------------------------------------------------------\n\n";
-            alertString2 += _alertString;
-            alert(alertString2);
-        }
-    }
-//]]>
-</script>
-[% ELSIF op == 'list' %]
-    <link rel="stylesheet" type="text/css" href="[% themelang %]/css/datatables.css" />
-    [% INCLUDE 'datatables.inc' %]
-    <link href="[% interface %]/lib/jquery/plugins/treetable/stylesheets/jquery.treetable.css" rel="stylesheet" type="text/css" />
-    <script type="text/javascript" src="[% interface %]/lib/jquery/plugins/treetable/jquery.treetable.js"></script>
-
-<script type="text/javascript">
-//<![CDATA[
-    //
-    $(document).ready(function() {
-        var oTable = $("#budgeth").dataTable($.extend(true, {}, dataTablesDefaults, {
-            "fnDrawCallback": function ( oSettings ) {
-                if ( oSettings.aiDisplay.length == 0 )
-                {
-                    return;
-                }
+<title>[% IF op == 'add_form' %][% IF ( budget_id ) %]Modify fund[% IF ( budget_name ) %] '[% budget_name | html %]'[% END %][% ELSE %]Add fund[% END %] &rsaquo;[% END %] Funds &rsaquo; Administration &rsaquo; Koha</title>
+[% Asset.css("lib/jquery/plugins/treetable/stylesheets/jquery.treetable.css") | $raw %]
+[% INCLUDE 'doc-head-close.inc' %]
+</head>
 
-                var nTrs = $('#budgeth tbody tr');
-                var iColspan = nTrs[1].getElementsByTagName('td').length;
-                var sLastGroup = "";
-                for ( var i=0 ; i<nTrs.length ; i++ )
-                {
-                    var iDisplayIndex = oSettings._iDisplayStart + i;
-                    var sGroup = oSettings.aoData[ oSettings.aiDisplay[iDisplayIndex] ]._aData[1];
-                    if ( sGroup != sLastGroup )
-                    {
-                        var nGroup = document.createElement( 'tr' );
-                        var nCell = document.createElement( 'td' );
-                        nCell.colSpan = iColspan;
-                        nCell.className = "group";
-                        nCell.innerHTML = sGroup;
-                        nGroup.appendChild( nCell );
-                        nTrs[i].parentNode.insertBefore( nGroup, nTrs[i] );
-                        sLastGroup = sGroup;
-                    }
-                }
-            },
-            "aoColumnDefs": [
-                { "bVisible": false, "aTargets": [ 0, 1 ] }
-            ],
-            "aaSortingFixed": [[ 1, 'asc' ]],
-            "aaSorting": [[ 2, 'asc' ]],
-            'bSort': false,
-            'bPaginate': false,
-            "bAutoWidth": false
-        }));
-
-        $(oTable).treetable({
-            expandable: true
-        });
-        $(oTable).treetable('expandAll');
-        $("#expand_all").click(function(e){
-            e.preventDefault();
-            $(oTable).treetable('expandAll');
-        });
-        $("#collapse_all").click(function(e){
-            e.preventDefault();
-            $(oTable).treetable('collapseAll');
-        });
-
-        $("#hide_inactive").click(function(e){
-            e.preventDefault();
-            oTable.fnFilter( 0, 0 ); // Hide active=0
-        });
-        $("#show_inactive").click(function(e){
-            e.preventDefault();
-            oTable.fnFilter( '', 0 );
-        });
-
-        $("#filterbutton").click(function() {
-            $("#fundfilters").slideToggle(0);
-        });
-        $("#hide_inactive").click();
-    });
-//]]>
-</script>
+<body id="admin_aqbudgets" class="admin">
+[% WRAPPER 'header.inc' %]
+    [% INCLUDE 'budgets-admin-search.inc' %]
 [% END %]
 
-</head>
-<body id="admin_aqbudgets" class="admin">
-[% INCLUDE 'header.inc' %]
-[% INCLUDE 'budgets-admin-search.inc' %]
+[% WRAPPER 'sub-header.inc' %]
+<nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
+    <ol>
+    <li>
+        <a href="/cgi-bin/koha/mainpage.pl">Home</a>
+    </li>
+    <li>
+        <a href="/cgi-bin/koha/admin/admin-home.pl">Administration</a>
+    </li>
+    <li>
+        <a href="/cgi-bin/koha/admin/aqbudgetperiods.pl">Budgets</a>
+    </li>
+
+    [% IF op == 'list' %]
+        [% IF budget_period_id %]
+            <li>
+                <a href="#" aria-current="page">
+                    Funds for '[% budget_period_description | html %]'
+                </a>
+            </li>
+        [% ELSE %]
+            <li>
+                <a href="#" aria-current="page">
+                    All funds
+                </a>
+            </li>
+        [% END %]
+    [% END %]
 
-<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo;
-    <a href="/cgi-bin/koha/admin/admin-home.pl">Administration</a> &rsaquo; <a href="/cgi-bin/koha/admin/aqbudgetperiods.pl">Budgets</a> &rsaquo; [% IF op == 'list' %][% IF budget_period_id %]Funds for '[% budget_period_description %]'[% ELSE %]All funds[% END %][% END %]
     [% IF op == 'add_form' %]
-      <a href="/cgi-bin/koha/admin/aqbudgets.pl?budget_period_id=[% budget_period_id %]">Funds</a> &rsaquo; [% IF ( budget_id ) %]Modify fund[% IF ( budget_name ) %] '[% budget_name %]'[% END %][% ELSE %]Add fund[% END %]
+        <li>
+            <a href="/cgi-bin/koha/admin/aqbudgets.pl?budget_period_id=[% budget_period_id | uri %]">Funds</a>
+        </li>
+        [% IF ( budget_id ) %]
+            <li>
+                <a href="#" aria-current="page">
+                Modify fund
+                    [% IF ( budget_name ) %] '[% budget_name | html %]'[% END %]
+                </a>
+            </li>
+        [% ELSE %]
+            <li>
+                <a href="#" aria-current="page">
+                    Add fund
+                </a>
+            </li>
+        [% END %]
     [% END %]
+
     [% IF op == 'delete_confirm' %]
-      <a href="/cgi-bin/koha/admin/aqbudgets.pl">Funds</a> &rsaquo; Delete fund?
+        <li>
+            <a href="/cgi-bin/koha/admin/aqbudgets.pl">Funds</a>
+        </li>
+        <li>
+            <a href="#" aria-current="page">
+                Delete fund?
+            </a>
+        </li>
     [% END %]
-</div>
-
-<div id="doc3" class="yui-t2">
-<div id="bd">
-<div id="yui-main">
-<div class="yui-b" id="content">
+    </ol>
+</nav>
+[% END %]
 
+<div class="main container-fluid">
+    <div class="row">
+        <div class="col-sm-10 col-sm-push-2">
+            <main>
 
 [% UNLESS op == 'delete_confirm' %][% INCLUDE 'budgets-admin-toolbar.inc' %][% END %]
 
 [% IF (error_not_authorised_to_modify) %]
-    <div class="error">
+    <div class="dialog alert">
         <p>You are not authorized to modify this fund</p>
     </div>
 [% END %]
@@ -253,7 +96,7 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
 
 <h1>
   [% IF budget_period_id %]
-    Funds for '[% budget_period_description %]'
+    Funds for '[% budget_period_description | html %]'
   [% ELSE %]
     All funds
   [% END %]
@@ -263,13 +106,18 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
 
 [% IF budgets %]
 
-<table id="budgeth">
-    <caption>
-        <span class="actions"><a href="#" id="expand_all">Expand all</a>
-        | <a href="#" id="collapse_all">Collapse all</a>
-        | <a href="#" id="hide_inactive">Hide inactive budgets</a>
-        | <a href="#" id="show_inactive">Show inactive budgets</a></span>
-    </caption>
+    [% UNLESS budget_period_id %]
+        <div class="toolbar btn-toolbar">
+            <span class="actions">
+                <a href="#" id="expand_all">Expand all</a> |
+                <a href="#" id="collapse_all">Collapse all</a> |
+                <a href="#" id="hide_inactive">Hide inactive budgets</a> |
+                <a href="#" id="show_inactive">Show inactive budgets</a>
+            </span>
+        </div>
+    [% END %]
+<div class="page-section">
+<table id="budgeth" class="group">
     <thead>
         <tr>
             <th>Active</th>
@@ -283,111 +131,113 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
             <th>Total spent</th>
             <th>Base-level available</th>
             <th>Total available</th>
-            <th>Actions</th>
+            <th class="noExport">Actions</th>
         </tr>
     </thead>
     <tfoot>
     <tr>
     <th></th>
     <th></th>
-    <th colspan="2" style="text-align: left;" nowrap="nowrap">Period allocated [% IF ( budget_period_total ) %][% budget_period_total %][% END %]  </th>
-    <th nowrap="nowrap" class="data"> [% period_alloc_total %]</th>
+    <th colspan="2" style="text-align: left;" nowrap="nowrap">Period allocated [% IF budget_period_total %][% budget_period_total | $Price %][% END %]  </th>
+    <th nowrap="nowrap" class="data"> [% period_alloc_total | $Price %]</th>
     <th></th>
-    <th class="data">[% ordered_total %]</th>
+    <th class="data">[% ordered_total | $Price %]</th>
     <th></th>
-    <th class="data">[% spent_total %]</th>
+    <th class="data">[% spent_total | $Price %]</th>
     <th></th>
-    <th class="data">[% available_total %]</th>
+    <th class="data">[% available_total | $Price %]</th>
     <th></th>
     </tr>
     </tfoot>
     <tbody>
     [% FOREACH budget IN budgets %]
-    <tr data-tt-id="[% budget.budget_id %]" [% IF ( budget.budget_parent_id ) %]data-tt-parent-id="[% budget.budget_parent_id %]"[% END %]>
-    <td>[% budget.budget_period_active %]</td>
-    <td>Budget [% budget.budget_period_description %]</td>
-    <td>[% budget.budget_code_indent %]</td>
-    <td>[% budget.budget_name %]</td>
+    [% IF budget.budget_parent_id %]
+      <tr data-tt-id="[% budget.budget_id | html %]" data-tt-parent-id="[% budget.budget_parent_id | html %]">
+    [% ELSE %]
+      <tr data-tt-id="[% budget.budget_id | html %]">
+    [% END %]
+    <td>[% budget.budget_period_active | html %]</td>
+    <td>Budget [% budget.budget_period_description | html %] [id=[% budget.budget_period_id | html %]][% UNLESS budget.budget_period_active %] (inactive)[% END %]</td>
+    <td>[% budget.budget_code | html %]</td>
+    <td>[% budget.budget_name | html %]</td>
     <td class="data">
-      [% IF budget.budget_parent_id %]
-        <span class="child_fund_amount">[% budget.budget_amount %]</span>
-      [% ELSE %]
-        [% budget.budget_amount %]
-      [% END %]
+        <span class="total_amount" data-parent_id="[% budget.budget_parent_id | html %]" data-self_id="[% budget.budget_id | html %]">[% budget.budget_amount | $Price %]</span>
     </td>
     <td class="data">
       [% IF budget.budget_parent_id %]
-        <span class="child_fund_amount">[% budget.budget_ordered %]</span>
+        <span class="child_fund_amount">[% budget.budget_ordered | $Price %]</span>
       [% ELSE %]
-        [% budget.budget_ordered %]
+        <span class="total_amount">[% budget.budget_ordered | $Price %]</span>
       [% END %]
     </td>
     <td class="data">
       [% IF budget.budget_parent_id %]
-        <span class="child_fund_amount">[% budget.total_ordered %]</span>
+        <span class="child_fund_amount">[% budget.total_ordered | $Price %]</span>
       [% ELSE %]
-        [% budget.total_ordered %]
+        <span class="total_amount">[% budget.total_ordered | $Price %]</span>
       [% END %]
     </td>
     <td class="data">
       [% IF budget.budget_parent_id %]
-        <span class="child_fund_amount">[% budget.budget_spent %]</span>
+        <span class="child_fund_amount">[% budget.budget_spent | $Price %]</span>
       [% ELSE %]
-        [% budget.budget_spent %]
+        <span class="total_amount">[% budget.budget_spent | $Price %]</span>
       [% END %]
     </td>
     <td class="data">
       [% IF budget.budget_parent_id %]
-        <span class="child_fund_amount">[% budget.total_spent %]</span>
+        <span class="child_fund_amount">[% budget.total_spent | $Price %]</span>
       [% ELSE %]
-        [% budget.total_spent %]
+        <span class="total_amount">[% budget.total_spent | $Price %]</span>
       [% END %]
     </td>
 
 
     [% BLOCK colorcellvalue %]
-        [% IF parent %]
-            [% IF (value > 0) %]
-                <span class="child_fund_amount" style="color: green;">
-            [% ELSIF (value < 0) %]
-                <span class="child_fund_amount" style="color: red;">
-            [% ELSE %]
-                <span class="child_fund_amount">
-            [% END %]
-         [% ELSE %]
-            [% IF (value > 0) %]
-                <span style="color: green;">
-            [% ELSIF (value < 0) %]
-                <span style="color: red;">
-            [% ELSE %]
-                <span>
-            [% END %]
+        [% IF (value > 0) %]
+            <span class="total_amount" data-parent_id="[% budget.budget_parent_id | html %]" data-self_id="[% budget.budget_id | html %]" style="color: green;">
+        [% ELSIF (value < 0) %]
+            <span class="total_amount" data-parent_id="[% budget.budget_parent_id | html %]" data-self_id="[% budget.budget_id | html %]" style="color: red;">
+        [% ELSE %]
+            <span class="totalamount">
         [% END %]
-            [% text %]
+        [% value | $Price %]
         </span>
     [% END %]
     <td class="data">
-        [% INCLUDE colorcellvalue value=budget.budget_remaining text=budget.budget_remaining_display parent=budget.budget_parent_id %]
+        [% INCLUDE colorcellvalue value=budget.budget_remaining parent=budget.budget_parent_id %]
     </td>
     <td class="data">
-        [% INCLUDE colorcellvalue value=budget.total_remaining text=budget.total_remaining_display parent=budget.budget_parent_id %]
+        [% INCLUDE colorcellvalue value=budget.total_remaining parent=budget.budget_parent_id %]
     </td>
     [% IF ( budget.budget_lock ) %]
-        <td> <span style="color: gray;"> Edit Delete </span> </td>
+        <td> <span></span> </td>
     [% ELSE %]
         <td>
-            <a href="/cgi-bin/koha/admin/aqbudgets.pl?op=add_form&amp;budget_id=[% budget.budget_id %]&amp;budget_period_id=[% budget.budget_period_id %]" >Edit</a>
-            <a href="/cgi-bin/koha/admin/aqbudgets.pl?op=delete_confirm&amp;budget_id=[% budget.budget_id %]&amp;budget_period_id=[% budget.budget_period_id %]">Delete</a>
-            <a href="/cgi-bin/koha/admin/aqbudgets.pl?op=add_form&amp;budget_parent_id=[% budget.budget_id %]&amp;budget_period_id=[% budget.budget_period_id %]">Add child fund</a>
+            <div class="btn-group dropup">
+                <a class="btn btn-default btn-xs dropdown-toggle" id="budgetactions[% budget.budget_id | html %]_[% budget.budget_period_id | html %]" role="button" data-toggle="dropdown" href="#">
+                   Actions <b class="caret"></b>
+                </a>
+                <ul class="dropdown-menu pull-right" role="menu" aria-labelledby="budgetactions[% budget.budget_id | html %]_[% budget.budget_period_id | html %]">
+                    <li><a href="/cgi-bin/koha/admin/aqbudgets.pl?op=add_form&amp;budget_id=[% budget.budget_id | uri %]&amp;budget_period_id=[% budget.budget_period_id | uri %]"><i class="fa fa-pencil"></i> Edit</a></li>
+                    [% IF budget.budget_has_children %]
+                        <li class="disabled"><a href="#" class="deletefund-disabled" data-toggle="tooltip" data-placement="left" title="This fund has sub funds."><i class="fa fa-trash"></i> Delete</a></li>
+                    [% ELSE %]
+                        <li><a href="/cgi-bin/koha/admin/aqbudgets.pl?op=delete_confirm&amp;budget_id=[% budget.budget_id | uri %]&amp;budget_period_id=[% budget.budget_period_id | uri %]"><i class="fa fa-trash"></i> Delete</a></li>
+                    [% END %]
+                    <li><a href="/cgi-bin/koha/admin/aqbudgets.pl?op=add_form&amp;budget_parent_id=[% budget.budget_id | uri %]&amp;budget_period_id=[% budget.budget_period_id | uri %]"><i class="fa fa-plus"></i> Add sub fund</a></li>
+                </ul>
+            </div>
         </td>
     [% END %]
     </tr>
     [% END %]
     </tbody>
 </table>
+</div> <!-- /.page-section -->
 
 [% ELSE %]
-    No fund found
+    <p>No fund found</p>
 [% END %]
 
 [% END %] <!-- list -->
@@ -395,12 +245,13 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
 <!-- ********************************************************************************************** -->
 <!-- create add/mod entry form -->
 [% IF op == 'add_form' && !error_not_authorised_to_modify %]
-<form action="/cgi-bin/koha/admin/aqbudgets.pl" name="Aform" method="post">
+<form action="/cgi-bin/koha/admin/aqbudgets.pl" id="edit_fund" name="Aform" method="post">
     <fieldset class="rows">
-    <legend>[% IF ( budget_id ) %]Modify[% ELSE %]Add[% END %] Fund
+        <legend><h1>[% IF ( budget_id ) %]<span>Modify fund</span>[% ELSE %]<span>Add fund</span>[% END %]
     [% IF ( budget_period_description ) %]
-        [% budget_name %] for Budget '[% budget_period_description %]'
+        [% budget_name | html %] <span>for budget</span> '[% budget_period_description | html %]'
     [% END %]
+            </h1>
     </legend>
 
     <input type="hidden" name="op" value="add_validate" />
@@ -409,79 +260,86 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
     [% IF ( budget_parent_id ) %]
     <li>
         <span class="label">Fund parent: </span>
-        [% budget_parent_name %]
-        [% budget_parent_id %] - [% budget_parent_name %]
-        <input type="hidden" name="budget_parent_id" value="[% budget_parent_id %]" />
+        [% budget_parent_name | html %]
+        [% budget_parent_id | html %] - [% budget_parent_name | html %]
+        <input type="hidden" name="budget_parent_id" value="[% budget_parent_id | html %]" />
     </li>
     [% END %]
     <li>
     <label class="required"  for="budget_code">Fund code: </label>
-    <input type="text" name="budget_code" id="budget_code" value="[% budget_code %]" size="30" />
+    <input type="text" name="budget_code" id="budget_code" value="[% budget_code | html %]" size="30" />
     </li>
 
     <li>
     <label class="required" for="budget_name">Fund name: </label>
-    <input type="text" name="budget_name" id="budget_name" value="[% budget_name %]" size="60" />
+    <input type="text" name="budget_name" id="budget_name" value="[% budget_name | html %]" size="60" />
     </li>
 
     <li>
-    <label style="white-space: nowrap;" for="budget_amount" class="required">Amount: </label>
-    <input type="text" name="budget_amount" id="budget_amount" value="[% budget_amount %]" size="8" />
+    <label for="budget_amount" class="required">Amount: </label>
+    <input type="text" name="budget_amount" id="budget_amount" value="[% budget_amount | $Price on_editing => 1 %]" size="8" />
     </li>
 
     <li>
       <label for="budget_encumb">Warning at (%): </label>
-      <input type="text" name="budget_encumb" id="budget_encumb" value="[% budget_encumb %]" size="10" />
-      <span style="color:grey">0 to disable</span>
+      <input type="text" name="budget_encumb" id="budget_encumb" value="[% budget_encumb | html %]" size="10" />
+      <span class="hint">0 to disable</span>
     </li>
 
     <li>
       <label for="budget_expend">Warning at (amount): </label>
-      <input type="text" name="budget_expend" id="budget_expend" value="[% budget_expend %]" size="10" /><input type="hidden" name="budget_owner_id" id="budget_owner_id" value="[% budget_owner_id %]" />
-      <span style="color:grey">0 to disable</span>
+      <input type="text" name="budget_expend" id="budget_expend" value="[% budget_expend | $Price on_editing => 1 %]" size="10" />
+      <span class="hint">0 to disable</span>
     </li>
 
     <li>
         <span class="label">Owner: </span>
-        <span  id="budget_owner_name">
-        <a href="/cgi-bin/koha/members/moremember.pl?borrowernumber=[% budget_owner_id %]">
-            [% budget_owner_name %]
-        </a>
-        </span>
+        [% IF  budget_owner %]
+            <span  id="budget_owner_name">
+                <a href="/cgi-bin/koha/members/moremember.pl?borrowernumber=[% budget_owner.borrowernumber | uri %]">
+                    [% budget_owner.firstname | html %] [% budget_owner.surname | html %]
+                </a> |
+            </span>
+        [% ELSE %]
+            <span  id="budget_owner_name"></span>
+        [% END %]
+        <a id="edit_owner" class="new_window" href="#"><i class="fa fa-search"></i> Select owner</a>
+        <a id="remove_owner" href="#"><i class="fa fa-trash"></i> Remove owner</a>
         <input type="hidden" name="budget_owner_id" id="budget_owner_id"
-            value="[% budget_owner_id %]" />
-
-        <!-- FIXME: hardcoded button positions :/ -->
-        <input type="button" id="edit_owner" value="Edit owner"
-            onclick="ownerPopup(); return false;" />
-        <input type="button" id="remove_owner" value="Remove owner"
-            onclick="ownerRemove(); return false;" />
+            value="[% budget_owner.borrowernumber | html %]" />
     </li>
 
+
+    [% IF budget_has_children %]
+        <li class="radio">
+            <label>
+                <input type="checkbox" id="set_owner_to_children" name="set_owner_to_children" value="1" />
+                Update all sub funds with this owner
+            </label>
+            <span class="hint">Selecting this option will overwrite existing fund owners, if any</span>
+        </li>
+    [% END %]
+
     <li>
         <span class="label">Users:</span>
         <ul style="float:left;" id="budget_users">
             [% FOREACH user IN budget_users %]
-                <li id="user_[% user.borrowernumber %]">
-                    <a href="/cgi-bin/koha/members/moremember.pl?borrowernumber=[% user.borrowernumber %]">
-                        [% user.firstname %] [% user.surname %]
+                <li id="user_[% user.borrowernumber | html %]">
+                    <a href="/cgi-bin/koha/members/moremember.pl?borrowernumber=[% user.borrowernumber | uri %]">
+                        [% user.firstname | html %] [% user.surname | html %]
                     </a>
-                    [<a style="cursor:pointer"
-                    onclick="del_user([% user.borrowernumber %])">Remove</a>]
+                    &bull; <a href="#" class="del_user" data-borrowernumber="[% user.borrowernumber | html %]"><i class="fa fa-trash"></i> Remove</a>
                 </li>
             [% END %]
-            <li id="add_user_button">
-                <input type="button" onclick="userPopup()" value="Add users" />
-            </li>
+            <li><a href="#" id="add_user_button"><i class="fa fa-plus"></i> Add users</a></li>
         </ul>
-        <input type="hidden" name="budget_users_ids" id="budget_users_id" value="[% budget_users_ids %]" />
+        <input type="hidden" name="budget_users_ids" id="budget_users_id" value="[% budget_users_ids | html %]" />
+    </li>
     <li>
     <label for="budget_branchcode">Library: </label>
     <select name="budget_branchcode" id="budget_branchcode">
-    <option value=""></option>
-    [% FOREACH branchloop_selec IN branchloop_select %]
-        [% UNLESS ( branchloop_selec.selected ) %] <option value="[% branchloop_selec.value %]" > [% ELSE %] <option value="[% branchloop_selec.value %]" selected="selected"> [% END %] [% branchloop_selec.value %]-[% branchloop_selec.branchname %]</option>
-    [% END %]
+        <option value=""></option>
+        [% PROCESS options_for_libraries libraries => Branches.all( selected => budget_branchcode, unfiltered => 1 ) %]
     </select>
     </li>
 
@@ -524,83 +382,67 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
 
     <li>
     <label for="budget_notes">Notes: </label>
-    <textarea name="budget_notes" id="budget_notes"  cols="80" rows="6">[% budget_notes %]</textarea>
+    <textarea name="budget_notes" id="budget_notes"  cols="80" rows="6">[% budget_notes | html %]</textarea>
     </li>
 
     <li>
-    <label  style="white-space: nowrap;" for="authorised_value_category1">Statistic 1 done on: </label>
+    <label  for="authorised_value_category1">Statistic 1 done on: </label>
         <select name="sort1_authcat" id="authorised_value_category1">
             <option value=""></option>
-            [% FOREACH authorised_value_categories IN authorised_value_categories1 %]
-                [% IF ( authorised_value_categories.selected ) %]
-                    <option value="[% authorised_value_categories.category %]" selected="selected">
-                        [% authorised_value_categories.category %]
-                    </option>
-                [% ELSE %]
-                    <option value="[% authorised_value_categories.category %]">
-                        [% authorised_value_categories.category %]
-                    </option>
-                [% END %]
-            [% END %]
+            [% PROCESS options_for_authorised_value_categories authorised_value_categories => AuthorisedValues.GetCategories( selected => sort1_authcat ) %]
         </select>
     </li>
     <li>
-    <label  style="white-space: nowrap;" for="authorised_value_category2">Statistic 2 done on: </label>
+    <label  for="authorised_value_category2">Statistic 2 done on: </label>
         <select name="sort2_authcat" id="authorised_value_category2">
             <option value=""></option>
-            [% FOREACH authorised_value_categories IN authorised_value_categories2 %]
-                [% IF ( authorised_value_categories.selected ) %]
-                    <option value="[% authorised_value_categories.category %]" selected="selected">
-                        [% authorised_value_categories.category %]
-                    </option>
-                [% ELSE %]
-                    <option value="[% authorised_value_categories.category %]">
-                        [% authorised_value_categories.category %]
-                    </option>
-                [% END %]
-            [% END %]
+            [% PROCESS options_for_authorised_value_categories authorised_value_categories => AuthorisedValues.GetCategories( selected => sort2_authcat ) %]
         </select>
     </li>
     </ol>
 
     [% IF ( budget_id ) %]
-        <input type="hidden" name="budget_id" value="[% budget_id %]" />
+        <input type="hidden" name="budget_id" value="[% budget_id | html %]" />
     [% END %]
     </fieldset>
 
     <fieldset class="action">
-        <input type="submit" value="Submit" onclick="Check(this.form); return false;" /> <a class="cancel" href="/cgi-bin/koha/admin/aqbudgets.pl">Cancel</a>
-        <input type="hidden" name="budget_period_id" value="[% budget_period_id %]" />
+        <input type="submit" value="Submit" /> <a class="cancel" href="/cgi-bin/koha/admin/aqbudgets.pl">Cancel</a>
+        <input type="hidden" name="budget_period_id" value="[% budget_period_id | html %]" />
     </fieldset>
 </form>
 
 [% END %] <!-- add_form -->
 
 [% IF op == 'delete_confirm' %]
-<div class="dialog alert"> <h3>Delete fund [% budget_name %]?</h3>
-<table>
-    <tr>
-    <th scope="row">Fund amount:</th>
-    <td>[% budget_amount %]</td>
-    </tr>
-</table>
+    <div class="dialog alert">
+        <h1>Delete fund [% budget_name | html %]?</h1>
+        If you delete this fund, all orders linked to this fund will be deleted!
+        <table>
+            <tr>
+            <th scope="row">Fund amount:</th>
+            <td>[% budget_amount | $Price %]</td>
+            </tr>
+        </table>
+
+        <form action="/cgi-bin/koha/admin/aqbudgets.pl" method="post">
+            <input type="hidden" name="op" value="delete_confirmed" />
+            <input type="hidden" name="budget_id" value="[% budget_id | html %]" />
+            <input type="hidden" name="budget_period_id" value="[% budget_period_id | html %]" />
+            <button type="submit" class="approve"><i class="fa fa-fw fa-check"></i> Yes, delete this fund</button>
+        </form>
+        <form action="/cgi-bin/koha/admin/aqbudgets.pl" method="get">
+            <button type="submit" class="deny"><i class="fa fa-fw fa-remove"></i> No, do not delete</button>
+        </form>
+    </div>
+[% END %]
 
-<form action="/cgi-bin/koha/admin/aqbudgets.pl" method="post">
-    <input type="hidden" name="op" value="delete_confirmed" />
-    <input type="hidden" name="budget_id" value="[% budget_id %]" />
-    <input type="hidden" name="budget_period_id" value="[% budget_period_id %]" />
-    <input type="submit" value="Delete" class="approve" />
-</form>
+            </main>
+        </div> <!-- /.col-sm-10.col-sm-push-2 -->
 
-<form action="/cgi-bin/koha/admin/aqbudgets.pl" method="get">
-    <input type="submit" class="deny" value="Cancel" />
-</form>
-</div>
-[% END %]
+        <div class="col-sm-2 col-sm-pull-10">
+            <aside>
 
-</div>
-</div>
-<div class="yui-b">
 [% IF op == 'list' %]
   <form action="/cgi-bin/koha/admin/aqbudgets.pl" method="get">
     <a href="#" id="filterbutton">Filters</a>
@@ -609,18 +451,14 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
         <ol>
         <li>
             <label for="filter_budgetbranch2">Library: </label>
-            <select name="filter_budgetbranch" id="filter_budgetbranch2" style="width:10em;">
+            <select name="filter_budgetbranch" id="filter_budgetbranch2">
                 <option value=""></option>
-                [% FOREACH branchloo IN branchloop %]
-                [% UNLESS ( branchloo.selected ) %]<option value="[% branchloo.value %]">
-                [% ELSE %]<option value="[% branchloo.value %]" selected="selected">[% END %]
-                [% branchloo.branchname %]</option>
-                [% END %]
+                [% PROCESS options_for_libraries libraries => Branches.all( selected => selected_branchcode, unfiltered => 1 ) %]
             </select>
         </li>
         <li class="radio">
 
-        <label for="show_mine">Show my funds only</label>
+        <label for="show_mine">Show my funds only:</label>
             [% IF ( show_mine ) %]
                 <input type="checkbox" id="show_mine"  name="show_mine" value="1" checked="checked" />
             [% ELSE %]
@@ -635,9 +473,9 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
               <option value="">All budgets</option>
               [% FOR period IN periods %]
                 [% IF budget_period_id && period.budget_period_id == budget_period_id %]
-                  <option value="[% period.budget_period_id %]" selected="selected">[% period.budget_period_description %]</option>
+                  <option value="[% period.budget_period_id | html %]" selected="selected">[% period.budget_period_description | html %]</option>
                 [% ELSE %]
-                  <option value="[% period.budget_period_id %]">[% period.budget_period_description %]</option>
+                  <option value="[% period.budget_period_id | html %]">[% period.budget_period_description | html %]</option>
                 [% END %]
               [% END %]
             </select>
@@ -649,7 +487,259 @@ var MSG_PARENT_BENEATH_BUDGET = "- " + _("New budget-parent is beneath budget")
         <input type="submit" class="submit" name="filter" value="Go" />
     </fieldset>
 </form>[% END %]
-[% INCLUDE 'acquisitions-menu.inc' %]
-</div>
-</div>
+
+                [% INCLUDE 'acquisitions-menu.inc' %]
+            </aside>
+        </div> <!-- /.col-sm-2.col-sm-pull-10 -->
+     </div> <!-- /.row -->
+
+[% MACRO jsinclude BLOCK %]
+    [% Asset.js("js/acq.js") | $raw %]
+    [% IF op == 'add_form' %]
+        <script>
+        //<![CDATA[
+
+            function userPopup() {
+                window.open("/cgi-bin/koha/members/search.pl?columns=cardnumber,name,category,branch,action&selection_type=add&filter=funds_users",
+                    'PatronPopup',
+                    'width=1024,height=768,location=yes,toolbar=no,'
+                    + 'scrollbars=yes,resize=yes'
+                );
+            }
+
+            function ownerPopup() {
+                window.open("/cgi-bin/koha/members/search.pl?columns=cardnumber,name,category,branch,action&selection_type=select&filter=funds_owners",
+                    'PatronPopup',
+                    'width=1024,height=768,location=yes,toolbar=no,'
+                    + 'scrollbars=yes,resize=yes'
+                );
+            }
+
+            function select_user(borrowernumber, borrower) {
+                ownerRemove();
+                var borrowername = borrower.firstname + ' ' + borrower.surname;
+                if (borrowernumber) {
+                    var ownerlink = '<a href="/cgi-bin/koha/members/moremember.pl'
+                        + '?borrowernumber=' + borrowernumber + '">'
+                        + borrowername + '</a>';
+                    $('#budget_owner_name').html(ownerlink);
+                    $('#budget_owner_id').val(borrowernumber);
+                }
+            }
+
+            function ownerRemove() {
+                $('#budget_owner_name').empty();
+                $('#budget_owner_id').val('');
+            }
+
+            function add_user(borrowernumber, borrowername) {
+                var ids = $("#budget_users_id").val().split(':');
+                if(borrowernumber && ids.indexOf(borrowernumber.toString()) == -1) {
+                    var li = '<li id="user_' + borrowernumber + '">'
+                        + '<a href="/cgi-bin/koha/members/moremember.pl?borrowernumber='
+                        + borrowernumber + '">' + borrowername + '</a> '
+                        + ' &bull; <a data-borrowernumber=" + borrowernumber +" class="del_user" href="#"><i class="fa fa-trash"></i> '+_("Remove")+'</a> '
+                        + '</li>';
+                    $("#budget_users").prepend(li);
+                    ids.push(borrowernumber);
+                    $("#budget_users_id").val(ids.join(':'));
+                } else {
+                    return -1;
+                }
+                return 0;
+            }
+
+            function del_user(borrowernumber) {
+                var ids = $("#budget_users_id").val().split(':');
+                if (borrowernumber) {
+                    var idx = ids.indexOf(borrowernumber+'');
+                    if (idx != -1) {
+                        ids.splice(idx, 1);
+                        $("#budget_users_id").val(ids.join(':'));
+                        $("li#user_" + borrowernumber).remove();
+                    }
+                }
+            }
+
+            function Check(f) {
+                var ok=1;
+                var _alertString="";
+                var alertString2;
+
+                if (!(isNotNull(f.budget_code,1))) {
+                    _alertString += _("- Budget code cannot be blank") + "\n";
+                }
+
+                if (!(isNotNull(f.budget_name,1))) {
+                    _alertString += _("- Budget name cannot be blank") + "\n";
+                }
+
+                if (!(isNotNull(f.budget_amount,1))) {
+                    _alertString += _("- Budget amount cannot be blank") + "\n";
+                }
+
+                var budgetId;
+                if   (typeof(f.budget_id ) != "undefined")  {
+                    budgetId = f.budget_id.value
+                }
+
+                var newBudgetParent;
+
+        //  hack to test if selected parent_id in scrolling-list...
+        //  if value == 'undef' its got a selected_parent :/
+                if(f.budget_parent_id){
+                    var chkAdd   =  f.budget_parent_id.value ;
+                    if  (     typeof(chkAdd ) != "undefined") {
+                        newBudgetParent  =  f.budget_parent_id.value
+                    } else {
+                        newBudgetParent  =  f.budget_parent_id.item(0).value
+                    }
+
+                    if   (budgetId  > 0)  {  ; //its a mod ...
+                        // if parent == curent-budget, fail...
+                        if ( newBudgetParent  ==  budgetId     ) {
+                                _alertString += _("- Budget parent is current budget") + "\n";
+                        }
+
+                        else if (newBudgetParent) {
+                            var result = checkBudgetParent(  budgetId , newBudgetParent   );
+                            if (result) {
+                                _alertString += result;
+                            }
+                        }
+                    }
+                }
+
+                 // else do lookup
+                var budgetTotal = Math.abs(f.budget_amount.value);
+                var result =   budgetExceedsParent  (budgetTotal, budgetId, newBudgetParent, f.budget_period_id.value)
+                if (result) {
+                    _alertString += result;
+                }
+
+                if (_alertString.length==0) {
+                    document.Aform.submit();
+                } else {
+                    alertString2 = _("Form not submitted because of the following problem(s)");
+                    alertString2 += "\n------------------------------------------------------------------------------------\n\n";
+                    alertString2 += _alertString;
+                    alert(alertString2);
+                }
+            }
+            $(document).ready(function(){
+                $("#remove_owner").on("click",function(e){
+                    e.preventDefault();
+                    ownerRemove();
+                });
+                $("#edit_owner").on("click",function(e){
+                    e.preventDefault();
+                    ownerPopup();
+                });
+                $("body").on("click",".del_user",function(e){
+                    e.preventDefault();
+                    var borrowernumber = $(this).data("borrowernumber");
+                    del_user(borrowernumber);
+                });
+                $("#add_user_button").on("click",function(e){
+                    e.preventDefault();
+                    userPopup();
+                });
+                $("#edit_fund").on("submit",function(e){
+                    e.preventDefault();
+                    Check(this);
+                });
+            });
+        //]]>
+        </script>
+    [% ELSIF op == 'list' %]
+        [% INCLUDE 'datatables.inc' %]
+        [% INCLUDE 'columns_settings.inc' %]
+        [% Asset.js("lib/jquery/plugins/treetable/jquery.treetable.js") | $raw %]
+
+        <script>
+        //<![CDATA[
+            //
+            $(document).ready(function() {
+                [% IF budgets %]
+                    var oTable = KohaTable("budgeth", {
+                        "fnDrawCallback": function ( oSettings ) {
+                            if ( oSettings.aiDisplay.length == 0 )
+                            {
+                                return;
+                            }
+
+                            var nTrs = $('#budgeth tbody tr');
+                            var iColspan = nTrs[0].getElementsByTagName('td').length;
+                            var sLastGroup = "";
+                            for ( var i=0 ; i<nTrs.length ; i++ )
+                            {
+                                var iDisplayIndex = oSettings._iDisplayStart + i;
+                                var sGroup = oSettings.aoData[ oSettings.aiDisplay[iDisplayIndex] ]._aData[1];
+                                if ( sGroup != sLastGroup )
+                                {
+                                    var nGroup = document.createElement( 'tr' );
+                                    var nCell = document.createElement( 'td' );
+                                    nCell.colSpan = iColspan;
+                                    nCell.className = "group";
+                                    nCell.innerHTML = sGroup;
+                                    nGroup.appendChild( nCell );
+                                    nTrs[i].parentNode.insertBefore( nGroup, nTrs[i] );
+                                    sLastGroup = sGroup;
+                                }
+                            }
+                        },
+                        "footerCallback": function ( row, data, start, end, display ) {
+                            var api = this.api(), data;
+                            footer_column_sum( api, [ 4, 6, 8, 10 ], 2 );
+                        },
+                        "aoColumnDefs": [
+                            { "bVisible": false, "aTargets": [ 0, 1 ] },
+                            { "bSortable": false, "aTargets": ["_all"] }
+                        ],
+                        'bSort': true,
+                        'aaSortingFixed': [[ 1, 'asc' ]],
+                        'bPaginate': false,
+                        "bAutoWidth": false
+                    });
+
+                    $(oTable).treetable({
+                        expandable: true
+                    });
+                    $(oTable).treetable('expandAll');
+                    $("#expand_all").click(function(e){
+                        e.preventDefault();
+                        $(oTable).treetable('expandAll');
+                    });
+                    $("#collapse_all").click(function(e){
+                        e.preventDefault();
+                        $(oTable).treetable('collapseAll');
+                    });
+
+                    [% UNLESS budget_period_id %]
+                      $("#hide_inactive").click(function(e){
+                        e.preventDefault();
+                        oTable.fnFilter( 1, 0 ); // Show only active=1
+                      });
+                      $("#show_inactive").click(function(e){
+                        e.preventDefault();
+                        oTable.fnFilter( '', 0 );
+                      });
+                      $("#hide_inactive").click();
+                    [% END %]
+                    oTable.fnAddFilters("filter", 750);
+                [% END %]
+
+                $("#filterbutton").click(function() {
+                    $("#fundfilters").slideToggle(0);
+                });
+
+                $(".deletefund-disabled").tooltip().on("click", function(e){
+                    e.preventDefault();
+                    alert(_("This fund has sub funds. It cannot be deleted."));
+                });
+            });
+        //]]>
+        </script>
+    [% END %]
+[% END %]
 [% INCLUDE 'intranet-bottom.inc' %]