。

src/components/CompoentsOrder/OrderCard/index.jsx

@@ -1,7 +1,7 @@
 import Taro from "@tarojs/taro";
 import { View, Text } from '@tarojs/components'
 import formatTime from "@/utils/formatTime";
-import SlideViewOrder from '@/components/SlideViewOrder';
+import SlideView from '@/components/SlideView';
 import CouponCard from '@/components/CouponCard'
 import QRcode from "@/assets/icons/UserCenter/QRcode.png";
 import refund from "@/assets/icons/GuideCheck/refund.png";
@@ -80,7 +80,7 @@ export default (props) => {
         sh != '1' || kkp != '1' ? <view className='OrderNumber'>订单编号：{item.orderId}</view> : null
       }
       {
-        item.status === 0 ? <SlideViewOrder del onDelete={() => handeDelete(item)} >
+        item.status === 0 ? <SlideView del onDelete={() => handeDelete(item)} >
           <CouponCard action={PayAction}>
             <CouponMedia>
               <CouponMedia.Header
@@ -113,7 +113,7 @@ export default (props) => {
               </CouponMedia.Body>
             </CouponMedia>
           </CouponCard>
-        </SlideViewOrder>
+        </SlideView>
           :
           <CouponCard onClick={() => {
             item.status === 1 && item.isVerified == false ? Taro.navigateTo({ url: `/pages/details/foodDetails/foodDetails?id=${item.shopId}` }) : ''

src/components/CompoentsOrder/complete/index.jsx

@@ -88,7 +88,6 @@ export default (props) => {
     setItem(val)
   }
   const slideButtonTap = (e) => {
-    console.log(e)
     deleteOrder(e.orderId).then(() => {
       Taro.showToast({
         title: '删除订单成功',
@@ -120,7 +119,6 @@ export default (props) => {
                 if (item.status === 0) {
                   return (
                     <SpinBox loading={loading} className='index-container' >
-
                       <view key={`${type}-${item.orderId}`}  >
                         <OrderCard item={item} handeDelete={slideButtonTap} />
                       </view>
@@ -131,24 +129,20 @@ export default (props) => {
                 else if (item.isVerified == 1) {
                   return (
                     <SpinBox loading={loading} className='index-container' >
-
                       <view key={`${type}-${item.orderId}`}>
                         <OrderCard item={item} setShowCutover={setShowCutover} show={show} />
                       </view>
                     </SpinBox>
-
                   );
                 }
                 /* 待核销 */
                 else {
                   return (
                     <SpinBox loading={loading} className='index-container' >
-
                       <view key={`${type}-${item.orderId}`}>
                         <OrderCard item={item} />
                       </view>
                     </SpinBox>
-
                   );
                 }
               })}

src/components/SlideView/index.jsx

@@ -56,7 +56,7 @@ export default (props) => {
             const { height } = res[0]
             if (height && height !== contentHeightRef.current) {
               setActStyle({
-                height: `${height}px`,
+                height: `calc(${height}px - 10px)`,
               })
               contentHeightRef.current = height
             }

src/components/SlideViewOrder/index.jsx

@@ -1,97 +0,0 @@
-
-import React, { useEffect, useMemo, useRef, useState } from 'react'
-import Taro from '@tarojs/taro';
-import { ScrollView, View, Image, Text } from '@tarojs/components';
-import deleteIcon from '@/assets/icons/landlord/delete.png';
-import './style.less'
-
-export default (props) => {
-  const { className, action, del, onDelete } = props;
-
-  const contextRef = useRef()
-  const contentHeightRef = useRef(0)
-  const [actStyle, setActStyle]= useState()
-
-  const uqClass = useMemo(() => `f-${Math.random().toString(36).substring(2)}`, [])
-  const classes = [className, 'slideview-wrapper', uqClass].filter(Boolean).join(' ');
-
-  const handleScrollLeft = () => {
-    if (contextRef.current) {
-      contextRef.current.scrollIntoView('.slideview-content')
-    }
-  }
-
-  const handleScrollRight = () => {
-    if (contextRef.current) {
-      contextRef.current.scrollIntoView('.slideview-actions')
-    }
-  }
-
-  const handleDelete = (e) => {
-    if (onDelete) {
-      onDelete(e)
-    }
-  }
-
-  useEffect(() => {
-    Taro.nextTick(() => {
-      Taro.createSelectorQuery()
-      .select(`.${uqClass}`)
-      .node()
-      .exec((res) => {
-        contextRef.current = res[0].node;
-      })
-    })
-  }, [])
-
-  useEffect(() => {
-    Taro.nextTick(() => {
-      // 不清楚为什么, 此处获取高度一直不准确
-      const t = setTimeout(() => {
-        Taro.createSelectorQuery()
-        .select(`.${uqClass}`)
-        .boundingClientRect()
-        .exec((res) => {
-          if (res && res[0]) {
-            const { height } = res[0]
-            if (height && height !== contentHeightRef.current) {
-              setActStyle({
-                height: `${height}px`,
-              })
-              contentHeightRef.current = height
-            }
-          }
-        })
-        clearTimeout(t)
-      }, 500)
-    })
-  })
-
-  return (
-    <ScrollView
-      className={classes}
-      upperThreshold={20}
-      lowerThreshold={20}
-      scrollX
-      scrollWithAnimation
-      enhanced
-      onScrollToUpper={handleScrollLeft}
-      onScrollToLower={handleScrollRight}
-    >
-      <View className='slideview-content'>{props.children}</View>
-      <View className='slideview-actions' style={actStyle}>
-        <View className='slideview-action'>
-          {
-            del && (
-              <View className='slideview-action_delete' onClick={handleDelete}>
-                <Image src={deleteIcon} />
-                <View>删除</View>
-              </View>
-            )
-          }
-          {action}
-        </View>
-      </View>
-    </ScrollView>
-  )
-}

src/components/SlideViewOrder/style.less

@@ -1,52 +0,0 @@
-.slideview-wrapper {
-  box-sizing: border-box;
-  white-space: nowrap;
-
-  &::-webkit-scrollbar{
-    width: 0;
-    height: 0;
-    color: transparent;
-  }
-
-  .slideview-content {
-    min-width: 100%;
-    display: inline-block;
-    vertical-align: middle;
-  }
-
-  .slideview-actions {
-    display: inline-block;
-    vertical-align: middle;
-    margin: 0 20px;
-    background: #FFFFFF;
-    box-shadow: 0px 8px 38px 0px rgba(0, 0, 0, 0.12);
-    border-radius: 12px;
-
-    .slideview-action {
-      height: 100%;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      
-      &_delete {
-        display: block;
-        flex: none;
-        height: 74px;
-        width: 67px;
-        text-align: center;
-        padding: 10px;
-        font-size: 24px;
-        font-weight: bold;
-        color: #FF3434;
-
-        & > image {
-          width: 28px;
-          height: 30px;
-          display: block;
-          margin: 0 auto 20px;
-        }
-      }
-    }
-
-  }
-}