新增: 项目卡片显示工程数(异步拉取 module 列表)

- ProjectCard 底部新增工程数统计(📁 N),异步拉取不阻塞卡片渲染
- 老项目无工程记录显示 0(不报错,与 list_project_modules 自动补建兼容)
This commit is contained in:
2026-06-30 22:00:14 +08:00
parent 2780f6affa
commit aa4d5213eb

View File

@@ -14,6 +14,10 @@
<!-- 底部信息 --> <!-- 底部信息 -->
<div class="card-footer"> <div class="card-footer">
<div class="footer-stat">
<span class="stat-icon">📁</span>
<span>{{ moduleCount }}</span>
</div>
<div class="footer-stat"> <div class="footer-stat">
<span class="stat-icon">📅</span> <span class="stat-icon">📅</span>
<span>{{ formatDate(project.created_at) }}</span> <span>{{ formatDate(project.created_at) }}</span>
@@ -35,18 +39,29 @@
// 项目列表卡片 — 从 Projects.vue 抽出(单卡片渲染 + 导航 + 删除触发)。 // 项目列表卡片 — 从 Projects.vue 抽出(单卡片渲染 + 导航 + 删除触发)。
// 依赖均为无副作用纯函数 + 共享常量;删除走 emit 交回父组件处理(confirm 弹层 + store 调用)。 // 依赖均为无副作用纯函数 + 共享常量;删除走 emit 交回父组件处理(confirm 弹层 + store 调用)。
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { ref, onMounted } from 'vue'
import { formatDate } from '@/utils/time' import { formatDate } from '@/utils/time'
import { parseStack } from '@/utils/project' import { parseStack } from '@/utils/project'
import { stripMd } from '@/utils/markdown' import { stripMd } from '@/utils/markdown'
import { moduleApi } from '@/api/module'
import { projectStatusLabel as statusLabel, projectBadgeClass as stageClass } from '@/constants/project' import { projectStatusLabel as statusLabel, projectBadgeClass as stageClass } from '@/constants/project'
import type { ProjectRecord } from '@/api/types' import type { ProjectRecord } from '@/api/types'
defineProps<{ project: ProjectRecord }>() const props = defineProps<{ project: ProjectRecord }>()
const emit = defineEmits<{ const emit = defineEmits<{
(e: 'delete', project: ProjectRecord): void (e: 'delete', project: ProjectRecord): void
}>() }>()
const router = useRouter() const router = useRouter()
// 工程数(异步拉取,展示在卡片底部)
const moduleCount = ref(0)
onMounted(async () => {
try {
const list = await moduleApi.listProjectModules(props.project.id)
moduleCount.value = list.length
} catch { /* 老项目无工程记录不报错 */ }
})
</script> </script>
<style scoped> <style scoped>