Ümit Tunç
1375 lines
73 KiB
PHP
1375 lines
73 KiB
PHP
@extends('layouts.site')
|
||
|
||
@section('content')
|
||
<section class="wrapper bg-[#f0f7ff] py-12">
|
||
<div class="container px-4">
|
||
<div class="max-w-[1440px] 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>
|
||
|
||
<!-- Stajyer Çalışma Rehberi Callout -->
|
||
<div class="bg-gradient-to-r from-blue-600 to-indigo-600 rounded-3xl p-6 shadow-xl text-white mb-8 flex flex-col sm:flex-row items-start sm:items-center justify-between gap-6">
|
||
<div class="flex items-center gap-4">
|
||
<div class="w-12 h-12 rounded-2xl bg-white/10 backdrop-blur-md flex items-center justify-center text-2xl text-white flex-shrink-0">
|
||
<i class="uil uil-info-circle"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-extrabold text-base tracking-tight text-white">Stajyer Çalışma & Git Workflow Rehberi</h4>
|
||
<p class="text-xs text-blue-100 font-medium mt-1">GitHub reposu oluşturma, günlük commitler ve toplantı kuralları hakkında bilgi edinin.</p>
|
||
</div>
|
||
</div>
|
||
<button onclick="toggleGuideModal(true)" class="px-5 py-3 bg-white text-blue-600 hover:bg-blue-50 font-extrabold text-sm rounded-xl transition-all shadow-md flex items-center gap-2 self-stretch sm:self-auto justify-center">
|
||
<i class="uil uil-book-open"></i>
|
||
<span>Rehberi İncele</span>
|
||
</button>
|
||
</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
|
||
|
||
@php
|
||
$status = $intern->status;
|
||
$hasToBeSigned = !empty($intern->to_be_signed_internship_form_path);
|
||
$hasSigned = !empty($intern->signed_internship_form_path);
|
||
|
||
$step1_state = 'completed';
|
||
|
||
if (in_array($status, ['reviewed', 'waiting_document', 'accepted']) || $hasToBeSigned || $hasSigned) {
|
||
$step2_state = 'completed';
|
||
} elseif ($status === 'rejected') {
|
||
$step2_state = 'rejected';
|
||
} else {
|
||
$step2_state = 'active';
|
||
}
|
||
|
||
if ($hasToBeSigned || $hasSigned) {
|
||
$step3_state = 'completed';
|
||
} elseif ($step2_state === 'completed' && $status !== 'rejected') {
|
||
$step3_state = 'active';
|
||
} else {
|
||
$step3_state = 'pending';
|
||
}
|
||
|
||
if ($hasSigned) {
|
||
$step4_state = 'completed';
|
||
} elseif ($step3_state === 'completed' && !$hasSigned && $status !== 'rejected') {
|
||
$step4_state = 'active';
|
||
} else {
|
||
$step4_state = 'pending';
|
||
}
|
||
|
||
if ($status === 'accepted' && $hasSigned) {
|
||
$step5_state = 'completed';
|
||
} elseif ($step4_state === 'completed' && $status !== 'rejected') {
|
||
$step5_state = 'active';
|
||
} else {
|
||
$step5_state = 'pending';
|
||
}
|
||
|
||
$completedCount = 0;
|
||
if ($step1_state === 'completed') $completedCount++;
|
||
if ($step2_state === 'completed') $completedCount++;
|
||
if ($step3_state === 'completed') $completedCount++;
|
||
if ($step4_state === 'completed') $completedCount++;
|
||
if ($step5_state === 'completed') $completedCount++;
|
||
|
||
$progressPercent = (($completedCount - 1) / 4) * 100;
|
||
if ($status === 'rejected') {
|
||
$progressPercent = 25;
|
||
}
|
||
@endphp
|
||
|
||
<!-- Stage Timeline Card -->
|
||
<div class="bg-white rounded-3xl p-6 md:p-8 shadow-xl border border-slate-100/50 mb-8">
|
||
<h3 class="font-bold text-slate-800 text-lg mb-6 pb-2 border-b border-slate-100 flex items-center gap-2">
|
||
<i class="uil uil-chart-growth text-blue-600 text-xl"></i>
|
||
<span>Staj Süreci İlerleme Durumu</span>
|
||
</h3>
|
||
|
||
<!-- Desktop Timeline (Horizontal) -->
|
||
<div class="hidden md:block relative my-6">
|
||
<!-- Background Line -->
|
||
<div class="absolute top-6 left-8 right-8 h-1 bg-slate-100 rounded-full -z-10">
|
||
<div class="h-full bg-blue-600 rounded-full transition-all duration-500" style="width: {{ $progressPercent }}%;"></div>
|
||
</div>
|
||
|
||
<div class="flex justify-between items-start">
|
||
<!-- Step 1 -->
|
||
<div class="flex flex-col items-center text-center w-1/5 px-2">
|
||
<div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl shadow-lg shadow-blue-500/20 z-10 border-4 border-white">
|
||
<i class="uil uil-clipboard-notes"></i>
|
||
</div>
|
||
<span class="text-xs font-extrabold text-slate-800 mt-3">Başvuru Alındı</span>
|
||
<span class="text-[10px] text-slate-400 font-semibold mt-1">Staj başvurunuz sisteme ulaştı.</span>
|
||
</div>
|
||
|
||
<!-- Step 2 -->
|
||
<div class="flex flex-col items-center text-center w-1/5 px-2">
|
||
@if($step2_state === 'completed')
|
||
<div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl shadow-lg shadow-blue-500/20 z-10 border-4 border-white">
|
||
<i class="uil uil-search-alt"></i>
|
||
</div>
|
||
@elseif($step2_state === 'rejected')
|
||
<div class="w-12 h-12 rounded-full bg-red-600 text-white flex items-center justify-center text-xl shadow-lg shadow-red-500/20 z-10 border-4 border-white">
|
||
<i class="uil uil-multiply"></i>
|
||
</div>
|
||
@elseif($step2_state === 'active')
|
||
<div class="w-12 h-12 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-xl z-10 border-4 border-white ring-2 ring-blue-500 animate-pulse">
|
||
<i class="uil uil-search-alt"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-12 h-12 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-xl z-10 border-4 border-white">
|
||
<i class="uil uil-search-alt"></i>
|
||
</div>
|
||
@endif
|
||
<span class="text-xs font-extrabold @if($step2_state === 'active') text-blue-600 @elseif($step2_state === 'rejected') text-red-600 @else text-slate-800 @endif mt-3">Ön Değerlendirme</span>
|
||
@if($step2_state === 'rejected')
|
||
<span class="text-[10px] text-red-500 font-semibold mt-1">Başvurunuz olumsuz sonuçlandı.</span>
|
||
@else
|
||
<span class="text-[10px] text-slate-400 font-semibold mt-1">Evrak ve kriterler inceleniyor.</span>
|
||
@endif
|
||
</div>
|
||
|
||
<!-- Step 3 -->
|
||
<div class="flex flex-col items-center text-center w-1/5 px-2">
|
||
@if($step3_state === 'completed')
|
||
<div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl shadow-lg shadow-blue-500/20 z-10 border-4 border-white">
|
||
<i class="uil uil-file-upload-alt"></i>
|
||
</div>
|
||
@elseif($step3_state === 'active')
|
||
<div class="w-12 h-12 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-xl z-10 border-4 border-white ring-2 ring-blue-500 animate-pulse">
|
||
<i class="uil uil-file-upload-alt"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-12 h-12 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-xl z-10 border-4 border-white">
|
||
<i class="uil uil-file-upload-alt"></i>
|
||
</div>
|
||
@endif
|
||
<span class="text-xs font-extrabold @if($step3_state === 'active') text-blue-600 @else text-slate-800 @endif mt-3">Staj Formu Yükleme</span>
|
||
<span class="text-[10px] text-slate-400 font-semibold mt-1">İmzalanacak staj formunu yükleyin.</span>
|
||
</div>
|
||
|
||
<!-- Step 4 -->
|
||
<div class="flex flex-col items-center text-center w-1/5 px-2">
|
||
@if($step4_state === 'completed')
|
||
<div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl shadow-lg shadow-blue-500/20 z-10 border-4 border-white">
|
||
<i class="uil uil-file-check-alt"></i>
|
||
</div>
|
||
@elseif($step4_state === 'active')
|
||
<div class="w-12 h-12 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-xl z-10 border-4 border-white ring-2 ring-blue-500 animate-pulse">
|
||
<i class="uil uil-file-check-alt"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-12 h-12 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-xl z-10 border-4 border-white">
|
||
<i class="uil uil-file-check-alt"></i>
|
||
</div>
|
||
@endif
|
||
<span class="text-xs font-extrabold @if($step4_state === 'active') text-blue-600 @else text-slate-800 @endif mt-3">İmzalı Form Onayı</span>
|
||
<span class="text-[10px] text-slate-400 font-semibold mt-1">İmzalanmış formunuz hazırlanıyor.</span>
|
||
</div>
|
||
|
||
<!-- Step 5 -->
|
||
<div class="flex flex-col items-center text-center w-1/5 px-2">
|
||
@if($step5_state === 'completed')
|
||
<div class="w-12 h-12 rounded-full bg-blue-600 text-white flex items-center justify-center text-xl shadow-lg shadow-blue-500/20 z-10 border-4 border-white">
|
||
<i class="uil uil-rocket"></i>
|
||
</div>
|
||
@elseif($step5_state === 'active')
|
||
<div class="w-12 h-12 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-xl z-10 border-4 border-white ring-2 ring-blue-500 animate-pulse">
|
||
<i class="uil uil-rocket"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-12 h-12 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-xl z-10 border-4 border-white">
|
||
<i class="uil uil-rocket"></i>
|
||
</div>
|
||
@endif
|
||
<span class="text-xs font-extrabold @if($step5_state === 'active') text-blue-600 @else text-slate-800 @endif mt-3">Oryantasyon & Başlangıç</span>
|
||
<span class="text-[10px] text-slate-400 font-semibold mt-1">Staj süreci ve eğitimler başlar.</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Mobile Timeline (Vertical) -->
|
||
<div class="md:hidden space-y-6 pl-4 relative before:content-[''] before:absolute before:left-[21px] before:top-2 before:bottom-2 before:w-1 before:bg-slate-100">
|
||
<!-- Step 1 -->
|
||
<div class="flex gap-4 items-start relative">
|
||
<div class="w-8 h-8 rounded-full bg-blue-600 text-white flex items-center justify-center text-sm z-10 shadow-md shadow-blue-500/10">
|
||
<i class="uil uil-clipboard-notes"></i>
|
||
</div>
|
||
<div>
|
||
<h4 class="text-sm font-extrabold text-slate-800">Başvuru Alındı</h4>
|
||
<p class="text-xs text-slate-400 mt-0.5">Staj başvurunuz sisteme ulaştı.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Step 2 -->
|
||
<div class="flex gap-4 items-start relative">
|
||
@if($step2_state === 'completed')
|
||
<div class="w-8 h-8 rounded-full bg-blue-600 text-white flex items-center justify-center text-sm z-10 shadow-md shadow-blue-500/10">
|
||
<i class="uil uil-search-alt"></i>
|
||
</div>
|
||
@elseif($step2_state === 'rejected')
|
||
<div class="w-8 h-8 rounded-full bg-red-600 text-white flex items-center justify-center text-sm z-10 shadow-md shadow-red-500/10">
|
||
<i class="uil uil-multiply"></i>
|
||
</div>
|
||
@elseif($step2_state === 'active')
|
||
<div class="w-8 h-8 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-sm z-10 border border-blue-500 animate-pulse">
|
||
<i class="uil uil-search-alt"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-8 h-8 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-sm z-10">
|
||
<i class="uil uil-search-alt"></i>
|
||
</div>
|
||
@endif
|
||
<div>
|
||
<h4 class="text-sm font-extrabold @if($step2_state === 'active') text-blue-600 @elseif($step2_state === 'rejected') text-red-600 @else text-slate-800 @endif">Ön Değerlendirme</h4>
|
||
@if($step2_state === 'rejected')
|
||
<p class="text-xs text-red-500 mt-0.5">Başvurunuz olumsuz sonuçlandı.</p>
|
||
@else
|
||
<p class="text-xs text-slate-400 mt-0.5">Evrak ve kriterler inceleniyor.</p>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Step 3 -->
|
||
<div class="flex gap-4 items-start relative">
|
||
@if($step3_state === 'completed')
|
||
<div class="w-8 h-8 rounded-full bg-blue-600 text-white flex items-center justify-center text-sm z-10 shadow-md shadow-blue-500/10">
|
||
<i class="uil uil-file-upload-alt"></i>
|
||
</div>
|
||
@elseif($step3_state === 'active')
|
||
<div class="w-8 h-8 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-sm z-10 border border-blue-500 animate-pulse">
|
||
<i class="uil uil-file-upload-alt"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-8 h-8 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-sm z-10">
|
||
<i class="uil uil-file-upload-alt"></i>
|
||
</div>
|
||
@endif
|
||
<div>
|
||
<h4 class="text-sm font-extrabold @if($step3_state === 'active') text-blue-600 @else text-slate-800 @endif">Staj Formu Yükleme</h4>
|
||
<p class="text-xs text-slate-400 mt-0.5">İmzalanacak staj formunu yükleyin.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Step 4 -->
|
||
<div class="flex gap-4 items-start relative">
|
||
@if($step4_state === 'completed')
|
||
<div class="w-8 h-8 rounded-full bg-blue-600 text-white flex items-center justify-center text-sm z-10 shadow-md shadow-blue-500/10">
|
||
<i class="uil uil-file-check-alt"></i>
|
||
</div>
|
||
@elseif($step4_state === 'active')
|
||
<div class="w-8 h-8 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-sm z-10 border border-blue-500 animate-pulse">
|
||
<i class="uil uil-file-check-alt"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-8 h-8 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-sm z-10">
|
||
<i class="uil uil-file-check-alt"></i>
|
||
</div>
|
||
@endif
|
||
<div>
|
||
<h4 class="text-sm font-extrabold @if($step4_state === 'active') text-blue-600 @else text-slate-800 @endif">İmzalı Form Onayı</h4>
|
||
<p class="text-xs text-slate-400 mt-0.5">İmzalanmış formunuz hazırlanıyor.</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Step 5 -->
|
||
<div class="flex gap-4 items-start relative">
|
||
@if($step5_state === 'completed')
|
||
<div class="w-8 h-8 rounded-full bg-blue-600 text-white flex items-center justify-center text-sm z-10 shadow-md shadow-blue-500/10">
|
||
<i class="uil uil-rocket"></i>
|
||
</div>
|
||
@elseif($step5_state === 'active')
|
||
<div class="w-8 h-8 rounded-full bg-blue-50 text-blue-600 flex items-center justify-center text-sm z-10 border border-blue-500 animate-pulse">
|
||
<i class="uil uil-rocket"></i>
|
||
</div>
|
||
@else
|
||
<div class="w-8 h-8 rounded-full bg-slate-100 text-slate-400 flex items-center justify-center text-sm z-10">
|
||
<i class="uil uil-rocket"></i>
|
||
</div>
|
||
@endif
|
||
<div>
|
||
<h4 class="text-sm font-extrabold @if($step5_state === 'active') text-blue-600 @else text-slate-800 @endif">Oryantasyon & Başlangıç</h4>
|
||
<p class="text-xs text-slate-400 mt-0.5">Staj süreci ve eğitimler başlar.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Application Info & Document Download Grid -->
|
||
<div class="grid grid-cols-1 md:grid-cols-12 gap-8">
|
||
|
||
<!-- Sidebar stats / statuses / tabs -->
|
||
<div class="md:col-span-4 space-y-6">
|
||
<div class="bg-white rounded-3xl p-4 shadow-xl border border-slate-100/50">
|
||
<h3 class="font-bold text-slate-800 text-base mb-4 px-3 pb-2 border-b border-slate-100">Menü</h3>
|
||
|
||
<div class="space-y-1" role="tablist">
|
||
<!-- Menu Item 1: Kişisel Bilgileriniz -->
|
||
<button type="button" role="tab" aria-selected="true" data-tab-target="personal-info" class="tab-btn active w-full flex items-center gap-4 p-3 rounded-2xl text-left transition-all border border-transparent">
|
||
<div class="w-10 h-10 rounded-xl bg-blue-50 text-blue-600 flex items-center justify-center text-xl flex-shrink-0 tab-icon">
|
||
<i class="uil uil-user"></i>
|
||
</div>
|
||
<div class="flex-grow">
|
||
<span class="block text-sm font-extrabold text-slate-800">Kişisel Bilgiler</span>
|
||
<span class="block text-xs text-slate-400 font-semibold mt-0.5">Başvuru detaylarınız</span>
|
||
</div>
|
||
</button>
|
||
|
||
<!-- Menu Item 2: Belgeleriniz -->
|
||
<button type="button" role="tab" aria-selected="false" data-tab-target="documents" class="tab-btn w-full flex items-center gap-4 p-3 rounded-2xl text-left transition-all border border-transparent">
|
||
<div class="w-10 h-10 rounded-xl bg-slate-50 text-slate-500 flex items-center justify-center text-xl flex-shrink-0 tab-icon">
|
||
<i class="uil uil-file-alt"></i>
|
||
</div>
|
||
<div class="flex-grow">
|
||
<span class="block text-sm font-extrabold text-slate-800">Belgeleriniz</span>
|
||
<span class="block text-xs text-slate-400 font-semibold mt-0.5">CV ve staj formları</span>
|
||
</div>
|
||
</button>
|
||
|
||
<!-- Menu Item 3: Staj Defteri -->
|
||
<button type="button" role="tab" aria-selected="false" data-tab-target="journal" class="tab-btn w-full flex items-center gap-4 p-3 rounded-2xl text-left transition-all border border-transparent">
|
||
<div class="w-10 h-10 rounded-xl bg-slate-50 text-slate-500 flex items-center justify-center text-xl flex-shrink-0 tab-icon">
|
||
<i class="uil uil-book-open"></i>
|
||
</div>
|
||
<div class="flex-grow">
|
||
<span class="block text-sm font-extrabold text-slate-800">Staj Defteri Doldur</span>
|
||
<span class="block text-xs text-slate-400 font-semibold mt-0.5">Günlük çalışma defteri</span>
|
||
</div>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Content Panels -->
|
||
<div class="md:col-span-8">
|
||
|
||
<!-- Panel 1: Kişisel Bilgileriniz -->
|
||
<div id="personal-info-panel" class="tab-panel 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">Kişisel Bilgileriniz</h3>
|
||
|
||
<div class="grid grid-cols-1 sm:grid-cols-2 gap-6">
|
||
<div>
|
||
<span class="text-xs text-slate-400 font-extrabold uppercase tracking-wider block">E-posta</span>
|
||
<span class="text-sm font-bold text-slate-700 block mt-1.5">{{ $intern->email }}</span>
|
||
</div>
|
||
|
||
@if($intern->phone)
|
||
<div>
|
||
<span class="text-xs text-slate-400 font-extrabold uppercase tracking-wider block">Telefon</span>
|
||
<span class="text-sm font-bold text-slate-700 block mt-1.5">{{ $intern->phone }}</span>
|
||
</div>
|
||
@endif
|
||
|
||
<div>
|
||
<span class="text-xs text-slate-400 font-extrabold uppercase tracking-wider block">Staj Durumu</span>
|
||
<div class="mt-2">
|
||
<span class="inline-flex 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>
|
||
</div>
|
||
|
||
@if($intern->internship_total_days)
|
||
<div>
|
||
<span class="text-xs text-slate-400 font-extrabold uppercase tracking-wider block">Toplam Süre</span>
|
||
<span class="text-sm font-bold text-blue-600 block mt-1.5">{{ $intern->internship_total_days }} İş Günü <span class="text-xs text-slate-400 font-normal">(Haftada 5 Gün)</span></span>
|
||
</div>
|
||
@endif
|
||
|
||
@if($intern->internship_start_date)
|
||
<div>
|
||
<span class="text-xs text-slate-400 font-extrabold uppercase tracking-wider block">Staj Başlangıç Tarihi</span>
|
||
<span class="text-sm font-bold text-slate-700 block mt-1.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-extrabold uppercase tracking-wider block">Staj Bitiş Tarihi</span>
|
||
<span class="text-sm font-bold text-slate-700 block mt-1.5">{{ \Carbon\Carbon::parse($intern->internship_end_date)->format('d.m.Y') }}</span>
|
||
</div>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Panel 2: Belgeleriniz -->
|
||
<div id="documents-panel" class="tab-panel hidden 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)
|
||
@if($intern->signed_internship_form_path)
|
||
<p class="text-xs text-green-600 font-semibold mt-0.5">Staj formunuz imzalandı ve onaylandı.</p>
|
||
@else
|
||
<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>
|
||
@endif
|
||
@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-800 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>
|
||
@endif
|
||
</div>
|
||
</div>
|
||
|
||
<div id="upload-form-wrapper" class="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 }}" @if($intern->status !== 'pending') disabled @endif 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 disabled:bg-slate-50 disabled:text-slate-500 disabled:cursor-not-allowed" />
|
||
</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" @if($intern->status !== 'pending') disabled @endif 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 disabled:bg-slate-50 disabled:text-slate-500 disabled:cursor-not-allowed" />
|
||
</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>
|
||
|
||
@if($intern->status === 'pending')
|
||
<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>
|
||
@else
|
||
<div class="p-4 bg-slate-50 border border-slate-100 rounded-2xl text-center text-xs text-slate-500 font-semibold">
|
||
<i class="uil uil-lock-alt text-base mr-1"></i> Başvurunuz bekleme aşamasında (beklemede) olmadığı için staj bilgilerinizi ve dosyanızı güncelleyemezsiniz.
|
||
</div>
|
||
@endif
|
||
</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>
|
||
|
||
<!-- Panel 3: Staj Defteri -->
|
||
<div id="journal-panel" class="tab-panel hidden space-y-6">
|
||
<div class="bg-white rounded-3xl p-6 md:p-8 shadow-xl border border-slate-100/50">
|
||
|
||
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-6 pb-4 border-b border-slate-100">
|
||
<div>
|
||
<h3 class="font-bold text-slate-800 text-lg">Staj Defteri Modülü</h3>
|
||
<p class="text-xs text-slate-400 mt-0.5">Her staj günü için yaptığınız çalışmaları yazıp kaydedin. Dilerseniz GitHub commitlerini tek tıkla çekebilirsiniz.</p>
|
||
</div>
|
||
<div class="flex gap-2 w-full sm:w-auto">
|
||
<button type="button" onclick="openPrintModal()" class="w-full sm:w-auto px-4 py-2.5 bg-green-600 hover:bg-green-700 text-white font-bold rounded-xl text-xs transition-all flex items-center justify-center gap-2 shadow-md shadow-green-500/10">
|
||
<i class="uil uil-print text-sm"></i>
|
||
<span>Defteri Yazdır / İndir</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- GitHub Repository URL Configuration -->
|
||
<div class="p-5 rounded-2xl border border-slate-100 bg-slate-50/50 mb-6">
|
||
<form action="{{ route('intern.save-github') }}" method="POST" class="space-y-4">
|
||
@csrf
|
||
<div>
|
||
<label for="github_repo" class="block text-xs font-extrabold text-slate-500 uppercase tracking-wider mb-2">GitHub Public Depo URL'si</label>
|
||
<div class="flex flex-col sm:flex-row gap-3">
|
||
<input type="url" name="github_repo" id="github_repo" placeholder="https://github.com/kullaniciadi/depo-adi" value="{{ $intern->github_repo }}" required 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" />
|
||
<button type="submit" class="px-5 py-3 bg-blue-600 hover:bg-blue-700 text-white font-bold rounded-xl text-sm transition-all shadow-md shadow-blue-500/10 flex-shrink-0">
|
||
{{ $intern->github_repo ? 'Güncelle' : 'Kaydet' }}
|
||
</button>
|
||
</div>
|
||
<span class="block text-xs text-slate-400 mt-2"><i class="uil uil-info-circle text-blue-600"></i> Deponuzun <strong>public (herkese açık)</strong> olması gerekmektedir.</span>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
|
||
@if(empty($intern->internship_start_date) || empty($intern->internship_total_days))
|
||
<div class="p-6 rounded-2xl border border-amber-100 bg-amber-50 text-amber-800 text-sm font-medium text-center">
|
||
Staj başlangıç tarihi veya staj gün sayısı girilmemiş. Lütfen staj evraklarınızı yükleyip başlangıç tarihlerinizi tanımlayın.
|
||
</div>
|
||
@else
|
||
<!-- Main Workspace Grid -->
|
||
<div class="grid grid-cols-1 lg:grid-cols-12 gap-6">
|
||
|
||
<!-- Left: Days List Navigation -->
|
||
<div class="lg:col-span-4 space-y-2 max-h-[500px] overflow-y-auto pr-2 no-scrollbar">
|
||
@foreach($days as $idx => $d)
|
||
@php
|
||
$dayNum = $d['day_number'];
|
||
$dayDate = $d['date'];
|
||
$dayDateFormatted = $d['formatted_date'];
|
||
$hasSaved = isset($savedEntries[$dayNum]) && trim($savedEntries[$dayNum]->content) !== '';
|
||
$isApproved = isset($savedEntries[$dayNum]) && $savedEntries[$dayNum]->supervisor_approved;
|
||
@endphp
|
||
<button type="button"
|
||
onclick="selectNotebookDay({{ $idx }})"
|
||
id="btn-day-{{ $idx }}"
|
||
data-day-num="{{ $dayNum }}"
|
||
data-date="{{ $dayDate }}"
|
||
data-formatted-date="{{ $dayDateFormatted }}"
|
||
data-saved-content="{{ $savedEntries[$dayNum]->content ?? '' }}"
|
||
data-approved="{{ $isApproved ? '1' : '0' }}"
|
||
class="notebook-day-btn w-full flex items-center justify-between p-3 rounded-2xl border text-left transition-all @if($idx === 0) border-blue-200 bg-blue-50/50 @else border-slate-100 bg-white hover:bg-slate-50 @endif">
|
||
<div>
|
||
<span class="block text-xs font-extrabold @if($idx === 0) text-blue-700 @else text-slate-800 @endif">{{ $dayNum }}. Gün</span>
|
||
<span class="block text-[10px] text-slate-400 mt-0.5">{{ $dayDateFormatted }}</span>
|
||
</div>
|
||
<span id="badge-day-{{ $idx }}" class="inline-flex px-2 py-0.5 rounded-lg text-[9px] font-extrabold uppercase
|
||
@if($isApproved) bg-green-500 text-white border border-green-600
|
||
@elseif($hasSaved) bg-amber-50 text-amber-700 border border-amber-200
|
||
@else bg-slate-50 text-slate-400 border border-slate-200 @endif">
|
||
@if($isApproved) ONAYLANDI
|
||
@elseif($hasSaved) DOLU
|
||
@else BOŞ @endif
|
||
</span>
|
||
</button>
|
||
@endforeach
|
||
</div>
|
||
|
||
<!-- Right: Workspace Editor -->
|
||
<div class="lg:col-span-8 space-y-4">
|
||
<div class="bg-white border border-slate-100 rounded-2xl p-5 shadow-sm">
|
||
<div class="flex items-center justify-between pb-3 border-b border-slate-100 mb-4">
|
||
<div class="flex items-center">
|
||
<span id="editor-day-title" class="text-sm font-extrabold text-blue-600 bg-blue-50 px-3 py-1 rounded-full">1. Gün</span>
|
||
<span id="editor-day-date" class="text-xs font-semibold text-slate-400 ml-2"></span>
|
||
<span id="editor-day-status" class="ml-2"></span>
|
||
</div>
|
||
|
||
<div class="flex items-center gap-2">
|
||
@if($intern->github_repo)
|
||
<button type="button" onclick="fillFromGithub()" class="px-3 py-1.5 bg-slate-800 hover:bg-slate-900 text-white font-extrabold rounded-lg text-[10px] transition-all flex items-center gap-1.5 shadow-sm">
|
||
<i class="uil uil-github text-xs"></i>
|
||
<span>Git Commitlerini Çek</span>
|
||
</button>
|
||
@endif
|
||
|
||
<button type="button" onclick="printActiveDay()" class="px-3 py-1.5 bg-green-600 hover:bg-green-700 text-white font-extrabold rounded-lg text-[10px] transition-all flex items-center gap-1.5 shadow-sm">
|
||
<i class="uil uil-print text-xs"></i>
|
||
<span>Yazdır</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="space-y-4">
|
||
<div id="future-warning" class="hidden p-4 bg-amber-50/50 border border-amber-200 rounded-2xl text-xs text-amber-700 font-semibold leading-relaxed">
|
||
<i class="uil uil-exclamation-triangle text-sm mr-1"></i> Bu staj günü henüz gerçekleşmediği için staj günlüğü yazılamaz veya düzenlenemez.
|
||
</div>
|
||
|
||
<div id="editor-wrapper">
|
||
<label class="block text-xs font-extrabold text-slate-500 uppercase tracking-wider mb-2">Günlük Çalışma Raporu</label>
|
||
<div id="quill-editor-container" class="rounded-xl border border-slate-200 overflow-hidden">
|
||
<div id="editor-content-quill" style="height: 250px;"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="git-commits-fallback-container" class="hidden p-4 bg-slate-50 border border-slate-200/60 rounded-2xl text-xs space-y-3">
|
||
<div class="flex justify-between items-center pb-2 border-b border-slate-200">
|
||
<span class="font-extrabold text-slate-700 flex items-center gap-1.5">
|
||
<i class="uil uil-info-circle text-blue-600 text-sm"></i>
|
||
<span>Seçilen güne ait otomatik commit bulunamadı. Son 10 commit'iniz:</span>
|
||
</span>
|
||
<button type="button" onclick="hideFallbackCommits()" class="text-slate-400 hover:text-slate-600 font-extrabold">Kapat</button>
|
||
</div>
|
||
<div id="git-commits-fallback-list" class="space-y-2 max-h-[150px] overflow-y-auto pr-1 no-scrollbar">
|
||
<!-- items dynamically populated -->
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex justify-between items-center">
|
||
<div id="save-status" class="text-xs font-semibold text-slate-400"></div>
|
||
<button type="button" id="save-btn" onclick="saveActiveDay()" class="px-5 py-2.5 bg-blue-600 hover:bg-blue-700 text-white font-bold rounded-xl text-xs transition-all shadow-md shadow-blue-500/10">
|
||
Deftere Kaydet
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
@endif
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Print Choice Modal -->
|
||
<div id="print-modal" class="fixed inset-0 bg-slate-900/60 backdrop-blur-sm z-50 hidden flex items-center justify-center p-4">
|
||
<div class="bg-white rounded-3xl p-6 max-w-md w-full shadow-2xl border border-slate-100/50 transform scale-95 opacity-0 transition-all duration-300" id="print-modal-card">
|
||
<div class="flex justify-between items-start mb-6">
|
||
<div>
|
||
<h3 class="text-lg font-bold text-slate-800">Staj Defteri Yazdır / İndir</h3>
|
||
<p class="text-xs text-slate-400 mt-1">Lütfen yazdırmak istediğiniz staj defterinin sayfa boyutunu seçin.</p>
|
||
</div>
|
||
<button onclick="closePrintModal()" class="text-slate-400 hover:text-slate-600">
|
||
<i class="uil uil-multiply text-xl"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="grid grid-cols-2 gap-4 mb-6">
|
||
<a href="{{ route('intern.print-journal') }}?size=a4" target="_blank" onclick="closePrintModal()" class="flex flex-col items-center justify-center p-5 rounded-2xl border border-slate-100 bg-slate-50/50 hover:border-blue-300 hover:bg-blue-50/20 transition-all group text-center">
|
||
<div class="w-12 h-12 rounded-xl bg-blue-50 text-blue-600 flex items-center justify-center text-2xl mb-3 group-hover:bg-blue-600 group-hover:text-white transition-all">
|
||
<i class="uil uil-file-alt"></i>
|
||
</div>
|
||
<span class="block text-sm font-extrabold text-slate-800">A4 Boyutu</span>
|
||
<span class="block text-[10px] text-slate-400 mt-0.5">Dikey (210 x 297 mm)</span>
|
||
</a>
|
||
|
||
<a href="{{ route('intern.print-journal') }}?size=a5" target="_blank" onclick="closePrintModal()" class="flex flex-col items-center justify-center p-5 rounded-2xl border border-slate-100 bg-slate-50/50 hover:border-blue-300 hover:bg-blue-50/20 transition-all group text-center">
|
||
<div class="w-12 h-12 rounded-xl bg-blue-50 text-blue-600 flex items-center justify-center text-2xl mb-3 group-hover:bg-blue-600 group-hover:text-white transition-all">
|
||
<i class="uil uil-file"></i>
|
||
</div>
|
||
<span class="block text-sm font-extrabold text-slate-800">A5 Boyutu</span>
|
||
<span class="block text-[10px] text-slate-400 mt-0.5">Dikey (148 x 210 mm)</span>
|
||
</a>
|
||
</div>
|
||
|
||
<div class="p-4 bg-blue-50 border border-blue-100 rounded-2xl text-xs text-blue-700 font-semibold leading-relaxed">
|
||
<i class="uil uil-info-circle text-sm mr-1"></i> Açılan önizleme sayfasında <strong>CTRL + P</strong> tuşlarına basarak "Hedef: PDF Olarak Kaydet" seçeneği ile staj defterinizi bilgisayarınıza indirebilirsiniz.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
@push('styles')
|
||
<link href="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css" rel="stylesheet" />
|
||
<script src="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js"></script>
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<script>
|
||
|
||
|
||
let quill;
|
||
|
||
// Tab Switch Logic
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
// Initialize Quill editor
|
||
quill = new Quill('#editor-content-quill', {
|
||
theme: 'snow',
|
||
modules: {
|
||
toolbar: [
|
||
['bold', 'italic', 'underline', 'strike'], // toggled buttons
|
||
[{ 'list': 'ordered'}, { 'list': 'bullet' }],
|
||
['clean'] // remove formatting button
|
||
]
|
||
}
|
||
});
|
||
|
||
const tabButtons = document.querySelectorAll('.tab-btn');
|
||
const tabPanels = document.querySelectorAll('.tab-panel');
|
||
|
||
tabButtons.forEach(button => {
|
||
button.addEventListener('click', () => {
|
||
// Deactivate active tab
|
||
tabButtons.forEach(btn => {
|
||
btn.classList.remove('active', 'bg-blue-50', 'border-blue-100', 'text-blue-900');
|
||
btn.classList.add('bg-transparent', 'border-transparent', 'text-slate-600');
|
||
btn.querySelector('.tab-icon').classList.remove('bg-blue-600', 'text-white');
|
||
btn.querySelector('.tab-icon').classList.add('bg-slate-50', 'text-slate-500');
|
||
btn.setAttribute('aria-selected', 'false');
|
||
});
|
||
|
||
// Hide active panels
|
||
tabPanels.forEach(panel => {
|
||
panel.classList.add('hidden');
|
||
});
|
||
|
||
// Activate clicked tab
|
||
button.classList.add('active', 'bg-blue-50', 'border-blue-100', 'text-blue-900');
|
||
button.classList.remove('bg-transparent', 'border-transparent', 'text-slate-600');
|
||
button.querySelector('.tab-icon').classList.add('bg-blue-600', 'text-white');
|
||
button.querySelector('.tab-icon').classList.remove('bg-slate-50', 'text-slate-500');
|
||
button.setAttribute('aria-selected', 'true');
|
||
|
||
// Show targets panel
|
||
const targetId = button.getAttribute('data-tab-target');
|
||
const targetPanel = document.getElementById(targetId + '-panel');
|
||
if (targetPanel) {
|
||
targetPanel.classList.remove('hidden');
|
||
}
|
||
});
|
||
});
|
||
|
||
// Handle initial state of date logic
|
||
calculateEndDateFrontend();
|
||
|
||
// Select first day of the notebook workspace on load
|
||
selectNotebookDay(0);
|
||
});
|
||
|
||
const githubRepoUrl = @json($intern->github_repo);
|
||
let activeDayIdx = 0;
|
||
|
||
function hideFallbackCommits() {
|
||
const container = document.getElementById('git-commits-fallback-container');
|
||
if (container) {
|
||
container.classList.add('hidden');
|
||
}
|
||
}
|
||
|
||
function formatDateToIstanbul(d) {
|
||
try {
|
||
const formatter = new Intl.DateTimeFormat('en-US', {
|
||
timeZone: 'Europe/Istanbul',
|
||
year: 'numeric',
|
||
month: '2-digit',
|
||
day: '2-digit'
|
||
});
|
||
const parts = formatter.formatToParts(d);
|
||
const year = parts.find(p => p.type === 'year').value;
|
||
const month = parts.find(p => p.type === 'month').value;
|
||
const day = parts.find(p => p.type === 'day').value;
|
||
return `${year}-${month}-${day}`;
|
||
} catch (e) {
|
||
return d.toISOString().split('T')[0];
|
||
}
|
||
}
|
||
|
||
function updateEditorStatusBadge(isApproved, hasSaved) {
|
||
const statusSpan = document.getElementById('editor-day-status');
|
||
if (!statusSpan) return;
|
||
|
||
if (isApproved) {
|
||
statusSpan.textContent = 'ONAYLANDI';
|
||
statusSpan.className = 'inline-flex px-2 py-0.5 rounded-full text-[10px] font-extrabold uppercase bg-green-500 text-white border border-green-600 ml-2';
|
||
} else if (hasSaved) {
|
||
statusSpan.textContent = 'ONAY BEKLİYOR';
|
||
statusSpan.className = 'inline-flex px-2 py-0.5 rounded-full text-[10px] font-extrabold uppercase bg-amber-50 text-amber-700 border border-amber-200 ml-2';
|
||
} else {
|
||
statusSpan.textContent = '';
|
||
statusSpan.className = 'hidden';
|
||
}
|
||
}
|
||
|
||
function printActiveDay() {
|
||
const btn = document.getElementById(`btn-day-${activeDayIdx}`);
|
||
if (!btn) return;
|
||
const dayNum = btn.getAttribute('data-day-num');
|
||
window.open(`{{ route('intern.print-journal') }}?size=a4&day=${dayNum}`, '_blank');
|
||
}
|
||
|
||
function appendCommitToQuill(sha, time, msg) {
|
||
const escapedMsg = msg.replace(/</g, "<").replace(/>/g, ">");
|
||
const commitHtml = `<li><strong>[${time}]</strong> (<em>${sha}</em>) ${escapedMsg}</li>`;
|
||
|
||
const currentHtml = quill.root.innerHTML.trim();
|
||
const hasHeader = currentHtml.includes("Git Commit Mesajları:");
|
||
const headerHtml = hasHeader ? "" : "<p><strong>Git Commit Mesajları:</strong></p>";
|
||
|
||
let newHtml = "";
|
||
if (currentHtml !== "" && currentHtml !== "<p><br></p>") {
|
||
newHtml = currentHtml + "<br><br>" + headerHtml + "<ul>" + commitHtml + "</ul>";
|
||
} else {
|
||
newHtml = headerHtml + "<ul>" + commitHtml + "</ul>";
|
||
}
|
||
|
||
quill.setContents([]);
|
||
quill.clipboard.dangerouslyPasteHTML(newHtml);
|
||
}
|
||
|
||
function selectNotebookDay(idx) {
|
||
const oldBtn = document.getElementById(`btn-day-${activeDayIdx}`);
|
||
if (oldBtn) {
|
||
oldBtn.classList.remove('border-blue-200', 'bg-blue-50/50');
|
||
oldBtn.classList.add('border-slate-100', 'bg-white');
|
||
const oldTitle = oldBtn.querySelector('span.text-xs');
|
||
if (oldTitle) {
|
||
oldTitle.classList.remove('text-blue-700');
|
||
oldTitle.classList.add('text-slate-800');
|
||
}
|
||
}
|
||
|
||
activeDayIdx = idx;
|
||
const newBtn = document.getElementById(`btn-day-${idx}`);
|
||
if (newBtn) {
|
||
newBtn.classList.add('border-blue-200', 'bg-blue-50/50');
|
||
newBtn.classList.remove('border-slate-100', 'bg-white');
|
||
const newTitle = newBtn.querySelector('span.text-xs');
|
||
if (newTitle) {
|
||
newTitle.classList.add('text-blue-700');
|
||
newTitle.classList.remove('text-slate-800');
|
||
}
|
||
|
||
const dayNum = newBtn.getAttribute('data-day-num');
|
||
const dateVal = newBtn.getAttribute('data-date');
|
||
const dateFormatted = newBtn.getAttribute('data-formatted-date');
|
||
const savedContent = newBtn.getAttribute('data-saved-content');
|
||
const isApproved = newBtn.getAttribute('data-approved') === '1';
|
||
|
||
document.getElementById('editor-day-title').textContent = `${dayNum}. Gün`;
|
||
document.getElementById('editor-day-date').textContent = dateFormatted;
|
||
|
||
quill.setContents([]);
|
||
if (savedContent) {
|
||
quill.clipboard.dangerouslyPasteHTML(savedContent);
|
||
}
|
||
document.getElementById('save-status').textContent = '';
|
||
hideFallbackCommits();
|
||
|
||
const hasSaved = savedContent && savedContent.trim() !== '' && savedContent !== '<p><br></p>';
|
||
updateEditorStatusBadge(isApproved, hasSaved);
|
||
|
||
// Future validation
|
||
const dateParts = dateVal.split('-');
|
||
const selectedDate = new Date(dateParts[0], dateParts[1] - 1, dateParts[2]);
|
||
const today = new Date();
|
||
today.setHours(0,0,0,0);
|
||
|
||
const isFuture = selectedDate > today;
|
||
const warningBlock = document.getElementById('future-warning');
|
||
const saveBtn = document.getElementById('save-btn');
|
||
const gitBtn = document.querySelector('button[onclick="fillFromGithub()"]');
|
||
|
||
if (isFuture) {
|
||
warningBlock.classList.remove('hidden');
|
||
quill.enable(false);
|
||
saveBtn.disabled = true;
|
||
saveBtn.classList.add('opacity-50', 'cursor-not-allowed');
|
||
if (gitBtn) {
|
||
gitBtn.disabled = true;
|
||
gitBtn.classList.add('opacity-50', 'cursor-not-allowed');
|
||
}
|
||
} else {
|
||
warningBlock.classList.add('hidden');
|
||
quill.enable(true);
|
||
saveBtn.disabled = false;
|
||
saveBtn.classList.remove('opacity-50', 'cursor-not-allowed');
|
||
if (gitBtn) {
|
||
gitBtn.disabled = false;
|
||
gitBtn.classList.remove('opacity-50', 'cursor-not-allowed');
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
function fillFromGithub() {
|
||
const btn = document.getElementById(`btn-day-${activeDayIdx}`);
|
||
if (!btn) return;
|
||
|
||
const dateVal = btn.getAttribute('data-date');
|
||
const formattedDate = btn.getAttribute('data-formatted-date');
|
||
|
||
if (!githubRepoUrl) {
|
||
alert("Lütfen önce GitHub depo URL'nizi kaydedin.");
|
||
return;
|
||
}
|
||
|
||
let repoClean = githubRepoUrl.replace(/https?:\/\/(www\.)?github\.com\//i, '');
|
||
repoClean = repoClean.replace(/\/$/, '');
|
||
const parts = repoClean.split('/');
|
||
if (parts.length < 2) {
|
||
alert("Geçersiz GitHub URL'si.");
|
||
return;
|
||
}
|
||
|
||
const owner = parts[0];
|
||
const repo = parts[1].replace(/\.git$/i, '');
|
||
let branch = '';
|
||
|
||
// Parse branch if /tree/{branch} or /commits/{branch} is used
|
||
if (parts.length >= 4 && (parts[2] === 'tree' || parts[2] === 'commits')) {
|
||
branch = parts.slice(3).join('/');
|
||
}
|
||
|
||
const gitBtn = document.querySelector('button[onclick="fillFromGithub()"]');
|
||
const originalContent = gitBtn.innerHTML;
|
||
gitBtn.disabled = true;
|
||
gitBtn.innerHTML = `<i class="uil uil-spinner text-xs animate-spin"></i> <span>Çekiliyor...</span>`;
|
||
|
||
hideFallbackCommits();
|
||
|
||
fetch(`https://api.github.com/repos/${owner}/${repo}/commits?per_page=100${branch ? `&sha=${branch}` : ''}`)
|
||
.then(response => {
|
||
if (!response.ok) {
|
||
if (response.status === 404) {
|
||
throw new Error("Depo bulunamadı veya herkese açık (public) değil.");
|
||
} else if (response.status === 403) {
|
||
throw new Error("GitHub API istek limitine ulaşıldı. Lütfen daha sonra tekrar deneyin.");
|
||
} else {
|
||
throw new Error(`GitHub API Hatası (Kod: ${response.status})`);
|
||
}
|
||
}
|
||
return response.json();
|
||
})
|
||
.then(commits => {
|
||
if (!Array.isArray(commits)) {
|
||
throw new Error("Geçersiz API yanıtı.");
|
||
}
|
||
|
||
// Filter commits by the selected date
|
||
const dayCommits = commits.filter(item => {
|
||
const dateStr = item.commit.author.date;
|
||
if (!dateStr) return false;
|
||
const d = new Date(dateStr);
|
||
const dateOnly = formatDateToIstanbul(d);
|
||
return dateOnly === dateVal;
|
||
});
|
||
|
||
if (dayCommits.length === 0) {
|
||
// No commits found for this date. Show fallback list of latest 10 commits.
|
||
const fallbackContainer = document.getElementById('git-commits-fallback-container');
|
||
const fallbackList = document.getElementById('git-commits-fallback-list');
|
||
|
||
if (fallbackContainer && fallbackList) {
|
||
fallbackList.innerHTML = '';
|
||
|
||
const latestCommits = commits.slice(0, 10);
|
||
if (latestCommits.length === 0) {
|
||
fallbackList.innerHTML = `<p class="text-slate-400 italic">Depoda hiç commit bulunamadı.</p>`;
|
||
} else {
|
||
latestCommits.forEach(c => {
|
||
const msg = c.commit.message;
|
||
const sha = c.sha.substring(0, 7);
|
||
const authorDate = new Date(c.commit.author.date);
|
||
const time = authorDate.toLocaleTimeString('tr-TR', { timeZone: 'Europe/Istanbul', hour: '2-digit', minute: '2-digit' });
|
||
const commitDateOnly = formatDateToIstanbul(authorDate);
|
||
// format date to d.m.Y
|
||
const [cy, cm, cd] = commitDateOnly.split('-');
|
||
const formattedCommitDate = `${cd}.${cm}.${cy}`;
|
||
|
||
const row = document.createElement('div');
|
||
row.className = "flex items-center justify-between gap-3 p-2 hover:bg-slate-100 rounded-lg border border-slate-100 transition-colors";
|
||
|
||
const infoDiv = document.createElement('div');
|
||
infoDiv.className = "flex-grow min-w-0";
|
||
|
||
const timeSpan = document.createElement('span');
|
||
timeSpan.className = "font-bold text-slate-700 select-all";
|
||
timeSpan.textContent = `[${formattedCommitDate} ${time}] `;
|
||
|
||
const shaSpan = document.createElement('span');
|
||
shaSpan.className = "text-slate-500 font-semibold select-all";
|
||
shaSpan.textContent = `(${sha}) `;
|
||
|
||
const msgSpan = document.createElement('span');
|
||
msgSpan.className = "text-slate-600 truncate block sm:inline-block max-w-full font-medium ml-1";
|
||
msgSpan.textContent = msg;
|
||
|
||
infoDiv.appendChild(timeSpan);
|
||
infoDiv.appendChild(shaSpan);
|
||
infoDiv.appendChild(msgSpan);
|
||
|
||
const addBtn = document.createElement('button');
|
||
addBtn.type = 'button';
|
||
addBtn.className = "px-2 py-1 bg-blue-50 text-blue-600 hover:bg-blue-600 hover:text-white font-extrabold rounded transition-all flex-shrink-0 text-[10px]";
|
||
addBtn.textContent = "Ekle";
|
||
addBtn.addEventListener('click', () => {
|
||
appendCommitToQuill(sha, `${formattedCommitDate} ${time}`, msg);
|
||
});
|
||
|
||
row.appendChild(infoDiv);
|
||
row.appendChild(addBtn);
|
||
fallbackList.appendChild(row);
|
||
});
|
||
}
|
||
fallbackContainer.classList.remove('hidden');
|
||
alert(`Bu staj gününe (${formattedDate}) ait otomatik GitHub commit'i bulunamadı. Son 10 commit'iniz aşağıda listelenmiştir, rapora eklemek istediklerinizi seçebilirsiniz.`);
|
||
} else {
|
||
alert(`Bu staj gününe (${formattedDate}) ait GitHub commit'i bulunamadı. Lütfen commit attığınızdan ve tarihin doğru olduğundan emin olun.`);
|
||
}
|
||
return;
|
||
}
|
||
|
||
let commitHtml = "<ul>";
|
||
const sorted = [...dayCommits].reverse();
|
||
sorted.forEach(c => {
|
||
const msg = c.commit.message;
|
||
const sha = c.sha.substring(0, 7);
|
||
const authorDate = new Date(c.commit.author.date);
|
||
const time = authorDate.toLocaleTimeString('tr-TR', { timeZone: 'Europe/Istanbul', hour: '2-digit', minute: '2-digit' });
|
||
commitHtml += `<li><strong>[${time}]</strong> (<em>${sha}</em>) ${msg}</li>`;
|
||
});
|
||
commitHtml += "</ul>";
|
||
|
||
const currentHtml = quill.root.innerHTML.trim();
|
||
const headerHtml = "<p><strong>Git Commit Mesajları:</strong></p>";
|
||
|
||
let newHtml = "";
|
||
if (currentHtml !== "" && currentHtml !== "<p><br></p>") {
|
||
newHtml = currentHtml + "<br><br>" + headerHtml + commitHtml;
|
||
} else {
|
||
newHtml = headerHtml + commitHtml;
|
||
}
|
||
|
||
quill.setContents([]);
|
||
quill.clipboard.dangerouslyPasteHTML(newHtml);
|
||
})
|
||
.catch(err => {
|
||
alert("Commitler çekilirken hata oluştu: " + err.message);
|
||
})
|
||
.finally(() => {
|
||
gitBtn.disabled = false;
|
||
gitBtn.innerHTML = originalContent;
|
||
});
|
||
}
|
||
|
||
function saveActiveDay() {
|
||
const btn = document.getElementById(`btn-day-${activeDayIdx}`);
|
||
if (!btn) return;
|
||
|
||
const dayNum = btn.getAttribute('data-day-num');
|
||
const dateVal = btn.getAttribute('data-date');
|
||
let contentVal = quill.root.innerHTML;
|
||
if (contentVal === '<p><br></p>') {
|
||
contentVal = '';
|
||
}
|
||
const statusText = document.getElementById('save-status');
|
||
|
||
statusText.textContent = "Kaydediliyor...";
|
||
statusText.className = "text-xs font-semibold text-slate-400 animate-pulse";
|
||
|
||
fetch("{{ route('intern.save-journal') }}", {
|
||
method: "POST",
|
||
headers: {
|
||
"Content-Type": "application/json",
|
||
"X-CSRF-TOKEN": "{{ csrf_token() }}"
|
||
},
|
||
body: JSON.stringify({
|
||
day_number: dayNum,
|
||
date: dateVal,
|
||
content: contentVal
|
||
})
|
||
})
|
||
.then(response => response.json())
|
||
.then(data => {
|
||
if (data.success) {
|
||
statusText.textContent = "Başarıyla kaydedildi.";
|
||
statusText.className = "text-xs font-semibold text-green-600";
|
||
|
||
btn.setAttribute('data-saved-content', contentVal);
|
||
btn.setAttribute('data-approved', '0');
|
||
|
||
const badge = document.getElementById(`badge-day-${activeDayIdx}`);
|
||
const hasContent = contentVal.trim() !== '' && contentVal !== '<p><br></p>';
|
||
if (badge) {
|
||
if (hasContent) {
|
||
badge.textContent = 'DOLU';
|
||
badge.className = "inline-flex px-2 py-0.5 rounded-lg text-[9px] font-extrabold uppercase bg-amber-50 text-amber-700 border border-amber-200";
|
||
} else {
|
||
badge.textContent = 'BOŞ';
|
||
badge.className = "inline-flex px-2 py-0.5 rounded-lg text-[9px] font-extrabold uppercase bg-slate-50 text-slate-400 border border-slate-200";
|
||
}
|
||
}
|
||
|
||
updateEditorStatusBadge(false, hasContent);
|
||
} else {
|
||
statusText.textContent = data.message || "Kaydedilemedi.";
|
||
statusText.className = "text-xs font-semibold text-red-600";
|
||
}
|
||
})
|
||
.catch(err => {
|
||
console.error(err);
|
||
statusText.textContent = "Bağlantı hatası oluştu.";
|
||
statusText.className = "text-xs font-semibold text-red-600";
|
||
});
|
||
}
|
||
|
||
function openPrintModal() {
|
||
const modal = document.getElementById('print-modal');
|
||
const card = document.getElementById('print-modal-card');
|
||
modal.classList.remove('hidden');
|
||
setTimeout(() => {
|
||
card.classList.remove('scale-95', 'opacity-0');
|
||
card.classList.add('scale-100', 'opacity-100');
|
||
}, 10);
|
||
}
|
||
|
||
function closePrintModal() {
|
||
const modal = document.getElementById('print-modal');
|
||
const card = document.getElementById('print-modal-card');
|
||
card.classList.remove('scale-100', 'opacity-100');
|
||
card.classList.add('scale-95', 'opacity-0');
|
||
setTimeout(() => {
|
||
modal.classList.add('hidden');
|
||
}, 300);
|
||
}
|
||
|
||
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}`;
|
||
}
|
||
|
||
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;
|
||
}
|
||
.tab-btn {
|
||
transition: all 0.2s ease-in-out;
|
||
}
|
||
.tab-btn:hover:not(.active) {
|
||
background-color: #f8fafc;
|
||
}
|
||
.tab-btn.active {
|
||
background-color: #eff6ff;
|
||
border-color: #dbeafe;
|
||
color: #1e40af !important;
|
||
}
|
||
.tab-btn.active span.text-slate-800 {
|
||
color: #1e40af !important;
|
||
}
|
||
.no-scrollbar::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
.no-scrollbar {
|
||
-ms-overflow-style: none;
|
||
scrollbar-width: none;
|
||
}
|
||
</style>
|
||
@endpush
|
||
|
||
@include('front.career.partials.guide_modal')
|
||
@endsection
|