overleaf/services/web/app/views/user_membership/index.pug
Jessica Lawshe bb882c697c Merge pull request #4288 from overleaf/jel-skip-to-content
Add "Skip to content" to improve accessibility

GitOrigin-RevId: 43368a65057656bdea10b6be3c598d68bd8e2d40
2021-07-28 02:06:54 +00:00

113 lines
4.3 KiB
Text

extends ../layout
block append meta
meta(name="ol-users", data-type="json", content=users)
meta(name="ol-paths", data-type="json", content=paths)
meta(name="ol-groupSize", data-type="json", content=groupSize)
block content
main.content.content-alt#main-content
.container
.row
.col-md-10.col-md-offset-1
h1(ng-non-bindable) #{name || translate(translations.title)}
.card(ng-controller="UserMembershipController")
.page-header
.pull-right(ng-cloak)
small(ng-show="groupSize && selectedUsers.length == 0") !{translate("you_have_added_x_of_group_size_y", {addedUsersSize:'{{ users.length }}', groupSize: '{{ groupSize }}'}, ['strong', 'strong'])}
a.btn.btn-danger(
href,
ng-show="selectedUsers.length > 0"
ng-click="removeMembers()"
) #{translate(translations.remove)}
h3 #{translate(translations.subtitle)}
.row-spaced-small
div(ng-if="inputs.removeMembers.error", ng-cloak)
div.alert.alert-danger(ng-if="inputs.removeMembers.errorMessage")
| #{translate('error')}:
| {{ inputs.removeMembers.errorMessage }}
div.alert.alert-danger(ng-if="!inputs.removeMembers.errorMessage")
| #{translate('generic_something_went_wrong')}
ul.list-unstyled.structured-list(
select-all-list,
ng-cloak
)
li.container-fluid
.row
.col-md-4
input.select-all(
select-all,
type="checkbox"
)
span.header #{translate("email")}
.col-md-4
span.header #{translate("name")}
.col-md-2
span.header #{translate("last_login")}
.col-md-2
span.header #{translate("accepted_invite")}
li.container-fluid(
ng-repeat="user in users | orderBy:'email':true",
ng-controller="UserMembershipListItemController"
)
.row
.col-md-4
input.select-item(
select-individual,
type="checkbox",
ng-model="user.selected"
)
span.email {{ user.email }}
.col-md-4
span.name {{ user.first_name }} {{ user.last_name }}
.col-md-2
span.lastLogin {{ user.last_logged_in_at | formatDate:'Do MMM YYYY' }}
.col-md-2
span.registered
i.fa.fa-check.text-success(ng-show="!user.invite" aria-hidden="true")
span.sr-only(ng-show="!user.invite") #{translate('accepted_invite')}
i.fa.fa-times(ng-show="user.invite" aria-hidden="true")
span.sr-only(ng-show="user.invite") #{translate('invite_not_accepted')}
li(
ng-if="users.length == 0",
ng-cloak
)
.row
.col-md-12.text-centered
small #{translate("no_members")}
hr
div(ng-if="!groupSize || users.length < groupSize", ng-cloak)
p.small #{translate("add_more_members")}
div(ng-if="inputs.addMembers.error", ng-cloak)
div.alert.alert-danger(ng-if="inputs.addMembers.errorMessage")
| #{translate('error')}:
| {{ inputs.addMembers.errorMessage }}
div.alert.alert-danger(ng-if="!inputs.addMembers.errorMessage")
| #{translate('generic_something_went_wrong')}
form.form
.row
.col-xs-6
input.form-control(
name="email",
type="text",
placeholder="jane@example.com, joe@example.com",
ng-model="inputs.addMembers.content",
on-enter="addMembers()"
aria-describedby="add-members-description"
)
.col-xs-4
button.btn.btn-primary(ng-click="addMembers()", ng-disabled="inputs.addMembers.inflightCount > 0")
span(ng-show="inputs.addMembers.inflightCount === 0") #{translate("add")}
span(ng-show="inputs.addMembers.inflightCount > 0") #{translate("adding")}…
.col-xs-2(ng-if="paths.exportMembers", ng-cloak)
a(href=paths.exportMembers) #{translate('export_csv')}
.row
.col-xs-8
span.help-block #{translate('add_comma_separated_emails_help')}
div(ng-if="groupSize && users.length >= groupSize && users.length > 0", ng-cloak)
.row
.col-xs-2.col-xs-offset-10(ng-if="paths.exportMembers", ng-cloak)
a(href=paths.exportMembers) #{translate('export_csv')}