69 lines
2.2 KiB
TypeScript
69 lines
2.2 KiB
TypeScript
'use client'
|
||
|
||
import React, { useState } from 'react'
|
||
|
||
interface ExportMenuProps {
|
||
onExport: (format: 'csv' | 'pdf', hours: number) => void
|
||
}
|
||
|
||
const ExportMenu: React.FC<ExportMenuProps> = ({ onExport }) => {
|
||
const [selectedFormat, setSelectedFormat] = useState<'csv' | 'pdf'>('csv')
|
||
const [selectedHours, setSelectedHours] = useState<number>(168) // default: week
|
||
|
||
const handleExport = () => {
|
||
onExport(selectedFormat, selectedHours)
|
||
}
|
||
|
||
return (
|
||
<div className="flex items-center gap-3 bg-[#161824] rounded-lg p-3 border border-gray-700">
|
||
<div className="flex items-center gap-2">
|
||
<label className="flex items-center gap-1">
|
||
<input
|
||
type="radio"
|
||
name="format"
|
||
value="csv"
|
||
checked={selectedFormat === 'csv'}
|
||
onChange={(e) => setSelectedFormat(e.target.value as 'csv' | 'pdf')}
|
||
className="w-3 h-3 text-blue-600"
|
||
/>
|
||
<span className="text-gray-300 text-sm">CSV</span>
|
||
</label>
|
||
|
||
<label className="flex items-center gap-1">
|
||
<input
|
||
type="radio"
|
||
name="format"
|
||
value="pdf"
|
||
checked={selectedFormat === 'pdf'}
|
||
onChange={(e) => setSelectedFormat(e.target.value as 'csv' | 'pdf')}
|
||
className="w-3 h-3 text-blue-600"
|
||
/>
|
||
<span className="text-gray-300 text-sm">PDF</span>
|
||
</label>
|
||
</div>
|
||
|
||
<div className="flex items-center gap-2 ml-4">
|
||
<span className="text-gray-300 text-sm">Период:</span>
|
||
<select
|
||
className="bg-[#0e111a] text-gray-200 border border-gray-700 rounded px-2 py-1 text-sm"
|
||
value={selectedHours}
|
||
onChange={(e) => setSelectedHours(Number(e.target.value))}
|
||
>
|
||
<option value={24}>1 день</option>
|
||
<option value={72}>3 дня</option>
|
||
<option value={168}>Неделя</option>
|
||
<option value={720}>Месяц</option>
|
||
</select>
|
||
</div>
|
||
|
||
<button
|
||
onClick={handleExport}
|
||
className="px-3 py-1 bg-blue-600 hover:bg-blue-700 text-white text-sm rounded transition-colors"
|
||
>
|
||
Экспорт
|
||
</button>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default ExportMenu |