User Profile Page

LibreHealthIO · Aug 13, 2023 · c8420ae · c8420ae
1 parent 811dd08
commit c8420ae
Show file tree

Hide file tree

Showing 4 changed files with 198 additions and 4 deletions.
diff --git a/app/Http/Controllers/Dashboard/User/UserController.php b/app/Http/Controllers/Dashboard/User/UserController.php
@@ -4,6 +4,7 @@
 
 use App\Http\Controllers\Controller;
 use App\Mail\InvitationMail;
+use App\Models\Invitation;
 use App\Models\Role;
 use App\Models\User;
 use Illuminate\Http\Request;
@@ -54,6 +55,20 @@ public function show($id)
         //
     }
 
+
+    public function profile($userId): Response
+    {
+        /**
+         * Shows the user profile page
+         * @return Response
+         */
+        $user = User::where('id', $userId)->first();
+        $invitation_details = Invitation::where('email', $user->email)->first();
+        $user->invitation_details = $invitation_details;
+
+        return Inertia::render('Users/UserProfile', ['userData' => $user]);
+    }
+
     /**
      * Show the form for editing the specified resource.
      *

diff --git a/resources/app/pages/Users/Invitations.vue b/resources/app/pages/Users/Invitations.vue
@@ -102,8 +102,13 @@ export default {
                 {
                     label: "Name",
                     name: "user.first_name",
-                    transform: ({ data, name }) =>
-                        `${data.user.first_name} ${data.user.last_name}`,
+                    transform: ({ data, name }) => {
+                        const userId = data.user.id;
+                        const fullName = `${data.user.first_name} ${data.user.last_name}`;
+                        return `<a href="${route("dashboard.users.profile", {
+                            id: userId,
+                        })}" class="text-blue-500 hover:underline">${fullName}</a>`;
+                    },
                 },
                 { label: "Email", name: "email", orderable: true },
                 { label: "Facility", name: "facility", orderable: true },

diff --git a/resources/app/pages/Users/UserProfile.vue b/resources/app/pages/Users/UserProfile.vue
@@ -0,0 +1,173 @@
+<template>
+    <div class="min-h-screen bg-gray-100">
+        <div class="max-w-7xl mx-auto px-4 py-8">
+            <div class="flex justify-center">
+                <h1 class="text-3xl font-semibold mb-6">User Profile</h1>
+            </div>
+
+            <div
+                class="bg-white rounded-lg shadow-lg p-8 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"
+            >
+                <!-- General Details -->
+                <div class="bg-gray-200 rounded-lg p-6 text-xl">
+                    <h2 class="text-2xl font-semibold mb-4">General Details</h2>
+                    <p class="font-semibold text-2xl">
+                        {{ userData.suffix ? " " + userData.suffix : "" }}
+                        {{ userData.first_name }} {{ userData.last_name }}
+                    </p>
+                    <p class="mb-2">
+                        <span class="font-semibold">Username:</span> @{{
+                            userData.username
+                        }}
+                    </p>
+                    <p class="mb-2">
+                        <span class="font-semibold">Email:</span>
+                        {{ userData.email }}
+                    </p>
+                </div>
+
+                <!-- ID Details -->
+                <div
+                    class="bg-gray-200 rounded-lg p-6 text-xl col-span-3 md:col-span-2 lg:col-span-2"
+                >
+                    <h2 class="text-2xl font-semibold mb-4">ID Details</h2>
+                    <div
+                        class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 gap-2"
+                    >
+                        <p class="mb-2">
+                            <span class="font-semibold">NPI:</span>
+                            {{ userData.npi }}
+                        </p>
+                        <p class="mb-2">
+                            <span class="font-semibold">Federal Tax ID:</span>
+                            {{ userData.federal_tax_id }}
+                        </p>
+                        <p class="mb-2">
+                            <span class="font-semibold">Federal Drug ID:</span>
+                            {{ userData.federal_drug_id }}
+                        </p>
+                        <p class="mb-2">
+                            <span class="font-semibold">Taxonomy:</span>
+                            {{ userData.taxonomy }}
+                        </p>
+                    </div>
+                </div>
+
+                <!-- Roles and Facility -->
+                <div class="bg-gray-200 rounded-lg p-6 text-xl">
+                    <h2 class="text-2xl font-semibold mb-4">
+                        Roles and Facility
+                    </h2>
+                    <p class="mb-2">
+                        <span class="font-semibold">Invitation Status:</span>
+                        <span
+                            :class="{
+                                'text-green-500 font-semibold':
+                                    userData.invitation_details.status ===
+                                    'accepted',
+                                'text-yellow-500 font-semibold':
+                                    userData.invitation_details.status ===
+                                    'pending',
+                                'text-red-500 font-semibold':
+                                    userData.invitation_details.status ===
+                                    'rejected',
+                            }"
+                        >
+                            {{ userData.invitation_details.status }}
+                        </span>
+                    </p>
+                    <p class="mb-2">
+                        <span
+                            class="font-semibold"
+                            v-if="
+                                userData.invitation_details.status ===
+                                'accepted'
+                            "
+                        >
+                            Accepted at:
+                        </span>
+                        <span
+                            class="text-green-500"
+                            v-if="
+                                userData.invitation_details.status ===
+                                'accepted'
+                            "
+                        >
+                            {{ userData.invitation_details.accepted_at }}
+                        </span>
+                        <span
+                            v-if="
+                                userData.invitation_details.status === 'pending'
+                            "
+                            class="font-semibold"
+                        >
+                            Valid till:
+                        </span>
+                        <span
+                            class="text-yellow-500"
+                            v-if="
+                                userData.invitation_details.status === 'pending'
+                            "
+                        >
+                            {{ userData.invitation_details.valid_till }}
+                        </span>
+                    </p>
+                    <p class="mb-2">
+                        <span class="font-semibold"
+                            >Access Control (Role):</span
+                        >
+                        {{ userData.access_control }}
+                    </p>
+
+                    <p class="mb-2">
+                        <span class="font-semibold">Default Facility:</span>
+                        {{ userData.facility }}
+                    </p>
+                </div>
+
+                <!-- Job Description and Additional Details -->
+                <div
+                    class="bg-gray-200 rounded-lg p-6 text-xl col-span-3 md:col-span-2 lg:col-span-2"
+                >
+                    <h2 class="text-2xl font-semibold mb-4">
+                        Job Description and Additional Details
+                    </h2>
+                    <p class="mb-2">
+                        <span class="font-semibold">Job Description:</span>
+                        {{ userData.info }}
+                    </p>
+                    <p class="mb-2">
+                        <span class="font-semibold">Additional Details:</span>
+                        {{ userData.additional_details }}
+                    </p>
+                    <p class="mb-2">
+                        <span class="font-semibold">Default Warehouse:</span>
+                        {{ userData.warehouse }}
+                    </p>
+                    <p class="mb-2">
+                        <span class="font-semibold">Provider Type:</span>
+                        {{ userData.provider_type }}
+                    </p>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import DashboardLayout from "../../layouts/DashboardLayout";
+
+export default {
+    layout: DashboardLayout,
+    props: {
+        userData: Object, // Pass the user data as a prop
+    },
+    data() {
+        return {};
+    },
+};
+</script>
+
+<style>
+/* Add custom styles here if needed */
+</style>
diff --git a/routes/web.php b/routes/web.php
@@ -137,9 +137,10 @@ function () {
             Route::get('/add-user', [SetupAccount::class, 'index'])->name('users.invite');
             Route::post('/add-user', [InvitationController::class, 'sendInvite'])->name('users.add');
             Route::get('/invitations', [InvitationController::class, 'showInvitations'])->name('user.invitations');
+            Route::get('/users/profile/{userId}', [UserController::class, 'profile'])->name('users.profile');
+
+
 
-            Route::get('users/load/data', [UserController::class, 'getUserData'])
-                ->name('users.load.data');
 
             // ======== Facility related routes ========
             Route::resource('facilities', FacilityController::class)->names([