From 9035fd191e4e8d954f42b3a4cd1e80ec70b7cbb6 Mon Sep 17 00:00:00 2001
From: vben <anncwb@126.com>
Date: Fri, 13 Aug 2021 00:12:51 +0800
Subject: [PATCH] fix(types): fix some type errors

---
 src/components/FlowChart/src/FlowChart.vue           |  7 ++++---
 src/components/Loading/src/useLoading.ts             |  2 +-
 src/components/Preview/src/Functional.vue            | 12 ++++++------
 src/components/Table/src/BasicTable.vue              |  4 ++--
 .../Table/src/components/settings/ColumnSetting.vue  |  2 +-
 src/components/Table/src/hooks/useTableScroll.ts     |  1 +
 src/hooks/core/useRefs.ts                            |  5 +++--
 src/hooks/event/useEventListener.ts                  |  4 +---
 src/hooks/web/useECharts.ts                          | 10 ++++------
 src/utils/is.ts                                      |  2 +-
 10 files changed, 24 insertions(+), 25 deletions(-)

diff --git a/src/components/FlowChart/src/FlowChart.vue b/src/components/FlowChart/src/FlowChart.vue
index 8629b2607..dda2e3e44 100644
--- a/src/components/FlowChart/src/FlowChart.vue
+++ b/src/components/FlowChart/src/FlowChart.vue
@@ -8,6 +8,7 @@
   </div>
 </template>
 <script lang="ts">
+  import type { Ref } from 'vue';
   import type { Definition } from '@logicflow/core';
   import { defineComponent, ref, onMounted, unref, nextTick, computed, watch } from 'vue';
   import FlowChartToolbar from './FlowChartToolbar.vue';
