@fishawack/lab-velocity 2.0.0-beta.11 → 2.0.0-beta.12

package/_Build/vue/modules/AuthModule/js/router.js

@@ -1,10 +1,22 @@
 "use strict";
 
+import { merge } from "lodash";
+
 import { h } from "vue";
 import { RouterView } from "vue-router";
 
+import { routes as resourceRoutes } from "../../resource/index.js";
+
+import userResource from "../routes/PUsers/resource.js";
+import companyResource from "../routes/PCompanies/resource.js";
+
 // Admin routes export - minimal auth flow (headless login only)
-export function adminRoutes(node) {
+export function adminRoutes(node, overrides = {}) {
+    const {
+        userResource: overrideUserResource = {},
+        companyResource: overrideCompanyResource = {},
+    } = overrides;
+
     return [
         {
             path: "/auth",
@@ -39,94 +51,14 @@ export function adminRoutes(node) {
                 },
             ],
         },
-        {
-            path: "/users",
-            component: node
-                ? ""
-                : require("../adminRoutes/PUsers/parent.vue").default,
-            children: [
-                {
-                    path: "",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/index.vue")
-                              .default,
-                    name: "users.index",
-                },
-                {
-                    path: "create",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/create.vue")
-                              .default,
-                    name: "users.create",
-                },
-                {
-                    path: ":id",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/show.vue")
-                              .default,
-                    name: "users.show",
-                },
-                {
-                    path: ":id/edit",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PUsers/Children/edit.vue")
-                              .default,
-                    name: "users.edit",
-                },
-            ],
-        },
-        {
-            path: "/companies",
-            component: node
-                ? ""
-                : require("../adminRoutes/PCompanies/parent.vue").default,
-            children: [
-                {
-                    path: "",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/index.vue")
-                              .default,
-                    name: "companies.index",
-                },
-                {
-                    path: "create",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/create.vue")
-                              .default,
-                    name: "companies.create",
-                },
-                {
-                    path: ":id",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/show.vue")
-                              .default,
-                    name: "companies.show",
-                },
-                {
-                    path: ":id/edit",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/edit.vue")
-                              .default,
-                    name: "companies.edit",
-                },
-                {
-                    path: ":id/upload",
-                    component: node
-                        ? ""
-                        : require("../adminRoutes/PCompanies/Children/Upload/upload.vue")
-                              .default,
-                    name: "companies.upload",
-                },
-            ],
-        },
+        ...resourceRoutes(
+            node,
+            ...merge(userResource, [undefined, overrideUserResource]),
+        ),
+        ...resourceRoutes(
+            node,
+            ...merge(companyResource, [undefined, overrideCompanyResource]),
+        ),
     ];
 }
 

package/_Build/vue/modules/AuthModule/js/store.js

@@ -7,6 +7,9 @@ const store = {
             intended: null,
             user: null,
             redirect: process.env.HYDRATE_REDIRECT ?? "index",
+            logo: process.env.HYDRATE_LOGO ?? "example-logo",
+            logoReverse:
+                process.env.HYDRATE_LOGO_REVERSE ?? process.env.HYDRATE_LOGO,
             contact:
                 process.env.HYDRATE_CONTACT ?? "mailto:det@avalerehealth.com",
         };
