migrate to typescript

src/components/desktop/TrendsChart.vue

@@ -10,13 +10,14 @@ import { mapStores } from 'pinia';
 import { useSettingsStore } from '@/stores/setting.js';
 import { useUserStore } from '@/stores/user.js';
 
-import colorConstants from '@/consts/color.js';
+import { DEFAULT_ICON_COLOR, DEFAULT_CHART_COLORS } from '@/consts/color.ts';
 import datetimeConstants from '@/consts/datetime.js';
 import statisticsConstants from '@/consts/statistics.js';
+import { ThemeType } from '@/core/theme.ts';
 import {
     isArray,
     isNumber
-} from '@/lib/common.js';
+} from '@/lib/common.ts';
 import {
     getYearMonthFirstUnixTime,
     getYearMonthLastUnixTime,
@@ -59,7 +60,7 @@ export default {
     computed: {
         ...mapStores(useSettingsStore, useUserStore),
         isDarkMode() {
-            return this.globalTheme.global.name.value === 'dark';
+            return this.globalTheme.global.name.value === ThemeType.Dark;
         },
         itemsMap: function () {
             const map = {};
@@ -167,7 +168,7 @@ export default {
                     id: (this.idField && item[this.idField]) ? item[this.idField] : this.getItemName(item[this.nameField]),
                     name: (this.idField && item[this.idField]) ? item[this.idField] : this.getItemName(item[this.nameField]),
                     itemStyle: {
-                        color: this.getColor(item[this.colorField] ? item[this.colorField] : colorConstants.defaultChartColors[i % colorConstants.defaultChartColors.length]),
+                        color: this.getColor(item[this.colorField] ? item[this.colorField] : DEFAULT_CHART_COLORS[i % DEFAULT_CHART_COLORS.length]),
                     },
                     selected: true,
                     type: 'line',
@@ -212,7 +213,7 @@ export default {
 
             const maxValueText = this.getDisplayCurrency(maxValue, this.defaultCurrency);
             const minValueText = this.getDisplayCurrency(minValue, this.defaultCurrency);
-            let maxLengthText = maxValueText.length > minValueText.length ? maxValueText : minValueText;
+            const maxLengthText = maxValueText.length > minValueText.length ? maxValueText : minValueText;
 
             const canvas = document.createElement('canvas');
             const context = canvas.getContext('2d');
@@ -387,7 +388,7 @@ export default {
             });
         },
         getColor: function (color) {
-            if (color && color !== colorConstants.defaultColor) {
+            if (color && color !== DEFAULT_ICON_COLOR) {
                 color = '#' + color;
             }