@@ -46,10 +47,10 @@
       },
     },
     setup(props) {
-      const lfElRef = ref<ElRef>(null);
-      const graphData = ref<Recordable>({});
+      const lfElRef = ref(null);
+      const graphData = ref({});
 
-      const lfInstance = ref<Nullable<LogicFlow>>(null);
+      const lfInstance = ref(null) as Ref<LogicFlow | null>;
 
       const { prefixCls } = useDesign('flow-chart');
       const appStore = useAppStore();
diff --git a/src/components/Loading/src/useLoading.ts b/src/components/Loading/src/useLoading.ts
index 3f8edefab..72238c804 100644
--- a/src/components/Loading/src/useLoading.ts
+++ b/src/components/Loading/src/useLoading.ts
@@ -32,7 +32,7 @@ export function useLoading(
   const instance = createLoading(props, undefined, true);
 
   const open = (): void => {
-    const t = unref(target);
+    const t = unref(target as Ref<ElRef>);
     if (!t) return;
     instance.open(t);
   };
diff --git a/src/components/Preview/src/Functional.vue b/src/components/Preview/src/Functional.vue
index 4a5e821b9..8fdab6657 100644
--- a/src/components/Preview/src/Functional.vue
+++ b/src/components/Preview/src/Functional.vue
@@ -1,6 +1,5 @@
 <script lang="tsx">
   import { defineComponent, ref, unref, computed, reactive, watchEffect } from 'vue';
-  import { Props } from './typing';
   import { CloseOutlined, LeftOutlined, RightOutlined } from '@ant-design/icons-vue';
   import resumeSvg from '/@/assets/svg/preview/resume.svg';
   import rotateSvg from '/@/assets/svg/preview/p-rotate.svg';
@@ -57,7 +56,7 @@
     name: 'ImagePreview',
     props,
     emits: ['img-load', 'img-error'],
-    setup(props: Props, { expose, emit }) {
+    setup(props, { expose, emit }) {
       interface stateInfo {
         scale: number;
         rotate: number;
@@ -117,8 +116,9 @@
       }
 
       const getScaleStep = computed(() => {
-        if (props.scaleStep > 0 && props.scaleStep < 100) {
-          return props.scaleStep / 100;
+        const scaleStep = props?.scaleStep ?? 0;
+        if (scaleStep ?? (0 > 0 && scaleStep < 100)) {
+          return scaleStep / 100;
         } else {
           return imgState.imgScale / 10;
         }
@@ -164,7 +164,7 @@
         img.src = url;
         img.onload = (e: Event) => {
           if (imgState.currentUrl !== url) {
-            const ele: HTMLElement[] = e.composedPath();
+            const ele: any[] = e.composedPath();
             if (props.rememberState) {
               // 保存当前图片的缩放信息
               stateMap.set(imgState.currentUrl, {
@@ -244,7 +244,7 @@
         setRotate: (rotate: number) => {
           imgState.imgRotate = rotate;
         },
-      } as PreviewActions);
+      });
 
       // 上一页下一页
       function handleChange(direction: 'left' | 'right') {
diff --git a/src/components/Table/src/BasicTable.vue b/src/components/Table/src/BasicTable.vue
index 39739b0ba..b103e765f 100644
--- a/src/components/Table/src/BasicTable.vue
+++ b/src/components/Table/src/BasicTable.vue
@@ -91,10 +91,10 @@
       'columns-change',
     ],
     setup(props, { attrs, emit, slots, expose }) {
-      const tableElRef = ref<ComponentRef>(null);
+      const tableElRef = ref(null);
       const tableData = ref<Recordable[]>([]);
 
-      const wrapRef = ref<Nullable<HTMLDivElement>>(null);
+      const wrapRef = ref(null);
       const innerPropsRef = ref<Partial<BasicTableProps>>();
 
       const { prefixCls } = useDesign('basic-table');
diff --git a/src/components/Table/src/components/settings/ColumnSetting.vue b/src/components/Table/src/components/settings/ColumnSetting.vue
index 4f5d89eb0..e1d64d9f5 100644
--- a/src/components/Table/src/components/settings/ColumnSetting.vue
+++ b/src/components/Table/src/components/settings/ColumnSetting.vue
@@ -282,7 +282,7 @@
         nextTick(() => {
           const columnListEl = unref(columnListRef);
           if (!columnListEl) return;
-          const el = columnListEl.$el;
+          const el = columnListEl.$el as any;
           if (!el) return;
           // Drag and drop sort
           const { initSortable } = useSortable(el, {
diff --git a/src/components/Table/src/hooks/useTableScroll.ts b/src/components/Table/src/hooks/useTableScroll.ts
index 75c7c6195..e4931d04e 100644
--- a/src/components/Table/src/hooks/useTableScroll.ts
+++ b/src/components/Table/src/hooks/useTableScroll.ts
@@ -66,6 +66,7 @@ export function useTableScroll(
 
     if (!bodyEl) {
       bodyEl = tableEl.querySelector('.ant-table-body');
+      if (!bodyEl) return;
     }
 
     const hasScrollBarY = bodyEl.scrollHeight > bodyEl.clientHeight;
diff --git a/src/hooks/core/useRefs.ts b/src/hooks/core/useRefs.ts
index 703ecadf7..180bb1497 100644
--- a/src/hooks/core/useRefs.ts
+++ b/src/hooks/core/useRefs.ts
@@ -1,7 +1,8 @@
-import { ref, onBeforeUpdate, Ref } from 'vue';
+import type { Ref } from 'vue';
+import { ref, onBeforeUpdate } from 'vue';
 
 export function useRefs(): [Ref<HTMLElement[]>, (index: number) => (el: HTMLElement) => void] {
-  const refs = ref<HTMLElement[]>([]);
+  const refs = ref([]) as Ref<HTMLElement[]>;
 
   onBeforeUpdate(() => {
     refs.value = [];
diff --git a/src/hooks/event/useEventListener.ts b/src/hooks/event/useEventListener.ts
index a43f7c473..823f1aef7 100644
--- a/src/hooks/event/useEventListener.ts
+++ b/src/hooks/event/useEventListener.ts
@@ -1,10 +1,8 @@
 import type { Ref } from 'vue';
-
 import { ref, watch, unref } from 'vue';
 import { useThrottleFn, useDebounceFn } from '@vueuse/core';
 
 export type RemoveEventFn = () => void;
-
 export interface UseEventParams {
   el?: Element | Ref<Element | undefined> | Window | any;
   name: string;
@@ -28,7 +26,7 @@ export function useEventListener({
   const isAddRef = ref(false);
 
   if (el) {
-    const element: Ref<Element> = ref(el as Element);
+    const element = ref(el as Element) as Ref<Element>;
 
     const handler = isDebounce ? useDebounceFn(listener, wait) : useThrottleFn(listener, wait);
     const realHandler = wait ? handler : listener;
diff --git a/src/hooks/web/useECharts.ts b/src/hooks/web/useECharts.ts
index 60335d04f..26be030d6 100644
--- a/src/hooks/web/useECharts.ts
+++ b/src/hooks/web/useECharts.ts
@@ -1,13 +1,11 @@
 import type { EChartsOption } from 'echarts';
 import type { Ref } from 'vue';
-
 import { useTimeoutFn } from '/@/hooks/core/useTimeout';
 import { tryOnUnmounted } from '@vueuse/core';
 import { unref, nextTick, watch, computed, ref } from 'vue';
 import { useDebounceFn } from '@vueuse/core';
 import { useEventListener } from '/@/hooks/event/useEventListener';
 import { useBreakpoint } from '/@/hooks/event/useBreakpoint';
-
 import echarts from '/@/utils/lib/echarts';
 import { useRootSetting } from '/@/hooks/setting/useRootSetting';
 
@@ -18,19 +16,19 @@ export function useECharts(
   const { getDarkMode } = useRootSetting();
   let chartInstance: echarts.ECharts | null = null;
   let resizeFn: Fn = resize;
-  const cacheOptions = ref<EChartsOption>({});
+  const cacheOptions = ref({}) as Ref<EChartsOption>;
   let removeResizeFn: Fn = () => {};
 
   resizeFn = useDebounceFn(resize, 200);
 
-  const getOptions = computed((): EChartsOption => {
+  const getOptions = computed(() => {
     if (getDarkMode.value !== 'dark') {
-      return cacheOptions.value;
+      return cacheOptions.value as EChartsOption;
     }
     return {
       backgroundColor: 'transparent',
       ...cacheOptions.value,
-    };
+    } as EChartsOption;
   });
 
   function initCharts(t = theme) {
diff --git a/src/utils/is.ts b/src/utils/is.ts
index 5b3ae08fb..d71fd9b65 100644
--- a/src/utils/is.ts
+++ b/src/utils/is.ts
@@ -84,7 +84,7 @@ export function isElement(val: unknown): val is Element {
   return isObject(val) && !!val.tagName;
 }
 
-export function isMap(val: unknown): val is Map {
+export function isMap(val: unknown): val is Map<any, any> {
   return is(val, 'Map');
 }