hookehuyr

style(scan-checkin-detail): 调整扫码打卡详情页样式并更新模拟数据

修改页面容器的内边距与背景色,将操作按钮栏固定至页面底部并适配iOS安全区域;新增大量模拟折扣描述文本以测试长文本场景,同时更新模拟文件的最后编辑时间
1 .scan-checkin-detail-page { 1 .scan-checkin-detail-page {
2 min-height: 100vh; 2 min-height: 100vh;
3 - padding: 0 0 60rpx; 3 + padding: 0 0 240rpx;
4 - background: #f2f4f7; 4 + background: #ebeaec;
5 box-sizing: border-box; 5 box-sizing: border-box;
6 } 6 }
7 7
...@@ -112,9 +112,14 @@ ...@@ -112,9 +112,14 @@
112 } 112 }
113 113
114 .scan-checkin-detail-button-wrap { 114 .scan-checkin-detail-button-wrap {
115 + position: fixed;
116 + left: 24rpx;
117 + right: 24rpx;
118 + bottom: calc(84rpx + constant(safe-area-inset-bottom));
119 + bottom: calc(84rpx + env(safe-area-inset-bottom));
115 display: flex; 120 display: flex;
116 justify-content: center; 121 justify-content: center;
117 - margin-top: 48rpx; 122 + z-index: 20;
118 } 123 }
119 124
120 .scan-checkin-detail-button { 125 .scan-checkin-detail-button {
......
1 /* 1 /*
2 * @Date: 2026-05-19 14:40:21 2 * @Date: 2026-05-19 14:40:21
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2026-05-19 15:25:07 4 + * @LastEditTime: 2026-05-19 17:57:08
5 * @FilePath: /lls_program/src/utils/mockQrCheckin.js 5 * @FilePath: /lls_program/src/utils/mockQrCheckin.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
...@@ -40,7 +40,7 @@ const mockScanCheckinPoints = [ ...@@ -40,7 +40,7 @@ const mockScanCheckinPoints = [
40 'https://cdn.ipadbiz.cn/lls_prog/images/check_detail_img.png?imageMogr2/strip/quality/60', 40 'https://cdn.ipadbiz.cn/lls_prog/images/check_detail_img.png?imageMogr2/strip/quality/60',
41 discountTitle: '打卡点专属优惠', 41 discountTitle: '打卡点专属优惠',
42 discountContent: 42 discountContent:
43 - '<p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">现场互动完成后可领取康养手册 1 份。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p>', 43 + '<p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">现场互动完成后可领取康养手册 1 份。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p><p style="margin: 0 0 20rpx; line-height: 1.8; color: #4b5563; font-size: 30rpx;">指定商品现场下单可享专属立减优惠。</p>',
44 }, 44 },
45 ] 45 ]
46 46
......