dev: hotfix, added my-ui/checkboxes

This commit is contained in:
2025-12-08 07:59:56 +07:00
parent 008903efab
commit 108ec8e899
2 changed files with 55 additions and 0 deletions
@@ -0,0 +1,41 @@
<script setup lang="ts">
import type { Item } from './index'
const props = defineProps<{
items: Item[]
useFlex?: boolean
}>()
const model = defineModel<string[]>()
const checks: Record<string, any> = ref({})
model.value = []
props.items.forEach((item) => {
checks.value[item.value] = item.checked || false
})
watch(checks, () => {
const list: string[] = []
Object.keys(checks.value).forEach((key) => {
if (checks.value[key]) {
list.push(key)
}
})
model.value = list
}, { deep: true })
function check(value: string, status: boolean) {
checks.value[value] = status
}
</script>
<template>
<div :class="useFlex ? 'flex gap-2' : ''">
<label v-for="item, idx in items" :key="item.value" class="flex pe-4">
<Checkbox @update:checked="(status) => check(item.value, status)" :checked="checks[item.value]" />
<div class="pt-0.5 ps-2">
{{ item.label }}
</div>
</label>
</div>
</template>
@@ -0,0 +1,14 @@
export interface Item {
value: string
label: string
checked?: boolean
}
export function checkItems(items: Item[], value: string[]) {
items.forEach((item, idx) => {
items[idx]!.checked = value.includes(item.value)
// item.checked = value.includes(item.value)
})
}
export { default as Checkboxes } from './checkboxes.vue'