59 lines
4.6 KiB
PHP
59 lines
4.6 KiB
PHP
<!-- TAB 3: บริการผู้ป่วยนอก (OPD Services) -->
|
|
<div id="tab-opd-service" class="tab-content hidden space-y-4 md:space-y-6">
|
|
<?= $opd_filter_html ?>
|
|
<h3 class="font-extrabold text-slate-800 text-base md:text-lg mb-3 md:mb-4 border-l-4 border-blue-500 pl-3">การพัฒนาระบบบริการผู้ป่วยนอก</h3>
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 md:gap-6 mb-6">
|
|
<div class="card-premium p-4 md:p-5 border-t-4 border-t-blue-500 bg-gradient-to-b from-blue-50/50 to-white relative overflow-hidden">
|
|
<i class="fa-solid fa-mobile-screen absolute -right-2 -bottom-2 md:-right-4 md:-bottom-4 text-5xl md:text-7xl text-blue-100/50 rotate-12 z-0"></i>
|
|
<div class="flex justify-between items-start relative z-10">
|
|
<div>
|
|
<p class="text-xs md:text-sm font-bold text-blue-800 mb-1">นัดหมายออนไลน์</p>
|
|
<p class="text-[9px] md:text-[11px] text-slate-500">แอปฯ หมอพร้อม, ระบบนัด</p>
|
|
</div>
|
|
</div>
|
|
<div class="mt-3 md:mt-4 relative z-10">
|
|
<h3 class="text-2xl md:text-3xl font-black text-blue-600"><span id="db-online-appoint">-</span> <span class="text-xs md:text-sm font-medium text-slate-500">ครั้ง</span></h3>
|
|
</div>
|
|
</div>
|
|
<div class="card-premium p-4 md:p-5 border-t-4 border-t-purple-500 bg-gradient-to-b from-purple-50/50 to-white relative overflow-hidden">
|
|
<i class="fa-solid fa-video absolute -right-2 -bottom-2 md:-right-4 md:-bottom-4 text-5xl md:text-7xl text-purple-100/50 rotate-12 z-0"></i>
|
|
<div class="flex justify-between items-start relative z-10">
|
|
<div>
|
|
<p class="text-xs md:text-sm font-bold text-purple-800 mb-1">Telemedicine</p>
|
|
<p class="text-[9px] md:text-[11px] text-slate-500">พบแพทย์ออนไลน์</p>
|
|
</div>
|
|
</div>
|
|
<div class="mt-3 md:mt-4 relative z-10">
|
|
<h3 class="text-2xl md:text-3xl font-black text-purple-600"><span id="db-telemed-total">-</span> <span class="text-xs md:text-sm font-medium text-slate-500">ครั้ง</span></h3>
|
|
</div>
|
|
</div>
|
|
<div class="card-premium p-4 md:p-5 border-t-4 border-t-amber-500 bg-gradient-to-b from-amber-50/50 to-white relative overflow-hidden">
|
|
<i class="fa-solid fa-motorcycle absolute -right-2 -bottom-2 md:-right-4 md:-bottom-4 text-5xl md:text-7xl text-amber-100/50 rotate-12 z-0"></i>
|
|
<div class="flex justify-between items-start relative z-10">
|
|
<div>
|
|
<p class="text-xs md:text-sm font-bold text-amber-800 mb-1">การส่งยาที่บ้าน</p>
|
|
<p class="text-[9px] md:text-[11px] text-slate-500">OPD Refill</p>
|
|
</div>
|
|
</div>
|
|
<div class="mt-3 md:mt-4 relative z-10">
|
|
<h3 class="text-2xl md:text-3xl font-black text-amber-600"><span id="db-home-delivery">-</span> <span class="text-xs md:text-sm font-medium text-slate-500">ครั้ง</span></h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4 md:gap-6 mb-6">
|
|
<div class="card-premium p-4 md:p-6 mb-6">
|
|
<h3 class="font-extrabold text-slate-800 text-sm md:text-base mb-4"><i class="fa-solid fa-video text-purple-500 mr-2"></i> 10 อันดับคลินิกให้บริการ Telemedicine</h3>
|
|
<div class="h-[250px] md:h-[350px] w-full flex items-center justify-center bg-slate-50 rounded-lg border border-dashed border-slate-200" id="dbServiceTeleChart_container">
|
|
<span class="text-slate-400 font-medium">รอการค้นหาข้อมูล...</span>
|
|
</div>
|
|
</div>
|
|
<div class="card-premium p-4 md:p-6 mb-6">
|
|
<h3 class="font-extrabold text-slate-800 text-sm md:text-base mb-4"><i class="fa-solid fa-motorcycle text-blue-500 mr-2"></i> การส่งยาที่บ้าน OPD Refill (รายเดือน)</h3>
|
|
<div class="h-[250px] md:h-[350px] w-full flex items-center justify-center bg-slate-50 rounded-lg border border-dashed border-slate-200">
|
|
<span class="text-slate-400 font-medium">รอการค้นหาข้อมูล...</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|