37 lines
1.1 KiB
Vue
37 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
const { editing } = defineProps<{
|
|
editing?: boolean
|
|
}>()
|
|
|
|
const modelValue = defineModel<string>({
|
|
required: true,
|
|
})
|
|
|
|
const currentVisibility = $computed(() =>
|
|
statusVisibilities.find(v => v.value === modelValue.value) || statusVisibilities[0],
|
|
)
|
|
|
|
function chooseVisibility(visibility: string) {
|
|
modelValue.value = visibility
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<CommonTooltip placement="top" :content="editing ? $t(`visibility.${currentVisibility.value}`) : $t('tooltip.change_content_visibility')">
|
|
<CommonDropdown placement="bottom">
|
|
<slot :visibility="currentVisibility" />
|
|
<template #popper>
|
|
<CommonDropdownItem
|
|
v-for="visibility in statusVisibilities"
|
|
:key="visibility.value"
|
|
:icon="visibility.icon"
|
|
:text="$t(`visibility.${visibility.value}`)"
|
|
:description="$t(`visibility.${visibility.value}_desc`)"
|
|
:checked="visibility.value === modelValue"
|
|
@click="chooseVisibility(visibility.value)"
|
|
/>
|
|
</template>
|
|
</CommonDropdown>
|
|
</CommonTooltip>
|
|
</template>
|