Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/spider_cloud_warehouse into 售后模块

project.private.config.json

@@ -116,5 +116,6 @@
         }
       ]
     }
-  }
+  },
+  "libVersion": "2.26.0"
 }

src/components/popup/index.module.scss

@@ -1,91 +1,88 @@
 $am-ms: 200ms;
-.drawer_main{
+.drawer_main {
-    .drawer {
+  .drawer {
-        position:fixed;
+    position: fixed;
-        left: 0;
+  left: 0;
-        top:0;
+  top: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    width: 100%;
+    height: 100vh;
+    margin: 0 auto;
+    z-index: 1000;
+    visibility: hidden;
+    transition: visibility $am-ms ease-in-out;
+    .drawer_mask {
+      display: flex;
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100vw;
+      height: 100vh;
+      background: rgba(0, 0, 0, 0.6);
+      z-index: 1011;
+      opacity: 0;
+      transition: opacity $am-ms ease-in;
+      .drawer_container {
         display: flex;
-        align-items: center;
-        justify-content: center;
         flex-direction: column;
-        width: 100%;
+        position: absolute;
-        height: 100vh;
+        background-color: #fff;
-        margin: 0 auto;
+        z-index: 1012;
-        z-index: 1000;
+        transition: transform $am-ms ease-in-out;
-        visibility: hidden;
+        .drawer_container_title {
-        transition: visibility $am-ms ease-in-out;
+          display: flex;
-        .drawer_mask{
+          align-items: center;
-            display: flex;
+          justify-content: center;
-            position: absolute;
+          height: 80px;
-            top: 0;
+          font-size: 29px;
-            left: 0;
+          color: #000000;
-            width: 100vw;
+          padding-top: 10px;
-            height: 100vh;
-            background: rgba(0, 0, 0, 0.6);
-            z-index: 1011;
-            opacity: 0;
-            transition: opacity $am-ms ease-in;
-            .drawer_container{
-                display: flex;
-                flex-direction: column;
-                position: absolute;
-                background-color: #fff;
-                z-index: 1012;
-                transition: transform $am-ms ease-in-out;
-                .drawer_container_title {
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    height: 80px;
-                    font-size: 29px;
-                    color: #000000;
-                    padding-top: 10px;
-                }
-                .common_close_btn_icon{
-                    position: absolute;
-                    top: 10px;
-                    left: 10px;
-                }
-            }
-            .drawer_container_active{
-                transform: translate3d(0, 0, 0);
-            }
         }
-        .drawer_mask_active{
+        .common_close_btn_icon {
-            opacity: 1;
+          position: absolute;
+          top: 10px;
+          left: 10px;
         }
+      }
+      .drawer_container_active {
+        transform: translate3d(0, 0, 0);
+      }
     }
-    .drawer_active {
+    .drawer_mask_active {
-        visibility:visible;
+      opacity: 1;
     }
+  }
+  .drawer_active {
+    visibility: visible;
+  }
 
-    .drawer_container_bottom{
+  .drawer_container_bottom {
-        bottom: 0;
+    bottom: 0;
-        left: 0;
+    left: 0;
-        min-height: 200px;
+    min-height: 200px;
-        width: 100vw;
+    width: 100vw;
-        border-radius: 20px 20px 0px 0px;
+    border-radius: 20px 20px 0px 0px;
-        transform: translate3d(0, 100%, 0);
+    transform: translate3d(0, 100%, 0);
-    }
+  }
 
-    .drawer_container_top{
+  .drawer_container_top {
-        top: 0;
+    top: 0;
-        left: 0;
+    left: 0;
-        min-height: 200px;
+    min-height: 200px;
-        width: 100vw;
+    width: 100vw;
-        border-radius: 0 0 20px 20px;
+    border-radius: 0 0 20px 20px;
-        transform: translate3d(0, -100%, 0);
+    transform: translate3d(0, -100%, 0);
-    }
+  }
 
-    .drawer_container_right{
+  .drawer_container_right {
-        bottom: 0;
+    bottom: 0;
-        right: 0;
+    right: 0;
-        height: 100vh;
+    height: 100vh;
-        min-width: 300px;
+    min-width: 300px;
-        border-radius: 20px 0 0 20px;
+    border-radius: 20px 0 0 20px;
-        transform: translate3d(100%, 0, 0);
+    transform: translate3d(100%, 0, 0);
-    }
+  }
-    
 }
-
-

src/components/popup/index.tsx

@@ -1,74 +1,61 @@
-import { View } from "@tarojs/components";
+import { View } from '@tarojs/components'
-import style from "./index.module.scss"
+import style from './index.module.scss'
-import classnames from "classnames";
+import classnames from 'classnames'
-import { memo, ReactNode, useEffect, useMemo, useRef } from "react";
+import { memo, ReactNode, useEffect, useMemo, useRef } from 'react'
-import CloseBtnIcon from "@/components/closeBtn"
+import CloseBtnIcon from '@/components/closeBtn'
 
 export interface Params {
-    title?: string, //标题
+  title?: string //标题
-    show?: false|true, //显示显示弹窗
+  show?: false | true //显示显示弹窗
-    showTitle?: false|true, //是否显示标题
+  showTitle?: false | true //是否显示标题
-    onClose?:() => void, //关闭事件
+  onClose?: () => void //关闭事件
-    children?: ReactNode, //插槽内容
+  children?: ReactNode //插槽内容
-    // IconButton?: ReactNode, //
+  // IconButton?: ReactNode, //
-    showIconButton?: false|true, //是否显示关闭按钮
+  showIconButton?: false | true //是否显示关闭按钮
-    position?: 'bottom'|'top'|'right', //弹出位置
+  position?: 'bottom' | 'top' | 'right' //弹出位置
-    animationEnd?: () => void //弹出动画结束
+  animationEnd?: () => void //弹出动画结束
 }
-export default memo((
+export default memo(
-    {
+  ({ title = '标题', show = false, showTitle = true, onClose, showIconButton = false, children, position = 'bottom', animationEnd }: Params) => {
-        title = '标题', 
-        show = false, 
-        showTitle = true, 
-        onClose, 
-        showIconButton = false, 
-        children,
-        position = 'bottom',
-        animationEnd
-    }:Params) => {
-    
     const animationTime = useRef<any>(null)
     useEffect(() => {
-        if(show) {
+      if (show) {
-            animationTime.current = setTimeout(() => {
+        animationTime.current = setTimeout(() => {
-                animationEnd?.()
+          animationEnd?.()
-            }, 260)
+        }, 260)
-        } else {
+      } else {
-            clearTimeout(animationTime.current)
+        clearTimeout(animationTime.current)
-        }
+      }
     }, [show])
 
     useEffect(() => {
-        return () => {
+      return () => {
-            clearTimeout(animationTime.current)
+        clearTimeout(animationTime.current)
-        }
+      }
     }, [])
-    
+
     return (
-        <>
+      <>
-            <View className={style.drawer_main}>
+        <View className={style.drawer_main}>
-                <View catchMove={true} className={`${style.drawer} ${show?style.drawer_active:''}` }>
+          <View catchMove={true} className={`${style.drawer} ${show ? style.drawer_active : ''}`}>
-                    <View
+            <View className={classnames(style.drawer_mask, { [style.drawer_mask_active]: show })} onClick={() => onClose?.()}>
-                        className={classnames(style.drawer_mask, {[style.drawer_mask_active]: show})}
+              <View
-                        onClick={() =>  onClose?.()}
+                className={classnames(style.drawer_container, style['drawer_container_' + position], { [style.drawer_container_active]: show })}
-                    >
+                onClick={(e) => e.stopPropagation()}>
-                        <View  
+                {showTitle && <View className={style.drawer_container_title}>{title}</View>}
-                            className={classnames(style.drawer_container, style['drawer_container_'+position], {[style.drawer_container_active]: show})}
+                {showIconButton && (
-                            onClick={(e) => e.stopPropagation()}
+                  <View className={style.common_close_btn_icon}>
-                        >
+                    <CloseBtnIcon onClose={() => onClose?.()} />
-                            {showTitle&&<View className={style.drawer_container_title}>{title}</View>}
+                  </View>
-                            {showIconButton&&<View className={style.common_close_btn_icon}>
+                )}
-                                <CloseBtnIcon onClose={() => onClose?.()}/>
+
-                            </View>}
+                <View className={style.drawer_container_context}>{children}</View>
-                            
+                <View className='common_safe_area_y'></View>
-                            <View className={style.drawer_container_context}> 
+              </View>
-                                {show&&children}
-                            </View>
-                            <View className="common_safe_area_y"></View>
-                        </View>
-                    </View>
-                </View>
             </View>
-        </>
+          </View>
+        </View>
+      </>
     )
-})
+  },
+)

src/components/search/index.tsx

@@ -8,19 +8,20 @@ import IconFont from '../iconfont/iconfont'
 
 type Params = {
   clickOnSearch?: (val: string) => void
-  disabled?: false | true
+  disabled?: boolean
   placeholder?: string
   changeOnSearch?: (value: string) => void
-  showIcon?: false | true
+  showIcon?: boolean
   placeIcon?: 'out' | 'inner'
   style?: Object
-  showBtn?: false | true
+  showBtn?: boolean
   btnStyle?: Object
   btnTitle?: string
   debounceTime?: number //防抖时间，不设默认为零
   defaultValue?: string
   children?: ReactNode
   customRightSlot?: ReactNode
+  adjustPosition?: boolean
 }
 
 export default memo(
@@ -29,6 +30,7 @@ export default memo(
       {
         clickOnSearch, //点击筛选按钮触发
         changeOnSearch, //输入文字触发
+        adjustPosition=false,
         disabled = false, //是否禁用
         placeholder = '输入搜索内容',
         showIcon = true, //是否显示关闭图标
@@ -88,6 +90,7 @@ export default memo(
               )}
               <View className={styles.input_bar}>
                 <Input
+                  adjustPosition={adjustPosition}
                   placeholderStyle='color:#ABABAB; font-size:26rpx'
                   onConfirm={onSearch}
                   className={classnames(placeIcon == 'out' && styles.input_out)}

src/components/timePicker/index.tsx

@@ -0,0 +1,47 @@
+import Popup from '@/components/popup'
+import { useState, memo } from 'react'
+import { View } from '@tarojs/components'
+import './index.scss'
+import AtCalendar from '@/components/calendar/index'
+import dayjs from 'dayjs'
+
+type DateArg = string | number | Date
+interface Props {
+  showTime: boolean
+  closePopup?: () => void
+  end?: DateArg
+  start?: DateArg
+  onSelectDate?: (any) => void
+}
+
+export default memo((props: Props) => {
+  let { showTime = false, closePopup, start = '', end = '', onSelectDate } = props
+  const [time, setTime] = useState<any>({})
+
+  const handTime = (e) => {
+    const { start, end } = e.value
+    // 如果选的是同一天的日期, end 自动加一天
+    if (start === end) {
+      e.value.end = `${dayjs(new Date(start)).add(1, 'day').format('YYYY-MM-DD')} 00:00:00`
+    }
+    setTime(e)
+  }
+  return (
+    <Popup title={'选择时间'} show={showTime} onClose={() => closePopup?.()}>
+      <View className='time-box'>
+        <AtCalendar
+          isMultiSelect
+          format='YYYY-MM-DD 00:00:00'
+          currentDate={{
+            start: start,
+            end: end,
+          }}
+          onSelectDate={(e) => handTime?.(e)}
+        />
+      </View>
+      <View className='sure-box' onClick={() => onSelectDate?.(time)}>
+        确认
+      </View>
+    </Popup>
+  )
+})

src/pages/delivery/components/Filter/index.module.scss

@@ -1,4 +1,3 @@
-
 .filterItem {
   margin: 24px 48px;
   &--title {
@@ -15,7 +14,6 @@
 .filter {
   &--time {
     grid-template-columns: 1fr 1fr 1fr 1fr;
-
   }
   &--inputBar {
   }
@@ -23,19 +21,68 @@
     grid-template-columns: 1fr 1fr;
   }
 }
-.filterTypeButton{
+.filterTypeButton {
   padding: 0 24px;
   font-size: 28px;
-  
 }
-.filterTypeText{
+.filterTypeText {
   color: #6e6e6e !important;
 }
-.filterTimeButton{
+.filterTimeButton {
-  padding: 0 24px;
-  font-size: 28px;
   grid-column-start: span 2;
 }
-.selected{
+.selected {
   background-color: #eaf2ff;
 }
+
+.filterButton {
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  justify-content: center;
+  padding: 0 20px;
+  box-sizing: border-box;
+  border: 0 solid transparent;
+  background-color: #f6f6f6;
+  border-radius: 8px;
+  font-size: 28px;
+  height: 72px;
+  &--text {
+    color: #909090;
+    display: flex;
+    flex-flow: row nowrap;
+    justify-content: center;
+    align-items: center;
+  }
+  &:hover {
+    opacity: 0.7;
+  }
+  &--active {
+    border: 1px solid $color_main;
+    background-color: #eaf2ff;
+    .filterButton--text {
+      color: $color_main;
+    }
+  }
+}
+.filterController {
+  margin-top: 60px;
+  width: 100%;
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  justify-content: space-around;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+
+  btn:hover{
+    filter: blur(.7);
+  }
+
+  .rest_btn {
+    font-size: 28px;
+  }
+  .verify_btn {
+    font-size: 28px;
+  }
+}

src/pages/delivery/components/Filter/index.tsx

@@ -1,152 +1,237 @@
-import NormalButton from "@/components/normalButton"
+import NormalButton from '@/components/normalButton'
-import Popup from "@/components/popup"
+import Popup from '@/components/popup'
-import { View } from "@tarojs/components"
+import { View } from '@tarojs/components'
-import classnames from "classnames"
+import classnames from 'classnames'
 import styles from './index.module.scss'
-import { FC, memo, useEffect, useState } from 'react'
+import React, { FC, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import Search from "@/components/search"
+import Search from '@/components/search'
-import IconFont from "@/components/iconfont/iconfont"
+import IconFont from '@/components/iconfont/iconfont'
-import {EnumDeliveryNoticeTypeList} from '@/api/index'
+import { EnumDeliveryNoticeTypeList } from '@/api/index'
+import dayjs from 'dayjs'
+import { getFilterData } from '@/common/util'
+import Taro from '@tarojs/taro'
 
-type SearchFilter = {
+interface SearchFilter {
   type?: number
+  timeKey?: string
+  delivery_notice_order_no?: string
 }
 
-const scanIcon = () => {
+export interface SearchField extends Omit<SearchFilter, 'timeKey'> {
-  // 扫描
+  date_min?: string
-  const handleScan = () => {}
+  date_max?: string
-  return (
-    <View onClick={handleScan} className={styles.scanHandler}>
-      <IconFont name='icon-saomiao' size={40}></IconFont>
-    </View>
-  )
 }
 
-const DeliveryFilter: FC = memo(() => {
+interface DeliveryPropsType {
+  onSearchTime?: () => void
+  onConfirm?: (searchField: SearchField, timeKey?: Pick<SearchFilter, 'timeKey'>['timeKey']) => void
+  onCancal?: () => void
+  onReset?: () => void
+}
 
-  const {fetchData} = EnumDeliveryNoticeTypeList()
+interface ButtonPropsType {
+  isActive: boolean
+  onClick?: Function
+  children?: React.ReactNode
+  customClassName?: string
+}
 
-  const [searchFilter, useSearchFilter] = useState<SearchFilter>({
+export const filterTimeOptions = {
-    
+  0: {
+    name: '不限',
+    date_min: undefined,
+    date_max: undefined,
+  },
+  1: {
+    name: '今天',
+    date_min: `${dayjs(new Date()).add(0, 'day').format('YYYY-MM-DD')} 00:00:00`,
+    date_max: `${dayjs(new Date()).add(1, 'day').format('YYYY-MM-DD')} 00:00:00`,
+  },
+  2: {
+    name: '昨日',
+    date_min: `${dayjs(new Date()).add(-1, 'day').format('YYYY-MM-DD')} 00:00:00`,
+    date_max: `${dayjs(new Date()).add(0, 'day').format('YYYY-MM-DD')} 00:00:00`,
+  },
+  3: {
+    name: '近7日',
+    date_min: `${dayjs(new Date()).add(-7, 'day').format('YYYY-MM-DD')} 00:00:00`,
+    date_max: `${dayjs(new Date()).add(0, 'day').format('YYYY-MM-DD')} 00:00:00`,
+  },
+  4: {
+    name: '近30日',
+    date_min: `${dayjs(new Date()).add(-30, 'day').format('YYYY-MM-DD')} 00:00:00`,
+    date_max: `${dayjs(new Date()).add(0, 'day').format('YYYY-MM-DD')} 00:00:00`,
+  },
+  5: {
+    name: '近90日',
+    date_min: `${dayjs(new Date()).add(-90, 'day').format('YYYY-MM-DD')} 00:00:00`,
+    date_max: `${dayjs(new Date()).add(0, 'day').format('YYYY-MM-DD')} 00:00:00`,
+  },
+} as const
+
+const DeliveryFilter = memo<DeliveryPropsType>((props) => {
+  const { onSearchTime, onConfirm, onCancal, onReset } = props
+
+  const { fetchData, state } = EnumDeliveryNoticeTypeList()
+
+  const [searchFilter, setSearchFilter] = useState<SearchFilter>({
+    type: undefined,
+    timeKey: '0',
+    delivery_notice_order_no: '',
   })
   const handleSelectedType = (type: string | number) => {
+    console.log('type==>', type)
     if (typeof type === 'string' && type === 'default') {
-      // setSearch((e) => ({ ...e }))
+      setSearchFilter((e) => ({ ...e, type: undefined }))
     } else {
-      // setSearch((e) => ({ ...e, type: type as number }))
+      setSearchFilter((e) => ({ ...e, type: type as number }))
     }
   }
 
-  const handleSearchBarChange = () => {}
+
+  const handleSearchBarChange = useCallback((searchValue: string) => {
+    console.log('searchValue==>', searchValue)
+    setSearchFilter((prevProps) => ({ ...prevProps, delivery_notice_order_no: searchValue }))
+  }, [])
+
+  const typeList = useMemo<{ id: number; name: string }[]>(() => {
+    return state.data.list
+  }, [state])
 
   useEffect(() => {
-    getEnumData()
+    if (!!!typeList?.length) {
-  
+      getEnumData()
-  }, [])
+      console.log('getEnumData')
-  
+    }
-
+  }, [typeList])
-  const [typeList, setTypeList] = useState<{id: number, name: string}[]>()
 
   const getEnumData = async () => {
-    const res = await fetchData()
+    await fetchData()
-    setTypeList(res.data.list)
   }
+
+  const [customTime, setCustomTime] = useState({
+    date_min: undefined,
+    date_max: undefined,
+  })
+
   
 
+  const handleSelectedTime = (timeOptionId) => {
+    setSearchFilter((e) => ({ ...e, timeKey: timeOptionId }))
+    // 不是设置了自定义时间
+    if (timeOptionId !== '6') {
+      setCustomTime({
+        date_min: filterTimeOptions[timeOptionId]['date_min'],
+        date_max: filterTimeOptions[timeOptionId]['date_max'],
+      })
+      return
+    } 
+    onSearchTime?.()
+  }
+
+  const handleReset = () => {
+    setSearchFilter({ type: undefined, timeKey: '0', delivery_notice_order_no: '' })
+    onReset?.()
+  }
+  const handleConfirm = () => {
+    const changedField = {
+      type: searchFilter.type,
+      delivery_notice_order_no: searchFilter.delivery_notice_order_no,
+      date_min: customTime.date_min,
+      date_max: customTime.date_max,
+    }
+    console.log('changedField==>', changedField)
+    onConfirm?.(changedField, searchFilter.timeKey)
+  }
+
+  const scanIcon = () => {
+    // 扫描
+    const handleScan = () => {
+      Taro.scanCode({
+        success(res) {
+          setSearchFilter((prevProps) => ({ ...prevProps, delivery_notice_order_no: res.result }))
+        },
+        fail(res) {
+          console.log(res)
+        },
+      })
+    }
+    return (
+      <View onClick={handleScan} className={styles.scanHandler}>
+        <IconFont name='icon-saomiao' size={40}></IconFont>
+      </View>
+    )
+  }
+
   return (
     <>
-      <View className={styles.filterItem}>
-        <View className={styles['filterItem--title']}>发货类型</View>
-        <View className={classnames(styles['filterItem--wrapper'], styles['filter--type'])}>
-          <NormalButton
-            type={searchFilter.type == null ? 'primary' : 'info'}
-            plain={searchFilter.type === null}
-            circle
-            customClassName={classnames(styles.filterTypeButton)}
-            customTextClassName={searchFilter.type === null && styles.filterTypeText}
-            onClick={() => handleSelectedType('default')}>
-            不限
-          </NormalButton>
-          {!!typeList?.length && typeList?.map(item => {
-            return (
-              <NormalButton
-                type={searchFilter.type === item?.id ? 'primary' : 'info'}
-                plain={searchFilter.type !== item?.id}
-                circle
-                customClassName={styles.filterTypeButton}
-                customTextClassName={searchFilter.type === item?.id && styles.filterTypeText}
-                onClick={() => handleSelectedType(item?.id)}>
-                {item.name}
-              </NormalButton>
-            )
-          })}
-          {/* <NormalButton
-            type={searchFilter.type === 0 ? 'primary' : 'info'}
-            plain={searchFilter.type !== 0}
-            circle
-            customClassName={styles.filterTypeButton}
-            customTextClassName={searchFilter.type === 0 && styles.filterTypeText}
-            onClick={() => handleSelectedType(1)}>
-            销售发货单
-          </NormalButton>
-          <NormalButton
-            type={searchFilter.type === 0 ? 'primary' : 'info'}
-            plain={searchFilter.type !== 0}
-            circle
-            customClassName={styles.filterTypeButton}
-            customTextClassName={searchFilter.type === 1 && styles.filterTypeText}
-            onClick={() => handleSelectedType(2)}>
-            调拨发货单
-          </NormalButton>
-          <NormalButton
-            type={searchFilter.type === 0 ? 'primary' : 'info'}
-            plain={searchFilter.type !== 0}
-            circle
-            customClassName={styles.filterTypeButton}
-            customTextClassName={searchFilter.type === 2 && styles.filterTypeText}
-            onClick={() => handleSelectedType(3)}>
-            采购退货单
-          </NormalButton> */}
-        </View>
-      </View>
       <View className={styles.filterItem}>
         <View className={styles['filterItem--title']}>发货单号</View>
         <View className={classnames(styles['filterItem--wrapper'], styles['filter--inputBar'])}>
           <Search
             placeholder='请输入或扫描条形码'
             showBtn={false}
+            adjustPosition={true}
             changeOnSearch={handleSearchBarChange}
             debounceTime={300}
+            defaultValue={searchFilter.delivery_notice_order_no}
             customRightSlot={scanIcon()}></Search>
         </View>
       </View>
+      <View className={styles.filterItem}>
+        <View className={styles['filterItem--title']}>发货类型</View>
+        <View className={classnames(styles['filterItem--wrapper'], styles['filter--type'])}>
+          <FilterButton isActive={searchFilter.type == undefined} onClick={() => handleSelectedType('default')}>
+            不限
+          </FilterButton>
+          {!!typeList?.length &&
+            typeList?.map((item) => {
+              return (
+                <FilterButton isActive={searchFilter.type === item?.id} onClick={() => handleSelectedType(item?.id)}>
+                  {item.name}
+                </FilterButton>
+              )
+            })}
+        </View>
+      </View>
+
       <View className={styles.filterItem}>
         <View className={styles['filterItem--title']}>查询日期</View>
         <View className={classnames(styles['filterItem--wrapper'], styles['filter--time'])}>
-          <NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
+          {Object.entries(filterTimeOptions).map(([key, value]) => {
-            不限
+            return (
-          </NormalButton>
+              <FilterButton isActive={searchFilter.timeKey === key} onClick={() => handleSelectedTime(key)}>
-          <NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
+                {value.name}
-            今天
+              </FilterButton>
-          </NormalButton>
+            )
-          <NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
+          })}
-            昨日
+          <FilterButton isActive={searchFilter.timeKey === '6'} customClassName={styles.filterTimeButton} onClick={() => handleSelectedTime('6')}>
-          </NormalButton>
+            自定义时间<IconFont name='icon-chakanquanbukehu' size={40} color={searchFilter.timeKey === '6' ? '#4581ff' : '#909090'}></IconFont>
-          <NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
+          </FilterButton>
-            近7日
-          </NormalButton>
-          <NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
-            近30日
-          </NormalButton>
-          <NormalButton type='primary' circle customClassName={styles.filterTypeButton}>
-            近90日
-          </NormalButton>
-          <NormalButton type='primary' circle customClassName={styles.filterTimeButton}>
-            自定义起始时间{<IconFont name='icon-chakanquanbukehu' size={60}></IconFont>}
-          </NormalButton>
         </View>
       </View>
+      <View className={styles.filterController}>
+        <NormalButton type='primary' round customClassName={classnames(styles.btn, styles.rest_btn)} onClick={handleReset}>
+          重置
+        </NormalButton>
+        <NormalButton type='primary' plain round customClassName={classnames(styles.btn, styles.verify_btn)} onClick={handleConfirm}>
+          确认
+        </NormalButton>
+      </View>
     </>
   )
 })
+
+const FilterButton: FC<ButtonPropsType> = (props) => {
+  const { onClick, children, isActive = false, customClassName } = props
+  const handleClick = () => {
+    onClick?.()
+  }
+  return (
+    <View className={classnames(styles.filterButton, isActive && styles['filterButton--active'], customClassName)} onClick={handleClick}>
+      <View className={classnames(styles['filterButton--text'])}>{children}</View>
+    </View>
+  )
+}
+
 export default DeliveryFilter

src/pages/delivery/index.module.scss

@@ -6,6 +6,7 @@ page {
 }
 
 .delivery {
+  position: relative;
   display: flex;
   flex-flow: column nowrap;
   overflow: hidden;
@@ -21,7 +22,7 @@ page {
   .listBox {
     flex: 1 1 auto;
     background-color: #f7f7f7;
-    overflow: scroll;
+    height: 100%;
     &--total {
       display: block;
       margin-top: 24px;

src/pages/delivery/index.tsx

@@ -13,7 +13,8 @@ import IconFont from '@/components/iconfont/iconfont'
 import ItemList from './components/ItemList'
 import DeliveryStatusList from './components/DeliveryStatusList'
 import Popup from '@/components/popup'
-import DeliveryFilter from './components/Filter'
+import DeliveryFilter, { SearchField } from './components/Filter'
+import TimePicker from '@/components/timePicker'
 
 type SearchData = {
   delivery_notice_order_no?: string // 发货单号
@@ -25,23 +26,17 @@ type SearchData = {
   size: number
 }
 
-const scanIcon = () => {
+
-  // 扫描
+
-  const handleScan = () => {}
+const defaultSearchFields = {
-  return (
+  delivery_notice_order_status: 0, // 待发货
-    <View onClick={handleScan} className={styles.scanHandler}>
+  page: 1,
-      <IconFont name='icon-saomiao' size={40}></IconFont>
+  size: 10,
-    </View>
-  )
 }
 
 // 发货列表
 const Delivery: FC = () => {
-  const [search, setSearch] = useState<SearchData>({
+  const [search, setSearch] = useState<SearchData>(defaultSearchFields)
-    delivery_notice_order_status: 0, // 待发货
-    page: 1,
-    size: 10,
-  })
   const [deliveryOrderList, setDeliveryOrderList] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
 
   const { fetchData: FetchDeliveryOrderList, state: orderState } = DeliverNoticeOrderList()
@@ -50,27 +45,15 @@ const Delivery: FC = () => {
     return dataLoadingStatus({ list: deliveryOrderList.list, total: deliveryOrderList.total, status: orderState.loading })
   }, [deliveryOrderList, orderState])
 
-  // const [clientObj, setclientObj] = useState({
-  //   clientId: null,
-  //   clientName: '',
-  // })
-
   //输入搜索关键字
   const getSearchData = useCallback((searchValue: string) => {
+    setSearch((prevProps) => ({ ...prevProps, delivery_notice_order_no: searchValue }))
     console.log('searchValue==>', searchValue)
-    // pageNum.current.page = 1
-    // setClientlist(() => ({ list: [], total: 0 }))
-    // setSearch((e) => ({ ...e, name: eq, size: 10 }))
   }, [])
 
-  // const router = useRouter()
-
   useEffect(() => {
     console.log('useEffect ===> search', search)
-    if (search.delivery_notice_order_no === '') {
+    getData()
-      setSearch((e) => ({ ...e, delivery_notice_order_no: undefined }))
-    }
-    if (search.delivery_notice_order_no !== '') getData()
   }, [search])
 
   //上拉加载数据
@@ -87,6 +70,7 @@ const Delivery: FC = () => {
 
   //列表下拉刷新
   const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
+
   const getRefresherRefresh = async () => {
     pageNum.current.size = 1
     setRefresherTriggeredStatus(true)
@@ -94,59 +78,11 @@ const Delivery: FC = () => {
   }
   const getData = async () => {
     const res = await FetchDeliveryOrderList(getFilterData(search))
-    // if (router?.params.clientId) {
+
-    //   res.data.list.map((item) => {
-    //     if (item.id == router?.params.clientId) {
-    //       item.checked = true
-    //     } else {
-    //       item.checked = false
-    //     }
-    //     return item
-    //   })
-    // }
     setDeliveryOrderList((e) => ({ ...e, list: res.data?.list, total: res.data?.total }))
     setRefresherTriggeredStatus(() => false)
   }
 
-  // //选择客户
-  // const selectClient = (item) => {
-  //   clentList.list.map((it) => {
-  //     if (item.id === it.id) {
-  //       it.checked = true
-  //     } else {
-  //       it.checked = false
-  //     }
-  //     return it
-  //   })
-  //   setclientObj(item)
-  //   let pages = Taro.getCurrentPages() // 获取当前的页面栈
-  //   let prevPage = pages[pages.length - 2]
-  //   prevPage.setData({
-  //     //设置上一个页面的值
-  //     clientId: item.id,
-  //     clientName: item.name,
-  //   })
-  //   setClientlist((e) => ({ ...e, list: clentList?.list, total: clentList?.total }))
-  //   Taro.navigateBack({
-  //     delta: 1,
-  //   })
-  // }
-  // useEffect(() => {
-  //   if (clientObj?.clientId !== null) {
-  //     setclientObj(clientObj)
-  //   } else {
-  //     let pages = Taro.getCurrentPages() // 获取当前的页面栈
-  //     let prevPage = pages[pages.length - 2]
-  //     prevPage.setData({
-  //       //设置上一个页面的值
-  //       clientId: '',
-  //       clientName: '',
-  //     })
-  //   }
-  // }, [clientObj])
-
-  const handleChangeFilterData = () => {}
-
   const [currentStatus, setCurrentStatus] = useState('待发货')
 
   const handleChangeStatus = ({ id: statusId, name: statusName }) => {
@@ -158,7 +94,6 @@ const Delivery: FC = () => {
     }
     setCurrentStatus(statusName)
     setSearch((e) => ({ ...e, delivery_notice_order_status: fuckingBadCodeId }))
-    getData()
   }
 
   const handleAuditSuccess = () => {
@@ -170,16 +105,74 @@ const Delivery: FC = () => {
   const onShowFilter = () => {
     setShowFilter(true)
   }
+  // 点击关闭筛选列表框
+  const handlePopupClose = () => {
+    setShowFilter(false)
+  }
 
+  // 展示时间筛选
+  const [showTime, setShowTime] = useState(false)
 
-  
+  // 点击关闭时间筛选
+  const handClose = () => {
+    setShowTime(false)
+  }
+  const [start, setStart] = useState(new Date().toLocaleDateString())
+  const [end, setEnd] = useState('')
+  // 选择时间
+  const handTime = (event) => {
+    console.log(event?.value, 'event?.value?.start')
+    setStart(event?.value?.start)
+    setEnd(event?.value?.end)
+    setShowTime(false)
+    console.log(search, 8888)
+  }
+  // 显示时间选择器
+  const handleSearchTime = () => {
+    setShowTime(true)
+  }
+  // 筛选框点击确认
+  const handleConfirm = (changedFields: SearchField, timeKey) => {
+    console.log('changedFields==>changedFields', changedFields)
+    // 自定义时间
+    if (timeKey === '6') {
+      setSearch((prevProps) => ({ ...prevProps, ...changedFields, date_min: start, date_max: end }))
+    } else {
+      setSearch((prevProps) => ({ ...prevProps, ...changedFields }))
+    }
+    handlePopupClose()
+  }
+  // 筛选框点击重置
+  const handleReset = () => {
+    setSearch(defaultSearchFields)
+    handlePopupClose()
+  }
+
+  const scanIcon = () => {
+    // 扫描
+    const handleScan = () => {
+      Taro.scanCode({
+        success(res) {
+          setSearch((e) => ({ ...e, delivery_notice_order_no: res.result }))
+        },
+        fail(res) {
+          console.log(res)
+        },
+      })
+    }
+    return (
+      <View onClick={handleScan} className={styles.scanHandler}>
+        <IconFont name='icon-saomiao' size={40}></IconFont>
+      </View>
+    )
+  }
 
   return (
     <View className={styles.delivery}>
       <View className={styles.searchBox}>
         <Search placeholder='请输入或扫描条形码' showBtn={false} changeOnSearch={getSearchData} debounceTime={300} customRightSlot={scanIcon()}>
           <View onClick={onShowFilter} className={styles.icon__filter}>
-            <IconText iconName='icon-shaixuan' text='筛选' customClass={styles['icon--filter']} />
+            <IconText svg iconName='icon-shaixuan' text='筛选' customClass={styles['icon--filter']} />
           </View>
         </Search>
       </View>
@@ -201,9 +194,10 @@ const Delivery: FC = () => {
           })}
         </InfiniteScroll>
       </View>
-      <Popup show={showFilter} title='筛选列表'>
+      <Popup show={showFilter} title='筛选列表' onClose={handlePopupClose}>
-        <DeliveryFilter />
+        <DeliveryFilter onSearchTime={handleSearchTime} onConfirm={handleConfirm} onReset={handleReset} />
       </Popup>
+      <TimePicker start={start} end={end} showTime={showTime} closePopup={handClose} onSelectDate={(e) => handTime(e)}></TimePicker>
     </View>
   )
 }

src/pages/refundPage/components/timePicker/index.tsx

@@ -1,47 +0,0 @@
-import Popup from '@/components/popup'
-import React, { useState, memo, useEffect } from "react";
-import Taro, { getCurrentInstance } from "@tarojs/taro";
-import { View, Swiper, SwiperItem, Text } from "@tarojs/components";
-// import { AtIcon } from 'taro-ui'
-import './index.scss'
-import classnames from "classnames";
-import AtCalendar from "@/components/calendar/index"
-
-type DateArg = string | number | Date
-interface Props {
-    showTime: true | false,
-    closePopup?: () => void,
-    end?: DateArg
-    start?: DateArg,
-    onSelectDate?: (any) => void
-}
-
-export default memo((props: Props) => {
-    let {
-        showTime = false,
-        closePopup,
-        start = "",
-        end = "",
-        onSelectDate
-    } = props
-    const [time, setTime] = useState<any>({})
-
-    const handTime = (e) => {
-        setTime(e)
-    }
-    return (
-        <Popup title={'选择时间'} show={showTime} onClose={() => closePopup?.()}>
-            <View className='time-box'>
-                <AtCalendar
-                    isMultiSelect
-                    currentDate={{
-                        start: start,
-                        end: end
-                    }}
-                    onSelectDate={(e) => handTime?.(e)}
-                />
-            </View>
-            <View className='sure-box' onClick={() => onSelectDate?.(time)}>确认</View>
-        </Popup >
-    )
-})

src/pages/refundPage/index.tsx

@@ -15,7 +15,7 @@ import {
     mpenumreturnType
 } from "@/api/refound"
 import Tabs from "./components/tabs"
-import TimePicker from "./components/timePicker"
+import TimePicker from "@/components/timePicker"
 export default () => {
 
 
@@ -375,4 +375,4 @@ export default () => {
             ></TimePicker>
         </>
     )
-}
+}

src/pages/shopping/components/shoppingCartItem/index.tsx

@@ -138,6 +138,7 @@ export default memo<PropsType>((props) => {
           <DrawerButton isOpen={openDetail} />
         </View>
       </MCheckbox>
+      {/* 减少节点渲染 */}
       {openDetail && (
         <View className={classnames(styles.detailBox, openDetail ? styles.drawerOpen : styles.drawerClose)}>
           <View className={styles.orderType}>