106 lines
3.4 KiB
Vue
106 lines
3.4 KiB
Vue
<script setup>
|
|
|
|
import { ref, useTemplateRef } from 'vue';
|
|
import { Dialog, TextInput, FormGroup, Checkbox, InputGroup, SingleSelect } from 'pankow';
|
|
import MailinglistsModel from '../models/MailinglistsModel.js';
|
|
|
|
const emit = defineEmits([ 'success' ]);
|
|
const props = defineProps([ 'domains' ]);
|
|
|
|
const mailinglistsModel = MailinglistsModel.create();
|
|
|
|
const dialog = useTemplateRef('dialog');
|
|
const busy = ref(false);
|
|
const formError = ref('');
|
|
const name = ref('');
|
|
const domain = ref('');
|
|
const mailinglist = ref(null);
|
|
const membersText = ref('');
|
|
const membersOnly = ref(false);
|
|
const active = ref(false);
|
|
|
|
async function onSubmit() {
|
|
busy.value = true;
|
|
formError.value = '';
|
|
|
|
const data = {
|
|
members: membersText.value.split('\n').map(m => m.trim()).filter(m => m),
|
|
membersOnly: membersOnly.value,
|
|
active: active.value,
|
|
};
|
|
|
|
if (mailinglist.value) {
|
|
const [error] = await mailinglistsModel.update(domain.value, name.value, data);
|
|
if (error) {
|
|
busy.value = false;
|
|
formError.value = error.body ? error.body.message : 'Internal error';
|
|
return console.error(error);
|
|
}
|
|
} else {
|
|
const [error] = await mailinglistsModel.add(domain.value, name.value, data);
|
|
if (error) {
|
|
busy.value = false;
|
|
formError.value = error.body ? error.body.message : 'Internal error';
|
|
return console.error(error);
|
|
}
|
|
}
|
|
|
|
emit('success');
|
|
dialog.value.close();
|
|
busy.value = false;
|
|
}
|
|
|
|
defineExpose({
|
|
async open(m = null) {
|
|
busy.value = false;
|
|
formError.value = '';
|
|
mailinglist.value = m;
|
|
|
|
name.value = m ? m.name : '';
|
|
domain.value = m ? m.domain : '';
|
|
membersText.value = m ? m.members.join('\n') : '';
|
|
membersOnly.value = m ? m.membersOnly : false;
|
|
|
|
dialog.value.open();
|
|
}
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<Dialog ref="dialog"
|
|
:title="mailinglist ? $t('email.editMailboxDialog.title', { name: mailinglist.name, domain: mailinglist.domain }) : $t('email.addMailboxDialog.title')"
|
|
:confirm-label="$t(mailinglist ? 'main.dialog.save' : 'email.incoming.mailboxes.addAction')"
|
|
:confirm-busy="busy"
|
|
:confirm-active="!busy && name !== '' && domain !== '' && membersText !== ''"
|
|
reject-style="secondary"
|
|
:reject-label="busy ? null : $t('main.dialog.cancel')"
|
|
@confirm="onSubmit()"
|
|
>
|
|
<div>
|
|
<div class="has-error" v-if="formError">{{ formError }}</div>
|
|
|
|
<form @submit.prevent="onSubmit()" novalidate autocomplete="off">
|
|
<fieldset :disabled="busy">
|
|
<input type="submit" style="display: none;" :disabled="!name || !domain"/>
|
|
|
|
<FormGroup v-if="!mailinglist">
|
|
<label for="nameInput">{{ $t('email.addMailinglistDialog.name') }}</label>
|
|
<InputGroup>
|
|
<TextInput id="nameInput" style="flex-grow: 1;" v-model="name"/>
|
|
<SingleSelect v-model="domain" :options="domains" option-key="domain" option-label="domain" />
|
|
</InputGroup>
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<label for="membersInput">{{ $t('email.addMailinglistDialog.members') }}</label>
|
|
<textarea id="membersInput" v-model="membersText" rows="5"></textarea>
|
|
</FormGroup>
|
|
|
|
<Checkbox v-model="membersOnly" :label="$t('email.addMailinglistDialog.membersOnlyCheckbox')"/><br/>
|
|
<Checkbox v-model="active" :label="$t('email.updateMailinglistDialog.activeCheckbox')"/><br/>
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
</Dialog>
|
|
</template> |