fix(04): tree view

This commit is contained in:
puriphatt 2024-09-26 11:51:59 +07:00
parent 3c64285ce4
commit 927841eda5
4 changed files with 120 additions and 15 deletions

View file

@ -6,6 +6,9 @@ type Node = {
[key: string]: any;
opened?: boolean;
selected?: boolean;
bg?: string;
fg?: string;
icon?: string;
children?: Node[];
};
@ -86,7 +89,7 @@ function toggleExpand(node: Node) {
<div
v-if="level !== maxLevel"
class="q-mr-md"
style="color: var(--stone-4)"
:style="`color: ${node.children?.length === 0 || !node.children ? 'transparent' : 'var(--stone-4)'}`"
>
<q-icon
name="mdi-chevron-down-circle"
@ -109,14 +112,14 @@ function toggleExpand(node: Node) {
<div
class="item__icon flex items-center justify-center"
:style="`background: ${dec?.bg}; color: ${dec?.fg}; height: ${iconSize}; width: ${iconSize}`"
:style="`background: ${node.bg || dec?.bg}; color: ${node.fg || dec?.fg}; height: ${iconSize}; width: ${iconSize}`"
>
<div
:style="`height: calc(${iconSize} - 40%); width: calc(${iconSize} - 40%)`"
>
<Icon
v-if="dec && dec.icon"
:icon="dec.icon"
v-if="(node.icon && dec && dec.icon) || (dec && dec.icon)"
:icon="node.icon || dec.icon"
class="full-width full-height"
/>
</div>