This commit implements a comprehensive status color system across the dashboard and validation interfaces, ensuring visual consistency between table rows and filter buttons. Color System Changes: - Updated statusRowBg mapping in script_requests.php with custom hex colors: * Pend: white (#ffffff) with black text * PartColl: pink (#ff99aa) with black text * Coll: red (#d63031) with white text * PartRecv: light blue (#a0c0d9) with black text * Recv: blue (#0984e3) with white text * Inc: yellow (#ffff00) with black text * Fin: green (#008000) with white text - Added custom CSS button classes in layout.php matching row background colors - Applied color backgrounds to table rows (Order through Tests columns) - Removed hardcoded text-white classes, now using dynamic text colors from mapping UI/UX Improvements: - Table rows now have consistent color-coded backgrounds based on request status - Filter button badges match their corresponding row background colors - Yellow status uses black text for better readability - Swapped Coll (yellow) and Inc (orange) colors as requested Validation Dialog Enhancement: - Updated dialog_val.php iframe to use dynamic URL generation - Removed preview type selection (ID, EN, PDF options) - uses default only - Added getPreviewUrl() method in script_validation.php - Now uses same URL pattern as preview dialog: http://glenlis/spooler_db/main_dev.php?acc={accessnumber} Documentation Updates: - Added Serena MCP tool usage guidelines to AGENTS.md - Renamed CHECKLIST.md to TODO.md - Removed CLAUDE.md Technical Details: - Color mappings now include both background and text color classes - Implemented using Tailwind arbitrary values for precise hex color matching - Status buttons use btn-status-{status} and badge-status-{status} classes - All 7 columns from Order through Tests have status-colored backgrounds
61 lines
2.5 KiB
PHP
61 lines
2.5 KiB
PHP
<dialog class="modal" :open="isDialogValOpen" @keydown.escape="closeValDialog()">
|
|
<template x-if="valItem">
|
|
<div class="modal-box w-2/3 max-w-5xl" x-trap.noreturn="isDialogValOpen">
|
|
<!-- Progress indicator -->
|
|
<div class="text-sm text-base-content/60 mb-2">
|
|
<span x-text="currentIndex + 1"></span> / <span x-text="unvalidatedFiltered.length"></span>
|
|
</div>
|
|
|
|
<!-- Request info header -->
|
|
<div class="bg-base-200 p-3 rounded mb-3">
|
|
<div class="grid grid-cols-4 gap-2 text-sm">
|
|
<div>Access#: <span x-text="valItem?.SP_ACCESSNUMBER" class="font-mono font-bold"></span></div>
|
|
<div>Patient: <span x-text="valItem?.PATNAME || valItem?.Name"></span></div>
|
|
<div>MRN: <span x-text="valItem?.PATNUMBER?.substring(14) || valItem?.PATNUMBER"></span></div>
|
|
<div>Tests: <span x-text="(valItem?.TESTS || valItem?.TESTNAMES || '').substring(0,40) + '...'"></span></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex justify-between items-center mb-2">
|
|
<h3 class="font-bold text-lg">Validate Request</h3>
|
|
<button class="btn btn-sm btn-ghost" @click="closeValDialog()" aria-label="Close">
|
|
<i class="fa fa-times"></i>
|
|
</button>
|
|
</div>
|
|
|
|
<p class="mb-2 flex gap-2">
|
|
<button id="validate-btn" x-ref="validateBtn" class="btn btn-sm btn-success"
|
|
@click="validate(valAccessnumber, '<?=session('userid');?>')"
|
|
:disabled="isValidating"
|
|
@keydown.enter.prevent="validate(valAccessnumber, '<?=session('userid');?>')"
|
|
@keydown.tab="focusNext($event)">
|
|
<i class="fa fa-check"></i> Validate (Enter)
|
|
</button>
|
|
<button class="btn btn-sm btn-neutral" @click="skipToNext()" @keydown.tab="focusPrev($event)">
|
|
<i class="fa fa-arrow-right"></i> Skip (N)
|
|
</button>
|
|
<button class="btn btn-sm btn-ghost" @click="closeValDialog()" @keydown.tab="focusPrev($event)">
|
|
Close (Esc)
|
|
</button>
|
|
</p>
|
|
<iframe id="result-iframe" x-ref="resultIframe" :src="getPreviewUrl()" width="100%" height="500px"
|
|
class="border border-base-300 rounded"></iframe>
|
|
|
|
<!-- Loading overlay -->
|
|
<template x-if="isValidating">
|
|
<div class="absolute inset-0 bg-base-100/80 flex items-center justify-center z-10 rounded-box">
|
|
<span class="loading loading-spinner loading-lg text-success"></span>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</template>
|
|
</dialog>
|
|
|
|
<!-- Toast notification -->
|
|
<div x-show="toast.show" x-transition
|
|
class="alert fixed bottom-4 right-4 z-50"
|
|
:class="toast.type === 'error' ? 'alert-error' : 'alert-success'">
|
|
<i :class="toast.type === 'error' ? 'fa fa-times-circle' : 'fa fa-check-circle'"></i>
|
|
<span x-text="toast.message"></span>
|
|
</div>
|