first commit

2026-10-09 08:21:06 +02:00
parent db7456df87
commit d259c62304
3761 changed files with 896046 additions and 0 deletions
@@ -0,0 +1,100 @@
+<script setup lang="ts">
+import { Link } from '@inertiajs/vue3';
+import Button from '@/components/ui/Button.vue';
+import Tooltip from '@/components/ui/Tooltip.vue';
+import { useConfirmDelete } from '@/composables/useConfirmDelete';
+import { useTranslations } from '@/composables/useVanguard';
+import AppLayout from '@/layouts/AppLayout.vue';
+
+interface Role {
+    id: number;
+    name: string;
+    display_name: string | null;
+    users_count: number;
+    removable: boolean;
+    editUrl: string;
+    deleteUrl: string;
+}
+
+defineProps<{ roles: Role[] }>();
+
+const { __ } = useTranslations();
+const { confirmDelete } = useConfirmDelete();
+
+function remove(role: Role) {
+    confirmDelete({
+        url: role.deleteUrl,
+        message: __('Are you sure that you want to delete this role?'),
+    });
+}
+</script>
+
+<template>
+    <AppLayout :title="__('Roles')" :heading="__('Roles')" :breadcrumbs="[{ label: __('Roles') }]">
+        <div class="rounded-lg border border-slate-200 bg-white p-6 shadow-sm">
+            <div class="mb-4 flex justify-end border-b border-slate-100 pb-4">
+                <Link :href="route('roles.create')">
+                    <Button :label="__('Add Role')" icon="fas fa-plus" rounded />
+                </Link>
+            </div>
+
+            <div class="overflow-x-auto">
+                <table class="w-full min-w-2xl text-left">
+                    <thead>
+                        <tr class="border-b border-slate-100">
+                            <th class="px-4 py-3 font-medium">{{ __('Name') }}</th>
+                            <th class="px-4 py-3 font-medium">{{ __('Display Name') }}</th>
+                            <th class="px-4 py-3 font-medium">
+                                {{ __('# of users with this role') }}
+                            </th>
+                            <th class="w-40 px-4 py-3 text-center font-medium">{{ __('Action') }}</th>
+                        </tr>
+                    </thead>
+
+                    <tbody>
+                        <tr v-if="!roles.length">
+                            <td colspan="4" class="px-4 py-3">
+                                <em class="text-slate-500">{{ __('No records found.') }}</em>
+                            </td>
+                        </tr>
+
+                        <tr
+                            v-for="role in roles"
+                            :key="role.id"
+                            class="odd:bg-body border-b border-slate-50"
+                        >
+                            <td class="px-4 py-3">{{ role.name }}</td>
+                            <td class="px-4 py-3">{{ role.display_name }}</td>
+                            <td class="px-4 py-3">{{ role.users_count }}</td>
+
+                            <td class="px-4 py-3 text-center">
+                                <Tooltip :text="__('Edit Role')">
+                                    <Link :href="role.editUrl">
+                                        <Button
+                                            icon="fas fa-edit"
+                                            text
+                                            rounded
+                                            severity="secondary"
+                                            :aria-label="__('Edit Role')"
+                                        />
+                                    </Link>
+                                </Tooltip>
+
+                                <Tooltip v-if="role.removable" :text="__('Delete Role')">
+                                    <Button
+                                        icon="fas fa-trash"
+                                        text
+                                        rounded
+                                        severity="secondary"
+                                        :aria-label="__('Delete Role')"
+                                        @click="remove(role)"
+                                    />
+                                </Tooltip>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </AppLayout>
+</template>