Use link from InfoBox component + code format

app/assets/views/ActivitiesView.vue

@@ -8,7 +8,8 @@ import moment from 'moment'
 // TODO : Reenable typescript
 const data = ref({})
 
-axios.get('/api/activities?size=10&page=0&sorts%5Boccurred_at%5D=desc')
+axios
+    .get('/api/activities?size=10&page=0&sorts%5Boccurred_at%5D=desc')
     .then((response) => {
         data.value = response.data
     })
@@ -33,28 +34,31 @@ axios.get('/api/activities?size=10&page=0&sorts%5Boccurred_at%5D=desc')
             <tbody>
                 <tr v-for="row in data.rows" :key="row.id">
                     <td>
-                        <div>{{ moment(row.occurred_at).format('dddd')}}</div>
-                        <div>{{ moment(row.occurred_at).format('MMM Do, YYYY h:mm a')}}</div>
+                        <div>{{ moment(row.occurred_at).format('dddd') }}</div>
+                        <div>{{ moment(row.occurred_at).format('MMM Do, YYYY h:mm a') }}</div>
                     </td>
                     <td>
                         <strong>
-                            <RouterLink :to="{ name: 'admin.user', params: { user_name: row.user.user_name } }">
-                                {{row.user.full_name}} ({{row.user.user_name}})
+                            <RouterLink
+                                :to="{
+                                    name: 'admin.user',
+                                    params: { user_name: row.user.user_name }
+                                }">
+                                {{ row.user.full_name }} ({{ row.user.user_name }})
                             </RouterLink>
                         </strong>
-                        <div class="uk-text-meta">{{row.user.email}}</div>
+                        <div class="uk-text-meta">{{ row.user.email }}</div>
                     </td>
                     <td>
                         <div>
-                            {{row.ip_address}}
+                            {{ row.ip_address }}
                         </div>
                         <div>
-                            <i>{{row.description}}</i>
+                            <i>{{ row.description }}</i>
                         </div>
                     </td>
                 </tr>
             </tbody>
         </table>
-
     </UFCardBox>
-</template>
+</template>

app/assets/views/DashboardView.vue

@@ -45,19 +45,25 @@ axios
 
     <div class="uk-grid uk-child-width-1-3" uk-grid>
         <div>
-            <RouterLink :to="{ name: 'admin.users' }" class="uk-text-decoration-none">
-                <UFInfoBox :value="data.counter.users" label="Users" faIcon="user" />
-            </RouterLink>
+            <UFInfoBox
+                :value="data.counter.users"
+                label="Users"
+                faIcon="user"
+                :to="{ name: 'admin.users' }" />
         </div>
         <div>
-            <RouterLink :to="{ name: 'admin.roles' }" class="uk-text-decoration-none">
-                <UFInfoBox :value="data.counter.roles" label="Roles" faIcon="address-card" />
-            </RouterLink>
+            <UFInfoBox
+                :value="data.counter.roles"
+                label="Roles"
+                faIcon="address-card"
+                :to="{ name: 'admin.roles' }" />
         </div>
         <div>
-            <RouterLink :to="{ name: 'admin.groups' }" class="uk-text-decoration-none">
-                <UFInfoBox :value="data.counter.groups" label="Groups" faIcon="users" />
-            </RouterLink>
+            <UFInfoBox
+                :value="data.counter.groups"
+                label="Groups"
+                faIcon="users"
+                :to="{ name: 'admin.groups' }" />
         </div>
     </div>
 

app/assets/views/UsersView.vue

@@ -1,11 +1,12 @@
 <template>
     <h3 class="uk-margin-remove">Users</h3>
-    <p class="uk-text-meta uk-margin-remove-top">A listing of the users for your site. Provides management tools including the ability to edit user details, manually activate users, enable/disable users, and more.</p>
+    <p class="uk-text-meta uk-margin-remove-top">
+        A listing of the users for your site. Provides management tools including the ability to
+        edit user details, manually activate users, enable/disable users, and more.
+    </p>
 
     <UFCardBox>
