feat: 优化代码

src/App.tsx

 import styles from './App.module.scss'
 import testImg from '@/assets/images/notGetStatus.png'
-import { useNavigate } from 'react-router-dom'
+import {useNavigate} from 'react-router-dom'
+
 const App = () => {
     const navigate = useNavigate()
     const handleClick = () => {

src/index.tsx

 import React from 'react'
 import ReactDOM from 'react-dom/client'
-import { BrowserRouter, Routes, Route } from 'react-router-dom'
+import {BrowserRouter, Routes, Route} from 'react-router-dom'
 import Home from '@/pages/Home'
 import Lottery from '@/pages/Lottery'
 import OrderDetail from '@/pages/OrderDetail'
@@ -13,9 +13,9 @@ root.render(
     <React.StrictMode>
         <BrowserRouter>
             <Routes>
-              <Route path = '/' element={<Home />}></Route>
-              <Route path = '/lottery' element={<Lottery />}></Route>
-              <Route path = '/orderDetail' element={<OrderDetail />}></Route>
+                <Route path='/' element={<Home/>}></Route>
+                <Route path='/lottery' element={<Lottery/>}></Route>
+                <Route path='/orderDetail' element={<OrderDetail/>}></Route>
             </Routes>
         </BrowserRouter>
     </React.StrictMode>

src/pages/Home/components/HomeProductItem.tsx

@@ -29,12 +29,14 @@ interface HomeProductItemProps {
 }
 
 const HomeProductItem: React.FC<HomeProductItemProps> = (props) => {
-  const buttonStyle = { color: props.buttonTextColor }
+    const buttonStyle = {color: props.buttonTextColor}
     return (
         <div className={styles.productItem}>
             <img className={styles.productItemBg} src={props.bannerImg} alt={props.title}/>
-            <h3 className={styles.productItemTitle}>{ props.title }</h3>
-            <div className={styles.productItemButton} style={buttonStyle} onClick={() => { props.onButtonClick(props.idx) }}>{ props.buttonText || '立即购买' }</div>
+            <h3 className={styles.productItemTitle}>{props.title}</h3>
+            <div className={styles.productItemButton} style={buttonStyle} onClick={() => {
+                props.onButtonClick(props.idx)
+            }}>{props.buttonText || '立即购买'}</div>
         </div>
     )
 }

src/pages/Home/components/HomeRuleContent.tsx

@@ -13,11 +13,11 @@ const HomeRuleContent: React.FC = () => {
             <h4>活动规则：</h4>
             <p>
                 1.打开掌银，扫描网点厅堂二维码进入活动页面，在网点工作人员的指导下购买新客礼，每人在活动期限内限参与1次活动。
-                <br />
+                <br/>
                 2.同一证件号、同一手机号、同一设备均视为同一客户。
-                <br />
+                <br/>
                 3.成功支付后请出示订单详情页，于网点大堂当场核销礼品。
-                <br />
+                <br/>
                 4.凡参加本次活动者，即视为同意接受本次活动相关规则，活动期间用户不得使用不正当手段破坏活动规则、违背活动公平原则，否则有权取消活动参与资格。
             </p>
         </div>

src/pages/Home/helper/order.ts

 import apis from '@/apis'
-import { type CreateOrderRequestData } from '@/apis/common'
-import { type NavigateFunction } from 'react-router-dom'
+import {type CreateOrderRequestData} from '@/apis/common'
+import {type NavigateFunction} from 'react-router-dom'
 import {Toast} from "@nutui/nutui-react";
 
 class OrderHelper {
@@ -20,7 +20,7 @@ class OrderHelper {
                 return
             }
 
-      const queryPayUrlRes = await apis.common.queryPayUrl({ orderId: createOrderRes.data });
+            const queryPayUrlRes = await apis.common.queryPayUrl({orderId: createOrderRes.data});
             if (!queryPayUrlRes.data) {
                 Toast.show('支付链接获取失败')
                 return

src/pages/Home/index.tsx

-import React, { useEffect, useState } from 'react'
+import React, {useEffect, useState} from 'react'
 import styles from './index.module.scss'
-import { useNavigate, useSearchParams } from 'react-router-dom'
+import {useNavigate, useSearchParams} from 'react-router-dom'
 import HomeBg from '@/pages/Home/components/HomeBg'
 import HomeContent from '@/pages/Home/components/HomeContent'
 import AuthUtil from '@/utils/auth'
@@ -30,8 +30,8 @@ const Home: React.FC = () => {
         <div className={styles.wrap}>
             {isAuthed && (
                 <>
-                    <HomeBg />
-                    <HomeContent />
+                    <HomeBg/>
+                    <HomeContent/>
                 </>
             )}
         </div>

src/pages/Lottery/index.tsx

@@ -7,7 +7,7 @@ import lotteryRuleTitleBgImg from '@/assets/images/lotteryRuleTitleBg.png'
 import myPrizeHighLightImg from '@/assets/images/myPrizeHighLight.png'
 import myPrizeUnclaimedImg from '@/assets/images/myPrizeUnclaimed.png'
 import winningLotteryImg from '@/assets/images/winningLottery.png'
-import { Popup, Overlay } from '@nutui/nutui-react';
+import {Popup, Overlay} from '@nutui/nutui-react';
 
 const Lottery: React.FC = () => {
     const [showMyPrizePopup, setShowMyPrizePopup] = useState(false);
@@ -42,7 +42,7 @@ const Lottery: React.FC = () => {
     })
 
     function onClickLotteryButton() {
-        console.log(lotteryConfig,'lotteryConfig')
+        console.log(lotteryConfig, 'lotteryConfig')
         setLotteryConfig(prevConfig => {
             // 如果正在运行，则不进行任何操作
             if (prevConfig.running) return prevConfig;
@@ -68,7 +68,7 @@ const Lottery: React.FC = () => {
 
             // 在动画结束后解锁
             setTimeout(() => {
-                setLotteryConfig(prev => ({ ...prev, running: false }));
+                setLotteryConfig(prev => ({...prev, running: false}));
                 setVisible(true)
             }, newConfig.duration);
 
@@ -81,34 +81,38 @@ const Lottery: React.FC = () => {
             <div className={styles.lotteryWrap}>
                 <img className={styles.lotteryWrapBgImg} src={lotteryWrapBgImg} alt=""/>
                 <img style={lotteryStyle} className={styles.lotteryPrizeBgImg} src={lotteryPrizeImg} alt=""/>
-                <img className={styles.lotteryButtonBgImg} onClick={onClickLotteryButton} src={lotteryButtonBgImg} alt=""/>
+                <img className={styles.lotteryButtonBgImg} onClick={onClickLotteryButton} src={lotteryButtonBgImg}
+                     alt=""/>
                 <div className={styles.lotteryMyPrizeButton} onClick={() => setShowMyPrizePopup(true)}>我的奖品</div>
             </div>
             <img className={styles.lotteryRuleTitleBg} src={lotteryRuleTitleBgImg} alt=""/>
             <div className={styles.lotteryRuleContent}>
-                <div className={styles.lotteryRuleItem}><span></span> 该活动仅供掌银新客选择（线下礼品、线上微信立减金抽奖二选一），</div>
+                <div className={styles.lotteryRuleItem}><span></span> 该活动仅供掌银新客选择（线下礼品、线上微信立减金抽奖二选一），
+                </div>
                 <div className={styles.lotteryRuleItem}><span></span> 每季度每个客户号仅可参与其中一项。</div>
             </div>
 
             {/*我的奖品*/}
             <Popup
                 closeable
-                visible={ showMyPrizePopup }
-                style={{ height: '454px' }}
+                visible={showMyPrizePopup}
+                style={{height: '454px'}}
                 position="bottom"
                 round
-                onClose={ () => { setShowMyPrizePopup(false) } }
+                onClose={() => {
+                    setShowMyPrizePopup(false)
+                }}
             >
                 <div className={styles.myPrizePopupWrap}>
                     <div className={styles.myPrizePopupTitle}>我的奖品</div>
                     <div className={styles.myPrizePopupContent}>
-                        <MyPrizeItem />
-                        <MyPrizeItem />
-                        <MyPrizeItem />
-                        <MyPrizeItem />
-                        <MyPrizeItem />
-                        <MyPrizeItem />
-                        <MyPrizeItem />
+                        <MyPrizeItem/>
+                        <MyPrizeItem/>
+                        <MyPrizeItem/>
+                        <MyPrizeItem/>
+                        <MyPrizeItem/>
+                        <MyPrizeItem/>
+                        <MyPrizeItem/>
                     </div>
                 </div>
             </Popup>

src/pages/OrderDetail/index.tsx

-import React, { useEffect, useState } from 'react'
-import { useSearchParams } from 'react-router-dom'
+import React, {useEffect, useState} from 'react'
+import {useSearchParams} from 'react-router-dom'
 import apis from '@/apis'
-import { type QueryOrderInfoResponse } from '@/apis/common'
+import {type QueryOrderInfoResponse} from '@/apis/common'
 import styles from './index.module.scss'
-import { Divider, Skeleton } from '@nutui/nutui-react'
+import {Divider, Skeleton} from '@nutui/nutui-react'
 
 const OrderDetail: React.FC = () => {
     const [params] = useSearchParams()
@@ -32,7 +32,8 @@ const OrderDetail: React.FC = () => {
                     </div>
                     <div className={styles.contentItem}>
                         <span className={styles.contentItemLabel}>支付金额：</span>
-                        <span className={styles.contentItemAmount}>￥<span>{orderInfo?.orderDetail.orderAmount}</span></span>
+                        <span
+                            className={styles.contentItemAmount}>￥<span>{orderInfo?.orderDetail.orderAmount}</span></span>
                     </div>
                 </Skeleton>
             </div>
@@ -47,7 +48,7 @@ const OrderDetail: React.FC = () => {
                         <span className={styles.contentItemLabel}>所属网点：</span>
                         <span className={styles.contentItemValue}>{orderInfo?.orderDetail.branchName}</span>
                     </div>
-                    <Divider />
+                    <Divider/>
                     <div className={styles.contentItem}>
                         <span className={styles.contentItemLabel}>支付时间：</span>
                         <span className={styles.contentItemValue}>{orderInfo?.orderDetail.payTime}</span>

src/utils/auth.ts

@@ -2,7 +2,7 @@ import apis from '@/apis'
 import LocalStorageUtil from '@/utils/local'
 
 class AuthUtil {
-  static async auth (params: URLSearchParams): Promise<boolean> {
+    static async auth(params: URLSearchParams): Promise<boolean> {
         return await new Promise((resolve) => {
             if (process.env.REACT_APP_ENV === 'development') {
                 LocalStorageUtil.setItem('__TOKEN__', '6d29e9d470e24cf9af48bd5881b97f80')

src/utils/axios.ts

-import axios, { type AxiosInstance, type InternalAxiosRequestConfig, type AxiosResponse, type AxiosError } from 'axios'
+import axios, {type AxiosInstance, type InternalAxiosRequestConfig, type AxiosResponse, type AxiosError} from 'axios'
 import LocalStorageUtil from '@/utils/local'
-import { Toast } from '@nutui/nutui-react'
+import {Toast} from '@nutui/nutui-react'
 import {LOGIN_EXPIRED_CODE} from "@/constants";
 
 const axiosInstance: AxiosInstance = axios.create({

src/utils/local.ts

@@ -4,7 +4,7 @@ class LocalStorageUtil {
      * @param key 键名
      * @param value 值，将被自动转换为字符串
      */
-    static setItem <T>(key: string, value: T): void {
+    static setItem<T>(key: string, value: T): void {
         const stringValue = JSON.stringify(value)
         localStorage.setItem(key, stringValue)
     }
@@ -31,7 +31,7 @@ class LocalStorageUtil {
      * 从localStorage中删除特定数据
      * @param key 键名
      */
-    static removeItem (key: string): void {
+    static removeItem(key: string): void {
         localStorage.removeItem(key)
     }
 
@@ -40,14 +40,14 @@ class LocalStorageUtil {
      * @param key 键名
      * @param value 新的值，将被自动转换为字符串
      */
-    static updateItem <T>(key: string, value: T): void {
+    static updateItem<T>(key: string, value: T): void {
         this.setItem(key, value)
     }
 
     /**
      * 清除所有localStorage数据
      */
-    static clear (): void {
+    static clear(): void {
         localStorage.clear()
     }
 }

src/utils/session.ts

@@ -4,7 +4,7 @@ class SessionStorageUtil {
      * @param key 键名
      * @param value 值，将被自动转换为字符串
      */
-  static setItem <T>(key: string, value: T): void {
+    static setItem<T>(key: string, value: T): void {
         const stringValue = JSON.stringify(value)
         sessionStorage.setItem(key, stringValue)
     }
@@ -31,7 +31,7 @@ class SessionStorageUtil {
      * 从sessionStorage中删除特定数据
      * @param key 键名
      */
-  static removeItem (key: string): void {
+    static removeItem(key: string): void {
         sessionStorage.removeItem(key)
     }
 
@@ -40,14 +40,14 @@ class SessionStorageUtil {
      * @param key 键名
      * @param value 新的值，将被自动转换为字符串
      */
-  static updateItem <T>(key: string, value: T): void {
+    static updateItem<T>(key: string, value: T): void {
         this.setItem(key, value)
     }
 
     /**
      * 清除所有sessionStorage数据
      */
-  static clear (): void {
+    static clear(): void {
         sessionStorage.clear()
     }
 }