feat(ui): display post language
This commit is contained in:
parent
8d792d003d
commit
2a4862fb42
@ -10,17 +10,7 @@ const { t } = useI18n()
|
||||
|
||||
const languageKeyword = $ref('')
|
||||
|
||||
const languageList: {
|
||||
code: string
|
||||
nativeName: string
|
||||
name: string
|
||||
}[] = ISO6391.getAllCodes().map(code => ({
|
||||
code,
|
||||
nativeName: ISO6391.getNativeName(code),
|
||||
name: ISO6391.getName(code),
|
||||
}))
|
||||
|
||||
const fuse = new Fuse(languageList, {
|
||||
const fuse = new Fuse(languagesNameList, {
|
||||
keys: ['code', 'nativeName', 'name'],
|
||||
shouldSort: true,
|
||||
})
|
||||
@ -28,7 +18,7 @@ const fuse = new Fuse(languageList, {
|
||||
const languages = $computed(() =>
|
||||
languageKeyword.trim()
|
||||
? fuse.search(languageKeyword).map(r => r.item)
|
||||
: [...languageList].sort(({ code: a }, { code: b }) => {
|
||||
: [...languagesNameList].sort(({ code: a }, { code: b }) => {
|
||||
return a === modelValue ? -1 : b === modelValue ? 1 : a.localeCompare(b)
|
||||
}),
|
||||
)
|
||||
|
@ -62,6 +62,7 @@ const { editor } = useTiptap({
|
||||
},
|
||||
onPaste: handlePaste,
|
||||
})
|
||||
|
||||
const characterCount = $computed(() => {
|
||||
let length = stringLength(htmlToText(editor.value?.getHTML() || ''))
|
||||
|
||||
@ -76,6 +77,8 @@ const characterCount = $computed(() => {
|
||||
return length
|
||||
})
|
||||
|
||||
const postLanguageDisplay = $computed(() => languagesNameList.find(i => i.code === draft.params.language)?.nativeName)
|
||||
|
||||
async function handlePaste(evt: ClipboardEvent) {
|
||||
const files = evt.clipboardData?.files
|
||||
if (!files || files.length === 0)
|
||||
@ -278,17 +281,11 @@ defineExpose({
|
||||
{{ characterCount ?? 0 }}<span text-secondary-light>/</span><span text-secondary-light>{{ characterLimit }}</span>
|
||||
</div>
|
||||
|
||||
<CommonTooltip placement="top" :content="$t('tooltip.add_content_warning')">
|
||||
<button btn-action-icon :aria-label="$t('tooltip.add_content_warning')" @click="toggleSensitive">
|
||||
<div v-if="draft.params.sensitive" i-ri:alarm-warning-fill text-orange />
|
||||
<div v-else i-ri:alarm-warning-line />
|
||||
</button>
|
||||
</CommonTooltip>
|
||||
|
||||
<CommonTooltip placement="top" :content="$t('tooltip.change_language')">
|
||||
<CommonDropdown placement="bottom" auto-boundary-max-size>
|
||||
<button btn-action-icon :aria-label="$t('tooltip.change_language')" w-12 mr--1>
|
||||
<div i-ri:translate-2 />
|
||||
<button btn-action-icon :aria-label="$t('tooltip.change_language')" w-max mr1>
|
||||
<span v-if="postLanguageDisplay" text-secondary text-sm ml1>{{ postLanguageDisplay }}</span>
|
||||
<div v-else i-ri:translate-2 />
|
||||
<div i-ri:arrow-down-s-line text-sm text-secondary me--1 />
|
||||
</button>
|
||||
|
||||
@ -298,6 +295,13 @@ defineExpose({
|
||||
</CommonDropdown>
|
||||
</CommonTooltip>
|
||||
|
||||
<CommonTooltip placement="top" :content="$t('tooltip.add_content_warning')">
|
||||
<button btn-action-icon :aria-label="$t('tooltip.add_content_warning')" @click="toggleSensitive">
|
||||
<div v-if="draft.params.sensitive" i-ri:alarm-warning-fill text-orange />
|
||||
<div v-else i-ri:alarm-warning-line />
|
||||
</button>
|
||||
</CommonTooltip>
|
||||
|
||||
<PublishVisibilityPicker v-model="draft.params.visibility" :editing="!!draft.editingStatus">
|
||||
<template #default="{ visibility }">
|
||||
<button :disabled="!!draft.editingStatus" :aria-label="$t('tooltip.change_content_visibility')" btn-action-icon :class="{ 'w-12': !draft.editingStatus }">
|
||||
|
11
composables/langugage.ts
Normal file
11
composables/langugage.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import ISO6391 from 'iso-639-1'
|
||||
|
||||
export const languagesNameList: {
|
||||
code: string
|
||||
nativeName: string
|
||||
name: string
|
||||
}[] = ISO6391.getAllCodes().map(code => ({
|
||||
code,
|
||||
nativeName: ISO6391.getNativeName(code),
|
||||
name: ISO6391.getName(code),
|
||||
}))
|
Loading…
Reference in New Issue
Block a user