feat(patient): address integration to backend apis
feat(patient): add newborn status field and validation - Add radio button component for newborn status selection - Update patient schema with newborn status validation - Remove deprecated alias field from person model - Refactor disability type handling in patient schema fix(patient): correct address comparison logic and schema Update the patient address comparison to use boolean instead of string '1' and modify the schema to transform the string value to boolean. This ensures consistent type usage throughout the application. feat(models): add village and district model interfaces Add new model interfaces for Village and District with their respective generator functions. These models will be used to handle administrative division data in the application. feat(address): implement dynamic province selection with caching - Add province service for CRUD operations - Create useProvinces composable with caching and loading states - Update select-province component to use dynamic data - Export SelectItem interface for type consistency - Improve combobox styling and accessibility feat(address-form): implement dynamic regency selection with caching - Add new regency service for CRUD operations - Create useRegencies composable with caching and loading states - Update SelectRegency component to use dynamic data based on province selection - Improve placeholder and disabled state handling feat(address-form): implement dynamic district selection - Add district service for CRUD operations - Create useDistricts composable with caching and loading states - Update SelectDistrict component to use dynamic data - Remove hardcoded district options and implement regency-based filtering feat(address-form): implement dynamic village selection with caching - Add village service for CRUD operations - Create useVillages composable with caching and loading states - Update SelectVillage component to fetch villages based on district - Remove hardcoded village options in favor of API-driven data feat(address-form): improve address selection with debouncing and request deduplication - Add debouncing to prevent rapid API calls when selecting addresses - Implement request deduplication to avoid duplicate API calls - Add delayed form reset to ensure proper composable cleanup - Add isUserAction flag to force refresh when user changes selection
This commit is contained in:
@@ -1,17 +1,11 @@
|
||||
<script setup lang="ts">
|
||||
import type { SelectItem } from '~/components/pub/my-ui/form/select.vue'
|
||||
import { cn } from '~/lib/utils'
|
||||
|
||||
interface Item {
|
||||
value: string
|
||||
label: string
|
||||
code?: string
|
||||
priority?: number
|
||||
}
|
||||
|
||||
const props = defineProps<{
|
||||
id: string
|
||||
modelValue?: string
|
||||
items: Item[]
|
||||
items: SelectItem[]
|
||||
placeholder?: string
|
||||
searchPlaceholder?: string
|
||||
emptyMessage?: string
|
||||
@@ -55,7 +49,7 @@ const searchableItems = computed(() => {
|
||||
})
|
||||
})
|
||||
|
||||
function onSelect(item: Item) {
|
||||
function onSelect(item: SelectItem) {
|
||||
emit('update:modelValue', item.value)
|
||||
open.value = false
|
||||
}
|
||||
@@ -74,10 +68,11 @@ function onSelect(item: Item) {
|
||||
:aria-describedby="`${props.id}-search`"
|
||||
:class="
|
||||
cn(
|
||||
'w-full justify-between border text-sm font-normal rounded-md px-3 py-2 focus:outline-none focus:ring-1 focus:ring-black dark:focus:ring-white',
|
||||
'w-full justify-between rounded-md border px-3 py-2 text-sm font-normal focus:outline-none focus:ring-1 focus:ring-black dark:focus:ring-white',
|
||||
{
|
||||
'cursor-not-allowed bg-gray-100 opacity-50 border-gray-300 text-gray-500': props.isDisabled,
|
||||
'bg-white text-black dark:bg-gray-800 dark:text-white dark:border-gray-600 border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700': !props.isDisabled,
|
||||
'cursor-not-allowed border-gray-300 bg-gray-100 text-gray-500 opacity-50': props.isDisabled,
|
||||
'border-gray-400 bg-white text-black hover:bg-gray-50 dark:border-gray-600 dark:bg-gray-800 dark:text-white dark:hover:bg-gray-700':
|
||||
!props.isDisabled,
|
||||
'text-gray-400 dark:text-gray-500': !modelValue && !props.isDisabled,
|
||||
},
|
||||
props.class,
|
||||
@@ -87,22 +82,26 @@ function onSelect(item: Item) {
|
||||
{{ displayText }}
|
||||
<Icon
|
||||
name="i-lucide-chevrons-up-down"
|
||||
:class="cn('ml-2 h-4 w-4 shrink-0', {
|
||||
'opacity-30': props.isDisabled,
|
||||
'opacity-50 text-gray-500 dark:text-gray-300': !props.isDisabled
|
||||
})"
|
||||
:class="
|
||||
cn('ml-2 h-4 w-4 shrink-0', {
|
||||
'opacity-30': props.isDisabled,
|
||||
'text-gray-500 opacity-50 dark:text-gray-300': !props.isDisabled,
|
||||
})
|
||||
"
|
||||
/>
|
||||
</Button>
|
||||
</PopoverTrigger>
|
||||
<PopoverContent class="w-[var(--radix-popover-trigger-width)] p-0 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700">
|
||||
<PopoverContent
|
||||
class="w-[var(--radix-popover-trigger-width)] border border-gray-200 bg-white p-0 dark:border-gray-700 dark:bg-gray-800"
|
||||
>
|
||||
<Command class="bg-white dark:bg-gray-800">
|
||||
<CommandInput
|
||||
:id="`${props.id}-search`"
|
||||
class="h-9 bg-white dark:bg-gray-800 text-black dark:text-white border-0 border-b border-gray-200 dark:border-gray-700 focus:ring-0"
|
||||
class="h-9 border-0 border-b border-gray-200 bg-white text-black focus:ring-0 dark:border-gray-700 dark:bg-gray-800 dark:text-white"
|
||||
:placeholder="searchPlaceholder || 'Cari...'"
|
||||
:aria-label="`Cari ${displayText}`"
|
||||
/>
|
||||
<CommandEmpty class="text-gray-500 dark:text-gray-400 py-6 text-center text-sm">
|
||||
<CommandEmpty class="py-6 text-center text-sm text-gray-500 dark:text-gray-400">
|
||||
{{ emptyMessage || 'Item tidak ditemukan.' }}
|
||||
</CommandEmpty>
|
||||
<CommandList
|
||||
@@ -118,7 +117,7 @@ function onSelect(item: Item) {
|
||||
:class="
|
||||
cn(
|
||||
'flex w-full cursor-pointer items-center justify-between rounded-sm px-2 py-1.5 text-sm',
|
||||
'focus:outline-none text-black dark:text-white',
|
||||
'text-black focus:outline-none dark:text-white',
|
||||
'hover:bg-primary hover:text-white focus:bg-primary focus:text-white',
|
||||
'data-[highlighted]:bg-primary data-[highlighted]:text-white',
|
||||
)
|
||||
|
||||
@@ -10,7 +10,7 @@ import SelectTrigger from '~/components/pub/ui/select/SelectTrigger.vue'
|
||||
import SelectValue from '~/components/pub/ui/select/SelectValue.vue'
|
||||
import { cn } from '~/lib/utils'
|
||||
|
||||
interface Item {
|
||||
export interface SelectItem {
|
||||
value: string
|
||||
label: string
|
||||
code?: string
|
||||
@@ -19,7 +19,7 @@ interface Item {
|
||||
|
||||
const props = defineProps<{
|
||||
modelValue?: string
|
||||
items: Item[]
|
||||
items: SelectItem[]
|
||||
placeholder?: string
|
||||
label?: string
|
||||
separator?: boolean
|
||||
|
||||
Reference in New Issue
Block a user