Initial commit

components/HCV/index.vue

@@ -0,0 +1,74 @@
+<template>
+  <div ref="chart"></div>
+</template>
+
+<script>
+
+import { copyObject } from './utils';
+import Highcharts from 'highcharts';
+
+export default {
+  beforeDestroy: () => this?.chart?.destroy(),
+  data(){
+    return {
+      chart: null,
+    }
+  },
+  props: {
+    constructorType: {
+      type: String,
+      default: 'chart'
+    },
+    options: {
+      type: Object,
+      required: true
+    },
+    callback: Function,
+    updateArgs: {
+      type: Array,
+      default: () => [true, true]
+    },
+    highcharts: {
+      type: Object
+    },
+    deepCopyOnUpdate: {
+      type: Boolean,
+      default: true
+    }
+  },
+  watch: {
+    options: {
+      handler(newValue) {
+        if (this.chart) {
+          this.chart.update(
+            copyObject(newValue, this.deepCopyOnUpdate),
+            ...this.updateArgs
+          );
+        }
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    debugger;
+    const HC = this.highcharts || Highcharts;
+
+    if (!HC[this.constructorType]) {
+      console.error(`'${this.constructorType}' constructor-type is incorrect. Sometimes this error is caused by the fact, that the corresponding module wasn't imported.`);
+      return;
+    }
+
+    if (!this.options) {
+      console.error('The "options" parameter was not passed.');
+      return;
+    }
+
+    this.chart = HC[this.constructorType](
+      this.$refs.chart,
+      copyObject(this.options, true), // Always pass the deep copy when generating a chart. #80
+      this.callback ? this.callback : null
+    );
+  }
+};
+
+</script>

components/HCV/utils.js

@@ -0,0 +1,31 @@
+import H from 'highcharts';
+
+const copyObject = function (original, copyArray) {
+    // Initialize the copy based on the original's type
+    const copy = H.isArray(original) ? [] : {};
+
+    // Callback function to iterate on array or object elements
+    function callback(value, key) {
+        // Copy the contents of objects
+        if (
+            H.isObject(value, !copyArray) &&
+            !H.isClass(value) &&
+            !H.isDOMElement(value)
+        ) {
+            copy[key] = copyObject(value, copyArray); // recursive call
+        } else {
+            // Primitives are copied over directly
+            copy[key] = value;
+        }
+    }
+
+    if (H.isArray(original)) {
+        original.forEach((item, index) => callback(item, index));
+    } else {
+        H.objectEach(original, callback);
+    }
+
+    return copy;
+};
+
+export { copyObject };