142 lines
6.2 KiB
PHP
142 lines
6.2 KiB
PHP
<spark-team-members :user="user" :team="team" inline-template>
|
|
<div>
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">{{ ucfirst(Spark::teamString()) }} Members (@{{ team.users.length }})</div>
|
|
|
|
<div class="panel-body">
|
|
<table class="table table-borderless m-b-none">
|
|
<thead>
|
|
<th></th>
|
|
<th>Name</th>
|
|
<th v-if="roles.length > 1">Role</th>
|
|
<th v-if="roles.length > 1"><!-- Edit Team Member Button --></th>
|
|
<th></th>
|
|
</thead>
|
|
|
|
<tbody>
|
|
<tr v-for="member in team.users">
|
|
<!-- Photo -->
|
|
<td>
|
|
<img :src="member.photo_url" class="spark-profile-photo">
|
|
</td>
|
|
|
|
<!-- Name -->
|
|
<td>
|
|
<div class="btn-table-align">
|
|
<span v-if="member.id === user.id">
|
|
You
|
|
</span>
|
|
|
|
<span v-else>
|
|
@{{ member.name }}
|
|
</span>
|
|
</div>
|
|
</td>
|
|
|
|
<!-- Role -->
|
|
<td v-if="roles.length > 0">
|
|
<div class="btn-table-align">
|
|
@{{ teamMemberRole(member) }}
|
|
</div>
|
|
</td>
|
|
|
|
<!-- Edit Button -->
|
|
<td v-if="roles.length > 0">
|
|
<button class="btn btn-primary"
|
|
@click="editTeamMember(member)"
|
|
v-if="canEditTeamMember(member)">
|
|
|
|
<i class="fa fa-pencil"></i>
|
|
</button>
|
|
</td>
|
|
|
|
<!-- Delete Button -->
|
|
<td>
|
|
<button class="btn btn-danger-outline"
|
|
@click="approveTeamMemberDelete(member)"
|
|
v-if="canDeleteTeamMember(member)">
|
|
|
|
<i class="fa fa-times"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Update Team Member Modal -->
|
|
<div class="modal fade" id="modal-update-team-member" tabindex="-1" role="dialog">
|
|
<div class="modal-dialog" v-if="updatingTeamMember">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button " class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
|
|
<h4 class="modal-title">
|
|
Edit {{ ucfirst(Spark::teamString()) }} Member (@{{ updatingTeamMember.name }})
|
|
</h4>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
<!-- Update Team Member Form -->
|
|
<form class="form-horizontal" role="form">
|
|
<div class="form-group" :class="{'has-error': updateTeamMemberForm.errors.has('role')}">
|
|
<label class="col-md-4 control-label">{{ ucfirst(Spark::teamString()) }} Member Role</label>
|
|
|
|
<div class="col-md-6">
|
|
<select class="form-control" v-model="updateTeamMemberForm.role">
|
|
<option v-for="role in roles" :value="role.value">
|
|
@{{ role.text }}
|
|
</option>
|
|
</select>
|
|
|
|
<span class="help-block" v-if="updateTeamMemberForm.errors.has('role')">
|
|
@{{ updateTeamMemberForm.errors.get('role') }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Modal Actions -->
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
|
|
|
|
<button type="button" class="btn btn-primary" @click="update" :disabled="updateTeamMemberForm.busy">
|
|
Update
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Delete Team Member Modal -->
|
|
<div class="modal fade" id="modal-delete-member" tabindex="-1" role="dialog">
|
|
<div class="modal-dialog" v-if="deletingTeamMember">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button " class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
|
|
<h4 class="modal-title">
|
|
Remove {{ ucfirst(Spark::teamString()) }} Member (@{{ deletingTeamMember.name }})
|
|
</h4>
|
|
</div>
|
|
|
|
<div class="modal-body">
|
|
Are you sure you want to remove this {{ ucfirst(Spark::teamString()) }} member?
|
|
</div>
|
|
|
|
<!-- Modal Actions -->
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal">No, Go Back</button>
|
|
|
|
<button type="button" class="btn btn-danger" @click="deleteMember" :disabled="deleteTeamMemberForm.busy">
|
|
Yes, Remove
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</spark-team-members>
|