init
This commit is contained in:
parent
6654eb15d0
commit
056f70a1ad
3
.eslintrc.json
Normal file
3
.eslintrc.json
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"extends": "next/core-web-vitals"
|
||||
}
|
||||
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
@ -0,0 +1,4 @@
|
||||
.next
|
||||
.claude
|
||||
.idea
|
||||
node_modules
|
||||
16
app/globals.css
Normal file
16
app/globals.css
Normal file
@ -0,0 +1,16 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer utilities {
|
||||
.line-clamp-2 {
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
input, textarea, select {
|
||||
@apply px-3 py-2 border-gray-300 rounded-md shadow-sm focus:outline-none focus:border-primary-500;
|
||||
}
|
||||
43
app/layout.tsx
Normal file
43
app/layout.tsx
Normal file
@ -0,0 +1,43 @@
|
||||
import type { Metadata } from 'next'
|
||||
import './globals.css'
|
||||
import QueryProvider from '@/components/QueryProvider'
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'HR AI - Поиск работы',
|
||||
description: 'Платформа для поиска вакансий с искусственным интеллектом',
|
||||
}
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: {
|
||||
children: React.ReactNode
|
||||
}) {
|
||||
return (
|
||||
<html lang="ru">
|
||||
<head>
|
||||
<meta charSet="utf-8" />
|
||||
</head>
|
||||
<body className="min-h-screen bg-gray-50">
|
||||
<QueryProvider>
|
||||
<header className="bg-white shadow-sm border-b">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div className="flex justify-between items-center h-16">
|
||||
<div className="flex items-center">
|
||||
<h1 className="text-xl font-bold text-primary-600">HR AI</h1>
|
||||
</div>
|
||||
<nav className="flex space-x-4">
|
||||
<a href="/" className="text-gray-600 hover:text-primary-600 px-3 py-2 rounded-md text-sm font-medium">
|
||||
Вакансии
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
|
||||
{children}
|
||||
</main>
|
||||
</QueryProvider>
|
||||
</body>
|
||||
</html>
|
||||
)
|
||||
}
|
||||
193
app/page.tsx
Normal file
193
app/page.tsx
Normal file
@ -0,0 +1,193 @@
|
||||
'use client'
|
||||
|
||||
import { useState } from 'react'
|
||||
import { VacancyRead } from '@/types/api'
|
||||
import { useVacancies } from '@/hooks/useVacancy'
|
||||
import Link from 'next/link'
|
||||
import { Search, MapPin, Clock, Banknote } from 'lucide-react'
|
||||
|
||||
export default function HomePage() {
|
||||
const [searchTerm, setSearchTerm] = useState('')
|
||||
const [searchParams, setSearchParams] = useState({
|
||||
active_only: true,
|
||||
title: undefined as string | undefined,
|
||||
})
|
||||
|
||||
const { data: vacancies = [], isLoading, error, refetch } = useVacancies(searchParams)
|
||||
|
||||
const handleSearch = (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
setSearchParams({
|
||||
active_only: true,
|
||||
title: searchTerm || undefined,
|
||||
})
|
||||
}
|
||||
|
||||
const formatSalary = (vacancy: VacancyRead) => {
|
||||
if (!vacancy.salary_from && !vacancy.salary_to) return 'Зарплата не указана'
|
||||
|
||||
const currency = vacancy.salary_currency === 'RUR' ? '₽' : vacancy.salary_currency
|
||||
|
||||
if (vacancy.salary_from && vacancy.salary_to) {
|
||||
return `${vacancy.salary_from.toLocaleString()} - ${vacancy.salary_to.toLocaleString()} ${currency}`
|
||||
}
|
||||
|
||||
if (vacancy.salary_from) {
|
||||
return `от ${vacancy.salary_from.toLocaleString()} ${currency}`
|
||||
}
|
||||
|
||||
if (vacancy.salary_to) {
|
||||
return `до ${vacancy.salary_to.toLocaleString()} ${currency}`
|
||||
}
|
||||
}
|
||||
|
||||
const getExperienceText = (experience: string) => {
|
||||
const mapping = {
|
||||
noExperience: 'Без опыта',
|
||||
between1And3: '1-3 года',
|
||||
between3And6: '3-6 лет',
|
||||
moreThan6: 'Более 6 лет'
|
||||
}
|
||||
return mapping[experience as keyof typeof mapping] || experience
|
||||
}
|
||||
|
||||
const getEmploymentText = (employment: string) => {
|
||||
const mapping = {
|
||||
full: 'Полная занятость',
|
||||
part: 'Частичная занятость',
|
||||
project: 'Проектная работа',
|
||||
volunteer: 'Волонтерство',
|
||||
probation: 'Стажировка'
|
||||
}
|
||||
return mapping[employment as keyof typeof mapping] || employment
|
||||
}
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="flex justify-center items-center min-h-[400px]">
|
||||
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-600"></div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-8">
|
||||
{/* Header */}
|
||||
<div className="text-center">
|
||||
<h1 className="text-4xl font-bold text-gray-900 mb-4">
|
||||
Найдите работу мечты
|
||||
</h1>
|
||||
<p className="text-lg text-gray-600 max-w-2xl mx-auto">
|
||||
Платформа с искусственным интеллектом для поиска идеальной вакансии
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Search */}
|
||||
<div className="max-w-2xl mx-auto">
|
||||
<form onSubmit={handleSearch} className="flex gap-2">
|
||||
<div className="relative flex-1">
|
||||
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 h-5 w-5" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Поиск по названию вакансии..."
|
||||
className="w-full pl-10 pr-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-transparent"
|
||||
value={searchTerm}
|
||||
onChange={(e) => setSearchTerm(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
className="px-6 py-3 bg-primary-600 text-white rounded-lg hover:bg-primary-700 focus:ring-2 focus:ring-primary-500 focus:ring-offset-2"
|
||||
>
|
||||
Найти
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{/* Error */}
|
||||
{error && (
|
||||
<div className="text-center py-8">
|
||||
<p className="text-red-600">Не удалось загрузить вакансии</p>
|
||||
<button
|
||||
onClick={() => refetch()}
|
||||
className="mt-4 px-4 py-2 bg-primary-600 text-white rounded-lg hover:bg-primary-700"
|
||||
>
|
||||
Попробовать снова
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Vacancies Grid */}
|
||||
{!error && vacancies.length > 0 && (
|
||||
<div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
|
||||
{vacancies.map((vacancy) => (
|
||||
<Link
|
||||
key={vacancy.id}
|
||||
href={`/vacancy/${vacancy.id}`}
|
||||
className="block bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow border border-gray-200"
|
||||
>
|
||||
<div className="p-6">
|
||||
<div className="flex items-start justify-between mb-4">
|
||||
<h3 className="text-lg font-semibold text-gray-900 line-clamp-2">
|
||||
{vacancy.title}
|
||||
</h3>
|
||||
{vacancy.premium && (
|
||||
<span className="ml-2 px-2 py-1 bg-yellow-100 text-yellow-800 text-xs font-medium rounded">
|
||||
Premium
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="space-y-2 mb-4">
|
||||
<div className="flex items-center text-gray-600 text-sm">
|
||||
<Banknote className="h-4 w-4 mr-2" />
|
||||
<span>{formatSalary(vacancy)}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center text-gray-600 text-sm">
|
||||
<MapPin className="h-4 w-4 mr-2" />
|
||||
<span>{vacancy.area_name}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center text-gray-600 text-sm">
|
||||
<Clock className="h-4 w-4 mr-2" />
|
||||
<span>{getExperienceText(vacancy.experience)}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="text-sm text-gray-700 mb-4">
|
||||
<p className="font-medium">{vacancy.company_name}</p>
|
||||
<p className="line-clamp-2 mt-1">{vacancy.description}</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-between">
|
||||
<span className="px-3 py-1 bg-primary-100 text-primary-800 text-xs font-medium rounded-full">
|
||||
{getEmploymentText(vacancy.employment_type)}
|
||||
</span>
|
||||
<span className="text-xs text-gray-500">
|
||||
{new Date(vacancy.published_at || vacancy.created_at).toLocaleDateString('ru-RU')}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Empty State */}
|
||||
{!error && !isLoading && vacancies.length === 0 && (
|
||||
<div className="text-center py-12">
|
||||
<div className="text-gray-400 mb-4">
|
||||
<Search className="h-16 w-16 mx-auto" />
|
||||
</div>
|
||||
<h3 className="text-lg font-medium text-gray-900 mb-2">
|
||||
Вакансии не найдены
|
||||
</h3>
|
||||
<p className="text-gray-600">
|
||||
Попробуйте изменить параметры поиска или вернитесь позже
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
298
app/vacancy/[id]/page.tsx
Normal file
298
app/vacancy/[id]/page.tsx
Normal file
@ -0,0 +1,298 @@
|
||||
'use client'
|
||||
|
||||
import { useParams, useRouter } from 'next/navigation'
|
||||
import { useVacancy } from '@/hooks/useVacancy'
|
||||
import { VacancyRead } from '@/types/api'
|
||||
import {
|
||||
ArrowLeft,
|
||||
MapPin,
|
||||
Clock,
|
||||
Banknote,
|
||||
Building,
|
||||
Users,
|
||||
Calendar,
|
||||
Phone,
|
||||
Mail,
|
||||
Globe
|
||||
} from 'lucide-react'
|
||||
import ResumeUploadForm from '@/components/ResumeUploadForm'
|
||||
|
||||
export default function VacancyPage() {
|
||||
const params = useParams()
|
||||
const router = useRouter()
|
||||
const vacancyId = parseInt(params.id as string)
|
||||
|
||||
const { data: vacancy, isLoading, error } = useVacancy(vacancyId)
|
||||
|
||||
const formatSalary = (vacancy: VacancyRead) => {
|
||||
if (!vacancy.salary_from && !vacancy.salary_to) return 'Зарплата не указана'
|
||||
|
||||
const currency = vacancy.salary_currency === 'RUR' ? '₽' : vacancy.salary_currency
|
||||
|
||||
if (vacancy.salary_from && vacancy.salary_to) {
|
||||
return `${vacancy.salary_from.toLocaleString()} - ${vacancy.salary_to.toLocaleString()} ${currency}`
|
||||
}
|
||||
|
||||
if (vacancy.salary_from) {
|
||||
return `от ${vacancy.salary_from.toLocaleString()} ${currency}`
|
||||
}
|
||||
|
||||
if (vacancy.salary_to) {
|
||||
return `до ${vacancy.salary_to.toLocaleString()} ${currency}`
|
||||
}
|
||||
}
|
||||
|
||||
const getExperienceText = (experience: string) => {
|
||||
const mapping = {
|
||||
noExperience: 'Без опыта',
|
||||
between1And3: '1-3 года',
|
||||
between3And6: '3-6 лет',
|
||||
moreThan6: 'Более 6 лет'
|
||||
}
|
||||
return mapping[experience as keyof typeof mapping] || experience
|
||||
}
|
||||
|
||||
const getEmploymentText = (employment: string) => {
|
||||
const mapping = {
|
||||
full: 'Полная занятость',
|
||||
part: 'Частичная занятость',
|
||||
project: 'Проектная работа',
|
||||
volunteer: 'Волонтерство',
|
||||
probation: 'Стажировка'
|
||||
}
|
||||
return mapping[employment as keyof typeof mapping] || employment
|
||||
}
|
||||
|
||||
const getScheduleText = (schedule: string) => {
|
||||
const mapping = {
|
||||
fullDay: 'Полный день',
|
||||
shift: 'Сменный график',
|
||||
flexible: 'Гибкий график',
|
||||
remote: 'Удаленная работа',
|
||||
flyInFlyOut: 'Вахтовый метод'
|
||||
}
|
||||
return mapping[schedule as keyof typeof mapping] || schedule
|
||||
}
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="flex justify-center items-center min-h-[400px]">
|
||||
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary-600"></div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
if (error || !vacancy) {
|
||||
return (
|
||||
<div className="text-center py-12">
|
||||
<div className="text-red-600 mb-4">
|
||||
<p>Не удалось загрузить информацию о вакансии</p>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => router.back()}
|
||||
className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Назад
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="max-w-4xl mx-auto space-y-8">
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between">
|
||||
<button
|
||||
onClick={() => router.back()}
|
||||
className="inline-flex items-center text-gray-600 hover:text-gray-900"
|
||||
>
|
||||
<ArrowLeft className="h-5 w-5 mr-2" />
|
||||
Назад к вакансиям
|
||||
</button>
|
||||
|
||||
{vacancy.premium && (
|
||||
<span className="px-3 py-1 bg-yellow-100 text-yellow-800 text-sm font-medium rounded-full">
|
||||
Premium
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Main Content */}
|
||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
||||
{/* Left Column - Vacancy Details */}
|
||||
<div className="lg:col-span-2 space-y-6">
|
||||
{/* Title and Company */}
|
||||
<div className="bg-white rounded-lg shadow-md p-6">
|
||||
<h1 className="text-3xl font-bold text-gray-900 mb-4">
|
||||
{vacancy.title}
|
||||
</h1>
|
||||
|
||||
<div className="flex items-center mb-6">
|
||||
<Building className="h-5 w-5 text-gray-400 mr-2" />
|
||||
<span className="text-lg font-medium text-gray-900">
|
||||
{vacancy.company_name}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4 text-sm">
|
||||
<div className="flex items-center text-gray-600">
|
||||
<Banknote className="h-4 w-4 mr-2" />
|
||||
<span>{formatSalary(vacancy)}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center text-gray-600">
|
||||
<MapPin className="h-4 w-4 mr-2" />
|
||||
<span>{vacancy.area_name}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center text-gray-600">
|
||||
<Clock className="h-4 w-4 mr-2" />
|
||||
<span>{getExperienceText(vacancy.experience)}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center text-gray-600">
|
||||
<Users className="h-4 w-4 mr-2" />
|
||||
<span>{getEmploymentText(vacancy.employment_type)}</span>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center text-gray-600">
|
||||
<Calendar className="h-4 w-4 mr-2" />
|
||||
<span>{getScheduleText(vacancy.schedule)}</span>
|
||||
</div>
|
||||
|
||||
{vacancy.published_at && (
|
||||
<div className="flex items-center text-gray-600">
|
||||
<Clock className="h-4 w-4 mr-2" />
|
||||
<span>Опубликовано {new Date(vacancy.published_at).toLocaleDateString('ru-RU')}</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Description */}
|
||||
<div className="bg-white rounded-lg shadow-md p-6">
|
||||
<h2 className="text-xl font-semibold text-gray-900 mb-4">
|
||||
Описание вакансии
|
||||
</h2>
|
||||
<div className="prose prose-gray max-w-none">
|
||||
<p className="whitespace-pre-line text-gray-700 leading-relaxed">
|
||||
{vacancy.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Key Skills */}
|
||||
{vacancy.key_skills && (
|
||||
<div className="bg-white rounded-lg shadow-md p-6">
|
||||
<h2 className="text-xl font-semibold text-gray-900 mb-4">
|
||||
Ключевые навыки
|
||||
</h2>
|
||||
<div className="prose prose-gray max-w-none">
|
||||
<p className="text-gray-700">{vacancy.key_skills}</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Company Description */}
|
||||
{vacancy.company_description && (
|
||||
<div className="bg-white rounded-lg shadow-md p-6">
|
||||
<h2 className="text-xl font-semibold text-gray-900 mb-4">
|
||||
О компании
|
||||
</h2>
|
||||
<div className="prose prose-gray max-w-none">
|
||||
<p className="whitespace-pre-line text-gray-700 leading-relaxed">
|
||||
{vacancy.company_description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Location Details */}
|
||||
{(vacancy.address || vacancy.metro_stations) && (
|
||||
<div className="bg-white rounded-lg shadow-md p-6">
|
||||
<h2 className="text-xl font-semibold text-gray-900 mb-4">
|
||||
Местоположение
|
||||
</h2>
|
||||
<div className="space-y-2 text-gray-700">
|
||||
{vacancy.address && (
|
||||
<div className="flex items-start">
|
||||
<MapPin className="h-4 w-4 mr-2 mt-0.5 flex-shrink-0" />
|
||||
<span>{vacancy.address}</span>
|
||||
</div>
|
||||
)}
|
||||
{vacancy.metro_stations && (
|
||||
<div className="flex items-start">
|
||||
<span className="text-sm font-medium mr-2">Метро:</span>
|
||||
<span className="text-sm">{vacancy.metro_stations}</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Right Column - Application Form and Contact Info */}
|
||||
<div className="space-y-6">
|
||||
{/* Contact Information */}
|
||||
{(vacancy.contacts_name || vacancy.contacts_email || vacancy.contacts_phone || vacancy.url) && (
|
||||
<div className="bg-white rounded-lg shadow-md p-6">
|
||||
<h3 className="text-lg font-semibold text-gray-900 mb-4">
|
||||
Контактная информация
|
||||
</h3>
|
||||
<div className="space-y-3 text-sm">
|
||||
{vacancy.contacts_name && (
|
||||
<div className="flex items-center text-gray-700">
|
||||
<Users className="h-4 w-4 mr-2" />
|
||||
<span>{vacancy.contacts_name}</span>
|
||||
</div>
|
||||
)}
|
||||
{vacancy.contacts_email && (
|
||||
<div className="flex items-center text-gray-700">
|
||||
<Mail className="h-4 w-4 mr-2" />
|
||||
<a
|
||||
href={`mailto:${vacancy.contacts_email}`}
|
||||
className="hover:text-primary-600"
|
||||
>
|
||||
{vacancy.contacts_email}
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
{vacancy.contacts_phone && (
|
||||
<div className="flex items-center text-gray-700">
|
||||
<Phone className="h-4 w-4 mr-2" />
|
||||
<a
|
||||
href={`tel:${vacancy.contacts_phone}`}
|
||||
className="hover:text-primary-600"
|
||||
>
|
||||
{vacancy.contacts_phone}
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
{vacancy.url && (
|
||||
<div className="flex items-center text-gray-700">
|
||||
<Globe className="h-4 w-4 mr-2" />
|
||||
<a
|
||||
href={vacancy.url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:text-primary-600"
|
||||
>
|
||||
Перейти к вакансии
|
||||
</a>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Application Form */}
|
||||
<ResumeUploadForm
|
||||
vacancyId={vacancy.id}
|
||||
vacancyTitle={vacancy.title}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
36
components/QueryProvider.tsx
Normal file
36
components/QueryProvider.tsx
Normal file
@ -0,0 +1,36 @@
|
||||
'use client'
|
||||
|
||||
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
|
||||
import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
|
||||
import { useState } from 'react'
|
||||
|
||||
export default function QueryProvider({ children }: { children: React.ReactNode }) {
|
||||
const [queryClient] = useState(
|
||||
() =>
|
||||
new QueryClient({
|
||||
defaultOptions: {
|
||||
queries: {
|
||||
staleTime: 5 * 60 * 1000, // 5 minutes
|
||||
gcTime: 10 * 60 * 1000, // 10 minutes
|
||||
retry: (failureCount, error: any) => {
|
||||
// Don't retry on 4xx errors
|
||||
if (error?.status >= 400 && error?.status < 500) {
|
||||
return false
|
||||
}
|
||||
return failureCount < 2
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
retry: 1,
|
||||
},
|
||||
},
|
||||
})
|
||||
)
|
||||
|
||||
return (
|
||||
<QueryClientProvider client={queryClient}>
|
||||
{children}
|
||||
<ReactQueryDevtools initialIsOpen={false} />
|
||||
</QueryClientProvider>
|
||||
)
|
||||
}
|
||||
325
components/ResumeUploadForm.tsx
Normal file
325
components/ResumeUploadForm.tsx
Normal file
@ -0,0 +1,325 @@
|
||||
'use client'
|
||||
|
||||
import { useState } from 'react'
|
||||
import InputMask from 'react-input-mask'
|
||||
import { ResumeCreate } from '@/types/api'
|
||||
import { useCreateResume, useResumesByVacancy } from '@/hooks/useResume'
|
||||
import { Upload, FileText, X, CheckCircle, Clock } from 'lucide-react'
|
||||
|
||||
interface ResumeUploadFormProps {
|
||||
vacancyId: number
|
||||
vacancyTitle: string
|
||||
onSuccess?: () => void
|
||||
}
|
||||
|
||||
export default function ResumeUploadForm({ vacancyId, vacancyTitle, onSuccess }: ResumeUploadFormProps) {
|
||||
const [formData, setFormData] = useState({
|
||||
applicant_name: '',
|
||||
applicant_email: '',
|
||||
applicant_phone: '',
|
||||
cover_letter: '',
|
||||
})
|
||||
|
||||
const [file, setFile] = useState<File | null>(null)
|
||||
const [success, setSuccess] = useState(false)
|
||||
|
||||
const createResumeMutation = useCreateResume()
|
||||
const { data: existingResumes, isLoading: isLoadingResumes } = useResumesByVacancy(vacancyId)
|
||||
|
||||
// Проверяем есть ли уже резюме для этой вакансии в текущей сессии
|
||||
const hasExistingResume = existingResumes && existingResumes.length > 0
|
||||
|
||||
const handleInputChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
|
||||
const { name, value } = e.target
|
||||
setFormData(prev => ({ ...prev, [name]: value }))
|
||||
}
|
||||
|
||||
const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
const selectedFile = e.target.files?.[0]
|
||||
if (selectedFile) {
|
||||
// Check file size (max 10MB)
|
||||
if (selectedFile.size > 10 * 1024 * 1024) {
|
||||
return
|
||||
}
|
||||
|
||||
// Check file type
|
||||
const allowedTypes = [
|
||||
'application/pdf',
|
||||
'application/msword',
|
||||
'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
|
||||
'text/plain'
|
||||
]
|
||||
|
||||
if (!allowedTypes.includes(selectedFile.type)) {
|
||||
return
|
||||
}
|
||||
|
||||
setFile(selectedFile)
|
||||
}
|
||||
}
|
||||
|
||||
const removeFile = () => {
|
||||
setFile(null)
|
||||
}
|
||||
|
||||
const handleSubmit = (e: React.FormEvent) => {
|
||||
e.preventDefault()
|
||||
|
||||
console.log('Submit data check:', {
|
||||
file,
|
||||
formData,
|
||||
vacancyId
|
||||
})
|
||||
|
||||
if (!file) {
|
||||
console.log('No file selected')
|
||||
return
|
||||
}
|
||||
|
||||
if (!formData.applicant_name || !formData.applicant_email) {
|
||||
console.log('Missing required fields:', {
|
||||
applicant_name: formData.applicant_name,
|
||||
applicant_email: formData.applicant_email
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
const resumeData: ResumeCreate = {
|
||||
vacancy_id: vacancyId,
|
||||
applicant_name: formData.applicant_name,
|
||||
applicant_email: formData.applicant_email,
|
||||
applicant_phone: formData.applicant_phone || undefined,
|
||||
cover_letter: formData.cover_letter || undefined,
|
||||
resume_file: file,
|
||||
}
|
||||
|
||||
console.log('Sending resume data:', resumeData)
|
||||
|
||||
createResumeMutation.mutate(resumeData, {
|
||||
onSuccess: () => {
|
||||
setSuccess(true)
|
||||
// Reset form
|
||||
setFormData({
|
||||
applicant_name: '',
|
||||
applicant_email: '',
|
||||
applicant_phone: '',
|
||||
cover_letter: '',
|
||||
})
|
||||
setFile(null)
|
||||
|
||||
if (onSuccess) {
|
||||
onSuccess()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
if (isLoadingResumes) {
|
||||
return (
|
||||
<div className="bg-white border border-gray-200 rounded-lg p-6">
|
||||
<div className="flex items-center justify-center">
|
||||
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-primary-600 mr-3"></div>
|
||||
<span className="text-gray-600">Проверяем ваши заявки...</span>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
if (success || hasExistingResume) {
|
||||
return (
|
||||
<div className="bg-green-50 border border-green-200 rounded-lg p-6">
|
||||
<div className="flex items-center">
|
||||
<CheckCircle className="h-6 w-6 text-green-600 mr-3" />
|
||||
<div>
|
||||
<h3 className="text-lg font-medium text-green-800">
|
||||
{success ? 'Резюме успешно отправлено!' : 'Ваше резюме уже отправлено!'}
|
||||
</h3>
|
||||
<p className="mt-2 text-green-700">
|
||||
Готовим для вас сессию для собеседования. Мы свяжемся с вами в ближайшее время.
|
||||
</p>
|
||||
{hasExistingResume && existingResumes && (
|
||||
<div className="mt-4 space-y-2">
|
||||
{existingResumes.map((resume) => (
|
||||
<div key={resume.id} className="flex items-center text-sm text-green-600">
|
||||
<Clock className="h-4 w-4 mr-2" />
|
||||
<span>
|
||||
Отправлено: {new Date(resume.created_at).toLocaleDateString('ru-RU', {
|
||||
day: 'numeric',
|
||||
month: 'long',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
})} • Статус: {resume.status === 'pending' ? 'На рассмотрении' :
|
||||
resume.status === 'under_review' ? 'На проверке' :
|
||||
resume.status === 'interview_scheduled' ? 'Собеседование назначено' :
|
||||
resume.status === 'interviewed' ? 'Проведено собеседование' :
|
||||
resume.status === 'accepted' ? 'Принят' :
|
||||
resume.status === 'rejected' ? 'Отклонен' : resume.status}
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="bg-white border border-gray-200 rounded-lg p-6">
|
||||
<div className="mb-6">
|
||||
<h3 className="text-lg font-medium text-gray-900">
|
||||
Откликнуться на вакансию
|
||||
</h3>
|
||||
<p className="mt-1 text-sm text-gray-600">
|
||||
{vacancyTitle}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
{/* Personal Information */}
|
||||
<div className="grid grid-cols-1 gap-6 sm:grid-cols-2">
|
||||
<div>
|
||||
<label htmlFor="applicant_name" className="block text-sm font-medium text-gray-700">
|
||||
Имя *
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="applicant_name"
|
||||
name="applicant_name"
|
||||
required
|
||||
className="mt-1 block w-full px-3 py-2 border-gray-300 rounded-md shadow-sm focus:outline-none focus:border-primary-500 sm:text-sm"
|
||||
value={formData.applicant_name}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Ваше полное имя"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="applicant_email" className="block text-sm font-medium text-gray-700">
|
||||
Email *
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
id="applicant_email"
|
||||
name="applicant_email"
|
||||
required
|
||||
className="mt-1 block w-full px-3 py-2 border-gray-300 rounded-md shadow-sm focus:outline-none focus:border-primary-500 sm:text-sm"
|
||||
value={formData.applicant_email}
|
||||
onChange={handleInputChange}
|
||||
placeholder="your@email.com"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label htmlFor="applicant_phone" className="block text-sm font-medium text-gray-700">
|
||||
Телефон
|
||||
</label>
|
||||
<InputMask
|
||||
mask="+7 (999) 999-99-99"
|
||||
maskChar="_"
|
||||
value={formData.applicant_phone}
|
||||
onChange={handleInputChange}
|
||||
>
|
||||
{() => (
|
||||
<input
|
||||
type="tel"
|
||||
id="applicant_phone"
|
||||
name="applicant_phone"
|
||||
className="mt-1 block w-full px-3 py-2 border-gray-300 rounded-md shadow-sm focus:outline-none focus:border-primary-500 sm:text-sm"
|
||||
placeholder="+7 (999) 999-99-99"
|
||||
/>
|
||||
)}
|
||||
</InputMask>
|
||||
</div>
|
||||
|
||||
{/* Cover Letter */}
|
||||
<div>
|
||||
<label htmlFor="cover_letter" className="block text-sm font-medium text-gray-700">
|
||||
Сопроводительное письмо
|
||||
</label>
|
||||
<textarea
|
||||
id="cover_letter"
|
||||
name="cover_letter"
|
||||
rows={4}
|
||||
className="mt-1 block w-full px-3 py-2 border-gray-300 rounded-md shadow-sm focus:outline-none focus:border-primary-500 sm:text-sm"
|
||||
value={formData.cover_letter}
|
||||
onChange={handleInputChange}
|
||||
placeholder="Расскажите о себе и почему вас интересует эта позиция..."
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* File Upload */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||
Резюме *
|
||||
</label>
|
||||
|
||||
{!file ? (
|
||||
<div className="mt-1 flex justify-center px-6 pt-5 pb-6 border-2 border-gray-300 border-dashed rounded-md hover:border-primary-400 transition-colors">
|
||||
<div className="space-y-1 text-center">
|
||||
<Upload className="mx-auto h-12 w-12 text-gray-400" />
|
||||
<div className="flex text-sm text-gray-600">
|
||||
<label
|
||||
htmlFor="resume_file"
|
||||
className="relative cursor-pointer bg-white rounded-md font-medium text-primary-600 hover:text-primary-500 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-2 focus-within:ring-primary-500"
|
||||
>
|
||||
<span>Загрузить резюме</span>
|
||||
<input
|
||||
id="resume_file"
|
||||
name="resume_file"
|
||||
type="file"
|
||||
className="sr-only"
|
||||
accept=".pdf,.doc,.docx,.txt"
|
||||
onChange={handleFileChange}
|
||||
/>
|
||||
</label>
|
||||
<p className="pl-1">или перетащите сюда</p>
|
||||
</div>
|
||||
<p className="text-xs text-gray-500">
|
||||
PDF, DOC, DOCX, TXT до 10 МБ
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="mt-1 flex items-center justify-between p-3 border border-gray-300 rounded-md">
|
||||
<div className="flex items-center">
|
||||
<FileText className="h-5 w-5 text-gray-400 mr-2" />
|
||||
<span className="text-sm text-gray-900">{file.name}</span>
|
||||
<span className="ml-2 text-xs text-gray-500">
|
||||
({(file.size / 1024 / 1024).toFixed(2)} МБ)
|
||||
</span>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={removeFile}
|
||||
className="text-gray-400 hover:text-gray-600"
|
||||
>
|
||||
<X className="h-5 w-5" />
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Error Message */}
|
||||
{createResumeMutation.error && (
|
||||
<div className="text-red-600 text-sm bg-red-50 border border-red-200 rounded-md p-3">
|
||||
Произошла ошибка при отправке резюме
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Submit Button */}
|
||||
<div className="flex justify-end">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={createResumeMutation.isPending}
|
||||
className="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>
|
||||
{createResumeMutation.isPending ? 'Отправляем...' : 'Отправить резюме'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
44
hooks/useResume.ts
Normal file
44
hooks/useResume.ts
Normal file
@ -0,0 +1,44 @@
|
||||
import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
|
||||
import { resumeService } from '@/services/resume.service'
|
||||
import { ResumeCreate, GetResumesParams } from '@/types/api'
|
||||
|
||||
export const useCreateResume = () => {
|
||||
const queryClient = useQueryClient()
|
||||
|
||||
return useMutation({
|
||||
mutationFn: (data: ResumeCreate) => resumeService.createResume(data),
|
||||
onSuccess: () => {
|
||||
// Invalidate and refetch resumes
|
||||
queryClient.invalidateQueries({ queryKey: ['resumes'] })
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export const useResume = (id: number) => {
|
||||
return useQuery({
|
||||
queryKey: ['resume', id],
|
||||
queryFn: () => resumeService.getResume(id),
|
||||
enabled: !!id,
|
||||
staleTime: 10 * 60 * 1000, // 10 minutes
|
||||
retry: 2,
|
||||
})
|
||||
}
|
||||
|
||||
export const useResumes = (params?: GetResumesParams) => {
|
||||
return useQuery({
|
||||
queryKey: ['resumes', params],
|
||||
queryFn: () => resumeService.getResumes(params),
|
||||
staleTime: 5 * 60 * 1000, // 5 minutes
|
||||
retry: 2,
|
||||
})
|
||||
}
|
||||
|
||||
export const useResumesByVacancy = (vacancyId: number) => {
|
||||
return useQuery({
|
||||
queryKey: ['resumes', 'by-vacancy', vacancyId],
|
||||
queryFn: () => resumeService.getResumes({ vacancy_id: vacancyId }),
|
||||
enabled: !!vacancyId,
|
||||
staleTime: 2 * 60 * 1000, // 2 minutes
|
||||
retry: 2,
|
||||
})
|
||||
}
|
||||
42
hooks/useSession.ts
Normal file
42
hooks/useSession.ts
Normal file
@ -0,0 +1,42 @@
|
||||
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
|
||||
import { sessionService } from '@/services/session.service'
|
||||
|
||||
export const useCurrentSession = () => {
|
||||
return useQuery({
|
||||
queryKey: ['session', 'current'],
|
||||
queryFn: () => sessionService.getCurrentSession(),
|
||||
staleTime: 5 * 60 * 1000, // 5 minutes
|
||||
retry: 2,
|
||||
})
|
||||
}
|
||||
|
||||
export const useRefreshSession = () => {
|
||||
const queryClient = useQueryClient()
|
||||
|
||||
return useMutation({
|
||||
mutationFn: () => sessionService.refreshSession(),
|
||||
onSuccess: () => {
|
||||
queryClient.invalidateQueries({ queryKey: ['session'] })
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export const useLogout = () => {
|
||||
const queryClient = useQueryClient()
|
||||
|
||||
return useMutation({
|
||||
mutationFn: () => sessionService.logout(),
|
||||
onSuccess: () => {
|
||||
queryClient.clear()
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export const useSessionHealth = () => {
|
||||
return useQuery({
|
||||
queryKey: ['session', 'health'],
|
||||
queryFn: () => sessionService.healthCheck(),
|
||||
staleTime: 2 * 60 * 1000, // 2 minutes
|
||||
retry: 2,
|
||||
})
|
||||
}
|
||||
22
hooks/useVacancy.ts
Normal file
22
hooks/useVacancy.ts
Normal file
@ -0,0 +1,22 @@
|
||||
import { useQuery } from '@tanstack/react-query'
|
||||
import { vacancyService } from '@/services/vacancy.service'
|
||||
import { GetVacanciesParams } from '@/types/api'
|
||||
|
||||
export const useVacancies = (params?: GetVacanciesParams) => {
|
||||
return useQuery({
|
||||
queryKey: ['vacancies', params],
|
||||
queryFn: () => vacancyService.getVacancies(params),
|
||||
staleTime: 5 * 60 * 1000, // 5 minutes
|
||||
retry: 2,
|
||||
})
|
||||
}
|
||||
|
||||
export const useVacancy = (id: number) => {
|
||||
return useQuery({
|
||||
queryKey: ['vacancy', id],
|
||||
queryFn: () => vacancyService.getVacancy(id),
|
||||
enabled: !!id,
|
||||
staleTime: 10 * 60 * 1000, // 10 minutes
|
||||
retry: 2,
|
||||
})
|
||||
}
|
||||
34
lib/ky-client.ts
Normal file
34
lib/ky-client.ts
Normal file
@ -0,0 +1,34 @@
|
||||
import ky from 'ky'
|
||||
|
||||
// Используем прокси Next.js для избежания CORS проблем
|
||||
const API_BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL || 'http://localhost:8000'
|
||||
|
||||
// Базовый клиент без Content-Type заголовка
|
||||
const baseKyClient = ky.create({
|
||||
prefixUrl: API_BASE_URL,
|
||||
credentials: 'include',
|
||||
hooks: {
|
||||
beforeError: [
|
||||
(error) => {
|
||||
const { response } = error
|
||||
if (response && response.body) {
|
||||
error.name = 'APIError'
|
||||
error.message = `${response.status} ${response.statusText}`
|
||||
}
|
||||
return error
|
||||
},
|
||||
],
|
||||
},
|
||||
})
|
||||
|
||||
// JSON клиент
|
||||
export const kyClient = baseKyClient.extend({
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
})
|
||||
|
||||
// FormData клиент (без Content-Type заголовка)
|
||||
export const kyFormClient = baseKyClient
|
||||
|
||||
export default kyClient
|
||||
5
next-env.d.ts
vendored
Normal file
5
next-env.d.ts
vendored
Normal file
@ -0,0 +1,5 @@
|
||||
/// <reference types="next" />
|
||||
/// <reference types="next/image-types/global" />
|
||||
|
||||
// NOTE: This file should not be edited
|
||||
// see https://nextjs.org/docs/basic-features/typescript for more information.
|
||||
13
next.config.js
Normal file
13
next.config.js
Normal file
@ -0,0 +1,13 @@
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
async rewrites() {
|
||||
return [
|
||||
{
|
||||
source: '/api/v1/:path*',
|
||||
destination: 'http://localhost:8000/api/v1/:path*',
|
||||
},
|
||||
]
|
||||
},
|
||||
}
|
||||
|
||||
module.exports = nextConfig
|
||||
33
package.json
Normal file
33
package.json
Normal file
@ -0,0 +1,33 @@
|
||||
{
|
||||
"name": "hr-ai-frontend",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@tanstack/react-query": "^5.85.6",
|
||||
"@tanstack/react-query-devtools": "^5.85.6",
|
||||
"ky": "^1.9.1",
|
||||
"lucide-react": "^0.294.0",
|
||||
"next": "14.0.4",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-input-mask": "^2.0.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^20.10.5",
|
||||
"@types/react": "^18.2.45",
|
||||
"@types/react-dom": "^18.2.18",
|
||||
"autoprefixer": "^10.4.16",
|
||||
"eslint": "^8.56.0",
|
||||
"eslint-config-next": "14.0.4",
|
||||
"postcss": "^8.4.32",
|
||||
"tailwindcss": "^3.4.0",
|
||||
"typescript": "^5.3.3"
|
||||
},
|
||||
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
|
||||
}
|
||||
6
postcss.config.js
Normal file
6
postcss.config.js
Normal file
@ -0,0 +1,6 @@
|
||||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
||||
51
services/resume.service.ts
Normal file
51
services/resume.service.ts
Normal file
@ -0,0 +1,51 @@
|
||||
import { kyClient, kyFormClient } from '@/lib/ky-client'
|
||||
import { ResumeRead, ResumeCreate, GetResumesParams } from '@/types/api'
|
||||
|
||||
export const resumeService = {
|
||||
async createResume(data: ResumeCreate): Promise<ResumeRead> {
|
||||
const formData = new FormData()
|
||||
|
||||
formData.append('vacancy_id', data.vacancy_id.toString())
|
||||
formData.append('applicant_name', data.applicant_name)
|
||||
formData.append('applicant_email', data.applicant_email)
|
||||
|
||||
if (data.applicant_phone) {
|
||||
formData.append('applicant_phone', data.applicant_phone)
|
||||
}
|
||||
|
||||
if (data.cover_letter) {
|
||||
formData.append('cover_letter', data.cover_letter)
|
||||
}
|
||||
|
||||
formData.append('resume_file', data.resume_file)
|
||||
|
||||
// Логируем данные для отладки
|
||||
console.log('FormData entries:')
|
||||
for (const [key, value] of formData.entries()) {
|
||||
console.log(key, value)
|
||||
}
|
||||
|
||||
return kyFormClient.post('api/v1/resumes/', {
|
||||
body: formData,
|
||||
}).json<ResumeRead>()
|
||||
},
|
||||
|
||||
async getResume(id: number): Promise<ResumeRead> {
|
||||
return kyClient.get(`api/v1/resumes/${id}`).json<ResumeRead>()
|
||||
},
|
||||
|
||||
async getResumes(params?: GetResumesParams): Promise<ResumeRead[]> {
|
||||
const searchParams = new URLSearchParams()
|
||||
|
||||
if (params) {
|
||||
Object.entries(params).forEach(([key, value]) => {
|
||||
if (value !== undefined && value !== null) {
|
||||
searchParams.append(key, value.toString())
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const endpoint = `api/v1/resumes/${searchParams.toString() ? `?${searchParams.toString()}` : ''}`
|
||||
return kyClient.get(endpoint).json<ResumeRead[]>()
|
||||
},
|
||||
}
|
||||
20
services/session.service.ts
Normal file
20
services/session.service.ts
Normal file
@ -0,0 +1,20 @@
|
||||
import { kyClient } from '@/lib/ky-client'
|
||||
import { SessionRead } from '@/types/api'
|
||||
|
||||
export const sessionService = {
|
||||
async getCurrentSession(): Promise<SessionRead> {
|
||||
return kyClient.get('api/v1/sessions/current').json<SessionRead>()
|
||||
},
|
||||
|
||||
async refreshSession(): Promise<void> {
|
||||
return kyClient.post('api/v1/sessions/refresh').json<void>()
|
||||
},
|
||||
|
||||
async logout(): Promise<void> {
|
||||
return kyClient.post('api/v1/sessions/logout').json<void>()
|
||||
},
|
||||
|
||||
async healthCheck(): Promise<void> {
|
||||
return kyClient.get('api/v1/sessions/health').json<void>()
|
||||
},
|
||||
}
|
||||
23
services/vacancy.service.ts
Normal file
23
services/vacancy.service.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { kyClient } from '@/lib/ky-client'
|
||||
import { VacancyRead, GetVacanciesParams } from '@/types/api'
|
||||
|
||||
export const vacancyService = {
|
||||
async getVacancies(params?: GetVacanciesParams): Promise<VacancyRead[]> {
|
||||
const searchParams = new URLSearchParams()
|
||||
|
||||
if (params) {
|
||||
Object.entries(params).forEach(([key, value]) => {
|
||||
if (value !== undefined && value !== null) {
|
||||
searchParams.append(key, value.toString())
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const endpoint = `api/v1/vacancies/${searchParams.toString() ? `?${searchParams.toString()}` : ''}`
|
||||
return kyClient.get(endpoint).json<VacancyRead[]>()
|
||||
},
|
||||
|
||||
async getVacancy(id: number): Promise<VacancyRead> {
|
||||
return kyClient.get(`api/v1/vacancies/${id}`).json<VacancyRead>()
|
||||
},
|
||||
}
|
||||
27
tailwind.config.js
Normal file
27
tailwind.config.js
Normal file
@ -0,0 +1,27 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
module.exports = {
|
||||
content: [
|
||||
'./pages/**/*.{js,ts,jsx,tsx,mdx}',
|
||||
'./components/**/*.{js,ts,jsx,tsx,mdx}',
|
||||
'./app/**/*.{js,ts,jsx,tsx,mdx}',
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: {
|
||||
50: '#f0f9ff',
|
||||
100: '#e0f2fe',
|
||||
200: '#bae6fd',
|
||||
300: '#7dd3fc',
|
||||
400: '#38bdf8',
|
||||
500: '#0ea5e9',
|
||||
600: '#0284c7',
|
||||
700: '#0369a1',
|
||||
800: '#075985',
|
||||
900: '#0c4a6e',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
28
tsconfig.json
Normal file
28
tsconfig.json
Normal file
@ -0,0 +1,28 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"lib": ["dom", "dom.iterable", "es6"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": true,
|
||||
"noEmit": true,
|
||||
"esModuleInterop": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve",
|
||||
"incremental": true,
|
||||
"plugins": [
|
||||
{
|
||||
"name": "next"
|
||||
}
|
||||
],
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./*"]
|
||||
}
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
122
types/api.ts
Normal file
122
types/api.ts
Normal file
@ -0,0 +1,122 @@
|
||||
export type EmploymentType = 'full' | 'part' | 'project' | 'volunteer' | 'probation'
|
||||
export type Experience = 'noExperience' | 'between1And3' | 'between3And6' | 'moreThan6'
|
||||
export type Schedule = 'fullDay' | 'shift' | 'flexible' | 'remote' | 'flyInFlyOut'
|
||||
export type ResumeStatus = 'pending' | 'under_review' | 'interview_scheduled' | 'interviewed' | 'rejected' | 'accepted'
|
||||
|
||||
export interface VacancyRead {
|
||||
id: number
|
||||
title: string
|
||||
description: string
|
||||
key_skills?: string
|
||||
employment_type: EmploymentType
|
||||
experience: Experience
|
||||
schedule: Schedule
|
||||
salary_from?: number
|
||||
salary_to?: number
|
||||
salary_currency?: string
|
||||
gross_salary?: boolean
|
||||
company_name: string
|
||||
company_description?: string
|
||||
area_name: string
|
||||
metro_stations?: string
|
||||
address?: string
|
||||
professional_roles?: string
|
||||
contacts_name?: string
|
||||
contacts_email?: string
|
||||
contacts_phone?: string
|
||||
is_archived: boolean
|
||||
premium: boolean
|
||||
published_at?: string
|
||||
url?: string
|
||||
created_at: string
|
||||
updated_at: string
|
||||
}
|
||||
|
||||
export interface VacancyCreate {
|
||||
title: string
|
||||
description: string
|
||||
key_skills?: string
|
||||
employment_type: EmploymentType
|
||||
experience: Experience
|
||||
schedule: Schedule
|
||||
salary_from?: number
|
||||
salary_to?: number
|
||||
salary_currency?: string
|
||||
gross_salary?: boolean
|
||||
company_name: string
|
||||
company_description?: string
|
||||
area_name: string
|
||||
metro_stations?: string
|
||||
address?: string
|
||||
professional_roles?: string
|
||||
contacts_name?: string
|
||||
contacts_email?: string
|
||||
contacts_phone?: string
|
||||
is_archived?: boolean
|
||||
premium?: boolean
|
||||
published_at?: string
|
||||
url?: string
|
||||
}
|
||||
|
||||
export interface ResumeRead {
|
||||
id: number
|
||||
vacancy_id: number
|
||||
session_id: number
|
||||
applicant_name: string
|
||||
applicant_email: string
|
||||
applicant_phone?: string
|
||||
resume_file_url: string
|
||||
cover_letter?: string
|
||||
status: ResumeStatus
|
||||
interview_report_url?: string
|
||||
notes?: string
|
||||
created_at: string
|
||||
updated_at: string
|
||||
}
|
||||
|
||||
export interface ResumeCreate {
|
||||
vacancy_id: number
|
||||
applicant_name: string
|
||||
applicant_email: string
|
||||
applicant_phone?: string
|
||||
cover_letter?: string
|
||||
resume_file: File
|
||||
}
|
||||
|
||||
export interface SessionRead {
|
||||
id: number
|
||||
session_id: string
|
||||
user_agent?: string
|
||||
ip_address?: string
|
||||
is_active: boolean
|
||||
expires_at: string
|
||||
last_activity: string
|
||||
created_at: string
|
||||
updated_at: string
|
||||
}
|
||||
|
||||
export interface ValidationError {
|
||||
loc: (string | number)[]
|
||||
msg: string
|
||||
type: string
|
||||
}
|
||||
|
||||
export interface HTTPValidationError {
|
||||
detail?: ValidationError[]
|
||||
}
|
||||
|
||||
export interface GetVacanciesParams {
|
||||
skip?: number
|
||||
limit?: number
|
||||
active_only?: boolean
|
||||
title?: string
|
||||
company_name?: string
|
||||
area_name?: string
|
||||
}
|
||||
|
||||
export interface GetResumesParams {
|
||||
skip?: number
|
||||
limit?: number
|
||||
vacancy_id?: number
|
||||
status?: ResumeStatus
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user