use id instead of eid in Events.vue and use index independent of sorting
This commit is contained in:
parent
e4fa48eb75
commit
c512da2660
1 changed files with 8 additions and 6 deletions
|
@ -1,6 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<AsyncLoader :loaded="events.length > 0">
|
<AsyncLoader :loaded="events.length > 0">
|
||||||
<ExpandableTable v-if="!!events" :columns="['slug', 'name']" :items="events" :keyName="'slug'">
|
<ExpandableTable v-if="!!events" :columns="['slug', 'name']" :items="events.map((e,i)=>({idx: i, ...e}))"
|
||||||
|
:keyName="'slug'">
|
||||||
<template v-slot:header_actions>
|
<template v-slot:header_actions>
|
||||||
<button class="btn btn-success" @click.prevent="openAddEventModal">
|
<button class="btn btn-success" @click.prevent="openAddEventModal">
|
||||||
<font-awesome-icon icon="plus"/>
|
<font-awesome-icon icon="plus"/>
|
||||||
|
@ -43,7 +44,7 @@
|
||||||
<div class="mt-3">
|
<div class="mt-3">
|
||||||
<label class="mr-3">Addresses: </label>
|
<label class="mr-3">Addresses: </label>
|
||||||
<div v-for="(address, a_id) in item.addresses" class="btn-group btn-group-sm mr-3"
|
<div v-for="(address, a_id) in item.addresses" class="btn-group btn-group-sm mr-3"
|
||||||
@click.stop="deleteAddress(id, a_id)">
|
@click.stop="deleteAddress(item.idx, a_id)">
|
||||||
<button class="btn btn-secondary" disabled style="opacity: 1">
|
<button class="btn btn-secondary" disabled style="opacity: 1">
|
||||||
{{ address }}
|
{{ address }}
|
||||||
</button>
|
</button>
|
||||||
|
@ -52,8 +53,9 @@
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="btn-group btn-group-sm">
|
<div class="btn-group btn-group-sm">
|
||||||
<input type="text" v-model="new_address[id]">
|
<input type="text" v-model="new_address[item.idx]">
|
||||||
<button class="btn btn-secondary" @click.stop="addAddress(id)" style="white-space: nowrap;">
|
<button class="btn btn-secondary" @click.stop="addAddress(item.idx)"
|
||||||
|
style="white-space: nowrap;">
|
||||||
<font-awesome-icon icon="envelope"/> add
|
<font-awesome-icon icon="envelope"/> add
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -88,11 +90,11 @@ export default {
|
||||||
if (!this.events[id].addresses.includes(a))
|
if (!this.events[id].addresses.includes(a))
|
||||||
this.events[id].addresses.push(a)
|
this.events[id].addresses.push(a)
|
||||||
this.new_address[id] = ""
|
this.new_address[id] = ""
|
||||||
this.updateEvent({id: this.events[id].eid, partial_event: {addresses: this.events[id].addresses}});
|
this.updateEvent({id: this.events[id].id, partial_event: {addresses: this.events[id].addresses}});
|
||||||
},
|
},
|
||||||
deleteAddress(id, a_id) {
|
deleteAddress(id, a_id) {
|
||||||
this.events[id].addresses = this.events[id].addresses.filter((e, i) => i !== a_id);
|
this.events[id].addresses = this.events[id].addresses.filter((e, i) => i !== a_id);
|
||||||
this.updateEvent({id: this.events[id].eid, partial_event: {addresses: this.events[id].addresses}});
|
this.updateEvent({id: this.events[id].id, partial_event: {addresses: this.events[id].addresses}});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
Loading…
Add table
Reference in a new issue