fix: types

src/assets/img/icons.ts

@@ -30,13 +30,13 @@ function validateFileName(str: string): string | undefined {
 Object.keys(requireComponent).forEach((filePath: string) => {
   const fileName = validateFileName(filePath);
   if (fileName) {
-    result[fileName] = (requireComponent as { [key: string]: any })[filePath].default;
+    result[fileName] = (requireComponent as Indexable)[filePath].default;
   }
 });
 Object.keys(requireTool).forEach((filePath: string) => {
   const fileName = validateFileName(filePath);
   if (fileName) {
-    t[fileName] = (requireTool as { [key: string]: any })[filePath].default;
+    t[fileName] = (requireTool as Indexable)[filePath].default;
   }
 });
 

src/components/DateCalendar.vue

@@ -162,7 +162,7 @@ limitations under the License. -->
   import { computed, onMounted, watch, reactive } from "vue";
   import type { PropType } from "vue";
   import { useI18n } from "vue-i18n";
-  /*global defineProps, defineEmits */
+  /*global defineProps, defineEmits, Indexable, Recordable */
   const emit = defineEmits(["input", "setDates", "ok"]);
   const { t } = useI18n();
   const props = defineProps({
@@ -191,7 +191,7 @@ limitations under the License. -->
     minute: 0,
     second: 0,
   });
-  const get = (time: Date): { [key: string]: any } => {
+  const get = (time: Date): Indexable => {
     return {
       year: time.getFullYear(),
       month: time.getMonth(),
@@ -390,7 +390,7 @@ limitations under the License. -->
       state.year--;
     }
   };
-  const is = (e: any) => {
+  const is = (e: Recordable) => {
     return e.target.className.indexOf(`${state.pre}-date-disabled`) === -1;
   };
   const ok = (info: any) => {

src/components/Graph.vue

@@ -46,7 +46,7 @@ limitations under the License. -->
   import Trace from "@/views/dashboard/related/trace/Index.vue";
   import associateProcessor from "@/hooks/useAssociateProcessor";
 
-  /*global Nullable, defineProps, defineEmits*/
+  /*global Nullable, defineProps, defineEmits, Indexable*/
   const emits = defineEmits(["select"]);
   const { t } = useI18n();
   const chartRef = ref<Nullable<HTMLDivElement>>(null);
@@ -62,7 +62,7 @@ limitations under the License. -->
     height: { type: String, default: "100%" },
     width: { type: String, default: "100%" },
     option: {
-      type: Object as PropType<{ [key: string]: any }>,
+      type: Object as PropType<Indexable>,
       default: () => ({}),
     },
     filters: {

src/components/SelectSingle.vue

@@ -76,7 +76,7 @@ limitations under the License. -->
   function handleClick() {
     visible.value = false;
   }
-  function setPopper(event: any) {
+  function setPopper(event: MouseEvent) {
     event.stopPropagation();
     visible.value = !visible.value;
   }

src/components/Selector.vue

@@ -40,7 +40,7 @@ limitations under the License. -->
   //   value: string | number;
   // }
 
-  /*global  defineProps, defineEmits*/
+  /*global  defineProps, defineEmits, Indexable*/
   const emit = defineEmits(["change", "query"]);
   const props = defineProps({
     options: {
@@ -53,7 +53,7 @@ limitations under the License. -->
       default: () => [],
     },
     value: {
-      type: [Array, String, Number, undefined] as PropType<any>,
+      type: [Array, String, Number, undefined] as PropType<unknown>,
       default: () => [],
     },
     size: { type: null, default: "default" },
@@ -71,7 +71,7 @@ limitations under the License. -->
 
   const selected = ref<string[] | string>(props.value);
   function changeSelected() {
-    const options = props.options.filter((d: any) =>
+    const options = props.options.filter((d: Indexable) =>
       props.multiple ? selected.value.includes(d.value) : selected.value === d.value,
     );
     emit("change", options);

src/components/TimePicker.vue

@@ -112,7 +112,7 @@ limitations under the License. -->
   import { useI18n } from "vue-i18n";
   import DateCalendar from "./DateCalendar.vue";
   import { useTimeoutFn } from "@/hooks/useTimeout";
-  /*global defineProps, defineEmits */
+  /*global defineProps, defineEmits*/
   const datepicker = ref(null);
   const { t } = useI18n();
   const show = ref<boolean>(false);
@@ -241,7 +241,7 @@ limitations under the License. -->
     }
     dates.value[0] = d;
   };
-  const dc = (e: any) => {
+  const dc = (e: MouseEvent) => {
     show.value = (datepicker.value as any).contains(e.target) && !props.disabled;
   };
   const quickPick = (type: string) => {

src/components/index.ts

@@ -23,7 +23,7 @@ import Radio from "./Radio.vue";
 import SelectSingle from "./SelectSingle.vue";
 import VueGridLayout from "vue-grid-layout";
 
-const components: { [key: string]: any } = {
+const components: Indexable = {
   Icon,
   TimePicker,
   VueGridLayout,

src/hooks/data.ts

@@ -67,7 +67,7 @@ screenMap.set(sizeEnum.LG, screenEnum.LG);
 screenMap.set(sizeEnum.XL, screenEnum.XL);
 screenMap.set(sizeEnum.XXL, screenEnum.XXL);
 
-export const RespFields: any = {
+export const RespFields: Indexable = {
   readMetricsValues: `{
     label
     values {

src/hooks/useAssociateProcessor.ts

@@ -19,7 +19,7 @@ import dateFormatStep from "@/utils/dateFormat";
 import getLocalTime from "@/utils/localtime";
 import type { EventParams } from "@/types/app";
 
-export default function associateProcessor(props: any) {
+export default function associateProcessor(props: Indexable) {
   function eventAssociate() {
     if (!props.filters) {
       return;
@@ -85,7 +85,7 @@ export default function associateProcessor(props: any) {
     const queryOrder = relatedTrace.queryOrder;
     const latency = relatedTrace.latency;
     const series = props.option.series || [];
-    const item: any = {
+    const item: Indexable = {
       duration,
       queryOrder,
       status,

src/hooks/useBreakpoint.ts

@@ -32,7 +32,7 @@ export interface CreateCallbackParams {
   sizeEnum: typeof sizeEnum;
 }
 
-export function useBreakpoint(): any {
+export function useBreakpoint(): Indexable {
   return {
     screenRef: computed(() => unref(globalScreenRef)),
     widthRef: globalWidthRef,
@@ -41,7 +41,7 @@ export function useBreakpoint(): any {
   };
 }
 
-export function createBreakpointListen(fn?: (opt: CreateCallbackParams) => void): any {
+export function createBreakpointListen(fn?: (opt: CreateCallbackParams) => void): Indexable {
   const screenRef = ref<sizeEnum>(sizeEnum.XL || "");
   const realWidthRef = ref(window.innerWidth);
 

src/hooks/useDashboardsSession.ts

@@ -59,7 +59,7 @@ export default function getDashboard(param?: { name: string; layer: string; enti
     if (targetTabIndex[1] === undefined) {
       container = document.querySelector(".ds-main");
     } else {
-      const w = widgets.find((d: any) => d.id === targetTabIndex[0]);
+      const w = widgets.find((d: Indexable) => d.id === targetTabIndex[0]);
       container = document.querySelector(".tab-layout");
       const layout: Nullable<Element> = document.querySelector(".ds-main");
       if (w && layout) {

src/hooks/useEcharts.ts

@@ -43,7 +43,7 @@ export type ECOption = echarts.ComposeOption<
   | SankeySeriesOption
 >;
 
-export function useECharts(elRef: Ref<HTMLDivElement>, theme: "light" | "dark" | "default" = "default"): any {
+export function useECharts(elRef: Ref<HTMLDivElement>, theme: "light" | "dark" | "default" = "default"): Indexable {
   const getDarkMode = computed(() => {
     return theme === "default" ? "light" : theme;
   });

src/hooks/useEventListener.ts

@@ -20,7 +20,7 @@ import { useThrottleFn, useDebounceFn } from "@vueuse/core";
 
 export type RemoveEventFn = () => void;
 export interface UseEventParams {
-  el?: Element | Ref<Element | undefined> | Window | any;
+  el?: Element | Ref<Element | undefined> | Window | Recordable;
   name: string;
   listener: EventListener;
   options?: boolean | AddEventListenerOptions;

src/hooks/useLegendProcessor.ts

@@ -39,7 +39,7 @@ export default function useLegendProcess(legend?: LegendOptions) {
   }
   function aggregations(data: { [key: string]: number[] }, intervalTime: string[]) {
     const source: { [key: string]: unknown }[] = [];
-    const keys = Object.keys(data || {}).filter((i: any) => Array.isArray(data[i]) && data[i].length);
+    const keys = Object.keys(data || {}).filter((i: string) => Array.isArray(data[i]) && data[i].length);
     const headers = [];
 
     for (const [key, value] of keys.entries()) {

src/hooks/useListConfig.ts

@@ -15,7 +15,7 @@
  * limitations under the License.
  */
 import { MetricQueryTypes, Calculations } from "./data";
-export function useListConfig(config: any, index: string) {
+export function useListConfig(config: Indexable, index: string) {
   const i = Number(index);
   const types = [Calculations.Average, Calculations.ApdexAvg, Calculations.PercentageAvg];
   const calculation = config.metricConfig && config.metricConfig[i] && config.metricConfig[i].calculation;

src/hooks/useMetricsProcessor.ts

@@ -24,7 +24,7 @@ import type { Instance, Endpoint, Service } from "@/types/selector";
 import type { MetricConfigOpt } from "@/types/dashboard";
 import { MetricCatalog } from "@/views/dashboard/data";
 
-export function useQueryProcessor(config: any) {
+export function useQueryProcessor(config: Indexable) {
   if (!(config.metrics && config.metrics[0])) {
     return;
   }
@@ -126,7 +126,7 @@ export function useQueryProcessor(config: any) {
   };
 }
 export function useSourceProcessor(
-  resp: { errors: string; data: { [key: string]: any } },
+  resp: { errors: string; data: Indexable },
   config: {
     metrics: string[];
     metricTypes: string[];
@@ -181,7 +181,7 @@ export function useSourceProcessor(
     }
     if (type === MetricQueryTypes.READHEATMAP) {
       const resVal = Object.values(resp.data)[0] || {};
-      const nodes = [] as any;
+      const nodes = [] as Indexable[];
       if (!(resVal && resVal.values)) {
         source[m] = { nodes: [] };
         return;
@@ -191,7 +191,7 @@ export function useSourceProcessor(
 
         nodes.push(...grids);
       });
-      let buckets = [] as any;
+      let buckets = [] as Indexable[];
       if (resVal.buckets.length) {
         buckets = [resVal.buckets[0].min, ...resVal.buckets.map((item: { min: string; max: string }) => item.max)];
       }
@@ -204,7 +204,7 @@ export function useSourceProcessor(
 }
 
 export function useQueryPodsMetrics(
-  pods: Array<Instance | Endpoint | Service | any>,
+  pods: Array<(Instance | Endpoint | Service) & Indexable>,
   config: {
     metrics: string[];
     metricTypes: string[];
@@ -227,7 +227,7 @@ export function useQueryPodsMetrics(
   };
   const variables: string[] = [`$duration: Duration!`];
   const currentService = selectorStore.currentService || {};
-  const fragmentList = pods.map((d: (Instance | Endpoint | Service) & { normal: boolean }, index: number) => {
+  const fragmentList = pods.map((d: (Instance | Endpoint | Service) & Indexable, index: number) => {
     const param = {
       scope,
       serviceName: scope === "Service" ? d.label : currentService.label,
@@ -262,13 +262,13 @@ export function useQueryPodsMetrics(
 
 export function usePodsSource(
   pods: Array<Instance | Endpoint>,
-  resp: { errors: string; data: { [key: string]: any } },
+  resp: { errors: string; data: Indexable },
   config: {
     metrics: string[];
     metricTypes: string[];
     metricConfig: MetricConfigOpt[];
   },
-): any {
+): Indexable {
   if (resp.errors) {
     ElMessage.error(resp.errors);
     return {};
@@ -276,7 +276,7 @@ export function usePodsSource(
   const names: string[] = [];
   const metricConfigArr: MetricConfigOpt[] = [];
   const metricTypesArr: string[] = [];
-  const data = pods.map((d: Instance | any, idx: number) => {
+  const data = pods.map((d: Instance & Indexable, idx: number) => {
     config.metrics.map((name: string, index: number) => {
       const c: any = (config.metricConfig && config.metricConfig[index]) || {};
       const key = name + idx + index;
@@ -424,7 +424,7 @@ export function aggregation(val: number, config: { calculation?: string }): numb
   return data;
 }
 
-export async function useGetMetricEntity(metric: string, metricType: any) {
+export async function useGetMetricEntity(metric: string, metricType: MetricQueryTypes) {
   if (!metric || !metricType) {
     return;
   }
@@ -441,7 +441,7 @@ export async function useGetMetricEntity(metric: string, metricType: any) {
       return;
     }
     const c: string = res.data.metrics[0].catalog;
-    catalog = (MetricCatalog as any)[c];
+    catalog = (MetricCatalog as Indexable)[c];
   }
 
   return catalog;

src/layout/components/NavBar.vue

@@ -47,6 +47,7 @@ limitations under the License. -->
   import { useAppStoreWithOut } from "@/store/modules/app";
   import { ElMessage } from "element-plus";
 
+  /*global Indexable */
   const { t } = useI18n();
   const appStore = useAppStoreWithOut();
   const route = useRoute();
@@ -65,7 +66,7 @@ limitations under the License. -->
     appStore.setDuration(timeFormat(dates));
   }
 
-  function changeTimeRange(val: Date[] | any) {
+  function changeTimeRange(val: Date[]) {
     timeRange.value = val[1].getTime() - val[0].getTime() > 60 * 24 * 60 * 60 * 1000 ? 1 : 0;
     if (timeRange.value) {
       return;
@@ -86,7 +87,7 @@ limitations under the License. -->
     }
   }
   function resetDuration() {
-    const { duration }: any = route.params;
+    const { duration }: Indexable = route.params;
     if (duration) {
       const d = JSON.parse(duration);
 

src/types/global.d.ts

@@ -49,7 +49,9 @@ declare global {
 
   declare type Nullable<T> = T | null;
   declare type NonNullable<T> = T extends null | undefined ? never : T;
+  // String type object
   declare type Recordable<T = any> = Record<string, T>;
+  // Object of read-only string type
   declare type ReadonlyRecordable<T = any> = {
     readonly [key: string]: T;
   };
@@ -108,6 +110,11 @@ declare global {
     }
   }
 }
+type AnyNormalFunction = (...arg: any) => any;
+
+type AnyPromiseFunction = (...arg: any) => PromiseLike<any>;
+
+type AnyFunction = AnyNormalFunction | AnyPromiseFunction;
 
 declare module "vue" {
   export type JSXComponent<Props = any> = { new (): ComponentPublicInstance<Props> } | FunctionalComponent<Props>;