migrate pages to shadcn (#628)

* feat: migrate tools page and label generator to shadcn

* chore: lint issues

* feat: also do profile page

* feat: shadcn 404 page

* feat: login page shadcn

* fix: daisyui ironically breaks the z height for the login page

* feat: componentise the language selector and add it to the login page

* feat: use nuxtlink

* feat: card and table made more shadcn

* feat: shadcn statscard

* chore: lint

* feat: shadcn labelchip and locationcard

* feat: shadcn locations page

* refactor: remove unused new item page

* chore: lint

* feat: shadcn item card

* fix: wrapping of location and lint

* feat: ctrl enter in text area in form submits form

* feat: begin shadcn locations page and remove pageqrcode comp in favour of integrating it into labelmaker

* chore: lint + remove unused code

* fix: remove uneeded margin

* feat: shadcn labels page and fix some issues with location

* feat: shadcn scanner

* chore: lint

* feat: begin shadcning item pages

* feat: shadcn maintenance page

* feat: begin shadcn search page

* fix: quick switch blurry text and crashing page when switching + incorrect z height for create menu

* feat: finish shadcn search page

* chore: lint

* feat: shadcn edit item page

* fix: quickmenumodal bug

* feat: shadcn item details page

* feat: remove all non-color related daisyui classes

* fix: type error

* fix: quick menu modal again :(
This commit is contained in:
Tonya
2025-04-20 08:58:03 +01:00
committed by GitHub
parent 400bc3f341
commit cbaf483788
114 changed files with 2818 additions and 2479 deletions

View File

@@ -1,6 +1,13 @@
<script setup lang="ts">
import { useTreeState } from "~~/components/Location/Tree/tree-state";
import MdiCollapseAllOutline from "~icons/mdi/collapse-all-outline";
import MdiExpandAllOutline from "~icons/mdi/expand-all-outline";
import { ButtonGroup, Button } from "@/components/ui/button";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import type { TreeItem } from "~/lib/api/types/data-contracts";
// TODO: eventually move to https://reka-ui.com/docs/components/tree#draggable-sortable-tree
definePageMeta({
middleware: ["auth"],
@@ -58,6 +65,21 @@
treeState.value[key] = false;
}
}
function openItemChildren(items: TreeItem[]) {
for (const item of items) {
if (item.children.length > 0) {
treeState.value[item.id.replace(/-/g, "").substring(0, 8)] = true;
openItemChildren(item.children);
}
}
}
function openAll() {
if (!tree.value) return;
openItemChildren(tree.value);
}
</script>
<template>
@@ -66,11 +88,30 @@
<BaseCard>
<div class="p-4">
<div class="mb-2 flex justify-end">
<div class="btn-group">
<button class="btn tooltip tooltip-top btn-sm" :data-tip="$t('locations.collapse_tree')" @click="closeAll">
<MdiCollapseAllOutline />
</button>
</div>
<TooltipProvider :delay-duration="0">
<ButtonGroup>
<Tooltip>
<TooltipTrigger>
<Button size="icon" variant="outline" data-pos="start" @click="openAll">
<MdiExpandAllOutline />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>{{ $t("locations.expand_tree") }}</p>
</TooltipContent>
</Tooltip>
<Tooltip>
<TooltipTrigger>
<Button size="icon" variant="outline" data-pos="end" @click="closeAll">
<MdiCollapseAllOutline />
</Button>
</TooltipTrigger>
<TooltipContent>
<p>{{ $t("locations.collapse_tree") }}</p>
</TooltipContent>
</Tooltip>
</ButtonGroup>
</TooltipProvider>
</div>
<LocationTreeRoot v-if="tree" :locs="tree" :tree-id="locationTreeId" />
</div>