<section class="user-job-wrapper">
    <user-job-header></user-job-header>
    <div class="main-title primary" ng-show="!ctrl.hasInvoice && ctrl.showStatus">
        <div class="job-owner-header">

            <!-- Choose candidate -->
            <div ng-show="!ctrl.accepted && !ctrl.will_perform">
                <h2>{{'common.you_have' | translate}} {{job_user.data.length}} {{'company.assignments.applications' | translate}}</h2>
            </div>
            <div ng-show="!ctrl.accepted && !ctrl.will_perform && job_user.data.length > 0">
                <a class="button" href="#{{routes.company.job_candidates.resolve(job_obj)}}">{{'company.assignments.candidates.select.title' | translate}}</a>
            </div>

            <!-- Wait user accepted -->
            <div ng-show="ctrl.accepted && !ctrl.will_perform" ng-click="ctrl.gotoAcceptedCandidate()">
                <h2>{{ctrl.user_apply.attributes["first-name"]}} {{'common.have' | translate}} {{ctrl.remainHours}}{{'common.hour' | translate}}
                    {{ctrl.remainMinutes}}{{'common.min' | translate}}<br/>
                    {{'assignment.status.user_application.time_remaining' | translate}}</h2>
            </div>

            <!-- Job ongoing -->

            <div ng-show="ctrl.will_perform && !ctrl.canPerformed" ng-click="ctrl.gotoAcceptedCandidate()">
                <h2>{{ctrl.user_apply.attributes["first-name"]}} {{'assignment.status.applicant_approved' | translate}}</h2>
            </div>


            <!-- Job performed confirmation -->
            <div ng-show="(ctrl.will_perform || ctrl.performed) && ctrl.canPerformed">
                <h2>{{'assignment.is_approved' | translate}}</h2>
            </div>
            <div class="buttons" ng-show="(ctrl.will_perform || ctrl.performed) && ctrl.canPerformed">
                <a class="button small" href="" ng-click="ctrl.ownerCancelPerformed()">{{'common.no' | translate}}</a>
                <a class="button small" href="" ng-click="modalPerformShow=true; isPerformed=false;">{{'common.yes' | translate}}</a>
            </div>
        </div>
    </div>

    <div class="main-content" ng-hide="userModalPerformShow">
        <ul>
            <li class="select">
                <a href="#{{routes.company.job_comments.resolve(job_obj)}}">
                    <span>{{'user.assignments.comments' | translate}}</span><br/>
                    {{comments_amt}} {{'user.assignments.comment_count' | translate}}
                </a>
            </li>

            <li class="select" ng-repeat="chat in ctrl.userChats.data">
                <a href="" ng-click="ctrl.gotoChat(chat['job-users'].id,chat.id);"><span>{{'user.assignments.chat' | translate}}</span><br>{{'user.assignments.conversation' | translate}} {{chat.users.attributes["first-name"]}} {{chat.users.attributes["last-name"]}}</a>
            </li>
        </ul>

    </div>

    <!-- OWNER modal form performed to create invoice -->
    <company-job-perform></company-job-perform>

</section>