sipo/Teren-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update case index page segment index and show page

Browse Source
This commit is contained in:
Simon Pocrnjič
2025-12-14 20:57:39 +01:00
parent a6ec92ec6b
commit 80948d2944
14 changed files with 1141 additions and 626 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/Layouts/AppPhoneLayout.vue
+26 -86
View File
@@ -16,6 +16,14 @@ import {
faClipboardList,
faCircleCheck,
} from "@fortawesome/free-solid-svg-icons";
import {
ChevronDownIcon,
ClipboardCheckIcon,
ClipboardListIcon,
MenuIcon,
MonitorIcon,
SearchIcon,
} from "lucide-vue-next";
const props = defineProps({
title: String,
@@ -136,7 +144,9 @@ const closeSearch = () => (searchOpen.value = false);
: 'sticky top-0 h-screen overflow-y-auto',
]"
>
<div class="h-16 px-4 flex items-center justify-between border-b border-gray-200 bg-white">
<div
class="h-16 px-4 flex items-center justify-between border-b border-sidebar-border bg-sidebar"
>
<Link
:href="route('phone.index')"
class="flex items-center gap-2 hover:opacity-80 transition-opacity"
@@ -144,7 +154,7 @@ const closeSearch = () => (searchOpen.value = false);
<ApplicationMark />
<span
v-if="showLabels"
class="text-sm font-semibold text-gray-900 transition-opacity"
class="text-sm font-semibold text-sidebar-foreground transition-opacity"
>
Teren
</span>
@@ -160,21 +170,12 @@ const closeSearch = () => (searchOpen.value = false);
'flex items-center gap-3 px-3 py-2.5 text-sm rounded-lg transition-all duration-150',
route().current('phone.index') ||
(route().current('phone.case') && !isCompletedMode)
? 'bg-primary-50 text-primary-700 font-medium shadow-sm'
: 'text-gray-600 hover:bg-gray-50 hover:text-gray-900',
? 'bg-sidebar-primary/15 text-sidebar-primary font-medium shadow-sm'
: 'text-sidebar-foreground/80 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
]"
title="Opravila"
>
<FontAwesomeIcon
:icon="faClipboardList"
:class="[
'w-5 h-5 flex-shrink-0 transition-colors',
route().current('phone.index') ||
(route().current('phone.case') && !isCompletedMode)
? 'text-primary-600'
: 'text-gray-500',
]"
/>
<ClipboardListIcon class="w-5 h-5 shrink-0 transition-colors" />
<span
v-if="showLabels"
class="truncate transition-opacity"
@@ -196,21 +197,12 @@ const closeSearch = () => (searchOpen.value = false);
'flex items-center gap-3 px-3 py-2.5 text-sm rounded-lg transition-all duration-150',
route().current('phone.completed') ||
(route().current('phone.case') && isCompletedMode)
? 'bg-primary-50 text-primary-700 font-medium shadow-sm'
: 'text-gray-600 hover:bg-gray-50 hover:text-gray-900',
? 'bg-sidebar-primary/15 text-sidebar-primary font-medium shadow-sm'
: 'text-sidebar-foreground/80 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
]"
title="Zaključeno danes"
>
<FontAwesomeIcon
:icon="faCircleCheck"
:class="[
'w-5 h-5 flex-shrink-0 transition-colors',
route().current('phone.completed') ||
(route().current('phone.case') && isCompletedMode)
? 'text-primary-600'
: 'text-gray-500',
]"
/>
<ClipboardCheckIcon class="w-5 h-5 shrink-0 transition-colors" />
<span
v-if="showLabels"
class="truncate transition-opacity"
@@ -243,42 +235,11 @@ const closeSearch = () => (searchOpen.value = false);
:title="sidebarCollapsed ? 'Razširi meni' : 'Skrči meni'"
aria-label="Toggle sidebar"
>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-5 h-5"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"
/>
</svg>
<MenuIcon />
</Button>
<!-- Search trigger -->
<Button
variant="outline"
size="default"
@click="openSearch"
class="gap-2"
>
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-4 h-4"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M21 21l-4.35-4.35m0 0A7.5 7.5 0 1010.5 18.5a7.5 7.5 0 006.15-1.85z"
/>
</svg>
<Button variant="outline" size="default" @click="openSearch" class="gap-2">
<SearchIcon />
<span class="hidden sm:inline text-sm font-medium">Globalni iskalnik</span>
<kbd
class="hidden sm:inline ml-2 text-[10px] px-1.5 py-0.5 rounded border border-gray-300 bg-gray-100 text-gray-600 font-medium"
@@ -288,7 +249,7 @@ const closeSearch = () => (searchOpen.value = false);
</div>
<!-- Notifications + User drop menu + Desktop switch button -->
<div class="flex items-center">
<NotificationsBell class="mr-2" />
<NotificationsBell />
<!-- Desktop page quick access button -->
<Button
variant="ghost"
@@ -298,7 +259,7 @@ const closeSearch = () => (searchOpen.value = false);
title="Desktop"
>
<Link :href="route('clientCase')">
<FontAwesomeIcon :icon="faDesktop" class="h-5 w-5" />
<MonitorIcon />
</Link>
</Button>
<div class="ms-3 relative">
@@ -316,27 +277,9 @@ const closeSearch = () => (searchOpen.value = false);
</button>
<span v-else class="inline-flex">
<Button
variant="outline"
size="default"
type="button"
class="gap-2"
>
<Button variant="outline" size="default" type="button" class="gap-2">
{{ $page.props.auth.user.name }}
<svg
class="h-4 w-4"
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M19.5 8.25l-7.5 7.5-7.5-7.5"
/>
</svg>
<ChevronDownIcon />
</Button>
</span>
</template>
@@ -365,10 +308,7 @@ const closeSearch = () => (searchOpen.value = false);
</div>
<!-- Page Heading -->
<header
v-if="$slots.header"
class="bg-white border-b border-gray-200 shadow-sm"
>
<header v-if="$slots.header" class="bg-white border-b border-gray-200 shadow-sm">
<div class="max-w-7xl mx-auto py-4 px-4 sm:px-6 lg:px-8 space-y-2">
<Breadcrumbs
v-if="$page.props.breadcrumbs && $page.props.breadcrumbs.length"