Files
citrus/resources/views/front/career/intern_dashboard.blade.php
T

393 lines
23 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
@extends('layouts.site')
@section('content')
<section class="wrapper bg-[#f0f7ff] py-12">
<div class="container px-4">
<div class="max-w-4xl mx-auto">
<!-- Top header / Welcome card -->
<div class="bg-white rounded-3xl p-6 md:p-8 shadow-xl border border-slate-100/50 flex flex-col md:flex-row justify-between items-start md:items-center gap-6 mb-8">
<div>
<span class="text-xs uppercase font-extrabold tracking-widest text-[#e31e24] bg-red-50 px-3 py-1.5 rounded-full">Stajyer Paneli</span>
<h1 class="text-3xl font-extrabold text-slate-900 tracking-tight mt-3">Hoş Geldiniz, {{ $intern->name }}</h1>
<p class="text-sm text-slate-500 mt-1">Staj belgelerinizi ve başvuru detaylarınızı buradan yönetebilirsiniz.</p>
</div>
<form action="{{ route('intern.logout') }}" method="POST">
@csrf
<button type="submit" class="px-5 py-3 rounded-xl bg-slate-100 hover:bg-red-50 text-slate-600 hover:text-[#e31e24] font-bold text-sm transition-all flex items-center gap-2 border border-slate-200/50 hover:border-red-100">
<i class="uil uil-sign-out-alt text-lg"></i>
<span>Çıkış Yap</span>
</button>
</form>
</div>
<!-- Session & Validation Alerts -->
@if(session('success'))
<div class="bg-green-50 border border-green-200 text-green-700 px-6 py-4 rounded-3xl mb-8 flex items-center gap-3 shadow-sm">
<i class="uil uil-check-circle text-2xl flex-shrink-0"></i>
<span class="font-bold text-sm">{{ session('success') }}</span>
</div>
@endif
@if(session('error'))
<div class="bg-red-50 border border-red-200 text-[#e31e24] px-6 py-4 rounded-3xl mb-8 flex items-center gap-3 shadow-sm">
<i class="uil uil-exclamation-octagon text-2xl flex-shrink-0"></i>
<span class="font-bold text-sm">{{ session('error') }}</span>
</div>
@endif
@if($errors->any())
<div class="bg-red-50 border border-red-200 text-[#e31e24] px-6 py-4 rounded-3xl mb-8 shadow-sm">
<div class="flex items-center gap-3 mb-2">
<i class="uil uil-exclamation-octagon text-2xl flex-shrink-0"></i>
<span class="font-bold text-sm">Lütfen aşağıdaki hataları düzeltin:</span>
</div>
<ul class="list-disc list-inside text-xs font-semibold space-y-1 ml-1">
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<!-- Application Info & Document Download Grid -->
<div class="grid grid-cols-1 md:grid-cols-12 gap-8">
<!-- Sidebar stats / statuses -->
<div class="md:col-span-4 space-y-6">
<div class="bg-white rounded-3xl p-6 shadow-xl border border-slate-100/50">
<h3 class="font-bold text-slate-800 text-lg mb-4 pb-2 border-b border-slate-100">Başvuru Detayları</h3>
<div class="space-y-4">
<div>
<span class="text-xs text-slate-400 font-semibold block">E-posta</span>
<span class="text-sm font-semibold text-slate-700 block mt-0.5">{{ $intern->email }}</span>
</div>
@if($intern->phone)
<div>
<span class="text-xs text-slate-400 font-semibold block">Telefon</span>
<span class="text-sm font-semibold text-slate-700 block mt-0.5">{{ $intern->phone }}</span>
</div>
@endif
<div>
<span class="text-xs text-slate-400 font-semibold block">Staj Durumu</span>
<span class="inline-flex mt-1.5 px-3 py-1 rounded-full text-xs font-bold uppercase tracking-wider
@if($intern->status === 'accepted') bg-green-50 text-green-700 border border-green-200
@elseif($intern->status === 'rejected') bg-red-50 text-red-700 border border-red-200
@elseif($intern->status === 'reviewed') bg-blue-50 text-blue-700 border border-blue-200
@elseif($intern->status === 'waiting_document') bg-amber-50 text-amber-700 border border-amber-200
@else bg-slate-50 text-slate-500 border border-slate-200 @endif">
@if($intern->status === 'accepted') Kabul Edildi
@elseif($intern->status === 'rejected') Reddedildi
@elseif($intern->status === 'reviewed') İncelendi
@elseif($intern->status === 'waiting_document') Belge Bekleniyor
@else Beklemede @endif
</span>
</div>
@if($intern->internship_start_date)
<div class="border-t border-slate-100 pt-4">
<span class="text-xs text-slate-400 font-semibold block">Staj Başlangıç Tarihi</span>
<span class="text-sm font-semibold text-slate-700 block mt-0.5">{{ \Carbon\Carbon::parse($intern->internship_start_date)->format('d.m.Y') }}</span>
</div>
@endif
@if($intern->internship_end_date)
<div>
<span class="text-xs text-slate-400 font-semibold block">Staj Bitiş Tarihi</span>
<span class="text-sm font-semibold text-slate-700 block mt-0.5">{{ \Carbon\Carbon::parse($intern->internship_end_date)->format('d.m.Y') }}</span>
</div>
@endif
@if($intern->internship_total_days)
<div>
<span class="text-xs text-slate-400 font-semibold block">Toplam Süre</span>
<span class="text-sm font-bold text-blue-600 block mt-0.5">{{ $intern->internship_total_days }} İş Günü <span class="text-xs text-slate-400 font-normal">(Haftada 5 Gün)</span></span>
</div>
@endif
</div>
</div>
</div>
<!-- Document download cards -->
<div class="md:col-span-8 space-y-6">
<div class="bg-white rounded-3xl p-6 md:p-8 shadow-xl border border-slate-100/50">
<h3 class="font-bold text-slate-800 text-lg mb-6 pb-2 border-b border-slate-100">Belgeleriniz</h3>
<div class="space-y-6">
<!-- CV Card -->
<div class="p-5 rounded-2xl border border-slate-100 bg-slate-50/50 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 hover:border-slate-200 transition-all">
<div class="flex items-center gap-4">
<div class="w-12 h-12 rounded-xl bg-red-50 text-[#e31e24] flex items-center justify-center text-2xl flex-shrink-0">
<i class="uil uil-file-alt"></i>
</div>
<div>
<h4 class="font-bold text-slate-800 text-base">Özgeçmiş (CV)</h4>
<p class="text-xs text-slate-400 mt-0.5">Başvuru sırasında yüklemiş olduğunuz özgeçmiş belgeniz.</p>
</div>
</div>
@if($intern->cv_path)
<a href="{{ Storage::disk('public')->url($intern->cv_path) }}" target="_blank" class="w-full sm:w-auto px-5 py-2.5 bg-slate-800 hover:bg-slate-900 text-white font-bold rounded-xl text-sm transition-all flex items-center justify-center gap-2 shadow-md">
<i class="uil uil-arrow-down-tray"></i>
<span>İndir</span>
</a>
@else
<span class="text-xs text-slate-400 italic">Yüklenmemiş</span>
@endif
</div>
<!-- Intern Upload: To Be Signed Form Card -->
<div class="p-5 rounded-2xl border border-slate-100 bg-slate-50/50 hover:border-slate-200 transition-all">
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-4">
<div class="flex items-center gap-4">
<div class="w-12 h-12 rounded-xl bg-blue-50 text-blue-600 flex items-center justify-center text-2xl flex-shrink-0">
<i class="uil uil-file-upload-alt"></i>
</div>
<div>
<h4 class="font-bold text-slate-800 text-base">İmzalanacak Staj Formu</h4>
@if($intern->to_be_signed_internship_form_path)
<p class="text-xs text-green-600 font-semibold mt-0.5">Staj formunuz başarıyla yüklendi. İmza işlemleri için hazır.</p>
@else
<p class="text-xs text-slate-400 mt-0.5">İmzalanmasını istediğiniz staj formunu buradan yükleyebilirsiniz.</p>
@endif
</div>
</div>
<div class="flex items-center gap-2 w-full sm:w-auto">
@if($intern->to_be_signed_internship_form_path)
<a href="{{ Storage::disk('public')->url($intern->to_be_signed_internship_form_path) }}" target="_blank" class="px-4 py-2.5 bg-slate-850 hover:bg-slate-900 text-white font-bold rounded-xl text-xs transition-all flex items-center justify-center gap-1.5 shadow-sm">
<i class="uil uil-arrow-down-tray"></i>
<span>Görüntüle</span>
</a>
<button type="button" onclick="document.getElementById('upload-form-wrapper').classList.toggle('hidden')" class="px-4 py-2.5 bg-blue-50 hover:bg-blue-100 text-blue-600 font-bold rounded-xl text-xs transition-all flex items-center justify-center gap-1.5">
<i class="uil uil-edit"></i>
<span>Değiştir</span>
</button>
@else
<button type="button" onclick="document.getElementById('upload-form-wrapper').classList.toggle('hidden')" class="w-full sm:w-auto px-5 py-2.5 bg-blue-600 hover:bg-blue-700 text-white font-bold rounded-xl text-sm transition-all flex items-center justify-center gap-2 shadow-md shadow-blue-500/10">
<i class="uil uil-plus"></i>
<span>Yükle</span>
</button>
@endif
</div>
</div>
<!-- Form Upload Dropzone Area -->
<div id="upload-form-wrapper" class="{{ $intern->to_be_signed_internship_form_path ? 'hidden' : '' }} mt-4 border-t border-slate-100 pt-4">
<form action="{{ route('intern.upload-form') }}" method="POST" enctype="multipart/form-data" class="space-y-4">
@csrf
<!-- Company Legal Info Copy Box -->
<div class="bg-slate-50 border border-slate-200/60 rounded-2xl p-5 text-sm text-slate-600">
<div class="flex items-center gap-2 mb-3">
<i class="uil uil-info-circle text-blue-600 text-lg flex-shrink-0"></i>
<h5 class="font-extrabold text-slate-800 text-sm tracking-tight">Şirket Legal Bilgilerimiz</h5>
</div>
<p class="text-xs text-slate-400 mb-4 leading-normal">
Lütfen staj formunuzu doldururken şirketimize ait aşağıdaki resmi bilgileri kullanın. Sağdaki kopyalama butonlarını kullanarak bilgileri kolayca kopyalayabilirsiniz.
</p>
<div class="space-y-2.5">
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-2 bg-white px-3 py-2 rounded-xl border border-slate-100/80">
<span class="text-xs text-slate-400 font-bold sm:w-1/4">Şirket Unvanı</span>
<div class="flex items-center justify-between sm:w-3/4 w-full gap-2">
<span id="legal-title" class="text-xs font-bold text-slate-700 select-all break-all">TRUNÇGİL TEKNOLOJİ SANAYİ VE TİCARET LİMİTED ŞİRKETİ</span>
<button type="button" onclick="copyToClipboard('legal-title', this)" class="text-slate-400 hover:text-blue-600 transition-colors p-1 flex-shrink-0" title="Kopyala">
<i class="uil uil-copy text-sm"></i>
</button>
</div>
</div>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-2 bg-white px-3 py-2 rounded-xl border border-slate-100/80">
<span class="text-xs text-slate-400 font-bold sm:w-1/4">Adres</span>
<div class="flex items-center justify-between sm:w-3/4 w-full gap-2">
<span id="legal-address" class="text-xs font-bold text-slate-700 select-all break-all">Çamtepe Mah. Mahmut Tevfik Atay Bul. Gaziantep Teknopark No: 4A İç Kapı No: 1 Şahinbey / Gaziantep</span>
<button type="button" onclick="copyToClipboard('legal-address', this)" class="text-slate-400 hover:text-blue-600 transition-colors p-1 flex-shrink-0" title="Kopyala">
<i class="uil uil-copy text-sm"></i>
</button>
</div>
</div>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-2 bg-white px-3 py-2 rounded-xl border border-slate-100/80">
<span class="text-xs text-slate-400 font-bold sm:w-1/4">Vergi Dairesi & No</span>
<div class="flex items-center justify-between sm:w-3/4 w-full gap-2">
<span id="legal-tax" class="text-xs font-bold text-slate-700 select-all break-all">Şahinbey V.D. / 8591492435</span>
<button type="button" onclick="copyToClipboard('legal-tax', this)" class="text-slate-400 hover:text-blue-600 transition-colors p-1 flex-shrink-0" title="Kopyala">
<i class="uil uil-copy text-sm"></i>
</button>
</div>
</div>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-2 bg-white px-3 py-2 rounded-xl border border-slate-100/80">
<span class="text-xs text-slate-400 font-bold sm:w-1/4">MERSİS No</span>
<div class="flex items-center justify-between sm:w-3/4 w-full gap-2">
<span id="legal-mersis" class="text-xs font-bold text-slate-700 select-all break-all">0859149243500001</span>
<button type="button" onclick="copyToClipboard('legal-mersis', this)" class="text-slate-400 hover:text-blue-600 transition-colors p-1 flex-shrink-0" title="Kopyala">
<i class="uil uil-copy text-sm"></i>
</button>
</div>
</div>
</div>
</div>
<div class="space-y-4">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div>
<label for="internship_start_date" class="block text-xs font-extrabold text-slate-500 uppercase tracking-wider mb-1.5">Staj Başlangıç Tarihi</label>
<input type="date" name="internship_start_date" id="internship_start_date" onchange="calculateEndDateFrontend()" oninput="calculateEndDateFrontend()" required value="{{ $intern->internship_start_date }}" class="w-full px-4 py-3 rounded-xl border border-slate-200 focus:border-blue-400 focus:ring-1 focus:ring-blue-400 focus:outline-none text-sm font-semibold text-slate-700 bg-white transition-all" />
</div>
<div>
<label for="internship_total_days" class="block text-xs font-extrabold text-slate-500 uppercase tracking-wider mb-1.5">Staj Süresi (İş Günü)</label>
<input type="number" name="internship_total_days" id="internship_total_days" onchange="calculateEndDateFrontend()" oninput="calculateEndDateFrontend()" min="1" required value="{{ $intern->internship_total_days }}" placeholder="Örn: 20" class="w-full px-4 py-3 rounded-xl border border-slate-200 focus:border-blue-400 focus:ring-1 focus:ring-blue-400 focus:outline-none text-sm font-semibold text-slate-700 bg-white transition-all" />
</div>
</div>
<div>
<label for="internship_end_date" class="block text-xs font-extrabold text-slate-500 uppercase tracking-wider mb-1.5">Staj Bitiş Tarihi (Otomatik)</label>
<input type="date" name="internship_end_date" id="internship_end_date" readonly class="w-full px-4 py-3 rounded-xl border border-slate-200 bg-slate-50 text-slate-500 cursor-not-allowed focus:outline-none text-sm font-semibold transition-all" value="{{ $intern->internship_end_date }}" />
</div>
</div>
<div class="relative border-2 border-dashed border-slate-200 hover:border-blue-400 rounded-2xl p-6 transition-all bg-white flex flex-col items-center justify-center text-center cursor-pointer group">
<input type="file" name="internship_form" id="internship_form" accept=".pdf,.docx,.jpg,.png,.jpeg" onchange="handleFileSelected(this)" class="absolute inset-0 w-full h-full opacity-0 cursor-pointer z-10" />
<i class="uil uil-cloud-upload text-4xl text-slate-400 group-hover:text-blue-500 transition-colors mb-2"></i>
<p class="text-sm font-bold text-slate-700">Dosya Seçin veya Sürükleyin</p>
<p class="text-xs text-slate-400 mt-1">PDF, DOCX, JPG veya PNG (Maks. 50MB)</p>
<p id="selected-file-name" class="text-xs font-bold text-blue-600 mt-3"></p>
</div>
<div class="flex justify-end">
<button type="submit" id="submit-upload-btn" disabled class="px-6 py-2.5 bg-blue-600 hover:bg-blue-700 text-white font-bold rounded-xl text-sm transition-all flex items-center gap-2 opacity-50 cursor-not-allowed">
<i class="uil uil-check"></i>
<span>Dosyayı Kaydet</span>
</button>
</div>
</form>
</div>
</div>
<!-- Signed Internship Form Card -->
<div class="p-5 rounded-2xl border border-slate-100 bg-slate-50/50 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 hover:border-slate-200 transition-all">
<div class="flex items-center gap-4">
<div class="w-12 h-12 rounded-xl @if($intern->signed_internship_form_path) bg-green-50 text-green-600 @else bg-amber-50 text-amber-600 @endif flex items-center justify-center text-2xl flex-shrink-0">
<i class="uil uil-file-check-alt"></i>
</div>
<div class="flex-grow">
<h4 class="font-bold text-slate-800 text-base">İmzalı Staj Formu</h4>
@if($intern->signed_internship_form_path)
<p class="text-xs text-slate-400 mt-0.5">Şirketimiz tarafından imzalanmış ve onaylanmış staj belgeniz.</p>
@else
<p class="text-xs text-amber-600/90 font-medium mt-0.5">Belgeniz imza aşamasındadır. Yöneticilerimiz tarafından onaylandığında buradan indirebilirsiniz.</p>
@endif
</div>
</div>
@if($intern->signed_internship_form_path)
<a href="{{ Storage::disk('public')->url($intern->signed_internship_form_path) }}" target="_blank" class="w-full sm:w-auto px-5 py-2.5 bg-[#e31e24] hover:bg-[#c4191f] text-white font-bold rounded-xl text-sm transition-all flex items-center justify-center gap-2 shadow-md shadow-red-500/10">
<i class="uil uil-arrow-down-tray"></i>
<span>İndir</span>
</a>
@else
<button disabled class="w-full sm:w-auto px-5 py-2.5 bg-slate-100 text-slate-400 font-bold rounded-xl text-sm cursor-not-allowed flex items-center justify-center gap-2 border border-slate-200/50">
<i class="uil uil-hourglass"></i>
<span>Bekleniyor</span>
</button>
@endif
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
@push('styles')
<script src="https://cdn.tailwindcss.com"></script>
<script>
function handleFileSelected(input) {
const fileNameElement = document.getElementById('selected-file-name');
const submitBtn = document.getElementById('submit-upload-btn');
if (input.files && input.files.length > 0) {
const file = input.files[0];
const fileSizeMB = file.size / (1024 * 1024);
if (fileSizeMB > 50) {
alert('Dosya boyutu 50MB\'ı aşamaz.');
input.value = '';
fileNameElement.textContent = '';
submitBtn.disabled = true;
submitBtn.classList.add('opacity-50', 'cursor-not-allowed');
return;
}
fileNameElement.textContent = 'Seçilen dosya: ' + file.name + ' (' + fileSizeMB.toFixed(2) + ' MB)';
submitBtn.disabled = false;
submitBtn.classList.remove('opacity-50', 'cursor-not-allowed');
} else {
fileNameElement.textContent = '';
submitBtn.disabled = true;
submitBtn.classList.add('opacity-50', 'cursor-not-allowed');
}
}
function calculateEndDateFrontend() {
const startDateVal = document.getElementById('internship_start_date').value;
const totalDaysVal = document.getElementById('internship_total_days').value;
const endDateInput = document.getElementById('internship_end_date');
if (!startDateVal || !totalDaysVal || totalDaysVal <= 0) {
return;
}
let date = new Date(startDateVal);
let daysToAdd = parseInt(totalDaysVal);
let count = 0;
let endDate = new Date(startDateVal);
while (count < daysToAdd) {
const dayOfWeek = date.getDay();
if (dayOfWeek === 6 || dayOfWeek === 0) { // 6 = Saturday, 0 = Sunday
date.setDate(date.getDate() + 1);
continue;
}
endDate = new Date(date);
date.setDate(date.getDate() + 1);
count++;
}
// Format to YYYY-MM-DD
const yyyy = endDate.getFullYear();
const mm = String(endDate.getMonth() + 1).padStart(2, '0');
const dd = String(endDate.getDate()).padStart(2, '0');
endDateInput.value = `${yyyy}-${mm}-${dd}`;
}
// Trigger calculation once on load if values exist
document.addEventListener('DOMContentLoaded', function() {
calculateEndDateFrontend();
});
function copyToClipboard(elementId, btn) {
const text = document.getElementById(elementId).textContent;
navigator.clipboard.writeText(text).then(() => {
const icon = btn.querySelector('i');
const originalClass = icon.className;
icon.className = 'uil uil-check text-green-500';
setTimeout(() => {
icon.className = originalClass;
}, 2000);
});
}
</script>
<style>
.shadow-xl {
box-shadow: 0 1rem 3rem rgba(30, 41, 59, 0.04) !important;
}
</style>
@endpush
@endsection