c3lf/c3lf-system-3
7
0
Fork 0
Code Issues 52 Pull requests Projects 2 Releases Wiki Activity Actions

refactor: use slot name 'actions' in Table component

Browse source
This commit is contained in:
j3d1 2023-12-28 23:32:30 +01:00
parent a458d4f850
commit 54a8445cd4
3 changed files with 40 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
web/src/views/Items.vue
View file

@ -19,20 +19,21 @@
:columns="['uid', 'description', 'box']" :columns="['uid', 'description', 'box']"
:items="loadedItems" :items="loadedItems"
:keyName="'uid'" :keyName="'uid'"
v-slot="{ item }"
@itemActivated="openLightboxModalWith($event)" @itemActivated="openLightboxModalWith($event)"
> >
<div class="btn-group"> <template #actions="{ item }">
<button class="btn btn-success" @click.stop="markItemReturned(item)" title="returned"> <div class="btn-group">
<font-awesome-icon icon="check"/> <button class="btn btn-success" @click.stop="markItemReturned(item)" title="returned">
</button> <font-awesome-icon icon="check"/>
<button class="btn btn-secondary" @click.stop="openEditingModalWith(item)" title="edit"> </button>
<font-awesome-icon icon="edit"/> <button class="btn btn-secondary" @click.stop="openEditingModalWith(item)" title="edit">
</button> <font-awesome-icon icon="edit"/>
<button class="btn btn-danger" @click.stop="deleteItem(item)" title="delete"> </button>
<font-awesome-icon icon="trash"/> <button class="btn btn-danger" @click.stop="deleteItem(item)" title="delete">
</button> <font-awesome-icon icon="trash"/>
</div> </button>
</div>
</template>
</Table> </Table>
</div> </div>
</div> </div>
@ -45,21 +46,23 @@
@itemActivated="openLightboxModalWith($event)" @itemActivated="openLightboxModalWith($event)"
> >
<AuthenticatedImage v-if="item.file" <AuthenticatedImage v-if="item.file"
:src="`/media/2/256/${item.file}/`" :src="`/media/2/256/${item.file}/`"
class="card-img-top img-fluid" class="card-img-top img-fluid"
/> />
<div class="card-body"> <div class="card-body">
<h6 class="card-title">{{ item.description }}</h6> <h6 class="card-title">{{ item.description }}</h6>
<h6 class="card-subtitle text-secondary">uid: {{ item.uid }} box: {{ item.box }}</h6> <h6 class="card-subtitle text-secondary">uid: {{ item.uid }} box: {{ item.box }}</h6>
<div class="row mx-auto mt-2"> <div class="row mx-auto mt-2">
<div class="btn-group"> <div class="btn-group">
<button class="btn btn-outline-success" @click.stop="confirm('return Item?') && markItemReturned(item)" title="returned"> <button class="btn btn-outline-success"
@click.stop="confirm('return Item?') && markItemReturned(item)" title="returned">
<font-awesome-icon icon="check"/> <font-awesome-icon icon="check"/>
</button> </button>
<button class="btn btn-outline-secondary" @click.stop="openEditingModalWith(item)" title="edit"> <button class="btn btn-outline-secondary" @click.stop="openEditingModalWith(item)" title="edit">
<font-awesome-icon icon="edit"/> <font-awesome-icon icon="edit"/>
</button> </button>
<button class="btn btn-outline-danger" @click.stop="confirm('delete Item?') && deleteItem(item)" title="delete"> <button class="btn btn-outline-danger" @click.stop="confirm('delete Item?') && deleteItem(item)"
title="delete">
<font-awesome-icon icon="trash"/> <font-awesome-icon icon="trash"/>
</button> </button>
</div> </div>

17
web/src/views/Tickets.vue
View file

@ -6,15 +6,16 @@
:columns="['id', 'name', 'state', 'last_activity', 'assigned_to']" :columns="['id', 'name', 'state', 'last_activity', 'assigned_to']"
:items="tickets" :items="tickets"
:keyName="'id'" :keyName="'id'"
v-slot="{ item }"
> >
<div class="btn-group"> <template #actions="{ item }">
<a class="btn btn-primary" :href="'/ticket/' + item.id" title="view" <div class="btn-group">
@click.prevent="gotoDetail(item)"> <a class="btn btn-primary" :href="'/ticket/' + item.id" title="view"
<font-awesome-icon icon="eye"/> @click.prevent="gotoDetail(item)">
View <font-awesome-icon icon="eye"/>
</a> View
</div> </a>
</div>
</template>
</Table> </Table>
</div> </div>
</div> </div>

23
web/src/views/admin/Events.vue
View file

@ -3,18 +3,19 @@
:columns="['slug', 'name']" :columns="['slug', 'name']"
:items="events" :items="events"
:keyName="'slug'" :keyName="'slug'"
v-slot="{ item }"
> >
<div class="btn-group"> <template #actions="{ item }">
<button class="btn btn-secondary" @click.stop="changeEvent(item)"> <div class="btn-group">
<font-awesome-icon icon="archive"/> <button class="btn btn-secondary" @click.stop="changeEvent(item)">
use <font-awesome-icon icon="archive"/>
</button> use
<button class="btn btn-danger" @click.stop=""> </button>
<font-awesome-icon icon="trash"/> <button class="btn btn-danger" @click.stop="">
delete <font-awesome-icon icon="trash"/>
</button> delete
</div> </button>
</div>
</template>
</Table> </Table>
</template> </template>