chore: fix ts errors

mock/analysis.mock.ts

@@ -1,6 +1,6 @@
 import dayjs from 'dayjs';
 import type { Request, Response } from 'express';
-import type { AnalysisData, DataItem, RadarData } from './data';
+import type { AnalysisData, DataItem, RadarData } from '../src/pages/dashboard/analysis/data';
 
 // mock data
 const visitData: DataItem[] = [];

mock/workplace.mock.ts

@@ -1,6 +1,6 @@
-import { DataItem } from '@antv/g2plot/esm/interface/config';
 import dayjs from 'dayjs';
 import type { Request, Response } from 'express';
+import type { DataItem, OfflineDataType } from '../src/pages/dashboard/workplace/data.d';
 
 export type SearchDataType = {
   index: number;

package.json

@@ -65,7 +65,7 @@
     "cross-env": "^7.0.3",
     "express": "^4.21.1",
     "gh-pages": "^6.1.1",
-    "husky": "^9.1.6",
+    "husky": "^9.1.7",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
     "lint-staged": "^16.1.2",

src/pages/account/center/components/Applications/index.tsx

@@ -91,7 +91,8 @@ const Applications: React.FC = () => {
                 <ShareAltOutlined />
               </Tooltip>,
               <Dropdown
-                items={[
+                menu={{
+                  items: [
                     {
                       key: '1',
                       title: '1st menu item',
@@ -100,7 +101,8 @@ const Applications: React.FC = () => {
                       key: '2',
                       title: '2nd menu item',
                     },
-                ]}
+                  ],
+                }}
                 key="ellipsis"
               >
                 <EllipsisOutlined />

src/pages/account/center/components/AvatarList/index.tsx

@@ -20,6 +20,14 @@ export type AvatarListProps = {
     | React.ReactElement<AvatarItemProps>
     | React.ReactElement<AvatarItemProps>[];
 };
+
+const avatarSizeToClassName = (styles: any, size?: SizeType | 'mini') =>
+  classNames(styles.avatarItem, {
+    [styles.avatarItemLarge]: size === 'large',
+    [styles.avatarItemSmall]: size === 'small',
+    [styles.avatarItemMini]: size === 'mini',
+  });
+
 const Item: React.FC<AvatarItemProps> = ({
   src,
   size,
@@ -27,13 +35,7 @@ const Item: React.FC<AvatarItemProps> = ({
   onClick = () => {},
 }) => {
   const { styles } = useStyles();
-  const avatarSizeToClassName = (size?: SizeType | 'mini') =>
-    classNames(styles.avatarItem, {
-      [styles.avatarItemLarge]: size === 'large',
-      [styles.avatarItemSmall]: size === 'small',
-      [styles.avatarItemMini]: size === 'mini',
-    });
-  const cls = avatarSizeToClassName(size);
+  const cls = avatarSizeToClassName(styles, size);
   return (
     <li className={cls} onClick={onClick}>
       {tips ? (
@@ -67,7 +69,7 @@ const AvatarList: React.FC<AvatarListProps> & {
     }),
   );
   if (numToShow < numOfChildren) {
-    const cls = avatarSizeToClassName(size);
+    const cls = avatarSizeToClassName(styles, size);
     childrenWithProps.push(
       <li key="exceed" className={cls}>
         <Avatar

src/pages/account/settings/components/base.tsx

@@ -147,7 +147,6 @@ const BaseView: React.FC = () => {
                     labelInValue: true,
                   }}
                   name="province"
-                  className={styles.item}
                   request={async () => {
                     return queryProvince().then(({ data }) => {
                       return data.map((item) => {
@@ -175,7 +174,6 @@ const BaseView: React.FC = () => {
                           },
                         ]}
                         disabled={!province}
-                        className={styles.item}
                         request={async () => {
                           if (!province?.key) {
                             return [];

src/pages/dashboard/analysis/components/Charts/MiniProgress/index.tsx

@@ -1,6 +1,5 @@
 import { Tooltip } from 'antd';
 import React from 'react';
-import useStyles from './index.style';
 export type MiniProgressProps = {
   target: number;
   targetLabel?: string;
@@ -16,12 +15,10 @@ const MiniProgress: React.FC<MiniProgressProps> = ({
   strokeWidth,
   percent,
 }) => {
-  const { styles } = useStyles();
   return (
-    <div className={styles.miniProgress}>
+    <div>
       <Tooltip title={targetLabel}>
         <div
-          className={styles.target}
           style={{
             left: target ? `${target}%` : undefined,
           }}
@@ -38,9 +35,7 @@ const MiniProgress: React.FC<MiniProgressProps> = ({
           />
         </div>
       </Tooltip>
-      <div className={styles.progressWrap}>
       <div
-          className={styles.progress}
         style={{
           backgroundColor: color || undefined,
           width: percent ? `${percent}%` : undefined,
@@ -48,7 +43,6 @@ const MiniProgress: React.FC<MiniProgressProps> = ({
         }}
       />
     </div>
-    </div>
   );
 };
 export default MiniProgress;

src/pages/dashboard/analysis/components/Charts/WaterWave/index.tsx

@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import autoHeight from '../autoHeight';
+import autoHeight from '../../../../monitor/components/Charts/autoHeight';
 
 /* eslint no-return-assign: 0 */
 /* eslint no-mixed-operators: 0 */
@@ -188,7 +188,6 @@ class WaterWave extends Component<WaterWaveProps> {
     const { percent, title, height = 1 } = this.props;
     return (
       <div
-        className={styles.waterWave}
         ref={(n) => {
           this.root = n;
         }}
@@ -204,7 +203,6 @@ class WaterWave extends Component<WaterWaveProps> {
           }}
         >
           <canvas
-            className={styles.waterWaveCanvasWrapper}
             ref={(n) => {
               this.node = n;
             }}
@@ -213,7 +211,6 @@ class WaterWave extends Component<WaterWaveProps> {
           />
         </div>
         <div
-          className={styles.text}
           style={{
             width: height,
           }}

src/pages/dashboard/analysis/components/NumberInfo/index.style.ts

@@ -11,7 +11,7 @@ const useStyles = createStyles(({ token }) => {
     numberInfoTitle: {
       marginBottom: '16px',
       color: token.colorText,
-      fontSize: token['font-size-lg'],
+      fontSize: token.fontSizeLG,
       transition: 'all 0.3s',
     },
     numberInfoSubTitle: {
@@ -36,7 +36,7 @@ const useStyles = createStyles(({ token }) => {
     subTotal: {
       marginRight: '0',
       color: token.colorTextSecondary,
-      fontSize: token['font-size-lg'],
+      fontSize: token.fontSizeLG,
       verticalAlign: 'top',
     },
     anticon: {

src/pages/dashboard/analysis/components/NumberInfo/index.tsx

@@ -27,8 +27,8 @@ const NumberInfo: React.FC<NumberInfoProps> = ({
   const { styles } = useStyles();
   return (
     <div
-      className={classNames(styles.numberInfo, {
-        [styles[`numberInfo${theme}`]]: theme,
+      className={classNames({
+        [styles[`numberInfo${theme}` as keyof typeof styles]]: !!theme,
       })}
       {...rest}
     >

src/pages/dashboard/analysis/components/SalesCard.tsx

@@ -1,6 +1,6 @@
 import { Column } from '@ant-design/plots';
 import { Card, Col, DatePicker, Row, Tabs } from 'antd';
-import type { RangePickerProps } from 'antd/es/date-picker/generatePicker';
+import type { RangePickerProps } from 'antd/es/date-picker';
 import type dayjs from 'dayjs';
 import numeral from 'numeral';
 import type { DataItem } from '../data.d';
@@ -29,11 +29,11 @@ const SalesCard = ({
   loading,
   selectDate,
 }: {
-  rangePickerValue: RangePickerProps<dayjs.Dayjs>['value'];
+  rangePickerValue: RangePickerProps['value'];
   isActive: (key: TimeType) => string;
   salesData: DataItem[];
   loading: boolean;
-  handleRangePickerChange: RangePickerProps<dayjs.Dayjs>['onChange'];
+  handleRangePickerChange: RangePickerProps['onChange'];
   selectDate: (key: TimeType) => void;
 }) => {
   const { styles } = useStyles();

src/pages/dashboard/analysis/data.d.ts

@@ -1,7 +1,6 @@
-import { DataItem } from '@antv/g2plot/esm/interface/config';
-
-export { DataItem };
-
+export interface DataItem {
+  [field: string]: string | number | number[] | null | undefined;
+}
 export interface VisitDataType {
   x: string;
   y: number;

src/pages/dashboard/analysis/index.tsx

@@ -2,7 +2,7 @@ import { EllipsisOutlined } from '@ant-design/icons';
 import { GridContent } from '@ant-design/pro-components';
 import { useRequest } from '@umijs/max';
 import { Col, Dropdown, Row } from 'antd';
-import type { RangePickerProps } from 'antd/es/date-picker/generatePicker';
+import type { RangePickerProps } from 'antd/es/date-picker';
 import type { RadioChangeEvent } from 'antd/es/radio';
 import type dayjs from 'dayjs';
 import type { FC } from 'react';
@@ -19,7 +19,7 @@ import { fakeChartData } from './service';
 import useStyles from './style.style';
 import { getTimeDistance } from './utils/utils';
 
-type RangePickerValue = RangePickerProps<dayjs.Dayjs>['value'];
+type RangePickerValue = RangePickerProps['value'];
 type AnalysisProps = {
   dashboardAndanalysis: AnalysisData;
   loading: boolean;

src/pages/dashboard/analysis/utils/Yuan.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { yuan } from '../components/Charts';
 /** 减少使用 dangerouslySetInnerHTML */
 export default class Yuan extends React.Component<{
-  children: React.ReactText;
+  children: string | number;
 }> {
   main: HTMLSpanElement | undefined | null = null;
 

src/pages/dashboard/analysis/utils/utils.ts

@@ -1,7 +1,7 @@
-import type { RangePickerProps } from 'antd/es/date-picker/generatePicker';
+import type { RangePickerProps } from 'antd/es/date-picker';
 import dayjs from 'dayjs';
 
-type RangePickerValue = RangePickerProps<dayjs.Dayjs>['value'];
+type RangePickerValue = RangePickerProps['value'];
 
 export function fixedZero(val: number) {
   return val * 1 < 10 ? `0${val}` : val;

src/pages/dashboard/monitor/components/Charts/WaterWave/index.tsx

@@ -188,7 +188,6 @@ class WaterWave extends Component<WaterWaveProps> {
     const { percent, title, height = 1 } = this.props;
     return (
       <div
-        className={styles.waterWave}
         ref={(n) => {
           this.root = n;
         }}
@@ -204,7 +203,6 @@ class WaterWave extends Component<WaterWaveProps> {
           }}
         >
           <canvas
-            className={styles.waterWaveCanvasWrapper}
             ref={(n) => {
               this.node = n;
             }}
@@ -213,7 +211,6 @@ class WaterWave extends Component<WaterWaveProps> {
           />
         </div>
         <div
-          className={styles.text}
           style={{
             width: height,
           }}

src/pages/dashboard/workplace/components/EditableLinkGroup/index.tsx

@@ -14,7 +14,7 @@ type EditableLinkGroupProps = {
 };
 const EditableLinkGroup: React.FC<EditableLinkGroupProps> = (props) => {
   const { styles } = useStyles();
-  const { links, linkElement, onAdd } = props;
+  const { links = [], linkElement = 'a', onAdd = () => {} } = props;
   return (
     <div className={styles.linkGroup}>
       {links.map((link) =>
@@ -34,9 +34,5 @@ const EditableLinkGroup: React.FC<EditableLinkGroupProps> = (props) => {
     </div>
   );
 };
-EditableLinkGroup.defaultProps = {
-  links: [],
-  onAdd: () => {},
-  linkElement: 'a',
-};
+
 export default EditableLinkGroup;

src/pages/dashboard/workplace/data.d.ts

@@ -1,7 +1,6 @@
-import { DataItem } from '@antv/g2plot/esm/interface/config';
-
-export { DataItem };
-
+export interface DataItem {
+  [field: string]: string | number | number[] | null | undefined;
+}
 export interface TagType {
   key: string;
   label: string;

src/pages/form/advanced-form/index.tsx

@@ -95,7 +95,7 @@ const AdvancedForm: FC<Record<string, any>> = () => {
           onClick={() => scrollToField(key)}
         >
           <CloseCircleOutlined className={styles.errorIcon} />
-          <div className={styles.errorMessage}>{err.errors[0]}</div>
+          <div>{err.errors[0]}</div>
           <div className={styles.errorField}>{fieldLabels[key]}</div>
         </li>
       );

src/pages/form/step-form/index.tsx

@@ -82,7 +82,7 @@ const StepForm: React.FC<Record<string, any>> = () => {
     receiverMode: 'alipay',
   });
   const [current, setCurrent] = useState(0);
-  const formRef = useRef<FormInstance>();
+  const formRef = useRef<FormInstance>(null);
   return (
     <PageContainer content="将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。">
       <Card bordered={false}>

src/pages/list/table-list/index.tsx

@@ -98,7 +98,7 @@ const TableList: React.FC = () => {
   const [updateModalVisible, handleUpdateModalVisible] =
     useState<boolean>(false);
   const [showDetail, setShowDetail] = useState<boolean>(false);
-  const actionRef = useRef<ActionType>();
+  const actionRef = useRef<ActionType>(null);
   const [currentRow, setCurrentRow] = useState<TableListItem>();
   const [selectedRowsState, setSelectedRows] = useState<TableListItem[]>([]);
   /** 国际化配置 */

src/pages/table-list/components/UpdateForm.tsx

@@ -20,7 +20,7 @@ export type FormValueType = {
 } & Partial<API.RuleListItem>;
 
 export type UpdateFormProps = {
-  trigger?: JSX.Element;
+  trigger?: React.ReactElement<any>;
   onOk?: () => void;
   values: Partial<API.RuleListItem>;
 };

src/pages/user/login/login.test.tsx

@@ -1,4 +1,5 @@
-import { startMock } from '@@/requestRecordMock';
+// @ts-ignore
+import { startMock } from '@@/requestRecordMock';
 import { TestBrowser } from '@@/testBrowser';
 import { fireEvent, render } from '@testing-library/react';
 import React, { act } from 'react';

src/pages/user/register/index.tsx

@@ -16,7 +16,7 @@ import type { FC } from 'react';
 import { useEffect, useState } from 'react';
 import type { StateType } from './service';
 import { fakeRegister } from './service';
-import useStyles from './style.style';
+import useStyles from './styles';
 
 const FormItem = Form.Item;
 const { Option } = Select;
@@ -135,7 +135,9 @@ const Register: FC = () => {
     const value = form.getFieldValue('password');
     const passwordStatus = getPasswordStatus();
     return value?.length ? (
-      <div className={styles[`progress-${passwordStatus}`]}>
+      <div
+        className={styles[`progress-${passwordStatus}` as keyof typeof styles]}
+      >
         <Progress
           status={passwordProgressMap[passwordStatus]}
           strokeWidth={6}

src/pages/user/register/style.style.ts

@@ -1,46 +0,0 @@
-import { createStyles } from 'antd-style';
-
-const useStyles = createStyles(({ token }) => {
-  return {
-    main: {
-      width: '368px',
-      margin: '0 auto',
-      h3: { marginBottom: '20px', fontSize: '16px' },
-    },
-    password: {
-      marginBottom: '24px',
-      '.ant-form-item-explain': { display: 'none' },
-    },
-    getCaptcha: {
-      display: 'block',
-      width: '100%',
-    },
-
-    footer: {
-      width: '100%',
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'space-between',
-    },
-    submit: {
-      width: '50%',
-    },
-    success: {
-      transition: 'color 0.3s',
-      color: token.colorSuccess,
-    },
-    warning: {
-      transition: 'color 0.3s',
-      color: token.colorWarning,
-    },
-    error: {
-      transition: 'color 0.3s',
-      color: token.colorError,
-    },
-    'progress-pass > .progress': {
-      '.ant-progress-bg': { backgroundColor: token.colorWarning },
-    },
-  };
-});
-
-export default useStyles;

tsconfig.json

@@ -9,7 +9,6 @@
     "strict": true,
     "forceConsistentCasingInFileNames": true,
     "noImplicitReturns": true,
-    "suppressImplicitAnyIndexErrors": true,
     "declaration": true,
     "skipLibCheck": true,
     "resolveJsonModule": true,