first commit
This commit is contained in:
235
resources/views/admin/surveys/index.blade.php
Normal file
235
resources/views/admin/surveys/index.blade.php
Normal file
@@ -0,0 +1,235 @@
|
||||
@extends('layouts.app')
|
||||
|
||||
@push('styles')
|
||||
<link rel="stylesheet" href="{{ asset('css/adminHeader.css') }}">
|
||||
<link rel="stylesheet" href="{{ asset('css/surveysAdmin.css') }}">
|
||||
@endpush
|
||||
|
||||
@section('content')
|
||||
<div class="container">
|
||||
{{-- Header --}}
|
||||
<div class="admin-header-box">
|
||||
<div>
|
||||
<h4>Senarai Borang soal selidik</h4>
|
||||
<p>Beserta statistik dan analisis Post-Mortem.</p>
|
||||
</div>
|
||||
<a href="{{ route('admin.surveys.create') }}" class="btn btn-sm btn-light px-3 fw-bold text-primary">
|
||||
<i class="bi bi-plus-lg"></i> Daftar soal selidik
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@if(session('success'))
|
||||
<div class="alert alert-success alert-dismissible fade show" role="alert">
|
||||
{{ session('success') }}
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
{{-- Carian borang --}}
|
||||
<form method="GET" action="{{ route('admin.surveys.index') }}" class="mb-4">
|
||||
<div class="input-group shadow-sm">
|
||||
<input type="text" name="search" value="{{ request('search') }}" class="form-control border-end-0" placeholder="Cari tajuk atau kata kunci...">
|
||||
<button class="btn btn-primary" type="submit"><i class="bi bi-search"></i> </button>
|
||||
<a href="{{ route('admin.surveys.index') }}" class="btn btn-outline-secondary"><i class="bi bi-arrow-counterclockwise"></i></a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="card survey-table-card shadow-sm border-0">
|
||||
<div class="card-header bg-secondary text-white py-3">
|
||||
<h5 class="mb-0 text-center fw-bold">Senarai Soal Selidik</h5>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive-lg">
|
||||
<table class="table table-hover table-striped table-bordered align-middle mb-0">
|
||||
<thead class="table-light">
|
||||
<tr>
|
||||
<th class="text-center">#</th>
|
||||
<th style="width: 40%;">Tajuk</th>
|
||||
<th style="width: 20%;">Dibuat oleh</th>
|
||||
<th class="text-center">Respons</th>
|
||||
<th>Tarikh</th>
|
||||
<th class="text-center">Stats & Analisis</th>
|
||||
<th class="text-center">Tindakan</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@forelse($surveys as $index => $survey)
|
||||
<tr>
|
||||
<td class="text-center">{{ $index + 1 }}</td>
|
||||
<td>
|
||||
<div class="fw-semibold text-uppercase text-primary position-relative survey-title-container">
|
||||
<a href="{{ route('surveys.show', $survey) }}"
|
||||
target="_blank"
|
||||
class="text-decoration-none fw-bold text-primary">
|
||||
{{ $survey->title }}
|
||||
</a>
|
||||
<button class="btn btn-link btn-sm p-0 ms-2 text-secondary"
|
||||
onclick="copySurveyLink('{{ $survey->uuid }}')"
|
||||
title="Copy Link">
|
||||
<i class="bi bi-copy"></i>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
<td>{{ $survey->user->name }}</td>
|
||||
<td class="text-center">
|
||||
<span class="badge rounded-pill bg-info text-white px-3">
|
||||
{{ $survey->responses->count() }}
|
||||
</span>
|
||||
</td>
|
||||
<td>{{ $survey->date }}</td>
|
||||
<td class="text-center">
|
||||
<a href="{{ route('admin.surveys.statistics', $survey->id) }}" class="btn btn-sm btn-info text-white fw-semibold">
|
||||
<i class="bi bi-bar-chart"></i> Graf
|
||||
</a>
|
||||
|
||||
<button type="button" class="btn btn-sm btn-warning fw-semibold" data-bs-toggle="modal" data-bs-target="#modalUlasan{{ $survey->id }}">
|
||||
<i class="bi bi-clipboard-check"></i> Ulasan
|
||||
</button>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-secondary btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown">
|
||||
<i class="bi bi-three-dots-vertical"></i>
|
||||
</button>
|
||||
<ul class="dropdown-menu shadow border-0">
|
||||
<li>
|
||||
<a class="dropdown-item" href="{{ route('admin.surveys.edit', $survey->id) }}">
|
||||
<i class="bi bi-pencil me-2 text-primary"></i> Edit Borang
|
||||
</a>
|
||||
</li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li>
|
||||
<form action="{{ route('admin.surveys.destroy', $survey->id) }}" method="POST" onsubmit="return confirm('Padam borang ini?')">
|
||||
@csrf
|
||||
@method('DELETE')
|
||||
<button type="submit" class="dropdown-item text-danger">
|
||||
<i class="bi bi-trash me-2"></i> Hapus
|
||||
</button>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<div class="modal fade" id="modalUlasan{{ $survey->id }}" tabindex="-1" aria-labelledby="modalLabel{{ $survey->id }}" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content border-0 shadow-lg">
|
||||
<div class="modal-header bg-warning">
|
||||
<h5 class="modal-title fw-bold" id="modalLabel{{ $survey->id }}">
|
||||
<i class="bi bi-pencil-square me-2"></i>Ulasan Post-Mortem
|
||||
</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
|
||||
<form action="{{ route('admin.surveys.update_ulasan', $survey->id) }}" method="POST">
|
||||
@csrf
|
||||
<div class="modal-body py-4">
|
||||
<div class="mb-3">
|
||||
<label class="form-label fw-bold">Tajuk Borang:</label>
|
||||
<p class="text-muted border-bottom pb-2">{{ $survey->title }}</p>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="ulasan" class="form-label fw-bold text-dark">Nota Penambahbaikan:</label>
|
||||
<textarea name="ulasan" class="form-control border-warning shadow-sm" rows="6" placeholder="Tulis ulasan penambahbaikan di sini">{{ $survey->ulasan }}</textarea>
|
||||
<div class="form-text mt-2">
|
||||
<i class="bi bi-info-circle me-1"></i> Perkara yang perlu ditambah baik pada masa akan datang.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer bg-light text-end">
|
||||
<button type="button" class="btn btn-secondary px-4" data-bs-dismiss="modal">Batal</button>
|
||||
<button type="submit" class="btn btn-primary px-4 shadow-sm">
|
||||
<i class="bi bi-save me-1"></i> Simpan Ulasan
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@empty
|
||||
<tr>
|
||||
<td colspan="7" class="text-center p-5 text-muted">
|
||||
<i class="bi bi-clipboard-x display-4 d-block mb-3 opacity-25"></i>
|
||||
Tiada borang soal selidik ditemui.
|
||||
</td>
|
||||
</tr>
|
||||
@endforelse
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Pagination --}}
|
||||
<div class="d-flex justify-content-center mt-4">
|
||||
{{ $surveys->withQueryString()->links() }}
|
||||
</div>
|
||||
|
||||
<!-- Toast Notification for Copy Success -->
|
||||
<div class="position-fixed bottom-0 end-0 p-3" style="z-index: 11">
|
||||
<div id="copyToast" class="toast align-items-center text-white bg-success border-0" role="alert" aria-live="assertive" aria-atomic="true">
|
||||
<div class="d-flex">
|
||||
<div class="toast-body">
|
||||
<i class="bi bi-check-circle-fill me-2"></i>Link berjaya disalin!
|
||||
</div>
|
||||
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@push('scripts')
|
||||
<script>
|
||||
function copySurveyLink(surveyUuid) {
|
||||
const baseUrl = "{{ url('/') }}";
|
||||
const surveyUrl = `${baseUrl}/survey/${surveyUuid}`;
|
||||
|
||||
if (navigator.clipboard && window.isSecureContext) {
|
||||
navigator.clipboard.writeText(surveyUrl).then(function() {
|
||||
showCopyToast();
|
||||
}).catch(function(err) {
|
||||
console.error('Clipboard API failed: ', err);
|
||||
fallbackCopy(surveyUrl);
|
||||
});
|
||||
} else {
|
||||
fallbackCopy(surveyUrl);
|
||||
}
|
||||
}
|
||||
|
||||
function fallbackCopy(text) {
|
||||
const textarea = document.createElement('textarea');
|
||||
textarea.value = text;
|
||||
textarea.style.position = 'fixed';
|
||||
textarea.style.opacity = '0';
|
||||
document.body.appendChild(textarea);
|
||||
textarea.focus();
|
||||
textarea.select();
|
||||
|
||||
try {
|
||||
const successful = document.execCommand('copy');
|
||||
if (successful) {
|
||||
showCopyToast();
|
||||
} else {
|
||||
alert('Gagal menyalin link. Sila cuba lagi.');
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Fallback copy failed: ', err);
|
||||
alert('Gagal menyalin link. Sila cuba lagi.');
|
||||
}
|
||||
|
||||
document.body.removeChild(textarea);
|
||||
}
|
||||
|
||||
// Show toast notification
|
||||
function showCopyToast() {
|
||||
const toastEl = document.getElementById('copyToast');
|
||||
const toast = new bootstrap.Toast(toastEl);
|
||||
toast.show();
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
@endpush
|
||||
@endsection
|
||||
Reference in New Issue
Block a user