v0.4.0
add: - legal .md files - routers - home view - rewrite App.vue - update footer / header - update features
This commit is contained in:
@@ -0,0 +1,85 @@
|
||||
<template>
|
||||
<div class="max-w-4xl mx-auto px-4 py-12">
|
||||
<!-- Навигация: теперь используем router-link вместо обычных кнопок -->
|
||||
<nav class="flex space-x-6 mb-8 pb-2">
|
||||
<router-link
|
||||
to="/docs/policy"
|
||||
class="px-1 py-2 text-sm font-medium transition-colors border-b-2 -mb-2.5"
|
||||
active-class="border-blue-600 text-blue-600 dark:text-blue-400 dark:border-blue-400"
|
||||
inactive-class="border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400"
|
||||
>
|
||||
Политика конфиденциальности
|
||||
</router-link>
|
||||
|
||||
<router-link
|
||||
to="/docs/agreement"
|
||||
class="px-1 py-2 text-sm font-medium transition-colors border-b-2 -mb-2.5"
|
||||
active-class="border-blue-600 text-blue-600 dark:text-blue-400 dark:border-blue-400"
|
||||
inactive-class="border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400"
|
||||
>
|
||||
Пользовательское соглашение
|
||||
</router-link>
|
||||
</nav>
|
||||
|
||||
<!-- Область отображения Markdown (Tailwind Typography) -->
|
||||
<div
|
||||
v-if="htmlContent"
|
||||
v-html="htmlContent"
|
||||
class="prose prose-slate max-w-none dark:prose-invert"
|
||||
></div>
|
||||
|
||||
<div v-else-if="isLoading" class="text-center py-12 text-slate-500 dark:text-slate-400">
|
||||
Загрузка документа...
|
||||
</div>
|
||||
|
||||
<div v-else class="text-center py-12 text-red-500">
|
||||
Документ не найден или произошла ошибка.
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, watch, onMounted } from 'vue'
|
||||
import { marked } from 'marked'
|
||||
|
||||
// Принимаем параметр docName из роутера
|
||||
const props = defineProps({
|
||||
docName: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const htmlContent = ref('')
|
||||
const isLoading = ref(true)
|
||||
|
||||
// Функция загрузки md-файла
|
||||
const fetchMarkdown = async (name) => {
|
||||
isLoading.value = true
|
||||
htmlContent.value = ''
|
||||
|
||||
try {
|
||||
// Загрузка из папки public/docs/
|
||||
const response = await fetch(`/docs/${name}.md`)
|
||||
if (!response.ok) throw new Error('Файл отсутствует')
|
||||
|
||||
const markdownText = await response.text()
|
||||
htmlContent.value = marked(markdownText)
|
||||
} catch (error) {
|
||||
console.error('Ошибка отрисовки md:', error)
|
||||
htmlContent.value = ''
|
||||
} finally {
|
||||
isLoading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// Загружаем файл при первой инициализации страницы
|
||||
onMounted(() => {
|
||||
fetchMarkdown(props.docName)
|
||||
})
|
||||
|
||||
// Отслеживаем изменение ссылки (например, если пользователь перешел с policy на agreement)
|
||||
watch(() => props.docName, (newName) => {
|
||||
fetchMarkdown(newName)
|
||||
})
|
||||
</script>
|
||||
Reference in New Issue
Block a user