add actions to data-container.js
This commit is contained in:
parent
ba0cb247bc
commit
aa2fb8571b
4 changed files with 10 additions and 5 deletions
|
@ -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>
|
||||||
|
|
|
@ -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,
|
||||||
|
|
|
@ -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'"
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -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']),
|
||||||
|
|
Loading…
Reference in a new issue