246 lines
7.4 KiB
PHP
246 lines
7.4 KiB
PHP
@extends('guru.layouts.app')
|
|
|
|
@section('title', 'History Tugas')
|
|
|
|
@push('styles')
|
|
<style>
|
|
.page-title {
|
|
font-size: 28px;
|
|
font-weight: 800;
|
|
margin-bottom: 6px;
|
|
margin-top: -20px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.back-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
color: #2b8ef3;
|
|
font-weight: 600;
|
|
font-size: 14px;
|
|
text-decoration: none;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
.back-link:hover { text-decoration: underline; }
|
|
|
|
.custom-card {
|
|
background: white;
|
|
border-radius: 20px;
|
|
border: 2px solid #e5e5e5;
|
|
padding: 25px;
|
|
}
|
|
|
|
.table-header { background: #a5e6ba; }
|
|
|
|
.mapel-badge {
|
|
display: inline-block;
|
|
background: #e6f0ff;
|
|
color: #1d4ed8;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
padding: 3px 10px;
|
|
border-radius: 99px;
|
|
}
|
|
|
|
.kelas-badge {
|
|
display: inline-block;
|
|
background: #f0fdf4;
|
|
color: #166534;
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
padding: 3px 10px;
|
|
border-radius: 99px;
|
|
}
|
|
|
|
.deadline-badge {
|
|
font-size: 12px;
|
|
font-weight: 600;
|
|
padding: 3px 10px;
|
|
border-radius: 99px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
}
|
|
|
|
.deadline-lewat { background: #fee2e2; color: #ef4444; }
|
|
.deadline-aktif { background: #dcfce7; color: #16a34a; }
|
|
|
|
.submit-count {
|
|
font-size: 13px;
|
|
font-weight: 700;
|
|
color: #f97316;
|
|
}
|
|
|
|
.btn-detail {
|
|
background: #f97316;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 8px;
|
|
padding: 5px 14px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
text-decoration: none;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 5px;
|
|
transition: background 0.2s;
|
|
}
|
|
|
|
.btn-detail:hover { background: #ea6c0a; color: white; }
|
|
|
|
.btn-hapus {
|
|
background: #fee2e2;
|
|
color: #ef4444;
|
|
border: none;
|
|
border-radius: 8px;
|
|
padding: 5px 12px;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
transition: background 0.2s;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 5px;
|
|
}
|
|
|
|
.btn-hapus:hover { background: #fca5a5; }
|
|
|
|
.alert-success-custom {
|
|
background: #dcfce7;
|
|
color: #166534;
|
|
border-radius: 10px;
|
|
padding: 12px 16px;
|
|
margin-bottom: 16px;
|
|
font-weight: 500;
|
|
font-size: 14px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.empty-state {
|
|
text-align: center;
|
|
padding: 50px 20px;
|
|
color: #94a3b8;
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
@section('content')
|
|
|
|
<a href="{{ route('guru.mapel.index') }}" class="back-link">← Kembali ke Mata Pelajaran</a>
|
|
|
|
<h3 class="page-title">
|
|
<img src="{{ asset('images/icon/gurud/history.png') }}" class="icon-inline" alt="Ikon history">
|
|
History Tugas
|
|
</h3>
|
|
<p style="color:#64748b;font-size:14px;margin-bottom:20px">
|
|
Semua tugas yang pernah Anda buat.
|
|
</p>
|
|
|
|
@if(session('success'))
|
|
<div class="alert-success-custom">
|
|
<img src="{{ asset('images/icon/gurud/v.png') }}" class="icon-inline" alt="Berhasil">
|
|
{{ session('success') }}
|
|
</div>
|
|
@endif
|
|
|
|
<div class="custom-card">
|
|
@if($tugasList->isEmpty())
|
|
<div class="empty-state">
|
|
<div style="margin-bottom:12px">
|
|
<img src="{{ asset('images/icon/gurud/mailbox.png') }}" class="icon-lg" alt="Belum ada tugas">
|
|
</div>
|
|
<p>Belum ada tugas yang dibuat.</p>
|
|
</div>
|
|
@else
|
|
<table class="table align-middle">
|
|
<thead class="table-header text-center">
|
|
<tr>
|
|
<th>No</th>
|
|
<th>Judul Tugas</th>
|
|
<th>Mata Pelajaran</th>
|
|
<th>Kelas</th>
|
|
<th>Deadline</th>
|
|
<th>Pengumpulan</th>
|
|
<th>Aksi</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach($tugasList as $i => $tugas)
|
|
@php
|
|
$isLewat = \Carbon\Carbon::parse($tugas->deadline)->isPast();
|
|
$jumlahKumpul = $tugas->pengumpulanTugas->count();
|
|
@endphp
|
|
<tr>
|
|
<td class="text-center">{{ $tugasList->firstItem() + $i }}</td>
|
|
<td>
|
|
<div style="font-weight:600;color:#1e293b">{{ $tugas->judul_tugas }}</div>
|
|
@if($tugas->keterangan)
|
|
<div style="font-size:12px;color:#94a3b8;margin-top:2px">
|
|
{{ Str::limit($tugas->keterangan, 60) }}
|
|
</div>
|
|
@endif
|
|
</td>
|
|
<td class="text-center">
|
|
<span class="mapel-badge">
|
|
{{ optional(optional($tugas->mengajar)->mapel)->nama_mapel ?? '-' }}
|
|
</span>
|
|
</td>
|
|
<td class="text-center">
|
|
<span class="kelas-badge">
|
|
{{ optional(optional($tugas->mengajar)->kelas)->tingkat }}
|
|
{{ optional(optional($tugas->mengajar)->kelas)->nama_kelas ?? '-' }}
|
|
</span>
|
|
</td>
|
|
<td class="text-center">
|
|
@if($isLewat)
|
|
<span class="deadline-badge deadline-lewat">
|
|
<img src="{{ asset('images/icon/gurud/alarm.png') }}" class="icon-inline" alt="Deadline lewat"> Lewat
|
|
</span>
|
|
@else
|
|
<span class="deadline-badge deadline-aktif">
|
|
<img src="{{ asset('images/icon/gurud/v.png') }}" class="icon-inline" alt="Deadline aktif"> Aktif
|
|
</span>
|
|
@endif
|
|
<div style="font-size:12px;color:#64748b;margin-top:4px">
|
|
{{ \Carbon\Carbon::parse($tugas->deadline)->format('d M Y, H:i') }}
|
|
</div>
|
|
</td>
|
|
<td class="text-center">
|
|
<span class="submit-count">{{ $jumlahKumpul }}</span>
|
|
<span style="font-size:12px;color:#64748b"> pengumpulan</span>
|
|
</td>
|
|
<td class="text-center">
|
|
<div class="d-flex gap-1 justify-content-center">
|
|
<a href="{{ route('guru.tugas.detail', $tugas->id_tugas) }}"
|
|
class="btn-detail">
|
|
<img src="{{ asset('images/icon/gurud/detail.png') }}" class="icon-inline" alt="Detail tugas"> Detail
|
|
</a>
|
|
<form action="{{ route('guru.tugas.destroy', $tugas->id_tugas) }}"
|
|
method="POST"
|
|
onsubmit="return confirm('Yakin hapus tugas ini? Semua pengumpulan juga akan terhapus.')">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit" class="btn-hapus">
|
|
<img src="{{ asset('images/icon/gurud/bin.png') }}" class="icon-inline" alt="Hapus tugas">
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
|
|
<div class="d-flex justify-content-end mt-3">
|
|
{{ $tugasList->links() }}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
@endsection |