Add toggle
This commit is contained in:
parent
668cf9d292
commit
87377dab06
|
@ -47,8 +47,8 @@
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<div class="flex space-x-2">
|
<div class="flex space-x-2">
|
||||||
<a v-if="!isOpen(child.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="open(child)"><ui-sprite src="plus"></ui-sprite></a>
|
<a v-if="!isOpen(child.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="toggle(child)"><ui-sprite src="plus"></ui-sprite></a>
|
||||||
<a v-if="isOpen(child.id)" v-tooltip="`Schließen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="close(child)"
|
<a v-if="isOpen(child.id)" v-tooltip="`Schließen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="toggle(child)"
|
||||||
><ui-sprite src="close"></ui-sprite
|
><ui-sprite src="close"></ui-sprite
|
||||||
></a>
|
></a>
|
||||||
<span v-text="child.name"></span>
|
<span v-text="child.name"></span>
|
||||||
|
@ -63,10 +63,15 @@
|
||||||
<template v-for="subchild in childrenOf(child.id)" :key="subchild.id">
|
<template v-for="subchild in childrenOf(child.id)" :key="subchild.id">
|
||||||
<tr>
|
<tr>
|
||||||
<div class="pl-12 flex space-x-2">
|
<div class="pl-12 flex space-x-2">
|
||||||
<a v-if="subchild.children_count !== 0 && !isOpen(subchild.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="open(subchild)"
|
<a v-if="subchild.children_count !== 0 && !isOpen(subchild.id)" v-tooltip="`Öffnen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="toggle(subchild)"
|
||||||
><ui-sprite src="plus"></ui-sprite
|
><ui-sprite src="plus"></ui-sprite
|
||||||
></a>
|
></a>
|
||||||
<a v-if="subchild.children_count !== 0 && isOpen(subchild.id)" v-tooltip="`Schließen`" href="#" class="inline-flex btn btn-info btn-sm" @click.prevent="close(subchild)"
|
<a
|
||||||
|
v-if="subchild.children_count !== 0 && isOpen(subchild.id)"
|
||||||
|
v-tooltip="`Schließen`"
|
||||||
|
href="#"
|
||||||
|
class="inline-flex btn btn-info btn-sm"
|
||||||
|
@click.prevent="toggle(subchild)"
|
||||||
><ui-sprite src="close"></ui-sprite
|
><ui-sprite src="close"></ui-sprite
|
||||||
></a>
|
></a>
|
||||||
<span v-text="subchild.name"></span>
|
<span v-text="subchild.name"></span>
|
||||||
|
@ -87,7 +92,7 @@
|
||||||
v-tooltip="`Öffnen`"
|
v-tooltip="`Öffnen`"
|
||||||
href="#"
|
href="#"
|
||||||
class="inline-flex btn btn-info btn-sm"
|
class="inline-flex btn btn-info btn-sm"
|
||||||
@click.prevent="open(subsubchild)"
|
@click.prevent="toggle(subsubchild)"
|
||||||
><ui-sprite src="plus"></ui-sprite
|
><ui-sprite src="plus"></ui-sprite
|
||||||
></a>
|
></a>
|
||||||
<a
|
<a
|
||||||
|
@ -95,7 +100,7 @@
|
||||||
v-tooltip="`Schließen`"
|
v-tooltip="`Schließen`"
|
||||||
href="#"
|
href="#"
|
||||||
class="inline-flex btn btn-info btn-sm"
|
class="inline-flex btn btn-info btn-sm"
|
||||||
@click.prevent="close(subsubchild)"
|
@click.prevent="toggle(subsubchild)"
|
||||||
><ui-sprite src="close"></ui-sprite
|
><ui-sprite src="close"></ui-sprite
|
||||||
></a>
|
></a>
|
||||||
<span v-text="subsubchild.name"></span>
|
<span v-text="subsubchild.name"></span>
|
||||||
|
@ -128,10 +133,12 @@ const children = reactive({
|
||||||
|
|
||||||
var editing = ref(null);
|
var editing = ref(null);
|
||||||
|
|
||||||
async function open(parent) {
|
async function toggle(parent) {
|
||||||
const result = (await axios.get(parent.links.children)).data;
|
if (isOpen(parent.id)) {
|
||||||
|
delete children[parent.id];
|
||||||
children[parent.id] = result.data;
|
} else {
|
||||||
|
children[parent.id] = (await axios.get(parent.links.children)).data.data;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function edit(parent) {
|
async function edit(parent) {
|
||||||
|
@ -141,10 +148,6 @@ async function edit(parent) {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function close(parent) {
|
|
||||||
delete children[parent.id];
|
|
||||||
}
|
|
||||||
|
|
||||||
function isOpen(child) {
|
function isOpen(child) {
|
||||||
return child in children;
|
return child in children;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue