'use client';

import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import type { SecuritySettings } from '../types';

interface PasswordSecurityProps {
  securitySettings: SecuritySettings | null;
  onUpdate: (updates: Partial<SecuritySettings>) => void;
}

export function PasswordSecurity({ securitySettings, onUpdate }: PasswordSecurityProps) {
  const handlePasswordChange = () => {
    // TODO: 实现密码修改功能
    onUpdate({ lastPasswordChange: new Date().toISOString() });
  };

  return (
    <Card>
      <CardHeader>
        <CardTitle>密码安全</CardTitle>
      </CardHeader>
      <CardContent className="space-y-4">
        <div>
          <Label>当前密码强度</Label>
          <div className={`mt-1 p-2 rounded ${
            securitySettings?.passwordStrength === 'strong' ? 'bg-green-100 text-green-800' :
            securitySettings?.passwordStrength === 'medium' ? 'bg-yellow-100 text-yellow-800' :
            'bg-red-100 text-red-800'
          }`}>
            {securitySettings?.passwordStrength === 'strong' ? '强' :
             securitySettings?.passwordStrength === 'medium' ? '中等' : '弱'}
          </div>
        </div>

        <div>
          <Label>上次修改时间</Label>
          <p className="text-sm text-gray-600">
            {securitySettings?.lastPasswordChange ?
              new Date(securitySettings.lastPasswordChange).toLocaleString('zh-CN') :
              '未记录'
            }
          </p>
        </div>

        <Button onClick={handlePasswordChange} className="w-full">
          修改密码
        </Button>
      </CardContent>
    </Card>
  );
}