216 lines
14 KiB
PHP
216 lines
14 KiB
PHP
<x-app-layout>
|
|
<div class="max-w-7xl mx-auto space-y-6 pb-8">
|
|
{{-- SECTION 1: Header --}}
|
|
<div class="flex flex-col md:flex-row md:items-center justify-between gap-4 px-2">
|
|
<div>
|
|
<h2 class="text-2xl font-black text-slate-800 tracking-tight leading-none mb-1 uppercase">Log Rekam Medis</h2>
|
|
<p class="text-xs text-slate-500 font-medium italic uppercase tracking-wider">Laporan Riwayat Kesehatan & Penggunaan Inventaris Obat.</p>
|
|
</div>
|
|
|
|
@can('check-access', ['treatments', 'create'])
|
|
<a href="{{ route('treatments.create') }}" class="inline-flex items-center px-6 py-4 bg-slate-900 text-white text-[10px] font-black rounded-2xl shadow-xl hover:bg-black transition-all active:scale-95 tracking-widest uppercase">
|
|
<i class="fas fa-plus-circle mr-2 text-sm"></i> INPUT REKAM MEDIS
|
|
</a>
|
|
@endcan
|
|
</div>
|
|
|
|
{{-- SECTION 2: Filter dan ekspor --}}
|
|
<div class="bg-white border border-slate-200 rounded-[2.5rem] p-6 mx-2 shadow-sm">
|
|
<form action="{{ route('treatments.index') }}" method="GET" class="space-y-4">
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-4">
|
|
{{-- Cari Kucing --}}
|
|
<div class="space-y-1">
|
|
<label class="text-[9px] font-black text-slate-400 uppercase ml-2 tracking-widest">Pasien</label>
|
|
<div class="relative">
|
|
<i class="fas fa-search absolute left-4 top-1/2 -translate-y-1/2 text-slate-300 text-xs"></i>
|
|
<input type="text" name="search" value="{{ request('search') }}" placeholder="Cari nama kucing..."
|
|
class="w-full pl-10 pr-4 py-2.5 bg-slate-50 border-none rounded-xl text-xs font-bold focus:ring-2 focus:ring-indigo-500">
|
|
</div>
|
|
</div>
|
|
|
|
{{-- PIC / Staf --}}
|
|
<div class="space-y-1">
|
|
<label class="text-[9px] font-black text-slate-400 uppercase ml-2 tracking-widest">PIC / Staf</label>
|
|
<select name="pic_id" class="w-full px-4 py-2.5 bg-slate-50 border-none rounded-xl text-xs font-bold focus:ring-2 focus:ring-indigo-500">
|
|
<option value="">Semua Staf</option>
|
|
@foreach($pics as $pic)
|
|
<option value="{{ $pic->id }}" {{ request('pic_id') == $pic->id ? 'selected' : '' }}>{{ $pic->name }}</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
|
|
{{-- Rentang Tanggal --}}
|
|
<div class="lg:col-span-2 space-y-1">
|
|
<label class="text-[9px] font-black text-slate-400 uppercase ml-2 tracking-widest">Rentang Waktu</label>
|
|
<div class="grid grid-cols-2 gap-2">
|
|
<input type="date" name="start_date" value="{{ request('start_date') }}" class="w-full px-4 py-2.5 bg-slate-50 border-none rounded-xl text-xs font-bold focus:ring-2 focus:ring-indigo-500">
|
|
<input type="date" name="end_date" value="{{ request('end_date') }}" class="w-full px-4 py-2.5 bg-slate-50 border-none rounded-xl text-xs font-bold focus:ring-2 focus:ring-indigo-500">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{-- Action Buttons --}}
|
|
<div class="flex flex-wrap items-center justify-between gap-4 pt-2 border-t border-slate-50">
|
|
<div class="flex items-center gap-2">
|
|
<button type="submit" class="px-6 py-2.5 bg-indigo-600 text-white rounded-xl text-[10px] font-black uppercase tracking-widest hover:bg-indigo-700 transition-all shadow-md shadow-indigo-100">
|
|
<i class="fas fa-filter mr-2"></i> Terapkan Filter
|
|
</button>
|
|
<a href="{{ route('treatments.index') }}" class="px-6 py-2.5 bg-slate-100 text-slate-500 rounded-xl text-[10px] font-black uppercase tracking-widest hover:bg-slate-200 transition-all">
|
|
<i class="fas fa-sync-alt mr-2"></i> Reset
|
|
</a>
|
|
</div>
|
|
|
|
<div class="flex items-center gap-2">
|
|
<button type="submit" name="export" value="excel" class="px-4 py-2.5 bg-emerald-50 text-emerald-600 border border-emerald-100 rounded-xl text-[10px] font-black uppercase tracking-widest hover:bg-emerald-600 hover:text-white transition-all">
|
|
<i class="fas fa-file-excel mr-2 text-sm"></i> Excel
|
|
</button>
|
|
<button type="submit" name="export" value="pdf" class="px-4 py-2.5 bg-rose-50 text-rose-600 border border-rose-100 rounded-xl text-[10px] font-black uppercase tracking-widest hover:bg-rose-600 hover:text-white transition-all">
|
|
<i class="fas fa-file-pdf mr-2 text-sm"></i> PDF
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
{{-- SECTION 3: Tabel Rekam Medis --}}
|
|
<div class="bg-white border border-slate-200 rounded-[2.5rem] overflow-hidden shadow-sm mx-2">
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full text-left border-collapse">
|
|
<thead class="bg-slate-50 text-[10px] font-black text-slate-400 uppercase tracking-widest border-b border-slate-100">
|
|
<tr>
|
|
<th class="px-6 py-5">Tanggal & Kucing</th>
|
|
<th class="px-6 py-5">Kondisi</th>
|
|
<th class="px-6 py-5">Keluhan & Diagnosa</th>
|
|
<th class="px-6 py-5">Obat & Qty</th>
|
|
<th class="px-6 py-5 text-center">Lampiran</th>
|
|
<th class="px-6 py-5 text-right">Aksi</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-slate-100 font-medium text-slate-700">
|
|
@forelse($treatments as $treatment)
|
|
<tr class="hover:bg-slate-50/50 transition-all group">
|
|
{{-- Tanggal & Kucing --}}
|
|
<td class="px-6 py-4">
|
|
<div class="flex items-center gap-3">
|
|
<div class="w-10 h-10 rounded-xl bg-slate-100 overflow-hidden ring-2 ring-white shadow-sm shrink-0">
|
|
<img src="{{ $treatment->cat->foto ? asset('storage/'.$treatment->cat->foto) : asset('images/default-cat.svg') }}" class="w-full h-full object-cover">
|
|
</div>
|
|
<div>
|
|
<p class="text-[10px] font-black text-indigo-600 uppercase leading-none mb-1">{{ \Carbon\Carbon::parse($treatment->tanggal)->format('d M Y') }}</p>
|
|
<p class="text-sm font-black text-slate-800 leading-none truncate w-32">{{ $treatment->cat->nama_kucing }}</p>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
|
|
{{-- Kondisi Kucing --}}
|
|
<td class="px-6 py-4">
|
|
@if($treatment->cat->treatment_status == 1)
|
|
<span class="px-2 py-1 bg-rose-50 text-rose-600 rounded-lg text-[8px] font-black border border-rose-100 uppercase tracking-tighter">Under Perawatan</span>
|
|
@else
|
|
<span class="px-2 py-1 bg-emerald-50 text-emerald-600 rounded-lg text-[8px] font-black border border-emerald-100 uppercase tracking-tighter">Sehat</span>
|
|
@endif
|
|
</td>
|
|
|
|
{{-- Keluhan & Diagnosa --}}
|
|
<td class="px-6 py-4 max-w-xs">
|
|
<p class="text-xs font-black text-slate-800 truncate" title="{{ $treatment->keluhan }}">{{ $treatment->keluhan }}</p>
|
|
{{-- Limit diperbesar agar detail catatan obat bisa terbaca --}}
|
|
<p class="text-[10px] text-slate-500 line-clamp-2 italic uppercase tracking-tighter" title="{{ $treatment->diagnosa }}">{{ Str::limit($treatment->diagnosa, 75) }}</p>
|
|
</td>
|
|
|
|
{{-- Obat & Qty (Menggunakan Relasi Langsung) --}}
|
|
<td class="px-6 py-4">
|
|
<div class="flex flex-wrap gap-1.5 max-w-[200px]">
|
|
<div class="flex items-center gap-1.5 bg-slate-50 px-2 py-1 rounded-lg border border-slate-100">
|
|
<span class="text-[9px] font-black text-slate-700 uppercase">{{ $treatment->medicine->nama_obat ?? 'N/A' }}</span>
|
|
<span class="text-[8px] font-bold text-indigo-500">x{{ (float)$treatment->qty_used }}</span>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
|
|
{{-- Foto Bukti --}}
|
|
<td class="px-6 py-4 text-center">
|
|
@if($treatment->foto_bukti)
|
|
<a href="{{ asset('storage/'.$treatment->foto_bukti) }}" target="_blank" class="w-8 h-8 inline-flex items-center justify-center bg-indigo-50 text-indigo-500 hover:bg-indigo-600 hover:text-white rounded-lg transition-all shadow-sm">
|
|
<i class="fas fa-image text-xs"></i>
|
|
</a>
|
|
@else
|
|
<span class="text-slate-200 text-[10px] font-bold tracking-widest">N/A</span>
|
|
@endif
|
|
</td>
|
|
|
|
{{-- AKSI --}}
|
|
<td class="px-6 py-4 text-right">
|
|
<div class="flex justify-end items-center gap-2">
|
|
<a href="{{ route('treatments.show', $treatment->id) }}" class="w-8 h-8 flex items-center justify-center bg-slate-50 text-slate-400 hover:bg-indigo-50 hover:text-indigo-600 rounded-xl transition-all shadow-sm">
|
|
<i class="fas fa-eye text-[10px]"></i>
|
|
</a>
|
|
|
|
@can('check-access', ['treatments', 'update'])
|
|
<a href="{{ route('treatments.edit', $treatment->id) }}" class="w-8 h-8 flex items-center justify-center bg-slate-50 text-slate-400 hover:bg-amber-50 hover:text-amber-600 rounded-xl transition-all shadow-sm">
|
|
<i class="fas fa-edit text-[10px]"></i>
|
|
</a>
|
|
@endcan
|
|
|
|
@can('check-access', ['treatments', 'delete'])
|
|
<form action="{{ route('treatments.destroy', $treatment->id) }}" method="POST" class="inline m-0">
|
|
@csrf @method('DELETE')
|
|
<button type="button" onclick="confirmDelete(this, 'Rekam Medis {{ addslashes($treatment->cat->nama_kucing) }}')"
|
|
class="w-8 h-8 flex items-center justify-center bg-slate-50 text-slate-400 hover:bg-rose-50 hover:text-rose-600 rounded-xl transition-all shadow-sm">
|
|
<i class="fas fa-trash-alt text-[10px]"></i>
|
|
</button>
|
|
</form>
|
|
@endcan
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="6" class="px-6 py-32 text-center">
|
|
<div class="w-20 h-20 bg-slate-50 rounded-[2rem] flex items-center justify-center mx-auto mb-4 border border-slate-100">
|
|
<i class="fas fa-microscope text-3xl text-slate-200"></i>
|
|
</div>
|
|
<h3 class="text-slate-400 font-black uppercase text-xs tracking-[0.4em]">Data Tidak Ditemukan</h3>
|
|
<p class="text-slate-300 text-[10px] font-bold mt-2 uppercase italic tracking-tighter">Gunakan filter yang berbeda atau input rekam medis baru</p>
|
|
</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
{{-- Pagination --}}
|
|
@if($treatments->hasPages())
|
|
<div class="p-8 border-t border-slate-100 bg-slate-50/30">
|
|
{{ $treatments->links() }}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
@push('scripts')
|
|
<script>
|
|
function confirmDelete(button, name) {
|
|
Swal.fire({
|
|
title: 'Hapus Rekam Medis?',
|
|
text: "Menghapus data " + name + " akan mengembalikan stok obat ke inventaris secara otomatis.",
|
|
icon: 'warning',
|
|
showCancelButton: true,
|
|
confirmButtonColor: '#e11d48',
|
|
cancelButtonColor: '#64748b',
|
|
confirmButtonText: 'Ya, Hapus Data',
|
|
cancelButtonText: 'Batal',
|
|
customClass: {
|
|
popup: 'rounded-[2.5rem]',
|
|
confirmButton: 'rounded-xl font-black uppercase text-[10px] tracking-widest px-6 py-3',
|
|
cancelButton: 'rounded-xl font-black uppercase text-[10px] tracking-widest px-6 py-3'
|
|
}
|
|
}).then((result) => {
|
|
if (result.isConfirmed) {
|
|
button.closest('form').submit();
|
|
}
|
|
})
|
|
}
|
|
</script>
|
|
@endpush
|
|
</x-app-layout> |