UNPKG

gaf-mobile

Version:

GAF mobile Web site

179 lines (168 loc) 10.6 kB
<div class="profiles StickyCTA-container" ng-class="{'StickyCTA--padded': ctrl.showHireMe}" fl-analytics-section="Profiles" ng-if="!ctrl.user.closed"> <div class="scroll-container"> <header class="profiles-header" fl-mobile-background="{{ ctrl.user.cover_image.current_image.url }}"> <div class="section-inner"> <section class="profiles-user user-profile"> <div class="user-profile-avatar"> <img class="profiles-user-avatar" ng-src="{{ ctrl.userAvatar }}" title="{{ ctrl.user.username }}" /> </div> <div class="profiles-user-details user-profile-details"> <div class="user-profile-username"> <strong>{{ ctrl.user.username }}</strong> <!--<span class="user-profile-onlinestatus onlinestatus is-online"></span>--> </div> <div class="user-profile-rating user-rating" data-rating="{{ ctrl.user.reputation.entire_history.overall | number:1 }}"> <span class="user-rating-progress"></span> <label class="user-rating-label"> <!-- TODO: fl-pluralize --> <span ng-show="ctrl.user.reputation.entire_history.reviews === 0">(no reviews)</span> <span ng-show="ctrl.user.reputation.entire_history.reviews === 1">(1 review)</span> <span ng-show="ctrl.user.reputation.entire_history.reviews > 1">({{ ctrl.user.reputation.entire_history.reviews }} reviews)</span> </label> </div> <div class="user-profile-footer"> <!-- TO DO: Clean up once OnlineOffline AB Test is done --> <span fl-online-offline-icon class="user-profile-onlineStatus online-status--withLabel" user-id="ctrl.user.id" ng-if="ctrl.showOnlineOfflineStatus"></span> <div class="user-profile-location-container"> <div class="user-profile-location"> <span class="user-profile-location-icon"> <fl-svg class="location-pin" src="/images/icons/location-pin.svg"></fl-svg> </span> <small class="user-profile-location-content"> <span ng-if="ctrl.user.location.city">{{ ctrl.user.location.city + ',' }} </span> {{ ctrl.user.location.country.name }} </small> </div> </div> </div> </div> </section> <section class="profiles-user-statistics"> <div class="profiles-user-statistics-item"> <span class="profiles-user-statistics-title">Completed</span> {{ ctrl.user.reputation.entire_history.completion_rate | percentage }}% </div> <div class="profiles-user-statistics-item"> <span class="profiles-user-statistics-title">On Budget</span> {{ ctrl.user.reputation.entire_history.on_budget | percentage }}% </div> <div class="profiles-user-statistics-item"> <span class="profiles-user-statistics-title">On Time</span> {{ ctrl.user.reputation.entire_history.on_time | percentage }}% </div> </section> </div> </header> <nav class="PageNav"> <ul class="PageNav-list"> <li class="PageNav-item"> <a class="PageNav-link is-active" fl-active-tab ng-click="ctrl.changeTab('userDetails')" tab="userDetails" fl-analytics="GoToDetailsTab"> Details </a> </li> <li class="PageNav-item"> <a class="PageNav-link" fl-active-tab ng-click="ctrl.changeTab('userReviews')" tab="userReviews" fl-analytics="GoToReviewsTab"> Reviews </a> </li> </ul> </nav> <!-- User Details --> <section class="profiles-content" ng-if="tab.name === 'userDetails'"> <div class="section-inner"> <section class="Card"> <header class="Card-header"> <h2 class="Card-title">Summary</h2> </header> <div class="Card-bodySection"> <p class="Card-desc" ng-if="ctrl.user.profile_description">{{ ctrl.user.profile_description }}</p> <p class="Card-desc" ng-if="!ctrl.user.profile_description">No profile description</p> </div> </section> <section class="Card"> <header class="Card-header"> <h2 class="Card-title">Skills</h2> </header> <div class="Card-bodySection"> <span ng-repeat="job in ctrl.skills" class="SkillTag"> {{ job.name }}</span> <span ng-if="ctrl.skills.length == 0">No skills yet</span> </div> <footer class="Card-footer" ng-show="ctrl.hasMoreSkills"> <a class="ContentToggle" title="Load more skills for this Freelancer" ng-click="ctrl.showUserSkills()" fl-analytics="ShowMoreSkills"> <span class="ContentToggle-inner"> <span class="ContentToggle-text">Show More Skills</span> <span class="ContentToggle-icon"> <fl-svg src="/images/icons/flicon-arrow-down-circled.svg" class="flicon-arrow-down-circled"></fl-svg> </span> </span> </a> </footer> </section> </div> </section> <!-- User Reviews --> <section class="profiles-content" ng-if="tab.name === 'userReviews'"> <div class="section-inner"> <section class="Card"> <header class="Card-header"> <h2 class="Card-title">Reviews</h2> </header> <div class="Card-bodySection"> <ul class="profiles-reviews-list user-reviews"> <li class="user-review" ng-repeat="review in ctrl.reviews"> <div class="user-review-rating user-rating is-large" data-rating="{{ review.get().rating | number:1 }}"> <span class="user-rating-progress"></span> <label class="user-rating-label">by {{ review.getReviewerDetails().get().username }} - {{review.get().submitdate | timeAgoFilter}} ago.</label> </div> <p class="user-review-description">{{ review.get().description }}</p> </li> </ul> <span class="profiles-user-no-text" ng-if="ctrl.reviews.length == 0">No reviews yet</span> </div> <footer class="Card-footer" ng-if="ctrl.hasMoreReviews" > <a class="ContentToggle" title="Load more reviews for this Freelancer" ng-click="ctrl.loadUserReviews()" fl-analytics="ShowMoreReviews"> <span class="ContentToggle-inner"> <span class="ContentToggle-text">Show More Reviews</span> <span class="ContentToggle-icon"> <fl-svg src="/images/icons/flicon-arrow-down-circled.svg" class="flicon-arrow-down-circled"></fl-svg> </span> </span> </a> </footer> </section> </div> </section> </div> <div class="StickyCTA-bottomFixed section-inner"> <a ng-show="ctrl.bid && ctrl.bid.canBeAwarded()" href="/projects/{{ctrl.projectSeoUrl}}?awardBid={{ctrl.bid.get().id}}/#bids" class="btn btn-primary" fl-analytics="Award" fl-analytics-label="AwardProject">Award</a> <a ng-show="ctrl.bid && ctrl.bid.canCreateMilestone()" href="/projects/{{ctrl.projectSeoUrl}}/?createMilestoneFor={{ctrl.user.id}}#management" class="btn btn-primary" fl-analytics="CreateMilestone" fl-analytics-label="CreateMilestone">Create Milestone</a> <!-- TO DO: Clean up once AB test is done --> <button ng-show="ctrl.showHireMeLoggedIn" ng-click="ctrl.showHiremeModal(ctrl.userCurrency, true)" class="btn btn-secondary profiles-hiremeBtn" fl-analytics="OpenHiremeModal" fl-analytics-label="HireMe">{{ctrl.isInChangeHireMeCopy ? 'Offer Project' : 'Hire me'}}</button> <button ng-if="!ctrl.isUserAuthenticated()" ng-click="ctrl.showHiremeModal()" class="btn btn-secondary profiles-hiremeBtn" fl-analytics="ShowLogIn" fl-analytics-label="HireMe">{{ctrl.isInChangeHireMeCopy ? 'Offer Project' : 'Hire me'}}</button> </div> <!-- Hireme modal --> <hireme-modal ng-if="ctrl.shouldShowHiremeModal" user="ctrl.user" currency="ctrl.userCurrency" close="ctrl.closeHiremeModalCallback()"> </hireme-modal> <!-- Create milestone modal --> <create-milestone-modal ng-if="ctrl.shouldShowCreateMilestoneModal" project="ctrl.project.get()" user="ctrl.user" currency="ctrl.userCurrency" close="ctrl.closeCreateMilestoneModalCallback()"> </create-milestone-modal> </div> <div class="profiles " fl-analytics-section="ClosedUserprofile" ng-if="ctrl.user.closed"> <header class="PageHeader"> <div class="section-inner"> <h1 class="PageHeader-title">Account Closed</h1> <p>Account of <strong>{{ctrl.user.username }}</strong> has been closed. </p> </div> </header> </div>