Files
hjc-web/app/components/HjcUserBar.vue
T
weicw1996 9299485899 feat(hjc-web): 标书详情加「收藏」按钮,「我的收藏」页与顶栏入口
后端接口是端无关的,本轮 **mp-java 零改动**,纯前端 + Nitro 代理。

- 新增 favorites.get/post/delete 三个站内代理,原样透传 ApiResult
  (HTTP 恒 200,按 body.code 判登录态与业务失败)。delete 用查询串传 projectId。
- detail.get.ts 补发 Authorization:详情接口内联了 favorited,而它此前是匿名调用,
  已收藏的项目会显示成「未收藏」。未登录时不带这个头,行为与改动前完全一致
  (返回体仍整体返回 data,favorited 正是靠这一点透传的)。
- 「我的收藏」做成**模板无关的公共路由** app/pages/tender/favorites.vue(10 套模板共用),
  顶栏 HjcUserBar 在「我的订单」后加入口。列表按收藏时间倒序 + 加载更多;
  只渲染后端算好的 saleState/purchased(前端不再判一遍);失效项目**保留条目**、
  点击只提示不进详情、仍可取消;取消收藏弹二次确认(复用 HjcConfirmDialog)。
  取数用 useRequestFetch —— 裸 $fetch 在 SSR 不转发 cookie,会被代理当成匿名调用,
  拿到 401 后 handleAuthCode 会清凭据跳登录,等于刷新页面把自己登出。
- template-07 详情页加收藏按钮(heart SVG 两态,不引图标库),未登录点它跳登录、
  回跳带 favorite=1 后自动补一次收藏(只在客户端 onMounted 做,不改写 URL——
  详情壳是 :key="route.fullPath",改 query 会重挂载并与收藏请求赛跑)。
  取数同样改用 useRequestFetch,否则首屏 favorited 恒为 false。
- 只改 template-07:10 套模板里只有它有 TenderDetail.vue,其余按需再补。
2026-09-17 17:37:10 +08:00

42 lines
1.8 KiB
Vue

<template>
<div class="flex items-center gap-4 text-sm">
<template v-if="loggedIn">
<span class="text-gray-500">{{ displayName }}</span>
<NuxtLink to="/tender/orders" class="text-blue-600 hover:underline">我的订单</NuxtLink>
<NuxtLink to="/tender/favorites" class="text-blue-600 hover:underline">我的收藏</NuxtLink>
<NuxtLink to="/tender/qualification" class="text-blue-600 hover:underline">企业资质</NuxtLink>
<NuxtLink to="/change-password" class="text-blue-600 hover:underline">修改密码</NuxtLink>
<button class="text-gray-500 hover:text-red-600" @click="doLogout">退出</button>
</template>
<template v-else>
<NuxtLink to="/login" class="text-blue-600 hover:underline">登录</NuxtLink>
<NuxtLink to="/register" class="text-blue-600 hover:underline">企业注册</NuxtLink>
</template>
</div>
</template>
<script setup lang="ts">
const { isLoggedIn, user, logout } = useHjcAuth()
/**
* 写成 computed 而不是 `ref(isLoggedIn())`:后者只在组件挂载那一刻求值一次,
* 之后别处清掉凭据(如 401 处理、另一个页签退出)本组件不会跟着变。
*/
const loggedIn = computed(() => isLoggedIn())
/**
* 显示企业名称,取 `username` 而非 `nickname`。
*
* 核心实例建号时会把 `nickname` **无条件覆盖**成打码手机号(`155****2748`,见
* `.scratch/hjc-auth/spec.md` 的 Q16 = G-a),拿它当企业名显示是错的;
* 而 `username` 就是「企业名称(登录账号)」,注册后不可变更,也是 `hjc_enterprise.name` 的值。
*/
const displayName = computed(() => user.value?.username || user.value?.nickname || '企业')
async function doLogout() {
// logout() 会先通知后端(无服务端会话),再清本地凭据
await logout()
return navigateTo('/tender')
}
</script>