update

src/_health/components/target_progress.scss

@@ -16,6 +16,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    // background-color: pink;
 }
 
 .history_item_duration {

src/_health/pages/post_result.tsx

@@ -315,17 +315,15 @@ export default function PostResult() {
                     if (global.tapDone) {
                         global.tapDone()
                     }
-                    if (data.current_window) {
+                    // if (data.current_window) {
+                    //先简单处理，直接到首页
                         Taro.reLaunch({
                             url: '/pages/clock/Clock'
                         })
-                        // Taro.navigateBack({
-                        //     delta: Taro.getCurrentPages().length-1
-                        // })
-                    }
-                    else {
-                        Taro.navigateBack()
-                    }
+                    // }
+                    // else {
+                    //     Taro.navigateBack()
+                    // }
 
                     // if (data.status_change) {
                     //     if (data.status_change.previous != data.status_change.current) {

src/_health/pages/timeline_detail.tsx

@@ -35,6 +35,8 @@ import 'dayjs/locale/en';
 import { getInfoSuccess } from "@/store/user";
 import LongCard from "@/_moment/components/long_card";
 import { setFollow } from "@/store/long";
+import MomentDetailShare from "@/pages/moment/moment_detail_share";
+import { followUser } from "@/services/friend";
 
 let useRoute;
 let useNavigation;
@@ -200,7 +202,13 @@ export default function TimelineDetail() {
             }
             var imgs = imgList()
             var imageUrl = imgs.length > 0 ? imgs[0] : defaultImg
+            if (global.momentdetail_share_url) {
+                imageUrl = global.momentdetail_share_url
+            }
             var sharePath = `/_health/pages/timeline_detail?type=${router.params.type}&fast_type=${fast_type}&schedule_id=${schedule_id}&window_id=${window_id}&event_id=${event_id}&uid=${uid ?? user.id}&op_page=${op_page}&isfastsleep=${isfastsleep}&disable_edit=1&enter_type=share`
+            if (user.isLogin) {
+                sharePath += `&share_uid=${user.id}`
+            }
             var strWindowId = window_id ?? ''
             if (op_page == 'HOME_EAT' || op_page == 'HOME_ACTIVE') {
                 strWindowId = ''
@@ -242,6 +250,42 @@ export default function TimelineDetail() {
         // })
     }, [showPop])
 
+    useEffect(() => {
+        if (router.params.enter_type == 'share') {
+            if (global.shareTicket) {
+                Taro.getShareInfo({
+                    shareTicket: global.shareTicket,
+                    success(result) {
+                        updateRelation(result)
+                    },
+                })
+            }
+            else {
+                updateRelation(null)
+            }
+        }
+    }, [user.isLogin])
+
+    function updateRelation(obj) {
+        if (!user.isLogin) {
+            Taro.setStorageSync('share_uid', router.params.share_uid)
+            Taro.setStorageSync('share_info', JSON.stringify(obj))
+            return
+        }
+        if (user.id != router.params.share_uid && router.params.share_uid) {
+            var params: any = {
+                follow_origin: obj ? 'WECHAT_GROUP_CHAT' : 'WECHAT_PRIVATE_CHAT',
+                user_id: router.params.share_uid,
+            }
+            if (obj) {
+                params.wechat = obj
+            }
+            followUser(params).then(res => {
+                // myFriends()
+            })
+        }
+    }
+
     useEffect(() => {
         if (!user.isLogin) {
             //用户未登录读取cache
@@ -257,6 +301,8 @@ export default function TimelineDetail() {
         }
     }, [])
 
+
+
     function setTitle(timestamp) {
         dayjs.locale(global.language == 'en' ? 'en' : 'zh-cn');
         require('moment/locale/en-gb')
@@ -759,7 +805,7 @@ export default function TimelineDetail() {
 
     function backHome() {
         Taro.reLaunch({
-            url:'/pages/moment/moment'
+            url: '/pages/moment/moment'
         })
         // Taro.reLaunch({
         //     url: '/pages/clock/Clock'
@@ -982,7 +1028,7 @@ export default function TimelineDetail() {
                         />
                     }
                     {
-                        join && <LongCard join={join} title={detail.title}/>
+                        join && <LongCard join={join} title={detail.title} />
                     }
 
                     {
@@ -1046,7 +1092,7 @@ export default function TimelineDetail() {
                 <NewButton
                     type={NewButtonType.fill}
                     color={MainColorType.success}
-                    title={t('health.back_home')}
+                    title={t('health.back_moment')}
                     width={rpxToPx(646)}
                     height={rpxToPx(96)}
                     onClick={backHome}
@@ -1154,5 +1200,7 @@ export default function TimelineDetail() {
         {
             fastSleepPopContent()
         }
+        <MomentDetailShare user={shareUser ? shareUser : detail.share_user} btnColor={getThemeColor(detail.join ? detail.join.window : detail.window)} />
+
     </View>
 }

src/_moment/components/follow_info.tsx

@@ -1,7 +1,9 @@
 import { rpxToPx } from "@/utils/tools";
 import { View, Text, Textarea, Image, Input, ScrollView } from "@tarojs/components";
+import { useTranslation } from "react-i18next";
 
 export default function FollowInfo(props: { user: any }) {
+    const {t} = useTranslation()
 
     return <View style={{
         width: rpxToPx(698),
@@ -16,7 +18,7 @@ export default function FollowInfo(props: { user: any }) {
         boxSizing: 'border-box',
         marginLeft: rpxToPx(26)
     }}>
-        <View className="h20 g02">接自</View>
+        <View className="h20 g02">{t('health.join2')}</View>
         <View style={{
             display: 'flex',
             flexDirection: 'row',
@@ -30,7 +32,7 @@ export default function FollowInfo(props: { user: any }) {
                 borderRadius: rpxToPx(18),
                 marginLeft: rpxToPx(8),
                 marginRight: rpxToPx(8),
-            }} src={props.user.avatar}/>
+            }} src={props.user.avatar} mode="aspectFill"/>
             {/* <View className="h26">跟卡</View> */}
         </View>
     </View>

src/_moment/components/long_card.scss

@@ -3,8 +3,8 @@
     // border-radius: 12px;
     // width: 572px;
     box-sizing: border-box;
-    padding-left: 20px;
-    padding-right: 24px;
+    padding-left: 28px;
+    padding-right: 28px;
     display: flex;
     margin-top: 12px;
 }

src/_moment/components/long_card.tsx

@@ -7,13 +7,16 @@ import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
 import { useDispatch, useSelector } from "react-redux";
 import { getScenario } from "@/features/health/hooks/health_hooks";
 import { setFollow, setJoinData, setJoinTitle } from "@/store/long";
+import Taro from "@tarojs/taro";
+import { useTranslation } from "react-i18next";
 
-export default function LongCard(props: { join?: any, user?: any, hideJoin?: boolean, share?: any, title?: string }) {
+export default function LongCard(props: { join?: any, user?: any, hideJoin?: boolean, share?: any, title?: string, isFeedItem?: boolean }) {
     const { status, key, from, window } = props.join
     const health = useSelector((state: any) => state.health);
     const user = useSelector((state: any) => state.user);
     const long = useSelector((state: any) => state.long);
     const dispatch = useDispatch()
+    const {t} = useTranslation()
     let type = 0
     function join(e) {
         if (process.env.TARO_ENV == 'weapp') {
@@ -74,7 +77,7 @@ export default function LongCard(props: { join?: any, user?: any, hideJoin?: boo
             dispatch(setJoinTitle(props.title))
         }
         dispatch(setJoinData(props.join))
-        jumpPage(`/_moment/pages/long_detail?join_id=${key}&window=${window}`)
+        jumpPage(`/_moment/pages/long_detail?join_id=${key}&window=${window}&status=${status}`)
     }
 
     function share() {
@@ -82,6 +85,11 @@ export default function LongCard(props: { join?: any, user?: any, hideJoin?: boo
         if (props.share) {
             props.share()
         }
+        // if (props.isFeedItem){
+        //     Taro.eventCenter.trigger('moment_share',{
+
+        //     })
+        // }
     }
 
     function users() {
@@ -89,7 +97,7 @@ export default function LongCard(props: { join?: any, user?: any, hideJoin?: boo
             {
                 props.join.users.map((item, index) => {
                     if (index > 4) return
-                    return <Image className="long_avatar" style={{
+                    return <Image className="long_avatar" mode="aspectFill" style={{
                         zIndex: 10 - index,
                         marginLeft: index == 0 ? 0 : -rpxToPx(20)
                     }} src={item.avatar} key={index} />
@@ -106,7 +114,7 @@ export default function LongCard(props: { join?: any, user?: any, hideJoin?: boo
             paddingTop: rpxToPx(18),
             paddingBottom: rpxToPx(18)
         }}>
-            <View className="h20 g02" style={{ marginBottom: rpxToPx(6) }}>接自</View>
+            <View className="h20 g02" style={{ marginBottom: rpxToPx(6) }}>{t('health.join2')}</View>
             <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
                 <View className="h26" style={{ marginRight: rpxToPx(8) }}>{from.nickname}</View>
                 {
@@ -114,11 +122,12 @@ export default function LongCard(props: { join?: any, user?: any, hideJoin?: boo
                 }
                 <View style={{ flex: 1 }} />
                 {
-                    status == 'JOIN' && <View className="h26 bold" style={{ color: MainColorType.link }} onClick={join}>立即加入</View>
+                    status == 'JOIN' && <View className="h26 bold" style={{ color: MainColorType.link }} onClick={join}>{t('health.join')}</View>
                 }
                 {
-                    status == 'SHARE' && <ShareBtn onClick={share}>
-                        <View className="h26 bold" style={{ color: MainColorType.success }} >邀请好友加入</View>
+                    status == 'SHARE' && <ShareBtn onClick={share} hideShare={props.isFeedItem}>
+                        <Image src={require('@assets/_health/wechat.png')} style={{ width: rpxToPx(44), height: rpxToPx(44) }} />
+                        {/* <View className="h26 bold" style={{ color: MainColorType.success }} >邀请好友加入</View> */}
                     </ShareBtn>
                 }
 
@@ -127,25 +136,33 @@ export default function LongCard(props: { join?: any, user?: any, hideJoin?: boo
     if (status == 'JOIN')
         return <View onClick={goDetail} className="long_card_bg long_card_begin">
             {
-                (!props.join || props.join.user_count == 0) && <View className="h26 g02">{props.join.user.nickname}喊我一起打卡</View>
+                (props.join && props.join.user_count == 0) && <View style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
+                    <Image className="long_avatar" mode="aspectFill" style={{
+                        marginRight: rpxToPx(6)
+                    }} src={props.join.user.avatar} />
+                    <View className="h26 g02">{t('health.call_me_join',{name:props.join.user.nickname})}</View>
+                </View>
             }
 
             {
                 props.join && props.join.user_count > 0 && users()
             }
-            <View className="h26 bold" style={{ color: MainColorType.link }} onClick={join}>立即加入</View>
+            <View className="h26 bold" style={{ color: MainColorType.link }} onClick={join}>{t('health.join')}</View>
         </View>
 
     if (status == 'SHARE') {
         if (!props.join || props.join.user_count == 0) {
-            return <View onClick={goDetail} className="long_card_bg long_card_begin" style={{ alignItems: 'center', justifyContent: 'center' }}>
-                <ShareBtn onClick={share}>
+            return <View onClick={goDetail} className="long_card_bg long_card_begin" style={{ alignItems: 'center',paddingLeft:rpxToPx(14) }}>
+                <ShareBtn onClick={share} hideShare={props.isFeedItem}>
                     <View style={{
                         display: 'flex', flexDirection: 'row',
                         alignItems: 'center', justifyContent: 'center'
                     }}>
-                        <Image src={require('@assets/_health/wechat.png')} style={{ width: rpxToPx(44), height: rpxToPx(44), marginRight: rpxToPx(6) }} />
-                        <View className="h26 bold" style={{ color: MainColorType.success }} >邀请好友加入</View>
+                        <View style={{ width: rpxToPx(80),marginRight:rpxToPx(10), display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+                            <Image src={require('@assets/_health/wechat.png')} style={{ width: rpxToPx(44), height: rpxToPx(44) }} />
+                        </View>
+
+                        <View className="h26 bold" style={{ color: MainColorType.success }} >{t('health.call_friends_join')}</View>
                     </View>
 
                 </ShareBtn>
@@ -155,8 +172,9 @@ export default function LongCard(props: { join?: any, user?: any, hideJoin?: boo
             {
                 props.join && props.join.user_count > 0 && users()
             }
-            <ShareBtn onClick={share}>
-                <View className="h26 bold" style={{ color: MainColorType.success }} >邀请好友加入</View>
+            <ShareBtn onClick={share} hideShare={props.isFeedItem}>
+                <Image src={require('@assets/_health/wechat.png')} style={{ width: rpxToPx(44), height: rpxToPx(44) }} />
+                {/* <View className="h26 bold" style={{ color: MainColorType.success }} >邀请好友加入</View> */}
             </ShareBtn>
         </View>
     }

src/_moment/pages/long_detail.scss

@@ -34,15 +34,25 @@
     width: 96px;
     height: 96px;
     border-radius: 48px;
-    background-color: #f0f0f0;
+    background-color: #f5f5f5;
+}
+
+.member_avatar_dash{
+    width: 96px;
+    height: 96px;
+    border-radius: 48px;
+    background-color: #fff;
+    box-sizing: border-box;
+    border: dashed 2px #d9d9d9;
 }
 
 .member_relation {}
 
 .join_count {
-    height: 88px;
+    // height: 88px;
     position: relative;
-    line-height: 88px;
+    line-height: 72px;
+    margin-top: 16px;
     font-size: 26px;
 }
 

src/_moment/pages/long_detail.tsx

@@ -9,7 +9,8 @@ import { rpxToPx } from "@/utils/tools";
 import { MainColorType } from "@/context/themes/color";
 import { getScenario } from "@/features/health/hooks/health_hooks";
 import { useDispatch, useSelector } from "react-redux";
-import { IconClose } from "@/components/basic/Icons";
+import { IconAdd, IconClose } from "@/components/basic/Icons";
+import { useTranslation } from "react-i18next";
 
 let useRoute;
 let useNavigation;
@@ -39,6 +40,8 @@ export default function LongDetail() {
     const navigationBarHeight = systemInfo.statusBarHeight + 44;
     const [showFull, setShowFull] = useState(false)
     const [selUser, setSelUser] = useState<any>(null)
+    const [list, setList] = useState<any>([])
+    const { t } = useTranslation()
     // const [loaded, setLoaded] = useState(false)
 
     useEffect(() => {
@@ -48,6 +51,8 @@ export default function LongDetail() {
     function getDetail() {
         joinDetail(router.params.join_id).then(res => {
             setDetail(res)
+            var left = 10 - (res as any).join_users.length
+            setList(Array(left).fill('0'))
         })
     }
 
@@ -112,10 +117,13 @@ export default function LongDetail() {
                 />
             </View>
         </View>
-        <Image className="main_avatar" style={{ marginTop: navigationBarHeight }} src={detail.user.avatar} />
+        <Image className="main_avatar" style={{ marginTop: navigationBarHeight }} src={detail.user.avatar} mode="aspectFill" onClick={() => {
+            setSelUser(detail.user)
+            setShowFull(true)
+        }} />
         <View className="h34 bold">{detail.user.nickname}</View>
-        <View className="h22 g02" style={{marginTop:rpxToPx(12),marginBottom:rpxToPx(12)}}>{detail.user.relation_desc}</View>
-        <View className="h26 g02">累计获得 {detail.user.joined_total} 次跟卡</View>
+        <View className="h22 g02" style={{ marginTop: rpxToPx(12), marginBottom: rpxToPx(12) }}>{detail.user.relation_desc}</View>
+        <View className="h26 g02">{t('health.total_joins', { total: detail.user.joined_total })}</View>
         {
             detail.join_count > 0 && <View className="member_group">
                 <View className="join_count">{detail.join_count}人已跟卡
@@ -128,8 +136,22 @@ export default function LongDetail() {
                                 setSelUser(item)
                                 setShowFull(true)
                             }}>
-                                <Image className="member_avatar" src={item.avatar} />
-                                <View className="h22 g02" style={{ marginTop: rpxToPx(12) }}>{item.relation_desc}</View>
+                                <Image className="member_avatar" src={item.avatar} mode="aspectFill" />
+                                <View className="h22" style={{ marginTop: rpxToPx(12) }}>{item.nickname}</View>
+                                <View className="h20 g02" style={{ marginTop: rpxToPx(4) }}>{item.relation_desc}</View>
+
+                            </View>
+                        })
+                    }
+                    {
+                        list.map((item, index) => {
+                            return <View key={index} className="member_item">
+                                <View className="member_avatar_dash" style={{ alignItems: 'center', justifyContent: 'center', display: 'flex' }}>
+                                    {/* <IconAdd color={MainColorType.g03} width={rpxToPx(34)} /> */}
+                                </View>
+                                <View className="h22" style={{ marginTop: rpxToPx(12), opacity: 0 }}>0</View>
+                                <View className="h20 g02" style={{ marginTop: rpxToPx(4), opacity: 0 }}>0</View>
+
                             </View>
                         })
                     }
@@ -139,39 +161,53 @@ export default function LongDetail() {
         {
             detail.join_count == 0 && <View className="join_no_data">
                 <Image src={require('@assets/_health/social2.png')} style={{ width: rpxToPx(108), height: rpxToPx(108) }} />
-                <View className="h34 g01" style={{ marginBottom: rpxToPx(12), marginTop: rpxToPx(24) }}>No joins,yet</View>
-                <View className="h26 g01">Be ths first to joins</View>
+                <View className="h34 g01" style={{ marginBottom: rpxToPx(12), marginTop: rpxToPx(24) }}>{t('health.no_join_yet')}</View>
+                <View className="h26 g01">{t('health.be_first')}</View>
             </View>
         }
 
         <View style={{ flex: 1 }} />
-        {
-            detail.join_count > 0 && <View style={{ width: rpxToPx(275), height: rpxToPx(40), marginBottom: rpxToPx(24) }}>
-                <NewButton
-                    type={NewButtonType.link}
-                    title="查看完整历史"
-                    onClick={() => {
-                        jumpPage('./long_full?join_id=' + router.params.join_id)
-                    }}
+        <View style={{ height: 300 }} />
+        <View style={{
+            display: 'flex',
+            position: 'fixed',
+            left: 0,
+            right: 0,
+            bottom: 0,
+            flexDirection: 'column',
+            alignItems: 'center'
+        }}>
+            {
+                detail.join_count > 0 && <View style={{ width: rpxToPx(275), height: rpxToPx(72), marginBottom: rpxToPx(24) }}>
+                    <NewButton
+                        type={NewButtonType.link}
+                        title={t('health.show_joins')}
+                        onClick={() => {
+                            jumpPage('./long_full?join_id=' + router.params.join_id)
+                        }}
+                    />
+                </View>
+            }
+
+            {
+                router.params.status == 'JOIN' && <NewButton type={NewButtonType.fill}
+                    width={rpxToPx(646)}
+                    height={rpxToPx(96)}
+                    title={t('health.join_now')}
+                    onClick={join}
+                    color={MainColorType.eat}
                 />
-            </View>
-        }
+            }
 
+            <View style={{ height: rpxToPx(128) }} />
+        </View>
 
-        <NewButton type={NewButtonType.fill}
-            width={rpxToPx(646)}
-            height={rpxToPx(96)}
-            title="Join"
-            onClick={join}
-            color={MainColorType.eat}
-        />
-        <View style={{ height: rpxToPx(128) }} />
         {
             showFull && <View className="full_avatar_bg">
                 <Image style={{
                     width: rpxToPx(750),
                     height: rpxToPx(750)
-                }} src={selUser.avatar} />
+                }} src={selUser.avatar} mode="aspectFill" />
                 <View style={{
                     position: 'absolute', left: 10, top: navigationBarHeight - 44, width: 44, height: 44,
                     display: 'flex', alignItems: 'center', justifyContent: 'center'
@@ -188,7 +224,7 @@ export default function LongDetail() {
                     <NewButton
                         type={NewButtonType.fill}
                         color={MainColorType.blue}
-                        title="View Profile"
+                        title={t('health.view_profile')}
                         width={rpxToPx(646)}
                         height={rpxToPx(96)}
                         onClick={() => {

src/_moment/pages/long_full.config.ts

@@ -3,7 +3,7 @@ export default definePageConfig({
         // 'ec-canvas': '../../lib/ec-canvas/ec-canvas',
         // 'demo':'../../components/demo'
     },
-    "navigationBarTitleText": "完整接龙历史",
+    "navigationBarTitleText": "",
     "navigationBarBackgroundColor": "#f5f5f5",
     // "backgroundColor": "#ffffff",
     // "navigationStyle": "custom",

src/_moment/pages/long_full.tsx

@@ -8,6 +8,7 @@ import dayjs from "dayjs";
 import { rpxToPx } from "@/utils/tools";
 import { jumpPage } from "@/features/trackTimeDuration/hooks/Common";
 import { IconArrow } from "@/components/basic/Icons";
+import { useTranslation } from "react-i18next";
 
 let useRoute;
 let useNavigation;
@@ -31,9 +32,13 @@ export default function LongFull() {
         router = useRouter()
     }
     const [users, setUsers] = useState<any>([])
+    const {t} = useTranslation()
 
     useEffect(() => {
         getDetail()
+        Taro.setNavigationBarTitle({
+            title:t('health.joins')
+        })
     }, [])
 
     function getDetail() {
@@ -50,7 +55,7 @@ export default function LongFull() {
         {
             users.map((item, index) => {
                 return <View key={index} className="long_full_item" onClick={()=>goHome(item)}>
-                    <Image className="full_item_avatar" src={item.avatar} />
+                    <Image className="full_item_avatar" src={item.avatar} mode="aspectFill"/>
                     <View className="h34 bold" style={{ color: MainColorType.link }}>{item.nickname}</View>
                     <View style={{ flex: 1 }} />
                     <View className="h20 g02">{dayjs(item.join_timestamp).format('M月D日 HH:mm加入打卡')}</View>

src/_moment/pages/message.tsx

@@ -92,7 +92,7 @@ export default function Message() {
 
   function messageItem(item, index) {
     return <View key={index} className='message_item' >
-      <Image className='message_item_avatar' src={item.user.avatar} onClick={() => {
+      <Image className='message_item_avatar' mode="aspectFill" src={item.user.avatar} onClick={() => {
             jumpPage('./home?uid=' + item.user.id)
           }}/>
       <View style={{ display: 'flex', flexDirection: 'column', flex: 1 }}>

src/components/basic/ShareBtn.tsx

@@ -1,24 +1,34 @@
 import { Button, View } from "@tarojs/components";
 
-export default function ShareBtn(props: { children: any, onClick?: any }) {
-    return <View style={{ position: 'relative' }}>
+export default function ShareBtn(props: { children: any, onClick?: any, hideShare?: boolean }) {
+    return <View style={{ position: 'relative',display:'flex',alignItems:'center',justifyContent:'center' }} onClick={(e) => {
+        if (props.hideShare && process.env.TARO_ENV == 'weapp') {
+            e.stopPropagation()
+        }
+        if (props.onClick) {
+            props.onClick()
+        }
+    }}>
         {
             props.children
         }
-        <Button openType="share" style={{
-            position: 'absolute',
-            left: 0,
-            right: 0,
-            top: 0,
-            bottom: 0,
-            opacity:0
-        }} onClick={(e) => {
-            if (process.env.TARO_ENV == 'weapp'){
-                e.stopPropagation()
-            }
-            if (props.onClick) {
-                props.onClick()
-            }
-        }} />
+        {
+            !props.hideShare && <Button openType="share" style={{
+                position: 'absolute',
+                left: 0,
+                right: 0,
+                top: 0,
+                bottom: 0,
+                opacity: 0
+            }} onClick={(e) => {
+                if (process.env.TARO_ENV == 'weapp') {
+                    e.stopPropagation()
+                }
+                if (props.onClick) {
+                    props.onClick()
+                }
+            }} />
+        }
+
     </View>
 }

src/context/locales/en.js

@@ -1244,5 +1244,11 @@ export default {
         no_join_yet: 'No joins yet',
         be_first: 'Be the first to join!',
         join_now: 'Join now',
+        back_moment:'Back to Moments',
+        view_profile:'View Profile',
+        join2:'Join',
+        joins:'Joins',
+        show_joins:'Show Joins',
+        total_joins:'Total Joins {{total}}',
     }
 }

src/context/locales/zh.js

@@ -1245,6 +1245,11 @@ export default {
         no_join_yet:'还没有人跟卡',
         be_first:'成为第一个跟卡者！',
         join_now:'立即跟卡',
-
+        back_moment:'返回到搭子圈',
+        view_profile:'查看主页',
+        join2:'接龙',
+        joins:'接龙历史',
+        show_joins:'查看接龙历史',
+        total_joins:'累计获得 {{total}} 次跟卡',
     }
 }

src/pages/clock/ClockNew.tsx

@@ -308,7 +308,7 @@ export default function ClockNew(props: { children: any, onScroll: any }) {
         // }
 
 
-
+        return
         const showAlert1 = await getStorage('149alert') || false;
         Taro.setStorage({ key: '149alert', data: true })
 

src/pages/moment/moment.scss

@@ -1,4 +1,4 @@
-.new_message_bg{
+.new_message_bg {
     margin-top: 30px;
     margin-bottom: 30px;
     display: flex;
@@ -6,18 +6,52 @@
     justify-content: center;
 }
 
-.new_message{
+.new_message {
     background-color: #000;
     height: 72px;
     border-radius: 36px;
     display: flex;
     flex-direction: row;
     align-items: center;
-    
+
 }
 
-.message_avatar{
+.message_avatar {
     width: 56px;
     height: 56px;
     border-radius: 28rpx;
+}
+
+.share_guide_bg {
+    position: fixed;
+    left: 0;
+    top: 0;
+    width: 100vw;
+    height: 100vh;
+    background-color: #00000066;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    z-index: 100;
+}
+
+.share_guide_card{
+    width: 640px;
+    height: 478px;
+    background-color: #fff;
+    border-radius: 24px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
+.share_guide_avatar{
+   width: 200px;
+   height: 200px;
+   border-radius: 100px;
+   box-sizing: border-box;
+   border: solid 8px #fff;
+   background-color: #fff;
+   margin-top: -80px; 
 }

src/pages/moment/moment.tsx

@@ -18,6 +18,7 @@ import MomentMain from "./moment_main";
 import { TimeFormatter } from "@/utils/time_format";
 import dayjs from "dayjs";
 import { SHARE_COVER_URL } from "@/services/http/api";
+import shareTitle from "./moment_unit";
 
 
 export default function Friend() {
@@ -33,7 +34,7 @@ export default function Friend() {
 
     useEffect(() => {
         Taro.showLoading({
-            title:t('health.loading')
+            title: t('health.loading')
         })
         if (process.env.TARO_ENV == 'weapp') {
             loadWXCache()
@@ -57,68 +58,39 @@ export default function Friend() {
             var sharePath = ``
             if (global.momentShareData) {
                 const detail = global.momentShareData
-                var timestamp = detail.time.timestamp
-                var shareDate = ''
-                if (TimeFormatter.isToday(timestamp)) {
-                    shareDate = global.language == 'en' ? 'Today\'s' : '今日'
-                }
-                else if (TimeFormatter.isYesterday(timestamp)) {
-                    shareDate = global.language == 'en' ? 'Yesterday\'s' : '昨日'
-                }
-                else if (TimeFormatter.isTimestampInThisWeek(timestamp)) {
-                    shareDate = global.language == 'en' ? (dayjs(timestamp).format('dddd') + '\'s') : dayjs(timestamp).format('dddd')
-                }
-                else {
-                    shareDate = global.language == 'en' ? dayjs(timestamp).format('MMMM D') : dayjs(timestamp).format('MMMD日')
-                }
-
-                var title = ''
                 var defaultImg = SHARE_COVER_URL + 'my_fast.jpg'
 
-
-
                 switch (detail.link.window) {
                     case 'FAST':
-                        title = t('health.share_check_in', { date: shareDate, type: t('health.fasting') })
                         defaultImg = SHARE_COVER_URL + 'my_fast.jpg'
                         break;
                     case 'EAT':
-                        title = t('health.share_check_in', { date: shareDate, type: detail.moment.title })
                         defaultImg = SHARE_COVER_URL + 'my_meal.jpg'
                         break;
                     case 'ACTIVE':
-                        title = t('health.share_check_in', { date: shareDate, type: detail.moment.title })
                         defaultImg = SHARE_COVER_URL + 'my_activity.jpg'
                         break;
                     case 'SLEEP':
-                        title = t('health.share_check_in', { date: shareDate, type: t('health.sleep') })
                         defaultImg = SHARE_COVER_URL + 'my_sleep.jpg'
                         break;
-
                 }
 
-
                 var imgs = detail.moment.media
                 var imageUrl = imgs.length > 0 ? imgs[0].url : defaultImg
+                if (global.momentdetail_share_url) {
+                    imageUrl = global.momentdetail_share_url
+                }
                 var sharePath = `/_health/pages/timeline_detail?window_id=${detail.link.window_id}&event_id=${detail.link.event_id}&uid=${detail.user.id}&disable_edit=1&enter_type=share`
-                // if (global.join_id){
-                //     sharePath += `&join_id=${global.join_id}`
-                // }
-                var nickname = detail.user ? detail.user.nickname : user.nickname
-                if (nickname.length > 10) {
-                    nickname.substring(0, 10) + '...'
+                if (user.isLogin) {
+                    sharePath += `&share_uid=${user.id}`
                 }
+                var strTitle = shareTitle(t, detail.user ? detail.user : user)
                 global.momentShareData = null
-                // global.join_id = null
                 return {
-                    title: nickname + ': ' + title,
+                    title: strTitle,
                     path: sharePath,
                     imageUrl: imageUrl
                 }
-
-
-
-
             }
             return {
                 // title: user.nickname+': 快来和搭子们一起，分享彼此的日常生活',
@@ -178,5 +150,7 @@ export default function Friend() {
     }
     if (!loaded)
         return <View />
-    return <MomentMain />
+    return <View>
+        <MomentMain />
+    </View>
 }

src/pages/moment/moment_detail_share.tsx

@@ -3,7 +3,7 @@ import { useEffect, useState } from "react";
 import { View, Canvas } from "@tarojs/components";
 import Taro, { useDidShow } from "@tarojs/taro";
 
-export default function MomentShare(props: { user: any, cover?: string }) {
+export default function MomentDetailShare(props: { user: any,canvas_id?:string, cover?: string, btnColor?: string }) {
     const user = props.user;
 
     const info = Taro.getWindowInfo ? Taro.getWindowInfo() : Taro.getSystemInfoSync()
@@ -11,20 +11,14 @@ export default function MomentShare(props: { user: any, cover?: string }) {
 
 
     useEffect(() => {
-        if (user.isLogin) {
-            // beginDraw()
-            downCover()
-        }
-    }, [user])
+        downCover()
+
+    }, [])
+
 
-    useDidShow(() => {
-        if (user.isLogin) {
-            // beginDraw()
-            downCover()
-        }
-    })
 
     async function downCover() {
+        console.log('a')
         var urls: any = []
         if (props.cover) {
             urls = [props.cover, user.avatar]
@@ -61,7 +55,7 @@ export default function MomentShare(props: { user: any, cover?: string }) {
     function beginDraw(imagePaths) {
 
         const query = Taro.createSelectorQuery();
-        query.select(`#momentdetail_share`).fields({ node: true, size: true });
+        query.select(`#${canvasId()}`).fields({ node: true, size: true });
         query.exec((res) => {
             const _canvas = res[0].node;
             _canvas.width = res[0].width * dpr;
@@ -118,7 +112,7 @@ export default function MomentShare(props: { user: any, cover?: string }) {
     }
 
     function drawDetail2(ctx, imagePaths, canvas) {
-        ctx.fillStyle = '#fff'
+        ctx.fillStyle = '#f5f5f5'
         ctx.fillRect(0, 0, 420 * dpr, 336 * dpr);
         const img1 = canvas.createImage(); // 创建图像对象
         img1.src = imagePaths[0]
@@ -138,7 +132,7 @@ export default function MomentShare(props: { user: any, cover?: string }) {
             ctx.arcTo(x, y + height, x, y, radius); // 左下角
             ctx.arcTo(x, y, x + width, y, radius); // 左上角
             ctx.closePath();
-            ctx.fillStyle = '#ff0000'; // 设置填充颜色为红色
+            ctx.fillStyle = props.btnColor ? props.btnColor : '#ff0000'; // 设置填充颜色为红色
             ctx.fill(); // 填充矩形
 
             ctx.font = `bold ${26 * dpr}px sans-serif`
@@ -148,15 +142,15 @@ export default function MomentShare(props: { user: any, cover?: string }) {
 
 
             ctx.font = `bold ${24 * dpr}px sans-serif`
-            ctx.fillStyle = '#E0B152'
+            ctx.fillStyle = '#000'
             ctx.textAlign = 'center'
             var name = user.nickname.length > 8 ? user.nickname.substring(0, 8) + '...' : user.nickname
-            ctx.fillText(name, 210 * dpr, 182 * dpr);
+            ctx.fillText(name, 210 * dpr, 178 * dpr);
 
             ctx.beginPath()
-            ctx.arc(210 * dpr, 82 * dpr, 70 * dpr, 0, Math.PI * 2)
+            ctx.arc(210 * dpr, 90 * dpr, 50 * dpr, 0, Math.PI * 2)
             ctx.clip()
-            ctx.drawImage(img1, 140 * dpr, 12 * dpr, 140 * dpr, 140 * dpr);
+            ctx.drawImage(img1, 160 * dpr, 40 * dpr, 100 * dpr, 100 * dpr);
             ctx.restore()
             ctx.stroke();
 
@@ -175,7 +169,11 @@ export default function MomentShare(props: { user: any, cover?: string }) {
 
     }
 
+    function canvasId(){
+        return props.canvas_id??'momentdetail_share'
+    }
+
     return <View style={{ position: 'absolute', left: 0, top: -500, width: 420, height: 336, zIndex: 10000 }}>
-        <Canvas canvasId='momentdetail_share' id='momentdetail_share' className="canvas" type="2d" style={{ width: 420, height: 336, zIndex: 0 }} />
+        <Canvas canvasId={canvasId()} id={canvasId()} className="canvas" type="2d" style={{ width: 420, height: 336, zIndex: 0 }} />
     </View>
 }

src/pages/moment/moment_item.tsx

@@ -71,6 +71,10 @@ export default function MomentItem(props: { data: any }) {
     }
 
     function tapShare(e) {
+        Taro.eventCenter.trigger('moment_share', {
+            join: join,
+            moment: moment
+        })
         global.momentShareData = props.data;
         if (process.env.TARO_ENV == 'weapp' && e && e.stopPropagation) {
             e.stopPropagation()
@@ -133,18 +137,18 @@ export default function MomentItem(props: { data: any }) {
                 />
             }
             {
-                join && <LongCard join={join} user={user} share={tapShare} title={moment.title} />
+                join && <LongCard join={join} user={user} share={tapShare} title={moment.title} isFeedItem={true} />
             }
 
             <View style={{ padding: kSpace }} />
             <View style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', height: rpxToPx(44) }}>
                 <View className="h26 g02">{dayjs(moment.timestamp).fromNow()}</View>
-                {
+                {/* {
                     link && link.scenario != 'MOVE' && <View className="item_share_bg" onClick={tapShare}>
                         <IconShare color={MainColorType.g02} width={20} />
                         <Button className="item_share" openType="share" onClick={() => { global.momentShareData = props.data; }}></Button>
                     </View>
-                }
+                } */}
 
             </View>
         </View>

src/pages/moment/moment_main.tsx

@@ -2,10 +2,10 @@
 
 import TabBar from "@/components/navigation/TabBar";
 import { rpxToPx } from "@/utils/tools";
-import { View, Text, Image, ScrollView, Button } from "@tarojs/components";
+import { View, Text, Image, ScrollView, Button, Block } from "@tarojs/components";
 import Taro, { useDidShow, useRouter, useShareAppMessage } from "@tarojs/taro";
 import { useDispatch, useSelector } from "react-redux";
-import { useEffect, useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import { followUser, getFriendMoments, getMyFriends, getUserDashBoard } from "@/services/friend";
 import FriendGuide from "./guide";
 import EmptyContent from "./empty_content";
@@ -23,6 +23,11 @@ import dayjs from "dayjs";
 import { IconClose, IconMenu } from "@/components/basic/Icons";
 import MomentShare from "./moment_share";
 import NoRecord from "@/_health/components/no_record";
+import ShareBtn from "@/components/basic/ShareBtn";
+import NewButton, { NewButtonType } from "@/_health/base/new_button";
+import MomentDetailShare from "./moment_detail_share";
+import { getThemeColor } from "@/features/health/hooks/health_hooks";
+import shareTitle from "./moment_unit";
 
 
 
@@ -54,6 +59,7 @@ export default function MomentMain() {
     const [itemHeights, setItemHeights] = useState<any>([])
     const [isPulling, setIsPulling] = useState(false)
     const [pageTop, setPageTop] = useState(0)
+    const scrollRef = useRef()
 
 
     let router
@@ -77,6 +83,8 @@ export default function MomentMain() {
     const [endSignal, setEndSignal] = useState(0)
 
     const [closeGuide, setCloseGuide] = useState(false)
+    const [showShareGuide, setShowShareGuide] = useState(false)
+    const [shareInfo, setShareInfo] = useState<any>(null)
     const query = Taro.createSelectorQuery()
 
     const dispatch = useDispatch()
@@ -95,10 +103,12 @@ export default function MomentMain() {
         Taro.eventCenter.on('followUser', listenFollowUser)
         Taro.eventCenter.on('unfollowUser', listenUnfollowUser)
         Taro.eventCenter.on('refreshMoments', refreshMoments)
+        Taro.eventCenter.on('moment_share', momentShare)
         return () => {
             Taro.eventCenter.off('followUser')
             Taro.eventCenter.off('unfollowUser')
             Taro.eventCenter.off('refreshMoments')
+            Taro.eventCenter.off('moment_share')
             clearInterval(timer)
         }
 
@@ -115,10 +125,19 @@ export default function MomentMain() {
         myFriends()
     }
 
-    function refreshMoments(e){
+    function refreshMoments(e) {
         myFriends()
     }
 
+    function momentShare(e) {
+        setShareInfo(e)
+        setShowShareGuide(true)
+        // var dt = scrollRef.current
+        // query.select(`#myscrollview`).boundingClientRect().exec(res=>{
+        //     debugger
+        // })
+    }
+
 
 
     useEffect(() => {
@@ -268,7 +287,7 @@ export default function MomentMain() {
             setHomeType((res as any).homepage_type)
             setDashBoard(res)
             Taro.hideLoading()
-        }).catch(e=>{
+        }).catch(e => {
             setLoaded(true)
             Taro.hideLoading()
         })
@@ -335,7 +354,7 @@ export default function MomentMain() {
             }}>关闭</View> */}
             {
                 user.isLogin && <View style={{
-                    position: 'absolute', left: 10, top: navigationBarHeight-44, width: 44, height: 44,
+                    position: 'absolute', left: 10, top: navigationBarHeight - 44, width: 44, height: 44,
                     display: 'flex', alignItems: 'center', justifyContent: 'center'
                 }}
                     onClick={() => {
@@ -357,7 +376,7 @@ export default function MomentMain() {
             <View style={{ height: navigationBarHeight, width: rpxToPx(750), backgroundColor: '#fff' }} />
             {
                 user.isLogin && <View style={{
-                    position: 'absolute', left: 10, top: navigationBarHeight-44, width: 44, height: 44,
+                    position: 'absolute', left: 10, top: navigationBarHeight - 44, width: 44, height: 44,
                     display: 'flex', alignItems: 'center', justifyContent: 'center'
                 }}
                     onClick={() => {
@@ -374,6 +393,40 @@ export default function MomentMain() {
         </View>
     }
 
+    function shareGuideContent() {
+        return <Block><View className="share_guide_bg" style={{ top: 0 }} onClick={(e) => {
+            if (process.env.TARO_ENV == 'weapp') {
+                e.stopPropagation()
+            }
+            setShowShareGuide(false)
+        }}>
+            <View className="share_guide_card" onClick={(e) => {
+                if (process.env.TARO_ENV == 'weapp') {
+                    e.stopPropagation()
+                }
+
+            }}>
+                <Image className="share_guide_avatar" mode="aspectFill" src={shareInfo.join.user.avatar} />
+                <View className="h34 bold" style={{ marginTop: rpxToPx(60), marginBottom: rpxToPx(60) }}>{shareTitle(t, shareInfo.join.user)}</View>
+                <ShareBtn onClick={() => {
+                    setShowShareGuide(false)
+                }}>
+                    <NewButton
+                        title="分享给微信好友"
+                        type={NewButtonType.fill}
+                        width={rpxToPx(480)}
+                        height={rpxToPx(96)}
+                        color={MainColorType.success}
+                        onClick={() => {
+
+                        }}
+                    />
+                </ShareBtn>
+            </View>
+        </View>
+        </Block>
+    }
+
     function listDetail() {
         return <View >
             <View style={{
@@ -400,9 +453,12 @@ export default function MomentMain() {
                 height: '90vh'
             }}
                 enableBackToTop
-                scrollY={true}
+                ref={scrollRef}
+                id="myscrollview"
+                scrollY={showShareGuide ? false : true}
                 refresherEnabled={true}
                 upperThreshold={70}
+                // scrollTop={showShareGuide ? pageTop : undefined}
                 // lowerThreshold={140}
                 refresherBackground={MainColorType.g05}
                 onRefresherRefresh={onRefresh}
@@ -450,16 +506,23 @@ export default function MomentMain() {
                         })
                     }
                     {
-                        moments.length == 0 && <NoRecord style={{marginTop:rpxToPx(160)}}/>
+                        moments.length == 0 && <NoRecord style={{ marginTop: rpxToPx(160) }} />
                     }
 
                     <ListFooter noMore={noMore} loading={loading} />
                     <View id="footer" style={{ width: 1, height: 1 }}></View>
-
                 </View>
             </ScrollView>
-
-
+            <Block>
+                {
+                    showShareGuide && <MomentDetailShare user={shareInfo.join.user} btnColor={getThemeColor(shareInfo.join.window)} />
+                }
+            </Block>
+            <Block>
+                {
+                    showShareGuide && shareGuideContent()
+                }
+            </Block>
             {
                 process.env.TARO_ENV == 'weapp' && <TabBar index={4} />
             }
@@ -469,6 +532,8 @@ export default function MomentMain() {
             {
                 homeType == 'NO_MOMENT' && !closeGuide && empty()
             }
+
+
         </View>
 
     }
@@ -562,7 +627,7 @@ export default function MomentMain() {
     }
 
     return <View>
-        
+
         {
             content()
         }

src/pages/moment/moment_share.tsx

@@ -106,11 +106,9 @@ export default function MomentShare() {
                 Taro.canvasToTempFilePath({
                     canvas: canvas,
                     success: (res) => {
-                        console.log('图片保存成功:', res.tempFilePath);
                         global.moment_share_url = res.tempFilePath
                     },
                     fail: (err) => {
-                        console.error('转为图片失败:', err);
                     }
                 });
             }

src/pages/moment/moment_unit.tsx

@@ -0,0 +1,46 @@
+import { SHARE_COVER_URL } from "@/services/http/api"
+import { TimeFormatter } from "@/utils/time_format"
+import dayjs from "dayjs"
+
+export default function shareTitle(t,user) {
+    const detail = global.momentShareData
+    var timestamp = detail.time.timestamp
+    var shareDate = ''
+    if (TimeFormatter.isToday(timestamp)) {
+        shareDate = global.language == 'en' ? 'Today\'s' : '今日'
+    }
+    else if (TimeFormatter.isYesterday(timestamp)) {
+        shareDate = global.language == 'en' ? 'Yesterday\'s' : '昨日'
+    }
+    else if (TimeFormatter.isTimestampInThisWeek(timestamp)) {
+        shareDate = global.language == 'en' ? (dayjs(timestamp).format('dddd') + '\'s') : dayjs(timestamp).format('dddd')
+    }
+    else {
+        shareDate = global.language == 'en' ? dayjs(timestamp).format('MMMM D') : dayjs(timestamp).format('MMMD日')
+    }
+
+    var title = ''
+
+
+
+    switch (detail.link.window) {
+        case 'FAST':
+            title = t('health.share_check_in', { date: shareDate, type: t('health.fasting') })
+            break;
+        case 'EAT':
+            title = t('health.share_check_in', { date: shareDate, type: detail.moment.title })
+            break;
+        case 'ACTIVE':
+            title = t('health.share_check_in', { date: shareDate, type: detail.moment.title })
+            break;
+        case 'SLEEP':
+            title = t('health.share_check_in', { date: shareDate, type: t('health.sleep') })
+            break;
+
+    }
+    var nickname = user.nickname
+    if (nickname.length > 10) {
+        nickname.substring(0, 10) + '...'
+    }
+    return nickname + ': ' + title
+}