spacedeck-open/views/partials/modal/access.html
2017-04-07 01:29:05 +02:00

125 lines
6.4 KiB
HTML

<div class="modal" v-if="active_modal == 'access' && access_settings_space" v-cloak>
<div class="modal-wrapper">
<div class="modal-dialog">
<div class="modal-content" style="width:760px">
<div class="modal-header" style="padding-bottom:0">
<h3 class="text-left"><span class="icon icon-share icon-sm"></span> [[__("share")]]: {{access_settings_space.name}}</h3>
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click=" close_modal()">
<span class="icon icon-cross-1"></span>
</button>
</div>
<div class="modal-body">
<div class="modal-section" style="padding-top:0;padding-bottom:20px">
<label class="radio" v-bind:class="{checked:access_settings_space.access_mode=='private'}">
<input type="radio" name="access_mode" value="private" v-model="access_settings_space.access_mode" v-on:click="save_space_access_mode($event)"> [[__("mode_private")]]
</label>
<label class="radio" v-bind:class="{checked:access_settings_space.access_mode=='public'}">
<input type="radio" name="access_mode" value="public" v-model="access_settings_space.access_mode" v-on:click="save_space_access_mode($event)">[[__("mode_public")]]
</label>
</div>
<div class="modal-section" v-if="active_space" style="padding-bottom:10px">
<h4 class="text-left"><span class="icon icon-link icon-sm"></span> [[__("access_editor_link")]] </h4>
<p class="text-left">
[[__("access_editor_link_desc")]]
</p>
<div class="input-group org-add-form">
<input id="editorurl2" type="text" class="form-control input input-lg" v-bind:value="share_base + '/s/' + access_settings_space.edit_hash + (access_settings_space.edit_slug ? '-' : '') + access_settings_space.edit_slug"/>
<span class="input-group-btn">
<span id="org-add-member" class="btn btn-lg btn-primary clipboard-btn" data-clipboard-target="#editorurl2" v-clipboard>
[[__("copy")]]
</span>
</span>
</div>
<label class="checkbox" v-bind:class="{checked:access_settings_space.editors_locking}">
<input
type="checkbox"
v-bind:checked="access_settings_space.editors_locking"
v-model="access_settings_space.editors_locking" v-on:change="save_space_editors_locking($event)" />
[[__("access_anonymous_edit_blocking")]]
</label>
</div>
<!-- subsection "invite" -->
<div id="new-editor" class="modal-section" style="padding-bottom:20px">
<h4 class="text-left"><span class="icon icon-user-add icon-sm"></span> [[__('access_new_members')]]</h4>
<div class="form-group">
<span class="error-note" v-if="invite_email_error">{{invite_email_error}}</span>
<input class="input input-block input-white"
v-bind:class="{error: !!invite_email_error}"
id="invitee_email"
v-model="invite_email"
type="email" placeholder="[[__('invite_emails')]]">
<textarea id="invite-message" class="input input-block input-white overflow-y-scroll"
v-model="invite_message" placeholder="[[__('optional_message')]]" name="Message"></textarea>
<select class="input input-white" v-model="invite_member_role">
<option value="viewer">[[__("role_viewer")]]</option>
<option value="editor">[[__("role_editor")]]</option>
<option value="admin">[[__("role_admin")]]</option>
</select>
</div>
<div class="form-group">
<button class="btn btn-primary btn-md btn-round" v-on:click="invite_member(access_settings_space, invite_email, invite_message, invite_member_role)"> [[__("invite")]] </button>
</div>
</div>
<!-- subsection "editors list" -->
<div class="modal-section" style="padding-bottom:60px">
<h4 class="text-left"><span class="icon icon-user-group icon-sm"></span> [[__("access_current_members")]]</h4>
<table class="table">
<tr>
<th></th>
<th>Email / Name</th>
<th>Role</th>
<th></th>
</tr>
<tr v-for="member in access_settings_memberships" v-bind:class="member.state">
<td>
<span class="editor-avatar btn btn-xs btn-round btn-icon" v-if="member.user">{{member.user.initials}}</span>
<span class="editor-avatar btn btn-xs btn-round btn-icon icon-hourglass" v-if="!member.user"></span>
</td>
<td>
<span class="editor-email" v-if="member.state == 'active'">{{member.user.email}}</span>
<span class="editor-email" v-if="member.state == 'pending'">{{member.email_invited}}</span>
<span class="editor-name" v-if="member.state == 'active'">{{member.user.nickname}}</span>
<span class="editor-email" v-if="member.state == 'pending'">(pending)</span>
</td>
<td>
<div class="form-group">
<select class="input input-sm" v-model="member.role" v-on:change="update_member(access_settings_space, member, $event.currentTarget.value)" style="width:auto">
<option value="viewer">[[__("role_viewer")]]</option>
<option value="editor">[[__("role_editor")]]</option>
<option value="admin">[[__("role_admin")]]</option>
</select>
</div>
</td>
<td>
<button class="btn btn-sm btn-stroke-darken" v-on:click="remove_member(access_settings_space, member)">[[__("delete")]]</button>
</td>
</tr>
</table>
<p class="text-left" v-if="!access_settings_memberships.length">
[[__("access_no_members")]]
</p>
<div class="form-group" style="padding-top: 40px">
<button class="btn btn-primary btn-md btn-round" v-on:click="close_modal();"> [[__("ok")]] </button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>