Normalize fixed profile fields, profile actions, and the five-column capability matrix for comments, uploads, and downloads.
94 lines
3.6 KiB
Vue
94 lines
3.6 KiB
Vue
<template>
|
||
<div class="aksrt-page-container">
|
||
<PageHeader title="用户功能" desc="用户中心的资料、背景图与公开资料均使用统一的能力矩阵和隐私规则。">
|
||
<template #actions>
|
||
<n-space>
|
||
<n-button quaternary @click="go('/permissions/capabilities')">基本权限</n-button>
|
||
<n-button quaternary @click="go('/page-display/user-home')">公开主页</n-button>
|
||
</n-space>
|
||
</template>
|
||
</PageHeader>
|
||
|
||
<n-spin :show="loading" style="width: 100%; min-height: 180px;">
|
||
<n-card class="aksrt-section-card">
|
||
<div class="aksrt-section-header"><h3>固定资料与操作入口</h3></div>
|
||
<n-space vertical size="large">
|
||
<n-alert type="info" :show-icon="false">
|
||
个人资料固定为昵称、个人签名、隐私设置、性别、个人网站、QQ、微信和 GitHub。公开资料由访问者身份过滤,原始社交资料不会下发给无权访客。
|
||
</n-alert>
|
||
<n-alert type="info" :show-icon="false">
|
||
背景图操作入口始终显示在资料卡右下角的三点菜单中;“上传头像”和“上传用户资料卡背景图”由基本权限矩阵控制。
|
||
</n-alert>
|
||
</n-space>
|
||
</n-card>
|
||
|
||
<n-card class="aksrt-section-card">
|
||
<div class="aksrt-section-header"><h3>用户中心面板</h3></div>
|
||
<n-form label-placement="left" label-width="170" class="aksrt-form">
|
||
<n-form-item label="可切换业务面板">
|
||
<n-checkbox-group v-model:value="form.dynamicTabs">
|
||
<n-space vertical>
|
||
<n-checkbox value="posts">我的文章</n-checkbox>
|
||
<n-checkbox value="comments">我的评论</n-checkbox>
|
||
<n-checkbox value="favorites">我的收藏</n-checkbox>
|
||
<n-checkbox value="credits">账户余额 / 签到</n-checkbox>
|
||
</n-space>
|
||
</n-checkbox-group>
|
||
</n-form-item>
|
||
</n-form>
|
||
</n-card>
|
||
|
||
<div class="aksrt-form-actions">
|
||
<n-button type="primary" :loading="saving" @click="handleSave">保存配置</n-button>
|
||
</div>
|
||
</n-spin>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { onMounted, reactive, ref } from 'vue'
|
||
import { useRouter } from 'vue-router'
|
||
import { useMessage } from 'naive-ui'
|
||
import api from '@/api'
|
||
import PageHeader from '@/components/PageHeader.vue'
|
||
|
||
const router = useRouter()
|
||
const message = useMessage()
|
||
const loading = ref(true)
|
||
const saving = ref(false)
|
||
const form = reactive({ dynamicTabs: ['posts', 'comments', 'favorites'] })
|
||
|
||
function go(path) { router.push(path) }
|
||
function extractData(response) { return response?.data ?? response ?? {} }
|
||
function parseTabs(value) {
|
||
const values = Array.isArray(value) ? value : String(value || '').split(/[\s,]+/)
|
||
return values.map((value) => String(value).trim()).filter((value) => ['posts', 'comments', 'favorites', 'credits'].includes(value))
|
||
}
|
||
|
||
async function load() {
|
||
loading.value = true
|
||
try {
|
||
const data = extractData(await api.getSchemaPage('users', 'features'))
|
||
form.dynamicTabs = parseTabs(data.user_center_tabs || 'profile,posts,comments,favorites')
|
||
} catch (error) {
|
||
message.error(error.message || '加载用户功能配置失败')
|
||
} finally {
|
||
loading.value = false
|
||
}
|
||
}
|
||
|
||
async function handleSave() {
|
||
saving.value = true
|
||
try {
|
||
await api.saveSchemaPage('users', 'features', { user_center_tabs: ['profile', ...form.dynamicTabs].join(',') })
|
||
message.success('用户功能配置已保存')
|
||
} catch (error) {
|
||
message.error(error.message || '保存失败')
|
||
} finally {
|
||
saving.value = false
|
||
}
|
||
}
|
||
|
||
onMounted(load)
|
||
</script>
|