@@ -15,12 +18,18 @@ const store = {
     getters: {
         authenticated: (state) => !!state.user,
         can: (state) => (permission) => {
-            return state.user?.permissions
-                .map(({ name }) => name)
-                .includes(permission);
+            const arr = Array.isArray(permission) ? permission : [permission];
+            const userPermissions = state.user?.permissions.map(
+                ({ name }) => name,
+            );
+
+            return arr.every((name) => userPermissions?.includes(name));
         },
         hasRole: (state) => (role) => {
-            return state.user?.roles.map(({ name }) => name).includes(role);
+            const arr = Array.isArray(role) ? role : [role];
+            const userRoles = state.user?.roles.map(({ name }) => name);
+
+            return arr.every((name) => userRoles?.includes(name));
         },
     },
 

package/_Build/vue/modules/AuthModule/{adminRoutes/PCompanies/Children/partials → routes/PCompanies}/form.vue

@@ -66,14 +66,19 @@
             <VelButton @click="form.domains.push('')">
                 Add Domain
 
-                <GIcon name="icon-plus" embed asis class="fill-0 ml" />
+                <GIcon
+                    name="icon-plus"
+                    embed
+                    asis
+                    class="fill-0 icon--0.5 ml"
+                />
             </VelButton>
         </div>
 
         <hr class="my-5 hr-muted" />
 
         <template v-if="$store.getters.can('edit roles')">
-            <FormRole :form="form" />
+            <VelFormRole :form="form" />
 
             <hr class="my-5 hr-muted" />
         </template>
@@ -127,22 +132,24 @@
             <hr class="my-3 hr-muted" />
         </template>
 
-        <VFormFooter :form="form" />
+        <VelFormFooter :form="form" />
     </form>
 </template>
 
 <!-- eslint-disable vue/no-mutating-props -->
 <script>
 import axios from "axios";
-import VelButton from "../../../../../../components/basic/Button.vue";
-import VelSelect from "../../../../../../components/form/Select.vue";
-import VelBasic from "../../../../../../components/form/basic.vue";
+import VelButton from "../../../../components/basic/Button.vue";
+import VelSelect from "../../../../components/form/Select.vue";
+import VelBasic from "../../../../components/form/basic.vue";
+import VelFormRole from "../../../../components/layout/FormRole.vue";
+import VelFormFooter from "../../../../components/layout/FormFooter.vue";
 import { ElInput } from "element-plus";
 
 export default {
     components: {
-        VFormFooter: require("../../../../components/VFormFooter.vue").default,
-        FormRole: require("../../../../components/FormRole.vue").default,
+        VelFormFooter,
+        VelFormRole,
         VelButton,
         VelSelect,
         VelBasic,

package/_Build/vue/modules/AuthModule/routes/PCompanies/resource.js

@@ -0,0 +1,180 @@
+import VelFormRole from "../../../../components/layout/FormRole.vue";
+import VelButton from "../../../../components/basic/Button.vue";
+import Chip from "../../../../components/layout/Chip.vue";
+import Chips from "../../../../components/layout/Chips.vue";
+import VelTableSorter from "../../../../components/layout/TableSorter.vue";
+import VelRoleLegend from "../../../../components/layout/RoleLegend.vue";
+import component from "./form.vue";
+import userResource from "../PUsers/resource.js";
+import { meta } from "../../../resource/index.js";
+
+import { ElNotification } from "element-plus";
+import { h } from "vue";
+import axios from "axios";
+
+export default [
+    "companies",
+    {
+        defaults: "include=primary_contact",
+        singular: "company",
+        icon: "icon-cases",
+        form: {
+            component,
+            fields: ({ model }) => ({
+                name: model?.name || null,
+                primary_contact: model?.primary_contact?.id || null,
+                domains: model?.domains || [],
+                roles: model?.roles.map((val) => val.id) || [],
+                sso_client_id: model?.sso_client_id || undefined,
+                sso_tenant: model?.sso_tenant || undefined,
+                sso_client_secret: model?.sso_client_secret || undefined,
+                sso_type: model?.sso_type || undefined,
+            }),
+        },
+        table: {
+            structure: [
+                {
+                    label: "Name",
+                    key: "name",
+                    sortable: true,
+                },
+                {
+                    label: "Total users",
+                    key: "user_count",
+                    sortable: false,
+                    width: "150",
+                },
+                {
+                    label: "Role",
+                    render: (row) =>
+                        h(
+                            row.roles.length === 1 ? Chip : Chips,
+                            row.roles.length === 1
+                                ? {
+                                      name: row.roles[0].name,
+                                      label: row.roles[0].label,
+                                  }
+                                : { array: row.roles },
+                        ),
+                },
+            ],
+        },
+        index: {
+            structure: [
+                {
+                    render: ({ resource, $store }) =>
+                        h(VelTableSorter, {
+                            key: "PIndex",
+                            "json-data": {
+                                ...resource,
+                                tableStructure: resource.table.structure,
+                            },
+                            defaults: resource.defaults,
+                            "fixed-height": false,
+                            "display-edit-action":
+                                $store.getters.can("write companies"),
+                        }),
+                },
+                {
+                    render: () =>
+                        h(VelRoleLegend, {
+                            class: "mt-5",
+                        }),
+                },
+            ],
+        },
+        show: {
+            actions: [
+                {
+                    render: ({ model }) =>
+                        model.primary_contact &&
+                        h(
+                            VelButton,
+                            {
+                                type: "primary",
+                                async onClick() {
+                                    try {
+                                        const res = await axios.post(
+                                            `/api/companies/${model.id}/welcome`,
+                                        );
+                                        ElNotification({
+                                            title: "Success",
+                                            message: res.data.message,
+                                            type: "success",
+                                        });
+
+                                        model.primary_contact_contacted = true;
+                                    } catch (e) {
+                                        ElNotification({
+                                            title: "Warning",
+                                            message:
+                                                e.response?.data?.message ||
+                                                e.message,
+                                            type: "warning",
+                                        });
+                                    }
+                                },
+                            },
+                            "Send welcome email",
+                        ),
+                },
+            ],
+            structure: [
+                [
+                    {
+                        label: "Domains",
+                        render: ({ model }) =>
+                            h("span", model.domains.join(", ")),
+                    },
+                    {
+                        label: "SSO Enabled",
+                        key: "sso_enabled",
+                    },
+                    {
+                        label: "Primary Contact",
+                        render: ({ model }) =>
+                            h("span", model.primary_contact?.name),
+                    },
+                    {
+                        label: "Primary Contact Email",
+                        render: ({ model }) =>
+                            h("span", model.primary_contact?.email),
+                    },
+                    {
+                        label: "Primary Contact Contacted",
+                        render: ({ model }) =>
+                            h("span", !!model.primary_contact_contacted),
+                    },
+                    {
+                        label: "Total users",
+                        key: "user_count",
+                    },
+                ],
+                {
+                    render: ({ model }) =>
+                        h(VelFormRole, {
+                            overrides: model.overrides_roles_and_permissions,
+                            form: { roles: model.roles.map((d) => d.id) },
+                            readonly: true,
+                        }),
+                },
+                {
+                    render: ({ model, $store }) => {
+                        const resource = meta(...userResource);
+                        return h(VelTableSorter, {
+                            key: "PIndex",
+                            "json-data": {
+                                ...resource,
+                                tableStructure: resource.table.structure,
+                            },
+                            defaults: `include=company&filter[company_id]=${model.id}`,
+                            "fixed-height": false,
+                            "display-edit-action":
+                                $store.getters.can("write users"),
+                        });
+                    },
+                },
+            ],
+        },
+    },
+];

package/_Build/vue/modules/AuthModule/{adminRoutes/PUsers/Children/partials → routes/PUsers}/form.vue

@@ -74,11 +74,16 @@
                 >
                     Reset roles
                 </VelButton>
-                <FormRole :form="form" />
+                <VelFormRole :form="form" />
             </template>
             <template v-else>
                 <VelButton @click="enableRoles = true">
-                    <GIcon name="icon-plus" embed asis class="fill-0 mr" />
+                    <GIcon
+                        name="icon-plus"
+                        embed
+                        asis
+                        class="fill-0 icon--0.5 mr"
+                    />
                     Override roles
                 </VelButton>
                 <p class="mt-2">
@@ -88,21 +93,23 @@
             <hr class="my-5 hr-muted" />
         </template>
 
-        <VFormFooter :loading="form.processing" />
+        <VelFormFooter :loading="form.processing" />
     </form>
 </template>
 
 <script>
 import axios from "axios";
 import { debounce } from "lodash";
-import VelButton from "../../../../../../components/basic/Button.vue";
-import VelCheckbox from "../../../../../../components/form/Checkbox.vue";
-import VelBasic from "../../../../../../components/form/basic.vue";
+import VelButton from "../../../../components/basic/Button.vue";
+import VelCheckbox from "../../../../components/form/Checkbox.vue";
+import VelBasic from "../../../../components/form/basic.vue";
+import VelFormRole from "../../../../components/layout/FormRole.vue";
+import VelFormFooter from "../../../../components/layout/FormFooter.vue";
 
 export default {
     components: {
-        VFormFooter: require("../../../../components/VFormFooter.vue").default,
-        FormRole: require("../../../../components/FormRole.vue").default,
+        VelFormFooter,
+        VelFormRole,
         VelCheckbox,
         VelButton,
         VelBasic,

package/_Build/vue/modules/AuthModule/routes/PUsers/resource.js

@@ -0,0 +1,214 @@
+import VelFormRole from "../../../../components/layout/FormRole.vue";
+import Chip from "../../../../components/layout/Chip.vue";
+import Chips from "../../../../components/layout/Chips.vue";
+import VelTableSorter from "../../../../components/layout/TableSorter.vue";
+import VelRoleLegend from "../../../../components/layout/RoleLegend.vue";
+import component from "./form.vue";
+
+import { ElMessageBox } from "element-plus";
+import { ElNotification } from "element-plus";
+import { h, resolveComponent } from "vue";
+
+function generatePassword(
+    length = 20,
+    characters = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz~!@-#$",
+) {
+    return (
+        Array.from(crypto.getRandomValues(new Uint32Array(length)))
+            .map((x) => characters[x % characters.length])
+            .join("") + Math.floor(Math.random() * 10)
+    );
+}
+
+export default [
+    "users",
+    {
+        defaults: "include=company",
+        searchable: {
+            value: "email",
+        },
+        form: {
+            async submit({ model, form, $router, $store, method }) {
+                try {
+                    if (method === "post") {
+                        if (form.set_password) {
+                            const password = generatePassword();
+                            form.password = password;
+                            form.password_confirmation = password;
+                        }
+
+                        let res = await form.post(`/api/users`);
+
+                        if (form.set_password && !form.notify_user) {
+                            ElMessageBox.alert(
+                                `<p>The password below will not be shown again. Ensure you've taken a copy if you plan to send manually. <br><br><strong>Email</strong>: ${form.email}<br> <strong>Password</strong>: ${form.password}</p>`,
+                                "User Created",
+                                {
+                                    confirmButtonText: "Ok",
+                                    dangerouslyUseHTMLString: true,
+                                },
+                            )
+                                .then(() => {
+                                    $router.replace({
+                                        name: "users.show",
+                                        params: { id: res.data.id },
+                                    });
+                                })
+                                .catch(() => {});
+                        } else {
+                            ElNotification({
+                                title: "Success",
+                                message:
+                                    "User created a notified of their new account",
+                                type: "success",
+                            });
+
+                            $router.replace({
+                                name: "users.show",
+                                params: { id: res.data.id },
+                            });
+                        }
+                    } else {
+                        let res = await form.patch(`/api/users/${model.id}`);
+
+                        // if changing ourselves, re-fetch user data
+                        if (res.data.id === $store.state.auth.user.id) {
+                            await $store.dispatch("getUser");
+                        }
+
+                        $router.replace({
+                            name: "users.show",
+                            params: { id: res.data.id },
+                        });
+                    }
+                } catch (e) {
+                    console.log(e);
+                }
+            },
+            component,
+            fields: ({ model, method }) => ({
+                ...{
+                    name: model?.name ?? null,
+                    email: model?.email ?? null,
+                    roles: model?.overrides_roles_and_permissions
+                        ? model?.roles.map((val) => {
+                              return val.id;
+                          })
+                        : [],
+                    company_id: model?.company_id ?? null,
+                },
+                ...(method === "post"
+                    ? {
+                          notify_user: true,
+                          force_password_change: true,
+                          set_password: true,
+                          password: null,
+                          password_confirmation: null,
+                      }
+                    : {}),
+            }),
+        },
+        table: {
+            structure: [
+                {
+                    label: "Name",
+                    key: "name",
+                    sortable: true,
+                },
+                {
+                    label: "Email",
+                    key: "email",
+                    sortable: true,
+                },
+                {
+                    label: "Company",
+                    sortable: true,
+                    render: (model) =>
+                        h(resolveComponent("router-link"), {
+                            class: "underline",
+                            to: {
+                                name: "companies.show",
+                                params: { id: model.company_id },
+                            },
+                            text: model.company.name,
+                        }),
+                },
+                {
+                    label: "Role",
+                    render: (row) =>
+                        h(
+                            !row.overrides_roles_and_permissions ||
+                                row.roles.length === 1
+                                ? Chip
+                                : Chips,
+                            !row.overrides_roles_and_permissions
+                                ? {
+                                      name: "inherited",
+                                      label: "Inherited",
+                                  }
+                                : row.roles.length === 1
+                                  ? {
+                                        name: row.roles[0].name,
+                                        label: row.roles[0].label,
+                                    }
+                                  : { array: row.roles },
+                        ),
+                },
+            ],
+        },
+        index: {
+            structure: [
+                {
+                    render: ({ resource, $store }) =>
+                        h(VelTableSorter, {
+                            key: "PIndex",
+                            "json-data": {
+                                ...resource,
+                                tableStructure: resource.table.structure,
+                            },
+                            defaults: resource.defaults,
+                            "fixed-height": false,
+                            "display-edit-action":
+                                $store.getters.can("write users"),
+                        }),
+                },
+                {
+                    render: () =>
+                        h(VelRoleLegend, {
+                            class: "mt-5",
+                        }),
+                },
+            ],
+        },
+        show: {
+            structure: [
+                [
+                    {
+                        label: "Email",
+                        key: "email",
+                    },
+                    {
+                        label: "Company",
+                        render: ({ model }) =>
+                            h(resolveComponent("router-link"), {
+                                class: "underline",
+                                to: {
+                                    name: "companies.show",
+                                    params: { id: model.company_id },
+                                },
+                                text: model.company.name,
+                            }),
+                    },
+                ],
+                {
+                    render: ({ model }) =>
+                        h(VelFormRole, {
+                            overrides: model.overrides_roles_and_permissions,
+                            form: { roles: model.roles.map((d) => d.id) },
+                            readonly: true,
+                        }),
+                },
+            ],
+        },
+    },
+];