58 lines
1.7 KiB
TypeScript
58 lines
1.7 KiB
TypeScript
import React, { useState, useEffect } from "react";
|
||
import { View, Text, Image } from "@tarojs/components";
|
||
import Taro from "@tarojs/taro";
|
||
import "./index.scss";
|
||
import { useGlobalState } from "@/store/global";
|
||
import { GeneralNavbar } from "@/components";
|
||
import httpService from "@/services/httpService";
|
||
|
||
const JoinGroupPage: React.FC = () => {
|
||
// 获取导航栏高度信息
|
||
const { statusNavbarHeightInfo } = useGlobalState() || {};
|
||
const { totalHeight = 98 } = statusNavbarHeightInfo || {};
|
||
|
||
const [url, setUrl] = useState("");
|
||
|
||
useEffect(() => {
|
||
const getQrCode = async () => {
|
||
const res = await httpService.post("/parameter/many_key", {
|
||
keys: "QRCode",
|
||
});
|
||
setUrl(res.data.QRCode);
|
||
};
|
||
getQrCode();
|
||
}, []);
|
||
|
||
return (
|
||
<View className="page_container">
|
||
{/* 顶部导航栏 */}
|
||
<GeneralNavbar
|
||
title=""
|
||
showBack={true}
|
||
showAvatar={false}
|
||
onBack={() => {
|
||
Taro.navigateBack();
|
||
}}
|
||
/>
|
||
{/* 主要内容 */}
|
||
<View className="main_content" style={{ paddingTop: `${totalHeight}px` }}>
|
||
<Text className="title-text">你应该会想加入这里</Text>
|
||
<Text>你会在这里遇见相似的人，和更好的自己。</Text>
|
||
<Image
|
||
className="qrcode"
|
||
mode="scaleToFill"
|
||
src={url}
|
||
showMenuByLongpress
|
||
></Image>
|
||
<Text className="hint-text">长按保存图片👆使用微信扫码加入群聊</Text>
|
||
<Text>你不是一个人在寻找球友。</Text>
|
||
<Text>你想认识的人，也在找你。</Text>
|
||
<Text>每一个热爱运动的人，</Text>
|
||
<Text>都在这里相遇。</Text>
|
||
</View>
|
||
</View>
|
||
);
|
||
};
|
||
|
||
export default JoinGroupPage;
|