320 lines
18 KiB
HTML
320 lines
18 KiB
HTML
<div loading-spinner if="state.isPersonDataLoading" centered="true" overlay="true"></div>
|
|
|
|
<div tabindex="0" role="region" class="person-profile__not-found" ng-if="!state.isPersonDataLoading && !person.id">
|
|
<h3>{{'person.details.notFound' | i18n}}</h3>
|
|
</div>
|
|
|
|
<div class="person-profile" ng-if="!state.isPersonDataLoading && person.id" ng-class="{ 'person-profile__header-edit': editHeader}">
|
|
|
|
<div class="person-profile__header clearfix">
|
|
|
|
<!--Person header section-->
|
|
<editable-content-section id="ticket-header" class="custom-edit-button" hide-edit-button="editDisabledFor('ticket-header')"
|
|
edit-mode-allowed="person.accessMappings.detailsEditAllowed" aria-label="{{'ticket.region.header' | i18n}}" role="region" tabindex="0">
|
|
|
|
<!-- Read mode content -->
|
|
<div ng-show="!editMode" class="ticket__management clearfix">
|
|
<div class="profile__header-icon">
|
|
<img alt="{{person.fullName}}" class="person__userpic" thumbnail-img="{{person.thumbnail}}" imgplaceholder="user" />
|
|
|
|
<div ng-show="person.accessMappings.detailsEditAllowed" class="person__edit-icon">
|
|
<input type="file" name="file" onchange="angular.element(this).scope().handleFileChange(this)" class="edit-icon__file-input"
|
|
aria-label="{{'person.details.edit.personImage'| i18n}}" ie-activate-by-enter/>
|
|
<div class="icon-pencil"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="profile__header-content">
|
|
<span class="profile__title" ng-if="isFullVersion">{{person.fullName}}</span>
|
|
<span class="profile__title-link" ng-if="!isFullVersion"><a class="profile__title" href="#/person/{{person.id | escape}}">{{person.fullName}}</a></span>
|
|
<a aria-label="{{'search.preview.viewFullPerson' | i18n}}" ng-if="!isFullVersion" href="#/person/{{person.id | escape}}">{{'search.preview.viewFullPerson' | i18n}}</a>
|
|
<span class="person-summary__VIP" ng-if="person.isVIP">{{'common.labels.vip' | i18n}}</span>
|
|
|
|
<div class="person__department-section">
|
|
<div>{{person.jobTitle}}</div>
|
|
<div>{{person.organization}}</div>
|
|
<div>{{person.department}}</div>
|
|
</div>
|
|
|
|
<div class="person__company-name">
|
|
{{person.company.name}}
|
|
</div>
|
|
|
|
<div class="profile__action-bar person__action-bar" ng-if="displayMenu" person-menu="person">
|
|
<div title="{{'controls.action.edit' | i18n}}" class="profile-action-bar__item edit-ticket-header-button" role="link" tabindex="0"
|
|
aria-label="{{'controls.action.edit' | i18n}}"
|
|
ng-if="person.accessMappings.detailsEditAllowed" ng-click="handleExternalEditClick()" ng-enter="handleExternalEditClick()">
|
|
<i class="icon-pencil"></i></div>
|
|
<div class="profile-action-bar__item dropdown" title="{{'controls.action.share' | i18n}}">
|
|
<button type="button" class="btn_link dropdown-toggle" title="{{'controls.action.share' | i18n}}">
|
|
<i class="icon-share"></i>
|
|
</button>
|
|
<ul class="profile-action-bar__item-menu dropdown-menu">
|
|
<li>
|
|
<div ng-class="(disableClick) ? 'disabled' : ''" class="dropdown-item" ng-click="disableClick || emailPerson($event)" ng-enter="emailPerson($event)" tabindex="0" role="menuitem">
|
|
{{'action.ticket.email' | i18n: ('common.labels.' + person.type | i18n) }}
|
|
</div>
|
|
</li>
|
|
<li ng-if="chatModel.connected">
|
|
<a class="dropdown-item profile-action-bar__item-menu_start-chat" tabindex="0" role="menuitem">
|
|
{{'chat.startFromPerson.headerMenu' | i18n: ('common.labels.' + person.type | i18n) }}
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div title="{{'controls.action.print' | i18n}}" class="profile-action-bar__item"
|
|
aria-label="{{'controls.action.print' | i18n}}" role="link" tabindex="0"
|
|
ng-click="showPrintDialog($event)" ng-enter="showPrintDialog($event)">
|
|
<i class="{{'icon-printer'}}"></i>
|
|
</div>
|
|
<launch-actions-dropdown class="profile-action-bar__item profile-action-bar__item_text" context="person"></launch-actions-dropdown>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Edit mode content -->
|
|
<div class="edit-header" ng-show="editMode">
|
|
<form name="editPersonHeaderSection">
|
|
<edit-person-data person-profile="person"></edit-person-data>
|
|
</form>
|
|
</div>
|
|
|
|
</editable-content-section>
|
|
</div>
|
|
|
|
<div class="person-profile__body" aria-label="{{'common.labels.person' | i18n}} {{'ticket.region.details' | i18n}}" role="region" tabindex="0">
|
|
|
|
<editable-content-section id="person-customer-card"
|
|
hide-edit-button="editDisabledFor('person-customer-card')"
|
|
edit-mode-allowed="person.accessMappings.detailsEditAllowed">
|
|
|
|
<!-- Read mode content -->
|
|
<div class="person-profile__summary-section" ng-show="!editMode">
|
|
|
|
<person-info-card person="person" person-type="person" profile-type="person" class="person__location-section clearfix"></person-info-card>
|
|
|
|
<div class="person__agent" ng-show="person.isSupportStaff">
|
|
<button type="button" class="btn_link" ng-click="isCollapsed = !isCollapsed" ng-enter="isCollapsed = !isCollapsed">
|
|
{{ isCollapsed ? ('common.labels.showMore' | i18n) : ('common.labels.showLess' | i18n) }}
|
|
<i class="person__agent-icon" ng-class="isCollapsed ? 'icon-angle_down' : 'icon-angle_up'"></i>
|
|
</button>
|
|
|
|
<div class="person__agent-info" collapse="isCollapsed">
|
|
<div class="person__introduction-title">{{'person.details.introduction' | i18n}}</div>
|
|
<div class="person__introduction-desc">
|
|
{{person.introduction}}
|
|
</div>
|
|
|
|
<div class="person__agent-info-block">
|
|
<div class="person__agent-availability">
|
|
<div>
|
|
<span class="person__info-label">{{'person.details.enabled' | i18n}}:</span>
|
|
<span class="person__point-value">{{person.enabled? ('common.labels.yes' | i18n) : ('common.labels.no' | i18n)}}</span>
|
|
</div>
|
|
<div>
|
|
<span class="person__info-label">{{'person.details.availableForAssignment' | i18n}}:</span>
|
|
<span class="person__point-value">{{person.availableForAssignment? ('common.labels.yes' | i18n) : ('common.labels.no' | i18n)}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="person__agent-network">
|
|
<div>
|
|
<span class="person__info-label">{{'person.details.linkedin' | i18n}}:</span>
|
|
<span ng-show="isURL(person.linkedIn)" class="person__point-value"><a href="{{person.linkedIn}}" target="_blank" title="{{person.linkedIn}}">{{person.linkedIn | characters:20}}</a></span>
|
|
<span ng-show="!isURL(person.linkedIn)" class="person__point-value" title="{{person.linkedIn}}">{{person.linkedIn | characters:20}}</span>
|
|
</div>
|
|
<div>
|
|
<span class="person__info-label">{{'person.details.twitter' | i18n}}:</span>
|
|
<span ng-show="isURL(person.twitter)" class="person__point-value"><a href="{{person.twitter}}" target="_blank" title="{{person.twitter}}">{{person.twitter | characters:20}}</a></span>
|
|
<span ng-show="!isURL(person.twitter)" class="person__point-value" title="{{person.twitter}}">{{person.twitter | characters:20}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="person__agent-organization">
|
|
<div>
|
|
<span class="person__info-label">{{'person.details.agentsManager' | i18n}}:</span>
|
|
<a aria-label="{{'person.details.agentsManager' | i18n}} {{person.manager.fullName}}" class="person__point-link" href="#/person/{{person.manager.loginId | escape}}">{{person.manager.fullName}}</a>
|
|
</div>
|
|
<div>
|
|
<span class="person__info-label">{{'person.details.costCenter' | i18n}}:</span>
|
|
<span class="person__point-value">{{person.costCenter}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="person-service-summary__section">
|
|
<div class="person-service-summary__title">
|
|
{{'personInfoCard.label.serviceSummary' | i18n}}
|
|
</div>
|
|
<div class="person-service-summary__body">
|
|
<div class="person-service-summary__rating-section">
|
|
<div title="{{'personInfoCard.label.avgRating' | i18n : serviceSummary.ratingScore}}">
|
|
<span ng-repeat="marker in serviceSummary.ratingMarkers" ng-class="{'icon-star_o': marker.value === 0, 'icon-star_half': marker.value === 50, 'icon-star': marker.value === 100}" class="person-service-summary__rating-star"></span>
|
|
<span class="person-service-summary__rating-count">
|
|
{{serviceSummary.ratingCount}} {{'personInfoCard.label.ratingCount' | i18n}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="person-service-summary__escalation-section">
|
|
<span class="icon-exclamation_triangle"></span>
|
|
<span class="person-service-summary__escalation">{{serviceSummary.escalation}} {{'personInfoCard.label.escalation' | i18n}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="profile-summary__editable-content">
|
|
<form name="editPersonSummarySection">
|
|
<edit-person-contact person-profile="person"
|
|
ng-show="editMode"
|
|
class="editable-content-section-block">
|
|
</edit-person-contact>
|
|
<custom-field-area ticket="person" stacked="true"
|
|
panel-id="personDetailsScreen.Person Summary"
|
|
class="editable-content-section-block">
|
|
</custom-field-area>
|
|
</form>
|
|
</div>
|
|
|
|
</editable-content-section>
|
|
|
|
<div class="person__relationships-section" aria-label="{{'ticket.region.relationship' | i18n}}" role="region" tabindex="0">
|
|
<tabset justified="true" class="tabset_short-relative-tabs" ng-if="!person.isSupportStaff">
|
|
<tab heading="{{'common.tabs.openTickets' | i18n}}">
|
|
<div role="region" aria-label="{{'common.tabs.openTickets' | i18n}}" tabindex="0">
|
|
<div tabindex="0" class="person-items__no-tickets-found" ng-show="!personOpenTickets.length">
|
|
{{'person.details.tickets.noTicketsFound' | i18n}}
|
|
</div>
|
|
<div class="person-item__template" ng-repeat="ticket in personOpenTickets" aria-label="{{'common.tabs.tickets' | i18n}} {{'ticket.region.details' | i18n}}"
|
|
tabindex="0" role="heading" aria-labelledby="personInfo_{{data.id}}">
|
|
<person-ticket-renderer data="ticket" ng-click="showProfileDetails(ticket, 'ticket', $event)"></person-ticket-renderer>
|
|
</div>
|
|
<div class="person-items__loading-spinner" ng-if="state.isMoreRequestedByTicketsLoading">
|
|
<div loading-spinner if="true" inline="true" centered="true"></div>
|
|
</div>
|
|
<button type="button" ng-click="loadMoreRequestedByTickets()" ng-show="personOpenTicketsTotalMatches > personOpenTickets.length"
|
|
ng-disabled="state.isMoreRequestedByTicketsLoading" class="btn_primary person-items__loadMore-btn">
|
|
<span class="icon-repeat"></span>
|
|
{{'common.labels.loadMore' | i18n}}
|
|
</button>
|
|
<div ng-include src="'views/person/person-servicebroker-tickets-partial.html'" ng-if="isServiceBrokerEnabled"></div>
|
|
</div>
|
|
</tab>
|
|
|
|
<tab heading="{{'common.tabs.allTickets' | i18n}}">
|
|
<div role="region" aria-label="{{'common.tabs.allTickets' | i18n}}" tabindex="0">
|
|
<div tabindex="0" class="person-items__no-tickets-found" ng-show="!personAllTickets.length">
|
|
{{'person.details.tickets.noTicketsFound' | i18n}}
|
|
</div>
|
|
<div class="person-item__template" ng-repeat="ticket in personAllTickets" aria-label="{{'common.tabs.tickets' | i18n}} {{'ticket.region.details' | i18n}}"
|
|
tabindex="0" role="heading" aria-labelledby="personInfo_{{data.id}}">
|
|
<person-ticket-renderer data="ticket" ng-click="showProfileDetails(ticket, 'ticket', $event)"></person-ticket-renderer>
|
|
</div>
|
|
<div class="person-items__loading-spinner" ng-if="state.isMoreAllTicketsLoading">
|
|
<div loading-spinner if="true" inline="true" centered="true"></div>
|
|
</div>
|
|
<button type="button" ng-click="loadMoreAllTickets()" ng-show="personAllTicketsTotalMatches > personAllTickets.length"
|
|
ng-disabled="state.isMoreAllTicketsLoading" class="btn_primary person-items__loadMore-btn">
|
|
<span class="icon-repeat"></span>
|
|
{{'common.labels.loadMore' | i18n}}
|
|
</button>
|
|
</div>
|
|
</tab>
|
|
|
|
<tab heading="{{'common.tabs.assets' | i18n}}">
|
|
<div role="region" aria-label="{{'common.tabs.assets' | i18n}}" tabindex="0">
|
|
<div tabindex="0" class="person-items__no-assets-found" ng-show="!personAssetList.length">
|
|
{{'person.details.assets.noAssetsFound' | i18n}}
|
|
</div>
|
|
<div class="person-item__template" ng-repeat="asset in personAssetList" aria-label="{{'common.tabs.assets' | i18n}} {{'ticket.region.details' | i18n}}"
|
|
tabindex="0" role="heading" aria-labelledby="assetInfo_{{data.name}}">
|
|
<person-asset-renderer data="asset" ng-click="showProfileDetails(asset, 'asset', $event)"></person-asset-renderer>
|
|
</div>
|
|
</div>
|
|
</tab>
|
|
</tabset>
|
|
|
|
<tabset justified="true" class="tabset_short-relative-tabs" ng-if="person.isSupportStaff">
|
|
<tab heading="{{'common.tabs.tickets' | i18n}}">
|
|
<div role="region" aria-label="{{'common.tabs.tickets' | i18n}}" tabindex="0">
|
|
<div tabindex="0" class="person-items__no-tickets-found"
|
|
ng-show="!personOpenTickets.length && !personAssignedTickets.length">
|
|
{{'person.details.tickets.noTicketsFound' | i18n}}
|
|
</div>
|
|
<div class="person-items__tickets" ng-if="personOpenTickets.length">
|
|
<div tabindex="0" role="heading" class="person-ticket__type-title">{{'person.details.tickets.requestedBy' | i18n}} {{person.firstName}} ({{personOpenTicketsTotalMatches || 0}})</div>
|
|
<div class="person-item__template" ng-repeat="ticket in personOpenTickets | orderBy :'modifiedDate': true" aria-label="{{'common.tabs.tickets' | i18n}} {{'ticket.region.details' | i18n}}" tabindex="0"
|
|
role="heading" aria-labelledby="personInfo_{{data.id}}">
|
|
<person-ticket-renderer data="ticket" ng-click="showProfileDetails(ticket, 'ticket', $event)"></person-ticket-renderer>
|
|
</div>
|
|
</div>
|
|
<div class="person-items__loading-spinner" ng-if="state.isMoreRequestedByTicketsLoading">
|
|
<div loading-spinner if="true" inline="true" centered="true"></div>
|
|
</div>
|
|
<button type="button" ng-click="loadMoreRequestedByTickets()" ng-show="personOpenTicketsTotalMatches > personOpenTickets.length"
|
|
ng-disabled="state.isMoreRequestedByTicketsLoading" class="btn_primary person-items__loadMore-btn">
|
|
<span class="icon-repeat"></span>
|
|
{{'common.labels.loadMore' | i18n}}
|
|
</button>
|
|
<div class="clearfix person-items__tickets-assigned" ng-if="personAssignedTickets.length">
|
|
<div tabindex="0" role="heading" class="person-ticket__type-title">{{'person.details.tickets.assignedTo' | i18n}} {{person.firstName}} ({{personAssignedTicketsTotalMatches || 0}})</div>
|
|
<div class="person-item__template" ng-repeat="ticket in personAssignedTickets | orderBy :'modifiedDate':true" aria-label="{{'common.tabs.tickets' | i18n}} {{'ticket.region.details' | i18n}}"
|
|
tabindex="0" aria-labelledby="personInfo_{{data.id}}" role="heading">
|
|
<person-ticket-renderer data="ticket" ng-click="showProfileDetails(ticket, 'ticket', $event)"></person-ticket-renderer>
|
|
</div>
|
|
</div>
|
|
<div class="person-items__loading-spinner" ng-if="state.isPersonMoreTicketsLoading">
|
|
<div loading-spinner if="true" inline="true" centered="true"></div>
|
|
</div>
|
|
<button type="button" ng-click="loadMoreAssignedTickets()" ng-show="personAssignedTicketsTotalMatches > personAssignedTickets.length"
|
|
ng-disabled="state.isPersonMoreTicketsLoading" class="btn_primary person-items__loadMore-btn">
|
|
<span class="icon-refresh"></span>
|
|
{{'common.labels.loadMore' | i18n}}
|
|
</button>
|
|
<div ng-include src="'views/person/person-servicebroker-tickets-partial.html'" ng-if="isServiceBrokerEnabled"></div>
|
|
</div>
|
|
|
|
</tab>
|
|
|
|
<tab heading="{{'common.tabs.assets' | i18n}}">
|
|
<div role="region" aria-label="{{'common.tabs.assets' | i18n}}" tabindex="0">
|
|
<div tabindex="0" class="person-items__no-assets-found" ng-show="!personAssetList.length">
|
|
{{'person.details.assets.noAssetsFound' | i18n}}
|
|
</div>
|
|
<div class="person-item__template" ng-repeat="asset in personAssetList" aria-label="{{'common.tabs.assets' | i18n}} {{'ticket.region.details' | i18n}}"
|
|
tabindex="0" role="heading" aria-labelledby="assetInfo_{{data.name}}">
|
|
<person-asset-renderer data="asset" ng-click="showProfileDetails(asset, 'asset', $event)"></person-asset-renderer>
|
|
</div>
|
|
</div>
|
|
</tab>
|
|
|
|
<tab heading="{{'common.tabs.supportGroups' | i18n}}">
|
|
<div role="region" aria-label="{{'common.tabs.supportGroups' | i18n}}" tabindex="0">
|
|
<div tabindex="0" class="person-items__no-groups-found" ng-show="!personSupportGroups.length">
|
|
{{'person.details.supportGroups.noGroupsFound' | i18n}}
|
|
</div>
|
|
<div class="person-item__template" ng-repeat="group in personSupportGroups" aria-label="{{'common.tabs.supportGroups' | i18n}} {{'ticket.region.details' | i18n}}"
|
|
tabindex="0" role="heading" aria-labelledby="personSupportGroupInfo_{{data.name}}">
|
|
<person-support-group-renderer data="group"></person-support-group-renderer>
|
|
</div>
|
|
</div>
|
|
</tab>
|
|
|
|
<tab heading="{{'common.tabs.knowledge' | i18n}}">
|
|
<div role="region" aria-label="{{'common.tabs.knowledge' | i18n}}" tabindex="0">
|
|
<div tabindex="0" class="person-items__no-knowledge-articles-found" ng-show="!personKnowledgeArticles.length">
|
|
{{'person.details.knowledgeArticles.noArticlesFound' | i18n}}
|
|
</div>
|
|
<div class="person-item__template" ng-repeat="article in personKnowledgeArticles" aria-label="{{'common.tabs.knowledge' | i18n}} {{'ticket.region.details' | i18n}}"
|
|
tabindex="0" role="heading" aria-labelledby="personKnowledgeInfo_{{data.title}}">
|
|
<person-knowledge-renderer data="article" ng-click="showProfileDetails(article, 'knowledge', $event)"></person-knowledge-renderer>
|
|
</div>
|
|
</div>
|
|
</tab>
|
|
</tabset>
|
|
</div>
|
|
</div>
|
|
</div>
|