Merge pull request #45 from socialblue/develop

closes #44

Author: mbroersen

public/app.js

@@ -1,4 +1,4 @@
 {
-    "/app.js": "/app.js?id=2f9886a1bf12c1f0d73d",
+    "/app.js": "/app.js?id=d4940b332a8dd5bf2b6c",
     "/app.css": "/app.css?id=f844fdaf3875177afce4"
 }

public/mix-manifest.json

@@ -4,7 +4,7 @@
         <div class="modal-card">
             <header class="modal-card-head">
                 <p class="modal-card-title">Sql execute</p>
-                <button class="delete" aria-label="close" v-on:click="active = false"></button>
+                <button class="delete" aria-label="close" v-on:click="hide"></button>
             </header>
             <section class="modal-card-body">
                 <nav class="panel">
@@ -64,11 +64,18 @@
                 Axios.get(`/query-adviser/api/query/exec/?time=${this.time}&time-key=${this.timeKey}`).then((response) => {
                     this.result = response.data;
                 });
+            },
+
+            hide() {
+                this.active = false;
+                this.timeKey = null;
+                this.time = null;
             }
+
         },
 
         created() {
-            window.EventBus.$on(`show-execute-dialog`, (data) => {
+            window.EventBus.$on('show-execute-dialog', (data) => {
                 this.time = data.time;
                 this.timeKey = data.timeKey;
                 this.sql = this.format(data.sql);

resources/assets/js/components/query-execute.vue

@@ -4,7 +4,7 @@
         <div class="modal-card">
             <header class="modal-card-head">
                 <p class="modal-card-title">SQL - explain</p>
-                <button class="delete" aria-label="close" v-on:click="active = false"></button>
+                <button class="delete" aria-label="close" v-on:click="hide"></button>
             </header>
             <section class="modal-card-body">
                 <div class="button is-primary is-large is-loading" v-if="loading"></div>
@@ -31,28 +31,33 @@
                 sql: "",
                 active: false,
                 loading: false,
+                timeKey: 0,
+                time: 0,
             }
         },
 
         methods: {
 
             loadExplainParts()
             {
-                if (this.explainParts.length > 0) {
-                    return;
-                }
                 this.loading = true;
                 Axios.get('/query-adviser/api/query/explain', {params:{time: this.time, 'time-key': this.timeKey}}).then(resp => {
                     this.loading = false;
                     this.explainParts = resp.data.queryParts;
                 });
+            },
+
+            hide() {
+                this.active = false;
+                this.time = 0;
+                this.timeKey = 0;
+                this.explainParts = [];
             }
         },
 
         mounted() {
 
             window.EventBus.$on(`show-explain-dialog`, (data)=> {
-
                 this.time = data.time;
                 this.timeKey = data.timeKey;