@goweekdays/layer-common 1.3.1 → 1.3.2

package/components/MemberMain.vue

@@ -59,7 +59,7 @@
           :items="items"
           item-value="_id"
           items-per-page="20"
-          fixed-header
+          hide-default-header
           hide-default-footer
           style="max-height: calc(100vh - (126px))"
           :loading="loading"
@@ -80,6 +80,66 @@
         v-model:message="message"
       />
     </v-dialog>
+
+    <v-dialog v-model="dialogView" width="450" persistent>
+      <MemberForm
+        title="View member details"
+        v-model="member"
+        mode="view"
+        @close="dialogView = false"
+        @assign="handleOpenAssignRole()"
+        @suspend="handleOpenSuspension()"
+        @activate="handleOpenActivation()"
+        @delete="handleOpenDelete()"
+      />
+    </v-dialog>
+
+    <v-dialog v-model="dialogAssignRole" width="450" persistent>
+      <MemberForm
+        title="Assign Role"
+        v-model="member"
+        mode="assign-role"
+        @cancel="dialogAssignRole = false"
+        @submit="submitAssignRole()"
+        :disabled="disabledAssignRole"
+      />
+    </v-dialog>
+
+    <v-dialog v-model="dialogSuspend" width="450" persistent>
+      <ConfirmationPrompt
+        title="Suspend Member"
+        action="Suspend Member"
+        content="Are you sure you want to suspend this member?"
+        @cancel="handleCancelSuspension()"
+        @confirm="submitStatus('suspended')"
+        v-model:message="message"
+        :disabled="disabledStatusChange"
+      />
+    </v-dialog>
+
+    <v-dialog v-model="dialogActive" width="450" persistent>
+      <ConfirmationPrompt
+        title="Unsuspend Member"
+        action="Unsuspend Member"
+        content="Are you sure you want to unsuspend this member?"
+        @cancel="handleCancelSuspension()"
+        @confirm="submitStatus('active')"
+        v-model:message="message"
+        :disabled="disabledStatusChange"
+      />
+    </v-dialog>
+
+    <v-dialog v-model="dialogDelete" width="450" persistent>
+      <ConfirmationPrompt
+        title="Remove Member"
+        action="Remove Member"
+        content="Are you sure you want to remove this member?"
+        @cancel="handleCancelDelete()"
+        @confirm="submitDelete()"
+        v-model:message="message"
+        :disabled="disabledDelete"
+      />
+    </v-dialog>
   </v-row>
 </template>
 
@@ -146,15 +206,6 @@ const props = defineProps({
 
         value: "roleName",
       },
-      {
-        title: "Organization",
-
-        value: "orgName",
-      },
-      {
-        title: "Action",
-        value: "action-table",
-      },
     ],
   },
 });
@@ -168,8 +219,9 @@ const {
   invitation,
   member,
   getAll: _getAll,
-  updateMemberStatus: _updateMemberStatus,
-  updateMemberRole: _updateMemberRole,
+  updateStatusById: _updateStatusById,
+  updateRoleById: _updateRoleById,
+  deleteById: _deleteById,
 } = useMember();
 
 const { headerSearch } = useLocal();
