新增：余额支付、微信支付、下单确认功能

src/pages/index/BestSellers.tsx

@@ -1,7 +1,7 @@
 import {useEffect, useState} from "react";
 import {Image} from '@nutui/nutui-react-taro'
 import {Share} from '@nutui/icons-react-taro'
-import Taro from '@tarojs/taro'
+import Taro, {useShareAppMessage, useShareTimeline} from "@tarojs/taro";
 import {ShopGoods} from "@/api/shop/shopGoods/model";
 import {pageShopGoods} from "@/api/shop/shopGoods";
 import './BestSellers.scss'
@@ -9,6 +9,7 @@ import './BestSellers.scss'
 
 const BestSellers = () => {
   const [list, setList] = useState<ShopGoods[]>([])
+  const [goods, setGoods] = useState<ShopGoods>()
 
   const reload = () => {
     pageShopGoods({}).then(res => {
@@ -20,6 +21,40 @@ const BestSellers = () => {
     reload()
   }, [])
 
+  // 分享给好友
+  useShareAppMessage(() => {
+    return {
+      title: goods?.name || '精选商品',
+      path: `/shop/goodsDetail/index?id=${goods?.goodsId}`,
+      imageUrl: goods?.image, // 分享图片
+      success: function (res: any) {
+        console.log('分享成功', res);
+        Taro.showToast({
+          title: '分享成功',
+          icon: 'success',
+          duration: 2000
+        });
+      },
+      fail: function (res: any) {
+        console.log('分享失败', res);
+        Taro.showToast({
+          title: '分享失败',
+          icon: 'none',
+          duration: 2000
+        });
+      }
+    };
+  });
+
+  // 分享到朋友圈
+  useShareTimeline(() => {
+    return {
+      title: `${goods?.name || '精选商品'} - 云上商店`,
+      path: `/shop/goodsDetail/index?id=${goods?.goodsId}`,
+      imageUrl: goods?.image
+    };
+  });
+
   return (
     <>
       <div className={'py-3'}>
@@ -43,9 +78,18 @@ const BestSellers = () => {
                         <span className={'font-bold text-2xl'}>{item.price}</span>
                       </div>
                       <div className={'buy-btn'}>
-                        <div className={'cart-icon'}>
-                          <Share size={20} className={'mx-4 mt-2'}
-                                 onClick={() => Taro.navigateTo({url: '/shop/goodsDetail/index?id=' + item.goodsId})}/>
+                        <div className={'cart-icon flex items-center'}>
+                          <button
+                            className={'flex flex-col  justify-center items-center text-gray-500 px-3 gap-1 text-nowrap whitespace-nowrap'}
+                            open-type="share"
+                            onClick={() => {
+                              setGoods(item)
+                            }}
+                          >
+                            <Share className={'text-white'} size={20}/>
+                          </button>
+                          {/*<Share size={20} className={'mx-4 mt-2'}*/}
+                          {/*       onClick={() => Taro.navigateTo({url: '/shop/goodsDetail/index?id=' + item.goodsId})}/>*/}
                         </div>
                         <div className={'text-white pl-4 pr-5'}
                              onClick={() => Taro.navigateTo({url: '/shop/goodsDetail/index?id=' + item.goodsId})}>购买

src/pages/index/Header.scss

@@ -6,3 +6,11 @@
   position: absolute;
   z-index: 0;
 }
+.header-bg2{
+  background: linear-gradient(to bottom, #03605c, #18ae4f);
+  height: 200px;
+  width: 100%;
+  top: 0;
+  position: absolute;
+  z-index: 0;
+}

src/pages/index/Header.tsx

@@ -1,7 +1,7 @@
 import {useEffect, useState} from "react";
 import Taro from '@tarojs/taro';
 import {Button, Space} from '@nutui/nutui-react-taro'
-import {TriangleDown} from '@nutui/icons-react-taro'
+import {TriangleDown, Search} from '@nutui/icons-react-taro'
 import {Popup, Avatar, NavBar} from '@nutui/nutui-react-taro'
 import {getSiteInfo, getUserInfo, getWxOpenId} from "@/api/layout";
 import {TenantId} from "@/config/app";
@@ -12,7 +12,7 @@ import {User} from "@/api/system/user/model";
 import MySearch from "./MySearch";
 import './Header.scss';
 
-const Header = () => {
+const Header = (props: any) => {
   const [userInfo, setUserInfo] = useState<User>()
   const [IsLogin, setIsLogin] = useState<boolean>(true)
   const [config, setConfig] = useState<CmsWebsite>()
@@ -140,8 +140,10 @@ const Header = () => {
 
   return (
     <>
-      <div className={'fixed top-0 header-bg'}>
-        <MySearch done={reload}/>
+      <div className={'fixed top-0 header-bg'} style={{
+        height: !props.stickyStatus ? '180px' : '94px',
+      }}>
+        {!props.stickyStatus && <MySearch done={reload}/>}
       </div>
       <NavBar
         style={{marginTop: `${statusBarHeight}px`, marginBottom: '0px', backgroundColor: 'transparent'}}
@@ -171,6 +173,11 @@ const Header = () => {
               <TriangleDown className={'text-white'} size={9}/>
             </div>
           )}>
+        {props.stickyStatus && (
+          <Space>
+            <Search className={'text-white mx-2'} size={18}/>
+          </Space>
+        )}
       </NavBar>
       <Popup
         visible={showBasic}

src/pages/index/index.tsx

@@ -2,7 +2,7 @@ import Header from './Header';
 import BestSellers from './BestSellers';
 import Taro from '@tarojs/taro';
 import {useShareAppMessage, useShareTimeline} from "@tarojs/taro"
-import {useEffect} from "react";
+import {useEffect, useState} from "react";
 import {getSiteInfo} from "@/api/layout";
 import {Sticky} from '@nutui/nutui-react-taro'
 import Menu from "./Menu";
@@ -12,6 +12,8 @@ import './index.scss'
 // import GoodsList from "./GoodsList";
 
 function Home() {
+  // 吸顶状态
+  const [stickyStatus, setStickyStatus] = useState<boolean>(false)
 
   useShareTimeline(() => {
     return {
@@ -70,6 +72,12 @@ function Home() {
     });
   };
 
+  const onSticky = (item) => {
+    if(item){
+      setStickyStatus(!stickyStatus)
+    }
+  }
+
   const reload = () => {
 
   };
@@ -104,8 +112,8 @@ function Home() {
 
   return (
     <>
-      <Sticky threshold={0}>
-        <Header/>
+      <Sticky threshold={0} onChange={() => onSticky(arguments)}>
+        <Header stickyStatus={stickyStatus}/>
       </Sticky>
       <div className={'flex flex-col mt-12'}>
         <Menu/>