feat(offlineBooking): 调整二维码样式并添加离线预约码模拟数据
调整二维码组件的内边距和尺寸以改善显示效果 为离线预约码页面添加模拟数据功能,当缓存为空时自动使用模拟数据
Showing
4 changed files
with
41 additions
and
6 deletions
| ... | @@ -180,10 +180,10 @@ watch(() => props.list, (newVal) => { | ... | @@ -180,10 +180,10 @@ watch(() => props.list, (newVal) => { |
| 180 | .center { | 180 | .center { |
| 181 | border: 2rpx solid #D1D1D1; | 181 | border: 2rpx solid #D1D1D1; |
| 182 | border-radius: 40rpx; | 182 | border-radius: 40rpx; |
| 183 | - padding: 16rpx; | 183 | + padding: 46rpx; |
| 184 | position: relative; | 184 | position: relative; |
| 185 | image { | 185 | image { |
| 186 | - width: 480rpx; height: 480rpx; | 186 | + width: 400rpx; height: 400rpx; |
| 187 | } | 187 | } |
| 188 | } | 188 | } |
| 189 | .right { | 189 | .right { | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2024-01-16 10:06:47 | 2 | * @Date: 2024-01-16 10:06:47 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2026-01-07 21:25:49 | 4 | + * @LastEditTime: 2026-01-08 16:02:07 |
| 5 | * @FilePath: /xyxBooking-weapp/src/components/qrCode.vue | 5 | * @FilePath: /xyxBooking-weapp/src/components/qrCode.vue |
| 6 | * @Description: 预约码卡组件 | 6 | * @Description: 预约码卡组件 |
| 7 | --> | 7 | --> |
| ... | @@ -282,10 +282,10 @@ const toRecord = () => { | ... | @@ -282,10 +282,10 @@ const toRecord = () => { |
| 282 | .center { | 282 | .center { |
| 283 | border: 2rpx solid #D1D1D1; | 283 | border: 2rpx solid #D1D1D1; |
| 284 | border-radius: 40rpx; | 284 | border-radius: 40rpx; |
| 285 | - padding: 16rpx; | 285 | + padding: 46rpx; |
| 286 | position: relative; | 286 | position: relative; |
| 287 | image { | 287 | image { |
| 288 | - width: 480rpx; height: 480rpx; | 288 | + width: 400rpx; height: 400rpx; |
| 289 | } | 289 | } |
| 290 | .qrcode-used { | 290 | .qrcode-used { |
| 291 | position: absolute; | 291 | position: absolute; | ... | ... |
src/pages/offlineBookingCode/index.config.js
0 → 100644
| 1 | +/* | ||
| 2 | + * @Date: 2025-06-28 10:33:00 | ||
| 3 | + * @LastEditors: hookehuyr hookehuyr@gmail.com | ||
| 4 | + * @LastEditTime: 2026-01-08 15:58:36 | ||
| 5 | + * @FilePath: /xyxBooking-weapp/src/pages/offlineBookingCode/index.config.js | ||
| 6 | + * @Description: 线下预约码配置 | ||
| 7 | + */ | ||
| 8 | +export default { | ||
| 9 | + navigationBarTitleText: '离线预约码' | ||
| 10 | +} |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2026-01-07 20:41:49 | 2 | * @Date: 2026-01-07 20:41:49 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2026-01-08 13:01:20 | 4 | + * @LastEditTime: 2026-01-08 15:58:10 |
| 5 | * @FilePath: /xyxBooking-weapp/src/pages/offlineBookingCode/index.vue | 5 | * @FilePath: /xyxBooking-weapp/src/pages/offlineBookingCode/index.vue |
| 6 | * @Description: 线下预约码页面 | 6 | * @Description: 线下预约码页面 |
| 7 | --> | 7 | --> |
| ... | @@ -40,14 +40,39 @@ const toHome = () => { | ... | @@ -40,14 +40,39 @@ const toHome = () => { |
| 40 | Taro.reLaunch({ url: '/pages/index/index' }); | 40 | Taro.reLaunch({ url: '/pages/index/index' }); |
| 41 | } | 41 | } |
| 42 | 42 | ||
| 43 | +// TODO: Mock Data as per requirement | ||
| 44 | +const getMockData = () => { | ||
| 45 | + return [ | ||
| 46 | + { | ||
| 47 | + name: '测试用户1', | ||
| 48 | + id_number: '110101199003078888', | ||
| 49 | + qr_code: 'OFFLINE_MOCK_QR_001', | ||
| 50 | + datetime: '2026-01-08 08:30-10:30', | ||
| 51 | + sort: 0 | ||
| 52 | + }, | ||
| 53 | + { | ||
| 54 | + name: '测试用户2', | ||
| 55 | + id_number: '110101199205126666', | ||
| 56 | + qr_code: 'OFFLINE_MOCK_QR_002', | ||
| 57 | + datetime: '2026-01-08 08:30-10:30', | ||
| 58 | + sort: 0 | ||
| 59 | + } | ||
| 60 | + ]; | ||
| 61 | +} | ||
| 62 | + | ||
| 43 | onMounted(() => { | 63 | onMounted(() => { |
| 44 | try { | 64 | try { |
| 45 | const cachedData = Taro.getStorageSync('OFFLINE_QR_DATA'); | 65 | const cachedData = Taro.getStorageSync('OFFLINE_QR_DATA'); |
| 46 | if (cachedData && cachedData.length > 0) { | 66 | if (cachedData && cachedData.length > 0) { |
| 47 | qrList.value = cachedData; | 67 | qrList.value = cachedData; |
| 68 | + } else { | ||
| 69 | + // Requirement 4: Mock data if no data | ||
| 70 | + console.log('No cached data found, using mock data'); | ||
| 71 | + qrList.value = getMockData(); | ||
| 48 | } | 72 | } |
| 49 | } catch (e) { | 73 | } catch (e) { |
| 50 | console.error('Read storage failed', e); | 74 | console.error('Read storage failed', e); |
| 75 | + qrList.value = getMockData(); | ||
| 51 | } | 76 | } |
| 52 | }); | 77 | }); |
| 53 | 78 | ... | ... |
-
Please register or login to post a comment