Browse Source

商品收藏

main
Mac 2 weeks ago
parent
commit
14173a95a9
  1. 7
      app/screens/ProductDetailScreen.tsx
  2. 73
      app/screens/function/Collection.tsx
  3. 4
      app/services/api/orders.ts
  4. 1
      app/services/api/productApi.ts
  5. 4
      app/store/orderList.ts

7
app/screens/ProductDetailScreen.tsx

@ -609,11 +609,14 @@ export const ProductDetailScreen = () => {
>
<TouchableOpacity
onPress={() => {
setIsHeartRed(!isHeartRed);
setProduct({
...product,
is_favorited: !product.is_favorited,
});
productApi.collectProduct(route.params.offer_id);
}}
>
{isHeartRed ? (
{product.is_favorited ? (
<HeartRedIcon size={20} color="red" />
) : (
<HeartIcon size={20} color="#373737" />

73
app/screens/function/Collection.tsx

@ -18,47 +18,57 @@ import fontSize from "../../utils/fontsizeUtils";
import BackIcon from "../../components/BackIcon";
import { useNavigation } from "@react-navigation/native";
import { productApi } from "../../services/api/productApi";
import {getSubjectTransLanguage} from "../../utils/languageUtils";
// 收藏商品项组件
const FavoriteItem = ({
favoriteItem,
onDelete,
addToCart,
}: {
favoriteItem: any;
onDelete: (favoriteId: number) => void;
onDelete: (offerId: number) => void;
addToCart: (product: any) => void;
}) => {
const product = favoriteItem.product;
const navigation = useNavigation();
return (
<View style={styles.item}>
<Image
source={{ uri: product.product_image_urls[0] || 'https://via.placeholder.com/100' }}
style={styles.image}
/>
<View style={styles.info}>
<TouchableOpacity style={styles.info} onPress={() => {
(navigation as any).navigate("ProductDetail", {
offer_id: product.offer_id,
});
}}>
<Text style={styles.title} numberOfLines={2}>
{product.subject_trans || product.subject}
{getSubjectTransLanguage(product) || product.subject_trans}
</Text>
<Text style={styles.price}>
{product.currency}{product.min_price}
{product.min_price}{product.currency}
{product.vip_discount > 0 && (
<Text style={styles.originalPrice}>
{product.currency}{product.original_min_price}
{product.original_min_price}{product.currency}
</Text>
)}
</Text>
<View style={styles.actions}>
<TouchableOpacity style={[styles.btn, styles.cart]}>
{/* <TouchableOpacity style={[styles.btn, styles.cart]} onPress={() => {
addToCart(product)
}}>
<Text style={styles.cartText}></Text>
</TouchableOpacity>
</TouchableOpacity> */}
<TouchableOpacity
style={[styles.btn, styles.delete]}
onPress={() => onDelete(favoriteItem.favorite_id)}
onPress={() => onDelete(product.offer_id)}
>
<Text style={styles.deleteText}></Text>
</TouchableOpacity>
</View>
</View>
</TouchableOpacity>
</View>
);
};
@ -95,7 +105,7 @@ export const Collection = () => {
// 避免重复添加数据
setFavorites(prev => {
const newItems = response.items.filter(
newItem => !prev.some(existingItem => existingItem.favorite_id === newItem.favorite_id)
newItem => !prev.some(existingItem => existingItem.product.offer_id === newItem.product.offer_id)
);
return [...prev, ...newItems];
});
@ -137,28 +147,15 @@ export const Collection = () => {
}, [hasMore, loadingMore, loading, currentPage, fetchFavorites]);
// 删除收藏
const handleDelete = useCallback(async (favoriteId: number) => {
Alert.alert(
"确认删除",
"确定要删除这个收藏吗?",
[
{ text: "取消", style: "cancel" },
{
text: "删除",
style: "destructive",
onPress: async () => {
try {
// 这里需要调用删除收藏的API,如果API没有提供,先在前端删除
setFavorites(prev => prev.filter(item => item.favorite_id !== favoriteId));
setTotal(prev => prev - 1);
} catch (error) {
console.error("删除收藏失败:", error);
Alert.alert("错误", "删除失败,请重试");
}
}
}
]
);
const handleDelete = useCallback(async (offerId: number) => {
setFavorites(prev => prev.filter(item => item.product.offer_id !== offerId));
setTotal(prev => prev - 1);
productApi.deleteCollectProduct(offerId);
}, []);
const addToCart = useCallback((product: any) => {
console.log(product);
}, []);
// 滚动事件处理
@ -247,9 +244,10 @@ export const Collection = () => {
<>
{favorites.map((item) => (
<FavoriteItem
key={item.favorite_id}
key={item.product.offer_id}
favoriteItem={item}
onDelete={handleDelete}
addToCart={addToCart}
/>
))}
{renderFooter()}
@ -299,15 +297,12 @@ const styles = StyleSheet.create({
},
container: {
backgroundColor: "#f5f5f5",
paddingLeft: 20,
paddingRight: 20,
paddingBottom: 20,
marginTop: 20,
flex: 1,
},
item: {
flexDirection: "row",
padding: 12,
padding: 19,
backgroundColor: "#fff",
borderBottomWidth: 1,
borderBottomColor: "#eee",

4
app/services/api/orders.ts

@ -490,4 +490,8 @@ export const ordersApi = {
confirmOrder: (order_id: string) =>
apiService.patch<OrderDetailsType>(`/api/orders/${order_id}/shipping/`,{
}),
// 修改订单状态
changeOrderStatus: (order_id: string, status: number) =>
apiService.patch<void>(`/api/orders/${order_id}/status/?status=${status}`),
};

1
app/services/api/productApi.ts

@ -87,6 +87,7 @@ export type Products = Product[]
export interface ProductDetailParams {
"offer_id": 0,
currency:string
is_favorited:boolean
"category_id": 0,
"price": number | string,
"subject": "string",

4
app/store/orderList.ts

@ -88,7 +88,7 @@ export const useOrderListStore = create<OrderListState>((set, get) => ({
},
// 确定收货
confirmOrder: async (orderId: string) => {
confirmOrder: async (orderId: string,status:number = 3) => {
set((state) => ({
orders: {
...state.orders,
@ -96,6 +96,6 @@ export const useOrderListStore = create<OrderListState>((set, get) => ({
total: state.orders.total - 1,
},
}));
await ordersApi.confirmOrder(orderId);
await ordersApi.changeOrderStatus(orderId,status);
},
}));

Loading…
Cancel
Save