Compare commits

..
11 Commits
Author SHA1 Message Date
jacobxu666andClaude Fable 5 9276bd6140 合并:中奖名单公示页搜索修复(feature/venue-discount-rights-filter → xuchao)
冲突解决:venue 列表灰底间距与卡片内边距取 feature 侧设计修正;card-address 保留 min-width:0;index 页面取页级滚动方案。

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-29 17:02:29 +08:00
jacobxu666andClaude Fable 5 748c4563fd fix: 中奖名单公示页搜索修复——输入关键字时自动按大页拉全当期名单再本地过滤,修复未翻页的中奖者(如王球莲)搜索无结果的问题;接口无姓名参数,pageSize=500×N 循环实测 4 请求 2000 条,拉全失败静默降级
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-29 16:58:42 +08:00
jacobxu666andClaude Fable 5 2a6b86977c feat: 商铺详情隐藏汽油券购买入口(业务调整:该商铺不再特殊处理购买,券页面/接口/SDK注入均保留)
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-28 22:22:50 +08:00
jacobxu666andClaude Fable 5 044b26d035 feat: 控件唤起失败提示改为「支付已取消,请重新支付」,[诊断]行暂留采集真实错误码以便区分取消与容器不支持
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-28 20:02:44 +08:00
jacobxu666andClaude Fable 5 b6bbb0b219 fix: 云闪付控件唤起路线B——发布脚本向构建产物index.html注入upsdk静态标签(HBuilderX不吃根模板,控件桥需静态加载);白名单豁免下线,唤起失败统一弹指引模态
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-28 19:25:11 +08:00
jacobxu666andClaude Fable 5 8b3ac20e34 fix: 权益详情页修复底部预约条遮挡「权益说明」
- .bottom-bar 是 position:fixed 不占文档流,「权益说明」作为最后一个内容块,
  短屏滚到底会被预约条压住
- 内容容器按底栏高度预留空间:padding-bottom calc(80px + env(safe-area-inset-bottom))
  (底栏 12 + 按钮 44 + 12 = 68px,另留 12px 呼吸位,并兼容全面屏安全区)
- 仅在存在底栏时生效:类名与底栏共用 detail.isAppointment 条件,不可预约的权益不会多出空白

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-28 16:27:03 +08:00
jacobxu666andClaude Fable 5 eb01701709 feat: 列表卡片新增所属地区角标,并修正筛选条间距与遮罩压灰
- 三个列表(文旅场馆/商户折扣/权益待使用)缩略图左上角增加所属地区角标:
  缩略图外套 .card-thumb 承担尺寸与圆角裁切,角标半透明黑底白字 10px;
  districtName 为空的记录不渲染角标,避免空色块
- 新增 common/district.js:后端返回的是行政区划全称,卡片位宽只有 75px,
  按「芷江侗族自治县→芷江、中方县→中方、怀化高新技术产业开发区→怀化高新区」缩短显示
- 筛选条与列表的 12px 间隔移到头部白底之外(各页 .list-area 顶部内边距),
  此前放在头部内是白色、与白色卡片连成一片,视觉上等于没有间隔
- 遮罩由 fixed 改为从筛选条下边缘绝对定位铺开:fixed 会落进 sticky 头部的层叠上下文,
  把搜索栏和筛选条一起压灰;现改为列表变暗、头部保持原色
- 权益页搜索框加 1px #e5e5ea 描边:吸顶栏改白底后白色输入框无边框可辨

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-28 15:55:17 +08:00
jacobxu666andClaude Fable 5 eeb6b91e0a feat: 场馆/折扣/权益待使用列表新增「所属县区 + 所属类型」筛选条
- 新增 components/hhrs-filter-bar:两个等宽入口平分并占满容器宽、无底色、蓝字选中态;
  面板首项「全部 X」即清空该维度(因此没有独立重置按钮)
