scinote-eln/scinote-web
1
1
Fork 0
mirror of https://github.com/scinote-eln/scinote-web.git synced 2025-03-04 19:53:19 +08:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #3425 from artoscinote/ma_SCI_5099

Browse source 
Fix styling, functionality issues with invite users modal [SCI-5099]
This commit is contained in:
artoscinote 2021-07-09 11:26:19 +02:00 committed by GitHub
commit d78e4713c8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 90 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/assets/javascripts/users/settings/teams/invite_users_modal.js
View file

@ -84,6 +84,10 @@
inviteBtn.hide();
inviteWithRoleDiv.show();
break;
case 'invite_new_members':
inviteBtn.show();
inviteWithRoleDiv.hide();
break;
default:
break;
}

63
app/assets/stylesheets/themes/scinote.scss
View file

@ -1317,6 +1317,8 @@ body > .loading-overlay {
}
.modal-invite-users {
overflow: hidden;
.bootstrap-tagsinput {
min-width: 450px;
width: 100%;
@ -1343,13 +1345,27 @@ body > .loading-overlay {
}
}
.dropdown-selector-container {
margin-bottom: 20px;
}
.g-recaptcha {
margin-top: 20px;
}
h4 {
font-size: 14px;
margin-bottom: 5px;
}
.select-container--with-blank {
overflow: hidden;
.search-field::placeholder {
color: $color-black;
opacity: 1;
}
.search-field:focus::placeholder {
opacity: 0;
}
}
}
// Disable textarea resizing throughout application
@ -1493,13 +1509,34 @@ a.disabled-with-click-events {
}
.form-select {
border: 1px solid $color-silver-chalice;
border-radius: 4px;
color: $color-emperor;
display: block;
font-size: 14px;
min-height: 36px;
outline: 0;
padding: 8px 42px 3px 3px;
width: 100%;
position: relative;
select {
appearance: none;
border: 1px solid $color-silver-chalice;
border-radius: 4px;
color: $color-emperor;
display: block;
font-size: 14px;
min-height: 36px;
outline: 0;
padding: 8px 42px 3px 3px;
width: 100%;
}
&::after {
color: $color-silver-chalice;
content: "\f0d7";
font-family: "Font Awesome 5 Free";
font-weight: 900;
height: 100%;
padding: 12px 8px;
pointer-events: none;
position: absolute;
right: -6px;
text-align: center;
top: -6px;
width: 10%;
z-index: 1;
}
}

5
app/controllers/users/invitations_controller.rb
View file

@ -165,7 +165,10 @@ module Users
.joins(:user_teams)
.where('user_teams.role': UserTeam.roles[:admin])
.distinct
.select { |team| can_invite_team_users?(team) }
teams = teams.where_attributes_like(:name, params[:query]) if params[:query].present?
teams.select { |team| can_invite_team_users?(team) }
render json: teams.map { |t| { value: t.id, label: t.name } }.to_json
end

38
app/views/shared/_invite_users_modal.html.erb
View file

@ -23,6 +23,7 @@
text_title ||= nil
text_invite_heading ||= nil
invite_to_team = type.in?(%w(invite_to_team invite_to_team_with_role))
invite_with_team_selector = type.in?(%w(invite_new_members invite_with_team_selector invite_with_team_selector_and_role))
%>
<div
class="modal modal-invite-users"
@ -71,13 +72,26 @@ invite_to_team = type.in?(%w(invite_to_team invite_to_team_with_role))
<% end %>
</p>
<div class="user-selector">
<select class="emails-input" multiple data-role="tags-input" name="emails[]">
</select>
<h4><%= t('invite_users.input_subtitle') %></h4>
</div>
<% if type == 'invite_new_members' %>
<p><%= t('invite_users.new_members.description') %></p>
<h4 class="heading">
<span><%= t('invite_users.new_members.input_label') %></span>
</h4>
<div class="emails-selector" >
<div class="select-container">
<select name="emails[]" class="emails-input"></select>
</div>
<p><small><%= t('invite_users.new_members.input_subtitle') %></small></p>
</div>
<% else %>
<div class="user-selector">
<select class="emails-input" multiple data-role="tags-input" name="emails[]">
</select>
<h4><%= t('invite_users.input_subtitle') %></h4>
</div>
<% end %>
<% if current_user && type.in?(['invite_with_team_selector', 'invite_with_team_selector_and_role']) %>
<% if current_user && invite_with_team_selector %>
<% # Only allow inviting to teams where user is admin %>
<div class="team-selector">
<h4 class="heading">
@ -98,11 +112,13 @@ invite_to_team = type.in?(%w(invite_to_team invite_to_team_with_role))
<h4 class="heading">
<span><%= t('invite_users.select_team_role') %></span>
</h4>
<%= select_tag "role",
options_for_select(UserTeam.roles.keys
.map { |k| [k.humanize + (k == 'normal_user' ? " (#{t('invite_users.default')})" : ''), k] }, 'normal_user'),
disabled: true, class: "role-input from-control form-select"
%>
<div class="form-select">
<%= select_tag "role",
options_for_select(UserTeam.roles.keys
.map { |k| [k.humanize + (k == 'normal_user' ? " (#{t('invite_users.default')})" : ''), k] }, 'normal_user'),
disabled: true, class: "role-input from-control"
%>
</div>
</div>
</div>
</div>

5
config/locales/en.yml
View file

@ -2209,6 +2209,11 @@ en:
no_team:
title: "Invite users to SciNote"
heading: "Invite more people to start using SciNote."
new_members:
description: "Invite people to your organization to start using SciNote"
input_placeholder: "jsmith@someemail.com"
input_label: "New member emails"
input_subtitle: "You can enter one or more emails. To confirm each one press the ENTER key."
input_subtitle: "You can enter one or more emails. To confirm each one press the ENTER key."
invite_to_team_heading: "Invite users to my team:"
invite_btn: "Invite members"