Great upload

src/components/SwitchSelect/index.jsx

@@ -0,0 +1,41 @@
+import Popup from '@/components/Popup'
+import Taro from '@tarojs/taro'
+import touristON from '@/assets/icons/UserCenter/touristON.png'
+import touristOFF from '@/assets/icons/UserCenter/touristOFF.png'
+import hotelBossON from '@/assets/icons/UserCenter/hotelBossON.png'
+import hotelBossOFF from '@/assets/icons/UserCenter/hotelBossOFF.png'
+import shopBossON from '@/assets/icons/UserCenter/shopBossON.png'
+import shopBossOFF from '@/assets/icons/UserCenter/shopBossOFF.png'
+
+const goToHotel = () => {
+  Taro.redirectTo({ url: '/hotel/pages/landlord/landlord' })
+}
+const goToShop = () => {
+  Taro.redirectTo({ url: '/shop/pages/spread/spreadIndex' })
+}
+
+export default (props) => {
+  const { show, maskClosable } = props
+
+  return (
+
+    <Popup show={show} maskClosable={maskClosable}>
+      <view className='User-box-sths' >
+        <view className='User-box-selectUser'>请选择身份：</view>
+        <view className='User-box-tourist' >
+          <image className='Ubs-tourist-image' src={touristON} />
+          <text className='Ubs-tourist-text'>游客</text>
+        </view>
+        <view className='User-box-hotelBoss' onClick={goToHotel}>
+          <image className='Ubs-hotelBoss-image' src={hotelBossOFF} />
+          <text className='Ubs-hotelBoss-text'>民宿老板</text>
+        </view>
+        <view className='User-box-shopBoss' onClick={goToShop}>
+          <image className='Ubs-shopBoss-image' src={shopBossOFF} />
+          <text className='Ubs-shopBoss-text'>店铺老板</text>
+        </view>
+      </view>
+    </Popup>
+  )
+}
+

src/pages/index/tabs/Guide.jsx

@@ -25,7 +25,7 @@ const score = '3.9'
 
 
 
