poe2-loot-filter-vue/src/components/RuleLine.vue
2025-01-05 15:14:40 +09:00

33 lines
801 B
Vue

<script setup lang="ts" generic="T">
import { computed, ref, watch } from 'vue'
import { ToggleSwitch } from 'primevue';
const props = defineProps<{
title: string,
inherit: boolean,
inheritValue: T,
defaultValue: T
}>()
const model = defineModel<T>({ required: true })
const value = computed(() => props.inherit ? props.inheritValue : model.value)
</script>
<template>
<tr>
<td class="pr-4 whitespace-nowrap">
{{ title }}
</td>
<td class="pr-4">
<ToggleSwitch v-if="!inherit" class="align-middle" :model-value="value != undefined"
@update:model-value="model = $event ? defaultValue : undefined" />
<label v-else>Inherit</label>
</td>
<td class="h-11 flex gap-2">
<slot :value :disabled="inherit"></slot>
</td>
</tr>
</template>