feat(announcement): 新增首页弹窗公告功能并完成弹窗UI视觉重构
- 数据库与后端:announcements 表增加 is_popup 字段及迁移脚本,提供前台弹窗接口与多公告优先级选取,补全选优单测 - 管理后台:总后台与分销后台公告编辑新增「弹窗公告」开关与列表标签展示 - 前台交互:前台 PC/移动端首页引入 AnnouncementPopup,支持同一用户同一天同一公告仅弹一次的关闭记录 - 视觉优化:重构弹窗结构,顶栏镶嵌品牌橙流光细条与浅暖橙通知徽标,中间内嵌浅灰舒适阅读卡片,底部搭配大锤橙实心主操作按钮 - 验证方式:后端 announcement 单测通过,前端 npm run build 编译无报错,浏览器实机截图验证
This commit is contained in:
@@ -13,6 +13,7 @@ import {
|
||||
type HomeBannerSlide,
|
||||
} from '@/features/listings/api/homeConfig'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import AnnouncementPopup from '@/features/announcement/components/AnnouncementPopup.vue'
|
||||
import AuthImage from '@/shared/components/business/AuthImage.vue'
|
||||
import {
|
||||
emptyListingPublishOptions,
|
||||
@@ -497,6 +498,9 @@ if (!restored) {
|
||||
<section class="pc-home-redesign">
|
||||
<HomeAnnouncement :announcements="displayAnnouncements" />
|
||||
|
||||
<!-- 弹窗公告:进入首页弹出,必须手动关闭,同一天同一条只弹一次 -->
|
||||
<AnnouncementPopup />
|
||||
|
||||
<main class="home-content">
|
||||
<!-- 商城专属标识 Banner -->
|
||||
<div v-if="siteStore.isDistribution" class="dist-portal-banner">
|
||||
|
||||
@@ -24,6 +24,7 @@ import {
|
||||
type HomeBannerSlide,
|
||||
} from '@/features/listings/api/homeConfig'
|
||||
import { showToast } from 'vant'
|
||||
import AnnouncementPopup from '@/features/announcement/components/AnnouncementPopup.vue'
|
||||
import AuthImage from '@/shared/components/business/AuthImage.vue'
|
||||
import MobileHomeFilterSheet, { type FilterSection } from './MobileHomeFilterSheet.vue'
|
||||
import {
|
||||
@@ -795,6 +796,8 @@ if (!restoreHomeConfigFromCache()) {
|
||||
|
||||
<template>
|
||||
<main class="mobile-shell">
|
||||
<!-- 弹窗公告:进入首页弹出,必须手动关闭,同一天同一条只弹一次 -->
|
||||
<AnnouncementPopup />
|
||||
<div ref="scrollEl" class="mobile-scroll" @scroll.passive="handleListScroll">
|
||||
<!-- ========== Hero 区域:顶部搜索与公告 ========== -->
|
||||
<section class="mobile-hero">
|
||||
|
||||
Reference in New Issue
Block a user