history materi tugas - admin
This commit is contained in:
parent
005a42fc38
commit
9f31e74818
|
|
@ -0,0 +1,117 @@
|
|||
<?php
|
||||
|
||||
namespace App\Http\Controllers\Admin;
|
||||
|
||||
use App\Http\Controllers\Controller;
|
||||
use App\Models\Materi;
|
||||
use App\Models\Tugas;
|
||||
use App\Models\Mengajar;
|
||||
use App\Models\Guru;
|
||||
use Illuminate\Http\Request;
|
||||
|
||||
class MateriTugasController extends Controller
|
||||
{
|
||||
// ===================================================
|
||||
// MATERI
|
||||
// ===================================================
|
||||
|
||||
/**
|
||||
* History semua materi dari semua guru
|
||||
*/
|
||||
public function historyMateri(Request $request)
|
||||
{
|
||||
$query = Materi::with(['mengajar.mapel', 'mengajar.kelas', 'mengajar.guru']);
|
||||
|
||||
// Filter by guru
|
||||
if ($request->filled('id_guru')) {
|
||||
$query->whereHas('mengajar', fn($q) => $q->where('id_guru', $request->id_guru));
|
||||
}
|
||||
|
||||
// Filter by mapel
|
||||
if ($request->filled('id_mapel')) {
|
||||
$query->whereHas('mengajar', fn($q) => $q->where('id_mapel', $request->id_mapel));
|
||||
}
|
||||
|
||||
// Search judul
|
||||
if ($request->filled('search')) {
|
||||
$query->where('judul_materi', 'like', '%' . $request->search . '%');
|
||||
}
|
||||
|
||||
$materiList = $query->orderBy('created_at', 'desc')->paginate(15)->appends($request->all());
|
||||
$gurus = Guru::orderBy('nama')->get();
|
||||
|
||||
return view('admin.materi.history', compact('materiList', 'gurus'));
|
||||
}
|
||||
|
||||
/**
|
||||
* Hapus materi (admin)
|
||||
*/
|
||||
public function destroyMateri($id)
|
||||
{
|
||||
$materi = Materi::findOrFail($id);
|
||||
|
||||
if ($materi->lampiran_materi && \Storage::disk('public')->exists($materi->lampiran_materi)) {
|
||||
\Storage::disk('public')->delete($materi->lampiran_materi);
|
||||
}
|
||||
|
||||
$materi->delete();
|
||||
|
||||
return redirect()->route('admin.materi.history')
|
||||
->with('success', 'Materi berhasil dihapus.');
|
||||
}
|
||||
|
||||
// ===================================================
|
||||
// TUGAS
|
||||
// ===================================================
|
||||
|
||||
/**
|
||||
* History semua tugas dari semua guru
|
||||
*/
|
||||
public function historyTugas(Request $request)
|
||||
{
|
||||
$query = Tugas::with(['mengajar.mapel', 'mengajar.kelas', 'mengajar.guru', 'pengumpulanTugas']);
|
||||
|
||||
// Filter by guru
|
||||
if ($request->filled('id_guru')) {
|
||||
$query->whereHas('mengajar', fn($q) => $q->where('id_guru', $request->id_guru));
|
||||
}
|
||||
|
||||
// Search judul
|
||||
if ($request->filled('search')) {
|
||||
$query->where('judul_tugas', 'like', '%' . $request->search . '%');
|
||||
}
|
||||
|
||||
$tugasList = $query->orderBy('created_at', 'desc')->paginate(15)->appends($request->all());
|
||||
$gurus = Guru::orderBy('nama')->get();
|
||||
|
||||
return view('admin.tugas.history', compact('tugasList', 'gurus'));
|
||||
}
|
||||
|
||||
/**
|
||||
* Detail tugas + daftar pengumpulan siswa
|
||||
*/
|
||||
public function detailTugas($id)
|
||||
{
|
||||
$tugas = Tugas::with([
|
||||
'mengajar.mapel',
|
||||
'mengajar.kelas',
|
||||
'mengajar.guru',
|
||||
'pengumpulanTugas.siswa',
|
||||
])
|
||||
->findOrFail($id);
|
||||
|
||||
return view('admin.tugas.detail', compact('tugas'));
|
||||
}
|
||||
|
||||
/**
|
||||
* Hapus tugas (admin)
|
||||
*/
|
||||
public function destroyTugas($id)
|
||||
{
|
||||
$tugas = Tugas::findOrFail($id);
|
||||
$tugas->delete();
|
||||
|
||||
return redirect()->route('admin.tugas.history')
|
||||
->with('success', 'Tugas berhasil dihapus.');
|
||||
}
|
||||
}
|
||||
|
|
@ -5,7 +5,6 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>@yield('title', 'Admin Panel')</title>
|
||||
|
||||
<!-- Fonts & Bootstrap -->
|
||||
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
|
||||
|
|
@ -16,13 +15,8 @@
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
/* WRAPPER */
|
||||
.admin-wrapper {
|
||||
display: flex;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.admin-wrapper { display: flex; min-height: 100vh; }
|
||||
|
||||
/* SIDEBAR */
|
||||
.sidebar {
|
||||
width: 260px;
|
||||
background: #ffffff;
|
||||
|
|
@ -32,19 +26,10 @@
|
|||
flex-direction: column;
|
||||
}
|
||||
|
||||
.sidebar-logo {
|
||||
text-align: center;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.sidebar-logo { text-align: center; margin-bottom: 40px; }
|
||||
.sidebar-logo img { width: 90px; }
|
||||
|
||||
.sidebar-logo img {
|
||||
width: 90px;
|
||||
}
|
||||
|
||||
.sidebar-menu {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.sidebar-menu { display: flex; flex-direction: column; }
|
||||
|
||||
.sidebar-link {
|
||||
display: flex;
|
||||
|
|
@ -59,25 +44,23 @@
|
|||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.sidebar-link:hover {
|
||||
background: #e6f0ff;
|
||||
color: #1d4ed8;
|
||||
.sidebar-link:hover { background: #e6f0ff; color: #1d4ed8; }
|
||||
.sidebar-link.active { background: #e6f0ff; color: #1d4ed8; }
|
||||
|
||||
.sidebar-icon { width: 20px; height: 20px; flex-shrink: 0; }
|
||||
|
||||
.sidebar-section {
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
color: #94a3b8;
|
||||
letter-spacing: 1px;
|
||||
text-transform: uppercase;
|
||||
padding: 4px 18px;
|
||||
margin-bottom: 6px;
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.sidebar-link.active {
|
||||
background: #e6f0ff;
|
||||
color: #1d4ed8;
|
||||
}
|
||||
|
||||
.sidebar-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.sidebar-logout {
|
||||
margin-top: auto;
|
||||
}
|
||||
.sidebar-logout { margin-top: auto; }
|
||||
|
||||
.sidebar-logout button {
|
||||
width: 100%;
|
||||
|
|
@ -89,15 +72,8 @@
|
|||
text-align: left;
|
||||
}
|
||||
|
||||
/* MAIN */
|
||||
.main {
|
||||
flex: 1;
|
||||
background: #f5f9ff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.main { flex: 1; background: #f5f9ff; display: flex; flex-direction: column; }
|
||||
|
||||
/* TOPBAR */
|
||||
.topbar {
|
||||
background: #2b8ef3;
|
||||
margin: 20px;
|
||||
|
|
@ -109,35 +85,19 @@
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.topbar-left {
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
}
|
||||
.topbar-left { font-weight: 600; font-size: 16px; }
|
||||
.topbar-right { display: flex; align-items: center; gap: 16px; }
|
||||
.topbar-icon { width: 24px; height: 24px; cursor: pointer; }
|
||||
|
||||
.topbar-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.topbar-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* CONTENT */
|
||||
.content {
|
||||
padding: 20px 30px;
|
||||
flex: 1;
|
||||
}
|
||||
.content { padding: 20px 30px; flex: 1; }
|
||||
</style>
|
||||
|
||||
@stack('styles')
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="admin-wrapper">
|
||||
|
||||
<!-- SIDEBAR -->
|
||||
<aside class="sidebar">
|
||||
<div class="sidebar-logo">
|
||||
<img src="{{ asset('images/logo/logosmk.png') }}" alt="Logo SMK">
|
||||
|
|
@ -151,8 +111,10 @@ class="sidebar-link {{ request()->routeIs('admin.dashboard') ? 'active' : '' }}"
|
|||
<span>Dashboard</span>
|
||||
</a>
|
||||
|
||||
<div class="sidebar-section">Master Data</div>
|
||||
|
||||
<a href="{{ route('admin.guru.index') }}"
|
||||
class="sidebar-link {{ request()->routeIs('admin.dashboard') ? 'active' : '' }}">
|
||||
class="sidebar-link {{ request()->routeIs('admin.guru.*') ? 'active' : '' }}">
|
||||
<img src="{{ asset('images/icon/sidebar/guru.png') }}" class="sidebar-icon" alt="">
|
||||
<span>Daftar Guru</span>
|
||||
</a>
|
||||
|
|
@ -175,6 +137,22 @@ class="sidebar-link {{ request()->routeIs('admin.mapel.*') ? 'active' : '' }}">
|
|||
<span>Mata Pelajaran</span>
|
||||
</a>
|
||||
|
||||
<div class="sidebar-section">Konten Guru</div>
|
||||
|
||||
<a href="{{ route('admin.materi.history') }}"
|
||||
class="sidebar-link {{ request()->routeIs('admin.materi.*') ? 'active' : '' }}">
|
||||
<img src="{{ asset('images/icon/sidebar/mapel.png') }}" class="sidebar-icon" alt="">
|
||||
<span>History Materi</span>
|
||||
</a>
|
||||
|
||||
<a href="{{ route('admin.tugas.history') }}"
|
||||
class="sidebar-link {{ request()->routeIs('admin.tugas.*') ? 'active' : '' }}">
|
||||
<img src="{{ asset('images/icon/sidebar/guru.png') }}" class="sidebar-icon" alt="">
|
||||
<span>History Tugas</span>
|
||||
</a>
|
||||
|
||||
<div class="sidebar-section">Gamifikasi</div>
|
||||
|
||||
<a href="{{ route('admin.challenge.index') }}"
|
||||
class="sidebar-link {{ request()->routeIs('admin.challenge.*') ? 'active' : '' }}">
|
||||
<img src="{{ asset('images/icon/sidebar/challenge.png') }}" class="sidebar-icon" alt="">
|
||||
|
|
@ -195,29 +173,24 @@ class="sidebar-link {{ request()->routeIs('admin.leaderboard.*') ? 'active' : ''
|
|||
</form>
|
||||
</aside>
|
||||
|
||||
<!-- MAIN -->
|
||||
<div class="main">
|
||||
|
||||
<!-- TOPBAR -->
|
||||
<header class="topbar">
|
||||
<div class="topbar-left">
|
||||
👋 Hai, {{ Auth::guard('admin')->user()->username ?? 'Admin' }}
|
||||
</div>
|
||||
|
||||
<div class="topbar-right">
|
||||
<img src="{{ asset('images/icon/sidebar/notif.png') }}" class="topbar-icon" alt="Notification">
|
||||
<img src="{{ asset('images/icon/sidebar/profil.png') }}" class="topbar-icon" alt="Profile">
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- CONTENT -->
|
||||
<main class="content">
|
||||
@yield('content')
|
||||
</main>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
|
||||
@stack('scripts')
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,257 @@
|
|||
@extends('admin.layouts.app')
|
||||
|
||||
@section('title', 'History Materi')
|
||||
|
||||
@section('content')
|
||||
|
||||
<style>
|
||||
.page-title {
|
||||
font-size: 30px;
|
||||
font-weight: 800;
|
||||
margin-bottom: 10px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.custom-card {
|
||||
background: white;
|
||||
border-radius: 20px;
|
||||
border: 2px solid #e5e5e5;
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.table-header { background: #a5e6ba; }
|
||||
|
||||
.search-box {
|
||||
background: #a5e6ba;
|
||||
border-radius: 30px;
|
||||
padding: 6px 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.search-box input {
|
||||
border: none;
|
||||
outline: none;
|
||||
background: transparent;
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.filter-select {
|
||||
border-radius: 10px;
|
||||
padding: 6px 12px;
|
||||
border: 1px solid #cbd5e1;
|
||||
font-size: 14px;
|
||||
color: #475569;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.guru-badge {
|
||||
display: inline-block;
|
||||
background: #fef9c3;
|
||||
color: #854d0e;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
padding: 3px 10px;
|
||||
border-radius: 99px;
|
||||
}
|
||||
|
||||
.btn-unduh {
|
||||
background: #e6f0ff;
|
||||
color: #2b8ef3;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 5px 12px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.btn-unduh:hover { background: #bfdbfe; color: #1d4ed8; }
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 50px 20px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
</style>
|
||||
|
||||
<h3 class="page-title">HISTORY MATERI</h3>
|
||||
|
||||
@if(session('success'))
|
||||
<div class="alert-success-custom">✅ {{ session('success') }}</div>
|
||||
@endif
|
||||
|
||||
<div class="custom-card">
|
||||
|
||||
{{-- FILTER & SEARCH --}}
|
||||
<form method="GET" action="{{ route('admin.materi.history') }}" class="d-flex flex-wrap gap-2 align-items-center mb-4">
|
||||
<select name="id_guru" class="filter-select" onchange="this.form.submit()">
|
||||
<option value="">👨🏫 Semua Guru</option>
|
||||
@foreach($gurus as $guru)
|
||||
<option value="{{ $guru->id_guru }}" {{ request('id_guru') == $guru->id_guru ? 'selected' : '' }}>
|
||||
{{ $guru->nama }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
|
||||
<div class="search-box">
|
||||
<input type="text" name="search" placeholder="Cari judul materi..."
|
||||
value="{{ request('search') }}">
|
||||
<button style="border:none;background:none" type="submit">
|
||||
<img src="{{ asset('images/icon/main/search.png') }}" width="18">
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@if(request()->hasAny(['id_guru', 'search']))
|
||||
<a href="{{ route('admin.materi.history') }}"
|
||||
style="font-size:13px;color:#64748b;text-decoration:none">✕ Reset</a>
|
||||
@endif
|
||||
|
||||
<span class="ms-auto" style="font-size:13px;color:#64748b">
|
||||
Total: <strong>{{ $materiList->total() }}</strong> materi
|
||||
</span>
|
||||
</form>
|
||||
|
||||
@if($materiList->isEmpty())
|
||||
<div class="empty-state">
|
||||
<div style="font-size:48px;margin-bottom:12px">📭</div>
|
||||
<p>Tidak ada materi ditemukan.</p>
|
||||
</div>
|
||||
@else
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead class="table-header text-center">
|
||||
<tr>
|
||||
<th>No</th>
|
||||
<th>Judul Materi</th>
|
||||
<th>Guru</th>
|
||||
<th>Mata Pelajaran</th>
|
||||
<th>Kelas</th>
|
||||
<th>Tgl Upload</th>
|
||||
<th>File</th>
|
||||
<th>Aksi</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach($materiList as $i => $materi)
|
||||
<tr>
|
||||
<td class="text-center">{{ $materiList->firstItem() + $i }}</td>
|
||||
<td>
|
||||
<div style="font-weight:600;color:#1e293b">{{ $materi->judul_materi }}</div>
|
||||
@if($materi->deskripsi)
|
||||
<div style="font-size:12px;color:#94a3b8;margin-top:2px">
|
||||
{{ Str::limit($materi->deskripsi, 55) }}
|
||||
</div>
|
||||
@endif
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="guru-badge">
|
||||
{{ optional(optional($materi->mengajar)->guru)->nama ?? '-' }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="mapel-badge">
|
||||
{{ optional(optional($materi->mengajar)->mapel)->nama_mapel ?? '-' }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="kelas-badge">
|
||||
{{ optional(optional($materi->mengajar)->kelas)->tingkat }}
|
||||
{{ optional(optional($materi->mengajar)->kelas)->nama_kelas ?? '-' }}
|
||||
</span>
|
||||
</td>
|
||||
<td class="text-center" style="font-size:13px;color:#64748b">
|
||||
{{ \Carbon\Carbon::parse($materi->tanggal_upload ?? $materi->created_at)->format('d M Y') }}
|
||||
<div style="font-size:11px">
|
||||
{{ \Carbon\Carbon::parse($materi->tanggal_upload ?? $materi->created_at)->format('H:i') }}
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
@if($materi->lampiran_materi)
|
||||
@php
|
||||
$ext = strtolower(pathinfo($materi->lampiran_materi, PATHINFO_EXTENSION));
|
||||
$icon = match(true) {
|
||||
in_array($ext, ['pdf']) => '📄',
|
||||
in_array($ext, ['doc','docx']) => '📝',
|
||||
in_array($ext, ['ppt','pptx']) => '📊',
|
||||
in_array($ext, ['jpg','jpeg','png']) => '🖼️',
|
||||
default => '📎',
|
||||
};
|
||||
@endphp
|
||||
<a href="{{ asset('storage/' . $materi->lampiran_materi) }}"
|
||||
target="_blank" class="btn-unduh">
|
||||
{{ $icon }} Unduh
|
||||
</a>
|
||||
@else
|
||||
<span style="font-size:12px;color:#94a3b8">Tidak ada</span>
|
||||
@endif
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<form action="{{ route('admin.materi.destroy', $materi->id_materi) }}"
|
||||
method="POST"
|
||||
onsubmit="return confirm('Yakin hapus materi ini?')">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button type="submit" class="btn-hapus">🗑️ Hapus</button>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-end mt-3">
|
||||
{{ $materiList->links() }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
|
|
@ -0,0 +1,331 @@
|
|||
@extends('admin.layouts.app')
|
||||
|
||||
@section('title', 'Detail Tugas')
|
||||
|
||||
@section('content')
|
||||
|
||||
<style>
|
||||
.page-title {
|
||||
font-size: 26px;
|
||||
font-weight: 800;
|
||||
margin-bottom: 6px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.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; }
|
||||
|
||||
.info-card {
|
||||
background: white;
|
||||
border-radius: 20px;
|
||||
border: 2px solid #e5e5e5;
|
||||
padding: 24px 28px;
|
||||
margin-bottom: 20px;
|
||||
border-left: 5px solid #f97316;
|
||||
}
|
||||
|
||||
.info-title {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
margin: 0 0 12px;
|
||||
}
|
||||
|
||||
.info-meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.meta-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
background: #f1f5f9;
|
||||
color: #475569;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
padding: 5px 12px;
|
||||
border-radius: 99px;
|
||||
}
|
||||
|
||||
.meta-chip.orange { background: #fff7ed; color: #ea580c; }
|
||||
.meta-chip.green { background: #f0fdf4; color: #16a34a; }
|
||||
.meta-chip.red { background: #fef2f2; color: #dc2626; }
|
||||
.meta-chip.yellow { background: #fef9c3; color: #854d0e; }
|
||||
|
||||
.keterangan-box {
|
||||
background: #f8fafc;
|
||||
border-radius: 10px;
|
||||
padding: 14px 16px;
|
||||
font-size: 14px;
|
||||
color: #475569;
|
||||
line-height: 1.7;
|
||||
border: 1px solid #e2e8f0;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.stat-row {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.stat-box {
|
||||
flex: 1;
|
||||
background: white;
|
||||
border-radius: 16px;
|
||||
padding: 18px 20px;
|
||||
text-align: center;
|
||||
border: 2px solid #e5e5e5;
|
||||
}
|
||||
|
||||
.stat-num {
|
||||
font-size: 30px;
|
||||
font-weight: 800;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
font-size: 12px;
|
||||
color: #94a3b8;
|
||||
margin: 4px 0 0;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.custom-card {
|
||||
background: white;
|
||||
border-radius: 20px;
|
||||
border: 2px solid #e5e5e5;
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 17px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.table-header { background: #a5e6ba; }
|
||||
|
||||
.status-badge {
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
padding: 4px 10px;
|
||||
border-radius: 99px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.status-dikumpulkan { background: #dcfce7; color: #16a34a; }
|
||||
.status-terlambat { background: #fff7ed; color: #ea580c; }
|
||||
.status-belum { background: #f1f5f9; color: #64748b; }
|
||||
|
||||
.exp-badge {
|
||||
background: #fef9c3;
|
||||
color: #b45309;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
padding: 3px 10px;
|
||||
border-radius: 99px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.btn-unduh {
|
||||
background: #e6f0ff;
|
||||
color: #2b8ef3;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 5px 12px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.btn-unduh:hover { background: #bfdbfe; color: #1d4ed8; }
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 40px 20px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
/* Search di tabel pengumpulan */
|
||||
.table-search {
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 10px;
|
||||
padding: 7px 14px;
|
||||
font-size: 14px;
|
||||
width: 220px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.table-search:focus { border-color: #2b8ef3; }
|
||||
</style>
|
||||
|
||||
@php
|
||||
$isLewat = \Carbon\Carbon::parse($tugas->deadline)->isPast();
|
||||
$tepat = $tugas->pengumpulanTugas->where('status', 'dikumpulkan')->count();
|
||||
$terlambat = $tugas->pengumpulanTugas->where('status', 'terlambat')->count();
|
||||
$totalKumpul = $tugas->pengumpulanTugas->count();
|
||||
@endphp
|
||||
|
||||
<a href="{{ route('admin.tugas.history') }}" class="back-link">← Kembali ke History Tugas</a>
|
||||
|
||||
{{-- INFO TUGAS --}}
|
||||
<div class="info-card">
|
||||
<h2 class="info-title">{{ $tugas->judul_tugas }}</h2>
|
||||
|
||||
<div class="info-meta">
|
||||
<span class="meta-chip yellow">
|
||||
👨🏫 {{ optional(optional($tugas->mengajar)->guru)->nama ?? '-' }}
|
||||
</span>
|
||||
<span class="meta-chip">
|
||||
📚 {{ optional(optional($tugas->mengajar)->mapel)->nama_mapel ?? '-' }}
|
||||
</span>
|
||||
<span class="meta-chip">
|
||||
🏫 {{ optional(optional($tugas->mengajar)->kelas)->tingkat }}
|
||||
{{ optional(optional($tugas->mengajar)->kelas)->nama_kelas ?? '-' }}
|
||||
</span>
|
||||
<span class="meta-chip {{ $isLewat ? 'red' : 'green' }}">
|
||||
⏰ {{ \Carbon\Carbon::parse($tugas->deadline)->format('d M Y, H:i') }}
|
||||
— {{ $isLewat ? 'Sudah lewat' : 'Masih aktif' }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@if($tugas->keterangan)
|
||||
<div class="keterangan-box">
|
||||
{!! nl2br(e($tugas->keterangan)) !!}
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
{{-- STATISTIK --}}
|
||||
<div class="stat-row">
|
||||
<div class="stat-box">
|
||||
<p class="stat-num" style="color:#22c55e">{{ $tepat }}</p>
|
||||
<p class="stat-label">Tepat Waktu</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p class="stat-num" style="color:#f97316">{{ $terlambat }}</p>
|
||||
<p class="stat-label">Terlambat</p>
|
||||
</div>
|
||||
<div class="stat-box">
|
||||
<p class="stat-num" style="color:#2b8ef3">{{ $totalKumpul }}</p>
|
||||
<p class="stat-label">Total Pengumpulan</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- DAFTAR PENGUMPULAN --}}
|
||||
<div class="custom-card">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<p class="section-title mb-0">📥 Daftar Pengumpulan Siswa</p>
|
||||
<input type="text" class="table-search" id="searchSiswa"
|
||||
placeholder="🔍 Cari nama / NISN..."
|
||||
onkeyup="filterTable()">
|
||||
</div>
|
||||
|
||||
@if($tugas->pengumpulanTugas->isEmpty())
|
||||
<div class="empty-state">
|
||||
<div style="font-size:40px;margin-bottom:10px">📭</div>
|
||||
<p>Belum ada siswa yang mengumpulkan tugas ini.</p>
|
||||
</div>
|
||||
@else
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle" id="tableSiswa">
|
||||
<thead class="table-header text-center">
|
||||
<tr>
|
||||
<th>No</th>
|
||||
<th>Nama Siswa</th>
|
||||
<th>NISN</th>
|
||||
<th>Waktu Submit</th>
|
||||
<th>Status</th>
|
||||
<th>EXP / Poin</th>
|
||||
<th>File Jawaban</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach($tugas->pengumpulanTugas as $i => $kumpul)
|
||||
<tr>
|
||||
<td class="text-center">{{ $i + 1 }}</td>
|
||||
<td style="font-weight:600;color:#1e293b">
|
||||
{{ optional($kumpul->siswa)->nama ?? '-' }}
|
||||
</td>
|
||||
<td class="text-center" style="font-size:13px;color:#64748b;font-family:monospace">
|
||||
{{ optional($kumpul->siswa)->nisn ?? '-' }}
|
||||
</td>
|
||||
<td class="text-center" style="font-size:13px;color:#64748b">
|
||||
{{ \Carbon\Carbon::parse($kumpul->tanggal_submit)->format('d M Y') }}
|
||||
<div style="font-size:11px">
|
||||
{{ \Carbon\Carbon::parse($kumpul->tanggal_submit)->format('H:i') }}
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="status-badge status-{{ $kumpul->status }}">
|
||||
@if($kumpul->status === 'dikumpulkan') ✅ Tepat Waktu
|
||||
@elseif($kumpul->status === 'terlambat') ⏰ Terlambat
|
||||
@else ❌ Belum
|
||||
@endif
|
||||
</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
@if($kumpul->exp > 0)
|
||||
<span class="exp-badge">⭐ {{ $kumpul->exp }} EXP</span>
|
||||
@else
|
||||
<span style="font-size:12px;color:#94a3b8">Belum dinilai</span>
|
||||
@endif
|
||||
</td>
|
||||
<td class="text-center">
|
||||
@if($kumpul->lampiran_tugas)
|
||||
@php
|
||||
$ext = strtolower(pathinfo($kumpul->lampiran_tugas, PATHINFO_EXTENSION));
|
||||
$icon = match(true) {
|
||||
in_array($ext, ['pdf']) => '📄',
|
||||
in_array($ext, ['doc','docx']) => '📝',
|
||||
in_array($ext, ['jpg','jpeg','png']) => '🖼️',
|
||||
default => '📎',
|
||||
};
|
||||
@endphp
|
||||
<a href="{{ asset('storage/' . $kumpul->lampiran_tugas) }}"
|
||||
target="_blank" class="btn-unduh">
|
||||
{{ $icon }} Unduh
|
||||
</a>
|
||||
@else
|
||||
<span style="font-size:12px;color:#94a3b8">-</span>
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function filterTable() {
|
||||
const keyword = document.getElementById('searchSiswa').value.toLowerCase();
|
||||
const rows = document.querySelectorAll('#tableSiswa tbody tr');
|
||||
|
||||
rows.forEach(row => {
|
||||
const nama = row.cells[1]?.textContent.toLowerCase() ?? '';
|
||||
const nisn = row.cells[2]?.textContent.toLowerCase() ?? '';
|
||||
row.style.display = (nama.includes(keyword) || nisn.includes(keyword)) ? '' : 'none';
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
@endsection
|
||||
|
|
@ -0,0 +1,268 @@
|
|||
@extends('admin.layouts.app')
|
||||
|
||||
@section('title', 'History Tugas')
|
||||
|
||||
@section('content')
|
||||
|
||||
<style>
|
||||
.page-title {
|
||||
font-size: 30px;
|
||||
font-weight: 800;
|
||||
margin-bottom: 10px;
|
||||
margin-top: -20px;
|
||||
}
|
||||
|
||||
.custom-card {
|
||||
background: white;
|
||||
border-radius: 20px;
|
||||
border: 2px solid #e5e5e5;
|
||||
padding: 25px;
|
||||
}
|
||||
|
||||
.table-header { background: #a5e6ba; }
|
||||
|
||||
.search-box {
|
||||
background: #a5e6ba;
|
||||
border-radius: 30px;
|
||||
padding: 6px 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.search-box input {
|
||||
border: none;
|
||||
outline: none;
|
||||
background: transparent;
|
||||
width: 160px;
|
||||
}
|
||||
|
||||
.filter-select {
|
||||
border-radius: 10px;
|
||||
padding: 6px 12px;
|
||||
border: 1px solid #cbd5e1;
|
||||
font-size: 14px;
|
||||
color: #475569;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.guru-badge {
|
||||
display: inline-block;
|
||||
background: #fef9c3;
|
||||
color: #854d0e;
|
||||
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-block;
|
||||
}
|
||||
|
||||
.deadline-lewat { background: #fee2e2; color: #ef4444; }
|
||||
.deadline-aktif { background: #dcfce7; color: #16a34a; }
|
||||
|
||||
.submit-count {
|
||||
font-size: 15px;
|
||||
font-weight: 800;
|
||||
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-block;
|
||||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 50px 20px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
</style>
|
||||
|
||||
<h3 class="page-title">HISTORY TUGAS</h3>
|
||||
|
||||
@if(session('success'))
|
||||
<div class="alert-success-custom">✅ {{ session('success') }}</div>
|
||||
@endif
|
||||
|
||||
<div class="custom-card">
|
||||
|
||||
{{-- FILTER & SEARCH --}}
|
||||
<form method="GET" action="{{ route('admin.tugas.history') }}" class="d-flex flex-wrap gap-2 align-items-center mb-4">
|
||||
<select name="id_guru" class="filter-select" onchange="this.form.submit()">
|
||||
<option value="">👨🏫 Semua Guru</option>
|
||||
@foreach($gurus as $guru)
|
||||
<option value="{{ $guru->id_guru }}" {{ request('id_guru') == $guru->id_guru ? 'selected' : '' }}>
|
||||
{{ $guru->nama }}
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
|
||||
<div class="search-box">
|
||||
<input type="text" name="search" placeholder="Cari judul tugas..."
|
||||
value="{{ request('search') }}">
|
||||
<button style="border:none;background:none" type="submit">
|
||||
<img src="{{ asset('images/icon/main/search.png') }}" width="18">
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@if(request()->hasAny(['id_guru', 'search']))
|
||||
<a href="{{ route('admin.tugas.history') }}"
|
||||
style="font-size:13px;color:#64748b;text-decoration:none">✕ Reset</a>
|
||||
@endif
|
||||
|
||||
<span class="ms-auto" style="font-size:13px;color:#64748b">
|
||||
Total: <strong>{{ $tugasList->total() }}</strong> tugas
|
||||
</span>
|
||||
</form>
|
||||
|
||||
@if($tugasList->isEmpty())
|
||||
<div class="empty-state">
|
||||
<div style="font-size:48px;margin-bottom:12px">📭</div>
|
||||
<p>Tidak ada tugas ditemukan.</p>
|
||||
</div>
|
||||
@else
|
||||
<div class="table-responsive">
|
||||
<table class="table align-middle">
|
||||
<thead class="table-header text-center">
|
||||
<tr>
|
||||
<th>No</th>
|
||||
<th>Judul Tugas</th>
|
||||
<th>Guru</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, 55) }}
|
||||
</div>
|
||||
@endif
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<span class="guru-badge">
|
||||
{{ optional(optional($tugas->mengajar)->guru)->nama ?? '-' }}
|
||||
</span>
|
||||
</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">
|
||||
<span class="deadline-badge {{ $isLewat ? 'deadline-lewat' : 'deadline-aktif' }}">
|
||||
{{ $isLewat ? '⏰ Lewat' : '✅ Aktif' }}
|
||||
</span>
|
||||
<div style="font-size:11px;color:#64748b;margin-top:3px">
|
||||
{{ \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"> siswa</span>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="d-flex gap-1 justify-content-center">
|
||||
<a href="{{ route('admin.tugas.detail', $tugas->id_tugas) }}"
|
||||
class="btn-detail">👁️ Detail</a>
|
||||
<form action="{{ route('admin.tugas.destroy', $tugas->id_tugas) }}"
|
||||
method="POST"
|
||||
onsubmit="return confirm('Yakin hapus tugas ini? Semua pengumpulan ikut terhapus.')">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button type="submit" class="btn-hapus">🗑️</button>
|
||||
</form>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-end mt-3">
|
||||
{{ $tugasList->links() }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
</div>
|
||||
|
||||
@endsection
|
||||
|
|
@ -13,6 +13,7 @@
|
|||
use App\Http\Controllers\Admin\MapelController as AdminMapelController;
|
||||
use App\Http\Controllers\Admin\ChallengeController as AdminChallengeController;
|
||||
use App\Http\Controllers\Admin\LeaderboardController as AdminLeaderboardController;
|
||||
use App\Http\Controllers\Admin\MateriTugasController as AdminMateriTugasController;
|
||||
|
||||
|
||||
// GURU CONTROLLERS
|
||||
|
|
@ -94,6 +95,16 @@
|
|||
// CRUD AREA
|
||||
Route::get('/guru/kelas-by-mapel', [AdminGuruController::class, 'getKelasByMapel'])
|
||||
->name('guru.kelasByMapel');
|
||||
|
||||
// History Materi
|
||||
Route::get('/materi/history', [AdminMateriTugasController::class, 'historyMateri'])->name('materi.history');
|
||||
Route::delete('/materi/{id}', [AdminMateriTugasController::class, 'destroyMateri'])->name('materi.destroy');
|
||||
|
||||
// History Tugas
|
||||
Route::get('/tugas/history', [AdminMateriTugasController::class, 'historyTugas'])->name('tugas.history');
|
||||
Route::get('/tugas/{id}/detail', [AdminMateriTugasController::class, 'detailTugas'])->name('tugas.detail');
|
||||
Route::delete('/tugas/{id}', [AdminMateriTugasController::class, 'destroyTugas'])->name('tugas.destroy');
|
||||
|
||||
Route::resource('guru', AdminGuruController::class);
|
||||
Route::resource('siswa', AdminSiswaController::class);
|
||||
Route::resource('kelas', AdminKelasController::class);
|
||||
|
|
|
|||
Loading…
Reference in New Issue