NapCatQQ/napcat.webui/src/components/qr_code_login.tsx
2025-01-24 21:13:44 +08:00

25 lines
766 B
TypeScript

import { Spinner } from '@heroui/spinner'
import { QRCodeSVG } from 'qrcode.react'
interface QrCodeLoginProps {
qrcode: string
}
const QrCodeLogin: React.FC<QrCodeLoginProps> = ({ qrcode }) => {
return (
<div className="flex flex-col items-center">
<div className="bg-white p-2 rounded-md w-fit mx-auto relative overflow-hidden">
{!qrcode && (
<div className="absolute left-2 top-2 right-2 bottom-2 bg-white bg-opacity-50 backdrop-blur flex items-center justify-center">
<Spinner color="danger" />
</div>
)}
<QRCodeSVG size={180} value={qrcode} />
</div>
<div className="mt-5 text-center">使QQ或者TIM扫描上方二维码</div>
</div>
)
}
export default QrCodeLogin