2023-01-04 10:41:19 +00:00
|
|
|
<script setup lang="ts">
|
|
|
|
const { editing } = defineProps<{
|
|
|
|
editing?: boolean
|
|
|
|
}>()
|
|
|
|
|
2023-08-01 10:12:51 +01:00
|
|
|
const modelValue = defineModel<string>()
|
2023-01-04 10:41:19 +00:00
|
|
|
|
|
|
|
const currentVisibility = $computed(() =>
|
2023-08-01 10:12:51 +01:00
|
|
|
statusVisibilities.find(v => v.value === modelValue.value) || statusVisibilities[0],
|
2023-01-04 10:41:19 +00:00
|
|
|
)
|
|
|
|
|
2023-03-30 20:01:24 +01:00
|
|
|
function chooseVisibility(visibility: string) {
|
2023-08-01 10:12:51 +01:00
|
|
|
modelValue.value = visibility
|
2023-01-04 10:41:19 +00:00
|
|
|
}
|
|
|
|
</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>
|