64 lines
2.2 KiB
TypeScript
64 lines
2.2 KiB
TypeScript
'use client';
|
|
|
|
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
|
import { Button } from '@/components/ui/button';
|
|
import type { SecuritySettings } from '../types';
|
|
|
|
interface NotificationSettingsProps {
|
|
securitySettings: SecuritySettings | null;
|
|
onUpdate: (updates: Partial<SecuritySettings>) => void;
|
|
}
|
|
|
|
export function NotificationSettings({ securitySettings, onUpdate }: NotificationSettingsProps) {
|
|
const handleToggle = (field: keyof SecuritySettings) => {
|
|
onUpdate({ [field]: !securitySettings?.[field] });
|
|
};
|
|
|
|
return (
|
|
<Card>
|
|
<CardHeader>
|
|
<CardTitle>通知设置</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<p className="font-medium">邮件通知</p>
|
|
<p className="text-sm text-gray-600">接收安全相关的邮件通知</p>
|
|
</div>
|
|
<Button
|
|
variant={securitySettings?.emailNotification ? "default" : "outline"}
|
|
onClick={() => handleToggle('emailNotification')}
|
|
>
|
|
{securitySettings?.emailNotification ? '已启用' : '已禁用'}
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<p className="font-medium">短信通知</p>
|
|
<p className="text-sm text-gray-600">接收安全相关的短信通知</p>
|
|
</div>
|
|
<Button
|
|
variant={securitySettings?.smsNotification ? "default" : "outline"}
|
|
onClick={() => handleToggle('smsNotification')}
|
|
>
|
|
{securitySettings?.smsNotification ? '已启用' : '已禁用'}
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<p className="font-medium">登录提醒</p>
|
|
<p className="text-sm text-gray-600">新设备登录时接收通知</p>
|
|
</div>
|
|
<Button
|
|
variant={securitySettings?.loginAlert ? "default" : "outline"}
|
|
onClick={() => handleToggle('loginAlert')}
|
|
>
|
|
{securitySettings?.loginAlert ? '已启用' : '已禁用'}
|
|
</Button>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
} |