合并:中奖名单公示页搜索修复(feature/venue-discount-rights-filter → xuchao)

冲突解决:venue 列表灰底间距与卡片内边距取 feature 侧设计修正;card-address 保留 min-width:0;index 页面取页级滚动方案。

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

App.vue

@@ -23,4 +23,23 @@
 			Arial, Helvetica, sans-serif;
 		-webkit-font-smoothing: antialiased;
 	}
+
+	/* xuchao: 修复默认导航栏在微信 WebView 内顶部超宽空白（参加/使用指南、协议等页）——
+	   uni-app 内置 H5 导航栏高度为 calc(44px + env(safe-area-inset-top))，页面模板带
+	   viewport-fit=cover 时，部分 Android 微信 WebView 会误报状态栏高度（而 H5 视口本
+	   就位于微信原生标题栏下方、并未被遮挡），导致导航栏被垫高。强制回退固定 44px。
+	   标准浏览器/ iOS 中该 env 值为 0，此覆盖无副作用 */
+	uni-page-head .uni-page-head {
+		height: 44px !important;
+		padding-top: 7px !important;
+	}
+	uni-page-head .uni-page-head ~ .uni-placeholder {
+		height: 44px !important;
+	}
+	uni-page-head[uni-page-head-type='default'] ~ uni-page-wrapper {
+		height: calc(100% - 44px) !important;
+	}
+	.uni-app--showtabbar uni-page-head[uni-page-head-type='default'] ~ uni-page-wrapper {
+		height: calc(100% - 44px) !important;
+	}
 </style>

common/district.js

@@ -0,0 +1,10 @@
+// xuchao: 卡片角标用的区县简称。后端 districtName 返回的是 region.name 行政区划全称
+//         （如「芷江侗族自治县」「怀化高新技术产业开发区」），列表缩略图只有 75px，必须缩短显示
+export function shortDistrict(name) {
+	if (!name) return ''
+	return name
+		.replace('高新技术产业开发区', '高新区')
+		.replace(/(苗族|侗族|瑶族|回族|土家族|各族)*自治县$/, '')
+		.replace(/(苗族|侗族|瑶族|回族|土家族|各族)*自治州$/, '')
+		.replace(/([^市])县$/, '$1')
+}

common/http.api.js

@@ -22,6 +22,11 @@ const WinnerDatesUrl = 'mp-api/hhrsWinner/dates'
 const WinnerListUrl = 'mp-api/hhrsWinner/list'
 // 预约下单（智慧游卡包）
 const AppointUrl = 'zhy-api/cardBag/appoint'
+// xuchao: 怀化石油汽油券（下单/预支付/最新订单查询，后端 HhVoucherController）
+const VoucherCreateUrl = 'open-api/hhService/voucher/create'
+const VoucherPrepayUrl = 'open-api/hhService/voucher/prepay'
+const VoucherLatestUrl = 'open-api/hhService/voucher/latest'
+const VoucherCheckCodeUrl = 'open-api/hhService/voucher/checkCode'
 
 // 此处第二个参数vm，就是我们在页面使用的this
 const install = (Vue, vm) => {
@@ -52,6 +57,12 @@ const install = (Vue, vm) => {
 	const getWinnerDates = (params = {}) => vm.$u.get(WinnerDatesUrl, params)
 	const getWinnerList = (params = {}) => vm.$u.post(WinnerListUrl, params)
 
+	// xuchao: 石油汽油券
+	const voucherCreate = (params = {}) => vm.$u.post(VoucherCreateUrl, params)
+	const voucherPrepay = (params = {}) => vm.$u.post(VoucherPrepayUrl, params)
+	const voucherLatest = (params = {}) => vm.$u.post(VoucherLatestUrl, params)
+	const voucherCheckCode = (params = {}) => vm.$u.post(VoucherCheckCodeUrl, params)
+
 	vm.$u.api = {
 		checkerLogin,
 		sendLoginVerifyCode,
@@ -67,7 +78,11 @@ const install = (Vue, vm) => {
 		initFaceVerify,
 		describeFaceVerify,
 		getWinnerDates,
-		getWinnerList
+		getWinnerList,
+		voucherCreate,
+		voucherPrepay,
+		voucherLatest,
+		voucherCheckCode
 	}
 }
 

common/petrolVoucher.js

@@ -0,0 +1,66 @@
+// xuchao: 怀化石油汽油减免券——前端常量与工具（全写死，只服务这一个门店，决策 1/10/15）
+// 价格真相=后端配置 hh.voucher.price-fen 经 latest 下发；此处 200.00 仅为接口未返回时的展示兜底
+
+export const PETROL_SHOP_ID = '851219003520709'
+export const VOUCHER_PRICE_TEXT = '200.00'
+
+export const VOUCHER_NAME = '怀化石油汽油电子券'
+
+export const VOUCHER_GUIDE_TEXT = '请在「云闪付 App」里的「湖南社保卡」小程序首页进入「怀化社保卡」活动中完成购买'
+export const VOUCHER_CANCEL_TEXT = '支付已取消，请重新支付'
+
+// 券详情页「使用规则 / 使用流程 / 重要须知」文案，来自石油侧材料（决策 14）
+export const VOUCHER_USE_RULES = [
+	'请加油站收银员以“中石油汽油券”通道扫码核销',
+	'汽油券单日限用 1 张，多张可叠加使用',
+	'自购买日起 90 天内有效',
+	'券一经兑换不可退换'
+]
+export const VOUCHER_USE_FLOW = [
+	'加油后至收银台出示二维码核销',
+	'支付差额可选：油卡 / 现金等'
+]
+
+// xuchao: 云闪付 SDK 前置预热注入。HBuilderX 的 H5 构建不吃项目根 index.html（静态标签会被丢），
+//         只能在 main.js 最早期（document-start、App 挂载前）动态注入，逼近 xghmall 的 head 静态加载时机，
+//         让云闪付原生控件桥在首屏就注册，避免到确认订单页才注入导致 upsdk.pay 唤不起。
+//         与 orderConfirm 页的 loadUpSdk 共用同一 script[data-upsdk] 标记，全局只注入一次。
+export function injectUpSdk() {
+	if (typeof document === 'undefined' || typeof window === 'undefined') return
+	if (window.upsdk || document.querySelector('script[data-upsdk]')) return
+	const s = document.createElement('script')
+	s.src = 'https://open.95516.com/s/open/js/upsdk.js'
+	s.setAttribute('data-upsdk', '1')
+	document.head.appendChild(s)
+}
+
+
+// xuchao: open-api/hhService/voucher/* 为双层壳：外层 errcode，内层 data.code 才是业务码
+//         （同 login.vue 的 isBizOk 判定，提到公共层复用）
+export function bizOk(res) {
+	if (!res || res.errcode !== 0) return false
+	const d = res.data
+	if (!d || d.code === undefined || d.code === null) {
+		return !d || (d.status === undefined && d.error === undefined)
+	}
+	return d.code === 200
+}
+
+export function bizMsg(res) {
+	return (res && res.data && res.data.msg) || (res && res.errmsg) || ''
+}
+
+export function bizData(res) {
+	return (res && res.data && res.data.data) || {}
+}
+
+// statusCode 含义与后端 HhVoucherService.toView 对齐：-1无单 0待支付 1发券中 2已发券 3已退款 4退款处理中 5已关闭
+export const VOUCHER_STATUS_TEXT = {
+	'-1': '',
+	0: '待支付',
+	1: '发券中',
+	2: '有效',
+	3: '已退款',
+	4: '退款处理中',
+	5: '已关闭'
+}

components/hhrs-filter-bar/hhrs-filter-bar.vue

@@ -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>

docs/2026-09-29-第一期中奖名单导入记录.md

@@ -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。

h5-release.sh

@@ -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 上传后原子切换"

index.html

@@ -10,6 +10,8 @@
         (coverSupport ? ', viewport-fit=cover' : '') + '" />')
     </script>
     <title></title>
+    <!-- xuchao: 云闪付支付控件 SDK（石油汽油券购买，需运行于云闪付 App 容器内） -->
+    <script src='https://open.95516.com/s/open/js/upsdk.js'></script>
     <!--preload-links-->
     <!--app-context-->
   </head>

main.js

@@ -1,4 +1,9 @@
 import App from './App'
+import { injectUpSdk } from '@/common/petrolVoucher.js'
+
+// xuchao: 云闪付控件 SDK 预热——HBuilderX 构建不吃根 index.html，静态标签无效，
+//         在 App 挂载前（document-start 最早 JS 点）注入，逼近静态 head 加载时机（石油券支付修复）
+injectUpSdk()
 
 // #ifndef VUE3
 import Vue from 'vue'

pages.json

@@ -51,6 +51,18 @@
 				"navigationStyle": "custom"
 			}
 		},
+		{
+			"path": "pages/petrol/orderConfirm",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path": "pages/petrol/voucherDetail",
+			"style": {
+				"navigationStyle": "custom"
+			}
+		},
 		{
 			"path": "pages/winners/winners",
 			"style": {

pages/discount/discount.vue

@@ -13,12 +13,19 @@
 					<view class="search-btn" @click="onSearch">搜索</view>
 				</view>
 			</view>
+			<!-- xuchao: 所属县区 + 所属类型筛选，选项与联动条数由列表接口一并返回 -->
+			<hhrs-filter-bar :districts="filters.districts" :categories="filters.categories"
+				:district-id="districtId" :category="category" @change="onFilterChange" />
 		</view>
 
 		<!-- 商户列表 -->
 		<view class="list-area">
 			<view class="venue-card" v-for="item in list" :key="item.shopId" @click="goDetail(item)">
+				<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">
 					<text class="card-name">{{ item.name }}</text>
 					<text class="card-category">{{ item.category }}</text>
@@ -40,7 +47,13 @@
 </template>
 
 <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 {
+	components: { HhrsFilterBar },
 	data() {
 		return {
 			keyword: '',
@@ -53,7 +66,11 @@ export default {
 			lat: '',
 			loadStatus: 'loadmore',
 			hasScrolled: false,
-			reqSeq: 0
+			reqSeq: 0,
+			// xuchao: 筛选条件与面板选项（选项由列表响应带回）
+			districtId: '',
+			category: '',
+			filters: { districts: [], categories: [] }
 		}
 	},
 	onLoad() {
@@ -78,6 +95,7 @@ export default {
 		this.loadMore()
 	},
 	methods: {
+		shortDistrict,
 		loadList() {
 			// xuchao: 请求序号 —— 新请求直接取代在途请求，过期响应整体丢弃（修复搜索竞态，故不再用 loading 提前 return）
 			const seq = ++this.reqSeq
@@ -91,9 +109,16 @@ export default {
 			}
 			if (this.lng) params.lng = this.lng
 			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 => {
 				if (seq !== this.reqSeq) return
 				if (res.errcode === 0 && res.data) {
+					// xuchao: 面板选项随列表一起回来（后端已按关键词与另一维度算好条数）
+					this.filters = {
+						districts: res.data.districts || [],
+						categories: res.data.categories || []
+					}
 					const list = res.data.list || []
 					if (this.pageNo === 1) {
 						this.list = list
@@ -133,12 +158,19 @@ export default {
 			}
 		},
 		goDetail(item) {
-			uni.navigateTo({ url: '/pages/venue/detail?id=' + item.shopId })
+			// xuchao: type=2 标记商户折扣入口，详情页据此展示商品信息+商户优惠模块
+			uni.navigateTo({ url: '/pages/venue/detail?id=' + item.shopId + '&type=2' })
 		},
 		onSearch() {
 			this.pageNo = 1
 			this.list = []
 			this.loadList()
+		},
+		// xuchao: 换筛选条件即回第 1 页重查（关键词保持不变，两者为 AND）
+		onFilterChange(e) {
+			this.districtId = e.districtId
+			this.category = e.category
+			this.onSearch()
 		}
 	}
 }
@@ -153,7 +185,11 @@ export default {
 
 .search-area {
 	background-color: #ffffff;
-	padding: 6px 12px;
+	padding: 6px 12px 0;
+	// xuchao: 滚动时固定在页面顶部；z-index 高于筛选遮罩(90)，保证面板与选中态不被压住
+	position: sticky;
+	top: 0;
+	z-index: 100;
 }
 
 .nav-row {
@@ -204,6 +240,7 @@ export default {
 }
 
 .list-area {
+	// xuchao: 顶部 12px 必须是页面灰底（不能放进头部的白底里），否则与白色卡片连成一片看不出间隔
 	padding: 12px;
 	// xuchao: border-box 防止 padding 撑出页面横向滚动
 	box-sizing: border-box;
@@ -223,13 +260,39 @@ export default {
 	margin-bottom: 12px;
 }
 
-.card-img {
+.card-thumb {
 	width: 75px;
 	height: 75px;
 	border-radius: 6px;
+	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 {
 	flex: 1;
 	// xuchao: min-width:0 允许 flex 子项收缩到内容宽度以下，配合 nowrap 文本出省略号
@@ -253,6 +316,9 @@ export default {
 	font-size: 14px;
 	color: #727272;
 	margin-top: 8px;
+	// xuchao: 分类为空也预留一行高度，防止卡片内容底部对齐时名称上下跳动
+	min-height: 20px;
+	line-height: 20px;
 }
 
 .card-address-row {

pages/index/index.vue

@@ -19,14 +19,10 @@
 				<view class="title-line"></view>
 				<text class="title-text">活动指南</text>
 			</view>
+			<!-- xuchao: 图内已带标题/副标题/官方指南角标，不再叠加文字层，只保留图片 -->
 			<view class="guide-list">
 				<view class="guide-card" v-for="(item, index) in guideList" :key="index" @click="goPage(item.url)">
 					<image class="guide-bg" :src="item.bg" mode="scaleToFill"></image>
-					<view class="guide-info">
-						<text class="guide-title">{{ item.title }}</text>
-						<text class="guide-sub">{{ item.sub }}</text>
-						<view class="guide-tag">官方指南</view>
-					</view>
 				</view>
 			</view>
 		</view>
@@ -47,15 +43,12 @@
 				],
 				guideList: [
 					{
-						title: '怀化社保卡惠民活动参加指南',
+						// xuchao: ?v= 为图片版本参数，运营换图必须同步更新日期，否则各平台 WebView/CDN 会继续命中旧缓存
-						sub: '本地文旅场馆、商户惠民福利',
+						bg: 'https://aliyunoss.hn12301.net/hhrs/hhrs_cjzn.png?v=20260928',
-						bg: 'https://aliyunoss.hn12301.net/hhrs/hhrs_cjzn.png',
 						url: '/pages/guide/join'
 					},
 					{
-						title: '社保卡领取及使用指南',
+						bg: 'https://aliyunoss.hn12301.net/hhrs/hhrs_syzn.png?v=20260928',
-						sub: '全流程办理及激活指引',
-						bg: 'https://aliyunoss.hn12301.net/hhrs/hhrs_syzn.png',
 						url: '/pages/guide/use'
 					}
 				],
@@ -192,6 +185,12 @@
 		flex-direction: column;
 	}
 
+	.banner {
+		width: 100%;
+		max-height: 300px;
+		overflow: hidden;
+	}
+
 	.banner-img {
 		width: 100%;
 		display: block;
@@ -266,7 +265,6 @@
 	}
 
 	.guide-card {
-		position: relative;
 		width: 100%;
 		height: 252rpx;
 		border-radius: 16rpx;
@@ -279,40 +277,5 @@
 		border-radius: 16rpx;
 	}
 
-	.guide-info {
-		position: absolute;
-		top: 0;
-		left: 0;
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-		width: 100%;
-		height: 100%;
-		padding: 0 30rpx;
-	}
-
-	.guide-title {
-		font-size: 16px;
-		font-weight: 600;
-		color: #0088FF;
-		margin-bottom: 10rpx;
-	}
-
-	.guide-sub {
-		font-size: 12px;
-		color: #949AA0;
-		margin-bottom: 16rpx;
-	}
-
-	.guide-tag {
-		display: inline-block;
-		width: fit-content;
-		padding: 4px 10px;
-		background-color: #e6f2ff;
-		color: #0088FF;
-		font-size: 12px;
-		border-radius: 6rpx;
-	}
-
 
 </style>

pages/petrol/orderConfirm.vue

@@ -0,0 +1,241 @@
+<template>
+	<view class="page">
+		<view class="nav-bar">
+			<view class="nav-back" @click="goBack">
+				<u-icon name="arrow-left" color="#1a1818" size="40"></u-icon>
+			</view>
+			<text class="nav-title">确认订单</text>
+		</view>
+
+		<!-- 券面 -->
+		<view class="ticket">
+			<view class="ticket-amt">200元 <text class="ticket-amt-sub">汽油电子券</text></view>
+			<view class="ticket-dsc">{{ voucherName }} ｜ 收银台扫码核销</view>
+			<text class="ticket-wm">90天</text>
+		</view>
+
+		<!-- 订单要素 -->
+		<view class="card">
+			<view class="kv"><text class="k">券名称</text><text class="v">{{ voucherName }}</text></view>
+			<view class="kv"><text class="k">有效期</text><text class="v">购买日起 90 天</text></view>
+			<view class="kv"><text class="k">购买数量</text><text class="v">1 张</text></view>
+			<view class="kv"><text class="k">售价</text><text class="v">¥{{ priceText }}</text></view>
+			<view class="kv"><text class="k">购买账户</text><text class="v">{{ maskedPhone }}</text></view>
+		</view>
+
+		<!-- 支付方式 -->
+		<view class="card">
+			<view class="card-title">支付方式</view>
+			<view class="payrow">
+				<image class="pay-logo" src="https://zhihuiyou.oss-cn-shenzhen.aliyuncs.com/hhrs/hhrs_ysf_logo.png" mode="aspectFit" />
+				<text class="pay-name">云闪付 App 安全支付</text>
+				<view class="pay-radio"></view>
+			</view>
+		</view>
+
+		<view class="foot-note">券数量有限，售完即止；兑换后不可退换。</view>
+
+		<view class="footbar">
+			<view class="foot-price"><text class="foot-price-label">合计 </text>¥{{ priceText }}</view>
+			<view class="foot-btn" :class="{ disabled: submitting }" @click="onConfirmPay">{{ submitting ? '支付中…' : '确认支付' }}</view>
+		</view>
+
+		<!-- xuchao: 非云闪付环境拦截弹窗，必须点「我知道了」关闭（决策 11） -->
+		<view class="modal-mask" v-if="guideModal" @click.stop>
+			<view class="modal-box">
+				<view class="modal-text">{{ guideText }}</view>
+				<view class="modal-ok" @click="guideModal = false">我知道了</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+import {
+		VOUCHER_NAME, VOUCHER_PRICE_TEXT, VOUCHER_GUIDE_TEXT, VOUCHER_CANCEL_TEXT,
+	bizOk, bizMsg, bizData
+} from '@/common/petrolVoucher.js'
+
+export default {
+	data() {
+		return {
+			phone: '',
+			orderNo: '',
+			submitting: false,
+			guideModal: false,
+			guideText: VOUCHER_GUIDE_TEXT,
+			voucherName: VOUCHER_NAME,
+			priceText: VOUCHER_PRICE_TEXT
+		}
+	},
+	computed: {
+		maskedPhone() {
+			if (!this.phone || this.phone.length !== 11) return this.phone || ''
+			return this.phone.slice(0, 3) + '****' + this.phone.slice(7)
+		}
+	},
+	onLoad(options) {
+		this.phone = uni.getStorageSync('phone') || ''
+		if (!this.phone) {
+			// xuchao: 未登录先看登录，回跳本流程从门店页重新进入（决策 15）
+			uni.redirectTo({ url: '/pages/index/login?redirect=' + encodeURIComponent('/pages/venue/detail?id=851219003520709&type=2') })
+			return
+		}
+		this.loadUpSdk() // xuchao: 运行时兜底注入（静态标签已在发布脚本注入产物 index.html，见 h5-release.sh）
+		if (options.orderNo) this.orderNo = options.orderNo
+		this.initFromServer()
+	},
+	methods: {
+		// xuchao: upsdk 运行时注入并返回就绪 Promise（同一加载只发起一次；超时/失败 resolve(false)）。
+		//         不能依赖 index.html 静态标签——HBuilderX 命令行构建的 H5 模板不吃根 index.html（会丢标签）。
+		loadUpSdk(timeout = 9000) {
+			if (typeof window === 'undefined' || typeof document === 'undefined') return Promise.resolve(false)
+			if (window.upsdk) return Promise.resolve(true)
+			if (this._upSdkPromise) return this._upSdkPromise
+			const loading = new Promise(resolve => {
+				let done = false
+				const finish = v => { if (!done) { done = true; resolve(v) } }
+				const exists = document.querySelector('script[data-upsdk]')
+				if (exists) {
+					// main.js 已预热注入：轮询等 window.upsdk 出现（避免重复插标签）
+					const t0 = Date.now()
+					const timer = setInterval(() => {
+						if (window.upsdk) { clearInterval(timer); finish(true) }
+						else if (Date.now() - t0 > timeout) { clearInterval(timer); finish(false) }
+					}, 200)
+					return
+				}
+				const s = document.createElement('script')
+				s.src = 'https://open.95516.com/s/open/js/upsdk.js'
+				s.setAttribute('data-upsdk', '1')
+				s.onload = () => finish(!!window.upsdk)
+				s.onerror = () => finish(false)
+				document.head.appendChild(s)
+				setTimeout(() => finish(!!window.upsdk), timeout)
+			})
+			this._upSdkPromise = loading
+			return loading
+		},
+		// xuchao: 价格展示以服务端 latest 为准；已有待支付单自动续用；已发券直接跳券详情
+		initFromServer() {
+			this.$u.api.voucherLatest({ phone: this.phone }).then(res => {
+				if (!bizOk(res)) return
+				const d = bizData(res)
+				if (d.price) this.priceText = (d.price / 100).toFixed(2)
+				if (!this.orderNo && d.statusCode === 0 && d.orderNo) {
+					this.orderNo = d.orderNo
+					if (d.amount) this.priceText = (d.amount / 100).toFixed(2)
+				}
+				if (d.statusCode === 2) {
+					uni.redirectTo({ url: '/pages/petrol/voucherDetail?orderNo=' + (d.orderNo || '') })
+				}
+			}).catch(() => {})
+		},
+		onConfirmPay() {
+			if (this.submitting) return
+			// xuchao: 不做容器/白名单前置拦截，直接发起；云闪付控件在站外唤不起时
+			//         由 pay 的 fail 回调统一弹「去云闪付」指引模态（决策 11 修订：去白名单）
+			this.submitting = true
+			this.doPay()
+		},
+		doPay() {
+			const step = this.orderNo
+				? Promise.resolve({ orderNo: this.orderNo })
+				: this.$u.api.voucherCreate({ phone: this.phone }).then(res => {
+					if (!bizOk(res)) throw new Error(bizMsg(res) || '下单失败')
+					return bizData(res)
+				})
+			step.then(d => {
+				this.orderNo = d.orderNo
+				return this.$u.api.voucherPrepay({ orderNo: this.orderNo, phone: this.phone })
+			}).then(res => {
+				if (!bizOk(res)) throw new Error(bizMsg(res) || '发起支付失败')
+				const pre = bizData(res)
+				const tn = pre.extendMap && pre.extendMap.resData
+				if (!tn) throw new Error('未获取到支付凭证')
+				this.launchUnionPay(tn)
+			}).catch(err => {
+				this.submitting = false
+				uni.showToast({ title: (err && err.message) || '操作失败，请稍后再试', icon: 'none' })
+			})
+		},
+		// xuchao: 云闪付控件唤起。先等 SDK 就绪（修复首点无反应：脚本异步加载未完成时
+		//         旧逻辑只重试 4 秒且静默；就绪判定收敛到 loadUpSdk 的 Promise）。
+		async launchUnionPay(tn) {
+			const ready = await this.loadUpSdk()
+			if (!ready) {
+				this.submitting = false
+				// xuchao: 临时诊断（定位弹窗真因后移除）：SDK 加载不出来时展示 UA 片段
+				this.guideText = '支付SDK未能加载[诊断] UA=' + (typeof navigator !== 'undefined' ? String(navigator.userAgent).slice(0, 120) : 'N/A')
+				this.guideModal = true
+				return
+			}
+			window.upsdk.pluginReady(() => {
+				window.upsdk.pay({
+					tn: tn,
+					success: () => {
+						uni.redirectTo({ url: '/pages/petrol/voucherDetail?orderNo=' + this.orderNo })
+					},
+					fail: (err) => {
+						// xuchao: 控件回调失败（含用户取消）。按 xuchao 要求文案定为取消提示；
+						//         [诊断] 行临时保留采集真实错误码，区分"取消"与"容器不支持"后移除并分文案
+						this.submitting = false
+						this.guideText = VOUCHER_CANCEL_TEXT + '\n[诊断] ' + JSON.stringify(err || {})
+						this.guideModal = true
+					}
+				})
+			})
+			// 控件无异步结果时兜底：3 秒后恢复按钮（支付成功路径以回跳/轮询为准）
+			setTimeout(() => { this.submitting = false }, 3000)
+		},
+		goBack() {
+			const pages = getCurrentPages()
+			if (pages.length > 1) {
+				uni.navigateBack()
+			} else {
+				uni.reLaunch({ url: '/pages/index/index' })
+			}
+		}
+	}
+}
+</script>
+
+<style>
+.page { min-height: 100vh; background-color: #f2f2f7; padding-bottom: 80px; }
+
+.nav-bar { display: flex; align-items: center; height: 56px; background-color: #ffffff; border-bottom: 1px solid #f0f0f0; position: relative; }
+.nav-back { position: absolute; left: 12px; top: 0; bottom: 0; display: flex; align-items: center; }
+.nav-title { flex: 1; text-align: center; font-size: 17px; font-weight: 600; color: #1a1818; padding: 0 56px; }
+
+.ticket { position: relative; overflow: hidden; background: linear-gradient(135deg, #0d6fe0, #2f9bff); border-radius: 8px; margin: 12px; padding: 16px; color: #ffffff; }
+.ticket-amt { font-size: 26px; font-weight: 700; }
+.ticket-amt-sub { font-size: 13px; font-weight: 400; opacity: 0.9; margin-left: 4px; }
+.ticket-dsc { font-size: 12px; opacity: 0.9; margin-top: 6px; }
+.ticket-wm { position: absolute; right: 4px; bottom: -14px; font-size: 60px; font-weight: 800; opacity: 0.1; }
+
+.card { background-color: #ffffff; border-radius: 8px; margin: 12px; padding: 4px 16px 8px; }
+.card-title { font-size: 15px; font-weight: 600; color: #1a1818; padding: 12px 0 4px; }
+.kv { display: flex; justify-content: space-between; align-items: center; font-size: 13px; padding: 11px 0; border-bottom: 1px solid #f2f2f7; }
+.kv:last-child { border-bottom: none; }
+.k { color: #999999; flex-shrink: 0; margin-right: 12px; }
+.v { color: #1a1818; text-align: right; word-break: break-all; }
+
+.payrow { display: flex; align-items: center; padding: 6px 0 12px; }
+.pay-logo { width: 26px; height: 26px; border-radius: 5px; margin-right: 10px; flex-shrink: 0; }
+.pay-name { flex: 1; font-size: 14px; color: #1a1818; }
+.pay-radio { width: 18px; height: 18px; border-radius: 50%; background-color: #0088ff; position: relative; }
+.pay-radio::after { content: ''; position: absolute; left: 5px; top: 5px; width: 8px; height: 8px; border-radius: 50%; background-color: #ffffff; }
+
+.foot-note { font-size: 12px; color: #999999; margin: 4px 16px; line-height: 1.6; }
+
+.footbar { position: fixed; left: 0; right: 0; bottom: 0; height: 64px; background-color: #ffffff; border-top: 1px solid #f0f0f0; display: flex; align-items: center; padding: 0 16px; z-index: 5; }
+.foot-price { font-size: 20px; font-weight: 600; color: #ff4d4f; }
+.foot-price-label { font-size: 12px; font-weight: 400; color: #666666; }
+.foot-btn { flex: 1; margin-left: 14px; height: 44px; border-radius: 8px; background-color: #0088ff; color: #ffffff; font-size: 16px; display: flex; align-items: center; justify-content: center; }
+.foot-btn.disabled { background-color: #c8cdd4; }
+
+.modal-mask { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.45); display: flex; align-items: center; justify-content: center; z-index: 99; }
+.modal-box { width: 300px; background-color: #ffffff; border-radius: 12px; overflow: hidden; }
+.modal-text { padding: 24px 20px 20px; font-size: 14px; color: #1a1818; line-height: 1.7; text-align: center; }
+.modal-ok { height: 48px; border-top: 1px solid #f2f2f7; color: #0088ff; font-size: 16px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
+</style>

pages/petrol/voucherDetail.vue

@@ -0,0 +1,261 @@
+<template>
+	<view class="page">
+		<view class="nav-bar">
+			<view class="nav-back" @click="goBack">
+				<u-icon name="arrow-left" color="#1a1818" size="40"></u-icon>
+			</view>
+			<text class="nav-title">券详情</text>
+		</view>
+
+		<!-- 发券中（statusCode=1） -->
+		<view class="issuing" v-if="status === 1">
+			<view class="spinner"></view>
+			<view class="issuing-t">支付成功，券发放中…</view>
+			<view class="issuing-d">通常 10 秒内到账，请稍后刷新查看券码</view>
+			<view class="btn-line" @click="refresh()">手动刷新</view>
+		</view>
+
+		<!-- 已发券（statusCode=2）：二维码 + 订单信息 -->
+		<block v-else-if="status === 2">
+			<view class="qrbox">
+				<!-- 核销码为图片URL时直接展示 -->
+				<image v-if="isQrImage" class="qr-img" :src="qrText" mode="widthFix" />
+				<!-- 核销码为字符串时前端渲染二维码（每60秒向服务端换取新码） -->
+				<view v-else id="petrol-qr" class="qr-canvas"></view>
+				<view class="qr-tip">核销码每 60 秒自动刷新，请到店后出示给收银员扫码</view>
+			</view>
+
+			<view class="card">
+				<view class="card-title">订单信息</view>
+				<view class="kv"><text class="k">券名称</text><text class="v">{{ voucherName }}</text></view>
+				<view class="kv"><text class="k">有效期至</text><text class="v">{{ voucher.validUntil || '-' }}</text></view>
+				<view class="kv"><text class="k">实付金额</text><text class="v">¥{{ amountText }}</text></view>
+				<view class="kv"><text class="k">支付时间</text><text class="v">{{ fmtTime(voucher.payTime) }}</text></view>
+				<view class="kv"><text class="k">订单号</text><text class="v">{{ voucher.orderNo }}</text></view>
+			</view>
+		</block>
+
+		<!-- 待支付（0）：续付入口 -->
+		<view class="state-card" v-else-if="status === 0">
+			<view class="state-t">订单待支付</view>
+			<view class="state-d">实付金额 ¥{{ amountText }}，订单将在下单 30 分钟后自动关闭</view>
+			<view class="btn-main" @click="goConfirm">继续支付</view>
+		</view>
+
+		<!-- 已退款（3/4） -->
+		<view class="state-card" v-else-if="status === 3 || status === 4">
+			<view class="state-t">{{ status === 4 ? '退款处理中' : '已退款' }}</view>
+			<view class="state-d">很抱歉，本券发放失败，支付金额已原路退回{{ status === 4 ? '处理中，到账请稍后查询' : '' }}。如有疑问请致电客服。</view>
+			<view class="btn-main" @click="goConfirm">重新购买</view>
+		</view>
+
+		<!-- 已关闭（5） -->
+		<view class="state-card" v-else-if="status === 5">
+			<view class="state-t">订单已关闭</view>
+			<view class="state-d">该待支付订单已超时关闭，可重新下单购买。</view>
+			<view class="btn-main" @click="goConfirm">重新购买</view>
+		</view>
+
+		<!-- 加载中 / 无单 -->
+		<view class="state-card" v-else>
+			<view class="state-t">{{ status === null ? '加载中…' : '暂无券订单' }}</view>
+			<view class="state-d" v-if="status === null">正在获取订单状态</view>
+			<view class="state-d" v-else>您还没有购买汽油券，可返回门店页购买</view>
+			<view class="btn-line" v-if="status !== null" @click="refresh()">刷新</view>
+		</view>
+
+		<!-- 使用说明（有券或发券中都展示） -->
+		<block v-if="status === 2 || status === 1">
+			<view class="card">
+				<view class="card-title">使用规则</view>
+				<view class="ol-item" v-for="(t, i) in useRules" :key="'r' + i">{{ i + 1 }}、{{ t }}</view>
+			</view>
+			<view class="card">
+				<view class="card-title">使用流程</view>
+				<view class="ol-item" v-for="(t, i) in useFlow" :key="'f' + i">{{ i + 1 }}、{{ t }}</view>
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+import {
+	VOUCHER_NAME, VOUCHER_USE_RULES, VOUCHER_USE_FLOW,
+	bizOk, bizMsg, bizData
+} from '@/common/petrolVoucher.js'
+
+export default {
+	data() {
+		return {
+			orderNo: '',
+			phone: '',
+			voucher: {},
+			status: null, // null=加载中；含义对齐后端 statusCode
+			qrText: '', // xuchao: 实时核销码（60 秒滚动，来自 /voucher/checkCode）
+			pollTimer: null,
+			pollLeft: 3,
+			checkTimer: null,
+			voucherName: VOUCHER_NAME,
+			useRules: VOUCHER_USE_RULES,
+			useFlow: VOUCHER_USE_FLOW
+		}
+	},
+	computed: {
+		amountText() {
+			const f = this.voucher.amount
+			return f ? (f / 100).toFixed(2) : ''
+		},
+		isQrImage() {
+			return typeof this.qrText === 'string' && /^https?:\/\//i.test(this.qrText)
+		}
+	},
+	onLoad(options) {
+		this.phone = uni.getStorageSync('phone') || ''
+		this.orderNo = options.orderNo || ''
+		if (!this.phone) {
+			uni.redirectTo({ url: '/pages/index/login?redirect=' + encodeURIComponent('/pages/petrol/voucherDetail?orderNo=' + this.orderNo) })
+			return
+		}
+		this.refresh(true)
+	},
+	onUnload() {
+		this.stopPoll()
+		this.stopCheckTimer()
+	},
+	methods: {
+		refresh(first) {
+			this.$u.api.voucherLatest({ phone: this.phone }).then(res => {
+				if (!bizOk(res)) {
+					uni.showToast({ title: bizMsg(res) || '查询失败', icon: 'none' })
+					return
+				}
+				const d = bizData(res)
+				if (!d || d.statusCode === undefined || d.statusCode === -1) {
+					this.status = -1
+					this.voucher = {}
+					return
+				}
+				this.voucher = d
+				this.status = d.statusCode
+				if (this.status === 1) {
+					// xuchao: 发券中轮询（支付回跳后 5 秒 ×3 次；手动刷新不限量）
+					if (first && this.pollLeft > 0) this.startPoll()
+				} else {
+					this.stopPoll()
+				}
+				if (this.status === 2) {
+					this.loadCheckCode()
+				} else {
+					this.stopCheckTimer()
+				}
+			}).catch(() => {
+				if (first) uni.showToast({ title: '网络异常，请稍后重试', icon: 'none' })
+			})
+		},
+		startPoll() {
+			this.stopPoll()
+			this.pollTimer = setInterval(() => {
+				if (this.pollLeft <= 0) { this.stopPoll(); return }
+				this.pollLeft -= 1
+				this.refresh(false)
+			}, 5000)
+		},
+		stopPoll() {
+			if (this.pollTimer) { clearInterval(this.pollTimer); this.pollTimer = null }
+		},
+		// xuchao: 取实时核销码并渲染；CNPC 侧 60 秒滚动，前端每 55 秒预取刷新
+		loadCheckCode() {
+			const orderNo = this.voucher.orderNo || this.orderNo
+			if (!orderNo) return
+			this.$u.api.voucherCheckCode({ orderNo, phone: this.phone }).then(res => {
+				if (!bizOk(res)) { uni.showToast({ title: bizMsg(res) || '获取核销码失败', icon: 'none' }); return }
+				const d = bizData(res)
+				this.qrText = d.checkCode || ''
+				this.$nextTick(() => this.renderQr())
+				this.startCheckTimer()
+			}).catch(() => {})
+		},
+		startCheckTimer() {
+			this.stopCheckTimer()
+			this.checkTimer = setInterval(() => this.loadCheckCode(), 55000)
+		},
+		stopCheckTimer() {
+			if (this.checkTimer) { clearInterval(this.checkTimer); this.checkTimer = null }
+		},
+		// xuchao: 核销码字符串→二维码渲染；qrcode.min.js 为本地静态资源（static/js/），动态注入一次
+		renderQr() {
+			if (this.isQrImage) return
+			if (!this.qrText) return
+			const draw = () => {
+				if (typeof document === 'undefined' || typeof window.QRCode === 'undefined') return
+				const el = document.getElementById('petrol-qr')
+				if (!el) return
+				el.innerHTML = ''
+				// eslint-disable-next-line no-new
+				new window.QRCode(el, {
+					text: this.qrText,
+					width: 200, height: 200, colorDark: '#1a1818', colorLight: '#ffffff',
+					correctLevel: window.QRCode.CorrectLevel.H
+				})
+			}
+			if (typeof window !== 'undefined' && window.QRCode) { draw(); return }
+			if (typeof document === 'undefined') return
+			const s = document.createElement('script')
+			s.src = '/static/js/qrcode.min.js'
+			s.onload = draw
+			document.head.appendChild(s)
+		},
+		goConfirm() {
+			uni.navigateTo({ url: '/pages/petrol/orderConfirm' + (this.status === 0 ? '?orderNo=' + this.voucher.orderNo : '') })
+		},
+		fmtTime(t) {
+			if (!t) return '-'
+			return String(t).replace('T', ' ').slice(0, 16)
+		},
+		goBack() {
+			const pages = getCurrentPages()
+			if (pages.length > 1) {
+				uni.navigateBack()
+			} else {
+				uni.reLaunch({ url: '/pages/index/index' })
+			}
+		}
+	}
+}
+</script>
+
+<style>
+.page { min-height: 100vh; background-color: #f2f2f7; padding-bottom: 24px; }
+
+.nav-bar { display: flex; align-items: center; height: 56px; background-color: #ffffff; border-bottom: 1px solid #f0f0f0; position: relative; }
+.nav-back { position: absolute; left: 12px; top: 0; bottom: 0; display: flex; align-items: center; }
+.nav-title { flex: 1; text-align: center; font-size: 17px; font-weight: 600; color: #1a1818; padding: 0 56px; }
+
+.qrbox { position: relative; background-color: #ffffff; border-radius: 8px; margin: 12px; padding: 28px 20px 18px; text-align: center; }
+.qr-canvas { display: inline-block; }
+.qr-canvas img, .qr-canvas canvas { display: block; }
+.qr-img { width: 200px; }
+.qr-tip { font-size: 12px; color: #999999; margin-top: 12px; }
+
+.card { background-color: #ffffff; border-radius: 8px; margin: 12px; padding: 4px 16px 12px; }
+.card-title { font-size: 15px; font-weight: 600; color: #1a1818; padding: 14px 0 2px; }
+.kv { display: flex; justify-content: space-between; align-items: center; font-size: 13px; padding: 11px 0; border-bottom: 1px solid #f2f2f7; }
+.kv:last-child { border-bottom: none; }
+.k { color: #999999; flex-shrink: 0; margin-right: 12px; }
+.v { color: #1a1818; text-align: right; word-break: break-all; }
+.ol-item { font-size: 13px; color: #666666; line-height: 1.8; }
+
+.issuing { background-color: #ffffff; border-radius: 8px; margin: 12px; padding: 46px 20px 26px; text-align: center; }
+.spinner { width: 44px; height: 44px; border: 3px solid #dbe9ff; border-top-color: #0088ff; border-radius: 50%; margin: 0 auto 16px; animation: spin 1s linear infinite; }
+@keyframes spin { to { transform: rotate(360deg); } }
+.issuing-t { font-size: 16px; color: #1a1818; font-weight: 600; margin-bottom: 6px; }
+.issuing-d { font-size: 12px; color: #999999; line-height: 1.7; margin-bottom: 18px; }
+
+.state-card { background-color: #ffffff; border-radius: 8px; margin: 12px; padding: 30px 20px; text-align: center; }
+.state-t { font-size: 17px; font-weight: 600; color: #1a1818; margin-bottom: 8px; }
+.state-d { font-size: 13px; color: #999999; line-height: 1.7; margin-bottom: 20px; }
+
+.btn-main { height: 44px; border-radius: 8px; background-color: #0088ff; color: #ffffff; font-size: 15px; display: flex; align-items: center; justify-content: center; }
+.btn-line { height: 42px; border-radius: 8px; border: 1px solid #0088ff; color: #0088ff; font-size: 15px; display: flex; align-items: center; justify-content: center; background-color: #ffffff; margin: 0 30px; }
+.issuing .btn-line { margin: 0; }
+</style>

pages/rights/detail.vue

@@ -1,6 +1,8 @@
 <template>
 	<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-main">
@@ -442,6 +444,11 @@ export default {
 }
 
 /* 底部预约按钮 */
+/* xuchao: 内容区为 fixed 底栏预留的高度，短屏下「权益说明」才不会被遮住 */
+.has-bottom-bar {
+	padding-bottom: calc(80px + env(safe-area-inset-bottom));
+}
+
 .bottom-bar {
 	position: fixed;
 	bottom: 0;

pages/rights/rights.vue

@@ -89,7 +89,9 @@
 						</view>
 					</view>
 				</view>
-
+			</view>
+			<!-- xuchao: Tab + 搜索 + 县区/类型筛选一起吸顶；筛选只作用于「待使用」（另两个 Tab 的接口不返回地址与分类） -->
+			<view class="info-sticky">
 				<!-- Tab 切换 -->
 				<view class="tab-bar">
 					<view v-for="(tab, index) in tabs" :key="index" class="tab-item"
@@ -97,20 +99,27 @@
 						<text class="tab-text">{{ tab }}</text>
 					</view>
 				</view>
-			</view>
 				<!-- 搜索栏 -->
 				<view class="search-area" v-if="currentTab==0">
 					<view class="search-bar">
 						<u-icon name="search" color="#cccccc" size="24"></u-icon>
 						<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>
 
 			<!-- 权益列表 -->
 			<!-- 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="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-name">{{ item.name }}</view>
 						<view class="card-category">{{ item.category }}</view>
@@ -171,7 +180,13 @@
 </template>
 
 <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 {
+		components: { HhrsFilterBar },
 		data() {
 			return {
 				status: 'auth',
@@ -189,6 +204,14 @@
 				tabs: ['待使用', '已预约', '已使用'],
 				currentTab: 0,
 				keyword: '',
+				// xuchao: 待使用列表的县区/类型筛选条件与面板选项（选项由列表响应带回）
+				districtId: '',
+				category: '',
+				filters: { districts: [], categories: [] },
+				// xuchao: 待使用列表的县区/类型筛选条件与面板选项（选项由列表响应带回）
+				districtId: '',
+				category: '',
+				filters: { districts: [], categories: [] },
 				rightsList: [],
 				appointmentList: [],
 				checkList: [],
@@ -262,6 +285,7 @@
 			}
 		},
 		methods: {
+			shortDistrict,
 			// xuchao: 缓存的权益状态可能过期（中奖/权益包会变化），每次进页面仅凭手机号向服务端
 			//         复查最新状态并覆盖缓存（不带证件号，避免触发被动认证）
 			refreshStatus() {
@@ -495,10 +519,19 @@
 					params.keyword = this.keyword
 					params.lng = this.lng
 					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.then(res => {
 					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) {
 						const list = res.data.list || []
 						const prev = this.listOf(tab)
@@ -538,6 +571,12 @@
 			onSearch() {
 				this.loadList(0, true)
 			},
+			// xuchao: 换筛选条件即回第 1 页重查（关键词保持不变，两者为 AND）
+			onFilterChange(e) {
+				this.districtId = e.districtId
+				this.category = e.category
+				this.loadList(0, true)
+			},
 			goDetail(item) {
 				uni.navigateTo({
 					url: '/pages/rights/detail?id=' + item.ruleId
@@ -794,11 +833,20 @@
 		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-bar {
 		display: flex;
 		background-color: #ffffff;
-		margin-top: 12px;
 		padding: 0 16px;
 	}
 
@@ -833,7 +881,8 @@
 
 	/* 搜索栏 */
 	.search-area {
-		padding: 12px;
+		/* xuchao: 底部留白交给筛选条的 20rpx 上内边距，保证三段间距一致 */
+		padding: 12px 12px 0;
 	}
 
 	.search-bar {
@@ -841,6 +890,10 @@
 		align-items: center;
 		height: 36px;
 		background-color: #ffffff;
+		/* xuchao: 头部改白底后，白色搜索框在白色吸顶栏上必须描边才分得出来；
+		   显式 border-box 保证加边框后高度仍是 36px */
+		border: 1px solid #e5e5ea;
+		box-sizing: border-box;
 		border-radius: 18px;
 		padding: 0 12px;
 		gap: 8px;
@@ -861,6 +914,12 @@
 		flex-direction: column;
 	}
 
+	/* xuchao: 「待使用」列表顶部 24rpx(=12px) 灰底间隔，与卡片之间的间距一致，
+	   也与筛选条和列表之间的 12px 对齐；只加在这个 Tab，不影响「已预约/已使用」 */
+	.list-area--todo {
+		padding-top: 24rpx;
+	}
+
 	.nomore-area {
 		width: 100%;
 		padding-bottom: 24px;
@@ -876,12 +935,38 @@
 		margin-bottom: 24rpx;
 	}
 
-	.card-img {
+	.card-thumb {
 	width: 150rpx;
 	height: 150rpx;
 	border-radius: 6px;
+	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 {
 		width: 490rpx;

pages/venue/detail.vue

@@ -15,7 +15,7 @@
 				<view class="store-info">
 					<text class="store-name">{{ store.name }}</text>
 					<text class="store-category">{{ store.category }}</text>
-					<text class="store-hours">营业时间：{{ store.businessTime }}</text>
+					<text class="store-hours" v-if="store.businessTime">营业时间：{{ store.businessTime }}</text>
 				</view>
 			</view>
 			<view class="divider"></view>
@@ -42,8 +42,8 @@
 			</view>
 		</view>
 
-		<!-- 商品信息（内容取商铺门票信息字段） -->
+		<!-- 商品信息（仅商户折扣板块展示，内容取商铺门票信息字段） -->
-		<view class="discount-section" v-if="ticketInfoList.length">
+		<view class="discount-section" v-if="!isVenue && ticketInfoList.length">
 			<view class="section-title">
 				<image src="https://aliyunoss.hn12301.net/hhrs/hhrs_qysm.png" style="width: 30rpx;height: 30rpx;"></image>
 				<text class="discount-title">商品信息</text>
@@ -53,16 +53,31 @@
 			</view>
 		</view>
 
-		<!-- 商户优惠 -->
+		<!-- 文旅场馆显示「使用说明」（1001板块备注），商户折扣显示「商户优惠」（1002板块备注） -->
-		<view class="discount-section">
+		<view class="discount-section" v-if="remarkList.length">
 			<view class="section-title">
 				<image src="https://aliyunoss.hn12301.net/hhrs/hhrs_qysm.png" style="width: 30rpx;height: 30rpx;"></image>
-				<text class="discount-title">商户优惠</text>
+				<text class="discount-title">{{ isVenue ? '使用说明' : '商户优惠' }}</text>
 			</view>
 			<view class="discount-list">
-				<text class="discount-item" v-for="(item, index) in discountList" :key="index">{{ item }}</text>
+				<text class="discount-item" v-for="(item, index) in remarkList" :key="index">{{ item }}</text>
 			</view>
 		</view>
+
+		<!-- xuchao: 怀化石油汽油券购买模块（shopId 写死特判，只服务该门店，决策 1/10/15） -->
+		<view class="voucher-card" v-if="isPetrol">
+			<view class="section-title">
+				<image src="https://aliyunoss.hn12301.net/hhrs/hhrs_qysm.png" style="width: 30rpx;height: 30rpx;"></image>
+				<text class="discount-title">汽油电子券</text>
+			</view>
+			<view class="voucher-ticket">
+				<view class="voucher-amt">200元 <text class="voucher-amt-sub">汽油电子券</text></view>
+				<view class="voucher-rule">无门槛 ｜ 90 天有效 ｜ 单日限用 1 张 ｜ 可叠加</view>
+				<text class="voucher-wm">90天</text>
+			</view>
+			<view class="voucher-tip">支付成功后券码即时展示；到店出示二维码，收银员以“中石油汽油券”通道扫码核销。券一经售出不支持退换。</view>
+			<view class="voucher-btn" @click="onVoucherClick">{{ voucherBtnText }}</view>
+		</view>
 		</view>
 		<!-- xuchao: 门店不存在或加载失败时的提示态，避免纯空白 -->
 		<view class="page" v-else-if="loaded">
@@ -80,21 +95,47 @@
 </template>
 
 <script>
+import { PETROL_SHOP_ID, bizOk, bizData } from '@/common/petrolVoucher.js'
+
 export default {
 	data() {
 		return {
 			store: null,
-			loaded: false
+			loaded: false,
+			detailType: '1',
+			shopId: '',
+			voucher: null // xuchao: 石油券最新订单状态（statusCode 语义见 common/petrolVoucher.js）
 		}
 	},
 	computed: {
+		// xuchao: 入口板块：type=2 商户折扣，其余（含缺省）按文旅场馆渲染
+		isVenue() {
+			return this.detailType !== '2'
+		},
+		isPetrol() {
+			// xuchao: 业务调整：该商铺不再需要特殊购买处理，前端入口整体隐藏；券页面/接口/SDK注入均保留，恢复时去掉下面的 return false 即可
+			return false
+			// xuchao: 后端券服务探活（latest 返回 price）后才展示购券模块——后端未部署期间整模块自动隐藏，无死入口
+			// return this.loaded && String(this.shopId) === PETROL_SHOP_ID && !this.isVenue && !!(this.voucher && this.voucher.price)
+		},
+		voucherBtnText() {
+			const s = this.voucher ? this.voucher.statusCode : -1
+			if (s === 0) return '继续支付'
+			if (s === 1 || s === 2) return '查看我的券'
+			if (s === 3 || s === 4) return '重新购买'
+			// xuchao: 购买按钮金额取服务端下发价（测试期 0.01）；未登录无数据时用中性文案
+			if (this.voucher && this.voucher.price) return '¥' + (this.voucher.price / 100).toFixed(2) + ' 购买'
+			return '购买汽油券'
+		},
 		ticketInfoList() {
 			if (!this.store || !this.store.ticketInfo) return []
 			return this.store.ticketInfo.split('\n')
 		},
-		discountList() {
+		remarkList() {
-			if (!this.store || !this.store.merchantDiscount) return []
+			if (!this.store) return []
-			return this.store.merchantDiscount.split('\n')
+			const text = this.isVenue ? this.store.usageNote : this.store.merchantDiscount
+			if (!text) return []
+			return text.split('\n')
 		},
 		// xuchao: 客服电话列表：按常见分隔符切分；无分隔符连写的多个11位手机号也自动拆开
 		servicePhoneList() {
@@ -121,11 +162,39 @@ export default {
 		}
 	},
 	onLoad(options) {
+		if (options.type) this.detailType = String(options.type)
 		if (options.id) {
+			this.shopId = String(options.id)
 			this.loadDetail(options.id)
 		}
 	},
+	onShow() {
+		// xuchao: 支付/购券流程返回时刷新券按钮状态
+		if (String(this.shopId) === PETROL_SHOP_ID) this.loadVoucher()
+	},
 	methods: {
+		// xuchao: 拉取石油券最新订单状态（未登录也调用：作为后端服务探活，price 决定模块显隐）
+		loadVoucher() {
+			const phone = uni.getStorageSync('phone') || ''
+			this.$u.api.voucherLatest({ phone }).then(res => {
+				this.voucher = bizOk(res) ? bizData(res) : null
+			}).catch(() => { this.voucher = null })
+		},
+		onVoucherClick() {
+			const phone = uni.getStorageSync('phone')
+			if (!phone) {
+				uni.navigateTo({ url: '/pages/index/login?redirect=' + encodeURIComponent('/pages/venue/detail?id=' + this.shopId + '&type=' + this.detailType) })
+				return
+			}
+			const s = this.voucher ? this.voucher.statusCode : -1
+			if (s === 2 || s === 1) {
+				uni.navigateTo({ url: '/pages/petrol/voucherDetail' })
+			} else if (s === 0) {
+				uni.navigateTo({ url: '/pages/petrol/orderConfirm?orderNo=' + this.voucher.orderNo })
+			} else {
+				uni.navigateTo({ url: '/pages/petrol/orderConfirm' })
+			}
+		},
 		// xuchao: 点击某个商户电话唤起拨号（多个号码时逐个可点）
 		callPhone(phone) {
 			if (!phone) return
@@ -251,7 +320,7 @@ export default {
 	color: #999999;
 }
 
-/* 商户优惠 */
+/* 使用说明 */
 .discount-section {
 	background-color: #ffffff;
 	margin: 12px;
@@ -294,6 +363,40 @@ export default {
 	color: #0088ff;
 }
 
+/* xuchao: 石油汽油券购买模块 */
+.voucher-card {
+	background-color: #ffffff;
+	margin: 12px;
+	border-radius: 8px;
+	padding: 16px;
+}
+
+.voucher-ticket {
+	position: relative;
+	overflow: hidden;
+	background: linear-gradient(135deg, #0d6fe0, #2f9bff);
+	border-radius: 8px;
+	padding: 14px;
+	color: #ffffff;
+}
+
+.voucher-amt { font-size: 22px; font-weight: 700; }
+.voucher-amt-sub { font-size: 12px; font-weight: 400; opacity: 0.9; margin-left: 4px; }
+.voucher-rule { font-size: 12px; opacity: 0.9; margin-top: 6px; }
+.voucher-wm { position: absolute; right: 4px; bottom: -12px; font-size: 52px; font-weight: 800; opacity: 0.1; }
+.voucher-tip { font-size: 12px; color: #666666; line-height: 1.7; margin-top: 12px; }
+.voucher-btn {
+	height: 42px;
+	margin-top: 12px;
+	border-radius: 8px;
+	background-color: #0088ff;
+	color: #ffffff;
+	font-size: 15px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
 /* xuchao: 加载失败提示态 */
 .load-failed {
 	display: flex;

pages/venue/venue.vue

@@ -13,22 +13,31 @@
 					<view class="search-btn" @click="onSearch">搜索</view>
 				</view>
 			</view>
+			<!-- xuchao: 所属县区 + 所属类型筛选，选项与联动条数由列表接口一并返回 -->
+			<hhrs-filter-bar :districts="filters.districts" :categories="filters.categories"
+				:district-id="districtId" :category="category" @change="onFilterChange" />
 		</view>
 
 		<!-- 场馆列表 -->
 		<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">
+				<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">
 					<text class="card-name">{{ item.name }}</text>
 					<text class="card-category">{{ item.category }}</text>
+					<view class="card-bottom">
 						<text class="card-address">{{ item.address }}</text>
-				</view>
 						<view class="card-distance" v-if="item.distance !== null">
 							<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>
 						</view>
 					</view>
+				</view>
+			</view>
 			<view v-if="hasScrolled" class="nomore-area">
 				<u-loadmore :status="loadStatus" :load-text="{ loadmore: '', loading: '加载中...', nomore: '我也是有底线的' }" />
 			</view>
@@ -37,7 +46,13 @@
 </template>
 
 <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 {
+	components: { HhrsFilterBar },
 	data() {
 		return {
 			keyword: '',
@@ -50,7 +65,11 @@ export default {
 			lat: '',
 			loadStatus: 'loadmore',
 			hasScrolled: false,
-			reqSeq: 0
+			reqSeq: 0,
+			// xuchao: 筛选条件与面板选项（选项由列表响应带回）
+			districtId: '',
+			category: '',
+			filters: { districts: [], categories: [] }
 		}
 	},
 	onLoad() {
@@ -68,6 +87,7 @@ export default {
 		this.loadMore()
 	},
 	methods: {
+		shortDistrict,
 		loadList() {
 			// xuchao: 请求序号 —— 新请求直接取代在途请求，过期响应整体丢弃（修复搜索竞态，故不再用 loading 提前 return）
 			const seq = ++this.reqSeq
@@ -81,9 +101,16 @@ export default {
 			}
 			if (this.lng) params.lng = this.lng
 			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 => {
 				if (seq !== this.reqSeq) return
 				if (res.errcode === 0 && res.data) {
+					// xuchao: 面板选项随列表一起回来（后端已按关键词与另一维度算好条数）
+					this.filters = {
+						districts: res.data.districts || [],
+						categories: res.data.categories || []
+					}
 					const list = res.data.list || []
 					if (this.pageNo === 1) {
 						this.list = list
@@ -122,13 +149,16 @@ export default {
 				uni.reLaunch({ url: '/pages/index/index' })
 			}
 		},
-		goDetail(item) {
-			uni.navigateTo({ url: '/pages/venue/detail?id=' + item.shopId })
-		},
 		onSearch() {
 			this.pageNo = 1
 			this.list = []
 			this.loadList()
+		},
+		// xuchao: 换筛选条件即回第 1 页重查（关键词保持不变，两者为 AND）
+		onFilterChange(e) {
+			this.districtId = e.districtId
+			this.category = e.category
+			this.onSearch()
 		}
 	}
 }
@@ -143,7 +173,11 @@ export default {
 
 .search-area {
 	background-color: #ffffff;
-	padding: 6px 12px;
+	padding: 6px 12px 0;
+	/* xuchao: 滚动时固定在页面顶部；z-index 高于筛选遮罩(90)，保证面板与选中态不被压住 */
+	position: sticky;
+	top: 0;
+	z-index: 100;
 }
 
 .nav-row {
@@ -194,6 +228,7 @@ export default {
 }
 
 .list-area {
+	/* xuchao: 顶部 12px 必须是页面灰底（不能放进头部的白底里），否则与白色卡片连成一片看不出间隔 */
 	padding: 12px;
 }
 
@@ -203,47 +238,91 @@ export default {
 	background-color: #ffffff;
 	border: 1px solid #f2f2f7;
 	border-radius: 6px;
-	width: 702rpx;
 	padding: 24px 12px;
 	gap: 12px;
 	box-shadow: 0 2px 3px #f2f2f7;
-	margin-bottom: 12px;
+	margin: 12px;
 }
 
-.card-img {
+.card-thumb {
 	width: 75px;
 	height: 75px;
 	border-radius: 6px;
+	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 {
 	flex: 1;
+	/* xuchao: flex 项默认 min-width:auto，nowrap 地址会把列宽撑破卡片；置 0 后子元素在实宽内省略 */
+	min-width: 0;
 	display: flex;
 	flex-direction: column;
 	gap: 0;
+	width: 100%;
+	min-width: 0;
 }
 
 .card-name {
 	font-size: 16px;
 	font-weight: 500;
 	color: #000000;
+	width: 100%;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
 }
 
 .card-category {
 	font-size: 14px;
 	color: #727272;
 	margin-top: 8px;
+	/* xuchao: 分类为空也预留一行高度，防止卡片内容底部对齐时名称上下跳动 */
+	min-height: 20px;
+	line-height: 20px;
+}
+
+.card-bottom {
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+	margin-top: 8px;
+	gap: 8px;
 }
 
 .card-address {
+	flex: 1;
 	font-size: 14px;
 	color: #727272;
-	margin-top: 8px;
 	overflow: hidden;
 	text-overflow: ellipsis;
 	white-space: nowrap;
-	max-width: 200px;
+	min-width: 0;
 }
 
 .card-distance {

pages/winners/winners.vue

@@ -11,7 +11,7 @@
 				<image class="banner-icon" src="https://aliyunoss.hn12301.net/hhrs/hhrs_zjgs.png" mode="aspectFit"></image>
 				<text class="banner-title">中奖名单公示</text>
 			</view>
-			<text class="banner-subtitle">总计 10,000份权益包，分三期公证抽取</text>
+			<text class="banner-subtitle">总计 10,000份权益包，全程公证抽取</text>
 			<view class="stats-card">
 				<image class="stats-gift" src="https://aliyunoss.hn12301.net/hhrs/hhrs_xyckr.png" mode="aspectFit"></image>
 				<text class="stats-label">已产生</text>
@@ -81,7 +81,11 @@ export default {
 			// xuchao: 页码改为按期维护（原单一 pageNo 在切期后会被沿用，导致同一页重复追加/跳页）
 			pageNos: {},
 			pageSize: 10,
+			// xuchao: 搜索触发的全量拉取用大页尺寸(列表接口仅支持分页参数,无姓名检索)
+			pageSizeFull: 500,
 			totals: {},
+			fullLoaded: {},
+			loadingAll: {},
 			totalWinners: 0,
 			inFlight: 0,
 			loadStatusMap: {},
@@ -104,6 +108,15 @@ export default {
 			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() {
 		this.loadDates()
 	},
@@ -155,6 +168,8 @@ export default {
 				pageSize: this.pageSize,
 				drawDate: drawDate
 			}).then(res => {
+				// xuchao: 全量拉取已就绪/进行中时,旧的10条分页响应直接丢弃,避免覆盖全量列表
+				if (this.fullLoaded[tabIndex] || this.loadingAll[tabIndex]) return
 				if (res.errcode === 0 && res.data) {
 					const list = res.data.list || []
 					const prev = this.winnerData[tabIndex] || []
@@ -177,12 +192,48 @@ export default {
 		},
 		loadMore() {
 			const tab = this.currentTab
+			if (this.loadingAll[tab]) return
 			const total = this.totals[tab] || 0
 			const len = (this.winnerData[tab] || []).length
 			if (len < total && this.inFlight === 0) {
 				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) {
 			this.currentTab = index
 			// xuchao: 不再重置全局 pageNo（各期游标自带）；空列表补拉首页时允许并发，
@@ -204,7 +255,8 @@ export default {
 			}
 		},
 		onSearch() {
-			// 前端过滤，无需重新请求
+			// xuchao: 点搜索立即确保当期全量已拉取(过滤仍在前端本地完成)
+			if (!this.fullLoaded[this.currentTab]) this.loadAll(this.currentTab)
 		}
 	}
 }