Skip to content

Commit eb5d79b

Browse files
adrumadrum
committed
fix user index
1 parent e16f5ed commit eb5d79b

File tree

1 file changed

+70
-66
lines changed

1 file changed

+70
-66
lines changed

‎ClientApp/src/Pages/Users/Index.vue‎

Lines changed: 70 additions & 66 deletions
Original file line numberDiff line numberDiff line change
@@ -28,70 +28,74 @@
2828
</div>
2929
<div class="overflow-x-auto rounded-md bg-white shadow">
3030
<table class="w-full whitespace-nowrap">
31-
<tr class="text-left font-bold">
32-
<th class="px-6 pb-4 pt-6">Name</th>
33-
<th class="px-6 pb-4 pt-6">Email</th>
34-
<th class="px-6 pb-4 pt-6" colspan="2">Role</th>
35-
</tr>
36-
<tr
37-
v-for="user in users"
38-
:key="user.id"
39-
class="focus-within:bg-gray-100 hover:bg-gray-100"
40-
>
41-
<td class="border-t">
42-
<Link
43-
class="flex items-center px-6 py-4 focus:text-indigo-500"
44-
:href="`/users/${user.id}/edit`"
45-
>
46-
<img
47-
v-if="user.photo"
48-
class="-my-2 mr-2 block h-5 w-5 rounded-full"
49-
:src="user.photo"
50-
/>
51-
{{ user.name }}
52-
<icon
53-
v-if="user.deleted_at"
54-
name="trash"
55-
class="ml-2 h-3 w-3 shrink-0 fill-gray-400"
56-
/>
57-
</Link>
58-
</td>
59-
<td class="border-t">
60-
<Link
61-
class="flex items-center px-6 py-4"
62-
:href="`/users/${user.id}/edit`"
63-
tabindex="-1"
64-
>
65-
{{ user.email }}
66-
</Link>
67-
</td>
68-
<td class="border-t">
69-
<Link
70-
class="flex items-center px-6 py-4"
71-
:href="`/users/${user.id}/edit`"
72-
tabindex="-1"
73-
>
74-
{{ user.owner ? 'Owner' : 'User' }}
75-
</Link>
76-
</td>
77-
<td class="w-px border-t">
78-
<Link
79-
class="flex items-center px-4"
80-
:href="`/users/${user.id}/edit`"
81-
tabindex="-1"
82-
>
83-
<icon
84-
name="cheveron-right"
85-
class="block h-6 w-6 fill-gray-400"
86-
/>
87-
</Link>
88-
</td>
89-
</tr>
90-
<tr v-if="users.length === 0">
91-
<td class="border-t px-6 py-4" colspan="4">
92-
No users found.
93-
</td>
94-
</tr>
31+
<thead>
32+
<tr class="text-left font-bold">
33+
<th class="px-6 pb-4 pt-6">Name</th>
34+
<th class="px-6 pb-4 pt-6">Email</th>
35+
<th class="px-6 pb-4 pt-6" colspan="2">Role</th>
36+
</tr>
37+
</thead>
38+
<tbody>
39+
<tr
40+
v-for="user in props.users.data"
41+
:key="user.id"
42+
class="focus-within:bg-gray-100 hover:bg-gray-100"
43+
>
44+
<td class="border-t">
45+
<Link
46+
class="flex items-center px-6 py-4 focus:text-indigo-500"
47+
:href="`/users/${user.id}/edit`"
48+
>
49+
<img
50+
v-if="user.photo"
51+
class="-my-2 mr-2 block h-5 w-5 rounded-full"
52+
:src="user.photo"
53+
/>
54+
{{ user.name }}
55+
<icon
56+
v-if="user.deleted_at"
57+
name="trash"
58+
class="ml-2 h-3 w-3 shrink-0 fill-gray-400"
59+
/>
60+
</Link>
61+
</td>
62+
<td class="border-t">
63+
<Link
64+
class="flex items-center px-6 py-4"
65+
:href="`/users/${user.id}/edit`"
66+
tabindex="-1"
67+
>
68+
{{ user.email }}
69+
</Link>
70+
</td>
71+
<td class="border-t">
72+
<Link
73+
class="flex items-center px-6 py-4"
74+
:href="`/users/${user.id}/edit`"
75+
tabindex="-1"
76+
>
77+
{{ user.owner ? 'Owner' : 'User' }}
78+
</Link>
79+
</td>
80+
<td class="w-px border-t">
81+
<Link
82+
class="flex items-center px-4"
83+
:href="`/users/${user.id}/edit`"
84+
tabindex="-1"
85+
>
86+
<icon
87+
name="cheveron-right"
88+
class="block h-6 w-6 fill-gray-400"
89+
/>
90+
</Link>
91+
</td>
92+
</tr>
93+
<tr v-if="props.users.length === 0">
94+
<td class="border-t px-6 py-4" colspan="4">
95+
No users found.
96+
</td>
97+
</tr>
98+
</tbody>
9599
</table>
96100
</div>
97101
</div>
@@ -101,7 +105,7 @@
101105
import Icon from '@/Shared/Icon.vue';
102106
import Layout from '@/Shared/Layout.vue';
103107
import SearchFilter from '@/Shared/SearchFilter.vue';
104-
import type { InertiaSharedProps, User, UserFilters } from '@/Types/generated';
108+
import type { InertiaSharedProps, PaginatedData, User, UserFilters, UserListDto } from '@/Types/generated';
105109
import { Head, Link, router } from '@inertiajs/vue3';
106110
import mapValues from 'lodash/mapValues';
107111
import pickBy from 'lodash/pickBy';
@@ -111,7 +115,7 @@ import { reactive, watch } from 'vue';
111115
// Define page props
112116
type Props = InertiaSharedProps<{
113117
filters: UserFilters;
114-
users: User[];
118+
users: PaginatedData<UserListDto>;
115119
}>;
116120
117121
// Important: hand defineProps a **resolved** alias.

0 commit comments

Comments
 (0)