-        <template #header>
-            <font-awesome-icon icon="user" /> Users
-        </template>
+        <template #header> <font-awesome-icon icon="user" /> Users </template>
         <template #footer>
             <a href="#" class="uk-button uk-button-primary">Create User</a>
         </template>

dist/ActivitiesView-CW-IXBg4.js → dist/ActivitiesView-B7sZTcln.js

@@ -2609,7 +2609,10 @@ const Ci = { class: "uk-table uk-table-striped" }, Li = { class: "uk-text-meta"
                   p("td", null, [
                     p("strong", null, [
                       Nt(a, {
-                        to: { name: "admin.user", params: { user_name: i.user.user_name } }
+                        to: {
+                          name: "admin.user",
+                          params: { user_name: i.user.user_name }
+                        }
                       }, {
                         default: Wt(() => [
                           Ps(te(i.user.full_name) + " (" + te(i.user.user_name) + ") ", 1)

dist/DashboardView-5JFk_huL.js → dist/DashboardView-DOzynbLK.js

@@ -1,4 +1,4 @@
-import { ref as f, resolveComponent as m, openBlock as a, createElementBlock as d, Fragment as k, createElementVNode as e, createVNode as o, withCtx as u, renderList as p, toDisplayString as t, createTextVNode as b } from "vue";
+import { ref as f, resolveComponent as i, openBlock as u, createElementBlock as r, Fragment as v, createElementVNode as e, createVNode as s, renderList as c, withCtx as m, toDisplayString as t, createTextVNode as b } from "vue";
 import { a as g } from "./axios-CXDYiOMX.js";
 const x = {
   class: "uk-grid uk-child-width-1-3",
@@ -37,59 +37,38 @@ const x = {
       sprinkles: {},
       users: []
     });
-    return g.get("/api/dashboard").then((i) => {
-      n.value = i.data;
-    }).catch((i) => {
-      console.error(i);
-    }), (i, l) => {
-      const v = m("UFInfoBox"), r = m("RouterLink"), c = m("UFCardBox");
-      return a(), d(k, null, [
+    return g.get("/api/dashboard").then((d) => {
+      n.value = d.data;
+    }).catch((d) => {
+      console.error(d);
+    }), (d, l) => {
+      const a = i("UFInfoBox"), k = i("RouterLink"), p = i("UFCardBox");
+      return u(), r(v, null, [
         l[13] || (l[13] = e("h3", null, "Dashboard", -1)),
         e("div", x, [
           e("div", null, [
-            o(r, {
-              to: { name: "admin.users" },
-              class: "uk-text-decoration-none"
-            }, {
-              default: u(() => [
-                o(v, {
-                  value: n.value.counter.users,
-                  label: "Users",
-                  faIcon: "user"
-                }, null, 8, ["value"])
-              ]),
-              _: 1
-            })
+            s(a, {
+              value: n.value.counter.users,
+              label: "Users",
+              faIcon: "user",
+              to: { name: "admin.users" }
+            }, null, 8, ["value"])
           ]),
           e("div", null, [
-            o(r, {
-              to: { name: "admin.roles" },
-              class: "uk-text-decoration-none"
-            }, {
-              default: u(() => [
-                o(v, {
-                  value: n.value.counter.roles,
-                  label: "Roles",
-                  faIcon: "address-card"
-                }, null, 8, ["value"])
-              ]),
-              _: 1
-            })
+            s(a, {
+              value: n.value.counter.roles,
+              label: "Roles",
+              faIcon: "address-card",
+              to: { name: "admin.roles" }
+            }, null, 8, ["value"])
           ]),
           e("div", null, [
-            o(r, {
-              to: { name: "admin.groups" },
-              class: "uk-text-decoration-none"
-            }, {
-              default: u(() => [
-                o(v, {
-                  value: n.value.counter.groups,
-                  label: "Groups",
-                  faIcon: "users"
-                }, null, 8, ["value"])
-              ]),
-              _: 1
-            })
+            s(a, {
+              value: n.value.counter.groups,
+              label: "Groups",
+              faIcon: "users",
+              to: { name: "admin.groups" }
+            }, null, 8, ["value"])
           ])
         ]),
         e("div", _, [
@@ -104,43 +83,43 @@ const x = {
               ], -1)),
               e("div", y, [
                 e("div", U, [
-                  (a(!0), d(k, null, p(n.value.users, (s) => (a(), d("div", {
-                    key: s.id,
+                  (u(!0), r(v, null, c(n.value.users, (o) => (u(), r("div", {
+                    key: o.id,
                     class: "uk-text-center"
                   }, [
-                    o(r, {
-                      to: { name: "admin.user", params: { user_name: s.user_name } },
+                    s(k, {
+                      to: { name: "admin.user", params: { user_name: o.user_name } },
                       class: "uk-text-decoration-none uk-link-text"
                     }, {
-                      default: u(() => [
+                      default: m(() => [
                         e("img", {
-                          src: s.avatar,
+                          src: o.avatar,
                           alt: "User Image",
                           class: "uk-border-circle"
                         }, null, 8, F),
-                        e("p", I, t(s.full_name), 1),
-                        e("p", B, t(s.registered), 1)
+                        e("p", I, t(o.full_name), 1),
+                        e("p", B, t(o.registered), 1)
                       ]),
                       _: 2
                     }, 1032, ["to"])
                   ]))), 128))
                 ])
               ]),
               e("div", D, [
-                o(r, {
+                s(k, {
                   to: { name: "admin.users" },
                   class: "uk-button uk-button-text"
                 }, {
-                  default: u(() => l[0] || (l[0] = [
+                  default: m(() => l[0] || (l[0] = [
                     b("View All Users")
                   ])),
                   _: 1
                 })
               ])
             ]),
             l[12] || (l[12] = e("br", null, null, -1)),
-            o(c, { title: "System Information" }, {
-              default: u(() => [
+            s(p, { title: "System Information" }, {
+              default: m(() => [
                 e("dl", R, [
                   l[2] || (l[2] = e("dt", null, "Frameword version", -1)),
                   e("dd", null, [
@@ -193,9 +172,9 @@ const x = {
                   l[11] || (l[11] = e("dt", null, "Loaded sprinkles", -1)),
                   e("dd", null, [
                     e("ul", V, [
-                      (a(!0), d(k, null, p(n.value.sprinkles, (s) => (a(), d("li", {
-                        key: s.name
-                      }, t(s), 1))), 128))
+                      (u(!0), r(v, null, c(n.value.sprinkles, (o) => (u(), r("li", {
+                        key: o.name
+                      }, t(o), 1))), 128))
                     ])
                   ])
                 ])
@@ -204,7 +183,7 @@ const x = {
             })
           ]),
           e("div", null, [
-            o(c, { title: "Activities" })
+            s(p, { title: "Activities" })
           ])
         ])
       ], 64);

dist/DashboardView-FQV8sAsR.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),s=require("./axios-tuVKNgv9.cjs"),u={class:"uk-grid uk-child-width-1-3","uk-grid":""},i={class:"uk-grid uk-child-width-1-2","uk-grid":""},c={class:"uk-card uk-card-default uk-card-small"},m={class:"uk-card-body"},V={class:"uk-grid uk-flex-center","uk-grid":""},E=["src"],N={class:"uk-margin-remove"},p={class:"uk-margin-remove uk-text-meta"},v={class:"uk-card-footer uk-text-center"},k={class:"uk-description-list"},g={class:"uk-list uk-list-disc uk-list-collapse"},f={__name:"DashboardView",setup(b){const l=e.ref({counter:{users:0,roles:0,groups:0},info:{version:{framework:"",php:""},database:{connection:"",name:"",type:"",version:""},environment:{},path:{project:""}},sprinkles:{},users:[]});return s.axios.get("/api/dashboard").then(o=>{l.value=o.data}).catch(o=>{console.error(o)}),(o,t)=>{const r=e.resolveComponent("UFInfoBox"),a=e.resolveComponent("RouterLink"),d=e.resolveComponent("UFCardBox");return e.openBlock(),e.createElementBlock(e.Fragment,null,[t[13]||(t[13]=e.createElementVNode("h3",null,"Dashboard",-1)),e.createElementVNode("div",u,[e.createElementVNode("div",null,[e.createVNode(r,{value:l.value.counter.users,label:"Users",faIcon:"user",to:{name:"admin.users"}},null,8,["value"])]),e.createElementVNode("div",null,[e.createVNode(r,{value:l.value.counter.roles,label:"Roles",faIcon:"address-card",to:{name:"admin.roles"}},null,8,["value"])]),e.createElementVNode("div",null,[e.createVNode(r,{value:l.value.counter.groups,label:"Groups",faIcon:"users",to:{name:"admin.groups"}},null,8,["value"])])]),e.createElementVNode("div",i,[e.createElementVNode("div",null,[e.createElementVNode("div",c,[t[1]||(t[1]=e.createElementVNode("div",{class:"uk-card-header"},[e.createElementVNode("div",{class:"uk-grid uk-grid-small"},[e.createElementVNode("div",{class:"uk-width-auto"},[e.createElementVNode("h4",{"data-test":"title"},"Latest Users")])])],-1)),e.createElementVNode("div",m,[e.createElementVNode("div",V,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value.users,n=>(e.openBlock(),e.createElementBlock("div",{key:n.id,class:"uk-text-center"},[e.createVNode(a,{to:{name:"admin.user",params:{user_name:n.user_name}},class:"uk-text-decoration-none uk-link-text"},{default:e.withCtx(()=>[e.createElementVNode("img",{src:n.avatar,alt:"User Image",class:"uk-border-circle"},null,8,E),e.createElementVNode("p",N,e.toDisplayString(n.full_name),1),e.createElementVNode("p",p,e.toDisplayString(n.registered),1)]),_:2},1032,["to"])]))),128))])]),e.createElementVNode("div",v,[e.createVNode(a,{to:{name:"admin.users"},class:"uk-button uk-button-text"},{default:e.withCtx(()=>t[0]||(t[0]=[e.createTextVNode("View All Users")])),_:1})])]),t[12]||(t[12]=e.createElementVNode("br",null,null,-1)),e.createVNode(d,{title:"System Information"},{default:e.withCtx(()=>[e.createElementVNode("dl",k,[t[2]||(t[2]=e.createElementVNode("dt",null,"Frameword version",-1)),e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code",null,e.toDisplayString(l.value.info.version.framework),1)])]),t[3]||(t[3]=e.createElementVNode("dt",null,"PHP version",-1)),e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code",null,e.toDisplayString(l.value.info.version.php),1)])]),t[4]||(t[4]=e.createElementVNode("dt",null,"Webserver software",-1)),e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code",null,e.toDisplayString(l.value.info.environment.SERVER_SOFTWARE),1)])]),t[5]||(t[5]=e.createElementVNode("dt",null,"Database connection",-1)),e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code",null,e.toDisplayString(l.value.info.database.connection),1)])]),t[6]||(t[6]=e.createElementVNode("dt",null,"Database version",-1)),e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code",null,e.toDisplayString(l.value.info.database.type)+" "+e.toDisplayString(l.value.info.database.version),1)])]),t[7]||(t[7]=e.createElementVNode("dt",null,"Database name",-1)),e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code",null,e.toDisplayString(l.value.info.database.name),1)])]),t[8]||(t[8]=e.createElementVNode("dt",null,"Project directory",-1)),e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code",null,e.toDisplayString(l.value.info.path.project),1)])]),t[9]||(t[9]=e.createElementVNode("dt",null,"Site root url",-1)),t[10]||(t[10]=e.createElementVNode("dd",null,[e.createElementVNode("pre",null,[e.createElementVNode("code")])],-1)),t[11]||(t[11]=e.createElementVNode("dt",null,"Loaded sprinkles",-1)),e.createElementVNode("dd",null,[e.createElementVNode("ul",g,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value.sprinkles,n=>(e.openBlock(),e.createElementBlock("li",{key:n.name},e.toDisplayString(n),1))),128))])])])]),_:1})]),e.createElementVNode("div",null,[e.createVNode(d,{title:"Activities"})])])],64)}}};exports.default=f;