diff --git a/docs/业务进度管理.md b/docs/业务进度管理.md index 1664473e..8258f569 100644 --- a/docs/业务进度管理.md +++ b/docs/业务进度管理.md @@ -39,6 +39,7 @@ - 详情按钮跳转开奖详情页，历史开奖按钮跳转开奖记录列表页；开奖详情同时兼容旧 `id` 参数和新开奖表使用的 `code + issue` 参数，开奖结果与现有 API 数据保持兼容。 - 根据验收反馈统一收紧页面字号，标题、导航、彩种、开奖卡片、倒计时、号码和 AI 弹窗文字均降低一档，保持信息层级和可读性。 - 开奖详情页同步开奖记录列表的渐变导航、白色圆角卡片、状态标签和号码球视觉，补充彩种图标、期号日期信息及统一卡片间距。 +- 开奖详情进一步按开奖记录列表的颜色、字号和卡片规格统一；页面底部动态读取“彩票资讯”分类的最新 5 条文章，支持进入现有资讯详情页，避免详情页内容过短留白。 涉及模块： diff --git a/docs/设计稿映射.md b/docs/设计稿映射.md index 17bb62f1..bb970d3f 100644 --- a/docs/设计稿映射.md +++ b/docs/设计稿映射.md @@ -28,7 +28,7 @@ | 赛事详情页 | `uniapp/src/pages/match_detail/match_detail.vue` | 🚧 部分完成 | 2026-05-29 优化顶部赛事摘要头部，补充联赛、对阵、状态与直播入口信息；2026-08-03 顶部改为设计稿的沉浸式直播大图与比分区，详情接口可按已绑定关系或直播标题中的主客队名称匹配房间，多房间可横向切换 | | 世界杯专题页（排名导航） | `uniapp/src/packages_match/pages/worldcup.vue` | 🚧 部分完成 | 2026-05-20 已按设计稿拆分排名导航、积分榜、球员榜组件；2026-08-03 赛程卡会按赛事 ID、主客队名和直播标题匹配直播列表，命中后显示“看直播”入口；后续可继续细化表格视觉与新闻页样式 | | 首页 | `uniapp/src/pages/index/index.vue` | 🚧 部分完成 | 2026-07-31 已按当前设计图重构为“今日焦点赛程、主推大图、最新资讯”三段式首页；2026-08-02 频道栏改为可横向滑动，频道项固定宽度并统一间距；频道仍复用后台配置分类，待实际 H5 页面验收后确认最终状态 | -| 彩票中心 | `uniapp/src/pages/lottery_analysis/lottery_analysis.vue` | 🚧 部分完成 | 2026-08-03 按彩票中心设计稿重构顶部品牌导航、开奖大厅/关注/日历导航、横向彩种胶囊、风险提示及最新开奖卡片；保留开奖结果、倒计时、详情与历史开奖入口，待 H5 页面验收 | +| 彩票中心 | `uniapp/src/pages/lottery_analysis/lottery_analysis.vue`、`uniapp/src/packages_lottery/pages/detail.vue` | 🚧 部分完成 | 2026-08-03 按彩票中心设计稿重构顶部品牌导航、开奖大厅/关注/日历导航、横向彩种胶囊、风险提示及最新开奖卡片；保留开奖结果、倒计时、详情与历史开奖入口。开奖详情已同步开奖记录列表的视觉规格，并动态展示彩票资讯，待 H5 页面验收 | | 社区广场 | `uniapp/src/pages/community/community.vue` | 🚧 部分完成 | 2026-08-02 已按优化设计稿重构为社区信息流；入口路径调整为 `/pages/community/community`，旧 `/pages/empty/empty` 与旧分包入口会自动跳转；顶部积分入口已在频道导航栏内上下居中；付费帖子未解锁区域已调整为上深下浅纵向渐变面板和底部居中描边按钮；锁定付费卡片的付费提示与积分状态改为顶部左右同排，免费及积分状态均固定右上角顶对齐；帖子卡片互动栏仅保留浏览、评论、点赞并按三等分排列，计数支持去除 `.0` 及 `k / 万 / 亿` 紧凑显示，待 H5 发布后验收实际效果 | | 社区帖子详情 | `uniapp/src/packages_community/pages/post_detail.vue` | 🚧 部分完成 | 2026-08-03 解锁卡已按设计稿优化为浅蓝渐变、同心圆实心锁、积分信息区、渐变解锁按钮与居中提示；“积分规则”复用通用富文本协议页，并由管理端协议设置配置内容；页面主体、解锁卡、互动评论与输入栏已压缩字号及间距；互动统计与评论区改为连续卡片层级，评论点赞置于正文右侧并统一使用紧凑计数；未解锁帖子始终显示免费预览“展开”按钮，折叠态按钮位于摘要末行右侧；已有译文的帖子按标点短语进行原文/译文一对一交错显示；430px H5 页面已复核，App/小程序与正式构建待验收 | | 新闻详情 | `uniapp/src/pages/news_detail/news_detail.vue` | 待核对 | 富文本与图片渲染已存在相关实现 | diff --git a/uniapp/src/packages_lottery/pages/detail.vue b/uniapp/src/packages_lottery/pages/detail.vue index dfc6df14..ac0a453d 100644 --- a/uniapp/src/packages_lottery/pages/detail.vue +++ b/uniapp/src/packages_lottery/pages/detail.vue @@ -18,21 +18,10 @@ - - - - {{ drawData.category?.name || '' }} - - 第 {{ drawData.period }} 期 - {{ drawData.draw_date || '开奖日期待定' }} - - - - + + {{ drawData.category?.name || '' }} + 第 {{ drawData.period }} 期 + {{ drawData.draw_date || '开奖日期待定' }} {{ drawData.status === 1 ? '已开奖' : '待开奖' }} @@ -106,7 +95,9 @@ - 进入AI智能分析 + AI + 智能预测 + › @@ -175,6 +166,24 @@ + + + + 彩票资讯 + 最新动态 + + + + {{ item.title }} + + {{ item.author || '彩票资讯' }} + {{ formatNewsTime(item.create_time) }} + + + + + + 声明：开奖数据仅供参考，请以官方公布为准。 @@ -191,11 +200,13 @@ import { ref, computed } from 'vue' import { onLoad } from '@dcloudio/uni-app' import { getLotteryDrawDetail } from '@/api/lottery' +import { getArticleCate, getArticleList } from '@/api/news' const statusBarHeight = ref(0) const loading = ref(true) const drawData = ref(null) const errorMsg = ref('') +const lotteryNews = ref([]) uni.getSystemInfo({ success: (res) => { @@ -243,6 +254,30 @@ const fetchDetail = async (params: { id?: number; code?: string; issue?: string } } +const fetchLotteryNews = async () => { + try { + const categories = await getArticleCate() + const lotteryCategory = (categories || []).find((item: any) => String(item?.name || '').includes('彩票')) + if (!lotteryCategory?.id) return + + const data = await getArticleList({ + cid: lotteryCategory.id, + page_no: 1, + page_size: 5 + }) + lotteryNews.value = data?.lists || [] + } catch (error) { + console.log('彩票资讯加载失败=>', error) + } +} + +const formatNewsTime = (value: string) => String(value || '').slice(0, 10) + +const goNewsDetail = (id: number) => { + if (!id) return + uni.navigateTo({ url: `/pages/news_detail/news_detail?id=${id}` }) +} + const aiLoading = ref(false) const aiLoaded = ref(false) const aiError = ref('') @@ -274,6 +309,7 @@ onLoad((options: any) => { loading.value = false errorMsg.value = '参数错误' } + fetchLotteryNews() }) @@ -321,95 +357,52 @@ onLoad((options: any) => { } .dd-body { - padding: 20rpx 24rpx 40rpx; + padding: 0 0 40rpx; } .dd-info { display: flex; align-items: center; - justify-content: space-between; - gap: 16rpx; + margin: 20rpx 24rpx 0; padding: 24rpx; - margin-bottom: 20rpx; background: #fff; - border: 1rpx solid #f0f0f0; border-radius: 16rpx; - box-shadow: 0 6rpx 20rpx rgba(24, 93, 255, 0.04); - &__identity { - min-width: 0; - display: flex; - align-items: center; - gap: 16rpx; - } - - &__logo { - width: 72rpx; - height: 72rpx; - flex: 0 0 72rpx; - display: flex; - align-items: center; - justify-content: center; - overflow: hidden; - border-radius: 16rpx; - background: linear-gradient(135deg, #185dff, #ff6b6b); - } - - &__logo-img { + &__header { width: 100%; - height: 100%; - } - - &__logo-text { - color: #fff; - font-size: 30rpx; - font-weight: bold; - } - - &__meta { - min-width: 0; display: flex; - flex-direction: column; + align-items: center; + gap: 12rpx; } &__name { + flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; - font-size: 32rpx; + font-size: 28rpx; font-weight: bold; color: #222; } - &__sub { - display: flex; - align-items: center; - gap: 12rpx; - margin-top: 8rpx; - } - &__period { font-size: 24rpx; - color: #185dff; - background: #E5EDFF; - padding: 4rpx 12rpx; - border-radius: 8rpx; + color: #999; white-space: nowrap; } &__date { + min-width: 0; + margin-left: auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; - font-size: 22rpx; + font-size: 24rpx; color: #999; } - &__status { - flex-shrink: 0; - } - &__badge { + flex-shrink: 0; font-size: 22rpx; color: #22c55e; background: #f0fdf4; @@ -424,12 +417,10 @@ onLoad((options: any) => { } .dd-result { + margin: 20rpx 24rpx 0; background: #fff; border-radius: 16rpx; padding: 24rpx; - margin-bottom: 20rpx; - border: 1rpx solid #f0f0f0; - box-shadow: 0 6rpx 20rpx rgba(24, 93, 255, 0.04); &__header { display: flex; @@ -520,8 +511,8 @@ onLoad((options: any) => { border-top: 1rpx solid #f0f0f0; &__label { - font-size: 26rpx; - color: #666; + font-size: 24rpx; + color: #999; margin-bottom: 12rpx; } @@ -533,7 +524,7 @@ onLoad((options: any) => { } .dd-tag { - font-size: 24rpx; + font-size: 22rpx; color: #333; background: #f5f5f5; padding: 8rpx 20rpx; @@ -569,13 +560,11 @@ onLoad((options: any) => { } .dd-pending { + margin: 20rpx 24rpx 0; background: #fff; border-radius: 16rpx; - padding: 48rpx 24rpx; + padding: 32rpx 24rpx; text-align: center; - margin-bottom: 20rpx; - border: 1rpx solid #f0f0f0; - box-shadow: 0 6rpx 20rpx rgba(24, 93, 255, 0.04); &__icon { font-size: 64rpx; @@ -598,12 +587,10 @@ onLoad((options: any) => { } .dd-rule { + margin: 20rpx 24rpx 0; background: #fff; border-radius: 16rpx; padding: 24rpx; - margin-bottom: 20rpx; - border: 1rpx solid #f0f0f0; - box-shadow: 0 6rpx 20rpx rgba(24, 93, 255, 0.04); &__title { font-size: 28rpx; @@ -619,8 +606,82 @@ onLoad((options: any) => { } } +.dd-news { + margin: 20rpx 24rpx 0; + padding: 24rpx; + background: #fff; + border-radius: 16rpx; + + &__header { + display: flex; + align-items: center; + justify-content: space-between; + padding-bottom: 20rpx; + } + + &__title { + font-size: 28rpx; + font-weight: bold; + color: #222; + } + + &__sub { + font-size: 24rpx; + color: #999; + } + + &__item { + display: flex; + align-items: stretch; + gap: 16rpx; + padding: 20rpx 0; + border-top: 1rpx solid #f0f0f0; + } + + &__content { + min-width: 0; + flex: 1; + display: flex; + flex-direction: column; + justify-content: space-between; + } + + &__item-title { + display: -webkit-box; + overflow: hidden; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + font-size: 26rpx; + line-height: 1.45; + color: #333; + } + + &__meta { + display: flex; + gap: 12rpx; + margin-top: 12rpx; + overflow: hidden; + color: #999; + font-size: 22rpx; + + text { + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + } + + &__image { + width: 160rpx; + height: 108rpx; + flex: 0 0 160rpx; + border-radius: 8rpx; + background: #f5f5f5; + } +} + .dd-disclaimer { - padding: 30rpx 0; + padding: 30rpx 24rpx 0; text-align: center; font-size: 22rpx; color: #ccc; @@ -636,12 +697,10 @@ onLoad((options: any) => { /* AI预测区块 */ .ai-section { + margin: 20rpx 24rpx 0; background: #fff; border-radius: 16rpx; padding: 24rpx; - margin-bottom: 20rpx; - border: 1rpx solid #f0f0f0; - box-shadow: 0 6rpx 20rpx rgba(24, 93, 255, 0.04); &__header { display: flex; @@ -685,14 +744,35 @@ onLoad((options: any) => { } .ai-btn { + display: inline-flex; + align-items: center; + gap: 10rpx; background: linear-gradient(135deg, #6366f1, #8b5cf6); - padding: 20rpx 60rpx; - border-radius: 40rpx; + padding: 16rpx 36rpx; + border-radius: 36rpx; + box-shadow: 0 8rpx 24rpx rgba(102, 126, 234, 0.4); + + &__icon { + padding: 4rpx 14rpx; + color: #fff; + background: rgba(255, 255, 255, 0.3); + border-radius: 10rpx; + font-size: 24rpx; + font-weight: 900; + letter-spacing: 2rpx; + } &__text { color: #fff; font-size: 28rpx; font-weight: bold; + letter-spacing: 2rpx; + } + + &__arrow { + color: rgba(255, 255, 255, 0.8); + font-size: 36rpx; + font-weight: bold; } }