fix state updating

src/components/MainMenu.vue

@@ -16,7 +16,7 @@
       <button
         v-if="currentQuery"
         class="primary"
-        :disabled="currentQuery && !currentQuery.isUnsaved"
+        :disabled="currentQuery && !isUnsaved"
         @click="checkQueryBeforeSave"
       >
         Save
@@ -72,6 +72,13 @@ export default {
     currentQuery () {
       return this.$store.state.currentTab
     },
+    isUnsaved () {
+      if (!this.currentQuery) {
+        return false
+      }
+      const tabIndex = this.currentQuery.tabIndex
+      return this.$store.state.tabs[tabIndex].isUnsaved
+    },
     isPredefined () {
       if (this.currentQuery) {
         return this.currentQuery.isPredefined

src/components/Tab.vue

@@ -34,7 +34,7 @@
             :sql-result="result"
             :init-chart="initChart"
             ref="chart"
-            @update="isUnsaved = true"
+            @update="$store.commit('updateTabState', { index: tabIndex, isUnsaved: true })"
           />
         </div>
       </template>
@@ -65,7 +65,6 @@ export default {
       result: null,
       view: 'table',
       tableViewHeight: 0,
-      isUnsaved: !this.initName,
       isGettingResults: false,
       error: null,
       resizeObserver: null
@@ -94,10 +93,7 @@ export default {
       }
     },
     query () {
-      this.isUnsaved = true
-    },
-    isUnsaved () {
-      this.$store.commit('updateTabState', { index: this.tabIndex, newValue: this.isUnsaved })
+      this.$store.commit('updateTabState', { index: this.tabIndex, isUnsaved: true })
     }
   },
   methods: {

src/store/index.js

@@ -95,9 +95,9 @@ export default new Vuex.Store({
 
       Vue.set(state.tabs, index, tab)
     },
-    updateTabState (state, { index, newValue }) {
+    updateTabState (state, { index, isUnsaved }) {
       const tab = state.tabs[index]
-      tab.isUnsaved = newValue
+      tab.isUnsaved = isUnsaved
       Vue.set(state.tabs, index, tab)
     },
     deleteTab (state, index) {