94 lines
2.6 KiB
Svelte

<script>
import {
List,
MapPin,
Users,
Briefcase,
Stethoscope,
Hash,
Globe,
ChevronRight
} from 'lucide-svelte';
const modules = [
{
title: 'ValueSets',
description: 'System lookup values and dropdown options (GENDER, MARITAL_STATUS, etc.)',
icon: List,
href: '/master-data/valuesets',
color: 'bg-blue-500',
},
{
title: 'Locations',
description: 'Manage locations and facilities',
icon: MapPin,
href: '/master-data/locations',
color: 'bg-green-500',
},
{
title: 'Contacts',
description: 'Manage physicians and contacts',
icon: Users,
href: '/master-data/contacts',
color: 'bg-purple-500',
},
{
title: 'Occupations',
description: 'Manage occupation codes',
icon: Briefcase,
href: '/master-data/occupations',
color: 'bg-orange-500',
},
{
title: 'Medical Specialties',
description: 'Manage medical specialty codes',
icon: Stethoscope,
href: '/master-data/specialties',
color: 'bg-pink-500',
},
{
title: 'Counters',
description: 'Manage ID generation counters',
icon: Hash,
href: '/master-data/counters',
color: 'bg-teal-500',
},
{
title: 'Geography',
description: 'View provinces, cities, and geographical areas',
icon: Globe,
href: '/master-data/geography',
color: 'bg-indigo-500',
},
];
</script>
<div class="p-6">
<h1 class="text-3xl font-bold text-gray-800 mb-2">Master Data</h1>
<p class="text-gray-600 mb-8">Manage reference data and lookup values used throughout the system</p>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{#each modules as module}
<a
href={module.href}
class="card bg-base-100 shadow-lg hover:shadow-xl transition-shadow border border-base-200 group"
>
<div class="card-body">
<div class="flex items-start gap-4">
<div class="{module.color} text-white p-3 rounded-lg">
<svelte:component this={module.icon} class="w-6 h-6" />
</div>
<div class="flex-1">
<h2 class="card-title text-lg group-hover:text-primary transition-colors">
{module.title}
</h2>
<p class="text-sm text-gray-600 mt-1">{module.description}</p>
</div>
<ChevronRight class="w-5 h-5 text-gray-400 group-hover:text-primary transition-colors" />
</div>
</div>
</a>
{/each}
</div>
</div>