Added frontend

laravel · Dec 5, 2018 · 72a14ab · 72a14ab
1 parent c8732a6
commit 72a14ab
Show file tree

Hide file tree

Showing 10 changed files with 659 additions and 8 deletions.
diff --git a/public/app.js b/public/app.js
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
@@ -1,5 +1,5 @@
 {
-    "/app.js": "/app.js?id=cb082a14c0f0bb5764c9",
+    "/app.js": "/app.js?id=8b839cf52d8d2895ec73",
     "/app.css": "/app.css?id=7c1ff2a14db6cf79b2c3",
     "/app-dark.css": "/app-dark.css?id=3499432c9dbc93b0f541"
 }
diff --git a/resources/js/components/RelatedEntries.vue b/resources/js/components/RelatedEntries.vue
@@ -56,6 +56,8 @@
                     this.currentTab = 'events'
                 } else if (this.cache.length) {
                     this.currentTab = 'cache'
+                } else if (this.gates.length) {
+                    this.currentTab = 'gates'
                 } else if (this.redis.length) {
                     this.currentTab = 'redis'
                 }
@@ -78,6 +80,10 @@
                 return _.filter(this.batch, {type: 'exception'});
             },
 
+            gates() {
+                return _.filter(this.batch, {type: 'gate'});
+            },
+
             logs() {
                 return _.filter(this.batch, {type: 'log'});
             },
@@ -120,6 +126,7 @@
                     {title: "Logs", type: "logs", count: this.logs.length},
                     {title: "Queries", type: "queries", count: this.queries.length},
                     {title: "Models", type: "models", count: this.models.length},
+                    {title: "Gates", type: "gates", count: this.gates.length},
                     {title: "Jobs", type: "jobs", count: this.jobs.length},
                     {title: "Mail", type: "mails", count: this.mails.length},
                     {title: "Notifications", type: "notifications", count: this.notifications.length},
@@ -284,6 +291,36 @@
                 </tbody>
             </table>
 
+            <!-- Related Gates -->
+            <table class="table table-hover table-sm mb-0" v-show="currentTab=='gates' && gates.length">
+                <thead>
+                <tr>
+                    <th>Ability</th>
+                    <th>Result</th>
+                    <th></th>
+                </tr>
+                </thead>
+
+                <tbody>
+                <tr v-for="entry in gates">
+                    <td :title="entry.content.ability">{{truncate(entry.content.ability, 80)}}</td>
+                    <td class="table-fit">
+                        <span class="badge font-weight-light" :class="'badge-'+gateResultClass(entry.content.result)">
+                            {{entry.content.result}}
+                        </span>
+                    </td>
+
+                    <td class="table-fit">
+                        <router-link :to="{name:'gate-preview', params:{id: entry.id}}" class="control-action">
+                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 16">
+                                <path d="M16.56 13.66a8 8 0 0 1-11.32 0L.3 8.7a1 1 0 0 1 0-1.42l4.95-4.95a8 8 0 0 1 11.32 0l4.95 4.95a1 1 0 0 1 0 1.42l-4.95 4.95-.01.01zm-9.9-1.42a6 6 0 0 0 8.48 0L19.38 8l-4.24-4.24a6 6 0 0 0-8.48 0L2.4 8l4.25 4.24h.01zM10.9 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-2a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"></path>
+                            </svg>
+                        </router-link>
+                    </td>
+                </tr>
+                </tbody>
+            </table>
+
             <!-- Related Jobs -->
             <table class="table table-hover table-sm mb-0" v-show="currentTab=='jobs' && jobs.length">
                 <thead>

diff --git a/resources/js/mixins/entriesStyles.js b/resources/js/mixins/entriesStyles.js
@@ -7,6 +7,12 @@ export default {
             if (type === 'missed') return 'danger';
         },
 
