92 lines
2.5 KiB
Vue
92 lines
2.5 KiB
Vue
<script setup>
|
|
|
|
import { useI18n } from 'vue-i18n';
|
|
const i18n = useI18n();
|
|
const t = i18n.t;
|
|
|
|
import { ref, useTemplateRef } from 'vue';
|
|
import { Dialog, TextInput, ClipboardButton, EmailInput, FormGroup, Button, InputGroup, ProgressBar } from '@cloudron/pankow';
|
|
import UsersModel from '../models/UsersModel.js';
|
|
|
|
const emit = defineEmits([ 'refreshRequired' ]);
|
|
|
|
const usersModel = UsersModel.create();
|
|
|
|
const dialog = useTemplateRef('dialog');
|
|
const user = ref({});
|
|
const formError = ref('');
|
|
const inviteLink = ref('');
|
|
const email = ref('');
|
|
const success = ref(false);
|
|
const busy = ref(false);
|
|
|
|
async function onSendInvite() {
|
|
const [error] = await usersModel.sendInviteEmail(user.value.id, email.value);
|
|
if (error) return console.error(error);
|
|
|
|
window.pankow.notify({ type: 'success', text: t('users.invitationNotification.body', { email: email.value })});
|
|
|
|
dialog.value.close();
|
|
}
|
|
|
|
defineExpose({
|
|
async open(u) {
|
|
u = JSON.parse(JSON.stringify(u)); // make a copy
|
|
user.value = u;
|
|
success.value = false;
|
|
email.value = u.email || '';
|
|
formError.value = '';
|
|
inviteLink.value = '';
|
|
|
|
dialog.value.open();
|
|
|
|
const [error, result] = await usersModel.inviteLink(u.id);
|
|
if (error) {
|
|
if (error.status === 409) {
|
|
emit('refreshRequired');
|
|
dialog.value.close();
|
|
} else {
|
|
console.error(error);
|
|
}
|
|
|
|
return;
|
|
}
|
|
inviteLink.value = result;
|
|
}
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<Dialog ref="dialog"
|
|
:title="$t('users.invitationDialog.title')"
|
|
:reject-label="$t('main.dialog.close')"
|
|
reject-style="secondary"
|
|
>
|
|
<div>
|
|
<div v-if="!inviteLink" style="text-align: center;">
|
|
<ProgressBar mode="indeterminate" :show-label="false" :slim="true"/>
|
|
</div>
|
|
<div v-else>
|
|
<p>{{ $t('users.invitationDialog.context', { username: user? (user.username || user.email) : '' }) }}</p>
|
|
|
|
<FormGroup>
|
|
<label>{{ $t('users.invitationDialog.descriptionLink') }}</label>
|
|
<InputGroup>
|
|
<TextInput style="flex-grow: 1;" v-model="inviteLink" readonly/>
|
|
<ClipboardButton :value="inviteLink" />
|
|
</InputGroup>
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<label>{{ $t('users.invitationDialog.descriptionEmail') }}</label>
|
|
<InputGroup>
|
|
<EmailInput style="flex-grow: 1;" v-model="email"/>
|
|
<Button @click="onSendInvite()" :loading="busy">{{ $t('users.invitationDialog.sendAction') }}</Button>
|
|
</InputGroup>
|
|
</FormGroup>
|
|
</div>
|
|
</div>
|
|
</Dialog>
|
|
</template>
|