107 lines
2.6 KiB
Vue
107 lines
2.6 KiB
Vue
<template>
|
|
<table class="table table-bordered">
|
|
<tbody>
|
|
<tr class="form-group">
|
|
<td colspan="2">
|
|
<table class="table table-sm text-center">
|
|
<thead>
|
|
<tr>
|
|
<th
|
|
class="w-auto"
|
|
scope="col"
|
|
/>
|
|
<th
|
|
class="w-75"
|
|
scope="col"
|
|
>
|
|
{{ __('Email') }} <span class="required-asterisk">*</span>
|
|
</th>
|
|
<th
|
|
class="w-auto"
|
|
scope="col"
|
|
/>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="emails">
|
|
<tr
|
|
v-for="(email, emailIndex) in emails"
|
|
:key="emailIndex"
|
|
>
|
|
<td>{{ emailIndex + 1 }}</td>
|
|
<td>
|
|
<input
|
|
class="form-control form-control-sm"
|
|
v-model="emails[emailIndex]"
|
|
type="email"
|
|
required
|
|
>
|
|
</td>
|
|
<td>
|
|
<button
|
|
@click="removeItem(emailIndex)"
|
|
class="btn btn-danger btn-sm"
|
|
>
|
|
{{ __('Supprimer') }}
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<div class="form-group text-right">
|
|
<a
|
|
class="btn btn-primary btn-sm"
|
|
@click="newItem"
|
|
role="button"
|
|
>{{ __('Ajouter un email') }}</a>
|
|
<input
|
|
v-for="(email, emailIndex) in emails"
|
|
:key="emailIndex"
|
|
type="hidden"
|
|
:name="`${name}[]`"
|
|
:value="email"
|
|
required
|
|
>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { defineComponent } from "vue";
|
|
import trans from "../modules/trans";
|
|
|
|
export default defineComponent({
|
|
name: "WinNotification",
|
|
mixins: [trans],
|
|
mounted() {
|
|
const json = String(this.$attrs.json ?? "{}"),
|
|
data = JSON.parse(json);
|
|
this.emails = data.emails ?? [];
|
|
this.name = data.name ?? "";
|
|
},
|
|
data(): {
|
|
emails: Array<string>,
|
|
name: string,
|
|
} {
|
|
return {
|
|
emails: [],
|
|
name: ""
|
|
};
|
|
},
|
|
watch: {
|
|
|
|
},
|
|
methods: {
|
|
newItem() {
|
|
this.emails.push("");
|
|
},
|
|
removeItem(index: number) {
|
|
if (confirm(this.__("Êtes-vous sûr(e) ?"))) {
|
|
this.emails.splice(index, 1);
|
|
}
|
|
}
|
|
}
|
|
});
|
|
</script>
|