39 lines
1.7 KiB
TypeScript
39 lines
1.7 KiB
TypeScript
interface VipAuthModalProps {
|
||
onClose: () => void;
|
||
}
|
||
|
||
export const VipAuthModal = ({ onClose }: VipAuthModalProps) => {
|
||
return (
|
||
<div className='fixed inset-0 z-40 flex items-center justify-center bg-black/30'>
|
||
<div className='w-[560px] max-w-[95vw] bg-white rounded-3xl shadow-xl overflow-hidden text-sm'>
|
||
<div className='px-4 py-3 border-b flex items-center justify-between'>
|
||
<div className='font-semibold'>太平 VIP 认证说明</div>
|
||
<button className='text-xs text-gray-500' onClick={onClose}>
|
||
关闭
|
||
</button>
|
||
</div>
|
||
<div className='px-4 py-4 bg-gray-50/60'>
|
||
<div className='flex gap-4 items-center'>
|
||
<div className='flex-1 text-xs text-gray-700 space-y-2'>
|
||
<p>通过「太平 VIP 认证」二维码,可完成太平渠道客户的身份绑定与权益确认。</p>
|
||
<ul className='list-disc ml-5 space-y-1'>
|
||
<li>客户出示太平 APP 内会员二维码,由工作人员扫码完成认证。</li>
|
||
<li>认证成功后,系统会自动标记为「太平 VIP 客户」,并记录在体检档案中。</li>
|
||
<li>支持后续报告寄送、复查预约等专属服务。</li>
|
||
</ul>
|
||
</div>
|
||
<div className='w-40 h-40 rounded-3xl bg-white border flex items-center justify-center text-xs text-gray-500'>
|
||
<img
|
||
src='https://datacenter-open.oss-cn-hangzhou.aliyuncs.com/his/taiping-vip.jpg'
|
||
alt='太平 VIP 认证二维码'
|
||
className='w-full h-full object-cover'
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|
||
|