<!-- Headhunted / Hired -->
<h4 style="margin: 0 0 20px 0;">
    {{ ::employee.name }}
</h4>

<div class="avatar-image" style="background-image: url('3dmodels/people/{{ ::employee.avatar }}.png')"></div>

<table style="margin-top: 10px;">
    <tr>
        <td class="text-bold">
            <icon class="icon {{ ::employee.employeeTypeName }}"
                  uib-tooltip="{{ ::employee.employeeTypeName }}"></icon>
            <i class="fa" ng-class="{
                        'fa-star-o': employee.level == EmployeeLevels.Beginner,
                        'fa-star-half-o': employee.level == EmployeeLevels.Intermediate,
                        'fa-star': employee.level == EmployeeLevels.Expert }"></i>
            <span tooltip-append-to-body="true"
                  uib-tooltip="{{ GetLocalized('tip_speed')}}">{{ employee.speed }}%</span>
        </td>
    </tr>
    <tr>
        <td class="small">
            <div tooltip-append-to-body="true" uib-tooltip="{{ GetLocalized('work_environment_rating') }}">
                <span localize="required_wer"></span><br/>
                <span ng-class="{ 'color-red': wer.total < employee.requiredWer, 'color-green': wer.total >= employee.requiredWer }">
                        <strong>{{ ::employee.requiredWer }}%</strong> <span
                        class="dimmed small">({{ wer.total }}%)</span>
                    </span>
            </div>
        </td>
    </tr>
    <tr>
        <td class="padding-top" localize="amount_per_month" localize-data-amount="::employee.salary"
            localize-data-amount-format="currency"></td>
    </tr>
</table>
<div style="margin-top: 5px;">
    <div ng-if="mode == 'select' || !employee.hired">
        <button type="button" class="red small"
                ng-if="mode != 'select'"
                ng-click="ctrl.removeEmployee(employee)" localize="remove">
        </button>
        <button type="button" class="small hire"
                style="margin-top: 3px;"
                ng-click="mode == 'select' ? ctrl.placeEmployee(employee) : ctrl.hireEmployee(employee)"
                ng-class="{ cancel: wer.total < employee.requiredWer }"
                ng-disabled="mode != 'select' && wer.total < employee.requiredWer">{{ mode == 'select' ?
            GetLocalized('select') :
            GetLocalized('hire') }}
        </button>
    </div>
    <div class="color-green text-center text-bold" ng-if="mode !='select' && employee.hired"><i
            class="fa fa-check"></i><span localize="hired"></span></div>
</div>

