refactor(gui): linting

Signed-off-by: Pranav C <61551451+pranavxc@users.noreply.github.com>

packages/nc-gui/components/project/viewTabs/viewQuery.vue

@@ -2,46 +2,76 @@
   <v-container class="pa-0 ma-0" fluid>
     <v-toolbar flat height="42" class="toolbar-border-bottom">
       <v-toolbar-title>
-        <v-breadcrumbs :items="[{
-          text: this.nodes.env,
-          disabled: true,
-          href: '#'
-        },{
-          text: this.nodes.dbAlias,
-          disabled: true,
-          href: '#'
-        },
-        {
-          text: this.nodes.view_name + ' (view)',
-          disabled: true,
-          href: '#'
-        }]" divider=">" small>
-          <template v-slot:divider>
-            <v-icon small color="grey lighten-2">forward</v-icon>
+        <v-breadcrumbs
+          :items="[{
+                     text: nodes.env,
+                     disabled: true,
+                     href: '#'
+                   },{
+                     text: nodes.dbAlias,
+                     disabled: true,
+                     href: '#'
+                   },
+                   {
+                     text: nodes.view_name + ' (view)',
+                     disabled: true,
+                     href: '#'
+                   }]"
+          divider=">"
+          small
+        >
+          <template #divider>
+            <v-icon small color="grey lighten-2">
+              forward
+            </v-icon>
           </template>
         </v-breadcrumbs>
       </v-toolbar-title>
-      <v-spacer></v-spacer>
-      <x-btn outlined tooltip="Reload View" small @click="loadEnv()" color="primary" icon="refresh">Reload</x-btn>
-      <x-btn outlined tooltip="Save Changes" :disabled="nodes.dbConnection.client === 'sqlite3' && !newView " small
-             @click="applyChanges()" color="primary" icon="save">Save
+      <v-spacer />
+      <x-btn
+        outlined
+        tooltip="Reload View"
+        small
+        color="primary"
+        icon="refresh"
+        @click="loadEnv()"
+      >
+        Reload
       </x-btn>
-      <x-btn outlined tooltip="Delete View" small @click="deleteView('showDialog')" color="error"
-             icon="mdi-delete-outline">Delete View
+      <x-btn
+        outlined
+        tooltip="Save Changes"
+        :disabled="nodes.dbConnection.client === 'sqlite3' && !newView "
+        small
+        color="primary"
+        icon="save"
+        @click="applyChanges()"
+      >
+        Save
+      </x-btn>
+      <x-btn
+        outlined
+        tooltip="Delete View"
+        small
+        color="error"
+        icon="mdi-delete-outline"
+        @click="deleteView('showDialog')"
+      >
+        Delete View
       </x-btn>
     </v-toolbar>
 
     <MonacoEditor
       v-if="view.view_definition != undefined"
       :code.sync="view.view_definition"
-      cssStyle="border:1px solid grey;height:500px; width:100%"
+      css-style="border:1px solid grey;height:500px; width:100%"
     />
 
     <dlgLabelSubmitCancel
       v-if="dialogShow"
-      :dialogShow="dialogShow"
-      :actionsMtd="deleteView"
-      cssStyle="height:300px"
+      :dialog-show="dialogShow"
+      :actions-mtd="deleteView"
+      css-style="height:300px"
       heading="Click Submit to Delete the View"
       type="error"
     />
@@ -49,30 +79,30 @@
 </template>
 
 <script>
-import {mapGetters, mapActions} from "vuex";
+import { mapActions } from 'vuex'
 
