itdept/expense
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update form others

Browse Source
This commit is contained in:
Fiqh Pratama
2025-10-13 16:42:05 +07:00
parent 602fc68836
commit e8acdd3303
5 changed files with 1275 additions and 225 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Http/Controllers/Forms/FormOtherController.php
+304 -61
View File
@@ -18,7 +18,6 @@ use App\Mail\FinalApprove;
use App\Mail\ExpenseCreated; use App\Mail\ExpenseCreated;
use App\Helpers\WhatsappHelper; use App\Helpers\WhatsappHelper;
use App\Helpers\AuditTrailHelper; use App\Helpers\AuditTrailHelper;
use App\Rules\FileType;
use App\Models\Admin; use App\Models\Admin;
use App\Helpers\BudgetHelper; use App\Helpers\BudgetHelper;
use App\Helpers\NotificationHelper; use App\Helpers\NotificationHelper;
@@ -26,10 +25,30 @@ use App\Models\Cabang;
use App\Helpers\OutstandingHelper; use App\Helpers\OutstandingHelper;
use Illuminate\Support\Facades\Log; use Illuminate\Support\Facades\Log;
use App\Services\BrevoService; use App\Services\BrevoService;
use App\Services\AttachmentService;
use App\Enums\AttachmentTableName;
use App\Models\AttachmentForm;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Facades\Validator;
use Illuminate\Validation\ValidationException;
use Carbon\Carbon; use Carbon\Carbon;
class FormOtherController extends Controller class FormOtherController extends Controller
{ {
protected AttachmentService $attachmentService;
protected array $attachmentCategories = [
'bukti_total',
];
protected array $blockedExtensions = ['exe', 'dll', 'sh', 'bat', 'cmd', 'msi'];
public function __construct(AttachmentService $attachmentService)
{
$this->attachmentService = $attachmentService;
view()->share('otherAttachmentCategories', $this->attachmentCategories);
}
public function index() public function index()
{ {
$this->checkAuthorization(auth()->user(), ['forms.other.view']); $this->checkAuthorization(auth()->user(), ['forms.other.view']);
@@ -117,22 +136,27 @@ class FormOtherController extends Controller
{ {
$this->checkAuthorization(auth()->user(), ['forms.other.view']); $this->checkAuthorization(auth()->user(), ['forms.other.view']);
$form = FormOthers::with(['user', 'kategori'])->findOrFail($id); $form = FormOthers::with(['user', 'kategori', 'attachments'])->findOrFail($id);
$attachments = $this->formatAttachmentCollection($form);
$form->bukti_total = $form->bukti_total ? NextCloudHelper::getFileUrl($form->bukti_total) : null; $form->bukti_total = $form->bukti_total ? NextCloudHelper::getFileUrl($form->bukti_total) : null;
return response()->json($form); return response()->json(array_merge($form->toArray(), [
'attachments' => $attachments,
]));
} }
public function view($id) public function view($id)
{ {
$this->checkAuthorization(auth()->user(), ['forms.other.view']); $this->checkAuthorization(auth()->user(), ['forms.other.view']);
$form = FormOthers::with(['user', 'kategori'])->findOrFail($id); $form = FormOthers::with(['user', 'kategori', 'attachments'])->findOrFail($id);
$attachments = $this->formatAttachmentCollection($form);
$form->bukti_total = $form->bukti_total ? NextCloudHelper::getFileUrl($form->bukti_total) : null; $form->bukti_total = $form->bukti_total ? NextCloudHelper::getFileUrl($form->bukti_total) : null;
return view('backend.pages.forms.other.view', [ return view('backend.pages.forms.other.view', [
'form' => $form, 'form' => $form,
'kategori' => Kategori::whereNotIn('name', ['Up Country', 'Vehicle Running Cost', 'Entertainment', 'Meeting / Seminar'])->get() 'kategori' => Kategori::whereNotIn('name', ['Up Country', 'Vehicle Running Cost', 'Entertainment', 'Meeting / Seminar'])->get(),
'attachments' => $attachments,
]); ]);
} }
@@ -141,21 +165,50 @@ class FormOtherController extends Controller
$this->checkAuthorization(auth()->user(), ['forms.other.create']); $this->checkAuthorization(auth()->user(), ['forms.other.create']);
return view('backend.pages.forms.other.create', [ return view('backend.pages.forms.other.create', [
'kategori' => Kategori::whereNotIn('name', ['Up Country', 'Vehicle Running Cost', 'Entertainment','Presentation','Sponsorship', 'Meeting / Seminar'])->get() 'kategori' => Kategori::whereNotIn('name', ['Up Country', 'Vehicle Running Cost', 'Entertainment','Presentation','Sponsorship', 'Meeting / Seminar'])->get(),
'attachmentCategories' => $this->attachmentCategories,
]); ]);
} }
public function store(Request $request) public function store(Request $request)
{ {
$this->checkAuthorization(auth()->user(), ['forms.other.create']); $this->checkAuthorization(auth()->user(), ['forms.other.create']);
$request->validate([ $validator = Validator::make($request->all(), [
'kategori_id' => 'required', 'kategori_id' => 'required',
'tanggal' => 'required|date', 'tanggal' => 'required|date',
'keterangan' => 'required', 'keterangan' => 'required',
'total' => 'required|numeric|min:1', 'total' => 'required|numeric|min:1',
'bukti_total' => ['nullable', 'file', 'max:51200'], 'attachments' => 'nullable|array',
'attachments.*.file_category' => 'required|string|in:' . implode(',', $this->attachmentCategories),
'attachments.*.file_path' => [
'nullable',
'file',
'max:10240',
'mimetypes:image/jpeg,image/png,image/webp,application/pdf,application/msword,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,text/plain,text/csv,application/zip,application/x-zip-compressed,application/x-7z-compressed,application/vnd.rar,application/octet-stream'
],
]); ]);
$validator->after(function ($validator) use ($request) {
$inputAttachments = $request->input('attachments', []);
$fileAttachments = $request->file('attachments', []);
foreach ($inputAttachments as $index => $input) {
$category = $input['file_category'] ?? null;
$file = $fileAttachments[$index]['file_path'] ?? null;
if ($category && !$file) {
$validator->errors()->add("attachments.{$index}.file_path", 'Attachment file is required.');
continue;
}
if ($file && $this->isBlockedExtension($file->getClientOriginalExtension())) {
$validator->errors()->add("attachments.{$index}.file_path", 'File type is not allowed.');
}
}
});
$validator->validate();
$tanggal = Carbon::parse($request->tanggal); $tanggal = Carbon::parse($request->tanggal);
$startDay = (int) env('STARTING_DATE', 11); $startDay = (int) env('STARTING_DATE', 11);
$closingDay = (int) env('CLOSING_DATE', 10); $closingDay = (int) env('CLOSING_DATE', 10);
@@ -204,39 +257,51 @@ class FormOtherController extends Controller
$region = Region::where('id', $cabang->region_id)->first(); $region = Region::where('id', $cabang->region_id)->first();
$kategori = Kategori::where('id', $request->kategori_id)->first(); $kategori = Kategori::where('id', $request->kategori_id)->first();
$filePaths = [];
$folderPath = '/expense/' . $region->code . '/' . $cabang->code . '/other'; $folderPath = '/expense/' . $region->code . '/' . $cabang->code . '/other';
$attachmentsPayload = $this->buildAttachmentPayload($request, $folderPath);
if ($request->hasFile('bukti_total')) { $primaryAttachmentPath = $attachmentsPayload[0]['file_path'] ?? null;
$bukti_total = $request->file('bukti_total'); $primaryAttachmentPath = $attachmentsPayload[0]['file_path'] ?? null;
$filename = Str::uuid() . '.' . $bukti_total->extension();
$filePaths['bukti_total'] = $folderPath . '/' . $filename;
NextCloudHelper::uploadFile(
$folderPath,
$bukti_total->getContent(),
$filename
);
}
// Generate sequence number and expense number // Generate sequence number and expense number
$sequence_number = FormOthers::withTrashed()->where('expense_number', 'like', $region->code . '-' . $cabang->code . '-OTH-' . date('ym') . '%')->count() + 1; $sequence_number = FormOthers::withTrashed()->where('expense_number', 'like', $region->code . '-' . $cabang->code . '-OTH-' . date('ym') . '%')->count() + 1;
$formatted_sequence_number = str_pad($sequence_number, 4, '0', STR_PAD_LEFT); $formatted_sequence_number = str_pad($sequence_number, 4, '0', STR_PAD_LEFT);
$expense_number = $region->code . '-' . $cabang->code . '-OTH-' . date('ym') . $formatted_sequence_number; $expense_number = $region->code . '-' . $cabang->code . '-OTH-' . date('ym') . $formatted_sequence_number;
// Save the form data DB::beginTransaction();
$form = FormOthers::create([ try {
'expense_number' => $expense_number, $form = FormOthers::create([
'user_id' => auth()->user()->id, 'expense_number' => $expense_number,
'kategori_id' => $request->kategori_id, 'user_id' => auth()->user()->id,
'tanggal' => $request->tanggal, 'kategori_id' => $request->kategori_id,
'keterangan' => $request->keterangan, 'tanggal' => $request->tanggal,
'total' => $request->total, 'keterangan' => $request->keterangan,
'bukti_total' => $filePaths['bukti_total'] ?? null, 'total' => $request->total,
'account_number' => $kategori->account_number, 'bukti_total' => $primaryAttachmentPath,
'status' => 'On Progress', 'account_number' => $kategori->account_number,
]); 'status' => 'On Progress',
]);
if (!empty($attachmentsPayload)) {
$this->attachmentService->addMultipleAttachments(
$form->id,
AttachmentTableName::FORM_OTHERS,
$attachmentsPayload
);
}
DB::commit();
} catch (\Throwable $th) {
DB::rollBack();
Log::error('Failed to store Form Others', [
'message' => $th->getMessage(),
'trace' => $th->getTraceAsString(),
]);
session()->flash('error', 'Terjadi kesalahan saat menyimpan data, silakan coba lagi.');
return redirect()->back()->withInput();
}
$form->load('user');
$name = auth()->user()->name; $name = auth()->user()->name;
$tanggal = $request->tanggal; $tanggal = $request->tanggal;
@@ -323,7 +388,7 @@ class FormOtherController extends Controller
$this->checkAuthorization(auth()->user(), ['forms.other.edit']); $this->checkAuthorization(auth()->user(), ['forms.other.edit']);
$role = auth()->user()->getRoleNames()[0]; $role = auth()->user()->getRoleNames()[0];
$form = FormOthers::findOrfail($id); $form = FormOthers::with('attachments')->findOrfail($id);
if($form->status != 'On Progress' && $role == 'Medical Representatif') { if($form->status != 'On Progress' && $role == 'Medical Representatif') {
session()->flash('error', 'You cannot edit this form because it has been approved or rejected.'); session()->flash('error', 'You cannot edit this form because it has been approved or rejected.');
return redirect()->back(); return redirect()->back();
@@ -331,15 +396,17 @@ class FormOtherController extends Controller
return view('backend.pages.forms.other.edit', [ return view('backend.pages.forms.other.edit', [
'form' => $form, 'form' => $form,
'kategori' => Kategori::whereNotIn('name', ['Up Country', 'Vehicle Running Cost', 'Entertainment','Presentation','Sponsorship', 'Meeting / Seminar'])->get() 'kategori' => Kategori::whereNotIn('name', ['Up Country', 'Vehicle Running Cost', 'Entertainment','Presentation','Sponsorship', 'Meeting / Seminar'])->get(),
]); 'attachments' => $this->formatAttachmentCollection($form),
'attachmentCategories' => $this->attachmentCategories,
]);
} }
public function update(Request $request, $id) public function update(Request $request, $id)
{ {
$this->checkAuthorization(auth()->user(), ['forms.other.edit']); $this->checkAuthorization(auth()->user(), ['forms.other.edit']);
$role = auth()->user()->getRoleNames()[0]; $role = auth()->user()->getRoleNames()[0];
$form = FormOthers::findOrFail($id); $form = FormOthers::with('attachments')->findOrFail($id);
if ($form->status !== 'On Progress' && $role === 'Medical Representatif') { if ($form->status !== 'On Progress' && $role === 'Medical Representatif') {
session()->flash('error', 'You cannot edit this form because it has been approved or rejected.'); session()->flash('error', 'You cannot edit this form because it has been approved or rejected.');
@@ -368,48 +435,122 @@ class FormOtherController extends Controller
// Ambil available budget // Ambil available budget
$availableBudget = BudgetHelper::getAvailableBudget($cabang->id, $periodeMonth, $periodeYear); $availableBudget = BudgetHelper::getAvailableBudget($cabang->id, $periodeMonth, $periodeYear);
// Validasi input $validator = Validator::make($request->all(), [
$request->validate([
'kategori_id' => 'required', 'kategori_id' => 'required',
'tanggal' => 'required|date', 'tanggal' => 'required|date',
'keterangan' => 'required', 'keterangan' => 'required',
'total' => 'required|numeric|min:1|max:' . $availableBudget, 'total' => 'required|numeric|min:1|max:' . $availableBudget,
'bukti_total' => ['nullable', 'file', 'max:51200'], 'attachments' => 'nullable|array',
'attachments.*.file_category' => 'required|string|in:' . implode(',', $this->attachmentCategories),
'attachments.*.file_path' => [
'nullable',
'file',
'max:10240',
'mimetypes:image/jpeg,image/png,image/webp,application/pdf,application/msword,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,text/plain,text/csv,application/zip,application/x-zip-compressed,application/x-7z-compressed,application/vnd.rar,application/octet-stream'
],
]); ]);
$validator->after(function ($validator) use ($request) {
$inputAttachments = $request->input('attachments', []);
$fileAttachments = $request->file('attachments', []);
foreach ($inputAttachments as $index => $input) {
$category = $input['file_category'] ?? null;
$file = $fileAttachments[$index]['file_path'] ?? null;
if ($category && !$file) {
$validator->errors()->add("attachments.{$index}.file_path", 'Attachment file is required.');
continue;
}
if ($file && $this->isBlockedExtension($file->getClientOriginalExtension())) {
$validator->errors()->add("attachments.{$index}.file_path", 'File type is not allowed.');
}
}
});
$validator->validate();
$region = Region::find($cabang->region_id); $region = Region::find($cabang->region_id);
$kategori = Kategori::find($request->kategori_id); $kategori = Kategori::find($request->kategori_id);
$filePaths = [];
$folderPath = '/expense/' . $region->code . '/' . $cabang->code . '/other'; $folderPath = '/expense/' . $region->code . '/' . $cabang->code . '/other';
$attachmentsPayload = $this->buildAttachmentPayload($request, $folderPath);
if ($request->hasFile('bukti_total')) { DB::beginTransaction();
$bukti_total = $request->file('bukti_total'); try {
$filename = Str::uuid() . '.' . $bukti_total->extension(); $form->update([
$filePaths['bukti_total'] = $folderPath . '/' . $filename; 'kategori_id' => $request->kategori_id,
'tanggal' => $request->tanggal,
'keterangan' => $request->keterangan,
'total' => $request->total,
'bukti_total' => $primaryAttachmentPath ?? $form->bukti_total,
'account_number' => $kategori->account_number,
]);
NextCloudHelper::uploadFile( if (!empty($attachmentsPayload)) {
$folderPath, $this->attachmentService->addMultipleAttachments(
$bukti_total->getContent(), $form->id,
$filename AttachmentTableName::FORM_OTHERS,
); $attachmentsPayload
);
}
DB::commit();
} catch (\Throwable $th) {
DB::rollBack();
Log::error('Failed to update Form Others', [
'form_id' => $form->id,
'message' => $th->getMessage(),
'trace' => $th->getTraceAsString(),
]);
session()->flash('error', 'Terjadi kesalahan saat memperbarui data, silakan coba lagi.');
return redirect()->back()->withInput();
} }
// Update form
$form->update([
'kategori_id' => $request->kategori_id,
'tanggal' => $request->tanggal,
'keterangan' => $request->keterangan,
'total' => $request->total,
'bukti_total' => $filePaths['bukti_total'] ?? $form->bukti_total,
'account_number' => $kategori->account_number,
]);
AuditTrailHelper::AddAuditTrail('Update', 'Update Record at Form Other (' . $form->expense_number . ')'); AuditTrailHelper::AddAuditTrail('Update', 'Update Record at Form Other (' . $form->expense_number . ')');
session()->flash('success', 'Form has been updated.'); session()->flash('success', 'Form has been updated.');
return redirect()->back(); return redirect()->back();
} }
public function deleteAttachment(Request $request, $formId, $attachmentId)
{
$this->checkAuthorization(auth()->user(), ['forms.other.edit']);
$form = FormOthers::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_OTHERS)
->first();
if (!$attachment) {
return response()->json(['message' => 'Attachment not found.'], 404);
}
$this->attachmentService->deleteAttachment($attachment->id);
if ($form->bukti_total === $attachment->file_path) {
$replacement = AttachmentForm::where('form_id', $form->id)
->where('table_name', AttachmentTableName::FORM_OTHERS)
->whereNull('deleted_at')
->orderBy('id')
->first();
$form->update(['bukti_total' => $replacement->file_path ?? null]);
}
AuditTrailHelper::AddAuditTrail('Delete Attachment', 'Delete Attachment at Form Other (' . $form->expense_number . ')');
return response()->json(['message' => 'Attachment deleted successfully.']);
}
public function approve($id) public function approve($id)
{ {
$this->checkAuthorization(auth()->user(), ['approval.approve']); $this->checkAuthorization(auth()->user(), ['approval.approve']);
@@ -812,4 +953,106 @@ class FormOtherController extends Controller
session()->flash('success', 'Form has been deleted.'); session()->flash('success', 'Form has been deleted.');
return redirect()->back(); return redirect()->back();
} }
protected function formatAttachmentCollection(FormOthers $form): array
{
$attachments = $form->attachments->map(function ($attachment) {
return $this->formatAttachmentData(
$attachment->id,
$attachment->file_category,
$attachment->file_path
);
});
if ($attachments->isEmpty() && $form->bukti_total) {
$attachments->push($this->formatAttachmentData(null, 'bukti_total', $form->bukti_total));
}
return $attachments->values()->all();
}
protected function formatAttachmentData(?int $id, ?string $category, string $filePath): array
{
$extension = strtolower(pathinfo($filePath, PATHINFO_EXTENSION));
$previewType = $this->determinePreviewType($extension);
return [
'id' => $id,
'file_category' => $category,
'file_path' => $filePath,
'download_url' => NextCloudHelper::getFileUrl($filePath),
'preview_url' => in_array($previewType, ['image', 'pdf'], true) ? NextCloudHelper::getPreviewUrl($filePath) : null,
'preview_type' => $previewType,
'filename' => basename($filePath),
'extension' => $extension,
'can_delete' => !is_null($id),
];
}
protected function determinePreviewType(?string $extension): string
{
$extension = strtolower((string) $extension);
$imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'];
if (in_array($extension, $imageExtensions, true)) {
return 'image';
}
if ($extension === 'pdf') {
return 'pdf';
}
return 'other';
}
protected function isBlockedExtension(?string $extension): bool
{
return in_array(strtolower((string) $extension), $this->blockedExtensions, true);
}
protected function buildAttachmentPayload(Request $request, string $folderPath): array
{
$payload = [];
$inputs = $request->input('attachments', []);
$files = $request->file('attachments', []);
foreach ($inputs as $index => $input) {
$category = $input['file_category'] ?? null;
$file = $files[$index]['file_path'] ?? null;
if (!$category || !$file) {
continue;
}
$extension = strtolower($file->getClientOriginalExtension());
if ($this->isBlockedExtension($extension)) {
throw ValidationException::withMessages([
"attachments.{$index}.file_path" => 'File type is not allowed.',
]);
}
$filename = Str::uuid() . '.' . $extension;
$filePath = $folderPath . '/' . $filename;
$uploadResponse = NextCloudHelper::uploadFile(
$folderPath,
$file->getContent(),
$filename
);
if (is_array($uploadResponse) && isset($uploadResponse['success']) && $uploadResponse['success'] === false) {
throw ValidationException::withMessages([
"attachments.{$index}.file_path" => $uploadResponse['message'] ?? 'Failed to upload attachment.',
]);
}
$payload[] = [
'file_category' => $category,
'file_path' => $filePath,
];
}
return $payload;
}
} }
resources/views/backend/pages/forms/other/create.blade.php
+296 -40
View File
@@ -65,50 +65,61 @@
<label class="form-label">Tanggal <span class="font-italic font-weight-normal">(required)</span></label> <label class="form-label">Tanggal <span class="font-italic font-weight-normal">(required)</span></label>
<input type="date" class="form-control" name="tanggal" id="tanggal" required value="{{ old('tanggal') }}"> <input type="date" class="form-control" name="tanggal" id="tanggal" required value="{{ old('tanggal') }}">
</div> </div>
<!-- Add field -->
<!-- <div class="mb-3">
<label class="form-label">Nama Penerima <span class="font-italic font-weight-normal">(required)</span></label>
<input type="text" class="form-control" name="name" required value="{{ old('name') }}">
</div>
<div class="mb-3">
<label class="form-label">NPWP / NIK <span class="font-italic font-weight-normal">(required)</span></label>
<input type="text" class="form-control" name="nik_or_npwp" id="nik_or_npwp" required value="{{ old('nik_or_npwp') }}">
</div>
</div> </div>
<div class="col-md-6">
<div class="mb-3">
<label class="form-label">Alamat <span class="font-italic font-weight-normal">(required)</span></label>
<input type="text" class="form-control" name="alamat" id="alamat" required value="{{ old('alamat') }}">
</div> -->
<div class="col-lg-6">
<div class="col-md-6">
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Total <span class="font-italic font-weight-normal">(required)</span></label> <label class="form-label">Total <span class="font-italic font-weight-normal">(required)</span></label>
<input type="string" class="form-control" name="total" id="total" required value="{{ old('total') }}"> <input type="string" class="form-control" name="total" id="total" required value="{{ old('total') }}">
</div> </div>
</div>
<div class="col-md-6">
<div class="mb-3">
<label class="form-label">Bukti Total <span class="font-italic font-weight-normal">(required)</span></label>
<input type="file" class="form-control" name="bukti_total" value="{{ old('bukti_total') }}" required>
</div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Keterangan <span class="font-italic font-weight-normal">(required)</span></label> <label class="form-label">Keterangan <span class="font-italic font-weight-normal">(required)</span></label>
<textarea class="form-control" name="keterangan" id="keterangan" required>{{ old('keterangan') }}</textarea> <textarea class="form-control" name="keterangan" id="keterangan" required>{{ old('keterangan') }}</textarea>
</div> </div>
</div> </div>
<!-- </div> -->
<button type="submit" class="btn btn-primary ml-2">Submit</button> <div class="col-12">
</div> <div class="mb-3">
<div class="d-flex align-items-center justify-content-between">
<label class="form-label mb-0">Lampiran</label>
<button type="button" class="btn btn-outline-primary btn-sm" id="other-add-attachment-row">
<i class="fas fa-plus mr-1"></i> Tambah Lampiran
</button>
</div>
<p class="text-muted small mt-1 mb-2">
Maksimal 10 MB per file. Tidak diperbolehkan mengunggah file berformat <code>.exe</code>, <code>.dll</code>, <code>.sh</code>, <code>.bat</code>, <code>.cmd</code>, atau <code>.msi</code>.
</p>
<div class="table-responsive">
<table class="table table-bordered align-middle" id="other-attachments-table">
<thead class="table-light">
<tr>
<th style="width: 30%">Kategori</th>
<th style="width: 45%">Lampiran</th>
<th style="width: 15%" class="text-center">Preview</th>
<th style="width: 10%" class="text-center">Aksi</th>
</tr>
</thead>
<tbody>
<tr class="other-attachments-empty text-center text-muted">
<td colspan="4">Belum ada lampiran.</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary ml-2">Submit</button>
</div>
</div>
</form> </form>
@include('backend.components.attachment-preview-modal', [
'modalId' => 'otherAttachmentPreviewModal',
'title' => 'Preview Lampiran',
])
<div id="loading-spinner-overlay" class="d-none"> <div id="loading-spinner-overlay" class="d-none">
<div class="spinner-wrapper"> <div class="spinner-wrapper">
<div class="spinner-border text-primary" role="status"> <div class="spinner-border text-primary" role="status">
@@ -123,19 +134,264 @@
<script> <script>
new AutoNumeric('#total', { new AutoNumeric('#total', {
digitGroupSeparator: '.', // Pemisah ribuan digitGroupSeparator: '.',
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal) decimalCharacter: ',',
currencySymbol: 'Rp.', // Simbol mata uang currencySymbol: 'Rp.',
decimalPlaces: 0, // Tidak ada angka desimal decimalPlaces: 0,
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan unformatOnSubmit: true
}); });
document.getElementById('expense-form').addEventListener('submit', function (e) { const spinnerOverlay = document.getElementById('loading-spinner-overlay');
const spinnerOverlay = document.getElementById('loading-spinner-overlay');
spinnerOverlay.classList.remove('d-none'); // Show overlay document.getElementById('expense-form').addEventListener('submit', function () {
spinnerOverlay.classList.add('d-flex'); // Use flexbox for centering spinnerOverlay.classList.remove('d-none');
spinnerOverlay.classList.add('d-flex');
}); });
const attachmentCategories = @json($attachmentCategories ?? ($otherAttachmentCategories ?? []));
const blockedExtensions = ['exe', 'dll', 'sh', 'bat', 'cmd', 'msi'];
const maxFileSizeBytes = 10 * 1024 * 1024;
const otherAttachmentEmptyRow = '<tr class="other-attachments-empty text-center text-muted"><td colspan="4">Belum ada lampiran.</td></tr>';
let otherAttachmentIndex = 0;
function escapeHtml(value) {
return String(value || '')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#039;');
}
function categoryToLabel(value) {
if (!value) {
return 'Pilih Kategori';
}
return value.replace(/_/g, ' ').replace(/\b\w/g, function (char) {
return char.toUpperCase();
});
}
function detectPreviewType(extension) {
const images = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'];
if (images.indexOf(extension) !== -1) {
return 'image';
}
if (extension === 'pdf') {
return 'pdf';
}
return 'other';
}
function buildCategoryOptions() {
return attachmentCategories.map(function (category) {
return '<option value="' + category + '">' + escapeHtml(categoryToLabel(category)) + '</option>';
}).join('');
}
function setInlinePreview($row, type, source) {
const $box = $row.find('.other-attachment-inline-preview');
$box.removeClass('bg-light').html('<i class="fas fa-file-upload text-muted"></i>');
if (type === 'image' && source) {
$box.addClass('bg-light').html(
'<img src="' + source + '" class="img-thumbnail" style="width:100%;height:100%;object-fit:cover;" alt="Preview">'
);
} else if (type === 'pdf') {
$box.addClass('bg-light').html('<i class="fas fa-file-pdf text-danger fa-lg"></i>');
} else if (type === 'other') {
$box.addClass('bg-light').html('<i class="fas fa-file-alt text-secondary fa-lg"></i>');
}
}
function resetAttachmentRowData($row, clearInput = true) {
const existingUrl = $row.data('objectUrl');
if (existingUrl) {
URL.revokeObjectURL(existingUrl);
}
$row.removeData('objectUrl')
.removeData('previewType')
.removeData('previewSource')
.removeData('previewFileName');
setInlinePreview($row, null, null);
$row.find('.other-preview-attachment').addClass('d-none');
$row.find('.other-preview-filename').text('');
if (clearInput) {
$row.find('.other-attachment-file').val('');
}
}
function openAttachmentModal(modalSelector, options) {
const settings = Object.assign({
title: 'Lampiran',
type: 'other',
source: null,
fileName: 'Lampiran'
}, options || {});
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(settings.title || 'Lampiran');
$image.addClass('d-none').attr('src', '');
$object.addClass('d-none').attr('data', '').attr('src', '');
$placeholder.removeClass('d-none').html('Tidak ada file untuk ditampilkan.');
if (settings.type === 'image' && settings.source) {
$image.attr('src', settings.source).removeClass('d-none');
$placeholder.addClass('d-none');
} else if (settings.type === 'pdf' && settings.source) {
$object.attr('data', settings.source).attr('src', settings.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 addOtherAttachmentRow() {
const $tbody = $('#other-attachments-table tbody');
if ($tbody.find('.other-attachments-empty').length) {
$tbody.empty();
}
const index = otherAttachmentIndex++;
const rowHtml = `
<tr class="other-attachment-row" data-index="${index}">
<td>
<select class="form-control other-attachment-category" name="attachments[${index}][file_category]" required>
<option value="">${escapeHtml(categoryToLabel(''))}</option>
${buildCategoryOptions()}
</select>
</td>
<td>
<div class="d-flex align-items-center">
<div class="other-attachment-inline-preview border rounded d-flex align-items-center justify-content-center bg-white mr-2" style="width:56px;height:56px;">
<i class="fas fa-file-upload text-muted"></i>
</div>
<input type="file" class="form-control other-attachment-file" name="attachments[${index}][file_path]">
</div>
<div class="small text-muted mt-1 other-preview-filename"></div>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-secondary other-preview-attachment d-none">
Preview
</button>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-danger other-remove-attachment-row">
<i class="fas fa-trash"></i>
</button>
</td>
</tr>
`;
$tbody.append(rowHtml);
}
$(function () {
$('#other-add-attachment-row').on('click', function () {
addOtherAttachmentRow();
});
$(document).on('click', '.other-remove-attachment-row', function () {
const $row = $(this).closest('tr');
const $tbody = $('#other-attachments-table tbody');
resetAttachmentRowData($row, true);
$row.remove();
if (!$tbody.find('.other-attachment-row').length) {
$tbody.html(otherAttachmentEmptyRow);
}
});
$(document).on('change', '.other-attachment-file', function () {
const $input = $(this);
const $row = $input.closest('tr');
const previewButton = $row.find('.other-preview-attachment');
const filenameHolder = $row.find('.other-preview-filename');
resetAttachmentRowData($row, false);
filenameHolder.text('');
const file = this.files && this.files[0];
if (!file) {
return;
}
if (file.size > maxFileSizeBytes) {
alert('Ukuran file melebihi 10 MB.');
$input.val('');
return;
}
const extension = (file.name.split('.').pop() || '').toLowerCase();
if (blockedExtensions.indexOf(extension) !== -1) {
alert('Tipe file tidak diperbolehkan.');
$input.val('');
return;
}
filenameHolder.text(escapeHtml(file.name));
const previewType = detectPreviewType(extension);
$row.data('previewType', previewType);
$row.data('previewFileName', file.name);
$row.data('previewSource', null);
$row.removeData('objectUrl');
if (previewType === 'image') {
const reader = new FileReader();
reader.onload = function (event) {
const source = event.target.result;
$row.data('previewSource', source);
setInlinePreview($row, previewType, source);
};
reader.readAsDataURL(file);
} else if (previewType === 'pdf') {
const objectUrl = URL.createObjectURL(file);
$row.data('previewSource', objectUrl);
$row.data('objectUrl', objectUrl);
setInlinePreview($row, previewType, null);
} else {
const objectUrl = URL.createObjectURL(file);
$row.data('previewSource', objectUrl);
$row.data('objectUrl', objectUrl);
setInlinePreview($row, 'other', null);
}
previewButton.removeClass('d-none');
});
$(document).on('click', '.other-preview-attachment', function () {
const $row = $(this).closest('tr');
const previewType = $row.data('previewType') || 'other';
const previewSource = $row.data('previewSource') || null;
const fileName = $row.data('previewFileName') || 'Lampiran';
if (previewType === 'image' || previewType === 'pdf') {
openAttachmentModal('#otherAttachmentPreviewModal', {
title: fileName,
type: previewType,
source: previewSource,
fileName: fileName
});
} else if (previewSource) {
window.open(previewSource, '_blank');
}
});
addOtherAttachmentRow();
});
</script> </script>
@endsection @endsection
resources/views/backend/pages/forms/other/edit.blade.php
+446 -17
View File
@@ -66,16 +66,12 @@
<label class="form-label">Tanggal <span class="font-italic font-weight-normal">(required)</span></label> <label class="form-label">Tanggal <span class="font-italic font-weight-normal">(required)</span></label>
<input type="date" class="form-control" name="tanggal" id="tanggal" required value="{{ $form->tanggal }}"> <input type="date" class="form-control" name="tanggal" id="tanggal" required value="{{ $form->tanggal }}">
</div> </div>
<div class="mb-3">
<label class="form-label">Total <span class="font-italic font-weight-normal">(required)</span></label>
<input type="string" class="form-control" name="total" id="total" required value="{{ $form->total }}">
</div>
</div> </div>
<div class="col-lg-6"> <div class="col-lg-6">
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Bukti Total <span class="font-italic font-weight-normal">(required)</span></label> <label class="form-label">Total <span class="font-italic font-weight-normal">(required)</span></label>
<input type="file" class="form-control" name="bukti_total" value="{{ $form->bukti_total }}"> <input type="string" class="form-control" name="total" id="total" required value="{{ $form->total }}">
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Keterangan <span class="font-italic font-weight-normal">(required)</span></label> <label class="form-label">Keterangan <span class="font-italic font-weight-normal">(required)</span></label>
@@ -83,10 +79,108 @@
</div> </div>
</div> </div>
<button type="submit" class="btn btn-primary ml-2">Update</button> <div class="col-12">
<div class="mb-4">
<label class="form-label mb-0">Lampiran Saat Ini</label>
<p class="text-muted small mt-1 mb-2">Gunakan tombol preview untuk melihat lampiran yang sudah diunggah.</p>
<div class="table-responsive">
<table class="table table-bordered align-middle" id="other-existing-attachments-table">
<thead class="table-light">
<tr>
<th style="width: 30%">Kategori</th>
<th style="width: 35%">Nama File</th>
<th style="width: 15%" class="text-center">Preview</th>
<th style="width: 20%" class="text-center">Aksi</th>
</tr>
</thead>
<tbody>
@forelse ($attachments as $attachment)
<tr class="other-existing-attachment-row" data-attachment-id="{{ $attachment['id'] }}">
<td>{{ $attachment['file_category'] ? ucwords(str_replace('_', ' ', $attachment['file_category'])) : '-' }}</td>
<td>{{ $attachment['filename'] ?? basename($attachment['file_path']) }}</td>
<td class="text-center">
<button type="button"
class="btn btn-sm btn-outline-secondary other-preview-existing-attachment"
data-preview-url="{{ $attachment['preview_url'] }}"
data-download-url="{{ $attachment['download_url'] }}"
data-preview-type="{{ $attachment['preview_type'] }}"
data-file-name="{{ $attachment['filename'] ?? basename($attachment['file_path']) }}">
Preview
</button>
</td>
<td class="text-center">
<a href="{{ $attachment['download_url'] }}"
target="_blank"
class="btn btn-sm btn-outline-primary mr-1">
Download
</a>
@if($attachment['can_delete'])
<button type="button"
class="btn btn-sm btn-outline-danger other-delete-attachment"
data-delete-url="{{ route('forms.other.attachments.destroy', [$form->id, $attachment['id']]) }}">
<i class="fas fa-trash"></i>
</button>
@endif
</td>
</tr>
@empty
<tr class="other-existing-attachments-empty text-center text-muted">
<td colspan="4">Belum ada lampiran.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
<div class="col-12">
<div class="mb-3">
<div class="d-flex align-items-center justify-content-between">
<label class="form-label mb-0">Tambah Lampiran Baru</label>
<button type="button" class="btn btn-outline-primary btn-sm" id="other-add-new-attachment-row">
<i class="fas fa-plus mr-1"></i> Tambah Lampiran
</button>
</div>
<p class="text-muted small mt-1 mb-2">
Maksimal 10 MB per file. File berformat <code>.exe</code>, <code>.dll</code>, <code>.sh</code>, <code>.bat</code>, <code>.cmd</code>, atau <code>.msi</code> tidak diperbolehkan.
</p>
<div class="table-responsive">
<table class="table table-bordered align-middle" id="other-new-attachments-table">
<thead class="table-light">
<tr>
<th style="width: 30%">Kategori</th>
<th style="width: 45%">Lampiran</th>
<th style="width: 15%" class="text-center">Preview</th>
<th style="width: 10%" class="text-center">Aksi</th>
</tr>
</thead>
<tbody>
<tr class="other-new-attachments-empty text-center text-muted">
<td colspan="4">Belum ada lampiran baru.</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary ml-2">Update</button>
</div>
</div> </div>
</form> </form>
@include('backend.components.attachment-preview-modal', [
'modalId' => 'otherExistingAttachmentPreviewModal',
'title' => 'Preview Lampiran',
])
@include('backend.components.attachment-preview-modal', [
'modalId' => 'otherNewAttachmentPreviewModal',
'title' => 'Preview Lampiran',
])
<div id="loading-spinner-overlay" class="d-none"> <div id="loading-spinner-overlay" class="d-none">
<div class="spinner-wrapper"> <div class="spinner-wrapper">
<div class="spinner-border text-primary" role="status"> <div class="spinner-border text-primary" role="status">
@@ -99,19 +193,354 @@
</div> </div>
</section> </section>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script> <script>
new AutoNumeric('#total', { new AutoNumeric('#total', {
digitGroupSeparator: '.', // Pemisah ribuan digitGroupSeparator: '.',
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal) decimalCharacter: ',',
currencySymbol: 'Rp.', // Simbol mata uang currencySymbol: 'Rp.',
decimalPlaces: 0, // Tidak ada angka desimal decimalPlaces: 0,
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan unformatOnSubmit: true
}); });
const spinnerOverlay = document.getElementById('loading-spinner-overlay');
document.getElementById('expense-form').addEventListener('submit', function (e) {
const spinnerOverlay = document.getElementById('loading-spinner-overlay'); document.getElementById('expense-form').addEventListener('submit', function () {
spinnerOverlay.classList.remove('d-none'); // Show overlay spinnerOverlay.classList.remove('d-none');
spinnerOverlay.classList.add('d-flex'); // Use flexbox for centering spinnerOverlay.classList.add('d-flex');
});
const attachmentCategories = @json($attachmentCategories ?? ($otherAttachmentCategories ?? []));
const blockedExtensions = ['exe', 'dll', 'sh', 'bat', 'cmd', 'msi'];
const maxFileSizeBytes = 10 * 1024 * 1024;
const existingEmptyRow = '<tr class="other-existing-attachments-empty text-center text-muted"><td colspan="4">Belum ada lampiran.</td></tr>';
const newEmptyRow = '<tr class="other-new-attachments-empty text-center text-muted"><td colspan="4">Belum ada lampiran baru.</td></tr>';
let otherNewAttachmentIndex = 0;
function escapeHtml(value) {
return String(value || '')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#039;');
}
function categoryToLabel(value) {
if (!value) {
return 'Pilih Kategori';
}
return value.replace(/_/g, ' ').replace(/\b\w/g, function (char) {
return char.toUpperCase();
});
}
function detectPreviewType(extension) {
const images = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp'];
if (images.indexOf(extension) !== -1) {
return 'image';
}
if (extension === 'pdf') {
return 'pdf';
}
return 'other';
}
function buildCategoryOptions() {
return attachmentCategories.map(function (category) {
return '<option value="' + category + '">' + escapeHtml(categoryToLabel(category)) + '</option>';
}).join('');
}
function setInlinePreview($row, type, source) {
const $box = $row.find('.other-new-attachment-inline-preview');
$box.removeClass('bg-light').html('<i class="fas fa-file-upload text-muted"></i>');
if (type === 'image' && source) {
$box.addClass('bg-light').html(
'<img src="' + source + '" class="img-thumbnail" style="width:100%;height:100%;object-fit:cover;" alt="Preview">'
);
} else if (type === 'pdf') {
$box.addClass('bg-light').html('<i class="fas fa-file-pdf text-danger fa-lg"></i>');
} else if (type === 'other') {
$box.addClass('bg-light').html('<i class="fas fa-file-alt text-secondary fa-lg"></i>');
}
}
function resetNewAttachmentRowData($row, clearInput = true) {
const existingUrl = $row.data('objectUrl');
if (existingUrl) {
URL.revokeObjectURL(existingUrl);
}
$row.removeData('objectUrl')
.removeData('previewType')
.removeData('previewSource')
.removeData('previewFileName');
setInlinePreview($row, null, null);
$row.find('.other-preview-new-attachment').addClass('d-none');
$row.find('.other-new-preview-filename').text('');
if (clearInput) {
$row.find('.other-new-attachment-file').val('');
}
}
function openAttachmentModal(modalSelector, options) {
const settings = Object.assign({
title: 'Lampiran',
type: 'other',
source: null,
downloadUrl: null,
fileName: 'Lampiran'
}, options || {});
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(settings.title || 'Lampiran');
$image.addClass('d-none').attr('src', '');
$object.addClass('d-none').attr('data', '').attr('src', '');
$placeholder.removeClass('d-none').html('Tidak ada file untuk ditampilkan.');
if (settings.type === 'image' && settings.source) {
$image.attr('src', settings.source).removeClass('d-none');
$placeholder.addClass('d-none');
} else if (settings.type === 'pdf' && settings.source) {
$object.attr('data', settings.source).attr('src', settings.source).removeClass('d-none');
$placeholder.addClass('d-none');
} else {
const safeName = escapeHtml(settings.fileName || 'Lampiran');
let message = '<p class="mb-2">' + safeName + '</p><p class="text-muted mb-0">Preview tidak tersedia. Silakan unduh file untuk melihat konten.</p>';
if (settings.downloadUrl) {
message += '<div class="mt-3"><a href="' + settings.downloadUrl + '" target="_blank" class="btn btn-sm btn-outline-primary">Download</a></div>';
}
$placeholder.html(message);
}
if (window.bootstrap && bootstrap.Modal && typeof bootstrap.Modal.getOrCreateInstance === 'function') {
bootstrap.Modal.getOrCreateInstance($modal[0]).show();
} else {
$modal.modal('show');
}
}
function refreshExistingEmptyState() {
const $tbody = $('#other-existing-attachments-table tbody');
if (!$tbody.find('.other-existing-attachment-row').length) {
$tbody.html(existingEmptyRow);
}
}
function refreshNewEmptyState() {
const $tbody = $('#other-new-attachments-table tbody');
if (!$tbody.find('.other-new-attachment-row').length) {
$tbody.html(newEmptyRow);
}
}
function addOtherNewAttachmentRow() {
const $tbody = $('#other-new-attachments-table tbody');
if ($tbody.find('.other-new-attachments-empty').length) {
$tbody.empty();
}
const index = otherNewAttachmentIndex++;
const rowHtml = `
<tr class="other-new-attachment-row" data-index="${index}">
<td>
<select class="form-control other-new-attachment-category" name="attachments[${index}][file_category]" required>
<option value="">${escapeHtml(categoryToLabel(''))}</option>
${buildCategoryOptions()}
</select>
</td>
<td>
<div class="d-flex align-items-center">
<div class="other-new-attachment-inline-preview border rounded d-flex align-items-center justify-content-center bg-white mr-2" style="width:56px;height:56px;">
<i class="fas fa-file-upload text-muted"></i>
</div>
<input type="file" class="form-control other-new-attachment-file" name="attachments[${index}][file_path]">
</div>
<div class="small text-muted mt-1 other-new-preview-filename"></div>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-secondary other-preview-new-attachment d-none">
Preview
</button>
</td>
<td class="text-center">
<button type="button" class="btn btn-sm btn-outline-danger other-remove-new-attachment-row">
<i class="fas fa-trash"></i>
</button>
</td>
</tr>
`;
$tbody.append(rowHtml);
}
$(function () {
$('#other-add-new-attachment-row').on('click', function () {
addOtherNewAttachmentRow();
});
$(document).on('click', '.other-remove-new-attachment-row', function () {
const $row = $(this).closest('tr');
const $tbody = $('#other-new-attachments-table tbody');
resetNewAttachmentRowData($row, true);
$row.remove();
refreshNewEmptyState();
});
$(document).on('change', '.other-new-attachment-file', function () {
const $input = $(this);
const $row = $input.closest('tr');
const previewButton = $row.find('.other-preview-new-attachment');
const filenameHolder = $row.find('.other-new-preview-filename');
resetNewAttachmentRowData($row, false);
filenameHolder.text('');
const file = this.files && this.files[0];
if (!file) {
return;
}
if (file.size > maxFileSizeBytes) {
alert('Ukuran file melebihi 10 MB.');
$input.val('');
return;
}
const extension = (file.name.split('.').pop() || '').toLowerCase();
if (blockedExtensions.indexOf(extension) !== -1) {
alert('Tipe file tidak diperbolehkan.');
$input.val('');
return;
}
filenameHolder.text(escapeHtml(file.name));
const previewType = detectPreviewType(extension);
$row.data('previewType', previewType);
$row.data('previewFileName', file.name);
$row.data('previewSource', null);
$row.removeData('objectUrl');
if (previewType === 'image') {
const reader = new FileReader();
reader.onload = function (event) {
const source = event.target.result;
$row.data('previewSource', source);
setInlinePreview($row, previewType, source);
};
reader.readAsDataURL(file);
} else if (previewType === 'pdf') {
const objectUrl = URL.createObjectURL(file);
$row.data('previewSource', objectUrl);
$row.data('objectUrl', objectUrl);
setInlinePreview($row, previewType, null);
} else {
const objectUrl = URL.createObjectURL(file);
$row.data('previewSource', objectUrl);
$row.data('objectUrl', objectUrl);
setInlinePreview($row, 'other', null);
}
previewButton.removeClass('d-none');
});
$(document).on('click', '.other-preview-new-attachment', function () {
const $row = $(this).closest('tr');
const previewType = $row.data('previewType') || 'other';
const previewSource = $row.data('previewSource') || null;
const fileName = $row.data('previewFileName') || 'Lampiran';
if (previewType === 'image' || previewType === 'pdf') {
openAttachmentModal('#otherNewAttachmentPreviewModal', {
title: fileName,
type: previewType,
source: previewSource,
fileName: fileName
});
} else if (previewSource) {
window.open(previewSource, '_blank');
}
});
$(document).on('click', '.other-preview-existing-attachment', function () {
const $button = $(this);
const previewType = $button.data('preview-type') || 'other';
const previewUrl = $button.data('preview-url') || null;
const downloadUrl = $button.data('download-url') || null;
const fileName = $button.data('file-name') || 'Lampiran';
if (previewType === 'image' || previewType === 'pdf') {
if (!previewUrl) {
if (downloadUrl) {
window.open(downloadUrl, '_blank');
}
return;
}
openAttachmentModal('#otherExistingAttachmentPreviewModal', {
title: fileName,
type: previewType,
source: previewUrl,
downloadUrl: downloadUrl,
fileName: fileName
});
} else {
if (downloadUrl) {
window.open(downloadUrl, '_blank');
}
}
});
$(document).on('click', '.other-delete-attachment', function () {
const $button = $(this);
const deleteUrl = $button.data('delete-url');
const $row = $button.closest('tr');
if (!deleteUrl) {
return;
}
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();
refreshExistingEmptyState();
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');
}
});
});
});
refreshExistingEmptyState();
refreshNewEmptyState();
addOtherNewAttachmentRow();
}); });
</script> </script>
@endsection @endsection
resources/views/backend/pages/forms/other/view.blade.php
+228 -107
View File
@@ -56,16 +56,64 @@
<label class="form-label">Total</label> <label class="form-label">Total</label>
<input type="string" class="form-control" name="total" id="total" readonly value="{{ $form->total }}"> <input type="string" class="form-control" name="total" id="total" readonly value="{{ $form->total }}">
</div> </div>
<div class="mb-3">
<label class="form-label">Bukti Total</label><br>
<a href="{{ $form->bukti_total }}" target="_blank">Lihat Bukti</a>
</div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Keterangan</label> <label class="form-label">Keterangan</label>
<textarea class="form-control" name="keterangan" id="keterangan" readonly>{{ $form->keterangan }}</textarea> <textarea class="form-control" name="keterangan" id="keterangan" readonly>{{ $form->keterangan }}</textarea>
</div> </div>
</div> </div>
<div class="col-12">
<div class="mb-4">
<label class="form-label mb-0">Lampiran</label>
<p class="text-muted small mt-1 mb-2">Gunakan tombol preview untuk melihat lampiran.</p>
<div class="table-responsive">
<table class="table table-bordered align-middle" id="other-view-attachments-table">
<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)
<tr class="other-view-attachment-row">
<td>{{ $attachment['file_category'] ? ucwords(str_replace('_', ' ', $attachment['file_category'])) : '-' }}</td>
<td>{{ $attachment['filename'] ?? basename($attachment['file_path']) }}</td>
<td class="text-center">
<button type="button"
class="btn btn-sm btn-outline-secondary other-preview-attachment"
data-preview-url="{{ $attachment['preview_url'] }}"
data-download-url="{{ $attachment['download_url'] }}"
data-preview-type="{{ $attachment['preview_type'] }}"
data-file-name="{{ $attachment['filename'] ?? basename($attachment['file_path']) }}">
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="other-view-attachments-empty text-center text-muted">
<td colspan="4">Tidak ada lampiran.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
@include('backend.components.attachment-preview-modal', [
'modalId' => 'otherViewAttachmentPreviewModal',
'title' => 'Preview Lampiran',
])
<div class="col-lg-12"> <div class="col-lg-12">
<div class="mb-3"> <div class="mb-3">
<label class="form-label">Status</label> <label class="form-label">Status</label>
@@ -261,15 +309,105 @@
@section('scripts') @section('scripts')
<script> <script>
new AutoNumeric('#total', { new AutoNumeric('#total', {
digitGroupSeparator: '.', // Pemisah ribuan digitGroupSeparator: '.',
decimalCharacter: ',', // Karakter desimal (tidak digunakan karena tanpa desimal) decimalCharacter: ',',
currencySymbol: 'Rp.', // Simbol mata uang currencySymbol: 'Rp.',
decimalPlaces: 0, // Tidak ada angka desimal decimalPlaces: 0,
unformatOnSubmit: true // Nilai asli tanpa format saat dikirimkan unformatOnSubmit: true
});
function escapeHtml(value) {
return String(value || '')
.replace(/&/g, '&amp;')
.replace(/</g, '&lt;')
.replace(/>/g, '&gt;')
.replace(/"/g, '&quot;')
.replace(/'/g, '&#039;');
}
function openAttachmentModal(modalSelector, options) {
const settings = Object.assign({
title: 'Lampiran',
type: 'other',
source: null,
downloadUrl: null,
fileName: 'Lampiran'
}, options || {});
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(settings.title || 'Lampiran');
$image.addClass('d-none').attr('src', '');
$object.addClass('d-none').attr('data', '').attr('src', '');
$placeholder.removeClass('d-none').html('Tidak ada file untuk ditampilkan.');
if (settings.type === 'image' && settings.source) {
$image.attr('src', settings.source).removeClass('d-none');
$placeholder.addClass('d-none');
} else if (settings.type === 'pdf' && settings.source) {
$object.attr('data', settings.source).attr('src', settings.source).removeClass('d-none');
$placeholder.addClass('d-none');
} else {
const safeName = escapeHtml(settings.fileName || 'Lampiran');
let message = '<p class="mb-2">' + safeName + '</p><p class="text-muted mb-0">Preview tidak tersedia. Silakan unduh file untuk melihat konten.</p>';
if (settings.downloadUrl) {
message += '<div class="mt-3"><a href="' + settings.downloadUrl + '" target="_blank" class="btn btn-sm btn-outline-primary">Download</a></div>';
}
$placeholder.html(message);
}
if (window.bootstrap && bootstrap.Modal && typeof bootstrap.Modal.getOrCreateInstance === 'function') {
bootstrap.Modal.getOrCreateInstance($modal[0]).show();
} else {
$modal.modal('show');
}
}
function buildAttachmentLinks(attachments) {
if (!attachments || !attachments.length) {
return '-';
}
return attachments.map(function (item, index) {
const label = escapeHtml(item.filename || item.file_category || ('Lampiran ' + (index + 1)));
const downloadUrl = item.download_url || '#';
return '<div><a href="' + downloadUrl + '" target="_blank">' + label + '</a></div>';
}).join('');
}
$(document).on('click', '.other-preview-attachment', function () {
const $button = $(this);
const previewType = $button.data('preview-type') || 'other';
const previewUrl = $button.data('preview-url') || null;
const downloadUrl = $button.data('download-url') || null;
const fileName = $button.data('file-name') || 'Lampiran';
if (previewType === 'image' || previewType === 'pdf') {
if (!previewUrl) {
if (downloadUrl) {
window.open(downloadUrl, '_blank');
}
return;
}
openAttachmentModal('#otherViewAttachmentPreviewModal', {
title: fileName,
type: previewType,
source: previewUrl,
downloadUrl: downloadUrl,
fileName: fileName
});
} else {
if (downloadUrl) {
window.open(downloadUrl, '_blank');
}
}
}); });
</script>
<script>
$(document).on('click', '.open-reject-modal', function () { $(document).on('click', '.open-reject-modal', function () {
const rejectUrl = $(this).data('action'); const rejectUrl = $(this).data('action');
$('#rejectForm').attr('action', rejectUrl); $('#rejectForm').attr('action', rejectUrl);
@@ -286,124 +424,107 @@
$('#rejectRemarks').val(''); $('#rejectRemarks').val('');
}); });
// Handle Approve Button Click $(document).on('click', '.open-approve-modal', function() {
$(document).on('click', '.open-approve-modal', function() { const approveUrl = $(this).data('id');
const approveUrl = $(this).data('id');
// Show spinner and hide content initially $('#loadingSpinner').show();
$('#loadingSpinner').show(); $('#modalContent').addClass('d-none');
$('#modalContent').addClass('d-none');
$('#approveForm').attr('action', approveUrl); // Set the form action $('#approveForm').attr('action', approveUrl);
$('#loadingSpinner').addClass('d-flex'); $('#loadingSpinner').addClass('d-flex');
$('#approveModal').modal('show'); // Show the modal $('#approveModal').modal('show');
// Get detail from /forms/vehicle/detail/{id} $.get(approveUrl.replace(/approve2|final-approve/g, 'detail'), function (data) {
$.get(approveUrl.replace(/approve2|final-approve/g, 'detail'), function (data) { const formatter = new Intl.NumberFormat('id-ID', {
const formatter = new Intl.NumberFormat('id-ID', { style: 'currency',
style: 'currency', currency: 'IDR',
currency: 'IDR', minimumFractionDigits: 0
minimumFractionDigits: 0 });
});
$('#total_value').text(formatter.format(data.total)); $('#total_value').text(formatter.format(data.total));
// Detail data $('#user').text(data.user.name);
$('#user').text(data.user.name); $('#expense_number').text(data.expense_number);
$('#expense_number').text(data.expense_number); $('#tanggal').text(new Date(data.created_at).toLocaleDateString('id-ID', {
$('#tanggal').text(new Date(data.created_at).toLocaleDateString('id-ID', { year: 'numeric',
year: 'numeric', month: 'long',
month: 'long', day: 'numeric'
day: 'numeric' }));
}));
$('#kategori').text(data.kategori.name);
$('#keterangan').text(data.keterangan);
$('#bukti_total').html(data.total ? '<a href="' + data.total + '" target="_blank">Download</a>' : '-'); $('#kategori').text(data.kategori.name);
$('#keterangan').text(data.keterangan);
// Hide spinner and show content $('#bukti_total').html(buildAttachmentLinks(data.attachments));
$('#loadingSpinner').hide();
$('#loadingSpinner').removeClass('d-flex');
$('#loadingSpinner').addClass('d-none');
$('#modalContent').removeClass('d-none');
// Reset the total to zero $('#loadingSpinner').hide();
$('#total').val(0); $('#loadingSpinner').removeClass('d-flex');
}); $('#loadingSpinner').addClass('d-none');
}); $('#modalContent').removeClass('d-none');
// Handle Approve Button Click $('#total').val(0);
$(document).on('click', '.final-approve-modal', function() { });
const approveUrl = $(this).data('id'); });
// Show spinner and hide content initially $(document).on('click', '.final-approve-modal', function() {
$('#finalLoadingSpinner').show(); const approveUrl = $(this).data('id');
$('#finalModalContent').addClass('d-none');
$('#finalApproveForm').attr('action', approveUrl); // Set the form action $('#finalLoadingSpinner').show();
$('#finalLoadingSpinner').addClass('d-flex'); $('#finalModalContent').addClass('d-none');
$('#finalApproveModal').modal('show'); // Show the modal
// Get detail from /forms/vehicle/detail/{id} $('#finalApproveForm').attr('action', approveUrl);
$.get(approveUrl.replace('approve', 'detail'), function (data) { $('#finalLoadingSpinner').addClass('d-flex');
const formatter = new Intl.NumberFormat('id-ID', { $('#finalApproveModal').modal('show');
style: 'currency',
currency: 'IDR',
minimumFractionDigits: 0
});
$('#final_total_value').text(formatter.format(data.total)); $.get(approveUrl.replace('approve', 'detail'), function (data) {
const formatter = new Intl.NumberFormat('id-ID', {
style: 'currency',
currency: 'IDR',
minimumFractionDigits: 0
});
// Assign data values to checkboxes $('#final_total_value').text(formatter.format(data.total));
$('#final_total').data('value', data.total); $('#final_total').data('value', data.total);
// Detail data $('#final_user').text(data.user.name);
$('#final_user').text(data.user.name); $('#final_expense_number').text(data.expense_number);
$('#final_expense_number').text(data.expense_number); $('#final_tanggal').text(new Date(data.created_at).toLocaleDateString('id-ID', {
$('#final_tanggal').text(new Date(data.created_at).toLocaleDateString('id-ID', { year: 'numeric',
year: 'numeric', month: 'long',
month: 'long', day: 'numeric'
day: 'numeric' }));
}));
$('#final_kategori').text(data.kategori.name); $('#final_kategori').text(data.kategori.name);
$('#final_keterangan').text(data.keterangan); $('#final_keterangan').text(data.keterangan);
$('#final_bukti_total').html(data.bukti_total ? '<a href="' + data.bukti_total + '" target="_blank">Download</a>' : '-'); $('#final_bukti_total').html(buildAttachmentLinks(data.attachments));
// Hide spinner and show content $('#finalLoadingSpinner').hide();
$('#finalLoadingSpinner').hide(); $('#finalLoadingSpinner').removeClass('d-flex');
$('#finalLoadingSpinner').removeClass('d-flex'); $('#finalLoadingSpinner').addClass('d-none');
$('#finalLoadingSpinner').addClass('d-none'); $('#finalModalContent').removeClass('d-none');
$('#finalModalContent').removeClass('d-none');
// Reset the total to zero $('#total').val(0);
$('#total').val(0); });
}); });
});
// Update total dynamically $('.custom-control-input').on('change', function () {
$('.custom-control-input').on('change', function () { let total = 0;
let total = 0; $('.custom-control-input:checked').each(function () {
$('.custom-control-input:checked').each(function () { total += parseFloat($(this).data('value') || 0);
total += parseFloat($(this).data('value') || 0); });
});
const formatter = new Intl.NumberFormat('id-ID', { const formatter = new Intl.NumberFormat('id-ID', {
style: 'currency', style: 'currency',
currency: 'IDR', currency: 'IDR',
minimumFractionDigits: 0, minimumFractionDigits: 0,
}); });
$('#total').val(formatter.format(total)); $('#total').val(formatter.format(total));
}); });
$('#finalApproveModal').on('hidden.bs.modal', function () {
// Uncheck all checkboxes when the modal is closed $('.custom-control-input').prop('checked', false);
$('#finalApproveModal').on('hidden.bs.modal', function () { $('#total').val('0');
$('.custom-control-input').prop('checked', false); // Uncheck all checkboxes });
$('#total').val('0'); // Reset total to 0
});
</script> </script>
@endsection @endsection
routes/web.php
+1
View File
@@ -193,6 +193,7 @@ Route::middleware(['auth:admin', 'menu'])->group(function () {
Route::post('/other/store', [FormOtherController::class, 'store'])->name('forms.other.store'); Route::post('/other/store', [FormOtherController::class, 'store'])->name('forms.other.store');
Route::get('/other/edit/{id}', [FormOtherController::class, 'edit'])->name('forms.other.edit'); Route::get('/other/edit/{id}', [FormOtherController::class, 'edit'])->name('forms.other.edit');
Route::put('/other/update/{id}', [FormOtherController::class, 'update'])->name('forms.other.update'); Route::put('/other/update/{id}', [FormOtherController::class, 'update'])->name('forms.other.update');
Route::delete('/other/{form}/attachments/{attachment}', [FormOtherController::class, 'deleteAttachment'])->name('forms.other.attachments.destroy');
Route::delete('/other/destroy/{id}', [FormOtherController::class, 'destroy'])->name('forms.other.destroy'); Route::delete('/other/destroy/{id}', [FormOtherController::class, 'destroy'])->name('forms.other.destroy');
Route::put('/other/approve/{id}', [FormOtherController::class, 'approve'])->name('forms.other.approve'); Route::put('/other/approve/{id}', [FormOtherController::class, 'approve'])->name('forms.other.approve');
Route::put('/other/approve2/{id}', [FormOtherController::class, 'approve2'])->name('forms.other.approve2'); Route::put('/other/approve2/{id}', [FormOtherController::class, 'approve2'])->name('forms.other.approve2');