|
@@ -9,23 +9,26 @@ import {
|
|
|
} from "@nutui/icons-react-taro";
|
|
} from "@nutui/icons-react-taro";
|
|
|
import {
|
|
import {
|
|
|
Badge,
|
|
Badge,
|
|
|
|
|
+ Dialog,
|
|
|
Grid,
|
|
Grid,
|
|
|
GridItem,
|
|
GridItem,
|
|
|
Image,
|
|
Image,
|
|
|
ImagePreview,
|
|
ImagePreview,
|
|
|
NavBar,
|
|
NavBar,
|
|
|
Tabs,
|
|
Tabs,
|
|
|
|
|
+ Toast,
|
|
|
} from "@nutui/nutui-react-taro";
|
|
} from "@nutui/nutui-react-taro";
|
|
|
import {
|
|
import {
|
|
|
navigateTo,
|
|
navigateTo,
|
|
|
getSystemInfoSync,
|
|
getSystemInfoSync,
|
|
|
useDidShow,
|
|
useDidShow,
|
|
|
navigateBack,
|
|
navigateBack,
|
|
|
|
|
+ useLoad,
|
|
|
} from "@tarojs/taro";
|
|
} from "@tarojs/taro";
|
|
|
import "./index.scss";
|
|
import "./index.scss";
|
|
|
import { useState, useEffect, useCallback } from "react";
|
|
import { useState, useEffect, useCallback } from "react";
|
|
|
import { strSlice } from "../../utils";
|
|
import { strSlice } from "../../utils";
|
|
|
-import { interactionApi } from "../../api/interaction";
|
|
|
|
|
|
|
+import { followApi, interactionApi, unfollowApi } from "../../api/interaction";
|
|
|
import { getUserPostListApi } from "../../api/post";
|
|
import { getUserPostListApi } from "../../api/post";
|
|
|
import { getUserInfoApi } from "../../api/user";
|
|
import { getUserInfoApi } from "../../api/user";
|
|
|
const Self = () => {
|
|
const Self = () => {
|
|
@@ -47,6 +50,7 @@ const Self = () => {
|
|
|
count: 0,
|
|
count: 0,
|
|
|
has_more: false,
|
|
has_more: false,
|
|
|
});
|
|
});
|
|
|
|
|
+ const [userId, setUserId] = useState<any>(null);
|
|
|
|
|
|
|
|
// 计算滚动区域高度
|
|
// 计算滚动区域高度
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
@@ -77,7 +81,9 @@ const Self = () => {
|
|
|
};
|
|
};
|
|
|
// 获取用户信息
|
|
// 获取用户信息
|
|
|
const getUserInfo = async () => {
|
|
const getUserInfo = async () => {
|
|
|
- const res: any = await getUserInfoApi();
|
|
|
|
|
|
|
+ const res: any = userId
|
|
|
|
|
+ ? await getUserInfoApi(userId)
|
|
|
|
|
+ : await getUserInfoApi();
|
|
|
if (res.code === 200) {
|
|
if (res.code === 200) {
|
|
|
setUserInfo(res.data);
|
|
setUserInfo(res.data);
|
|
|
}
|
|
}
|
|
@@ -106,7 +112,10 @@ const Self = () => {
|
|
|
page: currentPage,
|
|
page: currentPage,
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
- const res: any = await getUserPostListApi(null, requestParams);
|
|
|
|
|
|
|
+ const res: any = await getUserPostListApi(
|
|
|
|
|
+ userId ? userId : null,
|
|
|
|
|
+ requestParams
|
|
|
|
|
+ );
|
|
|
|
|
|
|
|
if (res.code === 200) {
|
|
if (res.code === 200) {
|
|
|
const newData = res.data.list || [];
|
|
const newData = res.data.list || [];
|
|
@@ -142,10 +151,52 @@ const Self = () => {
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
|
|
+ // 关注/不关注
|
|
|
|
|
+ const handleFollowClick = (followeeId: number, is_followed) => {
|
|
|
|
|
+ console.log(followeeId, is_followed);
|
|
|
|
|
+ if (is_followed) {
|
|
|
|
|
+ Dialog.open("followed_dialog", {
|
|
|
|
|
+ title: "提示",
|
|
|
|
|
+ content: "确定取消关注吗?",
|
|
|
|
|
+ onConfirm: () => {
|
|
|
|
|
+ unfollowApi({ followee_id: followeeId }).then(() => {
|
|
|
|
|
+ Toast.show("follow_success", {
|
|
|
|
|
+ content: "取消关注成功",
|
|
|
|
|
+ duration: 2,
|
|
|
|
|
+ lockScroll: true,
|
|
|
|
|
+ });
|
|
|
|
|
+ const data = { ...userInfo, is_followed: false };
|
|
|
|
|
+ setUserInfo(data);
|
|
|
|
|
+ Dialog.close("followed_dialog");
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ onCancel: () => {
|
|
|
|
|
+ Dialog.close("followed_dialog");
|
|
|
|
|
+ },
|
|
|
|
|
+ onClose: () => {
|
|
|
|
|
+ Dialog.close("followed_dialog");
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ } else {
|
|
|
|
|
+ followApi({ followee_id: followeeId }).then(() => {
|
|
|
|
|
+ Toast.show("follow_success", {
|
|
|
|
|
+ content: "关注成功",
|
|
|
|
|
+ duration: 2,
|
|
|
|
|
+ lockScroll: true,
|
|
|
|
|
+ });
|
|
|
|
|
+ const data = { ...userInfo, is_followed: true };
|
|
|
|
|
+ setUserInfo(data);
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
useDidShow(() => {
|
|
useDidShow(() => {
|
|
|
getPostList();
|
|
getPostList();
|
|
|
getUserInfo();
|
|
getUserInfo();
|
|
|
});
|
|
});
|
|
|
|
|
+ useLoad((params) => {
|
|
|
|
|
+ setUserId(params.id);
|
|
|
|
|
+ });
|
|
|
|
|
|
|
|
// 加载更多
|
|
// 加载更多
|
|
|
const loadMore = useCallback(() => {
|
|
const loadMore = useCallback(() => {
|
|
@@ -189,22 +240,28 @@ const Self = () => {
|
|
|
</View>
|
|
</View>
|
|
|
<View className="flex-1 ml-[10px]">
|
|
<View className="flex-1 ml-[10px]">
|
|
|
<View className="text-[16px] font-bold">
|
|
<View className="text-[16px] font-bold">
|
|
|
- {userInfo.nickname || userInfo.username}
|
|
|
|
|
|
|
+ {userInfo.username || userInfo.nickname}
|
|
|
</View>
|
|
</View>
|
|
|
</View>
|
|
</View>
|
|
|
</View>
|
|
</View>
|
|
|
- <Badge top="2" right="8" value={userInfo.notification_count}>
|
|
|
|
|
- <Notice
|
|
|
|
|
- onClick={() => {
|
|
|
|
|
- navigateTo({ url: "/pages/message/index" });
|
|
|
|
|
- }}
|
|
|
|
|
- />
|
|
|
|
|
- </Badge>
|
|
|
|
|
|
|
+ {userId ? (
|
|
|
|
|
+ <></>
|
|
|
|
|
+ ) : (
|
|
|
|
|
+ <Badge top="2" right="8" value={userInfo.notification_count}>
|
|
|
|
|
+ <Notice
|
|
|
|
|
+ onClick={() => {
|
|
|
|
|
+ navigateTo({ url: "/pages/message/index" });
|
|
|
|
|
+ }}
|
|
|
|
|
+ />
|
|
|
|
|
+ </Badge>
|
|
|
|
|
+ )}
|
|
|
</View>
|
|
</View>
|
|
|
<View className="flex items-center justify-between text-[14px] mt-[10px]">
|
|
<View className="flex items-center justify-between text-[14px] mt-[10px]">
|
|
|
<View className="flex">
|
|
<View className="flex">
|
|
|
<View className="flex">
|
|
<View className="flex">
|
|
|
- <Text className="text-[#949494]">关注我</Text>
|
|
|
|
|
|
|
+ <Text className="text-[#949494]">
|
|
|
|
|
+ {userId ? "粉丝" : "关注我"}
|
|
|
|
|
+ </Text>
|
|
|
<Text className="ml-[5px]">{userInfo.follow_count}</Text>
|
|
<Text className="ml-[5px]">{userInfo.follow_count}</Text>
|
|
|
</View>
|
|
</View>
|
|
|
<View className="flex ml-[20px]">
|
|
<View className="flex ml-[20px]">
|
|
@@ -212,16 +269,30 @@ const Self = () => {
|
|
|
<Text className="ml-[5px]">{userInfo.interaction_count}</Text>
|
|
<Text className="ml-[5px]">{userInfo.interaction_count}</Text>
|
|
|
</View>
|
|
</View>
|
|
|
</View>
|
|
</View>
|
|
|
- <View
|
|
|
|
|
- className="bg-[#f7f7f7] w-[70px] h-[30px] rounded-[15px] flex items-center justify-around"
|
|
|
|
|
- onClick={() => {
|
|
|
|
|
- navigateTo({ url: "/pages/publish/index" });
|
|
|
|
|
- }}
|
|
|
|
|
- >
|
|
|
|
|
- <View className="flex items-center">
|
|
|
|
|
- <Plus />
|
|
|
|
|
- <Text>发布</Text>
|
|
|
|
|
- </View>
|
|
|
|
|
|
|
+ <View className="bg-[#f7f7f7] w-[70px] h-[30px] rounded-[15px] flex items-center justify-around">
|
|
|
|
|
+ {userId ? (
|
|
|
|
|
+ <>
|
|
|
|
|
+ <View
|
|
|
|
|
+ className="flex items-center justify-center text-[12px] bg-[#f8f8f8] text-[#949494] rounded-[20px] h-[25px] w-[60px] text-center"
|
|
|
|
|
+ onClick={() =>
|
|
|
|
|
+ handleFollowClick(userInfo.id, userInfo.is_followed)
|
|
|
|
|
+ }
|
|
|
|
|
+ >
|
|
|
|
|
+ {userInfo.is_followed ? <></> : <Plus color="#1874d0" />}
|
|
|
|
|
+ <Text>{userInfo.is_followed ? "已关注" : "关注"}</Text>
|
|
|
|
|
+ </View>
|
|
|
|
|
+ </>
|
|
|
|
|
+ ) : (
|
|
|
|
|
+ <View
|
|
|
|
|
+ className="flex items-center justify-center text-[12px] bg-[#6065e0] text-[#fff] rounded-[20px] h-[25px] w-[60px] text-center"
|
|
|
|
|
+ onClick={() => {
|
|
|
|
|
+ navigateTo({ url: "/pages/publish/index" });
|
|
|
|
|
+ }}
|
|
|
|
|
+ >
|
|
|
|
|
+ <Plus />
|
|
|
|
|
+ <Text>发布</Text>
|
|
|
|
|
+ </View>
|
|
|
|
|
+ )}
|
|
|
</View>
|
|
</View>
|
|
|
</View>
|
|
</View>
|
|
|
</View>
|
|
</View>
|