自购和分享赚优化&&搜索优化

src/components/index/ProductList/index.jsx

@@ -15,15 +15,16 @@ import ShareModal from "../../shareModal";
 import joinStoreBg from "../../../images/index/jionStore.png";
 import joinStoreAc from "../../../images/index/joinStoreAc.png";
 import saveMoneyBg from "../../../images/index/save-money.png";
+import buy from "../../../images/index/buy.png";
 import shareEarnBg from "../../../images/index/share-earn.png";
 import seckillIcon from "../../../images/seckill/seckillIcon.png";
-import { isDebounce } from '../../../common/debounce';
+import { isDebounce } from "../../../common/debounce";
 const ProductList = forwardRef((props, ref) => {
   const {
     productList, // 商品列表数据
     loading, // 加载状态
     isSeckill, // 是否秒杀页面使用
-    isHighCommission, // 是否高佣金页面使用
+    isHighCommission, // 是否高佣金��面使用
     isManagement, // 是否管理页面使用
     isManagementStatus, // 是否管理状态
     isProductClassify, // 是否分类页面使用
@@ -32,6 +33,7 @@ const ProductList = forwardRef((props, ref) => {
     onDeleteProductSelect, // 删除商品选中id数组
     isNoMore, // 是否没有更多
     shareUserId, // 分享用户id
+    isEmpty, // 是否为空
   } = props;
 
   const [selectedProducts, setSelectedProducts] = useState([]); // 商品选择状态
@@ -169,11 +171,11 @@ const ProductList = forwardRef((props, ref) => {
         <View key={product.id}>
           <View onClick={() => toDetail(product.id)} className="product-item">
             {isManagement && isManagementStatus && (
-              <View 
-                className="checkbox-wrapper" 
+              <View
+                className="checkbox-wrapper"
                 onClick={(e) => {
                   e.stopPropagation();
-                  selectProduct(product.id);  // 直接调用 selectProduct
+                  selectProduct(product.id); // 直接调用 selectProduct
                 }}
               >
                 <AtCheckbox
@@ -239,19 +241,26 @@ const ProductList = forwardRef((props, ref) => {
                   )}
                 </View>
                 <View className="profit-line">
-                  <View className="save-money">
-                  <Image className="bg" src={saveMoneyBg} mode="aspectFit" />
-                    <View className="content">
+                  {Number(product.estimated_commission_buy) > 0 ? (
+                    <View className="save-money">
+                      <Image
+                        className="bg"
+                        src={saveMoneyBg}
+                        mode="aspectFit"
+                      />
+                      <View className="content">
                         <Text className="label">自购省</Text>
                         <Text className="money">
-                          ¥{product.estimated_commission_promotion}
+                          ¥{product.estimated_commission_buy}
                         </Text>
+                      </View>
                     </View>
-                  </View>
-                  {/* <View className="save-money">
-                    <Image className="bg" src={saveMoneyBg} mode="aspectFit" />
-                    <View className="content">立 即 购 买</View>
-                  </View> */}
+                  ) : (
+                    <View className="buy">
+                      <Image className="bg" src={buy} mode="aspectFit" />
+                      <View className="content">立 即 购 买</View>
+                    </View>
+                  )}
                   <View className="share-earn">
                     <Image className="bg" src={shareEarnBg} mode="aspectFit" />
                     <View className="content">
@@ -260,7 +269,7 @@ const ProductList = forwardRef((props, ref) => {
                       >
                         <Text className="label">分享赚</Text>
                         <Text className="money">
-                          ¥{product.estimated_commission_buy}
+                          ¥{product.estimated_commission_promotion}
                         </Text>
                       </Button>
                     </View>
@@ -284,14 +293,17 @@ const ProductList = forwardRef((props, ref) => {
           />
         </View>
       )}
-      {isNoMore && <View className="no-more">没有更多了~</View>}
+      {isNoMore && !isEmpty && <View className="no-more">没有更多了~</View>}
       {/* 分享弹窗 */}
       <ShareModal
         onClose={() => {
           setShareModalOpened(false);
-          setCurrentShareProduct(null);
-          setShareTitle("");
-          setShareLink("");
+          // 添加延时，等待关闭动画完成后再重置其他状态
+          setTimeout(() => {
+            setCurrentShareProduct(null);
+            setShareTitle("");
+            setShareLink("");
+          }, 300); // 300ms 或根据实际动画时长调整
         }}
         isOpened={shareModalOpened}
         product={currentShareProduct}
@@ -312,6 +324,7 @@ ProductList.defaultProps = {
   isSelectAll: false,
   isNoMore: false,
   shareUserId: "",
+  isEmpty: false, // 是否为空
   onAddProduct: () => {}, // 添加商品方法
   onDeleteProductSelect: () => {}, // 删除商品选中id数组
 };

src/components/index/ProductList/index.less

@@ -145,7 +145,30 @@
           //   text-align: center;
           // }
         }
+        .buy{
+          color: #F6C71A;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          position: relative;
+          width: 192px;
+          height: 84px;
 
+          .bg {
+            width: 100%;
+            height: 100%;
+            position: absolute;
+            top: 0;
+            left: 0;
+          }
+          .content {
+            width: 74px;
+            height: 80px;
+            font-size: 28px;
+            line-height: 41px;
+            text-align: center;
+          }
+        }
         .share-earn {
           color: #fff;
         }

src/pages/index/index.less

@@ -50,7 +50,6 @@
         .tab-more-img {
           width: 28px;
           height: 28px;
-          background-color: red;
         }
       }
 

src/pages/indexSub/productDetail/index.jsx

@@ -70,9 +70,9 @@ export default class Index extends Component {
     });
     const { id, isShare, isHighCommission, isSeckill, shareJump, shareUserId } =
       Taro.getCurrentInstance().router.params;
-      let session_key = Taro.getStorageSync("session_key");
-      let userInfo = Taro.getStorageSync("userInfo");
-      let isShowSign = Taro.getStorageSync("isShowSign");
+    let session_key = Taro.getStorageSync("session_key");
+    let userInfo = Taro.getStorageSync("userInfo");
+    let isShowSign = Taro.getStorageSync("isShowSign");
     this.setState(
       {
         id,
@@ -99,7 +99,12 @@ export default class Index extends Component {
       }
     );
     // 判断是否显示签约弹窗
-    if (session_key && isShowSign!==false && userInfo && userInfo.user_identity == 0) {
+    if (
+      session_key &&
+      isShowSign !== false &&
+      userInfo &&
+      userInfo.user_identity == 0
+    ) {
       this.setState({
         isOpened: "sign",
       });
@@ -331,13 +336,22 @@ export default class Index extends Component {
                   <Image src={share} mode="aspectFit" />
                   <Text className="bottom-buy-text">分享赚</Text>
                 </View>
-                <View
-                  onClick={this.handleBuy}
-                  className="bottom-buy-right-share"
-                >
-                  <Image src={selfBuy} mode="aspectFit" />
-                  <Text className="bottom-buy-text">自购省</Text>
-                </View>
+                {Number(productDetail.estimated_commission_buy) > 0 ? (
+                  <View
+                    onClick={this.handleBuy}
+                    className="bottom-buy-right-share"
+                  >
+                    <Image src={selfBuy} mode="aspectFit" />
+                    <Text className="bottom-buy-text">自购省</Text>
+                  </View>
+                ) : (
+                  <View
+                    onClick={this.handleBuy}
+                    className="bottom-buy-right-share"
+                  >
+                    <Text className="bottom-buy-text">立即购买</Text>
+                  </View>
+                )}
               </>
             ) : (
               <View onClick={this.handleBuy} className="bottom-buy-right-btn">
@@ -372,11 +386,14 @@ export default class Index extends Component {
           />
         )}
         {/* 签约弹窗 */}
-        <SignModal isOpened={this.state.isOpened == "sign"} onClose={() => {
-          this.setState({
-            isOpened: "",
-          });
-        }}/>
+        <SignModal
+          isOpened={this.state.isOpened == "sign"}
+          onClose={() => {
+            this.setState({
+              isOpened: "",
+            });
+          }}
+        />
       </View>
     );
   }

src/pages/indexSub/searchList/index.jsx

@@ -51,14 +51,24 @@ export default class Index extends Component {
     }
   };
   render() {
+    const { productList, loading, isNoMore } = this.state;
+    
     return (
       <View className="index">
+        {/* 无搜索结果提示 */}
+        {!loading && productList.length === 0 && (
+          <View className="empty-result">
+            <AtIcon value="search" size="30" color="#999"></AtIcon>
+            <View className="empty-text">暂无相关商品</View>
+          </View>
+        )}
         {/* 搜索列表 */}
-          <ProductList
-            productList={this.state.productList}
-            loading={this.state.loading}
-            isNoMore={this.state.isNoMore}
-          ></ProductList>
+        <ProductList
+          productList={productList}
+          loading={loading}
+          isNoMore={isNoMore}
+          isEmpty={productList.length === 0}
+        ></ProductList>
       </View>
     );
   }

src/pages/indexSub/searchList/index.less

@@ -4,3 +4,17 @@
     padding-top: 20px;
     box-sizing: border-box;
 }
+
+.empty-result {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 60px 0;
+  
+  .empty-text {
+    color: #999;
+    font-size: 28px;
+    margin-top: 20px;
+  }
+}