fixed damage-chart not scaling properly

src/components/DamageChart.vue

@@ -20,8 +20,27 @@ export default {
     const store = useStore()
 
     let myChart1, myChart2
-    const width = ref(window.innerWidth <= 1000 && window.innerWidth >= 751 ? window.innerWidth : 750)
+
-    const height = ref(window.innerWidth >= 751 ? width.value * 3 / 7.5 : window.innerWidth >= 501 && window.innerWidth <= 751 ? width.value * 3 / 6.5 : width.value * 3 / 5.5)
+    const getWindowWidth = () => {
+      const windowWidth = window.innerWidth
+      if (windowWidth <= 750)
+        return windowWidth
+      else
+        return 650
+    }
+
+    const setHeight = () => {
+      const windowWidth = getWindowWidth()
+      if (windowWidth >= 751)
+        return windowWidth * 3 / 7.5
+      else if (windowWidth >= 501 && windowWidth <= 750)
+        return windowWidth * 3 / 6.5
+      else
+        return windowWidth * 3 / 5.5
+    }
+
+    const width = ref(getWindowWidth())
+    const height = ref(setHeight())
 
     const dataArr = (stats, team, prop) => {
       if (['team', 'enemy', 'self'].indexOf(prop) > -1) {
@@ -140,16 +159,8 @@ export default {
 
     window.onresize = () => {
       if (window.innerWidth <= 750) {
-        width.value = window.innerWidth - 20
+        width.value = getWindowWidth() - 20
-        if (window.innerWidth <= 500) {
+        height.value = setHeight()
-          height.value = width.value * 3 / 5.5
-        }
-        if (window.innerWidth <= 750 && window.innerWidth >= 501) {
-          height.value = width.value * 3 / 6.5
-        }
-        if (window.innerWidth <= 1000 && window.innerWidth >= 751) {
-          height.value = width.value * 3 / 7.5
-        }
       }
 
       buildCharts()