-export default withLayout((props) => {
+export default (props) => {
   const { router, person } = props
   const [value, setVaule] = useState('已收藏')
   const [imageSrc, setImageSrc] = useState(starOn)
@@ -279,4 +279,4 @@ export default withLayout((props) => {
     </scroll-view>
 
   )
-})
+}

src/pages/index/tabs/Mine.jsx

@@ -1,8 +1,6 @@
 
-import { useState, useRef, useEffect } from 'react'
+import { useState } from 'react'
 import Taro from '@tarojs/taro'
-import withLayout from '@/layouts'
-import Popup from '@/components/Popup'
 import AuthPage from '@/components/AuthPage'
 import boy from '@/assets/icons/UserCenter/boy.png'
 import girl from '@/assets/icons/UserCenter/girl.png'
@@ -14,89 +12,49 @@ import HomeLogo from '@/assets/icons/UserCenter/HomeLogo.png'
 import ContactMe from '@/assets/icons/UserCenter/ContactMe.png'
 import collect from '@/assets/icons/UserCenter/collect.png'
 import Rules from '@/assets/icons/UserCenter/Rules.png'
-import UserImages from '@/assets/icons/ProCard/8kb.jpg'
+import DefaultImage from '@/assets/icons/UserCenter/DefaultImage.png'
 import cutoverUser from '@/assets/icons/UserCenter/cutoverUser.png'
-import touristON from '@/assets/icons/UserCenter/touristON.png'
-import touristOFF from '@/assets/icons/UserCenter/touristOFF.png'
-import hotelBossON from '@/assets/icons/UserCenter/hotelBossON.png'
-import hotelBossOFF from '@/assets/icons/UserCenter/hotelBossOFF.png'
-import shopBossON from '@/assets/icons/UserCenter/shopBossON.png'
-import shopBossOFF from '@/assets/icons/UserCenter/shopBossOFF.png'
+import SwitchSelect from '@/components/SwitchSelect'
+import { useModel } from '@/store'
 import './MineCss/style.less'
 
 
 
-export default withLayout((props) => {
-  const { router, person } = props
-  const [showCutover, setShowCutover] = useState(false)
-  // const [userState] = useRef({})
-  const [userLogin, setUserLogin] = useState('NotLogin')
-
-  const [userImage, setUserImage] = useState(UserImages)
-  const [userName, setUserName] = useState('请点击登陆')
-  const [userSex, setUserSex] = useState(girl)
-
-
-
-  // // 我的行程 
-  // const HomeLogo = () => {
-  //   Taro.navigateTo({ url: '/pages/MineUserAll/Rules/index' })
-  // }
-
-  useEffect(() => {
-    if (userImage === UserImages) {
-      Taro.showToast({
-        title: '未登陆，请先登陆',
-        icon: 'error',
-        duration: 2000
-      })
-    } else {
-      setUserLogin('Login')
-    }
-  }, [userName, userImage])
+export default (props) => {
+  const { person } = props
 
+  const { getAvatar } = useModel('person')
+  const [showCutover, setShowCutover] = useState(false)
+  const hasAvatar = !!person.avatar
+  const hidePhone = person.phone.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2")
 
   const ShowMoldeOn = () => {
     setShowCutover(true)
   }
-  const ok = () => {
-    setShowCutover(false)
-  }
-
-
-
 
   // 通过getUserProfile获取微信用户信息
   const handleGetUserProfile = () => {
-    if (userImage === UserImages && userName === '请点击登陆') {
-      Taro.getUserProfile({
-        lang: 'zh_CN',
-        desc: "获取你的昵称、头像、地区及性别",
-        success: res => {
-          const avatarUrl = res.userInfo.avatarUrl
-          const nickName = res.userInfo.nickName
-          const gender = res.userInfo.gender
-          setUserImage(avatarUrl)
-          setUserName(nickName)
-          if (gender === 0) {
-
-          } else {
-            setUserSex(boy)
-
-          }
-          console.log('getUserProfile', res);
-
-        },
-        fail: () => {
-          //拒绝授权
-          console.error("您拒绝了请求");
-          return;
+    if (hasAvatar) return;
+
+    Taro.getUserProfile({
+      lang: 'zh_CN',
+      desc: "获取你的昵称、头像、地区及性别",
+      success: (res) => {
+        console.log("🚀 ~ file: Mine.jsx ~ line 75 ~ handleGetUserProfile ~ res", res)
+        const sessionKey = Taro.getStorageSync('sessionKey')
+        const data = {
+          ...res,
+          sessionKey,
         }
-      })
-    } else {
-
-    }
+        getAvatar(data)
 
+      },
+      fail: () => {
+        //拒绝授权
+        console.error("您拒绝了请求");
+        return;
+      }
+    })
 
   };
   //#region 
@@ -135,102 +93,75 @@ export default withLayout((props) => {
     Taro.navigateTo({ url: '/pages/MineUserAll/Rules/index' })
   }
 
-  const goToHotel = () => {
-    Taro.redirectTo({ url: '/hotel/pages/landlord/landlord' })
-  }
-  const goToShop = () => {
-    Taro.redirectTo({ url: '/shop/pages/spread/spreadIndex' })
-  }
   //#endregion
 
   return !person.phone ? <AuthPage /> : (
     <scroll-view scroll-y style='height: 77vh;' >
       <view className='User-box'>
         {/* 身份切换 */}
-        <Popup show={showCutover} maskClosable={false}>
-          <view className='User-box-sths' >
-            <view className='User-box-selectUser'>请选择身份：</view>
-            <view className='User-box-tourist' onClick={ok}>
-              <image className='Ubs-tourist-image' src={touristON} />
-              <text className='Ubs-tourist-text'>游客</text>
-            </view>
-            <view className='User-box-hotelBoss' onClick={goToHotel}>
-              <image className='Ubs-hotelBoss-image' src={hotelBossOFF} />
-              <text className='Ubs-hotelBoss-text'>民宿老板</text>
-
-            </view>
-            <view className='User-box-shopBoss' onClick={goToShop}>
-              <image className='Ubs-shopBoss-image' src={shopBossOFF} />
-              <text className='Ubs-shopBoss-text'>店铺老板</text>
-            </view>
-          </view>
-        </Popup>
+        <SwitchSelect show={showCutover} maskClosable />
         <view className='User-info'>
           <view className='User-photos-box'>
-            <image src={userImage} className='User-photos' />
+            <image src={person.avatar || { DefaultImage }} className='User-photos' />
           </view>
           <view className='User-info-all'>
-            <view onClick={() => handleGetUserProfile()} className='User-name'>{userName}</view>
-            <view className='User-phone'>136****9434</view>
-            <image className='User-sex' src={userSex} />
+            <view onClick={handleGetUserProfile} className='User-name'>{hasAvatar ? person.nickName : '点击授权头像'}</view>
+            <view className='User-phone'>{hidePhone}</view>
+            <image className='User-sex' src={person.sex === 1 ? boy : girl} />
           </view>
           {/* 切换身份 */}
           <view onClick={ShowMoldeOn} className='User-info-cutover'>
             <image className='User-info-cutover-image' src={cutoverUser} />
           </view>
         </view>
-        {
-          userLogin === 'Login' &&
-          <view>
-            <view className='buy-list-box'>
-              <view className='buy-list-Paybox' onClick={handleTobePaid} >
-                <image className='buy-list-PayLogo' src={awaitPay} />
-                <view className='buy-list-goPay'>待支付</view>
-                <view className='buy-list-OrderNumber'>2笔订单</view>
-              </view>
-              <view className='buy-list-Paybox ' onClick={handleTobeWritten} >
-                <image className='buy-list-PayLogo' src={ToShop} />
-                <view className='buy-list-goPay'>待核销</view>
-                <view className='buy-list-OrderNumber'>1个订单</view>
-              </view>
-              <view className='buy-list-Paybox ' onClick={handleAllOrder} >
-                <image className='buy-list-PayLogo' src={AllOrder} />
-                <view className='buy-list-goPay'>全部订单</view>
-                <view className='buy-list-OrderNumber'>查看详情</view>
-              </view>
-              <view className='buy-list-Paybox ' onClick={handleRefund} >
-                <image className='buy-list-PayLogo' src={Refund} />
-                <view className='buy-list-goPay'>退款/售后</view>
-                <view className='buy-list-OrderNumber'>2笔订单</view>
-              </view>
+        <view>
+          <view className='buy-list-box'>
+            <view className='buy-list-Paybox' onClick={handleTobePaid} >
+              <image className='buy-list-PayLogo' src={awaitPay} />
+              <view className='buy-list-goPay'>待支付</view>
+              <view className='buy-list-OrderNumber'>2笔订单</view>
+            </view>
+            <view className='buy-list-Paybox ' onClick={handleTobeWritten} >
+              <image className='buy-list-PayLogo' src={ToShop} />
+              <view className='buy-list-goPay'>待核销</view>
+              <view className='buy-list-OrderNumber'>1个订单</view>
+            </view>
+            <view className='buy-list-Paybox ' onClick={handleAllOrder} >
+              <image className='buy-list-PayLogo' src={AllOrder} />
+              <view className='buy-list-goPay'>全部订单</view>
+              <view className='buy-list-OrderNumber'>查看详情</view>
             </view>
-            <view className='Badge-box'>
-              <view className='Badge-list' onClick={handleHomeLogo}>
-                <image className='Badge-list-logo' src={HomeLogo} />
-                <text className='Badge-list-titme'> 入住指引</text>
-                <text className='Badge-list-gt'>&gt;</text>
-              </view>
-              <view className='Badge-list' onClick={handleCollect}>
-                <image className='Badge-list-logo' src={collect} />
-                <text className='Badge-list-titme'> 我的收藏</text>
-                <text className='Badge-list-gt'>&gt;</text>
-              </view>
-              <view className='Badge-list' onClick={handleContactMe}>
-                <image className='Badge-list-logo' src={ContactMe} />
-                <text className='Badge-list-titme'> 联系我们</text>
-                <text className='Badge-list-gt'>&gt;</text>
-              </view>
-              <view className='Badge-list' onClick={handleRules}>
-                <image className='Badge-list-logo' src={Rules} />
-                <text className='Badge-list-titme'> 协议声明</text>
-                <text className='Badge-list-gt'>&gt;</text>
-              </view>
+            <view className='buy-list-Paybox ' onClick={handleRefund} >
+              <image className='buy-list-PayLogo' src={Refund} />
+              <view className='buy-list-goPay'>退款/售后</view>
+              <view className='buy-list-OrderNumber'>2笔订单</view>
             </view>
           </view>
-
-        }
+          <view className='Badge-box'>
+            <view className='Badge-list' onClick={handleHomeLogo}>
+              <image className='Badge-list-logo' src={HomeLogo} />
+              <text className='Badge-list-titme'> 入住指引</text>
+              <text className='Badge-list-gt'>&gt;</text>
+            </view>
+            <view className='Badge-list' onClick={handleCollect}>
+              <image className='Badge-list-logo' src={collect} />
+              <text className='Badge-list-titme'> 我的收藏</text>
+              <text className='Badge-list-gt'>&gt;</text>
+            </view>
+            <view className='Badge-list' onClick={handleContactMe}>
+              <image className='Badge-list-logo' src={ContactMe} />
+              <text className='Badge-list-titme'> 联系我们</text>
+              <text className='Badge-list-gt'>&gt;</text>
+            </view>
+            <view className='Badge-list' onClick={handleRules}>
+              <image className='Badge-list-logo' src={Rules} />
+              <text className='Badge-list-titme'> 协议声明</text>
+              <text className='Badge-list-gt'>&gt;</text>
+            </view>
+          </view>
+        </view>
 
       </view>
     </scroll-view>
   )
-})
+}

src/pages/index/tabs/Recommend.jsx

@@ -10,7 +10,7 @@ import msTip from '@/assets/icons/housemantj/foodtip.png'
 import mjTip from '@/assets/icons/housemantj/mjtip.png'
 import glTip from '@/assets/icons/housemantj/gltip.png'
 import onlove from '@/assets/icons/housemantj/onlove.png'
-import Taro,{useRouter } from '@tarojs/taro'
+import Taro, { useRouter } from '@tarojs/taro'
 import withLayout from '@/layouts'
 
 import { getIndexType, getIndexRecommender } from '@/services/home'
@@ -18,7 +18,7 @@ import { getIndexType, getIndexRecommender } from '@/services/home'
 import './less/Recommend.less'
 
 
-export default withLayout((props) => {
+export default (props) => {
   const { router, person } = props
   const [activeTab, setActiveTab] = useState(0)
   const { params } = useRouter()
@@ -26,8 +26,8 @@ export default withLayout((props) => {
   const [typeList, setTypeList] = useState([])
   const [list, setList] = useState([])
 
-  const tabs = [{ title: '附近' }].concat(typeList.map(x => ({...x, title: x.typeName })))
-  
+  const tabs = [{ title: '附近' }].concat(typeList.map(x => ({ ...x, title: x.typeName })))
+
   const handleTabChange = (e) => {
     const { index } = e.detail
     setActiveTab(index)
@@ -383,4 +383,4 @@ export default withLayout((props) => {
       </scroll-view>
     </view>
   )
-})
+}