hulai-website/components/guides/GuideActivityCard.vue
Mimingguang ee078b61bc feat: 后台管理系统完整重构 + 前后台数据联通
- 后台全面引入 Naive UI 组件库,统一 UI 规范
- 前台 usePublicApi 切换到 API 调用(GET /api/content/[key])
- 前后台数据源统一(site_content 表)
- 产品线统一管理(tour/camp/course 三套编辑器)
- 产品数据归一化(itinerary/faq/pricing 格式统一)
- 表单提交 API 改写入 submissions 表
- 新增 submissions 标记已读 API
- site-content PUT 支持 upsert
- 修复前台 bug(stories 路由冲突、占位符警告、selector breadcrumb)
- 消除 PageHero 类型警告(useSEO reactive 修复)
- 25 个前台页面全部 HTTP 200,展示效果不变

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-24 17:48:02 +08:00

68 行
1.3 KiB
Vue

<template>
<div class="activity-card">
<h4 class="activity-name">
<span class="activity-icon">{{ activity.icon }}</span>
{{ activity.name }}
</h4>
<ul class="activity-points">
<li v-for="(point, i) in activity.points" :key="i" class="activity-point">
{{ point }}
</li>
</ul>
</div>
</template>
<script setup>
defineProps({
activity: { type: Object, required: true },
})
</script>
<style lang="less" scoped>
.activity-card {
background: @color-bg-white;
border: 1px solid @color-border;
border-radius: @border-radius-md;
padding: @space-lg;
}
.activity-name {
display: flex;
align-items: center;
gap: @space-sm;
font-size: @font-size-md;
font-weight: @font-weight-bold;
color: @color-primary;
margin: 0 0 @space-md;
}
.activity-icon {
font-size: @font-size-lg;
}
.activity-points {
display: flex;
flex-direction: column;
gap: @space-sm;
padding: 0;
margin: 0;
list-style: none;
}
.activity-point {
font-size: @font-size-sm;
color: @color-text-secondary;
line-height: @line-height-base;
padding-left: @space-md;
position: relative;
&::before {
content: '·';
position: absolute;
left: 0;
color: @color-primary;
font-weight: @font-weight-bold;
}
}
</style>