[% WRAPPER default/base.tt2 %]
<script src='[% ctx.media_prefix %]/js/ui/default/acq/financial/list_providers.js'> </script>

<div id='oils-acq-list-header' class='container'>
    <div id='oils-acq-list-header-label'>Providers</div>
</div>

<div class='oils-acq-actions-div'>
    <div dojoType="dijit.form.DropDownButton">
        <span>New Provider</span>

        <div dojoType="dijit.TooltipDialog" execute="createProvider(arguments[0]);">
            <script type='dojo/connect' event='onOpen'>
                openils.acq.CurrencyType.loadSelectWidget(providerCurrencySelector);
                new openils.User().buildPermOrgSelector('ADMIN_PROVIDER', providerOwnerSelect);
            </script>

            <table class='dijitTooltipTable'>
                <tr>
                    <td><label for="name">Name: </label></td>
                    <td><input dojoType="dijit.form.TextBox" name="name"/></td>
                </tr>
                <tr>
                    <td><label for="code">Code: </label></td>
                    <td><input dojoType="dijit.form.TextBox" name="code"/></td>
                </tr>
                <tr>
                    <td><label for="currency_type">Currency Type:</label></td>
                    <td>
                        <input jsId='providerCurrencySelector' name="currency_type" 
                               dojoType="dijit.form.FilteringSelect" searchAttr='code' labelAttr='code'>
                        </input>
                    </td>
                </tr>
                <tr>
                    <td valign='top'><label for="owner">Owning Location:</label></td>
                    <td>
                        <input dojoType="openils.widget.OrgUnitFilteringSelect" jsId='providerOwnerSelect'
                               searchAttr="shortname" name="owner" autocomplete="true" labelAttr='shortname'> </input>
                    </td>
                </tr>
                <tr>
                    <td colspan='2' align='center'>
                        <button dojoType=dijit.form.Button type="submit">Create</button>
                    </td>
                </tr>
            </table>
        </div>
    </div> 
</div>




<!-- The main grid lives here -->
<script>
    function getName(rowIndex, item) {
        if(!item) return;
        var name = this.grid.store.getValue(item, 'name');
        var id = this.grid.store.getValue(item, 'id');
        return '<a href="[% ctx.base_path %]/acq/provider/view/'+id+'">'+name+'</a>';
    }
</script> 
<div dojoType="dijit.layout.ContentPane" layoutAlign="top"> 
    <div dojoType="dijit.layout.ContentPane" layoutAlign="client" style='height:600px;'> 
        <table jsId="providerListGrid" dojoType="dojox.grid.DataGrid" query="{id: '*'}" rowSelector='20px'> 
            <thead> 
                <tr> 
                    <th field="id">ID</th> 
                    <th field="name" width='auto' get='getName'>Name</th> 
                    <th field="code">Code</th> 
                    <th field="owner" get='getOrgInfo'>Owner</th> 
                    <th field="currency_type">Currency Type</th> 
                </tr> 
            </thead> 
        </table>     
    </div> 
</div>

[% END %]