61 lines
2.1 KiB
Vue
61 lines
2.1 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>
|
|
<th class="w-75" scope="col">Email <span class="required-asterisk">*</span></th>
|
|
<th class="w-auto" scope="col"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="emails">
|
|
<tr v-for="(item, index) in datas" v-bind:key="item.id">
|
|
<td>{{index + 1}}</td>
|
|
<td><input class="form-control form-control-sm" v-model="item.email" type="email" required></td>
|
|
<td><button @click="removeItem(index)" 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 text-white" @click="newItem" role="button">Ajouter un email</a>
|
|
<input type="hidden" :name="name" :value="JSON.stringify(datas)" required>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
mounted() {
|
|
console.log('WinNotification Component mounted.');
|
|
this.datas = JSON.parse(this.dbdatas);
|
|
},
|
|
props: [
|
|
'name',
|
|
'dbdatas',
|
|
],
|
|
data() {
|
|
return {
|
|
datas: []
|
|
}
|
|
},
|
|
watch: {
|
|
|
|
},
|
|
methods: {
|
|
newItem() {
|
|
this.datas.push({email: ''});
|
|
},
|
|
removeItem(index) {
|
|
if (confirm("Êtes-vous sûr(e) ?")) {
|
|
this.datas.splice(index, 1);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|