🎈 perf(销售统计): 优化下拉菜单交互

src/components/SelectSaleRankingIndicators/index.tsx

@@ -5,6 +5,7 @@ import { SaleOrderDataFormdataFormStatus } from '@/api/index'
 import { View } from '@tarojs/components'
 import styles from './index.module.scss'
 import classnames from 'classnames'
+import { ShoppingProvider } from '@/pages/shopping/components/shoppingCart'
 
 type ChangedValue = string | number
 

src/components/dropDown-item/index.tsx

@@ -69,18 +69,18 @@ export default forwardRef((props: PropsType, ref) => {
   }
 
   const handleClickTitle = () => {
-    setShowPopup(true)
+    setShowPopup(prev => !prev)
   }
 
   const handleClosePopup = () => {
-    if (hasBottomBtn) return false
+    if (hasBottomBtn) return
     setShowPopup(false)
   }
 
   const [overlayOffsetTop, setOverlayOffsetTop] = useState('unset')
   // 获取遮罩层的样式
   const getOverlayStyle = (): React.CSSProperties => {
-    return { position: 'absolute', top: 0 }
+    return { position: !showOverlay ? 'fixed' : 'absolute', top: 0 }
   }
 
   // 获取整个页面的完整高度
@@ -110,7 +110,6 @@ export default forwardRef((props: PropsType, ref) => {
     }
   }, [overlayOffsetTop])
 
-
   return (
     <View className={styles.dropDownItem} id='DropDownItem'>
       <View className={styles['dropDownItem--title']} onClick={handleClickTitle}>
@@ -120,7 +119,7 @@ export default forwardRef((props: PropsType, ref) => {
         <Iconfont name={getIconName()} size={20} color={showPopup ? activeColor : '#7f7f7f'}></Iconfont>
       </View>
       <Popup
-        onClose={() => handleClosePopup()}
+        onClose={handleClosePopup}
         showOverLay={showOverlay}
         show={showPopup}
         showTitle={false}

src/components/infiniteScroll/index.tsx

@@ -3,6 +3,8 @@ import React, { memo, ReactNode, useMemo, useState } from 'react'
 import style from './index.module.scss'
 import DotLoading from '@/components/dotLoading'
 import LoadingCard from '../loadingCard'
+import { useCustomTabItemTap } from '@/use/useCommon'
+import Taro from '@tarojs/taro'
 
 export type StatusParam = 0 | 1 | 2 | 3
 
@@ -119,6 +121,7 @@ export default memo(
     return (
       <>
         <ScrollView
+          id='infiniteScroll'
           style={styleObj}
           className={style.scroll_main}
           scrollY

src/components/popup/index.module.scss

@@ -74,7 +74,7 @@ $am-ms: 200ms;
     border-radius: 20px 20px 0px 0px;
     transform: translate3d(0, 100%, 0);
     &-withShadow {
-      box-shadow: 0px -1px 9px -1px #333;
+      box-shadow: 0 -2px 11px -3px #333;
     }
   }
 
@@ -86,7 +86,7 @@ $am-ms: 200ms;
     border-radius: 0 0 20px 20px;
     transform: translate3d(0, -100%, 0);
     &-withShadow {
-      box-shadow: 0 1px 9px -1px #333;
+      box-shadow: 0 2px 5px -3px #333;
     }
   }
 
@@ -98,7 +98,7 @@ $am-ms: 200ms;
     border-radius: 20px 0 0 20px;
     transform: translate3d(100%, 0, 0);
     &-withShadow {
-      box-shadow: -1px 0px 9px -1px #333;
+      box-shadow: -2 0px 11px -3px #333;
     }
   }
 }

src/components/popup/index.tsx

@@ -35,7 +35,7 @@ export default memo(
     children,
     position = 'bottom',
     animationEnd,
-    customStyle,
+    customStyle = {},
     safeAreaInsetBottom = true,
     showOverLay = true,
     overlayStyle,
@@ -45,6 +45,7 @@ export default memo(
       if (show) {
         animationTime.current = setTimeout(() => {
           animationEnd?.()
+          customStyle.overflow = 'unset'
         }, 260)
       } else {
         clearTimeout(animationTime.current)
@@ -60,10 +61,12 @@ export default memo(
     return (
       <View className={style.drawer_main}>
         <View catchMove={true} className={classnames(style.drawer, show ? style.drawer_active : '')} style={customStyle}>
+          {/* 遮罩层 start */}
           <View
             className={classnames(style.drawer_mask, { [style.drawer_mask_active]: show, [style['drawer_mask--hidden']]: !showOverLay })}
             onClick={onClose}
             style={overlayStyle}></View>
+          {/* 遮罩层 end */}
           <View
             style={{ position: `${isFixed == true ? 'fixed' : 'absolute'}` }}
             className={classnames(style.drawer_container, style['drawer_container_' + position], {