feat: add node debug info tab

package.json

@@ -91,6 +91,7 @@
   },
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
+    "@mdi/font": "^5.9.55",
     "@zwave-js/server": "^1.0.0-beta.4",
     "ansi_up": "^5.0.0",
     "app-root-path": "^3.0.0",

src/components/nodes-table/ExpandedNode.vue

@@ -4,6 +4,8 @@
       <v-tab key="node">Node</v-tab>
       <v-tab v-if="showHass" key="homeassistant">Home Assistant</v-tab>
       <v-tab key="groups">Groups</v-tab>
+      <v-tab key="debug">Debug Info</v-tab>
+
       <!-- TABS -->
       <v-tabs-items
         style="background: transparent; padding-bottom: 10px;"
@@ -29,6 +31,19 @@
         <v-tab-item key="groups">
           <association-groups :node="node" :nodes="nodes" :socket="socket" />
         </v-tab-item>
+
+        <!-- TAB DEBUG INFO -->
+        <v-tab-item key="debug">
+          <v-textarea
+            class="mx-2"
+            rows="10"
+            append-icon="mdi-content-copy"
+            v-model="nodeJson"
+            readonly
+            ref="nodeJsonContent"
+            @click:append="copyText"
+          ></v-textarea>
+        </v-tab-item>
       </v-tabs-items>
     </v-tabs>
   </td>
@@ -57,6 +72,9 @@ export default {
   },
   computed: {
     ...mapGetters(['gateway']),
+    nodeJson () {
+      return JSON.stringify(this.node, null, 2)
+    },
     showHass () {
       console.log(Object.keys(this.node.hassDevices))
       return (
@@ -70,6 +88,15 @@ export default {
     return {
       currentTab: 0
     }
+  },
+  methods: {
+    copyText () {
+      const textToCopy = this.$refs.nodeJsonContent.$el.querySelector(
+        'textarea'
+      )
+      textToCopy.select()
+      document.execCommand('copy')
+    }
   }
 }
 </script>

src/plugins/vuetify.js

@@ -4,6 +4,7 @@ import Vue from 'vue'
 import Vuetify from 'vuetify'
 import 'vuetify/dist/vuetify.min.css'
 import 'material-design-icons-iconfont/dist/material-design-icons.css' // Ensure you are using css-loader
+import '@mdi/font/css/materialdesignicons.css' // Ensure you are using css-loader
 
 Vue.use(Vuetify)