Add admin user edit flow

This commit is contained in:
2026-05-22 13:07:20 +00:00
parent d13e919310
commit a810f54153
8 changed files with 362 additions and 43 deletions
+56 -43
View File
@@ -1,6 +1,6 @@
<script setup lang="ts">
import { Form, Head, Link } from '@inertiajs/vue3';
import { FolderPlus, KeyRound, 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';
@@ -13,7 +13,11 @@ import {
CardTitle,
} from '@/components/ui/card';
import AppLayout from '@/layouts/AppLayout.vue';
import { create as createAdminUser, index as adminUsers } from '@/routes/admin/users';
import {
create as createAdminUser,
edit as editAdminUser,
index as adminUsers,
} from '@/routes/admin/users';
import type { AdminUsersPageProps, BreadcrumbItem } from '@/types';
const props = defineProps<AdminUsersPageProps>();
@@ -166,48 +170,57 @@ const hasPermission = (actorId: number, permission: string) =>
</td>
<td class="px-4 py-4">
<div class="flex justify-end">
<Form
v-bind="
UserManagementController.update.form(
user.id,
)
"
class="flex flex-wrap justify-end gap-3"
v-slot="{ processing }"
>
<label
v-for="option in permissionOptions"
:key="`${user.id}-${option.value}`"
class="border-border inline-flex items-center gap-2 rounded-lg border px-3 py-2 text-sm"
>
<input
type="checkbox"
name="permissions[]"
:value="option.value"
:checked="
hasPermission(
user.id,
option.value,
)
"
class="border-input text-primary focus:ring-ring size-4 rounded"
/>
<span>{{
option.label
}}</span>
</label>
<div class="w-full sm:hidden" />
<Button
type="submit"
size="sm"
variant="outline"
:disabled="processing"
>
Save
<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>
</Form>
<Form
v-bind="
UserManagementController.update.form(
user.id,
)
"
class="flex flex-wrap justify-end gap-3"
v-slot="{ processing }"
>
<label
v-for="option in permissionOptions"
:key="`${user.id}-${option.value}`"
class="border-border inline-flex items-center gap-2 rounded-lg border px-3 py-2 text-sm"
>
<input
type="checkbox"
name="permissions[]"
:value="option.value"
:checked="
hasPermission(
user.id,
option.value,
)
"
class="border-input text-primary focus:ring-ring size-4 rounded"
/>
<span>{{
option.label
}}</span>
</label>
<div class="w-full sm:hidden" />
<Button
type="submit"
size="sm"
variant="outline"
:disabled="processing"
>
Save
</Button>
</Form>
</div>
</div>
</td>
</tr>