106 lines
3.9 KiB
TypeScript
106 lines
3.9 KiB
TypeScript
"use client"
|
||
|
||
import { useState } from 'react'
|
||
import { Sidebar } from '@/components/dashboard/sidebar'
|
||
import { Card } from '@/components/ui/card'
|
||
import { Button } from '@/components/ui/button'
|
||
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
|
||
import { Input } from '@/components/ui/input'
|
||
import { EmployeesList } from './employees-list'
|
||
import { EmployeeSchedule } from './employee-schedule'
|
||
import {
|
||
Users,
|
||
Calendar,
|
||
Search,
|
||
Plus,
|
||
FileText
|
||
} from 'lucide-react'
|
||
|
||
export function EmployeesDashboard() {
|
||
const [searchQuery, setSearchQuery] = useState('')
|
||
|
||
return (
|
||
<div className="min-h-screen bg-gradient-smooth flex">
|
||
<Sidebar />
|
||
<main className="flex-1 ml-56 p-6">
|
||
<div className="max-w-7xl mx-auto">
|
||
{/* Заголовок страницы */}
|
||
<div className="flex items-center justify-between mb-6">
|
||
<div className="flex items-center gap-3">
|
||
<Users className="h-8 w-8 text-purple-400" />
|
||
<div>
|
||
<h1 className="text-2xl font-bold text-white">Управление сотрудниками</h1>
|
||
<p className="text-white/70">Личные данные, табель работы и учет</p>
|
||
</div>
|
||
</div>
|
||
<Button className="glass-button">
|
||
<Plus className="h-4 w-4 mr-2" />
|
||
Добавить сотрудника
|
||
</Button>
|
||
</div>
|
||
|
||
{/* Поиск */}
|
||
<Card className="glass-card p-4 mb-6">
|
||
<div className="relative">
|
||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-white/60 h-4 w-4" />
|
||
<Input
|
||
placeholder="Поиск сотрудников..."
|
||
value={searchQuery}
|
||
onChange={(e) => setSearchQuery(e.target.value)}
|
||
className="glass-input pl-10"
|
||
/>
|
||
</div>
|
||
</Card>
|
||
|
||
{/* Основной контент с вкладками */}
|
||
<Tabs defaultValue="list" className="w-full">
|
||
<TabsList className="glass-card mb-6 grid w-full grid-cols-3">
|
||
<TabsTrigger
|
||
value="list"
|
||
className="text-white data-[state=active]:bg-white/20 cursor-pointer"
|
||
>
|
||
<Users className="h-4 w-4 mr-2" />
|
||
Список сотрудников
|
||
</TabsTrigger>
|
||
<TabsTrigger
|
||
value="schedule"
|
||
className="text-white data-[state=active]:bg-white/20 cursor-pointer"
|
||
>
|
||
<Calendar className="h-4 w-4 mr-2" />
|
||
Табель работы
|
||
</TabsTrigger>
|
||
<TabsTrigger
|
||
value="reports"
|
||
className="text-white data-[state=active]:bg-white/20 cursor-pointer"
|
||
>
|
||
<FileText className="h-4 w-4 mr-2" />
|
||
Отчеты
|
||
</TabsTrigger>
|
||
</TabsList>
|
||
|
||
<TabsContent value="list">
|
||
<EmployeesList searchQuery={searchQuery} />
|
||
</TabsContent>
|
||
|
||
<TabsContent value="schedule">
|
||
<EmployeeSchedule />
|
||
</TabsContent>
|
||
|
||
<TabsContent value="reports">
|
||
<Card className="glass-card p-8">
|
||
<div className="text-center">
|
||
<FileText className="h-16 w-16 text-white/40 mx-auto mb-4" />
|
||
<h3 className="text-xl font-semibold text-white mb-2">Отчеты</h3>
|
||
<p className="text-white/70 mb-4">
|
||
Генерация отчетов по работе сотрудников
|
||
</p>
|
||
<p className="text-white/50 text-sm">Функция в разработке</p>
|
||
</div>
|
||
</Card>
|
||
</TabsContent>
|
||
</Tabs>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
)
|
||
}
|