boxShadow

src/pages/recommend/index.jsx

@@ -11,22 +11,32 @@ import { AtFab } from "taro-ui";
 import request from "../../util/request";
 
 const ImageCard = props => {
-  const { image,onDelete } = props;
+  const { image, onDelete } = props;
   const user = useSelector(state => state.user);
   const [isopen, setIsOpen] = useState(false);
-
-  return  (
+// boxShadow:'0rpx 12rpx 0rpx 0rpx #8a8b8d'
+  return (
     <View
       className="recommend-view-card"
-      style={
-
-          { height: !isopen?'333rpx':undefined, overflow: "hidden"}
-         
-      }
+      style={{ height: !isopen ? "330rpx" : undefined, overflow: "hidden" ,background:'#fff', boxShadow:'6rpx 12rpx 0rpx #898989' }}
     >
-      <Image className="recommend-view-img" mode="widthFix" src={image} onClick={() => setIsOpen(!isopen)}></Image>
-
-      {userRloe.customer == user.role ? undefined : (
+      {/* <View onClick={() => setIsOpen(!isopen)}  style={{zIndex:99,boxShadow:'6rpx 12rpx 0rpx #898989',position: 'absolute',width:'100%',height:'330rpx',borderRadius: '30rpx',opacity:0}}>
+
+      </View>
+      <View onClick={() => setIsOpen(!isopen)}  style={{zIndex:-9, boxShadow:'0rpx 12rpx 0rpx -4rpx #898989',position: 'absolute',bottom:'0',width:'670rpx',background:'#fff', height:'100%',borderRadius: '30rpx',opacity:0}}>
+
+      </View> */}
+      <Image
+        className="recommend-view-img"
+        mode="widthFix"
+        src={image}
+        onClick={() => setIsOpen(!isopen)}
+        style={{zIndex:1}}
+      ></Image>
+
+      {userRloe.customer == user.role ? (
+        undefined
+      ) : (
         <Image
           className="icon"
           src={deleteicon}
@@ -36,12 +46,12 @@ const ImageCard = props => {
         ></Image>
       )}
     </View>
-  )
-//   : (
-//     <View>
-//       <Image className="recommend-view-img" mode="widthFix" src={image} onClick={() => setIsOpen(!isopen)}></Image>
-//     </View>
-//   );
+  );
+  //   : (
+  //     <View>
+  //       <Image className="recommend-view-img" mode="widthFix" src={image} onClick={() => setIsOpen(!isopen)}></Image>
+  //     </View>
+  //   );
 };
 
 const recommend = props => {
@@ -110,7 +120,7 @@ const recommend = props => {
           return (
             <View className="recommend-view">
               <ContainerLayout className="recommend-view-layout">
-                <ImageCard image={x.image} onDelete={()=>onClick(x)}/>
+                <ImageCard image={x.image} onDelete={() => onClick(x)} />
                 {/* {id != x.surroundId ? <View className='recommend-view-card' style={userRloe.customer == user.role ? { height: "300rpx",overflow:'hidden' }:''}>
 
                             <Image className='recommend-view-img' mode='widthFix' src={x.image} ></Image>

src/pages/recommend/index.scss

@@ -7,6 +7,7 @@
       width: 100%;
       // height: 420px;
       border-radius: 30px;
+      
     }
     &-img{
       width: 100%;
@@ -26,7 +27,12 @@
      
     }
   }
-
+  .recommend-view-card:before{
+    content:'';
+    width: 100%;
+    height: 330px;
+    box-sizing:8rpx 12rpx 0rpx #898989
+  }
   .icon{
       width: 10px;
       height: 40px;