13 changed files with 476 additions and 269 deletions
@ -0,0 +1,93 @@ |
|||||||
|
|
||||||
|
|
||||||
|
## 开台操作 |
||||||
|
|
||||||
|
|
||||||
|
**接口地址**:`/api/v2/TablesDev/start_device` |
||||||
|
|
||||||
|
|
||||||
|
**请求方式**:`POST` |
||||||
|
|
||||||
|
|
||||||
|
**请求数据类型**:`application/x-www-form-urlencoded,application/json,text/json,application/*+json` |
||||||
|
|
||||||
|
|
||||||
|
**响应数据类型**:`text/plain` |
||||||
|
|
||||||
|
|
||||||
|
**接口描述**: |
||||||
|
|
||||||
|
|
||||||
|
**请求示例**: |
||||||
|
|
||||||
|
|
||||||
|
```javascript |
||||||
|
{ |
||||||
|
"grpSn": "", |
||||||
|
"openId": "", |
||||||
|
"ctrlType": 0, |
||||||
|
"amount": 0, |
||||||
|
"payType": 0, |
||||||
|
"durationHours": 0, |
||||||
|
"couponCode": "", |
||||||
|
"remark": "", |
||||||
|
"attach": "" |
||||||
|
} |
||||||
|
``` |
||||||
|
|
||||||
|
|
||||||
|
**请求参数**: |
||||||
|
|
||||||
|
|
||||||
|
**请求参数**: |
||||||
|
|
||||||
|
|
||||||
|
| 参数名称 | 参数说明 | 请求类型 | 是否必须 | 数据类型 | schema | |
||||||
|
| -------- | -------- | ----- | -------- | -------- | ------ | |
||||||
|
|startGroupDevRequestDto|开台请求参数|body|true|StartGroupDevRequestDto|StartGroupDevRequestDto| |
||||||
|
|  grpSn|设备编码||true|string|| |
||||||
|
|  openId|OpenId||true|string|| |
||||||
|
|  ctrlType|操作类型\n押金开台(1)、余额开台(2)、定时开台(3)、信用开台(4)、团购券开台(5)、\n立即关台(6)、续费(7)、关灯重开(8)、替人付费关台(9)||false|integer(int32)|| |
||||||
|
|  amount|消费金额||false|number(double)|| |
||||||
|
|  payType|支付方式 \n微信支付(1)、支付宝(2)、银联支付(3)、余额支付(4)、银行卡支付(5)||false|integer(int32)|| |
||||||
|
|  durationHours|开台时长（小时），定时开台使用||false|number(double)|| |
||||||
|
|  couponCode|团购券码，团购券开台使用||false|string|| |
||||||
|
|  remark|备注||false|string|| |
||||||
|
|  attach|附加数据（JSON格式）||false|string|| |
||||||
|
|
||||||
|
|
||||||
|
**响应状态**: |
||||||
|
|
||||||
|
|
||||||
|
| 状态码 | 说明 | schema | |
||||||
|
| -------- | -------- | ----- | |
||||||
|
|200|OK|StartDeviceResponse| |
||||||
|
|400|Bad Request|| |
||||||
|
|404|Not Found|| |
||||||
|
|500|Internal Server Error|| |
||||||
|
|
||||||
|
|
||||||
|
**响应参数**: |
||||||
|
|
||||||
|
|
||||||
|
| 参数名称 | 参数说明 | 类型 | schema | |
||||||
|
| -------- | -------- | ----- |----- | |
||||||
|
|consumptionId|消费记录ID|integer(int32)|integer(int32)| |
||||||
|
|outTradeNo|商户订单号|string|| |
||||||
|
|payParameters|支付参数|string|| |
||||||
|
|mwebUrl|H5支付URL|string|| |
||||||
|
|payUrl|支付URL（用于扫码支付）|string|| |
||||||
|
|errorMessage|描述消息|string|| |
||||||
|
|
||||||
|
|
||||||
|
**响应示例**: |
||||||
|
```javascript |
||||||
|
{ |
||||||
|
"consumptionId": 0, |
||||||
|
"outTradeNo": "", |
||||||
|
"payParameters": {}, |
||||||
|
"mwebUrl": "", |
||||||
|
"payUrl": "", |
||||||
|
"errorMessage": "" |
||||||
|
} |
||||||
|
``` |
||||||
@ -1,150 +1,122 @@ |
|||||||
/** |
/** |
||||||
* 开台页面 |
* 开台方式选择页面 |
||||||
*/ |
*/ |
||||||
import { View, Text, Image } from '@tarojs/components' |
import { View, Text, Image } from '@tarojs/components' |
||||||
import Taro, { useLoad } from '@tarojs/taro' |
import Taro, { useLoad, useRouter } from '@tarojs/taro' |
||||||
|
import { observer } from 'mobx-react' |
||||||
|
import { CtrlType } from '../../api/startDevice' |
||||||
|
import { tableStore } from '../../store' |
||||||
import './index.scss' |
import './index.scss' |
||||||
|
|
||||||
// 使用本地图片资源
|
|
||||||
const phoneIcon = require('./images/phone.png') |
const phoneIcon = require('./images/phone.png') |
||||||
|
|
||||||
// 开台方式列表
|
// optionCode → 跳转路径映射
|
||||||
const startTableMethods = [ |
const OPTION_URL_MAP: Record<number, string> = { |
||||||
{ |
[CtrlType.DepositStart]: '/pageScan/selfStart/index', |
||||||
id: 1, |
[CtrlType.TimedStart]: '/pageScan/timedStart/index', |
||||||
title: '自助开台', |
[CtrlType.CouponStart]: '/pageScan/couponStart/index', |
||||||
description: '会员余额>押金直接开台或支付开台', |
} |
||||||
}, |
|
||||||
{ |
const StartTable = observer(() => { |
||||||
id: 2, |
const router = useRouter() |
||||||
title: '定时开台', |
const grpSn = router.params.grpSn || tableStore.currentGrpSn |
||||||
description: '设定开台时长', |
const scanInfo = tableStore.scanInfo |
||||||
}, |
|
||||||
{ |
|
||||||
id: 3, |
|
||||||
title: '信用开台', |
|
||||||
description: '信用分≥550，直接开台，关台时结账', |
|
||||||
}, |
|
||||||
{ |
|
||||||
id: 4, |
|
||||||
title: '团购券开台', |
|
||||||
description: '使用美团、抖音等团购券开台', |
|
||||||
}, |
|
||||||
] |
|
||||||
|
|
||||||
const StartTable = () => { |
|
||||||
useLoad(() => { |
useLoad(() => { |
||||||
console.log('开台页面加载') |
console.log('开台页面加载, grpSn:', grpSn) |
||||||
}) |
}) |
||||||
|
|
||||||
// 拨打电话
|
|
||||||
const handlePhoneCall = () => { |
const handlePhoneCall = () => { |
||||||
Taro.makePhoneCall({ |
Taro.makePhoneCall({ phoneNumber: '100-666-XXXX' }).catch(() => {}) |
||||||
phoneNumber: '100-666-XXXX', |
|
||||||
}).catch((err) => { |
|
||||||
console.error('拨打电话失败:', err) |
|
||||||
}) |
|
||||||
} |
} |
||||||
|
|
||||||
// 去开台
|
const handleStartTable = (optionCode: number, available: boolean) => { |
||||||
const handleStartTable = (method: any) => { |
if (!available) { |
||||||
console.log('选择开台方式:', method) |
Taro.showToast({ title: '当前条件不满足，无法使用该开台方式', icon: 'none', duration: 2000 }) |
||||||
|
|
||||||
// 如果是自助开台，跳转到自助开台页面
|
|
||||||
if (method.id === 1) { |
|
||||||
Taro.navigateTo({ |
|
||||||
url: '/pageScan/selfStart/index' |
|
||||||
}) |
|
||||||
return |
|
||||||
} |
|
||||||
|
|
||||||
// 如果是定时开台，跳转到定时开台页面
|
|
||||||
if (method.id === 2) { |
|
||||||
Taro.navigateTo({ |
|
||||||
url: '/pageScan/timedStart/index' |
|
||||||
}) |
|
||||||
return |
return |
||||||
} |
} |
||||||
|
const url = OPTION_URL_MAP[optionCode] |
||||||
// 如果是团购券开台，跳转到团购券开台页面
|
if (url) { |
||||||
if (method.id === 4) { |
Taro.navigateTo({ url: `${url}?grpSn=${grpSn}` }) |
||||||
Taro.navigateTo({ |
} else { |
||||||
url: '/pageScan/couponStart/index' |
Taro.showToast({ title: '功能开发中', icon: 'none', duration: 2000 }) |
||||||
}) |
|
||||||
return |
|
||||||
} |
} |
||||||
|
|
||||||
// 其他方式暂时提示功能开发中
|
|
||||||
Taro.showToast({ |
|
||||||
title: '功能开发中', |
|
||||||
icon: 'none', |
|
||||||
duration: 2000 |
|
||||||
}) |
|
||||||
} |
} |
||||||
|
|
||||||
|
const price = scanInfo?.price |
||||||
|
const tableInfo = scanInfo?.tableInfo |
||||||
|
const openOptions = scanInfo?.openOptions || [] |
||||||
|
|
||||||
return ( |
return ( |
||||||
<View className="start-table-page"> |
<View className="start-table-page"> |
||||||
{/* 内容区域 */} |
|
||||||
<View className="content-area"> |
<View className="content-area"> |
||||||
{/* 台球桌信息卡片 */} |
{/* 台球桌信息卡片 */} |
||||||
<View className="table-card"> |
<View className="table-card"> |
||||||
{/* 顶部：店名和电话 */} |
|
||||||
<View className="card-header"> |
<View className="card-header"> |
||||||
<Text className="store-name">北京黑八大师联盟球厅店</Text> |
<Text className="store-name">{scanInfo?.shopName || '--'}</Text> |
||||||
<View className="phone-box" onClick={handlePhoneCall}> |
<View className="phone-box" onClick={handlePhoneCall}> |
||||||
<Image className="phone-icon" src={phoneIcon} mode="aspectFit" /> |
<Image className="phone-icon" src={phoneIcon} mode="aspectFit" /> |
||||||
<Text className="phone-text">联系店长</Text> |
<Text className="phone-text">联系店长</Text> |
||||||
</View> |
</View> |
||||||
</View> |
</View> |
||||||
|
|
||||||
{/* 台球桌标题 */} |
|
||||||
<View className="table-title"> |
<View className="table-title"> |
||||||
<Text>[中式台球]来力.山岩-A03/3号球桌</Text> |
<Text>{tableInfo?.name || '--'}</Text> |
||||||
</View> |
</View> |
||||||
|
|
||||||
{/* 价格信息 */} |
|
||||||
<View className="price-info"> |
<View className="price-info"> |
||||||
<View className="price-item"> |
<View className="price-item"> |
||||||
<Text className="price-value">¥28.80</Text> |
<Text className="price-value">¥{price ? price.currentPrice.toFixed(2) : '--'}</Text> |
||||||
<Text className="price-label">/小时</Text> |
<Text className="price-label">/小时</Text> |
||||||
</View> |
</View> |
||||||
<View className="price-item"> |
<View className="price-item"> |
||||||
<Text className="price-label">押金</Text> |
<Text className="price-label">押金</Text> |
||||||
<Text className="price-value">¥100.00</Text> |
<Text className="price-value">¥{price ? price.deposit.toFixed(2) : '--'}</Text> |
||||||
</View> |
|
||||||
<View className="vip-price"> |
|
||||||
<Text className="vip-text">VIP ¥20.00</Text> |
|
||||||
</View> |
</View> |
||||||
|
{price && price.memberPrice > 0 && ( |
||||||
|
<View className="vip-price"> |
||||||
|
<Text className="vip-text">VIP ¥{price.memberPrice.toFixed(2)}</Text> |
||||||
|
</View> |
||||||
|
)} |
||||||
</View> |
</View> |
||||||
|
|
||||||
{/* 价格时段 */} |
|
||||||
<View className="time-period"> |
<View className="time-period"> |
||||||
<Text>价格时段：00:00-24:00</Text> |
<Text>价格时段：{price?.pricePeriod || '--'}</Text> |
||||||
</View> |
</View> |
||||||
</View> |
</View> |
||||||
|
|
||||||
{/* 开台方式列表 */} |
{/* 开台方式列表 */} |
||||||
<View className="methods-list"> |
<View className="methods-list"> |
||||||
{startTableMethods.map((method) => ( |
{openOptions.length > 0 ? ( |
||||||
<View key={method.id} className="method-item"> |
openOptions.map((option, index) => ( |
||||||
<View className="method-left"> |
<View key={index} className={`method-item ${!option.available ? 'disabled' : ''}`}> |
||||||
<Text className="method-title">{method.title}</Text> |
<View className="method-left"> |
||||||
<Text className="method-desc">{method.description}</Text> |
<Text className="method-title">{option.title}</Text> |
||||||
</View> |
<Text className="method-desc">{option.description}</Text> |
||||||
<View className="method-right"> |
{!option.available && option.condition && ( |
||||||
<View |
<Text className="method-condition">{option.condition}</Text> |
||||||
className="start-btn" |
)} |
||||||
onClick={() => handleStartTable(method)} |
</View> |
||||||
> |
<View className="method-right"> |
||||||
<Text className="btn-text">去开台</Text> |
<View |
||||||
|
className={`start-btn ${!option.available ? 'disabled' : ''}`} |
||||||
|
onClick={() => handleStartTable(option.optionCode, option.available)} |
||||||
|
> |
||||||
|
<Text className="btn-text">{option.available ? option.actionText || '去开台' : '不可用'}</Text> |
||||||
|
</View> |
||||||
</View> |
</View> |
||||||
</View> |
</View> |
||||||
|
)) |
||||||
|
) : ( |
||||||
|
// 接口数据未加载时显示占位
|
||||||
|
<View className="method-item"> |
||||||
|
<Text className="method-desc">加载中...</Text> |
||||||
</View> |
</View> |
||||||
))} |
)} |
||||||
</View> |
</View> |
||||||
</View> |
</View> |
||||||
</View> |
</View> |
||||||
) |
) |
||||||
} |
}) |
||||||
|
|
||||||
export default StartTable |
export default StartTable |
||||||
|
|||||||
Loading…
Reference in new issue