add actions to data-container.js

This commit is contained in:
j3d1 2019-12-22 18:52:08 +01:00
parent ba0cb247bc
commit aa2fb8571b
4 changed files with 10 additions and 5 deletions

View file

@ -37,11 +37,11 @@
<div class="collapse navbar-collapse" id="navbarSupportedContent"> <div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto"> <ul class="navbar-nav ml-auto">
<li class="nav-item dropdown"> <li class="nav-item dropdown">
<button class="btn nav-link dropdown-toggle" type="button" id="dropdownMenuButton" <button class="btn nav-link dropdown-toggle" type="button" id="dropdownMenuButton2"
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
{{getActiveView}} {{getActiveView}}
</button> </button>
<ul class="dropdown-menu bg-dark" aria-labelledby="dropdownMenuButton"> <ul class="dropdown-menu bg-dark" aria-labelledby="dropdownMenuButton2">
<li class="" v-for="(link, index) in views" v-bind:key="index" :class="{ active: link.path === getActiveView }"> <li class="" v-for="(link, index) in views" v-bind:key="index" :class="{ active: link.path === getActiveView }">
<a class="nav-link text-nowrap" href="#" @click="changeView(link)">{{ link.title }}</a> <a class="nav-link text-nowrap" href="#" @click="changeView(link)">{{ link.title }}</a>
</li> </li>

View file

@ -1,7 +1,7 @@
import * as R from 'ramda'; import * as R from 'ramda';
export default { export default {
props: ['columns', 'items', 'keyName'], props: ['columns', 'items', 'actions', 'keyName'],
data: (self) => ({ data: (self) => ({
sortBy: self.keyName, sortBy: self.keyName,
ascend: true, ascend: true,

View file

@ -4,6 +4,7 @@
<div class="col-xl-8 offset-xl-2"> <div class="col-xl-8 offset-xl-2">
<Table <Table
:columns="['cid', 'name']" :columns="['cid', 'name']"
:actions="['enlarge']"
:items="loadedBoxes" :items="loadedBoxes"
:keyName="'cid'" :keyName="'cid'"
/> />

View file

@ -16,6 +16,7 @@
<div class="col-xl-8 offset-xl-2"> <div class="col-xl-8 offset-xl-2">
<Table <Table
:columns="['uid', 'description', 'box']" :columns="['uid', 'description', 'box']"
:actions="['enlarge', 'delete']"
:items="loadedItems" :items="loadedItems"
:keyName="'uid'" :keyName="'uid'"
@itemActivated="openModalWith($event)" @itemActivated="openModalWith($event)"
@ -25,13 +26,14 @@
<Cards <Cards
v-if="layout === 'cards'" v-if="layout === 'cards'"
:columns="['uid', 'description', 'box']" :columns="['uid', 'description', 'box']"
:actions="['delete']"
:items="loadedItems" :items="loadedItems"
:keyName="'uid'" :keyName="'uid'"
v-slot="{ item }" v-slot="{ item }"
@itemActivated="openModalWith($event)" @itemActivated="openModalWith($event)"
> >
<img <img
:src="`https://c3lf.de/api/1/thumbs/${item.file}`" :src="`${baseUrl}/1/thumbs/${item.file}`"
class="card-img-top img-fluid" class="card-img-top img-fluid"
> >
<div class="card-body"> <div class="card-body">
@ -48,11 +50,13 @@ import Cards from '@/components/Cards';
import Modal from '@/components/Modal'; import Modal from '@/components/Modal';
import EditItem from '@/components/EditItem'; import EditItem from '@/components/EditItem';
import { mapState } from 'vuex'; import { mapState } from 'vuex';
import config from '../config';
export default { export default {
name: 'Items', name: 'Items',
data: () => ({ data: () => ({
selectedItem: null selectedItem: null,
baseUrl: config.service.url,
}), }),
components: { Table, Cards, Modal, EditItem }, components: { Table, Cards, Modal, EditItem },
computed: mapState(['loadedItems', 'layout']), computed: mapState(['loadedItems', 'layout']),