[% WRAPPER 'default/base.tt2' %]
<script src='[% ctx.media_prefix %]/js/ui/default/acq/po/view_po.js'> </script>
<div dojoType="dijit.layout.ContentPane" style="height:100%">
    <div>
        <div id='oils-acq-picklist-header'>
            <div>
                Purchase Order
            </div>
            <table class='oils-generic-table'>
                <tr><td>ID</td><td><a id='acq-po-view-id'/></td></tr>
                <tr><td>Name</td><td><a id='acq-po-view-name' href='javascript:void(0);' onclick='updatePoName()'></a></td></tr>
                <tr><td>Provider</td><td><span id="acq-po-view-provider"/></td></tr>
                <tr><td>Total Lineitems</td><td><span id='acq-po-view-total-li'/></td></tr>
                <tr><td>Total Encumbered</td><td>$<span id='acq-po-view-total-enc'/></td></tr>
                <tr><td>Total Spent</td><td>$<span id='acq-po-view-total-spent'/></td></tr>
                <tr><td>Status</td><td><span id='acq-po-view-state'/></td></tr>
                <tr><td>Prepayment Required?</td><td><span id="acq-po-view-prepay"/></td></tr>
                <tr>
                    <td id="acq-po-cancel-label"></td>
                    <td>
                        <span id="acq-po-view-cancel-reason"></span>
                        <span id="acq-po-choose-cancel-reason" class="hidden">
                            <span dojoType="dijit.form.DropDownButton">
                                <span>Cancel order</span>
                                <span dojoType="dijit.TooltipDialog">
                                    <label for="acq-po-cancel-reason">
                                        Reason:
                                    </label>
                                    <span id="acq-po-cancel-reason"></span>
                                    <button jsId="acqPoCancelReasonSubmit"
                                        dojoType="dijit.form.Button"
                                        type="submit">Cancel order</button>
                                </span>
                            </span>
                        </span>
                    </td>
                </tr>
                <tr>
                    <td>Notes</td>
                    <td>
                        <a href="javascript:void(0);"
                            id="acq-po-view-notes"></a>
                    </td>
                </tr>
                <tr id="acq-po-activate" class="hidden">
                    <td>Activatable?</td>
                    <td>
                        <span id="acq-po-activate-checking"></span>
                        <a class="hidden" id="acq-po-activate-link" href="javascript:void(0);" onclick="activatePo()">Activate Order</a>
                    </td>
                </tr>
                <tr><td><a class="hidden" id="acq-po-split" href="javascript:void(0);" onclick="if (confirm(localeStrings.CONFIRM_SPLIT_PO)) splitPo();">Split Order by Lineitems</a></td></tr>
            </table>
        </div>
    </div>
    <script type="text/javascript">var poId = '[% ctx.page_args.0 %]';</script>
    [% INCLUDE 'default/acq/common/li_table.tt2' %]
    [% INCLUDE "default/acq/common/notes.tt2" which = "Po" %]
</div>
[% END %]