-import MonacoEditor from "../../monaco/Monaco";
-import dlgLabelSubmitCancel from "../../utils/dlgLabelSubmitCancel";
+import MonacoEditor from '../../monaco/Monaco'
+import dlgLabelSubmitCancel from '../../utils/dlgLabelSubmitCancel'
 
 export default {
-  components: {MonacoEditor, dlgLabelSubmitCancel},
-  data() {
+  components: { MonacoEditor, dlgLabelSubmitCancel },
+  data () {
     return {
       view: {},
-      oldViewDefination: "",
-      newView: this.nodes.newView ? true : false,
+      oldViewDefination: '',
+      newView: !!this.nodes.newView,
       dialogShow: false
-    };
+    }
   },
   computed: {},
   methods: {
     ...mapActions({
-      loadViewsFromChildTreeNode: "project/loadViewsFromChildTreeNode",
-      loadViewsFromParentTreeNode: "project/loadViewsFromParentTreeNode",
-      removeViewTab: "tabs/removeViewTab"
+      loadViewsFromChildTreeNode: 'project/loadViewsFromChildTreeNode',
+      loadViewsFromParentTreeNode: 'project/loadViewsFromParentTreeNode',
+      removeViewTab: 'tabs/removeViewTab'
     }),
 
-    async handleKeyDown({metaKey, key, altKey, shiftKey, ctrlKey}) {
+    async handleKeyDown ({ metaKey, key, altKey, shiftKey, ctrlKey }) {
       console.log(metaKey, key, altKey, shiftKey, ctrlKey)
       // cmd + s -> save
       // cmd + l -> reload
@@ -82,29 +112,27 @@ export default {
 
       switch ([metaKey, key].join('_')) {
         case 'true_s' :
-          await this.applyChanges();
-          break;
+          await this.applyChanges()
+          break
         case 'true_l' :
-          await this.loadEnv();
-          break;
+          await this.loadEnv()
+          break
         // case 'true_n' :
         //   this.addColumn();
         //   break;
         case 'true_d' :
-          await this.deleteView('showDialog');
-          break;
-
+          await this.deleteView('showDialog')
+          break
       }
     },
 
-    async loadEnv() {
-
+    async loadEnv () {
       try {
-        this.$store.commit('notification/MutToggleProgressBar', true);
+        this.$store.commit('notification/MutToggleProgressBar', true)
         if (this.newView) {
-          this.view = {view_name: this.nodes.view_name, view_definition: ""};
-          this.$store.commit('notification/MutToggleProgressBar', false);
-          return;
+          this.view = { view_name: this.nodes.view_name, view_definition: '' }
+          this.$store.commit('notification/MutToggleProgressBar', false)
+          return
         }
         // // console.log("env: this.env", this.env, this.dbAlias);
         // const client = await this.sqlMgr.projectGetSqlClient({
@@ -113,7 +141,6 @@ export default {
         // });
         // const result = await client.viewRead({view_name: this.nodes.view_name});
 
-
         // const result = await this.sqlMgr.sqlOp({
         //   env: this.nodes.env,
         //   dbAlias: this.nodes.dbAlias
@@ -122,47 +149,43 @@ export default {
         const result = await this.$store.dispatch('sqlMgr/ActSqlOp', [{
           env: this.nodes.env,
           dbAlias: this.nodes.dbAlias
-        }, 'viewRead', {view_name: this.nodes.view_name}])
-
-        console.log("view read", result);
-        this.view = {...result.data.list[0]};
-        this.oldViewDefination = `${this.view.view_definition}` + ''; //for migration statements
+        }, 'viewRead', { view_name: this.nodes.view_name }])
 
+        console.log('view read', result)
+        this.view = { ...result.data.list[0] }
+        this.oldViewDefination = `${this.view.view_definition}` + '' // for migration statements
       } catch (e) {
-        console.log(e);
+        console.log(e)
       } finally {
-        this.$store.commit('notification/MutToggleProgressBar', false);
+        this.$store.commit('notification/MutToggleProgressBar', false)
       }
-
     },
-    async applyChanges() {
+    async applyChanges () {
       try {
         if (this.newView) {
-
           const result = await this.$store.dispatch('sqlMgr/ActSqlOpPlus', [
             {
               env: this.nodes.env,
               dbAlias: this.nodes.dbAlias
             },
-            "viewCreate",
+            'viewCreate',
             {
               view_name: this.nodes.view_name,
               _tn: this.nodes._tn,
               view_definition: this.view.view_definition
             }]
-          );
-
+          )
 
           await this.loadViewsFromChildTreeNode({
             _nodes: {
               ...this.nodes
             }
-          });
-          console.log("create view result", result);
-          this.newView = false;
-          this.oldViewDefination = `${this.view.view_definition}` + ''; //for migration statments
-          this.$toast.success('View created successfully').goAway(3000);
-          delete this.nodes.newView;
+          })
+          console.log('create view result', result)
+          this.newView = false
+          this.oldViewDefination = `${this.view.view_definition}` + '' // for migration statments
+          this.$toast.success('View created successfully').goAway(3000)
+          delete this.nodes.newView
           this.$emit('created')
         } else {
           const result = await this.$store.dispatch('sqlMgr/ActSqlOpPlus', [
@@ -170,86 +193,82 @@ export default {
               env: this.nodes.env,
               dbAlias: this.nodes.dbAlias
             },
-            "viewUpdate",
+            'viewUpdate',
             {
               view_name: this.nodes.view_name,
               view_definition: this.view.view_definition,
               oldViewDefination: this.oldViewDefination
             }]
-          );
-          this.$toast.success('View updated successfully').goAway(3000);
-          this.oldViewDefination = `${this.view.view_definition}` + ''; //for migration statments
-          console.log("update view result", result);
+          )
+          this.$toast.success('View updated successfully').goAway(3000)
+          this.oldViewDefination = `${this.view.view_definition}` + '' // for migration statments
+          console.log('update view result', result)
         }
-
       } catch (e) {
-        de
-        this.$toast.error('Error while saving view').goAway(3000);
-        throw e;
+        this.$toast.error('Error while saving view').goAway(3000)
+        throw e
       }
-
     },
-    async deleteView(action = "") {
+    async deleteView (action = '') {
       try {
-        if (action === "showDialog") {
-          this.dialogShow = true;
-        } else if (action === "hideDialog") {
-          this.dialogShow = false;
+        if (action === 'showDialog') {
+          this.dialogShow = true
+        } else if (action === 'hideDialog') {
+          this.dialogShow = false
         } else {
-          const result = await this.$store.dispatch('sqlMgr/ActSqlOpPlus', [
+          await this.$store.dispatch('sqlMgr/ActSqlOpPlus', [
             {
               env: this.nodes.env,
               dbAlias: this.nodes.dbAlias
             },
-            "viewDelete",
+            'viewDelete',
             {
               view_name: this.nodes.view_name,
               oldViewDefination: this.oldViewDefination
             }
-          ]);
+          ])
           this.removeViewTab({
             env: this.nodes.env,
             dbAlias: this.nodes.dbAlias,
             view_name: this.nodes.view_name
-          });
+          })
           await this.loadViewsFromParentTreeNode({
             _nodes: {
               ...this.nodes
             }
-          });
-          this.dialogShow = false;
+          })
+          this.dialogShow = false
 
-          this.$toast.success('View deleted successfully').goAway(3000);
+          this.$toast.success('View deleted successfully').goAway(3000)
         }
       } catch (e) {
-        this.$toast.error('View deleted failed').goAway(3000);
-        throw e;
+        this.$toast.error('View deleted failed').goAway(3000)
+        throw e
       }
-
     }
   },
 
-  beforeCreated() {
+  beforeCreated () {
   },
-  async created() {
-    await this.loadEnv();
-  },
-  mounted() {
-  },
-  beforeDestroy() {
-  },
-  destroy() {
-  },
-  validate({params}) {
-    return true;
-  },
-  head() {
-    return {};
-  },
-  props: ["nodes"],
   watch: {},
-  directives: {}
-};
+  async created () {
+    await this.loadEnv()
+  },
+  mounted () {
+  },
+  beforeDestroy () {
+  },
+  destroy () {
+  },
+  directives: {},
+  validate ({ params }) {
+    return true
+  },
+  head () {
+    return {}
+  },
+  props: ['nodes']
+}
 </script>
 
 <style scoped>