neogenia/neo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add record access strategy

Browse Source
This commit is contained in:
Francisco Gaona
2026-01-05 07:48:22 +01:00
parent 838a010fb2
commit 16907aadf8
97 changed files with 11350 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files

285
frontend/pages/setup/roles/index.vue Normal file
View File

@@ -0,0 +1,285 @@
<template>
<div class="min-h-screen bg-background">
<NuxtLayout name="default">
<main class="container mx-auto px-4 py-8">
<div class="flex items-center justify-between">
<div>
<h1 class="text-3xl font-bold">Roles</h1>
<p class="text-muted-foreground">Manage roles and permissions</p>
</div>
<Button @click="showCreateDialog = true">
<Plus class="mr-2 h-4 w-4" />
New Role
</Button>
</div>
<div class="border rounded-lg">
<Table>
<TableHeader>
<TableRow>
<TableHead>Name</TableHead>
<TableHead>Description</TableHead>
<TableHead>Guard</TableHead>
<TableHead>Users</TableHead>
<TableHead>Created</TableHead>
<TableHead class="text-right">Actions</TableHead>
</TableRow>
</TableHeader>
<TableBody>
<TableRow v-if="loading">
<TableCell :colspan="6" class="text-center py-8">
<div class="flex items-center justify-center">
<div class="animate-spin rounded-full h-8 w-8 border-b-2 border-primary"></div>
</div>
</TableCell>
</TableRow>
<TableRow v-else-if="roles.length === 0">
<TableCell :colspan="6" class="text-center py-8 text-muted-foreground">
No roles found. Create your first role to get started.
</TableCell>
</TableRow>
<TableRow v-else v-for="role in roles" :key="role.id" class="cursor-pointer hover:bg-muted/50" @click="navigateTo(`/setup/roles/${role.id}`)">
<TableCell class="font-medium">{{ role.name }}</TableCell>
<TableCell>{{ role.description || 'No description' }}</TableCell>
<TableCell>
<Badge variant="outline">{{ role.guardName || 'tenant' }}</Badge>
</TableCell>
<TableCell>
{{ role.userCount || 0 }} users
</TableCell>
<TableCell>{{ formatDate(role.createdAt) }}</TableCell>
<TableCell class="text-right" @click.stop>
<div class="flex items-center justify-end gap-1">
<Button variant="ghost" size="icon" @click="navigateTo(`/setup/roles/${role.id}`)">
<Eye class="h-4 w-4" />
</Button>
<Button variant="ghost" size="icon" @click="openEditDialog(role)">
<Edit class="h-4 w-4" />
</Button>
<Button variant="ghost" size="icon" @click="openDeleteDialog(role)">
<Trash2 class="h-4 w-4" />
</Button>
</div>
</TableCell>
</TableRow>
</TableBody>
</Table>
</div>
<!-- Create Role Dialog -->
<Dialog v-model:open="showCreateDialog">
<DialogContent>
<DialogHeader>
<DialogTitle>Create New Role</DialogTitle>
<DialogDescription>
Add a new role to the system
</DialogDescription>
</DialogHeader>
<div class="space-y-4">
<div class="space-y-2">
<Label for="name">Name</Label>
<Input id="name" v-model="newRole.name" placeholder="Sales Manager" />
</div>
<div class="space-y-2">
<Label for="description">Description (Optional)</Label>
<Input id="description" v-model="newRole.description" placeholder="Manages sales team and deals" />
</div>
<div class="space-y-2">
<Label for="guardName">Guard Name</Label>
<Select v-model="newRole.guardName" @update:model-value="(value) => newRole.guardName = value">
<SelectTrigger>
<SelectValue placeholder="Select guard" />
</SelectTrigger>
<SelectContent>
<SelectItem value="tenant">Tenant</SelectItem>
<SelectItem value="central">Central</SelectItem>
</SelectContent>
</Select>
</div>
</div>
<DialogFooter>
<Button variant="outline" @click="showCreateDialog = false">Cancel</Button>
<Button @click="createRole" :disabled="!newRole.name">
Create Role
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
<!-- Edit Role Dialog -->
<Dialog v-model:open="showEditDialog">
<DialogContent>
<DialogHeader>
<DialogTitle>Edit Role</DialogTitle>
<DialogDescription>
Update role information
</DialogDescription>
</DialogHeader>
<div class="space-y-4">
<div class="space-y-2">
<Label for="edit-name">Name</Label>
<Input id="edit-name" v-model="editRole.name" placeholder="Role name" />
</div>
<div class="space-y-2">
<Label for="edit-description">Description</Label>
<Input id="edit-description" v-model="editRole.description" placeholder="Role description" />
</div>
<div class="space-y-2">
<Label for="edit-guardName">Guard Name</Label>
<Select v-model="editRole.guardName" @update:model-value="(value) => editRole.guardName = value">
<SelectTrigger>
<SelectValue placeholder="Select guard" />
</SelectTrigger>
<SelectContent>
<SelectItem value="tenant">Tenant</SelectItem>
<SelectItem value="central">Central</SelectItem>
</SelectContent>
</Select>
</div>
</div>
<DialogFooter>
<Button variant="outline" @click="showEditDialog = false">Cancel</Button>
<Button @click="updateRole" :disabled="!editRole.name">
Update Role
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
<!-- Delete Confirmation Dialog -->
<Dialog v-model:open="showDeleteDialog">
<DialogContent>
<DialogHeader>
<DialogTitle>Delete Role</DialogTitle>
<DialogDescription>
Are you sure you want to delete this role? This action cannot be undone.
</DialogDescription>
</DialogHeader>
<DialogFooter>
<Button variant="outline" @click="showDeleteDialog = false">Cancel</Button>
<Button variant="destructive" @click="deleteRole">
Delete Role
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
</main>
</NuxtLayout>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { Button } from '~/components/ui/button';
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '~/components/ui/table';
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '~/components/ui/dialog';
import { Input } from '~/components/ui/input';
import { Label } from '~/components/ui/label';
import { Badge } from '~/components/ui/badge';
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '~/components/ui/select';
import { Plus, Eye, Edit, Trash2 } from 'lucide-vue-next';
definePageMeta({
layout: 'default',
});
const { api } = useApi();
const { toast } = useToast();
const loading = ref(true);
const roles = ref<any[]>([]);
const showCreateDialog = ref(false);
const showEditDialog = ref(false);
const showDeleteDialog = ref(false);
const newRole = ref({
name: '',
description: '',
guardName: 'tenant',
});
const editRole = ref({
id: '',
name: '',
description: '',
guardName: 'tenant',
});
const roleToDelete = ref<any>(null);
const loadRoles = async () => {
try {
loading.value = true;
const response = await api.get('/setup/roles');
roles.value = response || [];
} catch (error: any) {
console.error('Failed to load roles:', error);
toast.error('Failed to load roles');
} finally {
loading.value = false;
}
};
const createRole = async () => {
try {
await api.post('/setup/roles', newRole.value);
toast.success('Role created successfully');
showCreateDialog.value = false;
newRole.value = { name: '', description: '', guardName: 'tenant' };
await loadRoles();
} catch (error: any) {
console.error('Failed to create role:', error);
toast.error(error.message || 'Failed to create role');
}
};
const openEditDialog = (role: any) => {
editRole.value = {
id: role.id,
name: role.name,
description: role.description || '',
guardName: role.guardName || 'tenant',
};
showEditDialog.value = true;
};
const updateRole = async () => {
try {
await api.patch(`/setup/roles/${editRole.value.id}`, {
name: editRole.value.name,
description: editRole.value.description,
guardName: editRole.value.guardName,
});
toast.success('Role updated successfully');
showEditDialog.value = false;
await loadRoles();
} catch (error: any) {
console.error('Failed to update role:', error);
toast.error(error.message || 'Failed to update role');
}
};
const openDeleteDialog = (role: any) => {
roleToDelete.value = role;
showDeleteDialog.value = true;
};
const deleteRole = async () => {
try {
await api.delete(`/setup/roles/${roleToDelete.value.id}`);
toast.success('Role deleted successfully');
showDeleteDialog.value = false;
roleToDelete.value = null;
await loadRoles();
} catch (error: any) {
console.error('Failed to delete role:', error);
toast.error(error.message || 'Failed to delete role');
}
};
const formatDate = (date: string) => {
if (!date) return 'N/A';
return new Date(date).toLocaleDateString();
};
onMounted(() => {
loadRoles();
});
</script>