<aura:component controller="ReallocateTasksCntrl">
    <aura:attribute name="taskList" type="string[]"/>
    <aura:attribute name="userList" type="Object"/>
    <aura:attribute name="row" type="Integer"/>
    <aura:attribute name="selectedUserId" type="string"/>
    <!--<aura:handler name="init" value="this" action="{!c.doInit}"/>-->
    <ltng:require styles="{! $Resource.	JQDataTable + '/DataTables-1.10.16/media/css/jquery.dataTables.min.css'}"
                  scripts="{!join(',',
                           $Resource.JQueryNew ,
                           $Resource.JQDataTable + '/DataTables-1.10.16/media/js/jquery.dataTables.min.js')}" afterScriptsLoaded="{!c.doInit}"/>
    <div class="slds">
        <div class="slds-page-header"  style="border-radius: 0px;  border-right: 0px;border-left: 0px;border-top: 0px;
                                              box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.1);">
            <div class="slds-grid">
                <div class="slds-col slds-size--5-of-12">
                    <lightning:icon iconName="utility:user" alternativeText="User" size="small" />
                    <span style="margin: 2%;
                                 position: relative;
                                 top: 12%;">
                        <b>SELECT A USER</b>
                    </span>
                </div>
                <div class="slds-col slds-size--7-of-12">
                    <button type="button" class="slds-button slds-button--neutral" onclick="{!c.navigateBack}">
                        <lightning:icon iconName="utility:back" alternativeText="Back" size="xx-small" />
                        &nbsp; Back
                    </button>
                    <button type="button" class="slds-button slds-button--brand" onclick="{!c.transferTasks}">
                        <lightning:icon iconName="utility:change_record_type" alternativeText="Back" size="xx-small" variant="inverse"/>
                        &nbsp; Transfer Task
                    </button>
                </div>
            </div>
        </div>
        <div id="table_container">
            <table class="slds-table slds-table--bordered" aura:id="tableId">
                <thead>
                    <tr>
                        <th>SELECT</th>
                        <th>NAME</th>
                        <th>EMAIL</th>
                        <th>PHONE</th>
                    </tr>
                </thead>
                <tbody>
                    <aura:iteration items="{!v.userList}" var="u" indexVar="index">
                        <tr>
                            <td> <ui:inputRadio text="{!index}" name="s" click="{!c.setUser}"/>&nbsp;</td>
                            <td>
                                <p data-letters="{!u.firstChar}" data-color="red" class="slds-truncate" title="{!u.userRec.Name}">
                                    <a onclick="{!c.navigateTosRecord}" data-value="{!u.Id}">{!u.userRec.Name}</a>
                                </p>
                            </td>
                            <td>
                                <p><lightning:formattedEmail value="{!u.userRec.Email}" /></p>
                            </td>
                            <td>{!u.userRec.Phone}</td>
                        </tr>
                    </aura:iteration>
                </tbody>
            </table>
        </div>
        <div class="slds-page-header" style="border-radius: 0px;  border-right: 0px;border-left: 0px;border-top: 0px;
                                             box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.1);">
            <div class="slds-grid">
                <div class="slds-col slds-size--5-of-12">
                </div>
                <div class="slds-col slds-size--7-of-12">
                    <button type="button" class="slds-button slds-button--neutral" onclick="{!c.navigateBack}">
                        <lightning:icon iconName="utility:back" alternativeText="Back" size="xx-small" />
                        &nbsp; Back
                    </button>
                    <button type="button" class="slds-button slds-button--brand" onclick="{!c.transferTasks}">
                        <lightning:icon iconName="utility:change_record_type" alternativeText="Back" size="xx-small" variant="inverse"/>
                        &nbsp; Transfer Task
                    </button>
                </div>
            </div>
        </div>
    </div>
</aura:component>