- 三页接入;选项与各选项命中条数由列表接口在响应里一并返回(后端已按关键词与另一维度算好)
- 筛选与关键词为 AND;切筛选回第 1 页,复用各页现有 reqSeq 竞态保护
- 某维度无可选项时(如商铺未录入所在地区)该入口自动不渲染,避免点开空面板
- 三页头部间距统一为「搜索栏↔筛选条 = 筛选条↔列表 = 10px」

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-09-28 15:12:38 +08:00
jacobxu666 381e609001 Merge branch 'master' into xuchao 2026-09-03 16:29:20 +08:00
jacobxu666 41a380562a 添加.gitignore,忽略构建产物和node_modules 2026-07-17 11:09:59 +08:00
jacobxu666 476cb64ee2 优化首页、场馆、折扣页面卡片布局及宽屏适配
- 首页:banner限制最大高度300px,页面支持滚动
- 场馆/折扣:卡片结构统一,地址和距离合并容器靠右对齐
- 卡片宽度自适应屏幕,间距统一margin 12px
- card-name填充容器,超长截断
2026-07-17 11:08:57 +08:00
13 changed files with 631 additions and 60 deletions
+10
View File
@@ -0,0 +1,10 @@
// xuchao: 卡片角标用的区县简称。后端 districtName 返回的是 region.name 行政区划全称
// (如「芷江侗族自治县」「怀化高新技术产业开发区」),列表缩略图只有 75px,必须缩短显示
export function shortDistrict(name) {
if (!name) return ''
return name
.replace('高新技术产业开发区', '高新区')
.replace(/(苗族|侗族|瑶族|回族|土家族|各族)*自治县$/, '')
.replace(/(苗族|侗族|瑶族|回族|土家族|各族)*自治州$/, '')
.replace(/([^市])县$/, '$1')
}
+2 -9
View File
@@ -1,14 +1,13 @@
// xuchao: 怀化石油汽油减免券——前端常量与工具(全写死,只服务这一个门店,决策 1/10/15) // xuchao: 怀化石油汽油减免券——前端常量与工具(全写死,只服务这一个门店,决策 1/10/15)
// 价格真相在后端常量(20000 分),此处 200.00 仅展示用,两处改价必须同步 // 价格真相=后端配置 hh.voucher.price-fen 经 latest 下发;此处 200.00 仅为接口未返回时的展示兜底
export const PETROL_SHOP_ID = '851219003520709' export const PETROL_SHOP_ID = '851219003520709'
export const VOUCHER_PRICE_TEXT = '200.00' export const VOUCHER_PRICE_TEXT = '200.00'
// xuchao: 非云闪付环境豁免拦截的联调手机号(决策 13)
export const VOUCHER_PAY_WHITELIST_PHONE = '18684839400'
export const VOUCHER_NAME = '怀化石油汽油电子券' export const VOUCHER_NAME = '怀化石油汽油电子券'
export const VOUCHER_GUIDE_TEXT = '请在「云闪付 App」里的「湖南社保卡」小程序首页进入「怀化社保卡」活动中完成购买' export const VOUCHER_GUIDE_TEXT = '请在「云闪付 App」里的「湖南社保卡」小程序首页进入「怀化社保卡」活动中完成购买'
export const VOUCHER_CANCEL_TEXT = '支付已取消,请重新支付'
// 券详情页「使用规则 / 使用流程 / 重要须知」文案,来自石油侧材料(决策 14) // 券详情页「使用规则 / 使用流程 / 重要须知」文案,来自石油侧材料(决策 14)
export const VOUCHER_USE_RULES = [ export const VOUCHER_USE_RULES = [
@@ -35,12 +34,6 @@ export function injectUpSdk() {
document.head.appendChild(s) document.head.appendChild(s)
} }
// xuchao: 云闪付容器判定只看 UA——不能掺 window.upsdk 是否已加载(SDK 是异步注入的,
// 首屏点击时可能还没 load 完,会把云闪付内首点误判为站外)。UA 关键字真机实测后定稿。
export function isUnionPayApp() {
if (typeof navigator === 'undefined' || !navigator.userAgent) return false
return /unionpay|upsdk|云闪付/i.test(navigator.userAgent)
}
// xuchao: open-api/hhService/voucher/* 为双层壳:外层 errcode,内层 data.code 才是业务码 // xuchao: open-api/hhService/voucher/* 为双层壳:外层 errcode,内层 data.code 才是业务码
// (同 login.vue 的 isBizOk 判定,提到公共层复用) // (同 login.vue 的 isBizOk 判定,提到公共层复用)
@@ -0,0 +1,215 @@
<template>
<!-- xuchao: 列表页「所属县区 + 所属类型」筛选条。两个入口等宽平分并占满容器宽,无底色,
选中态只用品牌蓝字表达;面板第一行「全部 X」即清空该维度(所以没有独立重置按钮)。
选项与各选项条数由列表接口在响应里一并返回,已按关键词与另一维度筛算好(districts/categories 首项即「全部」)。 -->
<view class="hfb" v-if="ready">
<view class="hfb-row">
<view class="hfb-item" v-if="districtReady" :class="{ 'hfb-item--on': !!districtId }" @click="toggle('district')">
<text class="hfb-text">{{ districtText }}</text>
<view class="hfb-caret" :class="{ 'hfb-caret--up': openKey === 'district' }">
<u-icon name="arrow-down-fill" size="20" :color="districtId ? '#0088ff' : '#bbbbbb'"></u-icon>
</view>
</view>
<view class="hfb-item" v-if="categoryReady" :class="{ 'hfb-item--on': !!category }" @click="toggle('category')">
<text class="hfb-text">{{ categoryText }}</text>
<view class="hfb-caret" :class="{ 'hfb-caret--up': openKey === 'category' }">
<u-icon name="arrow-down-fill" size="20" :color="category ? '#0088ff' : '#bbbbbb'"></u-icon>
</view>
</view>
</view>
<view class="hfb-mask" v-if="openKey" @click="close"></view>
<view class="hfb-panel" v-if="openKey">
<scroll-view scroll-y class="hfb-list">
<view class="hfb-opt" v-for="o in openOptions" :key="o.value"
:class="{ 'hfb-opt--sel': current === o.value }" @click="pick(o.value)">
<text class="hfb-opt-label">{{ o.label }}</text>
<text class="hfb-opt-count">{{ o.count }}</text>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
export default {
name: 'hhrs-filter-bar',
props: {
// xuchao: [{value,label,count}],首项为「全部 X」(value=''),县区 value 是行政区划码
districts: { type: Array, default: () => [] },
categories: { type: Array, default: () => [] },
districtId: { type: String, default: '' },
category: { type: String, default: '' }
},
data() {
return {
openKey: '',
// xuchao: 记住见过的 value→label,避免关键词把选中项挤出选项列表后入口只能显示区划码
labelCache: {}
}
},
computed: {
// xuchao: 选项首项固定是「全部」,长度>1 才算该维度真有可选项。
// 某维度没有可选项(如商铺未录入「所在地区」)时只隐藏它自己的入口,
// 两个都没有则整条筛选不渲染,避免出现点开是空面板
districtReady() { return this.districts.length > 1 },
categoryReady() { return this.categories.length > 1 },
ready() { return this.districtReady || this.categoryReady },
openOptions() {
return this.openKey === 'district' ? this.districts : this.categories
},
current() {
return this.openKey === 'district' ? this.districtId : this.category
},
districtText() {
return this.districtId ? this.cachedLabel('district', this.districtId) : '所属县区'
},
categoryText() {
return this.category ? this.cachedLabel('category', this.category) : '所属类型'
}
},
watch: {
districts(list) { this.remember(list, 'district') },
categories(list) { this.remember(list, 'category') }
},
created() {
this.remember(this.districts, 'district')
this.remember(this.categories, 'category')
},
methods: {
remember(list, kind) {
// xuchao: 必须用 $set,Vue2 对新增对象键不做响应,入口文字会跟不上缓存
(list || []).forEach(o => {
if (o.value) this.$set(this.labelCache, kind + ':' + o.value, o.label)
})
},
cachedLabel(kind, value) {
return this.labelCache[kind + ':' + value] || value
},
toggle(key) {
// xuchao: 再点同一个入口即收起,避免面板卡在打开态
this.openKey = this.openKey === key ? '' : key
},
close() {
this.openKey = ''
},
pick(value) {
if (this.openKey === 'district') {
this.$emit('change', { districtId: value, category: this.category })
} else {
this.$emit('change', { districtId: this.districtId, category: value })
}
this.openKey = ''
}
}
}
</script>
<style scoped lang="less">
/* xuchao: 根节点贴在 sticky 头部内,面板绝对定位到筛选条下方。
只留上内边距:与列表的 12px 间隔必须落在头部的白底之外(各页 .list-area 的 padding-top),
放在这里会是白色,头部白底和白色卡片连成一片,看上去就等于没有间隔 */
.hfb {
position: relative;
padding: 24rpx 0 0;
}
.hfb-row {
display: flex;
gap: 20rpx;
}
.hfb-item {
flex: 1;
min-width: 0;
height: 64rpx;
display: flex;
align-items: center;
justify-content: center;
gap: 8rpx;
font-size: 28rpx;
color: #333333;
}
.hfb-item--on {
color: #0088ff;
font-weight: 600;
}
.hfb-text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.hfb-caret {
display: flex;
transition: transform 0.18s;
}
.hfb-caret--up {
transform: rotate(180deg);
}
/* xuchao: 遮罩绝对定位在筛选条下方(不用 fixed)—— fixed 会盖进 sticky 头部的层叠上下文,
把搜索栏和筛选条一起压灰。这里从筛选条下边缘开始向下铺满一屏,列表变暗、头部保持原色 */
.hfb-mask {
position: absolute;
top: 100%;
left: -12px;
right: -12px;
height: 100vh;
background: rgba(0, 0, 0, 0.3);
z-index: 90;
}
/* xuchao: 面板左右各超出 12px(与页面头部的 12px 内边距等值,用 px 才能在各屏宽下都对齐),
使面板与手机边缘齐平 */
.hfb-panel {
position: absolute;
left: -12px;
right: -12px;
top: 100%;
z-index: 100;
background: #ffffff;
border-radius: 0 0 28rpx 28rpx;
box-shadow: 0 20rpx 48rpx rgba(0, 0, 0, 0.12);
padding: 12rpx 12rpx 16rpx;
}
.hfb-list {
max-height: 620rpx;
}
.hfb-opt {
display: flex;
align-items: center;
justify-content: space-between;
height: 84rpx;
padding: 0 24rpx;
border-radius: 16rpx;
font-size: 28rpx;
color: #333333;
}
.hfb-opt--sel {
background: #e6f2ff;
color: #0088ff;
font-weight: 600;
}
.hfb-opt-label {
flex: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-right: 16rpx;
}
.hfb-opt-count {
flex-shrink: 0;
font-size: 24rpx;
color: #bbbbbb;
}
</style>
@@ -0,0 +1,52 @@
# 第一期中奖名单导入记录(2026-09-29)
## 背景
怀化市社保卡千万好礼促消费活动第一期开奖名单产生后,需导入 UAT 库 `dscp_business_uat.hhrs_winner` 表,供公示页 https://hh.hn12301.net/#/pages/winners/winners 展示。
## 数据来源
| 文件 | 内容 |
| --- | --- |
| `抽奖-中奖数据.xlsx`(2026-09-29 10:21 导出) | 第一期中奖名单原始文件:2000 人(姓名+脱敏身份证号) |
| `抽奖-中奖数据-匹配hhrs_lottery_pool-batch1.csv` | 与抽奖池 `hhrs_lottery_pool`(batch_no=1)匹配结果:2001 行(1 人双卡) |
## 导入内容与校验
- 导入通道:直连 UAT MySQL,事务内导入,前后计数复核通过。
- 导入行数:**2000**(batch1 CSV 2001 行按 姓名+证件号 去重;会同县「杨明 431225********4219」池中有两条卡记录,保留 pool_id 较小的一条,业务侧如需明确以哪张卡中奖需另行核实)。
- 表结构:UAT 库 `hhrs_winner` 实际为抽奖池版结构(`id, pool_id, member_name, county, member_identity_no, member_phone, created_time, updated_time`),无奖品/开奖日期列。
- 字段取值:`id` 与 `pool_id` 均取抽奖池记录 id(一一对应、可溯源);`county` 取自池表;证件/手机号为池表脱敏值(库内即脱敏,公示展示不受影响);`created_time=NOW()`(2026-09-29 14:27)。
- 同步操作:对应 2000 条池记录 `won` 置 1(与抽奖台「公布即回写」语义一致)。
- 旧数据:导入前表为空,无清理动作。
## 已知问题(导入前即存在)
dscp-uat 当前部署的后端与上表结构不匹配:
- `mp-api/hhrsWinner/dates`、`mp-api/hhrsWinner/list` 均返回 `errcode 99999`(部署代码按旧 prize 版 schema 查询,`draw_date/card_model_id` 列已不存在);
- `open-api/hhrsDraw/*`(抽奖台后台)在该服务上为 404,抽奖台实际使用的后端未部署在此环境。
因此公示页当前显示「暂无数据/接口失败」,**与本次导入的数据无关**;待与现表结构匹配的新版后端部署后,第一期名单即可展示,数据无需重导。
## 补充排查发现(2026-09-29 下午)
1. UAT 库中还存在抽奖后台配套表 `hhrs_draw_activity` / `hhrs_draw_round`(2026-09-28 建),即抽奖台新版后端的排期数据:
- **第一期官方开奖日期 = 2026-09-29**(「2026 金秋千万好礼 · 第一期(9·29 专场)」,活动 status=1 已发布);
- 排期设计:9·29 专场三场 600+700+700=2000 人,分别绑定 batch 1/2/3;全部轮次 status=0(待开奖)、seed/drawn_time 为空 → **抽奖台自动回写链路从未成功跑通**(与 dscp-uat 上 hhrsDraw 接口 404 相符);
- 实际交付的第一期名单是「batch1 一次抽 2000 人」,与排期表的三场拆分不一致——若后续场次仍按排期表取 batch2/3,不受本次导入影响(批次天然互斥)。
2. 公示页要立即显示名单,零部署方案为:`hhrs_winner` 增加旧接口所需 8 列(card_model_id/member_id/prize_*/draw_date/remark,均可空,兼容新版写入),并回填:card_model_id=747609734826757、draw_date='2026-09-29'、prize_name='怀化市社保卡千万好礼促消费千元权益包'、prize_type='权益包'、prize_amount=100000(分,即 1000 元)。**待用户批准后执行**。
3. 前端「隐藏手机号」改动(本地已完成)生效路径:HBuilderX CLI 可本地构建,产物上传 121.43.239.220:/home/hh/html 需要 SSH 权限(凭据在 Obsidian 运维手册)。
## 前端配套改动(本地已改,未发布)
`hhrs/pages/winners/winners.vue`:
1. 按业务要求移除「手机号码」列(表头、行、样式、按手机号过滤逻辑),搜索框改为仅按姓名。
2. 修复「名单未翻到的人物搜索无结果」(如 王球莲):搜索原本只在前端已加载的 10 条/页内过滤,后端列表接口无姓名检索参数;现改为输入关键字/点搜索时按 500 条大页自动拉全当期名单(实测第一期 4 次请求共 2000 条)再本地过滤,全量结果按期缓存;拉取失败静默降级为已加载部分可搜。
需 HBuilderX 构建后上传 121.43.239.220:/home/hh/html 生效(`sh h5-release.sh` → 产物 scp 原子切换)。
## 发布结果(2026-09-29 16:07 线上实测)
已发布生效:入口 `index.8ec4f995.js` → `index.e438708b.js`,修复分片 `pages-winners-winners.a875331e.js`(含 loadAll 全量搜索)公网 200。浏览器实测:不翻页直接搜「王球莲」命中 1 条(4 个 pageSize=500 请求自动拉全),姓名/身份证/手机号三列正常。四站点回归 hh/pxdy/mkh5/api/dw 全 200。发布过程偏差(目录切换替代覆盖式)已按手册补救:旧 hash 资源全量还原、`._*` AppleDouble 清理、webroot 备份 `/root/hh-html-backup-20260929-presearchfix.tar.gz`。winners.vue 源码改动尚未 commit。
Executable
+14
View File
@@ -0,0 +1,14 @@
#!/bin/bash
# xuchao: hhrs H5 发布脚本 —— HBuilderX 构建不吃项目根 index.html(静态标签会被丢),
# 云闪付控件(upsdk)必须静态标签加载才能注册控件桥(路线B,2026-09-28 定),
# 故构建后把标签注入产物 index.html 再打包上传。发布 = sh h5-release.sh
set -e
cd "$(dirname "$0")"
rm -rf unpackage/dist/build/web
/Applications/HBuilderX.app/Contents/MacOS/cli publish web --project hhrs
BUILT=unpackage/dist/build/web/index.html
# 注入云闪付 SDK 静态标签(幂等:已有则跳过)
grep -q "open.95516.com" "$BUILT" || sed -i '' 's#<title>怀化人社</title>#<title>怀化人社</title><script src="https://open.95516.com/s/open/js/upsdk.js" data-upsdk="1"></script>#' "$BUILT"
grep -q "open.95516.com" "$BUILT" && echo "[h5-release] upsdk 静态标签已在产物 index.html"
tar czf /tmp/hh-voucher/web_release.tgz -C unpackage/dist/build/web .
echo "[h5-release] 产物就绪:/tmp/hh-voucher/web_release.tgz —— 用 expect rsh.exp scp 上传后原子切换"
+64 -6
View File
@@ -13,12 +13,19 @@
<view class="search-btn" @click="onSearch">搜索</view> <view class="search-btn" @click="onSearch">搜索</view>
</view> </view>
</view> </view>
<!-- xuchao: 所属县区 + 所属类型筛选,选项与联动条数由列表接口一并返回 -->
<hhrs-filter-bar :districts="filters.districts" :categories="filters.categories"
:district-id="districtId" :category="category" @change="onFilterChange" />
</view> </view>
<!-- 商户列表 --> <!-- 商户列表 -->
<view class="list-area"> <view class="list-area">
<view class="venue-card" v-for="item in list" :key="item.shopId" @click="goDetail(item)"> <view class="venue-card" v-for="item in list" :key="item.shopId" @click="goDetail(item)">
<image class="card-img" :src="item.image" mode="aspectFill" /> <view class="card-thumb">
<image class="card-img" :src="item.image" mode="aspectFill" />
<!-- xuchao: 左上角所属地区角标(districtName 来自商铺「所在地区」,未录入则不显示) -->
<text class="card-area" v-if="item.districtName">{{ shortDistrict(item.districtName) }}</text>
</view>
<view class="card-info"> <view class="card-info">
<text class="card-name">{{ item.name }}</text> <text class="card-name">{{ item.name }}</text>
<text class="card-category">{{ item.category }}</text> <text class="card-category">{{ item.category }}</text>
@@ -40,7 +47,13 @@
</template> </template>
<script> <script>
// xuchao: 角标区县简称(后端返回的是行政区划全称)
import { shortDistrict } from '@/common/district.js'
// xuchao: 县区 + 类型筛选条,三个列表页共用(pages.json 的 easycom 只给 u- 前缀配了规则,这里显式引入)
import HhrsFilterBar from '@/components/hhrs-filter-bar/hhrs-filter-bar.vue'
export default { export default {
components: { HhrsFilterBar },
data() { data() {
return { return {
keyword: '', keyword: '',
@@ -53,7 +66,11 @@ export default {
lat: '', lat: '',
loadStatus: 'loadmore', loadStatus: 'loadmore',
hasScrolled: false, hasScrolled: false,
reqSeq: 0 reqSeq: 0,
// xuchao: 筛选条件与面板选项(选项由列表响应带回)
districtId: '',
category: '',
filters: { districts: [], categories: [] }
} }
}, },
onLoad() { onLoad() {
@@ -78,6 +95,7 @@ export default {
this.loadMore() this.loadMore()
}, },
methods: { methods: {
shortDistrict,
loadList() { loadList() {
// xuchao: 请求序号 —— 新请求直接取代在途请求,过期响应整体丢弃(修复搜索竞态,故不再用 loading 提前 return) // xuchao: 请求序号 —— 新请求直接取代在途请求,过期响应整体丢弃(修复搜索竞态,故不再用 loading 提前 return)
const seq = ++this.reqSeq const seq = ++this.reqSeq
@@ -91,9 +109,16 @@ export default {
} }
if (this.lng) params.lng = this.lng if (this.lng) params.lng = this.lng
if (this.lat) params.lat = this.lat if (this.lat) params.lat = this.lat
if (this.districtId) params.districtId = this.districtId
if (this.category) params.category = this.category
this.$u.api.getStoreList(params).then(res => { this.$u.api.getStoreList(params).then(res => {
if (seq !== this.reqSeq) return if (seq !== this.reqSeq) return
if (res.errcode === 0 && res.data) { if (res.errcode === 0 && res.data) {
// xuchao: 面板选项随列表一起回来(后端已按关键词与另一维度算好条数)
this.filters = {
districts: res.data.districts || [],
categories: res.data.categories || []
}
const list = res.data.list || [] const list = res.data.list || []
if (this.pageNo === 1) { if (this.pageNo === 1) {
this.list = list this.list = list
@@ -140,6 +165,12 @@ export default {
this.pageNo = 1 this.pageNo = 1
this.list = [] this.list = []
this.loadList() this.loadList()
},
// xuchao: 换筛选条件即回第 1 页重查(关键词保持不变,两者为 AND)
onFilterChange(e) {
this.districtId = e.districtId
this.category = e.category
this.onSearch()
} }
} }
} }
@@ -154,11 +185,11 @@ export default {
.search-area { .search-area {
background-color: #ffffff; background-color: #ffffff;
padding: 6px 12px; padding: 6px 12px 0;
// xuchao: 滚动时固定在页面顶部 // xuchao: 滚动时固定在页面顶部;z-index 高于筛选遮罩(90),保证面板与选中态不被压住
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 10; z-index: 100;
} }
.nav-row { .nav-row {
@@ -209,6 +240,7 @@ export default {
} }
.list-area { .list-area {
// xuchao: 顶部 12px 必须是页面灰底(不能放进头部的白底里),否则与白色卡片连成一片看不出间隔
padding: 12px; padding: 12px;
// xuchao: border-box 防止 padding 撑出页面横向滚动 // xuchao: border-box 防止 padding 撑出页面横向滚动
box-sizing: border-box; box-sizing: border-box;
@@ -228,13 +260,39 @@ export default {
margin-bottom: 12px; margin-bottom: 12px;
} }
.card-img { .card-thumb {
width: 75px; width: 75px;
height: 75px; height: 75px;
border-radius: 6px; border-radius: 6px;
overflow: hidden;
position: relative;
flex-shrink: 0; flex-shrink: 0;
} }
/* xuchao: image 由 thumb 裁圆角,自身不再设圆角 */
.card-img {
width: 100%;
height: 100%;
display: block;
}
.card-area {
position: absolute;
top: 0;
left: 0;
display: block;
max-width: 100%;
padding: 1px 5px;
border-radius: 0 0 6px 0;
background: rgba(0, 0, 0, 0.45);
color: #ffffff;
font-size: 10px;
line-height: 14px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.card-info { .card-info {
flex: 1; flex: 1;
// xuchao: min-width:0 允许 flex 子项收缩到内容宽度以下,配合 nowrap 文本出省略号 // xuchao: min-width:0 允许 flex 子项收缩到内容宽度以下,配合 nowrap 文本出省略号
+6
View File
@@ -185,6 +185,12 @@
flex-direction: column; flex-direction: column;
} }
.banner {
width: 100%;
max-height: 300px;
overflow: hidden;
}
.banner-img { .banner-img {
width: 100%; width: 100%;
display: block; display: block;
+14 -12
View File
@@ -52,8 +52,8 @@
<script> <script>
import { import {
VOUCHER_NAME, VOUCHER_PRICE_TEXT, VOUCHER_GUIDE_TEXT, VOUCHER_NAME, VOUCHER_PRICE_TEXT, VOUCHER_GUIDE_TEXT, VOUCHER_CANCEL_TEXT,
VOUCHER_PAY_WHITELIST_PHONE, isUnionPayApp, bizOk, bizMsg, bizData bizOk, bizMsg, bizData
} from '@/common/petrolVoucher.js' } from '@/common/petrolVoucher.js'
export default { export default {
@@ -81,7 +81,7 @@ export default {
uni.redirectTo({ url: '/pages/index/login?redirect=' + encodeURIComponent('/pages/venue/detail?id=851219003520709&type=2') }) uni.redirectTo({ url: '/pages/index/login?redirect=' + encodeURIComponent('/pages/venue/detail?id=851219003520709&type=2') })
return return
} }
this.loadUpSdk() // xuchao: 运行时注入云闪付 SDK(构建模板不可靠,见 loadUpSdk 注释) this.loadUpSdk() // xuchao: 运行时兜底注入(静态标签已在发布脚本注入产物 index.html,见 h5-release.sh)
if (options.orderNo) this.orderNo = options.orderNo if (options.orderNo) this.orderNo = options.orderNo
this.initFromServer() this.initFromServer()
}, },
@@ -116,7 +116,7 @@ export default {
this._upSdkPromise = loading this._upSdkPromise = loading
return loading return loading
}, },
// xuchao: 价格展示以服务端 latest 为准(测试期 0.01);已有待支付单自动续用;已发券直接跳券详情 // xuchao: 价格展示以服务端 latest 为准;已有待支付单自动续用;已发券直接跳券详情
initFromServer() { initFromServer() {
this.$u.api.voucherLatest({ phone: this.phone }).then(res => { this.$u.api.voucherLatest({ phone: this.phone }).then(res => {
if (!bizOk(res)) return if (!bizOk(res)) return
@@ -133,11 +133,8 @@ export default {
}, },
onConfirmPay() { onConfirmPay() {
if (this.submitting) return if (this.submitting) return
// xuchao: 容器拦截——非云闪付且非联调白名单号,弹窗不发起支付(决策 11/13) // xuchao: 不做容器/白名单前置拦截,直接发起;云闪付控件在站外唤不起时
if (!isUnionPayApp() && this.phone !== VOUCHER_PAY_WHITELIST_PHONE) { // 由 pay 的 fail 回调统一弹「去云闪付」指引模态(决策 11 修订:去白名单)
this.guideModal = true
return
}
this.submitting = true this.submitting = true
this.doPay() this.doPay()
}, },
@@ -168,7 +165,9 @@ export default {
const ready = await this.loadUpSdk() const ready = await this.loadUpSdk()
if (!ready) { if (!ready) {
this.submitting = false this.submitting = false
uni.showToast({ title: '支付组件加载失败,请稍后重试', icon: 'none' }) // xuchao: 临时诊断(定位弹窗真因后移除):SDK 加载不出来时展示 UA 片段
this.guideText = '支付SDK未能加载[诊断] UA=' + (typeof navigator !== 'undefined' ? String(navigator.userAgent).slice(0, 120) : 'N/A')
this.guideModal = true
return return
} }
window.upsdk.pluginReady(() => { window.upsdk.pluginReady(() => {
@@ -177,9 +176,12 @@ export default {
success: () => { success: () => {
uni.redirectTo({ url: '/pages/petrol/voucherDetail?orderNo=' + this.orderNo }) uni.redirectTo({ url: '/pages/petrol/voucherDetail?orderNo=' + this.orderNo })
}, },
fail: () => { fail: (err) => {
// xuchao: 控件回调失败(含用户取消)。按 xuchao 要求文案定为取消提示;
// [诊断] 行临时保留采集真实错误码,区分"取消"与"容器不支持"后移除并分文案
this.submitting = false this.submitting = false
uni.showToast({ title: '支付未完成,可在门店页继续支付', icon: 'none' }) this.guideText = VOUCHER_CANCEL_TEXT + '\n[诊断] ' + JSON.stringify(err || {})
this.guideModal = true
} }
}) })
}) })
+8 -1
View File
@@ -1,6 +1,8 @@
<template> <template>
<view class="page"> <view class="page">
<view v-if="detail"> <!-- xuchao: 底部「立即预约」是 fixed 不占位,短屏滚到底会把「权益说明」压住;
有底栏时给内容区预留 80px(底栏 68px + 12px 呼吸位)+ 安全区 -->
<view v-if="detail" :class="{ 'has-bottom-bar': detail.isAppointment }">
<!-- 门店信息卡片(信息+地址合并容器) --> <!-- 门店信息卡片(信息+地址合并容器) -->
<view class="store-card"> <view class="store-card">
<view class="store-main"> <view class="store-main">
@@ -442,6 +444,11 @@ export default {
} }
/* 底部预约按钮 */ /* 底部预约按钮 */
/* xuchao: 内容区为 fixed 底栏预留的高度,短屏下「权益说明」才不会被遮住 */
.has-bottom-bar {
padding-bottom: calc(80px + env(safe-area-inset-bottom));
}
.bottom-bar { .bottom-bar {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
+102 -17
View File
@@ -89,7 +89,9 @@
</view> </view>
</view> </view>
</view> </view>
</view>
<!-- xuchao: Tab + 搜索 + 县区/类型筛选一起吸顶;筛选只作用于「待使用」(另两个 Tab 的接口不返回地址与分类) -->
<view class="info-sticky">
<!-- Tab 切换 --> <!-- Tab 切换 -->
<view class="tab-bar"> <view class="tab-bar">
<view v-for="(tab, index) in tabs" :key="index" class="tab-item" <view v-for="(tab, index) in tabs" :key="index" class="tab-item"
@@ -97,20 +99,27 @@
<text class="tab-text">{{ tab }}</text> <text class="tab-text">{{ tab }}</text>
</view> </view>
</view> </view>
</view> <!-- 搜索栏 -->
<!-- 搜索栏 --> <view class="search-area" v-if="currentTab==0">
<view class="search-area" v-if="currentTab==0"> <view class="search-bar">
<view class="search-bar"> <u-icon name="search" color="#cccccc" size="24"></u-icon>
<u-icon name="search" color="#cccccc" size="24"></u-icon> <input class="search-input" v-model="keyword" placeholder="搜索权益商家" @confirm="onSearch" />
<input class="search-input" v-model="keyword" placeholder="搜索权益商家" @confirm="onSearch" /> </view>
<!-- xuchao: 所属县区 + 所属类型筛选,选项与联动条数由列表接口一并返回 -->
<hhrs-filter-bar :districts="filters.districts" :categories="filters.categories"
:district-id="districtId" :category="category" @change="onFilterChange" />
</view> </view>
</view> </view>
<!-- 权益列表 --> <!-- 权益列表 -->
<!-- xuchao: 三 Tab 列表统一改普通容器 + 页面级触底分页(scroll-view 无固定高度时 scrolltolower 永不触发) --> <!-- xuchao: 三 Tab 列表统一改普通容器 + 页面级触底分页(scroll-view 无固定高度时 scrolltolower 永不触发) -->
<view class="list-area" v-if="currentTab==0"> <view class="list-area list-area--todo" v-if="currentTab==0">
<view class="rights-card" v-for="item in rightsList" :key="item.ruleId" @click="goDetail(item)"> <view class="rights-card" v-for="item in rightsList" :key="item.ruleId" @click="goDetail(item)">
<image class="card-img" :src="item.image" mode="aspectFill" /> <view class="card-thumb">
<image class="card-img" :src="item.image" mode="aspectFill" />
<!-- xuchao: 左上角所属地区角标(districtName 来自商铺「所在地区」,未录入则不显示) -->
<text class="card-area" v-if="item.districtName">{{ shortDistrict(item.districtName) }}</text>
</view>
<view class="card-info"> <view class="card-info">
<view class="card-name">{{ item.name }}</view> <view class="card-name">{{ item.name }}</view>
<view class="card-category">{{ item.category }}</view> <view class="card-category">{{ item.category }}</view>
@@ -171,7 +180,13 @@
</template> </template>
<script> <script>
// xuchao: 角标区县简称(后端返回的是行政区划全称)
import { shortDistrict } from '@/common/district.js'
// xuchao: 县区 + 类型筛选条,三个列表页共用(pages.json 的 easycom 只给 u- 前缀配了规则,这里显式引入)
import HhrsFilterBar from '@/components/hhrs-filter-bar/hhrs-filter-bar.vue'
export default { export default {
components: { HhrsFilterBar },
data() { data() {
return { return {
status: 'auth', status: 'auth',
@@ -189,6 +204,14 @@
tabs: ['待使用', '已预约', '已使用'], tabs: ['待使用', '已预约', '已使用'],
currentTab: 0, currentTab: 0,
keyword: '', keyword: '',
// xuchao: 待使用列表的县区/类型筛选条件与面板选项(选项由列表响应带回)
districtId: '',
category: '',
filters: { districts: [], categories: [] },
// xuchao: 待使用列表的县区/类型筛选条件与面板选项(选项由列表响应带回)
districtId: '',
category: '',
filters: { districts: [], categories: [] },
rightsList: [], rightsList: [],
appointmentList: [], appointmentList: [],
checkList: [], checkList: [],
@@ -262,6 +285,7 @@
} }
}, },
methods: { methods: {
shortDistrict,
// xuchao: 缓存的权益状态可能过期(中奖/权益包会变化),每次进页面仅凭手机号向服务端 // xuchao: 缓存的权益状态可能过期(中奖/权益包会变化),每次进页面仅凭手机号向服务端
// 复查最新状态并覆盖缓存(不带证件号,避免触发被动认证) // 复查最新状态并覆盖缓存(不带证件号,避免触发被动认证)
refreshStatus() { refreshStatus() {
@@ -495,10 +519,19 @@
params.keyword = this.keyword params.keyword = this.keyword
params.lng = this.lng params.lng = this.lng
params.lat = this.lat params.lat = this.lat
if (this.districtId) params.districtId = this.districtId
if (this.category) params.category = this.category
request = this.$u.api.getRightsList(params) request = this.$u.api.getRightsList(params)
} }
request.then(res => { request.then(res => {
if (seq !== p.reqSeq) return if (seq !== p.reqSeq) return
// xuchao: 筛选面板选项只随「待使用」列表返回,另两个 Tab 不覆盖
if (tab === 0 && res.errcode === 0 && res.data) {
this.filters = {
districts: res.data.districts || [],
categories: res.data.categories || []
}
}
if (res.errcode === 0 && res.data) { if (res.errcode === 0 && res.data) {
const list = res.data.list || [] const list = res.data.list || []
const prev = this.listOf(tab) const prev = this.listOf(tab)
@@ -538,6 +571,12 @@
onSearch() { onSearch() {
this.loadList(0, true) this.loadList(0, true)
}, },
// xuchao: 换筛选条件即回第 1 页重查(关键词保持不变,两者为 AND)
onFilterChange(e) {
this.districtId = e.districtId
this.category = e.category
this.loadList(0, true)
},
goDetail(item) { goDetail(item) {
uni.navigateTo({ uni.navigateTo({
url: '/pages/rights/detail?id=' + item.ruleId url: '/pages/rights/detail?id=' + item.ruleId
@@ -794,11 +833,20 @@
background-color: #eeeeee; background-color: #eeeeee;
} }
/* xuchao: Tab + 搜索 + 筛选条一起吸顶。padding-top 替代原 tab-bar 的 margin-top,
否则吸顶后顶部会留一条能透出列表内容的缝隙;z-index 需高于筛选遮罩(90) */
.info-sticky {
background-color: #ffffff;
padding-top: 12px;
position: sticky;
top: 0;
z-index: 100;
}
/* Tab 切换 */ /* Tab 切换 */
.tab-bar { .tab-bar {
display: flex; display: flex;
background-color: #ffffff; background-color: #ffffff;
margin-top: 12px;
padding: 0 16px; padding: 0 16px;
} }
@@ -833,7 +881,8 @@
/* 搜索栏 */ /* 搜索栏 */
.search-area { .search-area {
padding: 12px; /* xuchao: 底部留白交给筛选条的 20rpx 上内边距,保证三段间距一致 */
padding: 12px 12px 0;
} }
.search-bar { .search-bar {
@@ -841,6 +890,10 @@
align-items: center; align-items: center;
height: 36px; height: 36px;
background-color: #ffffff; background-color: #ffffff;
/* xuchao: 头部改白底后,白色搜索框在白色吸顶栏上必须描边才分得出来;
显式 border-box 保证加边框后高度仍是 36px */
border: 1px solid #e5e5ea;
box-sizing: border-box;
border-radius: 18px; border-radius: 18px;
padding: 0 12px; padding: 0 12px;
gap: 8px; gap: 8px;
@@ -861,6 +914,12 @@
flex-direction: column; flex-direction: column;
} }
/* xuchao: 「待使用」列表顶部 24rpx(=12px) 灰底间隔,与卡片之间的间距一致,
也与筛选条和列表之间的 12px 对齐;只加在这个 Tab,不影响「已预约/已使用」 */
.list-area--todo {
padding-top: 24rpx;
}
.nomore-area { .nomore-area {
width: 100%; width: 100%;
padding-bottom: 24px; padding-bottom: 24px;
@@ -876,12 +935,38 @@
margin-bottom: 24rpx; margin-bottom: 24rpx;
} }
.card-img { .card-thumb {
width: 150rpx; width: 150rpx;
height: 150rpx; height: 150rpx;
border-radius: 6px; border-radius: 6px;
flex-shrink: 0; overflow: hidden;
} position: relative;
flex-shrink: 0;
}
/* xuchao: image 由 thumb 裁圆角,自身不再设圆角 */
.card-img {
width: 100%;
height: 100%;
display: block;
}
.card-area {
position: absolute;
top: 0;
left: 0;
display: block;
max-width: 100%;
padding: 1px 5px;
border-radius: 0 0 6px 0;
background: rgba(0, 0, 0, 0.45);
color: #ffffff;
font-size: 10px;
line-height: 14px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.card-info { .card-info {
width: 490rpx; width: 490rpx;
+3 -1
View File
@@ -113,8 +113,10 @@ export default {
return this.detailType !== '2' return this.detailType !== '2'
}, },
isPetrol() { isPetrol() {
// xuchao: 业务调整:该商铺不再需要特殊购买处理,前端入口整体隐藏;券页面/接口/SDK注入均保留,恢复时去掉下面的 return false 即可
return false
// xuchao: 后端券服务探活(latest 返回 price)后才展示购券模块——后端未部署期间整模块自动隐藏,无死入口 // xuchao: 后端券服务探活(latest 返回 price)后才展示购券模块——后端未部署期间整模块自动隐藏,无死入口
return this.loaded && String(this.shopId) === PETROL_SHOP_ID && !this.isVenue && !!(this.voucher && this.voucher.price) // return this.loaded && String(this.shopId) === PETROL_SHOP_ID && !this.isVenue && !!(this.voucher && this.voucher.price)
}, },
voucherBtnText() { voucherBtnText() {
const s = this.voucher ? this.voucher.statusCode : -1 const s = this.voucher ? this.voucher.statusCode : -1
+88 -13
View File
@@ -13,20 +13,29 @@
<view class="search-btn" @click="onSearch">搜索</view> <view class="search-btn" @click="onSearch">搜索</view>
</view> </view>
</view> </view>
<!-- xuchao: 所属县区 + 所属类型筛选,选项与联动条数由列表接口一并返回 -->
<hhrs-filter-bar :districts="filters.districts" :categories="filters.categories"
:district-id="districtId" :category="category" @change="onFilterChange" />
</view> </view>
<!-- 场馆列表 --> <!-- 场馆列表 -->
<view class="list-area"> <view class="list-area">
<view class="venue-card" v-for="item in list" :key="item.shopId"> <view class="venue-card" v-for="item in list" :key="item.shopId">
<image class="card-img" :src="item.image" mode="aspectFill" /> <view class="card-thumb">
<image class="card-img" :src="item.image" mode="aspectFill" />
<!-- xuchao: 左上角所属地区角标(districtName 来自商铺「所在地区」,未录入则不显示) -->
<text class="card-area" v-if="item.districtName">{{ shortDistrict(item.districtName) }}</text>
</view>
<view class="card-info"> <view class="card-info">
<text class="card-name">{{ item.name }}</text> <text class="card-name">{{ item.name }}</text>
<text class="card-category">{{ item.category }}</text> <text class="card-category">{{ item.category }}</text>
<text class="card-address">{{ item.address }}</text> <view class="card-bottom">
</view> <text class="card-address">{{ item.address }}</text>
<view class="card-distance" v-if="item.distance !== null"> <view class="card-distance" v-if="item.distance !== null">
<u-icon name="map" color="#999999" size="24"></u-icon> <u-icon name="map" color="#999999" size="24"></u-icon>
<text class="distance-text">{{ item.distance < 1 ? Math.round(item.distance * 1000) + 'm' : Math.round(item.distance) + 'km' }}</text> <text class="distance-text">{{ item.distance < 1 ? Math.round(item.distance * 1000) + 'm' : Math.round(item.distance) + 'km' }}</text>
</view>
</view>
</view> </view>
</view> </view>
<view v-if="hasScrolled" class="nomore-area"> <view v-if="hasScrolled" class="nomore-area">
@@ -37,7 +46,13 @@
</template> </template>
<script> <script>
// xuchao: 角标区县简称(后端返回的是行政区划全称)
import { shortDistrict } from '@/common/district.js'
// xuchao: 县区 + 类型筛选条,三个列表页共用(pages.json 的 easycom 只给 u- 前缀配了规则,这里显式引入)
import HhrsFilterBar from '@/components/hhrs-filter-bar/hhrs-filter-bar.vue'
export default { export default {
components: { HhrsFilterBar },
data() { data() {
return { return {
keyword: '', keyword: '',
@@ -50,7 +65,11 @@ export default {
lat: '', lat: '',
loadStatus: 'loadmore', loadStatus: 'loadmore',
hasScrolled: false, hasScrolled: false,
reqSeq: 0 reqSeq: 0,
// xuchao: 筛选条件与面板选项(选项由列表响应带回)
districtId: '',
category: '',
filters: { districts: [], categories: [] }
} }
}, },
onLoad() { onLoad() {
@@ -68,6 +87,7 @@ export default {
this.loadMore() this.loadMore()
}, },
methods: { methods: {
shortDistrict,
loadList() { loadList() {
// xuchao: 请求序号 —— 新请求直接取代在途请求,过期响应整体丢弃(修复搜索竞态,故不再用 loading 提前 return) // xuchao: 请求序号 —— 新请求直接取代在途请求,过期响应整体丢弃(修复搜索竞态,故不再用 loading 提前 return)
const seq = ++this.reqSeq const seq = ++this.reqSeq
@@ -81,9 +101,16 @@ export default {
} }
if (this.lng) params.lng = this.lng if (this.lng) params.lng = this.lng
if (this.lat) params.lat = this.lat if (this.lat) params.lat = this.lat
if (this.districtId) params.districtId = this.districtId
if (this.category) params.category = this.category
this.$u.api.getStoreList(params).then(res => { this.$u.api.getStoreList(params).then(res => {
if (seq !== this.reqSeq) return if (seq !== this.reqSeq) return
if (res.errcode === 0 && res.data) { if (res.errcode === 0 && res.data) {
// xuchao: 面板选项随列表一起回来(后端已按关键词与另一维度算好条数)
this.filters = {
districts: res.data.districts || [],
categories: res.data.categories || []
}
const list = res.data.list || [] const list = res.data.list || []
if (this.pageNo === 1) { if (this.pageNo === 1) {
this.list = list this.list = list
@@ -126,6 +153,12 @@ export default {
this.pageNo = 1 this.pageNo = 1
this.list = [] this.list = []
this.loadList() this.loadList()
},
// xuchao: 换筛选条件即回第 1 页重查(关键词保持不变,两者为 AND)
onFilterChange(e) {
this.districtId = e.districtId
this.category = e.category
this.onSearch()
} }
} }
} }
@@ -140,11 +173,11 @@ export default {
.search-area { .search-area {
background-color: #ffffff; background-color: #ffffff;
padding: 6px 12px; padding: 6px 12px 0;
/* xuchao: 滚动时固定在页面顶部 */ /* xuchao: 滚动时固定在页面顶部;z-index 高于筛选遮罩(90),保证面板与选中态不被压住 */
position: sticky; position: sticky;
top: 0; top: 0;
z-index: 10; z-index: 100;
} }
.nav-row { .nav-row {
@@ -195,6 +228,7 @@ export default {
} }
.list-area { .list-area {
/* xuchao: 顶部 12px 必须是页面灰底(不能放进头部的白底里),否则与白色卡片连成一片看不出间隔 */
padding: 12px; padding: 12px;
} }
@@ -207,16 +241,42 @@ export default {
padding: 24px 12px; padding: 24px 12px;
gap: 12px; gap: 12px;
box-shadow: 0 2px 3px #f2f2f7; box-shadow: 0 2px 3px #f2f2f7;
margin-bottom: 12px; margin: 12px;
} }
.card-img { .card-thumb {
width: 75px; width: 75px;
height: 75px; height: 75px;
border-radius: 6px; border-radius: 6px;
overflow: hidden;
position: relative;
flex-shrink: 0; flex-shrink: 0;
} }
/* xuchao: image 由 thumb 裁圆角,自身不再设圆角 */
.card-img {
width: 100%;
height: 100%;
display: block;
}
.card-area {
position: absolute;
top: 0;
left: 0;
display: block;
max-width: 100%;
padding: 1px 5px;
border-radius: 0 0 6px 0;
background: rgba(0, 0, 0, 0.45);
color: #ffffff;
font-size: 10px;
line-height: 14px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.card-info { .card-info {
flex: 1; flex: 1;
/* xuchao: flex 项默认 min-width:auto,nowrap 地址会把列宽撑破卡片;置 0 后子元素在实宽内省略 */ /* xuchao: flex 项默认 min-width:auto,nowrap 地址会把列宽撑破卡片;置 0 后子元素在实宽内省略 */
@@ -224,12 +284,18 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 0; gap: 0;
width: 100%;
min-width: 0;
} }
.card-name { .card-name {
font-size: 16px; font-size: 16px;
font-weight: 500; font-weight: 500;
color: #000000; color: #000000;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
} }
.card-category { .card-category {
@@ -241,13 +307,22 @@ export default {
line-height: 20px; line-height: 20px;
} }
.card-bottom {
display: flex;
align-items: center;
justify-content: flex-end;
margin-top: 8px;
gap: 8px;
}
.card-address { .card-address {
flex: 1;
font-size: 14px; font-size: 14px;
color: #727272; color: #727272;
margin-top: 8px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
min-width: 0;
} }
.card-distance { .card-distance {
+53 -1
View File
@@ -81,7 +81,11 @@ export default {
// xuchao: 页码改为按期维护(原单一 pageNo 在切期后会被沿用,导致同一页重复追加/跳页) // xuchao: 页码改为按期维护(原单一 pageNo 在切期后会被沿用,导致同一页重复追加/跳页)
pageNos: {}, pageNos: {},
pageSize: 10, pageSize: 10,
// xuchao: 搜索触发的全量拉取用大页尺寸(列表接口仅支持分页参数,无姓名检索)
pageSizeFull: 500,
totals: {}, totals: {},
fullLoaded: {},
loadingAll: {},
totalWinners: 0, totalWinners: 0,
inFlight: 0, inFlight: 0,
loadStatusMap: {}, loadStatusMap: {},
@@ -104,6 +108,15 @@ export default {
return this.loadStatusMap[this.currentTab] || 'nomore' return this.loadStatusMap[this.currentTab] || 'nomore'
} }
}, },
watch: {
// xuchao: 输入关键字即后台拉全当期名单,修复"没翻到的人物搜索无结果"
keyword(val) {
clearTimeout(this._kwTimer)
if (val && val.trim() && !this.fullLoaded[this.currentTab]) {
this._kwTimer = setTimeout(() => this.loadAll(this.currentTab), 400)
}
}
},
onLoad() { onLoad() {
this.loadDates() this.loadDates()
}, },
@@ -155,6 +168,8 @@ export default {
pageSize: this.pageSize, pageSize: this.pageSize,
drawDate: drawDate drawDate: drawDate
}).then(res => { }).then(res => {
// xuchao: 全量拉取已就绪/进行中时,旧的10条分页响应直接丢弃,避免覆盖全量列表
if (this.fullLoaded[tabIndex] || this.loadingAll[tabIndex]) return
if (res.errcode === 0 && res.data) { if (res.errcode === 0 && res.data) {
const list = res.data.list || [] const list = res.data.list || []
const prev = this.winnerData[tabIndex] || [] const prev = this.winnerData[tabIndex] || []
@@ -177,12 +192,48 @@ export default {
}, },
loadMore() { loadMore() {
const tab = this.currentTab const tab = this.currentTab
if (this.loadingAll[tab]) return
const total = this.totals[tab] || 0 const total = this.totals[tab] || 0
const len = (this.winnerData[tab] || []).length const len = (this.winnerData[tab] || []).length
if (len < total && this.inFlight === 0) { if (len < total && this.inFlight === 0) {
this.loadWinnerList(tab, (this.pageNos[tab] || 1) + 1) this.loadWinnerList(tab, (this.pageNos[tab] || 1) + 1)
} }
}, },
// xuchao: 按大页把当期名单一次拉全,搜索即可命中未翻到的人;完成后整期替换并标记 fullLoaded
loadAll(tabIndex) {
const tab = this.tabs[tabIndex]
if (!tab || this.fullLoaded[tabIndex] || this.loadingAll[tabIndex]) return
this.$set(this.loadingAll, tabIndex, true)
this.$set(this.loadStatusMap, tabIndex, 'loading')
const acc = []
const pull = (pageNo) => this.$u.api.getWinnerList({
pageNo: pageNo,
pageSize: this.pageSizeFull,
drawDate: tab.date
}).then(res => {
if (res.errcode !== 0 || !res.data) return
const list = res.data.list || []
const total = res.data.total || 0
acc.push(...list)
this.$set(this.totals, tabIndex, total)
if (list.length > 0 && acc.length < total && pageNo < 50) return pull(pageNo + 1)
})
pull(1).then(() => {
if (acc.length > 0) {
this.$set(this.winnerData, tabIndex, acc)
this.$set(this.fullLoaded, tabIndex, true)
this.$set(this.pageNos, tabIndex, Math.ceil(acc.length / this.pageSizeFull))
}
this.totalWinners = Object.values(this.totals).reduce((s, n) => s + n, 0)
}).catch(() => {
// 拉全失败静默降级为已加载部分可搜
}).finally(() => {
this.$set(this.loadingAll, tabIndex, false)
const len = (this.winnerData[tabIndex] || []).length
const total = this.totals[tabIndex] || 0
this.$set(this.loadStatusMap, tabIndex, len === 0 || len >= total ? 'nomore' : 'loadmore')
})
},
switchTab(index) { switchTab(index) {
this.currentTab = index this.currentTab = index
// xuchao: 不再重置全局 pageNo(各期游标自带);空列表补拉首页时允许并发, // xuchao: 不再重置全局 pageNo(各期游标自带);空列表补拉首页时允许并发,
@@ -204,7 +255,8 @@ export default {
} }
}, },
onSearch() { onSearch() {
// 前端过滤,无需重新请求 // xuchao: 点搜索立即确保当期全量已拉取(过滤仍在前端本地完成)
if (!this.fullLoaded[this.currentTab]) this.loadAll(this.currentTab)
} }
} }
} }