Differential D3373 Diff 9640 src/resources/vue/Reseller/Invitations.vue

Changeset View

Standalone View

src/resources/vue/Reseller/Invitations.vue

	<template>			<template>
	<div class="container">			<div class="container">
	<div class="card" id="invitations">			<div class="card" id="invitations">
	<div class="card-body">			<div class="card-body">
	<div class="card-title">			<div class="card-title">
	{{ $t('invitation.title') }}			{{ $t('invitation.title') }}
	</div>			</div>
	<div class="card-text">			<div class="card-text">
	<div class="mb-2 d-flex">			<div class="mb-2 d-flex">
	<list-search :placeholder="$t('invitation.search')" :on-search="searchInvitations"></list-search>			<list-search :placeholder="$t('invitation.search')" :on-search="searchInvitations"></list-search>
	<div>			<btn class="btn-success create-invite ms-1" @click="inviteUserDialog" icon="envelope-open-text">{{ $t('invitation.create') }}</btn>
	<button class="btn btn-success create-invite ms-1" @click="inviteUserDialog">
	<svg-icon icon="envelope-open-text"></svg-icon> {{ $t('invitation.create') }}
	</button>
	</div>
	</div>			</div>

	<table id="invitations-list" class="table table-sm table-hover">			<table id="invitations-list" class="table table-sm table-hover">
	<thead>			<thead>
	<tr>			<tr>
	<th scope="col">{{ $t('user.ext-email') }}</th>			<th scope="col">{{ $t('user.ext-email') }}</th>
	<th scope="col">{{ $t('form.created') }}</th>			<th scope="col">{{ $t('form.created') }}</th>
	<th scope="col"></th>			<th scope="col"></th>
	</tr>			</tr>
	</thead>			</thead>
	<tbody>			<tbody>
	<tr v-for="inv in invitations" :id="'i' + inv.id" :key="inv.id">			<tr v-for="inv in invitations" :id="'i' + inv.id" :key="inv.id">
	<td class="email">			<td class="email">
	<svg-icon icon="envelope-open-text" :class="statusClass(inv)" :title="$t('invitation.status-' + statusLabel(inv))"></svg-icon>			<svg-icon icon="envelope-open-text" :class="statusClass(inv)" :title="$t('invitation.status-' + statusLabel(inv))"></svg-icon>
	<span>{{ inv.email }}</span>			<span>{{ inv.email }}</span>
	</td>			</td>
	<td class="datetime">			<td class="datetime">
	{{ inv.created }}			{{ inv.created }}
	</td>			</td>
	<td class="buttons">			<td class="buttons">
	<button class="btn text-danger button-delete p-0 ms-1" @click="deleteInvite(inv.id)">			<btn class="text-danger button-delete p-0 ms-1" @click="deleteInvite(inv.id)" icon="trash-alt">
	<svg-icon icon="trash-alt"></svg-icon>
	<span class="btn-label">{{ $t('btn.delete') }}</span>			<span class="btn-label">{{ $t('btn.delete') }}</span>
	</button>			</btn>
	<button class="btn button-resend p-0 ms-1" :disabled="inv.isNew \|\| inv.isCompleted" @click="resendInvite(inv.id)">			<btn class="button-resend p-0 ms-1" :disabled="inv.isNew \|\| inv.isCompleted" @click="resendInvite(inv.id)" icon="redo">
	<svg-icon icon="redo"></svg-icon>
	<span class="btn-label">{{ $t('btn.resend') }}</span>			<span class="btn-label">{{ $t('btn.resend') }}</span>
	</button>			</btn>
	</td>			</td>
	</tr>			</tr>
	</tbody>			</tbody>
	<list-foot :text="$t('invitation.empty-list')" colspan="3"></list-foot>			<list-foot :text="$t('invitation.empty-list')" colspan="3"></list-foot>
	</table>			</table>
	<list-more v-if="hasMore" :on-click="loadInvitations"></list-more>			<list-more v-if="hasMore" :on-click="loadInvitations"></list-more>
	</div>			</div>
	</div>			</div>
	</div>			</div>

	<div id="invite-create" class="modal" tabindex="-1" role="dialog">			<div id="invite-create" class="modal" tabindex="-1" role="dialog">
	<div class="modal-dialog" role="document">			<div class="modal-dialog" role="document">
	<div class="modal-content">			<div class="modal-content">
	<div class="modal-header">			<div class="modal-header">
	<h5 class="modal-title">{{ $t('invitation.create-title') }}</h5>			<h5 class="modal-title">{{ $t('invitation.create-title') }}</h5>
	<button type="button" class="btn-close" data-bs-dismiss="modal" :aria-label="$t('btn.close')"></button>			<btn class="btn-close" data-bs-dismiss="modal" :aria-label="$t('btn.close')"></btn>
	</div>			</div>
	<div class="modal-body">			<div class="modal-body">
	<form>			<form>
	<p>{{ $t('invitation.create-email') }}</p>			<p>{{ $t('invitation.create-email') }}</p>
	<div>			<div>
	<input id="email" type="text" class="form-control" name="email">			<input id="email" type="text" class="form-control" name="email">
	</div>			</div>
	<div class="form-separator"><hr><span>{{ $t('form.or') }}</span></div>			<div class="form-separator"><hr><span>{{ $t('form.or') }}</span></div>
	<p>{{ $t('invitation.create-csv') }}</p>			<p>{{ $t('invitation.create-csv') }}</p>
	<div>			<div>
	<input id="file" type="file" class="form-control" name="csv">			<input id="file" type="file" class="form-control" name="csv">
	</div>			</div>
	</form>			</form>
	</div>			</div>
	<div class="modal-footer">			<div class="modal-footer">
	<button type="button" class="btn btn-secondary modal-cancel" data-bs-dismiss="modal">{{ $t('btn.cancel') }}</button>			<btn class="btn-secondary modal-cancel" data-bs-dismiss="modal">{{ $t('btn.cancel') }}</btn>
	<button type="button" class="btn btn-primary modal-action" @click="inviteUser()">			<btn class="btn-primary modal-action" icon="paper-plane" @click="inviteUser()">{{ $t('invitation.send') }}</btn>
	<svg-icon icon="paper-plane"></svg-icon> {{ $t('invitation.send') }}
	</button>
	</div>			</div>
	</div>			</div>
	</div>			</div>
	</div>			</div>
	</div>			</div>
	</template>			</template>

	<script>			<script>
	▲ Show 20 Lines • Show All 137 Lines • Show Last 20 Lines