@@ -187,7 +239,7 @@ const {
       org: props.orgId,
       search: headerSearch.value,
       page: page.value,
-      type: props.type,
+      app: props.type,
     }),
   {
     watch: [headerSearch, page],
@@ -255,4 +307,100 @@ async function submitInvite() {
 function handleRowClick(_: any, data: any) {
   setMember({ data: data.item, mode: "view" });
 }
+
+const dialogAssignRole = ref(false);
+
+const disabledAssignRole = ref(false);
+
+function handleOpenAssignRole() {
+  dialogView.value = false;
+  dialogAssignRole.value = true;
+}
+
+async function submitAssignRole() {
+  disabledAssignRole.value = true;
+  try {
+    await _updateRoleById(member.value._id ?? "", member.value.role);
+    await getAll();
+    dialogAssignRole.value = false;
+    setMember({ dialog: false });
+  } catch (error: any) {
+    message.value = error.response._data.message || "An error occurred.";
+  } finally {
+    disabledAssignRole.value = false;
+  }
+}
+
+const dialogSuspend = ref(false);
+
+function handleOpenSuspension() {
+  dialogView.value = false;
+  dialogSuspend.value = true;
+}
+
+function handleCancelSuspension() {
+  dialogSuspend.value = false;
+  setMember({ dialog: false });
+}
+
+const dialogActive = ref(false);
+
+function handleOpenActivation() {
+  dialogView.value = false;
+  dialogActive.value = true;
+}
+
+function handleCancelActivation() {
+  dialogActive.value = false;
+  setMember({ dialog: false });
+}
+
+const disabledStatusChange = ref(false);
+
+async function submitStatus(status = "") {
+  disabledStatusChange.value = true;
+  try {
+    await _updateStatusById(member.value._id ?? "", status);
+    await getAll();
+    if (status === "suspended") {
+      dialogSuspend.value = false;
+    }
+    if (status === "active") {
+      dialogActive.value = false;
+    }
+    setMember({ dialog: false });
+  } catch (error: any) {
+    message.value = error.response._data.message || "An error occurred.";
+  } finally {
+    disabledStatusChange.value = false;
+  }
+}
+
+const dialogDelete = ref(false);
+
+function handleOpenDelete() {
+  dialogView.value = false;
+  dialogDelete.value = true;
+}
+
+function handleCancelDelete() {
+  dialogDelete.value = false;
+  setMember({ dialog: false });
+}
+
+const disabledDelete = ref(false);
+
+async function submitDelete() {
+  disabledDelete.value = true;
+  try {
+    await _deleteById(member.value._id ?? "");
+    await getAll();
+    dialogDelete.value = false;
+    setMember({ dialog: false });
+  } catch (error: any) {
+    message.value = error.response._data.message || "An error occurred.";
+  } finally {
+    disabledDelete.value = false;
+  }
+}
 </script>

package/components/RoleForm.vue

@@ -75,7 +75,7 @@
               />
               <v-col cols="12">
                 <v-select
-                  v-model="role.type"
+                  v-model="role.app"
                   :items="apps"
                   item-title="name"
                   item-value="code"

package/components/RolePermissionMain.vue

@@ -68,6 +68,7 @@
     <v-dialog v-model="dialogAdd" width="500" persistent>
       <RoleForm
         v-model="role"
+        v-model:message="message"
         :app="props.app"
         @cancel="setRole({ mode: 'add' })"
         @submit="submitAdd()"
@@ -77,6 +78,7 @@
     <v-dialog v-model="dialogPreview" width="500" persistent>
       <RoleForm
         title="Role Details"
+        :app="props.app"
         v-model="role"
         @close="setRole({ mode: 'view' })"
         @edit="handOpenEdit()"
@@ -115,15 +117,10 @@ const props = defineProps({
     type: String,
     default: "",
   },
-  orgId: {
+  org: {
     type: String,
     default: "",
   },
-  permissions: {
-    type: Object,
-    required: true,
-    default: () => ({}),
-  },
   types: {
     type: Array as PropType<Array<{ title: string; value: string }>>,
     default: () => [],
@@ -165,11 +162,6 @@ const props = defineProps({
   },
 });
 
-const type = defineModel<string>("type", {
-  type: String,
-  default: "",
-});
-
 const { headerSearch } = useLocal();
 
 const {
@@ -197,7 +189,7 @@ function setRole({
     JSON.parse(
       JSON.stringify({
         ...data,
-        type: props.app,
+        app: props.app,
       })
     )
   );
@@ -233,8 +225,8 @@ const {
     _getRoles({
       page: page.value,
       search: headerSearch.value,
-      type: type.value,
-      org: props.orgId,
+      app: props.app,
+      org: props.org,
     }),
   {
     watch: [page, headerSearch],
@@ -259,13 +251,16 @@ const dialogAdd = ref(false);
 
 const dialogPreview = ref(false);
 
+const { loggedInUser } = useLocalAuth();
+
 async function submitAdd() {
   try {
     await addRole({
       name: role.value.name,
       permissions: role.value.permissions,
-      type: role.value.type,
-      org: props.orgId,
+      app: role.value.app,
+      org: props.org,
+      createdBy: loggedInUser(),
     });
     setRole({ mode: "add" });
     getRoles();

package/composables/useLocalAuth.ts

@@ -81,6 +81,10 @@ export default function useLocalAuth() {
     });
   }
 
+  function loggedInUser() {
+    return useCookie("user", cookieConfig).value ?? "";
+  }
+
   return {
     currentUser,
     membership,
@@ -92,5 +96,6 @@ export default function useLocalAuth() {
     forgotPassword,
     resetPassword,
     verify,
+    loggedInUser,
   };
 }

package/composables/useMember.ts

@@ -8,6 +8,7 @@ export default function useMember() {
   });
 
   const invitation = ref<TMemberInvitation>({
+    _id: "",
     email: "",
     app: "",
     org: "",
@@ -26,9 +27,9 @@ export default function useMember() {
   }
 
   function getByApp({ app = "", user = "", org = "" } = {}) {
-    return $fetch<TMember>(`/api/members/app/${app}`, {
+    return $fetch<TMember>(`/api/members/app/${app}/user/${user}`, {
       method: "GET",
-      query: { user, org },
+      query: { org },
     });
   }
 
@@ -38,12 +39,12 @@ export default function useMember() {
     limit = 10,
     user = "",
     org = "",
-    type = "",
+    app = "",
     status = "active",
   } = {}) {
-    return $fetch<Record<string, any>>("/api/members", {
+    return $fetch<Record<string, any>>(`/api/members/app/${app}`, {
       method: "GET",
-      query: { page, limit, search, user, org, type, status },
+      query: { page, limit, search, user, org, status },
     });
   }
   function createUserByVerification(
@@ -70,19 +71,26 @@ export default function useMember() {
     );
   }
 
-  function updateMemberRole(
-    id: string,
-    role: string,
-    type: string,
-    org: string
-  ) {
-    return $fetch<Record<string, any>>(
-      `/api/members/id/${id}/role/${role}/type/${type}/org/${org}`,
-      {
-        method: "PUT",
-      }
-    );
+  function updateRoleById(id: string, role: string) {
+    return $fetch<Record<string, any>>(`/api/members/role/id/${id}`, {
+      method: "PATCH",
+      body: { role },
+    });
   }
+
+  function updateStatusById(id: string, status: string) {
+    return $fetch<Record<string, any>>(`/api/members/status/id/${id}`, {
+      method: "PATCH",
+      body: { status },
+    });
+  }
+
+  function deleteById(id: string) {
+    return $fetch<Record<string, any>>(`/api/members/id/${id}`, {
+      method: "DELETE",
+    });
+  }
+
   return {
     member,
     invitation,
@@ -93,6 +101,8 @@ export default function useMember() {
     getByUserType,
     getByApp,
     updateMemberStatus,
-    updateMemberRole,
+    updateRoleById,
+    updateStatusById,
+    deleteById,
   };
 }

package/composables/useRole.ts

@@ -1,5 +1,7 @@
 export default function useRole() {
-  function add(value: Pick<TRole, "name" | "permissions" | "type" | "org">) {
+  function add(
+    value: Pick<TRole, "name" | "permissions" | "app" | "org" | "createdBy">
+  ) {
     return $fetch("/api/roles", {
       method: "POST",
       body: value,
@@ -56,7 +58,7 @@ export default function useRole() {
     name: "",
     org: "",
     permissions: [],
-    type: "",
+    app: "",
     description: "",
   });
 

package/composables/useVerification.ts

@@ -32,9 +32,16 @@ export default function useUser() {
     });
   }
 
+  function cancelInvite(id: string) {
+    return $fetch<Record<string, any>>(`/api/verifications/invite/id/${id}`, {
+      method: "DELETE",
+    });
+  }
+
   return {
     getVerifications,
     inviteMember,
     signUp,
+    cancelInvite,
   };
 }

package/nuxt.config.ts

@@ -45,6 +45,36 @@ export default defineNuxtConfig({
     },
   ],
 
+  routeRules: {
+    "/api/apps/**": { proxy: `${process.env.API_CORE}/api/apps/**` },
+    "/api/auth/**": { proxy: `${process.env.API_CORE}/api/auth/**` },
+    "/api/users/**": { proxy: `${process.env.API_CORE}/api/users/**` },
+    "/api/apps/**": { proxy: `${process.env.API_CORE}/api/apps/**` },
+    "/api/permissions/**": {
+      proxy: `${process.env.API_CORE}/api/permissions/**`,
+    },
+    "/api/organizations/**": {
+      proxy: `${process.env.API_CORE}/api/organizations/**`,
+    },
+    "/api/members/**": { proxy: `${process.env.API_CORE}/api/members/**` },
+    "/api/teams/**": { proxy: `${process.env.API_CORE}/api/teams/**` },
+    "/api/entities/**": { proxy: `${process.env.API_CORE}/api/entities/**` },
+    "/api/workflows/**": { proxy: `${process.env.API_CORE}/api/workflows/**` },
+    "/api/roles/**": { proxy: `${process.env.API_CORE}/api/roles/**` },
+    "/api/promo-codes/**": {
+      proxy: `${process.env.API_CORE}/api/promo-codes/**`,
+    },
+    "/api/verifications/**": {
+      proxy: `${process.env.API_CORE}/api/verifications/**`,
+    },
+    "/api/files/**": {
+      proxy: `${process.env.API_CORE}/api/files/**`,
+    },
+    "/api/public/**": {
+      proxy: `${process.env.S3_BUCKET_ENDPOINT}/**`,
+    },
+  },
+
   vite: {
     vue: {
       template: {

package/package.json

@@ -2,7 +2,7 @@
   "name": "@goweekdays/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "main": "./nuxt.config.ts",
   "publishConfig": {
     "access": "public"

package/pages/forgot-password.vue

@@ -0,0 +1,76 @@
+<template>
+  <v-row no-gutters class="fill-height" justify="center" align-content="center">
+    <v-col cols="12" class="mb-6">
+      <v-row no-gutters justify="center">
+        <nuxt-link
+          class="text-h2 font-weight-bold text-decoration-none"
+          style="color: unset"
+          :to="{ name: 'index' }"
+        >
+          GoWeekdays
+        </nuxt-link>
+      </v-row>
+    </v-col>
+
+    <v-col cols="12" lg="3" md="4" sm="6">
+      <v-form v-model="isValid" @submit.prevent="submit(email)">
+        <v-row no-gutters>
+          <v-col cols="12">
+            <v-row no-gutters>
+              <v-col cols="12" class="text-h6 font-weight-bold"> Email </v-col>
+              <v-col cols="12">
+                <v-text-field
+                  v-model="email"
+                  :rules="[requiredRule, emailRule]"
+                ></v-text-field>
+              </v-col>
+            </v-row>
+          </v-col>
+
+          <v-col v-if="message" cols="12" class="my-2 text-center font-italic">
+            {{ message }}
+          </v-col>
+
+          <v-col cols="12">
+            <v-row no-gutters justify="center">
+              <v-btn
+                type="submit"
+                variant="tonal"
+                :disabled="!isValid"
+                rounded="xl"
+                size="large"
+              >
+                submit
+              </v-btn>
+            </v-row>
+          </v-col>
+
+          <v-col cols="12" class="mt-2 text-center">
+            All good? <nuxt-link :to="{ name: 'login' }">Login</nuxt-link>
+          </v-col>
+        </v-row>
+      </v-form>
+    </v-col>
+  </v-row>
+</template>
+
+<script setup lang="ts">
+definePageMeta({
+  layout: "plain",
+});
+const { requiredRule, emailRule } = useUtils();
+const email = ref("");
+const isValid = ref(false);
+
+const { forgotPassword } = useLocalAuth();
+const message = ref("");
+
+async function submit(email = "") {
+  try {
+    const result: any = await forgotPassword(email);
+    message.value = result.message;
+  } catch (error: any) {
+    message.value = error.message;
+  }
+}
+</script>