mws/mws.frontend.vue
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ref: app UI

Browse Source
This commit is contained in:
namdh
2026-08-26 00:11:45 +07:00
parent 8fe5e44f52
commit 5f52a6c554
16 changed files with 634 additions and 309 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/settings/roles/RolesView.vue
+10 -10
View File
@@ -1,8 +1,8 @@
<template>
<div>
<div class="grid grid-cols-1 gap-4 md:grid-cols-12">
<div class="flex h-full min-h-0 flex-col">
<div class="grid min-h-0 flex-1 grid-cols-1 gap-4 md:grid-cols-12">
<!-- Left: User List -->
<div class="panel flex flex-col p-4 md:col-span-4" style="height: 620px;">
<div class="panel flex min-h-[420px] flex-col p-4 md:col-span-4">
<div class="mb-3">
<IconField>
<InputIcon class="pi pi-search text-xs" />
@@ -21,7 +21,7 @@
<div v-else-if="users.length === 0" class="muted-note p-4 text-center">
No users found
</div>
<div v-else class="flex-1 overflow-y-auto pr-1">
<div v-else class="min-h-0 flex-1 overflow-y-auto pr-1">
<div
v-for="u in users"
:key="u.id"
@@ -49,13 +49,13 @@
</div>
<!-- Right Top & Bottom: Roles (Unassigned / Assigned) -->
<div class="flex flex-col gap-4 md:col-span-8">
<div v-if="!selectedUserId" class="panel flex items-center justify-center p-8 muted-note" style="height: 620px;">
<div class="flex min-h-0 flex-col gap-4 md:col-span-8">
<div v-if="!selectedUserId" class="panel flex min-h-[420px] flex-1 items-center justify-center p-8 muted-note">
Select a user from the left list to manage roles
</div>
<template v-else>
<!-- Top Right: Unassigned Roles -->
<div class="panel flex flex-col p-4" style="height: 300px;">
<div class="panel flex min-h-[240px] flex-1 flex-col p-4" style="flex-basis: 0;">
<div class="eyebrow mb-3 flex items-center gap-2">
<i class="pi pi-plus-circle text-indigo-500 text-sm"></i> Unassigned Roles
</div>
@@ -65,7 +65,7 @@
<div v-else-if="unassignedRoles.length === 0" class="flex flex-1 items-center justify-center muted-note">
All available roles assigned
</div>
<div v-else class="flex-1 overflow-y-auto space-y-2 pr-1">
<div v-else class="min-h-0 flex-1 overflow-y-auto space-y-2 pr-1">
<div
v-for="r in unassignedRoles"
:key="r.id"
@@ -88,7 +88,7 @@
</div>
<!-- Bottom Right: Assigned Roles -->
<div class="panel flex flex-col p-4" style="height: 304px;">
<div class="panel flex min-h-[240px] flex-1 flex-col p-4" style="flex-basis: 0;">
<div class="eyebrow mb-3 flex items-center gap-2">
<i class="pi pi-check-circle text-green-500 text-sm"></i> Assigned Roles
</div>
@@ -98,7 +98,7 @@
<div v-else-if="assignedRoles.length === 0" class="flex flex-1 items-center justify-center muted-note">
No roles assigned yet
</div>
<div v-else class="flex-1 overflow-y-auto space-y-2 pr-1">
<div v-else class="min-h-0 flex-1 overflow-y-auto space-y-2 pr-1">
<div
v-for="r in assignedRoles"
:key="r.id"