69 lines
1.4 KiB
Vue
69 lines
1.4 KiB
Vue
<script setup lang="ts">
|
||
import { onMounted } from 'vue'
|
||
import { storeToRefs } from 'pinia'
|
||
import { useProfileStore } from '@/stores/modules/profile'
|
||
import HelpFaq from './cpns/HelpFaq.vue'
|
||
|
||
const profileStore = useProfileStore()
|
||
const { helpFaqs } = storeToRefs(profileStore)
|
||
|
||
onMounted(() => {
|
||
void profileStore.fetchHelpFaqs()
|
||
})
|
||
</script>
|
||
|
||
<template>
|
||
<div class="help-page">
|
||
<header class="help-page__head">
|
||
<h2 class="help-page__title">
|
||
帮助中心
|
||
</h2>
|
||
<p class="help-page__sub text-secondary">
|
||
常见问题与使用指南，帮您快速上手平台
|
||
</p>
|
||
</header>
|
||
|
||
<HelpFaq :groups="helpFaqs" />
|
||
</div>
|
||
</template>
|
||
|
||
<style lang="less" scoped>
|
||
// 设计 16（帮助中心）：面板内标题蓝条 + 副文案，FAQ 平铺在面板上
|
||
.help-page {
|
||
.flex(column, flex-start);
|
||
gap: @spacing-base;
|
||
width: 100%;
|
||
|
||
&__head {
|
||
.flex(column, flex-start);
|
||
gap: @spacing-xs;
|
||
width: 100%;
|
||
padding: 0;
|
||
}
|
||
|
||
&__title {
|
||
position: relative;
|
||
padding-left: 12px;
|
||
font-size: 12px; // 设计 15 → 12
|
||
font-weight: 700;
|
||
color: @heading-color;
|
||
line-height: 20px;
|
||
|
||
&::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 0;
|
||
top: 3px;
|
||
width: 3px;
|
||
height: 14px;
|
||
border-radius: 2px;
|
||
background: @primary-strong;
|
||
}
|
||
}
|
||
|
||
&__sub {
|
||
font-size: 11px;
|
||
}
|
||
}
|
||
</style>
|