PetschStudios/KanbanGit
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 27 Wiki Activity

Added UserAvatar
linter / quality (pull_request) Successful in 1m28s
Details
tests / ci (8.4) (pull_request) Successful in 1m54s
Details

Browse Source
This commit is contained in:
Twyco
2026-06-24 16:34:00 +02:00
parent 0d26113ba7
commit 1f16393dca
5 changed files with 89 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/pages/admin/users/Index.vue
+42 -9
View File
@@ -1,6 +1,13 @@
<script setup lang="ts">
import { Form, Head, Link } from '@inertiajs/vue3';
import { FolderPlus, KeyRound, Pencil, Shield, UserPlus, Users } from 'lucide-vue-next';
import {
FolderPlus,
KeyRound,
Pencil,
Shield,
UserPlus,
Users,
} from 'lucide-vue-next';
import UserManagementController from '@/actions/App/Http/Controllers/Admin/UserManagementController';
import Heading from '@/components/Heading.vue';
import { Badge } from '@/components/ui/badge';
@@ -19,6 +26,7 @@ import {
index as adminUsers,
} from '@/routes/admin/users';
import type { AdminUsersPageProps, BreadcrumbItem } from '@/types';
import UserAvatar from '@/components/ui/avatar/UserAvatar.vue';
const props = defineProps<AdminUsersPageProps>();
@@ -111,8 +119,13 @@ const hasPermission = (actorId: number, permission: string) =>
>
<td class="px-4 py-4">
<div
class="text-foreground font-medium"
class="text-foreground items-medium flex items-center"
>
<UserAvatar
:user="user"
class="mr-2 size-8"
rounded
/>
{{ user.name }}
</div>
</td>
@@ -122,7 +135,9 @@ const hasPermission = (actorId: number, permission: string) =>
<td class="px-4 py-4">
<div class="flex flex-wrap gap-2">
<Badge
v-if="user.must_change_password_on_next_login"
v-if="
user.must_change_password_on_next_login
"
variant="outline"
class="gap-1.5"
>
@@ -170,10 +185,24 @@ const hasPermission = (actorId: number, permission: string) =>
</td>
<td class="px-4 py-4">
<div class="flex justify-end">
<div class="flex flex-wrap justify-end gap-3">
<Button as-child size="sm" variant="outline">
<Link :href="editAdminUser(user.id)">
<Pencil class="size-4" />
<div
class="flex flex-wrap justify-end gap-3"
>
<Button
as-child
size="sm"
variant="outline"
>
<Link
:href="
editAdminUser(
user.id,
)
"
>
<Pencil
class="size-4"
/>
Edit
</Link>
</Button>
@@ -195,7 +224,9 @@ const hasPermission = (actorId: number, permission: string) =>
<input
type="checkbox"
name="permissions[]"
:value="option.value"
:value="
option.value
"
:checked="
hasPermission(
user.id,
@@ -209,7 +240,9 @@ const hasPermission = (actorId: number, permission: string) =>
}}</span>
</label>
<div class="w-full sm:hidden" />
<div
class="w-full sm:hidden"
/>
<Button
type="submit"
resources/js/pages/settings/Profile.vue
+2 -14
View File
@@ -6,7 +6,6 @@ import ProfileController from '@/actions/App/Http/Controllers/Settings/ProfileCo
import DeleteUser from '@/components/DeleteUser.vue';
import Heading from '@/components/Heading.vue';
import InputError from '@/components/InputError.vue';
import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
@@ -14,8 +13,8 @@ import AppLayout from '@/layouts/AppLayout.vue';
import SettingsLayout from '@/layouts/settings/Layout.vue';
import { edit } from '@/routes/profile/index';
import { send } from '@/routes/verification';
import { getInitials } from '@/composables/useInitials';
import type { BreadcrumbItem, SettingsProfilePageProps } from '@/types';
import UserAvatar from '@/components/ui/avatar/UserAvatar.vue';
defineProps<SettingsProfilePageProps>();
@@ -94,18 +93,7 @@ onBeforeUnmount(() => {
<div class="grid gap-3">
<Label for="avatar">Profile picture</Label>
<div class="flex items-center gap-4">
<Avatar class="size-16 overflow-hidden rounded-lg">
<AvatarImage
v-if="displayedAvatar"
:src="displayedAvatar"
:alt="user.name"
/>
<AvatarFallback
class="rounded-lg font-semibold text-black dark:text-white"
>
{{ getInitials(user.name) }}
</AvatarFallback>
</Avatar>
<UserAvatar class="size-16" />
<div class="grid flex-1 gap-2">
<div class="flex flex-col gap-2 sm:flex-row">
<Input