11
This commit is contained in:
@@ -1,18 +1,13 @@
|
||||
import Header from './Header';
|
||||
import BestSellers from './BestSellers';
|
||||
import Taro from '@tarojs/taro';
|
||||
import { View, Text } from '@tarojs/components';
|
||||
import {useShareAppMessage} from "@tarojs/taro"
|
||||
import {useEffect, useState} from "react";
|
||||
import {getShopInfo, loginByOpenId} from "@/api/layout";
|
||||
import {TenantId} from "@/config/app";
|
||||
import {saveStorageByLoginUser} from "@/utils/server";
|
||||
import {getShopInfo} from "@/api/layout";
|
||||
import {Sticky} from '@nutui/nutui-react-taro'
|
||||
import Menu from "./Menu";
|
||||
import Banner from "./Banner";
|
||||
import {checkAndHandleInviteRelation, hasPendingInvite} from "@/utils/invite";
|
||||
import {showNetworkDiagnosis} from "@/utils/networkCheck";
|
||||
import {BaseUrl} from "@/config/app";
|
||||
import './index.scss'
|
||||
|
||||
// import GoodsList from "./GoodsList";
|
||||
@@ -20,38 +15,13 @@ import './index.scss'
|
||||
function Home() {
|
||||
// 吸顶状态
|
||||
const [stickyStatus, setStickyStatus] = useState<boolean>(false)
|
||||
// 页面加载状态
|
||||
const [pageLoading, setPageLoading] = useState<boolean>(true)
|
||||
// 初始化状态
|
||||
const [initStatus, setInitStatus] = useState<{
|
||||
shopInfo: boolean;
|
||||
userAuth: boolean;
|
||||
userLogin: boolean;
|
||||
}>({
|
||||
shopInfo: false,
|
||||
userAuth: false,
|
||||
userLogin: false
|
||||
})
|
||||
|
||||
// 检查是否所有初始化都完成
|
||||
const checkInitComplete = (newStatus: Partial<typeof initStatus>) => {
|
||||
const updatedStatus = { ...initStatus, ...newStatus };
|
||||
setInitStatus(updatedStatus);
|
||||
|
||||
const allComplete = Object.values(updatedStatus).every(status => status === true);
|
||||
if (allComplete && pageLoading) {
|
||||
console.log('✅ 所有初始化完成,隐藏加载状态');
|
||||
setPageLoading(false);
|
||||
Taro.hideLoading();
|
||||
}
|
||||
}
|
||||
|
||||
useShareAppMessage(() => {
|
||||
// 获取当前用户ID,用于生成邀请链接
|
||||
const userId = Taro.getStorageSync('UserId');
|
||||
|
||||
return {
|
||||
title: '时里院子市集',
|
||||
title: '网宿小店 - 网宿软件',
|
||||
path: userId ? `/pages/index/index?inviter=${userId}&source=share&t=${Date.now()}` : `/pages/index/index`,
|
||||
success: function () {
|
||||
console.log('首页分享成功');
|
||||
@@ -97,21 +67,14 @@ function Home() {
|
||||
success: (res) => {
|
||||
if (res.authSetting['scope.userInfo']) {
|
||||
// 用户授权成功,可以获取用户信息
|
||||
console.log('用户重新授权成功');
|
||||
reload();
|
||||
} else {
|
||||
// 用户拒绝授权,提示授权失败
|
||||
console.log('用户拒绝授权');
|
||||
checkInitComplete({ userLogin: true });
|
||||
Taro.showToast({
|
||||
title: '授权失败',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('打开设置页面失败:', error);
|
||||
checkInitComplete({ userLogin: true });
|
||||
}
|
||||
});
|
||||
};
|
||||
@@ -123,80 +86,14 @@ function Home() {
|
||||
}
|
||||
|
||||
const reload = () => {
|
||||
console.log('开始执行登录流程...');
|
||||
Taro.login({
|
||||
success: (res) => {
|
||||
console.log('微信登录成功,code:', res.code);
|
||||
|
||||
// 调用后端登录接口
|
||||
loginByOpenId({
|
||||
code: res.code,
|
||||
tenantId: TenantId
|
||||
}).then(async data => {
|
||||
console.log('后端登录成功:', data);
|
||||
if (data) {
|
||||
// 保存用户信息到本地存储
|
||||
saveStorageByLoginUser(data.access_token, data.user);
|
||||
|
||||
// 标记登录完成
|
||||
checkInitComplete({ userLogin: true });
|
||||
|
||||
Taro.showToast({
|
||||
title: '登录成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
console.log('✅ 用户登录完成');
|
||||
} else {
|
||||
throw new Error('登录返回数据为空');
|
||||
}
|
||||
}).catch(error => {
|
||||
console.error('后端登录失败:', error);
|
||||
// 即使登录失败也标记为完成,避免一直加载
|
||||
checkInitComplete({ userLogin: true });
|
||||
Taro.showToast({
|
||||
title: '登录失败,请重试',
|
||||
icon: 'error',
|
||||
duration: 3000
|
||||
});
|
||||
});
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('微信登录失败:', error);
|
||||
Taro.showToast({
|
||||
title: '微信登录失败',
|
||||
icon: 'error',
|
||||
duration: 3000
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
console.log('=== 首页初始化开始 ===');
|
||||
|
||||
// 显示加载提示
|
||||
Taro.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
// 获取站点信息
|
||||
console.log('开始获取站点信息...');
|
||||
getShopInfo().then((data) => {
|
||||
console.log('站点信息获取成功:', data);
|
||||
checkInitComplete({ shopInfo: true });
|
||||
}).catch((error) => {
|
||||
console.error('站点信息获取失败:', error);
|
||||
// 即使失败也标记为完成,避免一直加载
|
||||
checkInitComplete({ shopInfo: true });
|
||||
// 显示错误提示
|
||||
Taro.showToast({
|
||||
title: '获取站点信息失败',
|
||||
icon: 'error',
|
||||
duration: 3000
|
||||
});
|
||||
});
|
||||
getShopInfo().then(() => {
|
||||
|
||||
})
|
||||
|
||||
// 检查是否有待处理的邀请关系 - 异步处理,不阻塞页面加载
|
||||
if (hasPendingInvite()) {
|
||||
@@ -229,33 +126,17 @@ function Home() {
|
||||
}
|
||||
|
||||
// Taro.getSetting:获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。
|
||||
console.log('开始检查用户授权状态...');
|
||||
Taro.getSetting({
|
||||
success: (res) => {
|
||||
console.log('授权状态检查结果:', res.authSetting);
|
||||
checkInitComplete({ userAuth: true });
|
||||
|
||||
if (res.authSetting['scope.userInfo']) {
|
||||
// 用户已经授权过,可以直接获取用户信息
|
||||
console.log('✅ 用户已经授权过,开始登录流程');
|
||||
console.log('用户已经授权过,可以直接获取用户信息')
|
||||
reload();
|
||||
} else {
|
||||
// 用户未授权,需要弹出授权窗口
|
||||
console.log('❌ 用户未授权,显示授权弹窗');
|
||||
console.log('用户未授权,需要弹出授权窗口')
|
||||
showAuthModal();
|
||||
// 即使未授权也标记登录为完成,避免一直加载
|
||||
checkInitComplete({ userLogin: true });
|
||||
}
|
||||
},
|
||||
fail: (error) => {
|
||||
console.error('获取授权状态失败:', error);
|
||||
// 标记为完成,避免一直加载
|
||||
checkInitComplete({ userAuth: true, userLogin: true });
|
||||
Taro.showToast({
|
||||
title: '获取授权状态失败',
|
||||
icon: 'error',
|
||||
duration: 3000
|
||||
});
|
||||
}
|
||||
});
|
||||
// 获取用户信息
|
||||
@@ -267,38 +148,6 @@ function Home() {
|
||||
});
|
||||
}, []);
|
||||
|
||||
// 如果还在加载中,显示加载页面
|
||||
if (pageLoading) {
|
||||
return (
|
||||
<View className="flex flex-col items-center justify-center min-h-screen bg-gray-50 p-4">
|
||||
<View className="text-center">
|
||||
<View className="mb-6">
|
||||
<View className="animate-spin rounded-full h-16 w-16 border-b-2 border-blue-500 mx-auto"></View>
|
||||
</View>
|
||||
<View className="text-lg text-gray-700 mb-4">加载中...</View>
|
||||
<View className="text-sm text-gray-500 mb-6 space-y-1">
|
||||
<Text>站点信息: {initStatus.shopInfo ? '✅ 完成' : '⏳ 加载中'}</Text>
|
||||
<Text>用户授权: {initStatus.userAuth ? '✅ 完成' : '⏳ 检查中'}</Text>
|
||||
<Text>用户登录: {initStatus.userLogin ? '✅ 完成' : '⏳ 登录中'}</Text>
|
||||
</View>
|
||||
|
||||
{/* 如果加载时间过长,显示帮助按钮 */}
|
||||
<View className="space-y-3">
|
||||
<View
|
||||
className="px-4 py-2 bg-blue-500 text-white rounded-lg text-sm"
|
||||
onClick={() => showNetworkDiagnosis(BaseUrl)}
|
||||
>
|
||||
网络诊断
|
||||
</View>
|
||||
<View className="text-xs text-gray-400">
|
||||
如果长时间无响应,请点击网络诊断
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<Sticky threshold={0} onChange={() => onSticky(arguments)}>
|
||||
|
||||
@@ -24,7 +24,6 @@ const GoodsDetail = () => {
|
||||
const [specAction, setSpecAction] = useState<'cart' | 'buy'>('cart');
|
||||
// const [selectedSku, setSelectedSku] = useState<ShopGoodsSku | null>(null);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const router = Taro.getCurrentInstance().router;
|
||||
const goodsId = router?.params?.id;
|
||||
|
||||
@@ -118,57 +117,48 @@ const GoodsDetail = () => {
|
||||
}
|
||||
};
|
||||
|
||||
// 重新加载数据的函数
|
||||
const reloadData = async () => {
|
||||
if (!goodsId) return;
|
||||
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
|
||||
try {
|
||||
// 设置超时时间
|
||||
const timeout = new Promise((_, reject) =>
|
||||
setTimeout(() => reject(new Error('请求超时')), 10000)
|
||||
);
|
||||
useEffect(() => {
|
||||
if (goodsId) {
|
||||
setLoading(true);
|
||||
|
||||
// 加载商品详情
|
||||
const goodsPromise = getShopGoods(Number(goodsId)).then((res) => {
|
||||
// 处理富文本内容,去掉图片间距
|
||||
if (res.content) {
|
||||
res.content = wxParse(res.content);
|
||||
}
|
||||
setGoods(res);
|
||||
if (res.files) {
|
||||
const arr = JSON.parse(res.files);
|
||||
arr.length > 0 && setFiles(arr);
|
||||
}
|
||||
return res;
|
||||
});
|
||||
getShopGoods(Number(goodsId))
|
||||
.then((res) => {
|
||||
// 处理富文本内容,去掉图片间距
|
||||
if (res.content) {
|
||||
res.content = wxParse(res.content);
|
||||
}
|
||||
setGoods(res);
|
||||
if (res.files) {
|
||||
const arr = JSON.parse(res.files);
|
||||
arr.length > 0 && setFiles(arr);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("Failed to fetch goods detail:", error);
|
||||
})
|
||||
.finally(() => {
|
||||
setLoading(false);
|
||||
});
|
||||
|
||||
// 等待商品详情加载完成(带超时)
|
||||
await Promise.race([goodsPromise, timeout]);
|
||||
// 加载商品规格
|
||||
listShopGoodsSpec({goodsId: Number(goodsId)} as any)
|
||||
.then((data) => {
|
||||
setSpecs(data || []);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("Failed to fetch goods specs:", error);
|
||||
});
|
||||
|
||||
// 并行加载规格和SKU(不阻塞主要内容显示)
|
||||
Promise.all([
|
||||
listShopGoodsSpec({goodsId: Number(goodsId)} as any)
|
||||
.then((data) => setSpecs(data || []))
|
||||
.catch((error) => console.error("Failed to fetch goods specs:", error)),
|
||||
|
||||
listShopGoodsSku({goodsId: Number(goodsId)} as any)
|
||||
.then((data) => setSkus(data || []))
|
||||
.catch((error) => console.error("Failed to fetch goods skus:", error))
|
||||
]);
|
||||
|
||||
} catch (error: any) {
|
||||
console.error("Failed to fetch goods detail:", error);
|
||||
setError(error.message || '加载失败,请重试');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
// 加载商品SKU
|
||||
listShopGoodsSku({goodsId: Number(goodsId)} as any)
|
||||
.then((data) => {
|
||||
setSkus(data || []);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("Failed to fetch goods skus:", error);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
reloadData();
|
||||
}, [goodsId]);
|
||||
|
||||
// 分享给好友
|
||||
@@ -196,42 +186,8 @@ const GoodsDetail = () => {
|
||||
};
|
||||
});
|
||||
|
||||
// 错误状态
|
||||
if (error) {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center min-h-screen p-4">
|
||||
<div className="text-center">
|
||||
<div className="text-6xl mb-4">😵</div>
|
||||
<div className="text-lg font-medium mb-2">页面加载失败</div>
|
||||
<div className="text-gray-500 mb-6">{error}</div>
|
||||
<div className="space-y-3">
|
||||
<button
|
||||
className="bg-blue-500 text-white px-6 py-2 rounded-lg"
|
||||
onClick={reloadData}
|
||||
>
|
||||
重新加载
|
||||
</button>
|
||||
<button
|
||||
className="bg-gray-500 text-white px-6 py-2 rounded-lg ml-3"
|
||||
onClick={() => Taro.navigateBack()}
|
||||
>
|
||||
返回上页
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
// 加载状态 - 使用更好的加载UI
|
||||
if (loading || !goods) {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center min-h-screen">
|
||||
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-500 mb-4"></div>
|
||||
<div className="text-gray-600">正在加载商品信息...</div>
|
||||
<div className="text-sm text-gray-400 mt-2">请稍候</div>
|
||||
</div>
|
||||
);
|
||||
if (!goods || loading) {
|
||||
return <div>加载中...</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
|
||||
Reference in New Issue
Block a user