<script setup>

import {ref, watch} from "vue";
import TSwitch from "@/components/ui/TSwitch.vue";

const props = defineProps(["v-config", "description"])

const {isPrior, realDescription} = (function () {
	let description = props.description
	if (description == null) {
		description = "打开后可以覆盖父级或子级配置"
	}
	return {
		isPrior: ref(props.vConfig.isPrior),
		realDescription: ref(description)
	}
})()

watch(isPrior, function (v) {
	props.vConfig.isPrior = v
})
</script>

<template>
	<tbody>
	<tr :class="{active:isPrior}">
		<td class="title">打开独立配置</td>
		<td>
			<TSwitch v-model="isPrior"></TSwitch>
			<p class="comment"><strong v-if="isPrior">[已打开]</strong> {{ realDescription }}。</p>
		</td>
	</tr>
	</tbody>
</template>

<style scoped lang="postcss">

</style>