+
+        gateResultClass(result){
+            if (result === 'allowed') return 'success';
+            if (result === 'denied') return 'danger';
+        },
+
 
         jobStatusClass(status){
             if (status === 'pending') return 'secondary';

diff --git a/resources/js/routes.js b/resources/js/routes.js
@@ -31,6 +31,18 @@ export default [
         component: require('./screens/dumps/index')
     },
 
+    {
+        path: '/gate/:id',
+        name: 'gate-preview',
+        component: require('./screens/gates/preview')
+    },
+
+    {
+        path: '/gates',
+        name: 'gates',
+        component: require('./screens/gates/index')
+    },
+
     {
         path: '/logs/:id',
         name: 'log-preview',

diff --git a/resources/js/screens/gates/index.vue b/resources/js/screens/gates/index.vue
@@ -0,0 +1,41 @@
+<script type="text/ecmascript-6">
+    import StylesMixin from './../../mixins/entriesStyles';
+
+    export default {
+        mixins: [
+            StylesMixin,
+        ],
+    }
+</script>
+
+<template>
+    <index-screen title="Gates" resource="gates">
+        <tr slot="table-header">
+            <th scope="col">Ability</th>
+            <th scope="col">Result</th>
+            <th scope="col">Happened</th>
+            <th scope="col"></th>
+        </tr>
+
+
+        <template slot="row" slot-scope="slotProps">
+            <td>{{truncate(slotProps.entry.content.ability, 80)}}</td>
+
+            <td class="table-fit">
+                <span class="badge font-weight-light" :class="'badge-'+gateResultClass(slotProps.entry.content.result)">
+                    {{slotProps.entry.content.result}}
+                </span>
+            </td>
+
+            <td class="table-fit" :data-timeago="slotProps.entry.created_at">{{timeAgo(slotProps.entry.created_at)}}</td>
+
+            <td class="table-fit">
+                <router-link :to="{name:'gate-preview', params:{id: slotProps.entry.id}}" class="control-action">
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 16">
+                        <path d="M16.56 13.66a8 8 0 0 1-11.32 0L.3 8.7a1 1 0 0 1 0-1.42l4.95-4.95a8 8 0 0 1 11.32 0l4.95 4.95a1 1 0 0 1 0 1.42l-4.95 4.95-.01.01zm-9.9-1.42a6 6 0 0 0 8.48 0L19.38 8l-4.24-4.24a6 6 0 0 0-8.48 0L2.4 8l4.25 4.24h.01zM10.9 12a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm0-2a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"></path>
+                    </svg>
+                </router-link>
+            </td>
+        </template>
+    </index-screen>
+</template>
diff --git a/resources/js/screens/gates/preview.vue b/resources/js/screens/gates/preview.vue
@@ -0,0 +1,49 @@
+<script type="text/ecmascript-6">
+    import StylesMixin from './../../mixins/entriesStyles';
+
+    export default {
+        mixins: [
+            StylesMixin,
+        ],
+
+
+        data() {
+            return {
+                entry: null,
+                batch: [],
+            };
+        }
+    }
+</script>
+
+<template>
+    <preview-screen title="Gate Details" resource="gates" :id="$route.params.id">
+        <template slot="table-parameters" slot-scope="slotProps">
+            <tr>
+                <td class="table-fit font-weight-bold">Ability</td>
+                <td>
+                    {{slotProps.entry.content.ability}}
+                </td>
+            </tr>
+
+            <tr>
+                <td class="table-fit font-weight-bold">Result</td>
+                <td>
+                    <span class="badge font-weight-light" :class="'badge-'+gateResultClass(slotProps.entry.content.result)">
+                        {{slotProps.entry.content.result}}
+                    </span>
+                </td>
+            </tr>
+        </template>
+
+        <div slot="after-attributes-card" slot-scope="slotProps">
+            <div class="card mt-5">
+                <div class="card-header"><h5>Arguments</h5></div>
+
+                <div class="code-bg p-4 mb-0 text-white">
+                    <vue-json-pretty :data="slotProps.entry.content.arguments"></vue-json-pretty>
+                </div>
+            </div>
+        </div>
+    </preview-screen>
+</template>
diff --git a/resources/views/layout.blade.php b/resources/views/layout.blade.php
@@ -130,6 +130,14 @@
                             <span>Models</span>
                         </router-link>
                     </li>
+                    <li class="nav-item">
+                        <router-link active-class="active" to="/gates" class="nav-link d-flex align-items-center">
+                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+                                <path d="M7 10V7a5 5 0 1 1 10 0v3h2a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-8c0-1.1.9-2 2-2h2zm2 0h6V7a3 3 0 0 0-6 0v3zm-4 2v8h14v-8H5zm7 2a1 1 0 0 1 1 1v2a1 1 0 0 1-2 0v-2a1 1 0 0 1 1-1z"></path>
+                            </svg>
+                            <span>Gates</span>
+                        </router-link>
+                    </li>
                     <li class="nav-item">
                         <router-link active-class="active" to="/events" class="nav-link d-flex align-items-center">
                             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">

diff --git a/src/Http/Controllers/GatesController.php b/src/Http/Controllers/GatesController.php
@@ -0,0 +1,29 @@
+<?php
+
+namespace Laravel\Telescope\Http\Controllers;
+
+use Laravel\Telescope\EntryType;
+use Laravel\Telescope\Watchers\GateWatcher;
+
+class GatesController extends EntryController
+{
+    /**
+     * The entry type for the controller.
+     *
+     * @return string
+     */
+    protected function entryType()
+    {
+        return EntryType::GATE;
+    }
+
+    /**
+     * The watcher class for the controller.
+     *
+     * @return string
+     */
+    protected function watcher()
+    {
+        return GateWatcher::class;
+    }
+}
diff --git a/src/Http/routes.php b/src/Http/routes.php
@@ -29,6 +29,10 @@
 Route::post('/telescope-api/events', 'EventsController@index');
 Route::get('/telescope-api/events/{telescopeEntryId}', 'EventsController@show');
 
+// Gates entries...
+Route::post('/telescope-api/gates', 'GatesController@index');
+Route::get('/telescope-api/gates/{telescopeEntryId}', 'GatesController@show');
+
 // Cache entries...
 Route::post('/telescope-api/cache', 'CacheController@index');
 Route::get('/telescope-api/cache/{telescopeEntryId}', 'CacheController@show');