stage file upload an

This commit is contained in:
Fiqh Pratama
2025-10-13 14:55:46 +07:00
parent dd5dbcab8f
commit 76d4aa9b90
9 changed files with 1081 additions and 226 deletions
+5
View File
@@ -135,6 +135,11 @@ class NextCloudHelper
return route('admin.nextcloud.download', ['file' => base64_encode($filePath)]);
}
public static function getPreviewUrl($filePath)
{
return route('admin.nextcloud.preview', ['file' => base64_encode($filePath)]);
}
public static function getNextcloudFile($filePath)
{
// Check if the file exists
@@ -68,4 +68,60 @@ class NextCloudController extends Controller
->header('Pragma', 'public')
->header('Content-Length', strlen($response));
}
public function preview($file)
{
$filePath = base64_decode($file);
$baseUrl = rtrim(env('NEXT_CLOUD_URL'), '/');
$username = env('NEXT_CLOUD_USERNAME');
$password = env('NEXT_CLOUD_PASSWORD');
$filePath = trim((string) $filePath);
$segments = explode('/', ltrim($filePath, '/'));
$encodedPath = implode('/', array_map('rawurlencode', $segments));
$relativePath = "remote.php/dav/files/{$username}/" . $encodedPath;
$url = $baseUrl . '/' . $relativePath;
$ch = curl_init($url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_USERPWD, "{$username}:{$password}");
curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, false);
$response = curl_exec($ch);
if ($response === false) {
curl_close($ch);
abort(404);
}
$statusCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
$contentType = curl_getinfo($ch, CURLINFO_CONTENT_TYPE);
curl_close($ch);
if ($statusCode >= 400 || !$response) {
abort(404);
}
if (!$contentType) {
$extension = strtolower(pathinfo($filePath, PATHINFO_EXTENSION));
$contentType = match ($extension) {
'jpg', 'jpeg' => 'image/jpeg',
'png' => 'image/png',
'gif' => 'image/gif',
'pdf' => 'application/pdf',
default => 'application/octet-stream',
};
}
$filename = basename($filePath);
return response($response, 200)
->header('Content-Type', $contentType)
->header('Content-Disposition', "inline; filename=\"{$filename}\"")
->header('Content-Length', strlen($response));
}
}
@@ -24,16 +24,35 @@ use App\Helpers\AuditTrailHelper;
use App\Helpers\NextCloudHelper;
use App\Rules\FileType;
use App\Models\Admin;
use App\Models\AttachmentForm;
use App\Helpers\BudgetHelper;
use App\Helpers\NotificationHelper;
use App\Helpers\OutstandingHelper;
use Illuminate\Support\Facades\Log;
use App\Services\BrevoService;
use App\Services\AttachmentService;
use App\Enums\AttachmentTableName;
use Carbon\Carbon;
use Illuminate\Container\Attributes\Auth;
class FormUpCountryController extends Controller
{
protected AttachmentService $attachmentService;
protected array $attachmentCategories = [
'bukti_allowance',
'bukti_transport_dalkot',
'bukti_transport_ankot',
'bukti_hotel',
'bukti_total',
'bukti_lainnya',
];
public function __construct(AttachmentService $attachmentService)
{
$this->attachmentService = $attachmentService;
view()->share('upCountryAttachmentCategories', $this->attachmentCategories);
}
public function index()
{
$this->checkAuthorization(auth()->user(), ['forms.country.view']);
@@ -134,16 +153,33 @@ class FormUpCountryController extends Controller
{
$this->checkAuthorization(auth()->user(), ['forms.country.view']);
$form = FormUpCountry::with(['rayon', 'user'])->findOrFail($id);
$form = FormUpCountry::with(['rayon', 'user', 'attachments'])->findOrFail($id);
$form->bukti_allowance = $form->bukti_allowance ? NextCloudHelper::getFileUrl($form->bukti_allowance) : null;
$form->bukti_transport_dalkot = $form->bukti_transport_dalkot ? NextCloudHelper::getFileUrl($form->bukti_transport_dalkot) : null;
$form->bukti_transport_ankot = $form->bukti_transport_ankot ? NextCloudHelper::getFileUrl($form->bukti_transport_ankot) : null;
$form->bukti_hotel = $form->bukti_hotel ? NextCloudHelper::getFileUrl($form->bukti_hotel) : null;
$form->uc_plan = $form->uc_plan ? NextCloudHelper::getFileUrl($form->uc_plan) : null;
$attachments = $form->attachments->map(function ($attachment) {
$filePath = $attachment->file_path;
$extension = strtolower(pathinfo($filePath, PATHINFO_EXTENSION));
return [
'id' => $attachment->id,
'file_category' => $attachment->file_category,
'file_path' => $filePath,
'download_url' => $filePath ? NextCloudHelper::getFileUrl($filePath) : null,
'preview_url' => $filePath ? NextCloudHelper::getPreviewUrl($filePath) : null,
'preview_type' => in_array($extension, ['jpg', 'jpeg', 'png']) ? 'image' : 'pdf',
'filename' => $filePath ? basename($filePath) : null,
'extension' => $extension,
];
})->values();
return view('backend.pages.forms.upcountry.view', [
'form' => $form,
'rayons' => Rayon::all(),
'attachments' => $attachments,
]);
}
@@ -153,7 +189,8 @@ class FormUpCountryController extends Controller
$cabang = UserHasCabang::with('cabang')->where('user_id', auth()->user()->id)->first()->cabang;
return view('backend.pages.forms.upcountry.create', [
'rayons' => Rayon::where('cabang_id', $cabang->id)->get()
'rayons' => Rayon::where('cabang_id', $cabang->id)->get(),
'attachmentCategories' => $this->attachmentCategories,
]);
}
@@ -169,10 +206,9 @@ class FormUpCountryController extends Controller
'transport_dalkot' => 'nullable|numeric',
'transport_ankot' => 'nullable|numeric',
'hotel' => 'nullable|numeric',
'bukti_allowance' => ['nullable', 'file', 'max:51200'],
'bukti_transport_dalkot' => ['nullable', 'file', 'max:51200'],
'bukti_transport_ankot' => ['nullable', 'file', 'max:51200'],
'bukti_hotel' => ['nullable', 'file', 'max:51200'],
'attachments' => 'nullable|array',
'attachments.*.file_category' => 'required|string|in:' . implode(',', $this->attachmentCategories),
'attachments.*.file_path' => ['nullable', 'file', 'mimes:jpg,jpeg,png,pdf', 'max:5120'],
'uc_plan' => 'nullable|file|max:51200',
]);
@@ -215,54 +251,6 @@ class FormUpCountryController extends Controller
$periodeMonth = strtolower($periodeDate->format('F'));
$periodeYear = (int) $periodeDate->format('Y');
// Upload file
$filePaths = [];
$folderPath = '/expense/' . $region->code . '/' . $cabang->code . '/upcountry';
if ($request->hasFile('bukti_allowance')) {
$bukti = $request->file('bukti_allowance');
$filename = Str::uuid() . '.' . $bukti->extension();
$filePaths['bukti_allowance'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $bukti->getContent(), $filename);
}
if ($request->hasFile('bukti_transport_dalkot')) {
$bukti = $request->file('bukti_transport_dalkot');
$filename = Str::uuid() . '.' . $bukti->extension();
$filePaths['bukti_transport_dalkot'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $bukti->getContent(), $filename);
}
if ($request->hasFile('bukti_transport_ankot')) {
$bukti = $request->file('bukti_transport_ankot');
$filename = Str::uuid() . '.' . $bukti->extension();
$filePaths['bukti_transport_ankot'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $bukti->getContent(), $filename);
}
if ($request->hasFile('bukti_hotel')) {
$bukti = $request->file('bukti_hotel');
$filename = Str::uuid() . '.' . $bukti->extension();
$filePaths['bukti_hotel'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $bukti->getContent(), $filename);
}
if ($request->hasFile('uc_plan')) {
$ucPlan = $request->file('uc_plan');
$filename = Str::uuid() . '.' . $ucPlan->extension();
$filePaths['uc_plan'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $ucPlan->getContent(), $filename);
}
// Generate expense number
$sequence_number = FormUpCountry::withTrashed()
->where('expense_number', 'like', $region->code . '-' . $cabang->code . '-UPC-' . date('ym') . '%')
->count() + 1;
$formatted_sequence_number = str_pad($sequence_number, 4, '0', STR_PAD_LEFT);
$expense_number = $region->code . '-' . $cabang->code . '-UPC-' . date('ym') . $formatted_sequence_number;
// Hitung total nominal
$data_nominal = [
'allowance' => $request->allowance ?? 0,
'transport_dalkot' => $request->transport_dalkot ?? 0,
@@ -274,32 +262,74 @@ class FormUpCountryController extends Controller
// Validasi budget berdasarkan periode
$availableBudget = BudgetHelper::getAvailableBudget($cabang->id, $periodeMonth, $periodeYear);
if(array_sum($data_nominal) > $availableBudget) {
if($totalNominal > $availableBudget) {
session()->flash('error', 'Alokasi budget bulanan cabang tidak mencukupi,silahkan ajukan pada periode expense berikutnya');
return redirect()->back();
}
// Save the form data
$form = FormUpCountry::create([
'expense_number' => $expense_number,
'user_id' => auth()->user()->id,
'rayon_id' => $request->rayon_id,
'tanggal' => $request->tanggal,
'tujuan' => $request->tujuan,
'jarak' => $request->jarak,
'allowance' => $data_nominal['allowance'],
'transport_dalkot' => $data_nominal['transport_dalkot'],
'transport_ankot' => $data_nominal['transport_ankot'],
'hotel' => $data_nominal['hotel'],
'total' => array_sum($data_nominal),
'bukti_allowance' => $filePaths['bukti_allowance'] ?? null,
'bukti_transport_dalkot' => $filePaths['bukti_transport_dalkot'] ?? null,
'bukti_transport_ankot' => $filePaths['bukti_transport_ankot'] ?? null,
'bukti_hotel' => $filePaths['bukti_hotel'] ?? null,
'uc_plan' => $filePaths['uc_plan'] ?? null,
'account_number' => $kategori->account_number,
'status' => 'On Progress',
]);
$folderPath = '/expense/' . $region->code . '/' . $cabang->code . '/upcountry';
$ucPlanPath = null;
if ($request->hasFile('uc_plan')) {
$ucPlan = $request->file('uc_plan');
$filename = Str::uuid() . '.' . $ucPlan->extension();
$ucPlanPath = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $ucPlan->getContent(), $filename);
}
$attachmentsPayload = $this->buildAttachmentPayload($request, $folderPath);
// Generate expense number
DB::beginTransaction();
try {
$sequence_number = FormUpCountry::withTrashed()
->where('expense_number', 'like', $region->code . '-' . $cabang->code . '-UPC-' . date('ym') . '%')
->count() + 1;
$formatted_sequence_number = str_pad($sequence_number, 4, '0', STR_PAD_LEFT);
$expense_number = $region->code . '-' . $cabang->code . '-UPC-' . date('ym') . $formatted_sequence_number;
$form = FormUpCountry::create([
'expense_number' => $expense_number,
'user_id' => auth()->user()->id,
'rayon_id' => $request->rayon_id,
'tanggal' => $request->tanggal,
'tujuan' => $request->tujuan,
'jarak' => $request->jarak,
'allowance' => $data_nominal['allowance'],
'transport_dalkot' => $data_nominal['transport_dalkot'],
'transport_ankot' => $data_nominal['transport_ankot'],
'hotel' => $data_nominal['hotel'],
'total' => $totalNominal,
'bukti_allowance' => null,
'bukti_transport_dalkot' => null,
'bukti_transport_ankot' => null,
'bukti_hotel' => null,
'uc_plan' => $ucPlanPath,
'account_number' => $kategori->account_number,
'status' => 'On Progress',
]);
if (!empty($attachmentsPayload)) {
$this->attachmentService->addMultipleAttachments(
$form->id,
AttachmentTableName::FORM_UP_COUNTRY,
$attachmentsPayload
);
}
DB::commit();
} catch (\Throwable $th) {
DB::rollBack();
Log::error('Failed to store Form Up Country', [
'message' => $th->getMessage(),
'trace' => $th->getTraceAsString(),
]);
session()->flash('error', 'Terjadi kesalahan saat menyimpan data, silakan coba lagi.');
return redirect()->back()->withInput();
}
// Send notification to MIS and Admin Region and Area Manager Cabang
$roles = ['Marketing Information System', 'Admin Region', 'Area Manager Cabang'];
@@ -406,19 +436,37 @@ class FormUpCountryController extends Controller
->get();
}
$form = FormUpCountry::with('rayon')->findOrfail($id);
$form = FormUpCountry::with(['rayon', 'attachments'])->findOrfail($id);
if (($form->status != 'On Progress' && $form->status != 'Rejected') && $role == 'Medical Representatif') {
session()->flash('error', 'You cannot edit this form because it has been approved or closed.');
return redirect()->back();
}
$existingAttachments = $form->attachments->map(function ($attachment) {
$filePath = $attachment->file_path;
$extension = strtolower(pathinfo($filePath, PATHINFO_EXTENSION));
return [
'id' => $attachment->id,
'file_category' => $attachment->file_category,
'file_path' => $filePath,
'download_url' => $filePath ? NextCloudHelper::getFileUrl($filePath) : null,
'preview_url' => $filePath ? NextCloudHelper::getPreviewUrl($filePath) : null,
'preview_type' => in_array($extension, ['jpg', 'jpeg', 'png']) ? 'image' : 'pdf',
'filename' => $filePath ? basename($filePath) : null,
'extension' => $extension,
];
})->values();
return view('backend.pages.forms.upcountry.edit', [
'rayons' => $rayonData,
'form' => $form
'form' => $form,
'attachments' => $existingAttachments,
'attachmentCategories' => $this->attachmentCategories,
]);
}
public function update(Request $request, $id)
public function update(Request $request, $id)
{
$this->checkAuthorization(auth()->user(), ['forms.country.edit']);
$role = auth()->user()->getRoleNames()[0];
@@ -432,10 +480,9 @@ class FormUpCountryController extends Controller
'transport_dalkot' => 'nullable|numeric',
'transport_ankot' => 'nullable|numeric',
'hotel' => 'nullable|numeric',
'bukti_allowance' => ['nullable', 'file', 'max:51200'],
'bukti_transport_dalkot' => ['nullable', 'file', 'max:51200'],
'bukti_transport_ankot' => ['nullable', 'file', 'max:51200'],
'bukti_hotel' => ['nullable', 'file', 'max:51200'],
'attachments' => 'nullable|array',
'attachments.*.file_category' => 'required|string|in:' . implode(',', $this->attachmentCategories),
'attachments.*.file_path' => ['nullable', 'file', 'mimes:jpg,jpeg,png,pdf', 'max:5120'],
'uc_plan' => 'nullable|file|max:51200',
]);
@@ -466,45 +513,19 @@ class FormUpCountryController extends Controller
$periodeMonth = strtolower($periodeDate->format('F'));
$periodeYear = (int) $periodeDate->format('Y');
// Upload bukti file
$filePaths = [];
$folderPath = '/expense/' . $region->code . '/' . $cabang->code . '/upcountry';
if ($request->hasFile('bukti_allowance')) {
$file = $request->file('bukti_allowance');
$filename = Str::uuid() . '.' . $file->extension();
$filePaths['bukti_allowance'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $file->getContent(), $filename);
}
if ($request->hasFile('bukti_transport_dalkot')) {
$file = $request->file('bukti_transport_dalkot');
$filename = Str::uuid() . '.' . $file->extension();
$filePaths['bukti_transport_dalkot'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $file->getContent(), $filename);
}
if ($request->hasFile('bukti_transport_ankot')) {
$file = $request->file('bukti_transport_ankot');
$filename = Str::uuid() . '.' . $file->extension();
$filePaths['bukti_transport_ankot'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $file->getContent(), $filename);
}
if ($request->hasFile('bukti_hotel')) {
$file = $request->file('bukti_hotel');
$filename = Str::uuid() . '.' . $file->extension();
$filePaths['bukti_hotel'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $file->getContent(), $filename);
}
$ucPlanPath = null;
if ($request->hasFile('uc_plan')) {
$file = $request->file('uc_plan');
$filename = Str::uuid() . '.' . $file->extension();
$filePaths['uc_plan'] = $folderPath . '/' . $filename;
$ucPlanPath = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $file->getContent(), $filename);
}
$attachmentsPayload = $this->buildAttachmentPayload($request, $folderPath);
// Hitung total nominal
$data_nominal = [
'allowance' => $request->allowance ?? 0,
@@ -522,29 +543,107 @@ class FormUpCountryController extends Controller
}
// Save the form data
$form->update([
'rayon_id' => $request->rayon_id,
'tanggal' => $request->tanggal,
'tujuan' => $request->tujuan,
'jarak' => $request->jarak,
'allowance' => $data_nominal['allowance'],
'transport_dalkot' => $data_nominal['transport_dalkot'],
'transport_ankot' => $data_nominal['transport_ankot'],
'hotel' => $data_nominal['hotel'],
'total' => array_sum($data_nominal),
'bukti_allowance' => $filePaths['bukti_allowance'] ?? $form->bukti_allowance,
'bukti_transport_dalkot' => $filePaths['bukti_transport_dalkot'] ?? $form->bukti_transport_dalkot,
'bukti_transport_ankot' => $filePaths['bukti_transport_ankot'] ?? $form->bukti_transport_ankot,
'bukti_hotel' => $filePaths['bukti_hotel'] ?? $form->bukti_hotel,
'uc_plan' => $filePaths['uc_plan'] ?? $form->uc_plan,
'account_number' => $kategori->account_number,
]);
DB::beginTransaction();
try {
$form->update([
'rayon_id' => $request->rayon_id,
'tanggal' => $request->tanggal,
'tujuan' => $request->tujuan,
'jarak' => $request->jarak,
'allowance' => $data_nominal['allowance'],
'transport_dalkot' => $data_nominal['transport_dalkot'],
'transport_ankot' => $data_nominal['transport_ankot'],
'hotel' => $data_nominal['hotel'],
'total' => $totalNominal,
'uc_plan' => $ucPlanPath ?? $form->uc_plan,
'account_number' => $kategori->account_number,
]);
if (!empty($attachmentsPayload)) {
$this->attachmentService->addMultipleAttachments(
$form->id,
AttachmentTableName::FORM_UP_COUNTRY,
$attachmentsPayload
);
}
DB::commit();
} catch (\Throwable $th) {
DB::rollBack();
Log::error('Failed to update Form Up Country', [
'message' => $th->getMessage(),
'trace' => $th->getTraceAsString(),
]);
session()->flash('error', 'Terjadi kesalahan saat memperbarui data, silakan coba lagi.');
return redirect()->back()->withInput();
}
AuditTrailHelper::AddAuditTrail('Update', 'Update Record at Form Up Country (' . $form->expense_number . ')');
session()->flash('success', 'Form has been updated.');
return redirect()->back();
}
public function deleteAttachment(Request $request, $formId, $attachmentId)
{
$this->checkAuthorization(auth()->user(), ['forms.country.edit']);
$form = FormUpCountry::findOrFail($formId);
$role = auth()->user()->getRoleNames()[0];
if (($form->status !== 'On Progress' && $form->status !== 'Rejected') && $role === 'Medical Representatif') {
return response()->json(['message' => 'You cannot modify attachments once the form is approved or closed.'], 403);
}
$attachment = AttachmentForm::where('id', $attachmentId)
->where('form_id', $form->id)
->where('table_name', AttachmentTableName::FORM_UP_COUNTRY)
->first();
if (!$attachment) {
return response()->json(['message' => 'Attachment not found.'], 404);
}
$this->attachmentService->deleteAttachment($attachment->id);
AuditTrailHelper::AddAuditTrail('Delete Attachment', 'Delete Attachment at Form Up Country (' . $form->expense_number . ')');
return response()->json(['message' => 'Attachment deleted successfully.']);
}
protected function buildAttachmentPayload(Request $request, string $folderPath): array
{
$payload = [];
$attachmentInputs = $request->input('attachments', []);
$attachmentFiles = $request->file('attachments', []);
foreach ($attachmentFiles as $index => $fileGroup) {
$uploadedFile = $fileGroup['file_path'] ?? null;
if (!$uploadedFile) {
continue;
}
$category = $attachmentInputs[$index]['file_category'] ?? null;
if (!$category) {
continue;
}
$filename = Str::uuid() . '.' . $uploadedFile->extension();
$filePath = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile($folderPath, $uploadedFile->getContent(), $filename);
$payload[] = [
'file_category' => $category,
'file_path' => $filePath,
];
}
return $payload;
}
public function approve(Request $request, $id)
{
$this->checkAuthorization(auth()->user(), ['approval.approve']);
@@ -0,0 +1,20 @@
@props([
'modalId',
'title' => 'Attachment Preview',
])
<div class="modal fade" id="{{ $modalId }}" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">{{ $title }} - <span class="attachment-preview-modal-title"></span></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<img class="img-fluid d-none attachment-preview-image" alt="Attachment preview">
<object class="w-100 d-none attachment-preview-object" style="min-height: 480px;" type="application/pdf"></object>
<div class="text-center text-muted attachment-preview-placeholder">Tidak ada file untuk ditampilkan.</div>
</div>
</div>
</div>
</div>
@@ -1,4 +1,4 @@
@extends('layouts.app')
@extends('layouts.app')
@section('title')
Dashboard
@@ -74,10 +74,6 @@
<label class="form-label">Allowance <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="allowance" id="allowance" value="{{ old('allowance') }}">
</div>
<div class="mb-3">
<label class="form-label">Bukti Allowance <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_allowance" value="{{ old('bukti_allowance') }}">
</div>
</div>
<div class="col-lg-6">
@@ -85,25 +81,44 @@
<label class="form-label">Transport Dalam Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="transport_dalkot" id="transport_dalkot" value="{{ old('transport_dalkot') }}">
</div>
<div class="mb-3">
<label class="form-label">Bukti Transport Dalam Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_transport_dalkot" value="{{ old('bukti_transport_dalkot') }}">
</div>
<div class="mb-3">
<label class="form-label">Transport Antar Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="transport_ankot" id="transport_ankot" value="{{ old('transport_ankot') }}">
</div>
<div class="mb-3">
<label class="form-label">Bukti Transport Antar Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_transport_ankot" value="{{ old('bukti_transport_ankot') }}">
</div>
<div class="mb-3">
<label class="form-label">Hotel <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="hotel" id="hotel" value="{{ old('hotel') }}">
</div>
</div>
<div class="col-lg-12">
<div class="mb-3">
<label class="form-label">Bukti Hotel <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_hotel" value="{{ old('bukti_hotel') }}">
<div class="d-flex align-items-center justify-content-between">
<label class="form-label mb-0">Attachments</label>
<button type="button" class="btn btn-outline-primary btn-sm" id="add-attachment-row">
<i class="fas fa-plus me-1"></i> Add Attachment
</button>
</div>
<p class="text-muted small mt-1 mb-2">
Allowed files: JPG, JPEG, PNG, PDF. Max size 5 MB per file.
</p>
<div class="table-responsive">
<table class="table table-bordered align-middle" id="attachments-table">
<thead class="table-light">
<tr>
<th style="width: 30%">File Category</th>
<th style="width: 45%">Attachment</th>
<th style="width: 15%" class="text-center">Preview</th>
<th style="width: 10%" class="text-center">Action</th>
</tr>
</thead>
<tbody>
<tr class="attachments-empty text-center text-muted">
<td colspan="4">Belum ada lampiran ditambahkan.</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
@@ -118,6 +133,22 @@
</div>
</form>
<div class="modal fade" id="newAttachmentPreviewModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Attachment Preview - <span id="newAttachmentPreviewTitle"></span></h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<img id="newAttachmentPreviewImage" class="img-fluid d-none" alt="Attachment preview">
<iframe id="newAttachmentPreviewPdf" class="w-100 d-none" style="min-height: 480px;" frameborder="0"></iframe>
<div id="newAttachmentPreviewPlaceholder" class="text-center text-muted">Tidak ada file untuk ditampilkan.</div>
</div>
</div>
</div>
</div>
<div id="loading-spinner-overlay" class="d-none">
<div class="spinner-wrapper">
<div class="spinner-border text-primary" role="status">
@@ -132,41 +163,240 @@
<script>
new AutoNumeric('#allowance', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
new AutoNumeric('#transport_dalkot', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
new AutoNumeric('#transport_ankot', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
new AutoNumeric('#hotel', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
document.getElementById('expense-form').addEventListener('submit', function (e) {
const spinnerOverlay = document.getElementById('loading-spinner-overlay');
spinnerOverlay.classList.remove('d-none'); // Show overlay
spinnerOverlay.classList.add('d-flex'); // Use flexbox for centering
const attachmentCategories = @json($attachmentCategories ?? ($upCountryAttachmentCategories ?? []));
const fileAccept = '.jpg,.jpeg,.png,.pdf';
let attachmentIndex = 0;
function categoryToLabel(value) {
if (!value) {
return 'Pilih Kategori';
}
return value
.replace(/_/g, ' ')
.replace(/\b\w/g, (char) => char.toUpperCase());
}
function buildCategoryOptions() {
return attachmentCategories
.map((category) => `<option value="${category}">${categoryToLabel(category)}</option>`)
.join('');
}
function resetInlinePreview($row) {
$row
.find('.attachment-inline-preview')
.removeClass('bg-light')
.html('<i class="fas fa-file-upload text-muted"></i>');
}
function clearRowData($row) {
const existingUrl = $row.data('objectUrl');
if (existingUrl) {
URL.revokeObjectURL(existingUrl);
}
$row.removeData('objectUrl');
$row.removeData('previewType');
$row.removeData('previewSource');
resetInlinePreview($row);
$row.find('.preview-new-attachment').addClass('d-none');
$row.find('.preview-filename').text('');
}
function addAttachmentRow() {
const attachmentTableBody = $('#attachments-table tbody');
const emptyRowMarkup = `<tr class="attachments-empty text-center text-muted"><td colspan="4">Belum ada lampiran ditambahkan.</td></tr>`;
if (attachmentTableBody.find('.attachments-empty').length) {
attachmentTableBody.empty();
}
const index = attachmentIndex++;
const row = $(`
<tr class="attachment-row" data-index="${index}">
<td>
<select class="form-select attachment-category" name="attachments[${index}][file_category]" required>
<option value="">${categoryToLabel('')}</option>
${buildCategoryOptions()}
</select>
</td>
<td>
<div class="d-flex align-items-center gap-2">
<div class="attachment-inline-preview border rounded d-flex align-items-center justify-content-center bg-white" style="width: 56px; height: 56px;">
<i class="fas fa-file-upload text-muted"></i>
</div>
<input type="file" class="form-control attachment-file" name="attachments[${index}][file_path]" accept="${fileAccept}">
</div>
<div class="small text-muted mt-1 preview-filename"></div>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-secondary preview-new-attachment d-none" data-modal="#newAttachmentPreviewModal">
Preview
</button>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-danger remove-attachment-row">
<i class="fas fa-trash"></i>
</button>
</td>
</tr>
`);
attachmentTableBody.append(row);
}
function removeAttachmentRow(button) {
const $row = $(button).closest('tr');
const attachmentTableBody = $('#attachments-table tbody');
const emptyRowMarkup = `<tr class="attachments-empty text-center text-muted"><td colspan="4">Belum ada lampiran ditambahkan.</td></tr>`;
clearRowData($row);
$row.remove();
if (!attachmentTableBody.find('.attachment-row').length) {
attachmentTableBody.append(emptyRowMarkup);
}
}
function setInlinePreview($row, type, source) {
const previewBox = $row.find('.attachment-inline-preview');
if (type === 'image' && source) {
previewBox
.html(`<img src="${source}" class="img-thumbnail" style="width: 100%; height: 100%; object-fit: cover;" alt="Preview image">`)
.addClass('bg-light');
} else if (type === 'pdf') {
previewBox
.html('<i class="fas fa-file-pdf text-danger fa-lg"></i>')
.addClass('bg-light');
} else {
resetInlinePreview($row);
}
}
function openAttachmentModal(modalSelector, title, type, source) {
const $modal = $(modalSelector);
const $image = $modal.find('.attachment-preview-image');
const $object = $modal.find('.attachment-preview-object');
const $placeholder = $modal.find('.attachment-preview-placeholder');
$modal.find('.attachment-preview-modal-title').text(title || 'Attachment');
$image.addClass('d-none').attr('src', '');
$object.addClass('d-none').attr('data', '').attr('src', '');
$placeholder.removeClass('d-none');
if (type === 'image' && source) {
$image.attr('src', source).removeClass('d-none');
$placeholder.addClass('d-none');
} else if (type === 'pdf' && source) {
$object.attr('data', source).attr('src', source).removeClass('d-none');
$placeholder.addClass('d-none');
}
if (window.bootstrap && bootstrap.Modal && typeof bootstrap.Modal.getOrCreateInstance === 'function') {
bootstrap.Modal.getOrCreateInstance($modal[0]).show();
} else {
$modal.modal('show');
}
}
function previewFile(input) {
const $input = $(input);
const $row = $input.closest('tr');
const previewButton = $row.find('.preview-new-attachment');
const filenameHolder = $row.find('.preview-filename');
clearRowData($row);
const file = input.files && input.files[0];
if (!file) {
return;
}
filenameHolder.text(file.name);
const extension = file.name.split('.').pop().toLowerCase();
if (['jpg', 'jpeg', 'png'].includes(extension)) {
const reader = new FileReader();
reader.onload = function (event) {
const source = event.target.result;
$row.data('previewType', 'image');
$row.data('previewSource', source);
setInlinePreview($row, 'image', source);
previewButton.removeClass('d-none');
};
reader.readAsDataURL(file);
} else {
const objectUrl = URL.createObjectURL(file);
$row.data('previewType', 'pdf');
$row.data('previewSource', objectUrl);
$row.data('objectUrl', objectUrl);
setInlinePreview($row, 'pdf');
previewButton.removeClass('d-none');
}
}
$(function () {
const spinnerOverlay = $('#loading-spinner-overlay');
$('#expense-form').on('submit', function () {
spinnerOverlay.removeClass('d-none').addClass('d-flex');
});
$('#add-attachment-row').on('click', function () {
addAttachmentRow();
});
$(document).on('click', '.remove-attachment-row', function () {
removeAttachmentRow(this);
});
$(document).on('change', '.attachment-file', function () {
previewFile(this);
});
$(document).on('click', '.preview-new-attachment', function () {
const $row = $(this).closest('tr');
const previewType = $row.data('previewType');
const previewSource = $row.data('previewSource');
const category = categoryToLabel($row.find('.attachment-category').val());
const modalSelector = $(this).data('modal') || '#newAttachmentPreviewModal';
openAttachmentModal(modalSelector, category, previewType, previewSource);
});
});
</script>
@endsection
@@ -6,6 +6,7 @@
@section('admin-content')
<script src="https://cdn.jsdelivr.net/npm/autonumeric@4.6.0/dist/autoNumeric.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<section class="content-header">
<div class="container-fluid">
<div class="row mb-2">
@@ -75,10 +76,6 @@
<label class="form-label">Allowance <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="allowance" id="allowance" value="{{ $form->allowance }}">
</div>
<div class="mb-3">
<label class="form-label">Bukti Allowance <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_allowance" value="{{ old('bukti_allowance') }}">
</div>
</div>
<div class="col-lg-6">
@@ -86,25 +83,104 @@
<label class="form-label">Transport Dalam Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="transport_dalkot" id="transport_dalkot" value="{{ $form->transport_dalkot }}">
</div>
<div class="mb-3">
<label class="form-label">Bukti Transport Dalam Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_transport_dalkot" value="{{ old('bukti_transport_dalkot') }}">
</div>
<div class="mb-3">
<label class="form-label">Transport Antar Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="transport_ankot" id="transport_ankot" value="{{ $form->transport_ankot }}">
</div>
<div class="mb-3">
<label class="form-label">Bukti Transport Antar Kota <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_transport_ankot" value="{{ old('bukti_transport_ankot') }}">
</div>
<div class="mb-3">
<label class="form-label">Hotel <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="string" class="form-control" name="hotel" id="hotel" value="{{ $form->hotel }}">
</div>
</div>
<div class="col-lg-12">
<div class="mb-4">
<label class="form-label mb-0">Existing Attachments</label>
<p class="text-muted small mt-1 mb-2">Preview, download, or delete attachments that were previously uploaded.</p>
<div class="table-responsive">
<table class="table table-bordered align-middle" id="existing-attachments-table">
<thead class="table-light">
<tr>
<th style="width: 30%">File Category</th>
<th style="width: 30%">Filename</th>
<th style="width: 15%" class="text-center">Preview</th>
<th style="width: 15%" class="text-center">Download</th>
<th style="width: 10%" class="text-center">Action</th>
</tr>
</thead>
<tbody>
@forelse ($attachments as $attachment)
@php
$categoryValue = $attachment['file_category'] ?? null;
$categoryLabel = $categoryValue ? ucwords(str_replace('_', ' ', $categoryValue)) : '-';
@endphp
<tr data-attachment-id="{{ $attachment['id'] }}">
<td>{{ $categoryLabel }}</td>
<td>{{ $attachment['filename'] ?? basename($attachment['file_path']) }}</td>
<td class="text-center">
<button type="button"
class="btn btn-sm btn-outline-secondary preview-existing-attachment"
data-preview-url="{{ $attachment['preview_url'] }}"
data-download-url="{{ $attachment['download_url'] }}"
data-preview-type="{{ $attachment['preview_type'] }}"
data-category="{{ $categoryLabel }}">
Preview
</button>
</td>
<td class="text-center">
<a href="{{ $attachment['download_url'] }}"
target="_blank"
class="btn btn-sm btn-outline-primary">
Download
</a>
</td>
<td class="text-center">
<button type="button"
class="btn btn-sm btn-outline-danger delete-attachment"
data-delete-url="{{ route('forms.up-country.attachments.destroy', [$form->id, $attachment['id']]) }}">
<i class="fas fa-trash"></i>
</button>
</td>
</tr>
@empty
<tr class="existing-attachments-empty text-center text-muted">
<td colspan="5">Belum ada lampiran tersimpan.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
<div class="col-lg-12">
<div class="mb-3">
<label class="form-label">Bukti Hotel <span class="font-italic font-weight-normal">(optional)</span></label>
<input type="file" class="form-control" name="bukti_hotel" value="{{ old('bukti_hotel') }}">
<div class="d-flex align-items-center justify-content-between">
<label class="form-label mb-0">Add New Attachments</label>
<button type="button" class="btn btn-outline-primary btn-sm" id="add-new-attachment-row">
<i class="fas fa-plus me-1"></i> Add Attachment
</button>
</div>
<p class="text-muted small mt-1 mb-2">
Allowed files: JPG, JPEG, PNG, PDF. Max size 5 MB per file.
</p>
<div class="table-responsive">
<table class="table table-bordered align-middle" id="new-attachments-table">
<thead class="table-light">
<tr>
<th style="width: 30%">File Category</th>
<th style="width: 45%">Attachment</th>
<th style="width: 15%" class="text-center">Preview</th>
<th style="width: 10%" class="text-center">Action</th>
</tr>
</thead>
<tbody>
<tr class="new-attachments-empty text-center text-muted">
<td colspan="4">Belum ada lampiran baru.</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
@@ -119,6 +195,16 @@
</div>
</form>
@include('backend.components.attachment-preview-modal', [
'modalId' => 'existingAttachmentPreviewModal',
'title' => 'Attachment Preview',
])
@include('backend.components.attachment-preview-modal', [
'modalId' => 'newAttachmentPreviewModal',
'title' => 'Attachment Preview',
])
<div id="loading-spinner-overlay" class="d-none">
<div class="spinner-wrapper">
<div class="spinner-border text-primary" role="status">
@@ -133,41 +219,314 @@
<script>
new AutoNumeric('#allowance', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
new AutoNumeric('#transport_dalkot', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
new AutoNumeric('#transport_ankot', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
new AutoNumeric('#hotel', {
digitGroupSeparator: '.', // Pemisah ribuan
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal)
currencySymbol: 'Rp.', // Simbol mata uang
decimalPlaces: 0, // Tidak ada angka desimal
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan
digitGroupSeparator: '.',
decimalCharacter: ',',
currencySymbol: 'Rp.',
decimalPlaces: 0,
unformatOnSubmit: true
});
document.getElementById('expense-form').addEventListener('submit', function (e) {
const spinnerOverlay = document.getElementById('loading-spinner-overlay');
spinnerOverlay.classList.remove('d-none'); // Show overlay
spinnerOverlay.classList.add('d-flex'); // Use flexbox for centering
const attachmentCategories = @json($attachmentCategories ?? ($upCountryAttachmentCategories ?? []));
const fileAccept = '.jpg,.jpeg,.png,.pdf';
let attachmentIndex = 0;
let newAttachmentsTableBody;
let existingAttachmentsTableBody;
let emptyNewRowMarkup = '';
let emptyExistingRowMarkup = '';
function categoryToLabel(value) {
if (!value) {
return 'Pilih Kategori';
}
return value
.replace(/_/g, ' ')
.replace(/\b\w/g, (char) => char.toUpperCase());
}
function buildCategoryOptions() {
return attachmentCategories
.map((category) => `<option value="${category}">${categoryToLabel(category)}</option>`)
.join('');
}
function resetInlinePreview($row) {
$row
.find('.attachment-inline-preview')
.removeClass('bg-light')
.html('<i class="fas fa-file-upload text-muted"></i>');
}
function clearRowData($row) {
const existingUrl = $row.data('objectUrl');
if (existingUrl) {
URL.revokeObjectURL(existingUrl);
}
$row.removeData('objectUrl');
$row.removeData('previewType');
$row.removeData('previewSource');
resetInlinePreview($row);
$row.find('.preview-new-attachment').addClass('d-none');
$row.find('.preview-filename').text('');
}
function addAttachmentRow() {
if (!newAttachmentsTableBody) {
return;
}
if (newAttachmentsTableBody.find('.new-attachments-empty').length) {
newAttachmentsTableBody.empty();
}
const index = attachmentIndex++;
const row = $(`
<tr class="attachment-row" data-index="${index}">
<td>
<select class="form-select attachment-category" name="attachments[${index}][file_category]" required>
<option value="">${categoryToLabel('')}</option>
${buildCategoryOptions()}
</select>
</td>
<td>
<div class="d-flex align-items-center gap-2">
<div class="attachment-inline-preview border rounded d-flex align-items-center justify-content-center bg-white" style="width: 56px; height: 56px;">
<i class="fas fa-file-upload text-muted"></i>
</div>
<input type="file" class="form-control attachment-file" name="attachments[${index}][file_path]" accept="${fileAccept}">
</div>
<div class="small text-muted mt-1 preview-filename"></div>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-secondary preview-new-attachment d-none">
Preview
</button>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-danger remove-attachment-row">
<i class="fas fa-trash"></i>
</button>
</td>
</tr>
`);
newAttachmentsTableBody.append(row);
}
function removeAttachmentRow(button) {
if (!newAttachmentsTableBody) {
return;
}
const $row = $(button).closest('tr');
clearRowData($row);
$row.remove();
if (!newAttachmentsTableBody.find('.attachment-row').length) {
newAttachmentsTableBody.html(emptyNewRowMarkup);
}
}
function setInlinePreview($row, type, source) {
const previewBox = $row.find('.attachment-inline-preview');
if (type === 'image' && source) {
previewBox
.html(`<img src="${source}" class="img-thumbnail" style="width: 100%; height: 100%; object-fit: cover;" alt="Preview image">`)
.addClass('bg-light');
} else if (type === 'pdf') {
previewBox
.html('<i class="fas fa-file-pdf text-danger fa-lg"></i>')
.addClass('bg-light');
} else {
resetInlinePreview($row);
}
}
function openAttachmentModal(modalSelector, title, type, source) {
const $modal = $(modalSelector);
const $image = $modal.find('.attachment-preview-image');
const $object = $modal.find('.attachment-preview-object');
const $placeholder = $modal.find('.attachment-preview-placeholder');
$modal.find('.attachment-preview-modal-title').text(title || 'Attachment');
$image.addClass('d-none').attr('src', '');
$object.addClass('d-none').attr('data', '').attr('src', '');
$placeholder.removeClass('d-none');
if (type === 'image' && source) {
$image.attr('src', source).removeClass('d-none');
$placeholder.addClass('d-none');
} else if (type === 'pdf' && source) {
$object.attr('data', source).attr('src', source).removeClass('d-none');
$placeholder.addClass('d-none');
}
if (window.bootstrap && bootstrap.Modal && typeof bootstrap.Modal.getOrCreateInstance === 'function') {
bootstrap.Modal.getOrCreateInstance($modal[0]).show();
} else {
$modal.modal('show');
}
}
function previewFile(input) {
const $input = $(input);
const $row = $input.closest('tr');
const previewButton = $row.find('.preview-new-attachment');
const filenameHolder = $row.find('.preview-filename');
clearRowData($row);
const file = input.files && input.files[0];
if (!file) {
return;
}
filenameHolder.text(file.name);
const extension = file.name.split('.').pop().toLowerCase();
if (['jpg', 'jpeg', 'png'].includes(extension)) {
const reader = new FileReader();
reader.onload = function (event) {
const source = event.target.result;
$row.data('previewType', 'image');
$row.data('previewSource', source);
setInlinePreview($row, 'image', source);
previewButton.removeClass('d-none');
};
reader.readAsDataURL(file);
} else {
const objectUrl = URL.createObjectURL(file);
$row.data('previewType', 'pdf');
$row.data('previewSource', objectUrl);
$row.data('objectUrl', objectUrl);
setInlinePreview($row, 'pdf');
previewButton.removeClass('d-none');
}
}
$(function () {
const spinnerOverlay = $('#loading-spinner-overlay');
$('#expense-form').on('submit', function () {
spinnerOverlay.removeClass('d-none').addClass('d-flex');
});
newAttachmentsTableBody = $('#new-attachments-table tbody');
existingAttachmentsTableBody = $('#existing-attachments-table tbody');
emptyNewRowMarkup = `<tr class="new-attachments-empty text-center text-muted"><td colspan="4">Belum ada lampiran baru.</td></tr>`;
emptyExistingRowMarkup = `<tr class="existing-attachments-empty text-center text-muted"><td colspan="5">Belum ada lampiran tersimpan.</td></tr>`;
const csrfToken = $('meta[name="csrf-token"]').attr('content');
if (csrfToken) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': csrfToken
}
});
}
$('#add-new-attachment-row').on('click', function () {
addAttachmentRow();
});
$(document).on('click', '.remove-attachment-row', function () {
removeAttachmentRow(this);
});
$(document).on('change', '.attachment-file', function () {
previewFile(this);
});
$(document).on('click', '.preview-new-attachment', function () {
const $row = $(this).closest('tr');
const previewType = $row.data('previewType');
const previewSource = $row.data('previewSource');
const category = categoryToLabel($row.find('.attachment-category').val());
openAttachmentModal('#newAttachmentPreviewModal', category, previewType, previewSource);
});
$(document).on('click', '.preview-existing-attachment', function () {
const button = $(this);
const previewType = button.data('preview-type');
const previewUrl = button.data('preview-url');
const downloadUrl = button.data('download-url');
const category = button.data('category') || 'Attachment';
if (!previewUrl) {
if (downloadUrl) {
window.open(downloadUrl, '_blank');
}
return;
}
openAttachmentModal('#existingAttachmentPreviewModal', category, previewType, previewUrl);
});
$(document).on('click', '.delete-attachment', function () {
const button = $(this);
const deleteUrl = button.data('delete-url');
const $row = button.closest('tr');
Swal.fire({
title: 'Hapus lampiran?',
text: 'Lampiran yang dihapus tidak dapat dikembalikan.',
icon: 'warning',
showCancelButton: true,
confirmButtonText: 'Ya, hapus',
cancelButtonText: 'Batal'
}).then((result) => {
if (!result.isConfirmed) {
return;
}
$.ajax({
url: deleteUrl,
type: 'DELETE',
success: function (response) {
$row.remove();
if (!existingAttachmentsTableBody.find('tr').not('.existing-attachments-empty').length) {
existingAttachmentsTableBody.html(emptyExistingRowMarkup);
}
Swal.fire('Berhasil', response?.message || 'Lampiran berhasil dihapus.', 'success');
},
error: function (xhr) {
const message = xhr?.responseJSON?.message || 'Gagal menghapus lampiran.';
Swal.fire('Error', message, 'error');
}
});
});
});
});
</script>
@endsection
@@ -80,23 +80,6 @@
<div class="mb-3">
<label class="form-label">Status</label>
<input type="text" class="form-control" name="status" value="{{ $form->status }}" readonly>
</div>
<div class="mb-3">
<label class="form-label">Bukti Allowance</label><br>
<a href="{{ $form->bukti_allowance }}" target="_blank">Lihat Bukti</a>
</div>
<div class="mb-3">
<label class="form-label">Bukti Transport Dalam Kota</label><br>
<a href="{{ $form->bukti_transport_dalkot }}" target="_blank">Lihat Bukti</a>
</div>
<div class="mb-3">
<label class="form-label">Bukti Transport Antar Kota</label><br>
<a href="{{ $form->bukti_transport_ankot }}" target="_blank">Lihat Bukti</a>
</div>
<div class="mb-3">
<label class="form-label">Bukti Hotel</label><br>
<a href="{{ $form->bukti_hotel }}" target="_blank">Lihat Bukti</a>
</div>
<div class="mb-3">
<label class="form-label">UC Plan</label><br>
@@ -104,6 +87,58 @@
</div>
</div>
<div class="col-12">
<div class="mb-4">
<label class="form-label">Lampiran</label>
<div class="table-responsive">
<table class="table table-bordered align-middle">
<thead class="table-light">
<tr>
<th style="width: 30%">Kategori</th>
<th style="width: 40%">Nama File</th>
<th style="width: 15%" class="text-center">Preview</th>
<th style="width: 15%" class="text-center">Download</th>
</tr>
</thead>
<tbody>
@forelse ($attachments as $attachment)
@php
$categoryValue = $attachment['file_category'] ?? null;
$categoryLabel = $categoryValue ? ucwords(str_replace('_', ' ', $categoryValue)) : '-';
@endphp
<tr>
<td>{{ $categoryLabel }}</td>
<td>{{ $attachment['filename'] ?? basename($attachment['file_path']) }}</td>
<td class="text-center">
<button type="button"
class="btn btn-sm btn-outline-secondary preview-attachment"
data-preview-url="{{ $attachment['preview_url'] }}"
data-download-url="{{ $attachment['download_url'] }}"
data-preview-type="{{ $attachment['preview_type'] }}"
data-category="{{ $categoryLabel }}">
Preview
</button>
</td>
<td class="text-center">
<a href="{{ $attachment['download_url'] }}"
target="_blank"
class="btn btn-sm btn-outline-primary">
Download
</a>
</td>
</tr>
@empty
<tr class="text-center text-muted">
<td colspan="4">Tidak ada lampiran.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
<div class="col-lg-12">
<a href="{{ route('forms.up-country') }}" class="btn btn-secondary">Kembali</a>
@if (auth()->user()->can('approval.approve') && $form->status == 'On Progress')
@@ -133,6 +168,11 @@
</div>
</section>
<section>
@include('backend.components.attachment-preview-modal', [
'modalId' => 'viewAttachmentPreviewModal',
'title' => 'Attachment Preview',
])
<div class="modal fade" id="approveModal" tabindex="-1" role="dialog" aria-labelledby="approveModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
@@ -408,6 +448,49 @@
</script>
<script>
function openAttachmentModal(modalSelector, title, type, source) {
const $modal = $(modalSelector);
const $image = $modal.find('.attachment-preview-image');
const $object = $modal.find('.attachment-preview-object');
const $placeholder = $modal.find('.attachment-preview-placeholder');
$modal.find('.attachment-preview-modal-title').text(title || 'Attachment');
$image.addClass('d-none').attr('src', '');
$object.addClass('d-none').attr('data', '').attr('src', '');
$placeholder.removeClass('d-none');
if (type === 'image' && source) {
$image.attr('src', source).removeClass('d-none');
$placeholder.addClass('d-none');
} else if (type === 'pdf' && source) {
$object.attr('data', source).attr('src', source).removeClass('d-none');
$placeholder.addClass('d-none');
}
if (window.bootstrap && bootstrap.Modal && typeof bootstrap.Modal.getOrCreateInstance === 'function') {
bootstrap.Modal.getOrCreateInstance($modal[0]).show();
} else {
$modal.modal('show');
}
}
$(document).on('click', '.preview-attachment', function () {
const button = $(this);
const previewType = button.data('preview-type');
const previewUrl = button.data('preview-url');
const downloadUrl = button.data('download-url');
const category = button.data('category') || 'Attachment';
if (!previewUrl) {
if (downloadUrl) {
window.open(downloadUrl, '_blank');
}
return;
}
openAttachmentModal('#viewAttachmentPreviewModal', category, previewType, previewUrl);
});
$(document).on('click', '.open-reject-modal', function () {
const rejectUrl = $(this).data('action');
$('#rejectForm').attr('action', rejectUrl);
@@ -563,3 +646,4 @@
});
</script>
@endsection
@@ -5,7 +5,7 @@
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fiqhpratama/upsense-cdn@main/adminlte-blue/app/css/adminlte.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fiqhpratama/upsense-cdn@main/adminlte-blue/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fiqhpratama/upsense-cdn@main/adminlte-blue/plugins/daterangepicker/daterangepicker.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
{{-- datatables --}}
<link href="https://cdn.datatables.net/v/bs4/jszip-3.10.1/dt-2.1.8/b-3.2.0/b-colvis-3.2.0/b-html5-3.2.0/b-print-3.2.0/r-3.0.3/sb-1.8.1/sp-2.3.3/datatables.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.min.css">
+2
View File
@@ -46,6 +46,7 @@ Route::group(['prefix' => 'admin', 'as' => 'admin.', 'middleware' => ['auth:admi
Route::get('/', [DashboardController::class, 'index'])->name('dashboard');
Route::get('/nextcloud/download/{file}', [NextCloudController::class, 'download'])->name('nextcloud.download');
Route::get('/nextcloud/preview/{file}', [NextCloudController::class, 'preview'])->name('nextcloud.preview');
// Rayon
Route::get('/rayon', [RayonController::class, 'index'])->name('rayon.index');
@@ -130,6 +131,7 @@ Route::middleware(['auth:admin', 'menu'])->group(function () {
Route::post('/up-country/store', [FormUpCountryController::class, 'store'])->name('forms.up-country.store');
Route::get('/up-country/edit/{id}', [FormUpCountryController::class, 'edit'])->name('forms.up-country.edit');
Route::put('/up-country/update/{id}', [FormUpCountryController::class, 'update'])->name('forms.up-country.update');
Route::delete('/up-country/{form}/attachments/{attachment}', [FormUpCountryController::class, 'deleteAttachment'])->name('forms.up-country.attachments.destroy');
Route::delete('/up-country/destroy/{id}', [FormUpCountryController::class, 'destroy'])->name('forms.up-country.destroy');
Route::put('/up-country/approve/{id}', [FormUpCountryController::class, 'approve'])->name('forms.up-country.approve');
Route::put('/up-country/approve2/{id}', [FormUpCountryController::class, 'approve2'])->name('forms.up-country.approve2');