From a430284aa21e3ae1f0d5654e55b2ad2852519cc2 Mon Sep 17 00:00:00 2001
From: wwf <yearningwang@iqtogether.com>
Date: 星期三, 04 六月 2025 15:17:49 +0800
Subject: [PATCH] 初始化
---
app/components/base/qrcode/index.tsx | 32 ++++++++++++++++----------------
1 files changed, 16 insertions(+), 16 deletions(-)
diff --git a/app/components/base/qrcode/index.tsx b/app/components/base/qrcode/index.tsx
index 278176e..c932399 100644
--- a/app/components/base/qrcode/index.tsx
+++ b/app/components/base/qrcode/index.tsx
@@ -1,20 +1,19 @@
'use client'
import React, { useEffect, useRef, useState } from 'react'
import { useTranslation } from 'react-i18next'
-import {
- RiQrCodeLine,
-} from '@remixicon/react'
-import { QRCodeCanvas as QRCode } from 'qrcode.react'
-import ActionButton from '@/app/components/base/action-button'
+import QRCode from 'qrcode.react'
+import QrcodeStyle from './style.module.css'
import Tooltip from '@/app/components/base/tooltip'
type Props = {
content: string
+ selectorId: string
+ className?: string
}
const prefixEmbedded = 'appOverview.overview.appInfo.qrcode.title'
-const ShareQRCode = ({ content }: Props) => {
+const ShareQRCode = ({ content, selectorId, className }: Props) => {
const { t } = useTranslation()
const [isShow, setIsShow] = useState<boolean>(false)
const qrCodeRef = useRef<HTMLDivElement>(null)
@@ -54,21 +53,22 @@
<Tooltip
popupContent={t(`${prefixEmbedded}`) || ''}
>
- <div className='relative h-6 w-6' onClick={toggleQRCode}>
- <ActionButton>
- <RiQrCodeLine className='h-4 w-4' />
- </ActionButton>
+ <div
+ className={`w-8 h-8 cursor-pointer rounded-lg ${className ?? ''}`}
+ onClick={toggleQRCode}
+ >
+ <div className={`w-full h-full ${QrcodeStyle.QrcodeIcon} ${isShow ? QrcodeStyle.show : ''}`} />
{isShow && (
<div
ref={qrCodeRef}
- className='absolute -right-8 top-8 z-10 flex w-[232px] flex-col items-center rounded-lg bg-components-panel-bg p-4 shadow-xs'
+ className={QrcodeStyle.qrcodeform}
onClick={handlePanelClick}
>
- <QRCode size={160} value={content} className='mb-2' />
- <div className='system-xs-regular flex items-center'>
- <div className='text-text-tertiary'>{t('appOverview.overview.appInfo.qrcode.scan')}</div>
- <div className='text-text-tertiary'>路</div>
- <div className='cursor-pointer text-text-accent-secondary' onClick={downloadQR}>{t('appOverview.overview.appInfo.qrcode.download')}</div>
+ <QRCode size={160} value={content} className={QrcodeStyle.qrcodeimage}/>
+ <div className={QrcodeStyle.text}>
+ <div className={`text-gray-500 ${QrcodeStyle.scan}`}>{t('appOverview.overview.appInfo.qrcode.scan')}</div>
+ <div className={`text-gray-500 ${QrcodeStyle.scan}`}>路</div>
+ <div className={QrcodeStyle.download} onClick={downloadQR}>{t('appOverview.overview.appInfo.qrcode.download')}</div>
</div>
</div>
)}
--
Gitblit v1.8.0