wangxiaowei/chazhi_h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善接口

Browse Source
This commit is contained in:
wangxiaowei
2025-11-03 18:36:50 +08:00
parent 3465804793
commit ac8212c8f0
19 changed files with 845 additions and 352 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/api/order.ts Normal file
View File

@ -0,0 +1,42 @@
import { http } from '@/http/alova'
import type { IOrderListResult, IOrderDetailsResult } from '@/api/types/order'
/**
* 获取订单列表
*/
export interface ITeaSpecialistOrderListParams {
page: number
size: number
order_status: string
search: string
}
export function getTeaSpecialistOrderList(data: ITeaSpecialistOrderListParams) {
return http.Post<IOrderListResult>('/api/order/orderList',
data
)
}
/**
* 获取订单详情
*/
export interface ITeaSpecialistOrderDetailsParams {
id: number
}
export function getTeaSpecialistOrderDetails(data: ITeaSpecialistOrderDetailsParams) {
return http.Post<IOrderDetailsResult>('/api/order/orderDetails',
data
)
}
/**
* 取消订单
*/
export interface ICancelTeaSpecialistOrderParams {
id: number
}
export function cancelTeaSpecialistOrder(data: ICancelTeaSpecialistOrderParams) {
return http.Post('/api/order/cancelOrder',
data
)
}

101
src/api/tea.ts
View File

@ -1,5 +1,12 @@
import { http } from '@/http/alova' import { http } from '@/http/alova'
import type { ITeaSpecialistDetailsResult, ITeaSpecialistFuture7DaysResult, ITeaTypeListResult, ICollectTeaSpecialistResult } from '@/api/types/tea' import type {
ITeaSpecialistDetailsResult,
ITeaSpecialistFuture7DaysResult,
ITeaTypeListResult,
ICollectTeaSpecialistResult,
ICreateTeaSpecialistOrderResult,
ITeaSpecialistOrderDetailsResult,
ITeaSpecialistPrepayResult } from '@/api/types/tea'
/** /**
* 获取茶艺师详情 * 获取茶艺师详情
@ -44,7 +51,6 @@ export function getTeaSpecialistRewardAmounts() {
/** /**
* 获取门店地址 * 获取门店地址
*/ */
export interface ITeaHouseListParams { export interface ITeaHouseListParams {
page: number page: number
size: number size: number
@ -84,3 +90,94 @@ export interface IGetCollectTeaSpecialistParams {
export function getCollect(data: IGetCollectTeaSpecialistParams) { export function getCollect(data: IGetCollectTeaSpecialistParams) {
return http.Post<ICollectTeaSpecialistResult>('/api/Teamaster/teamasterCollectList', data) return http.Post<ICollectTeaSpecialistResult>('/api/Teamaster/teamasterCollectList', data)
} }
/**
* 茶艺师邀约
*/
export interface ITeaSpecialistInviteParams {
id: number
}
export function teaSpecialistInvite(data: ITeaSpecialistInviteParams) {
return http.Post('/api/Teamaster/invitation', data)
}
/**
* 创建预约茶艺师订单
*/
export interface ICreateTeaSpecialistOrderParams {
teamaster_id: number
address_id: number
start_time: number
end_time: number
nums: number
tea_id: string
service_type: number
store_id: number
latitude: number
longitude: number
remark: string
coupon_id: number
hours: number
}
export function createTeaSpecialistOrder(data: ICreateTeaSpecialistOrderParams) {
return http.Post<ICreateTeaSpecialistOrderResult>('/api/order/submitOrder', data)
}
/***
* 获取订单详情
*/
export interface IGetTeaSpecialistOrderDetailsParams {
id: number
}
export function getTeaSpecialistOrderDetails(data: IGetTeaSpecialistOrderDetailsParams) {
return http.Post<ITeaSpecialistOrderDetailsResult>('/api/order/orderDetails', data)
}
/**
* 预支付
*/
export interface ITeaSpecialistPrepayParams {
order_id: number
from: string
pay_way: number
order_source: number
}
export function teaSpecialistPrepay(data: ITeaSpecialistPrepayParams) {
return http.Post<ITeaSpecialistPrepayResult>('/api/pay/prepay', data)
}
/**
* 支付接口
*/
export interface ITeaSpecialistPayParams {
id: number
}
export function teaSpecialistPay(data: ITeaSpecialistPayParams) {
return http.Post('/api/pay/yuePay', data)
}
/**
* 团体预约
*/
export interface ITeaSpecialistGroupReserveParams {
numbers: string
other_require: string
res_time: string
contact: string
phone: string
code: string
province: string
city: string
district: string
address: string
content: string
}
export function teaSpecialistGroupReserve(data: ITeaSpecialistGroupReserveParams) {
return http.Post('/api/Teamaster/groupReservation', data)
}

17
src/api/types/order.ts Normal file
View File

@ -0,0 +1,17 @@
/**
* 订单列表返回数据
*/
export interface IOrderListResult {
count: number
list: Array<any>
more: number
page: string
size: string
}
/**
* 订单详情返回数据
*/
export interface IOrderDetailsResult {
details: any
}

32
src/api/types/tea.ts
View File

@ -9,6 +9,7 @@ export interface ITeaSpecialistDetailsResult {
* 茶艺师详情字段 * 茶艺师详情字段
*/ */
export interface ITeaSpecialistDetailsFields { export interface ITeaSpecialistDetailsFields {
id: 0,
name: string name: string
star: number star: number
image: string image: string
@ -27,6 +28,7 @@ export interface ITeaSpecialistDetailsFields {
price: number price: number
fare_price: number fare_price: number
collect: number collect: number
up_status: number
} }
/** /**
@ -79,3 +81,33 @@ export interface ICollectTeaSpecialistResult {
page: string page: string
size: string size: string
} }
/**
* 创建订单返回id
*/
export interface ICreateTeaSpecialistOrderResult {
id: number
}
/**
* 订单详情返回结果
*/
export interface ITeaSpecialistOrderDetailsResult {
details: {
order_amount: string
order_sn: string
}
}
/**
* 预支付返回结果
*/
export interface ITeaSpecialistPrepayResult {
pay_id: number
}
/**
* 支付返回结果
*/
export interface ITeaSpecialistPayResult {
}

4
src/bundle/coupon/coupon.vue
View File

@ -91,9 +91,9 @@
couponType.value = args.type couponType.value = args.type
} }
if (args.id && args.time) { if (args.id && args.numbers) {
// 获取到茶艺师ID和预定了几个小时 // 获取到茶艺师ID和预定了几个小时
Coupons.handleInit(args.id, args.time) Coupons.handleInit(args.id, args.numbers)
} }
}) })

128
src/bundle/order/tea-specialist/order-detail.vue
View File

@ -40,7 +40,7 @@
<view v-for="item in teaList" :key="item.id" <view v-for="item in teaList" :key="item.id"
class="h-110rpx rounded-16rpx flex flex-col items-center justify-center text-28rpx leading-40rpx" class="h-110rpx rounded-16rpx flex flex-col items-center justify-center text-28rpx leading-40rpx"
:class="selectedRenewTea.includes(item.id) ? 'bg-[#4C9F44] text-[#fff]' : 'bg-[#F7F7F7] text-[#606266]'" :class="selectedRenewTea.includes(item.id) ? 'bg-[#4C9F44] text-[#fff]' : 'bg-[#F7F7F7] text-[#606266]'"
@click="orderDetail.handleToggleRenewTea(item.id)"> @click="OrderDetail.handleToggleRenewTea(item.id)">
<view>{{item.title}}</view> <view>{{item.title}}</view>
<view>{{item.price}}</view> <view>{{item.price}}</view>
</view> </view>
@ -116,7 +116,7 @@
<view class="mt-54rpx text-32rpx leading-44rpx flex items-center justify-center leading-80rpx text-center"> <view class="mt-54rpx text-32rpx leading-44rpx flex items-center justify-center leading-80rpx text-center">
<view class="w-240rpx h-80rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="showRefundRule = false">取消</view> <view class="w-240rpx h-80rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="showRefundRule = false">取消</view>
<view class="w-240rpx h-80rpx bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="orderDetail.handleConfirmRefund">确定退款</view> <view class="w-240rpx h-80rpx bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="OrderDetail.handleConfirmRefund">确定退款</view>
</view> </view>
</view> </view>
</wd-popup> </wd-popup>
@ -206,54 +206,53 @@
</view> </view>
</wd-popup> </wd-popup>
<!-- 平台团购直营店 -->
<view> <view>
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar> <navbar :title="title" custom-class='!bg-[#F6F7F8]' :leftArrow="false"></navbar>
</view> </view>
<view class="text-[#909399] text-26rpx leading-36rpx mb-40rpx"> <view class="text-[#909399] text-26rpx leading-36rpx mb-40rpx">
<view class="ml-80rpx" v-if="orderStatus === OrderStatus.Consuming || orderStatus === OrderStatus.Reserved || orderStatus === OrderStatus.Serving">使用过程中有任何问题，请联系客服</view> <view class="ml-80rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Serving || orderStatus == TeaSpecialistOrderStatus.Pay">使用过程中有任何问题，请联系客服</view>
<view class="flex items-center justify-center" v-if="orderStatus === OrderStatus.Pending"> <view class="flex items-center justify-center" v-if="orderStatus == TeaSpecialistOrderStatus.Pending">
<view class="flex items-center mr-6rpx"> <view class="flex items-center mr-6rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_time.png`"/> <wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_time.png`"/>
</view> </view>
<view class="flex items-center text-26rpx leading-36rpx text-[#909399]"> <view class="flex items-center text-26rpx leading-36rpx text-[#909399]">
<view>还剩</view> <view>还剩</view>
<view class="mx-6rpx"> <view class="mx-6rpx">
<wd-count-down :time="time" custom-class="!text-[#FF5951]" /> <wd-count-down :time="order.time1" custom-class="!text-[#FF5951]" />
</view> </view>
<view>订单自动取消</view> <view>订单自动取消</view>
</view> </view>
</view> </view>
<view class="ml-80rpx" v-if="orderStatus === OrderStatus.Finished">品一口香茗，让生活慢下来，从一杯好茶开始</view> <view class="ml-80rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Finished">感谢您的选择，期待再续茶香！</view>
<view class="ml-80rpx" v-if="orderStatus === OrderStatus.Confirm">您的服务已经结束，请及时确认订单</view> <view class="ml-80rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Confirm">您的服务已经结束，请及时确认订单</view>
</view> </view>
<!-- 信息模块 --> <!-- 信息模块 -->
<view class="mx-30rpx coupon-bg" > <view class="mx-30rpx coupon-bg" >
<view class="flex items-center px-30rpx pt-30rpx pb-40rpx"> <view class="flex items-center px-30rpx pt-30rpx pb-40rpx">
<view class="mr-30rpx"> <view class="mr-30rpx">
<wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img> <wd-img width="190rpx" height="190rpx" :src="order.teamaster.image" mode="scaleToFill"></wd-img>
</view> </view>
<view class="flex-1"> <view class="flex-1">
<view class="flex justify-between items-center"> <view class="flex justify-between items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1 w-300rpx"> <view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx line-1 w-300rpx">
茶艺师名称 {{ order.teamaster.name }}
<wd-icon name="chevron-right" size="32rpx"></wd-icon> <wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view> </view>
<view class="text-26rpx leading-36rpx text-[#909399]">￥324</view> <view class="text-26rpx leading-36rpx text-[#909399]">￥{{ order.order_amount }}</view>
</view> </view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx"> <view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view>￥108/小时</view> <view>￥{{ order.teamaster.price }}/小时</view>
<view>x3</view> <view>x{{ order.hours }}</view>
</view> </view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx"> <view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view>车马费（￥3.00元/公里）</view> <view>车马费（￥{{ order.fare_price }}元/公里）</view>
<view>x3</view> <view>￥{{ order.fare_distance_price }}/小时</view>
</view> </view>
<view class="text-[#606266] text-right mt-26rpx" v-if="orderStatus !== OrderStatus.Pending"> <view class="text-[#606266] text-right mt-26rpx" v-if="orderStatus !== TeaSpecialistOrderStatus.Pending">
<text class="text-24rpx leading-34rpx mr-12rpx">实付</text> <text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
<text class="tetx-32rpx leading-36rpx">￥29.32</text> <text class="tetx-32rpx leading-36rpx">￥{{ order.order_amount }}</text>
<wd-icon name="chevron-right" size="32rpx"></wd-icon> <wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view> </view>
</view> </view>
@ -262,11 +261,11 @@
<view class="mt-28rpx pb-28rpx"> <view class="mt-28rpx pb-28rpx">
<view class="text-30rpx leading-42rpx text-[#303133] px-30rpx">预约信息</view> <view class="text-30rpx leading-42rpx text-[#303133] px-30rpx">预约信息</view>
<view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx"> <view class="font-500 text-26rpx leading-48rpx text-[#606266] mt-20rpx">
<view class="mb-20rpx px-30rpx">预约时间：2025-03-18 09:00-12:00</view> <view class="mb-20rpx px-30rpx">预约时间：{{ order.start_time }} - {{ order.end_time }}</view>
<view class="flex justify-between items-center pl-30rpx"> <view class="flex justify-between items-center pl-30rpx">
<view>预约时长：3小时</view> <view>预约时长：3小时</view>
<view <view
v-if="orderStatus === OrderStatus.Reserved || orderStatus === OrderStatus.Consuming" v-if="orderStatus == TeaSpecialistOrderStatus.Reserved || orderStatus == TeaSpecialistOrderStatus.Consuming"
class="bg-[#4C9F44] rounded-[100rpx_0rpx_0rpx_100rpx] font-bold text-28rpx leading-40rpx text-[#fff] w-170rpx h-56rpx flex justify-center items-center" class="bg-[#4C9F44] rounded-[100rpx_0rpx_0rpx_100rpx] font-bold text-28rpx leading-40rpx text-[#fff] w-170rpx h-56rpx flex justify-center items-center"
@click="showRenewPopup = true">一键续订</view> @click="showRenewPopup = true">一键续订</view>
</view> </view>
@ -275,7 +274,7 @@
</view> </view>
<!-- 地图显示 --> <!-- 地图显示 -->
<view class="mx-30rpx mt-20rpx bg-white rounded-16rpx" v-if="orderStatus === OrderStatus.Serving || orderStatus === OrderStatus.Reserved"> <view class="mx-30rpx mt-20rpx bg-white rounded-16rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Serving || orderStatus == TeaSpecialistOrderStatus.Reserved">
<view class="px-30rpx"> 地图显示</view> <view class="px-30rpx"> 地图显示</view>
<view class="px-30rpx flex justify-between items-center"> <view class="px-30rpx flex justify-between items-center">
<view class="font-500 text-24rpx text-[#909399] leading-42rpx">信息没有更新，想问问茶艺师到哪里了？</view> <view class="font-500 text-24rpx text-[#909399] leading-42rpx">信息没有更新，想问问茶艺师到哪里了？</view>
@ -298,14 +297,14 @@
<view> <view>
<view class="text-28rpx leading-40rpx flex items-center mt-22rpx"> <view class="text-28rpx leading-40rpx flex items-center mt-22rpx">
<view class="text-[#606266] mr-54rpx">服务方式</view> <view class="text-[#606266] mr-54rpx">服务方式</view>
<view class="text-[#303133]">到店服务</view> <view class="text-[#303133]">{{ order.service_type }}</view>
</view> </view>
<view class="text-28rpx leading-40rpx flex items-center mt-22rpx" v-if="orderStatus !== OrderStatus.Pending"> <view class="text-28rpx leading-40rpx flex items-center mt-22rpx" v-if="orderStatus !== TeaSpecialistOrderStatus.Pending">
<view class="text-[#606266] mr-54rpx">服务门店</view> <view class="text-[#606266] mr-54rpx">服务门店</view>
<view class="text-[#303133] line-1 w-300rpx">茶馆名称茶馆名称茶馆名称茶馆名称茶馆名称茶馆名称茶馆名称</view> <view class="text-[#303133] line-1 w-300rpx">{{ order.store_address }}</view>
</view> </view>
<view class="text-28rpx leading-40rpx flex items-center mt-22rpx"> <view class="text-28rpx leading-40rpx flex items-center mt-22rpx">
<view class="text-[#606266] mr-54rpx"> {{ orderStatus === OrderStatus.Serving ? '门店地址' : '服务地址' }}</view> <view class="text-[#606266] mr-54rpx"> {{ orderStatus === TeaSpecialistOrderStatus.Serving ? '门店地址' : '服务地址' }}</view>
<view class="text-[#303133]">青浦区仓桥路478号</view> <view class="text-[#303133]">青浦区仓桥路478号</view>
</view> </view>
</view> </view>
@ -313,7 +312,7 @@
<view class="text-center mr-20rpx" > <view class="text-center mr-20rpx" >
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_nav.png`"/> <wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_nav.png`"/>
</view> </view>
<view class="text-center" v-if="orderStatus === OrderStatus.Serving"> <view class="text-center" v-if="orderStatus === TeaSpecialistOrderStatus.Serving">
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_phone.png`"/> <wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_phone.png`"/>
</view> </view>
</view> </view>
@ -322,7 +321,7 @@
</view> </view>
<!-- 支付方式 --> <!-- 支付方式 -->
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" v-if="orderStatus === OrderStatus.Pending"> <view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Pending">
<wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44"> <wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44">
<block v-for="(item, index) in PayList" :key="index"> <block v-for="(item, index) in PayList" :key="index">
<view <view
@ -336,7 +335,7 @@
</view> </view>
<view class="flex items-center"> <view class="flex items-center">
<wd-radio :value="item.value"> <wd-radio :value="item.value">
<view class="text-[#303133] text-26rpx leading-36rpx mr-20rpx" v-if="item.type !== PayCategory.WeChatPay">可用202.22</view> <view class="text-[#303133] text-26rpx leading-36rpx mr-20rpx" v-if="item.type != PayCategory.WeChatPay">可用202.22</view>
</wd-radio> </wd-radio>
</view> </view>
</view> </view>
@ -350,22 +349,22 @@
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx"> <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>订单编号</view> <view>订单编号</view>
<view> <view>
<text>7327328627526903</text> <text>{{ order.order_sn }}</text>
<wd-divider vertical /> <wd-divider vertical />
<text class="text-[#4C9F44]">复制</text> <text class="text-[#4C9F44]" @click="OrderDetail.handleCopy(order.order_sn)">复制</text>
</view> </view>
</view> </view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus !== OrderStatus.Pending"> <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus != TeaSpecialistOrderStatus.Pending">
<view>交易方式</view> <view>交易方式</view>
<view>微信支付</view> <view>{{ PayValueText[order.pay_way] }}</view>
</view> </view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx"> <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>创建时间</view> <view>创建时间</view>
<view>2019-05-16 12:20:26</view> <view>{{ order.dtime }}</view>
</view> </view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus !== OrderStatus.Pending"> <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderStatus != TeaSpecialistOrderStatus.Pending">
<view>付款时间</view> <view>付款时间</view>
<view>2019-05-16 13:20:26</view> <view>{{ order.update_dtime }}</view>
</view> </view>
</view> </view>
@ -373,15 +372,15 @@
<view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx"> <view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx">
<view class="mt-34rpx"> <view class="mt-34rpx">
<!-- 预约单、服务中 --> <!-- 预约单、服务中 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderStatus === OrderStatus.Serving || orderStatus === OrderStatus.Confirm"> <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderStatus === TeaSpecialistOrderStatus.Serving || orderStatus == TeaSpecialistOrderStatus.Confirm">
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="orderDetail.handleAgainReeserve">再次预定</view> <view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="OrderDetail.handleAgainReeserve">再次预定</view>
<view class="w-330rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="orderDetail.handleConfirmOrder">确认订单</view> <view class="w-330rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]" @click="OrderDetail.handleConfirmOrder">确认订单</view>
</view> </view>
<!-- 待付款 --> <!-- 待付款 -->
<view class="flex items-center justify-between mx-58rpx mt-34rpx" v-if="orderStatus === OrderStatus.Pending"> <view class="flex items-center justify-between mx-58rpx mt-34rpx" v-if="orderStatus == TeaSpecialistOrderStatus.Pending">
<view class="flex items-center"> <view class="flex items-center">
<view class="text-28rpx leading-40rpx text-[#606266] mr-16rpx" @click="orderDetail.handleCancelOrder">取消</view> <view class="text-28rpx leading-40rpx text-[#606266] mr-16rpx" @click="OrderDetail.handleCancelOrder">取消</view>
<view class="flex items-center"> <view class="flex items-center">
<view class="mr-16rpx mt-[-8rpx]"> <view class="mr-16rpx mt-[-8rpx]">
<price-format color="#FF5951" :first-size="40" :second-size="40" :subscript-size="28" :price="23.02"></price-format> <price-format color="#FF5951" :first-size="40" :second-size="40" :subscript-size="28" :price="23.02"></price-format>
@ -396,14 +395,14 @@
</view> </view>
<!-- 已预约 --> <!-- 已预约 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderStatus === OrderStatus.Reserved"> <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center" v-if="orderStatus == TeaSpecialistOrderStatus.Reserved">
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="showRefundRule = true">申请退款</view> <view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133] mr-30rpx" @click="showRefundRule = true">申请退款</view>
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133]" @click="orderDetail.handleService">联系客服</view> <view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx text-[#303133]" @click="OrderDetail.handleService">联系客服</view>
</view> </view>
<!-- 交易完成 --> <!-- 交易完成 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center mt-34rpx" <view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center mt-34rpx"
v-if="orderStatus === OrderStatus.Finished || orderStatus === OrderStatus.Cancelled"> v-if="orderStatus == TeaSpecialistOrderStatus.Finished || orderStatus == TeaSpecialistOrderStatus.Cancelled">
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">再次预定</view> <view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">再次预定</view>
</view> </view>
</view> </view>
@ -413,15 +412,16 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { OrderStatusTitle, OrderStatus, OrderSource } from '@/utils/order' import { OrderStatusTitle, OrderStatus, OrderSource, TeaSpecialistOrderStatusTextValue, TeaSpecialistOrderStatus } from '@/utils/order'
import { getTeaSpecialistOrderDetails } from '@/api/order'
import { toast } from '@/utils/toast' import { toast } from '@/utils/toast'
import { useMessage } from 'wot-design-uni' import { useMessage } from 'wot-design-uni'
import { PayList, PayCategory, PayValue } from '@/utils/pay' import { PayList, PayCategory, PayValue, PayValueText } from '@/utils/pay'
const OSS = inject('OSS') const OSS = inject('OSS')
const title = ref<string>('') const title = ref<string>('')
const orderStatus = ref<string>('') // 订单状态：待使用、退款等 const orderStatus = ref<number>(0) // 订单状态：待使用、退款等
const showRefundRule = ref<boolean>(false) // 退款规则弹窗 const showRefundRule = ref<boolean>(false) // 退款规则弹窗
// 订单倒计时取消 // 订单倒计时取消
@ -470,17 +470,29 @@
{id: 5, title: '红茶(3泡)', price: '￥128.00'}, {id: 5, title: '红茶(3泡)', price: '￥128.00'},
] ]
const selectedRenewTea = ref<Array<any>>([]) // 选择的续订时间 const selectedRenewTea = ref<Array<any>>([]) // 选择的续订时间
const showRenewSuccessPopup = ref<boolean>(false) const showRenewSuccessPopup = ref<boolean>(false)
/** 结束 **/
onLoad((args) => { // 订单ID
title.value = OrderStatusTitle[OrderSource.TeaSpecialist][args.orderStatus] || '订单详情' const orderId = ref<number>(0)
orderStatus.value = args.orderStatus const order = ref<any>({})
onLoad(async (args) => {
orderId.value = args.orderId
// 获取订单详情
OrderDetail.handleInit()
}) })
const orderDetail = { const OrderDetail = {
// 获取订单详情
handleInit: async () => {
const res = await getTeaSpecialistOrderDetails({id: orderId.value})
const data = res.details
order.value = data
title.value = TeaSpecialistOrderStatusTextValue[data.order_status].title || '订单详情'
orderStatus.value = data.order_status
},
// 确认订单 // 确认订单
handleConfirmOrder: () => { handleConfirmOrder: () => {
message.confirm({ message.confirm({
@ -547,6 +559,16 @@
handleService: () => { handleService: () => {
}, },
handleCopy: (text: string) => {
uni.setClipboardData({
data: text,
success: () => {
toast.info('复制成功')
}
})
}
} }
</script> </script>

133
src/bundle/order/tea-specialist/order-list.vue
View File

@ -8,25 +8,22 @@
<template> <template>
<view class=""> <view class="">
<view class="order-list sticky top-0 left-0 z-50 bg-[#F6F7F8] pb-10rpx"> <view class="order-list sticky top-0 left-0 z-50 bg-[#F6F7F8] pb-10rpx">
<wd-navbar safeAreaInsetTop custom-class='!bg-[#F6F7F8]' :bordered="false" placeholder @click-left="orderList.handleBack"> <wd-navbar safeAreaInsetTop custom-class='!bg-[#F6F7F8]' :bordered="false" placeholder :leftArrow="false">
<template #left> <template #left>
<view class="h-48rpx flex items-center"> <view class="h-48rpx flex items-center w-[100%]">
<view class="mt-4rpx"> <view class="search-box w-[100%]">
<wd-icon name="thin-arrow-left" size="30rpx"></wd-icon> <wd-search v-model="keywords" placeholder-left light placeholder="搜索茶室订单"></wd-search>
</view>
<view class="search-box">
<wd-search v-model="keywords" hide-cancel placeholder-left light placeholder="搜索茶室订单"></wd-search>
</view> </view>
</view> </view>
</template> </template>
</wd-navbar> </wd-navbar>
<view class="tabs"> <view class="tabs">
<wd-tabs v-model="tab" swipeable slidable="always" :lazy="false" @click="orderList.handleChangeTabs"> <wd-tabs v-model="tab" swipeable slidable="always" :lazy="false" @click="orderList.handleChangeTabs">
<wd-tab title="全部" name="all"></wd-tab> <wd-tab title="全部" :name="TeaSpecialistOrderStatusText.All"></wd-tab>
<wd-tab title="待付款" :name="OrderStatus.Pending"></wd-tab> <wd-tab title="待付款" :name="TeaSpecialistOrderStatusText.Pending"></wd-tab>
<wd-tab title="预约单" :name="OrderStatus.Reserved"></wd-tab> <wd-tab title="预约单" :name="TeaSpecialistOrderStatusText.Pay"></wd-tab>
<wd-tab title="待确认" :name="OrderStatus.Confirm"></wd-tab> <wd-tab title="待确认" :name="TeaSpecialistOrderStatusText.Confirm"></wd-tab>
<wd-tab title="已完结" :name="OrderStatus.Finished"></wd-tab> <wd-tab title="已完结" :name="TeaSpecialistOrderStatusText.Finished"></wd-tab>
</wd-tabs> </wd-tabs>
</view> </view>
</view> </view>
@ -34,37 +31,37 @@
<view class="tabs mt-18rpx mx-30rpx"> <view class="tabs mt-18rpx mx-30rpx">
<!-- 这里可以尝试下不重新刷新获取列表 --> <!-- 这里可以尝试下不重新刷新获取列表 -->
<!-- 全部 --> <!-- 全部 -->
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" v-if="tab === 'all'"> <mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" :down="downOption" :up="upOption" v-if="tab === 'all'">
<view class="mb-20rpx" v-for="(item, index) in 10" :key="index"> <view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order-status="OrderStatus.Pending"></combo-card> <combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view> </view>
</mescroll-body> </mescroll-body>
<!-- 待付款 --> <!-- 待付款 -->
<mescroll-body ref="mescrollItem1" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" v-if="tab === OrderStatus.Pending"> <mescroll-body ref="mescrollItem1" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" :down="downOption" :up="upOption" v-if="tab === OrderStatus.Pending">
<view class="mb-20rpx" v-for="(item, index) in 10" :key="index"> <view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order-status="OrderStatus.Pending"></combo-card> <combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view> </view>
</mescroll-body> </mescroll-body>
<!-- 预约单 --> <!-- 预约单 -->
<mescroll-body ref="mescrollItem2" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" v-if="tab === OrderStatus.Reserved"> <mescroll-body ref="mescrollItem2" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" :down="downOption" :up="upOption" v-if="tab === OrderStatus.Reserved">
<view class="mb-20rpx" v-for="(item, index) in 10" :key="index"> <view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order-status="OrderStatus.Pending"></combo-card> <combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view> </view>
</mescroll-body> </mescroll-body>
<!-- 待确认 --> <!-- 待确认 -->
<mescroll-body ref="mescrollItem2" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" v-if="tab === OrderStatus.Confirm"> <mescroll-body ref="mescrollItem2" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" :down="downOption" :up="upOption" v-if="tab === OrderStatus.Confirm">
<view class="mb-20rpx" v-for="(item, index) in 10" :key="index"> <view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order-status="OrderStatus.Pending"></combo-card> <combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view> </view>
</mescroll-body> </mescroll-body>
<!-- 已完结 --> <!-- 已完结 -->
<mescroll-body ref="mescrollItem3" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" v-if="tab === OrderStatus.Finished"> <mescroll-body ref="mescrollItem3" @init="mescrollInit" @down="downCallback" @up="orderList.upCallback" v-if="tab === OrderStatus.Finished">
<view class="mb-20rpx" v-for="(item, index) in 10" :key="index"> <view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.TeaSpecialist" :order-status="OrderStatus.Pending"></combo-card> <combo-card :type="OrderSource.TeaSpecialist" :order="item"></combo-card>
</view> </view>
</mescroll-body> </mescroll-body>
</view> </view>
@ -74,17 +71,25 @@
<script lang="ts" setup> <script lang="ts" setup>
import { OrderSource, OrderStatus } from '@/utils/order' import { OrderSource, OrderStatus } from '@/utils/order'
import { getTeaSpecialistOrderList } from '@/api/order'
import ComboCard from '@/components/order/ComboCard.vue' import ComboCard from '@/components/order/ComboCard.vue'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app' import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js" import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
import { TeaSpecialistOrderStatusText, TeaSpecialistOrderStatusValue } from '@/utils/order'
/* mescroll */ /* mescroll */
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
const downOption = {
// 店铺类型 auto: true
}
// 搜索 const upOption = {
auto: true,
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
}
const list = ref<Array<any>>([]) // 茶艺师列表
const keywords = ref<string>('') const keywords = ref<string>('')
const orderStatus = ref<string>('')
// tab // tab
const tab = ref<string>('all') const tab = ref<string>('all')
@ -99,50 +104,36 @@
const orderList = { const orderList = {
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10 // 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
upCallback: (mescroll) => { upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容 const filter = {
// list({ page: mescroll.num,
// page: mescroll.num, size: mescroll.size,
// size: mescroll.size order_status: orderStatus.value,
// }).then((res: { list: Array<any>, totalPages: Number }) => { search: keywords.value
// const curPageData = res.list || [] // 当前页数据 }
// if(mescroll.num == 1) goods.value = []; // 第一页需手动制空列表 console.log('filter:', filter)
// goods.value = goods.value.concat(curPageData); //追加新数据
// console.log("🚀 ~ goods:", goods) getTeaSpecialistOrderList(filter).then((res) => {
const curPageData = res.list || [] // 当前页数据
// mescroll.endByPage(curPageData.length, res.totalPages); //必传参数(当前页的数据个数, 总页数) if(mescroll.num == 1) list.value = [] // 第一页需手动制空列表
list.value = list.value.concat(curPageData) //追加新数据
// }).catch(() => { mescroll.endSuccess(curPageData.length, Boolean(res.more))
// mescroll.endErr(); // 请求失败, 结束加载 }).catch(() => {
// }) mescroll.endErr() // 请求失败, 结束加载
// apiGoods(mescroll.num, mescroll.size).then(res=>{ })
// const curPageData = res.list || [] // 当前页数据
// if(mescroll.num == 1) goods.value = []; // 第一页需手动制空列表
// goods.value = goods.value.concat(curPageData); //追加新数据
// //联网成功的回调,隐藏下拉刷新和上拉加载的状态;
// //mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
// //方法一(推荐): 后台接口有返回列表的总页数 totalPage
// //mescroll.endByPage(curPageData.length, totalPage); //必传参数(当前页的数据个数, 总页数)
// //方法二(推荐): 后台接口有返回列表的总数据量 totalSize
// //mescroll.endBySize(curPageData.length, totalSize); //必传参数(当前页的数据个数, 总数据量)
// //方法三(推荐): 您有其他方式知道是否有下一页 hasNext
// //mescroll.endSuccess(curPageData.length, hasNext); //必传参数(当前页的数据个数, 是否有下一页true/false)
// //方法四 (不推荐),会存在一个小问题:比如列表共有20条数据,每页加载10条,共2页.如果只根据当前页的数据个数判断,则需翻到第三页才会知道无更多数据.
// mescroll.endSuccess(curPageData.length); // 请求成功, 结束加载
// }).catch(()=>{
mescroll.endErr(); // 请求失败, 结束加载
// })
}, },
// 切换tab // 切换tab
handleChangeTabs: (e: {index: number, name: string}) => { handleChangeTabs: (e: {index: number, name: string}) => {
tab.value = e.name tab.value = e.name
if (e.name === TeaSpecialistOrderStatusText.Pending) {
orderStatus.value = '0'
} else {
orderStatus.value = TeaSpecialistOrderStatusValue[e.name] || ''
}
// 切换tab时,重置当前的mescroll // 切换tab时,重置当前的mescroll
// getMescroll().resetUpScroll(); list.value = []
getMescroll().resetUpScroll();
}, },
// 返回上一页 // 返回上一页
@ -159,6 +150,14 @@
background-color: $cz-page-background; background-color: $cz-page-background;
} }
.order-list {
:deep() {
.wd-navbar__left {
width: 100%;
}
}
}
.tabs { .tabs {
:deep() { :deep() {
.wd-tabs, .wd-tabs,

36
src/components/BookingTime.vue
View File

@ -23,7 +23,7 @@
: selectedTime.includes(item2.start_time) : selectedTime.includes(item2.start_time)
? 'bg-[#F1F8F0] text-[#4C9F44]' // 选中高亮 ? 'bg-[#F1F8F0] text-[#4C9F44]' // 选中高亮
: 'bg-[#F7F7F7] text-[#303133]', // 可选高亮 : 'bg-[#F7F7F7] text-[#303133]', // 可选高亮
]" @click="item2.disabled == 1 && bookingTime.handleSelectTime(item2.start_time)"> ]" @click="item2.disabled == 1 && bookingTime.handleSelectTime(item2.start_time, item2.timestamp)">
{{ item2.start_time }} {{ item2.start_time }}
</view> </view>
</view> </view>
@ -79,48 +79,31 @@
// 初始化时间 // 初始化时间
onMounted(() => { onMounted(() => {
bookingTime.handleInitTime() // bookingTime.handleInitTime()
}) })
/** 日期相关 **/ /** 日期相关 **/
const timeList = [
{ time: '09:00', disabled: true },
{ time: '09:30', disabled: false },
{ time: '10:00', disabled: false },
{ time: '10:30', disabled: false },
{ time: '11:00', disabled: false },
{ time: '11:30', disabled: false },
]
const weekMap = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
const days = ref<string[]>([]) const days = ref<string[]>([])
const selectedDay = ref<number>(0) const selectedDay = ref<number>(0)
const selectedTime = ref<string[]>([]) const selectedTime = ref<string[]>([])
const selectedTimeStamp = ref<number[]>([])
const countSelectedTime = ref<number>(0) const countSelectedTime = ref<number>(0)
const bookingTime = { const bookingTime = {
// 初始化时间逻辑 // 初始化时间逻辑
handleInitTime: () => { handleInitTime: () => {
const today = new Date()
const result: string[] = []
for (let i = 0; i < 7; i++) {
const d = new Date(today)
d.setDate(today.getDate() + i)
const month = d.getMonth() + 1
const date = d.getDate()
const week = weekMap[d.getDay()]
result.push(`${month}/${date}${week}`)
}
days.value = result
console.log("🚀 ~ days.value:", days.value)
}, },
// 选择的时间高亮显示 // 选择的时间高亮显示
handleSelectTime: (time: string) => { handleSelectTime: (time: string, timestamp: number) => {
const idx = selectedTime.value.indexOf(time) const idx = selectedTime.value.indexOf(time)
if (idx > -1) { if (idx > -1) {
selectedTime.value.splice(idx, 1) // 取消选中 selectedTime.value.splice(idx, 1) // 取消选中
selectedTimeStamp.value.splice(idx, 1)
} else { } else {
selectedTime.value.push(time) // 选中 selectedTime.value.push(time) // 选中
selectedTimeStamp.value.push(timestamp)
} }
// 计算时长 // 计算时长
@ -142,7 +125,8 @@
const data = [ const data = [
selectedDay.value, selectedDay.value,
selectedTime.value selectedTime.value,
selectedTimeStamp.value.sort(),
] ]
emit('selectedTime', data) emit('selectedTime', data)
showPopup.value = false showPopup.value = false
@ -151,12 +135,14 @@
// 切换时间tab的时候把之前选中的时间重置 // 切换时间tab的时候把之前选中的时间重置
handleChangeTimeTab: () => { handleChangeTimeTab: () => {
selectedTime.value = [] selectedTime.value = []
selectedTimeStamp.value = []
countSelectedTime.value = 0 countSelectedTime.value = 0
}, },
// 重置选择的时间 // 重置选择的时间
resetSelectedTime: () => { resetSelectedTime: () => {
selectedTime.value = [] selectedTime.value = []
selectedTimeStamp.value = []
}, },
} }

81
src/components/order/ComboCard.vue
View File

@ -145,54 +145,63 @@
<view v-if="type === OrderSource.TeaSpecialist" class="bg-white rounded-10rpx p-28rpx"> <view v-if="type === OrderSource.TeaSpecialist" class="bg-white rounded-10rpx p-28rpx">
<view class="flex items-center"> <view class="flex items-center">
<view class="mr-28rpx"> <view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img> <wd-img width="200rpx" height="200rpx" :src="order.image"></wd-img>
</view> </view>
<view class="flex-1" @click="comboCard.handleToOrderDetail"> <view class="flex-1" @click="comboCard.handleToOrderDetail">
<view class="flex items-center relative"> <view class="flex items-center relative">
<view class="w-400rpx flex items-center"> <view class="w-400rpx flex items-center">
<view class="font-bold text-[#303133] text-30rpx leading-42rpx mr-14rpx">茶艺师</view> <view class="font-bold text-[#303133] text-30rpx leading-42rpx mr-14rpx">{{ order.name }}</view>
<view class="w-160rpx h-40rpx relative mr-44rpx"> <view class="">
<view class="absolute left-0 top-0 h-36rpx flex items-start"> <tea-specialist-level :level="TeaSpecialistLevelValue[order.teamasterLevel[0].level_name]"></tea-specialist-level>
<wd-img :src="`${OSS}icon/icon_gold_medal.png`" width="36rpx" height="36rpx"></wd-img>
</view>
<view class="bg-[#F0F6EF] text-[#006C2D] font-400 text-22rpx leading-32rpx rounded-4rpx text-center w-150rpx ml-18rpx pb-4rpx">金牌茶艺师</view>
</view> </view>
</view> </view>
<view class="font-400 text-28rpx leading-20rpx text-[#4C9F44] flex items-center absolute top-6rpx right-0"> <view class="font-400 text-28rpx leading-20rpx text-[#4C9F44] flex items-center absolute top-6rpx right-0">
<text v-if="orderStatus === OrderStatus.Consuming">消费中</text> <text v-if="order.order_status === TeaSpecialistOrderStatus.Pending" class="text-[#FF5951]" >待付款</text>
<text v-if="orderStatus === OrderStatus.Reserved">已预约</text> <text v-if="order.order_status === TeaSpecialistOrderStatus.Pay">已预约</text>
<text v-if="orderStatus === OrderStatus.Serving">服务中</text> <text v-if="order.order_status === TeaSpecialistOrderStatus.Serving">服务中</text>
<text v-if="orderStatus === OrderStatus.Finished" class="text-[#606266]">完成</text> <text v-if="order.order_status === TeaSpecialistOrderStatus.Confirm" class="text-[#F29747]">待确认</text>
<text v-if="orderStatus === OrderStatus.Pending" class="text-[#FF5951]" >待付款</text> <text v-if="order.order_status === TeaSpecialistOrderStatus.Finished" class="text-[#606266]">完成</text>
<text v-if="orderStatus === OrderStatus.Cancelled" class="text-[#C9C9C9]" >订单取消</text> <text v-if="order.order_status === TeaSpecialistOrderStatus.Cancelled" class="text-[#C9C9C9]" >订单取消</text>
</view> </view>
</view> </view>
<view class="flex items-center"> <view class="flex items-center">
<view class="mr-12rpx"> <template v-for="(label, labelIndex) in order.teamasterlabel" :key="labelIndex">
<wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">上门服务</wd-tag> <!-- 上门服务 -->
<view class="mr-12rpx" v-if="label.id == 1">
<wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">{{ label.label_name }}</wd-tag>
</view> </view>
<view>
<wd-tag color="#F55726" bg-color="#F55726" plain>到点服务</wd-tag> <!-- 到点服务 -->
<view class="mr-12rpx" v-if="label.id == 2">
<wd-tag color="#F55726" bg-color="#F55726" plain custom-class="!rounded-4rpx">{{ label.label_name }}</wd-tag>
</view>
</template>
<view class="mr-12rpx">
<wd-tag color="#818CA9" bg-color="#F3F3F3">{{ order.both }}</wd-tag>
</view>
<view class="flex items-center mt-8rpx">
<wd-img :src="order.sex == 1 ? `${OSS}icon/icon_man.png` : `${OSS}icon/icon_woman.png`" width="28rpx" height="28rpx"></wd-img>
</view> </view>
</view> </view>
<view class="font-400 text-[#606266] text-26rpx leading-36rpx mt-42rpx"> <view class="font-400 text-[#606266] text-26rpx leading-36rpx mt-42rpx">
预约时间：03/18 08:00-12:00 预约时间：{{ order.start_time }} - {{ order.end_time }}
</view> </view>
</view> </view>
</view> </view>
<!-- 操作按钮 --> <!-- 操作按钮 -->
<view> <view>
<view v-if="orderStatus === OrderStatus.Finished || orderStatus === OrderStatus.Cancelled" <view v-if="order.order_status === TeaSpecialistOrderStatus.Finished || order.order_status === TeaSpecialistOrderStatus.Cancelled"
class="flex items-center text-28rpx mt-28rpx justify-end" class="flex items-center text-28rpx mt-28rpx justify-end"
@click="comboCard.handleDeleteOrder(OrderSource.TeaSpecialist)"> @click="comboCard.handleDeleteOrder(OrderSource.TeaSpecialist)">
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] flex items-center justify-center"> <view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] flex items-center justify-center">
删除订单 删除订单
</view> </view>
</view> </view>
<view v-if="orderStatus === OrderStatus.Pending" <view v-if="order.order_status === TeaSpecialistOrderStatus.Pending"
class="flex items-center text-28rpx mt-28rpx justify-end"> class="flex items-center text-28rpx mt-28rpx justify-end">
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx flex items-center justify-center" <view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#9CA3AF] text-[#303133] mr-28rpx flex items-center justify-center"
@click="comboCard.handleCancelOrder(OrderSource.TeaSpecialist)"> @click="comboCard.handleCancelOrder(OrderSource.TeaSpecialist)">
@ -213,6 +222,9 @@
import { OrderSource, OrderStatus } from '@/utils/order' import { OrderSource, OrderStatus } from '@/utils/order'
import { useMessage } from 'wot-design-uni' import { useMessage } from 'wot-design-uni'
import { toast } from '@/utils/toast' import { toast } from '@/utils/toast'
import { TeaSpecialistOrderStatus, TeaSpecialistOrderStatusText } from '@/utils/order'
import {TeaSpecialistLevelValue} from '@/utils/teaSpecialist'
import { router } from '@/utils/tools'
/** /**
* ComboCard 套餐卡片组件 * ComboCard 套餐卡片组件
@ -236,6 +248,11 @@
orderStatus: { orderStatus: {
type: String, type: String,
default: OrderStatus.ToUse default: OrderStatus.ToUse
},
order: {
type: Object,
default: {}
} }
}) })
@ -336,30 +353,8 @@
handleToOrderDetail: () => { handleToOrderDetail: () => {
// TODO 这里要对不同类型的订单进行区分跳转一个是直营的一个市加盟的 // TODO 这里要对不同类型的订单进行区分跳转一个是直营的一个市加盟的
switch (props.type) { switch (props.type) {
case OrderSource.Direct:
uni.navigateTo({
url: `/bundle/order/platform/direct-order-detail?orderStatus=${props.orderStatus}`
})
break;
case OrderSource.Franchise:
uni.navigateTo({
url: `/bundle/order/platform/franchise-order-detail?orderStatus=${props.orderStatus}`
})
break;
case OrderSource.DouYin:
uni.navigateTo({
url: `/bundle/order/douyin/douyin-order-detail?orderStatus=${props.orderStatus}`
})
break;
case OrderSource.TeaRoom:
uni.navigateTo({
url: `/bundle/order/tea-room/order-detail?orderStatus=${props.orderStatus}`
})
break;
case OrderSource.TeaSpecialist: case OrderSource.TeaSpecialist:
uni.navigateTo({ router.navigateTo(`/bundle/order/tea-specialist/order-detail?orderId=${props.order.id}`)
url: `/bundle/order/tea-specialist/order-detail?orderStatus=${props.orderStatus}`
})
break; break;
default: default:
break; break;

13
src/hooks/useOrder.ts Normal file
View File

@ -0,0 +1,13 @@
import { router } from '@/utils/tools'
import { toast } from '@/utils/toast'
import { cancelTeaSpecialistOrder } from '@/api/order'
// 取消订单
export async function handleCancelOrder(id: number) {
try {
const response = await cancelTeaSpecialistOrder({ id })
} catch (error) {
router.navigateBack()
throw error
}
}

2
src/hooks/useWeiXin.ts
View File

@ -27,7 +27,7 @@ export const getUrlCode = (): { [key: string]: string | undefined } => {
*/ */
export async function snsapiBaseAuthorize() { export async function snsapiBaseAuthorize() {
// TODO 测试代码 // TODO 测试代码
wxSnsapiBaseLogin({code: '011haFFa1oJbzK04a8Ha1qQHey0haFFJ'}).then((res: IUserInfoVo) => { wxSnsapiBaseLogin({code: '0417vVGa1MfYBK0binIa1xEQQB37vVGV'}).then((res: IUserInfoVo) => {
console.log("登录成功 ~ snsapiBaseAuthorize ~ res:", res) console.log("登录成功 ~ snsapiBaseAuthorize ~ res:", res)
// 映射 IUserLogin 到 IUserInfoVo // 映射 IUserLogin 到 IUserInfoVo
useUserStore().setUserInfo(res) useUserStore().setUserInfo(res)

113
src/pages/cashier/cashier.vue
View File

@ -16,7 +16,7 @@
<view class="mt-56rpx text-center"> <view class="mt-56rpx text-center">
<view class="text-28rpx leading-40rpx text-#606266">顾客打赏-{{ info.name }}</view> <view class="text-28rpx leading-40rpx text-#606266">顾客打赏-{{ info.name }}</view>
<view class="mt-24rpx"> <view class="mt-24rpx">
<price-format color="#303133" :first-size="44" :second-size="44" :subscript-size="28" :price="tipMoney"></price-format> <price-format color="#303133" :first-size="44" :second-size="44" :subscript-size="28" :price="money"></price-format>
</view> </view>
<view class="mt-12rpx flex items-center justify-center"> <view class="mt-12rpx flex items-center justify-center">
<view class="text-24rpx leading-34rpx text-#606266"> <view class="text-24rpx leading-34rpx text-#606266">
@ -42,21 +42,27 @@
<script lang="ts" setup> <script lang="ts" setup>
import Pay from '@/components/Pay.vue' import Pay from '@/components/Pay.vue'
import { getTeaSpecialistDetails } from '@/api/tea' import { getTeaSpecialistDetails, getTeaSpecialistOrderDetails, teaSpecialistPrepay, teaSpecialistPay } from '@/api/tea'
import { ITeaSpecialistDetailsFields } from '@/api/types/tea' import { ITeaSpecialistDetailsFields } from '@/api/types/tea'
import { toast } from '@/utils/toast' import { toast } from '@/utils/toast'
import { router } from '@/utils/tools' import { router } from '@/utils/tools'
import { payTipTeaSpecialist } from '@/api/pay' import { payTipTeaSpecialist } from '@/api/pay'
import { useUserStore } from '@/store'
import type {IUserInfoVo } from '@/api/types/login'
// 用户信息
const userInfo = ref<IUserInfoVo>(null)
// 支付倒计时取消 // 支付倒计时取消
const time = ref<number>(30 * 60 * 60 * 1000) const time = ref<number>(30 * 60 * 60 * 1000)
// 打赏金额 // 支付金额
const tipMoney = ref<number>(0) const money = ref<number>(0)
// 茶艺师详情 // 茶艺师详情
const id = ref<number>(0) const id = ref<number>(0)
const info = reactive<ITeaSpecialistDetailsFields>({ const info = reactive<ITeaSpecialistDetailsFields>({
id: 0,
name: '', name: '',
star: 0, star: 0,
image: '', image: '',
@ -68,27 +74,34 @@
teamasterLevel: [], teamasterLevel: [],
price: 0, price: 0,
fare_price: 0, fare_price: 0,
collect: 0 collect: 0,
up_status: 0
}) })
// 支付方式 // 支付方式
const pay = ref<number>(0) const pay = ref<number>(0)
// 订单
const orderId = ref<number>(0)
const order = ref<{}>(null)
const result = ref<string>('')
const from = ref<string>('')
onLoad(async (args) => { onLoad(async (args) => {
if (args.id && args.lat && args.lng && args.user_id && args.money) { const userStore = useUserStore()
id.value = Number(args.id) userInfo.value = userStore.userInfo
tipMoney.value = Number(args.money)
// 获取茶艺师详情 from.value = args.from || ''
const res = await getTeaSpecialistDetails({
id: args.id,
latitude: args.lat,
longitude: args.lng,
user_id: args.user_id
})
// 将返回的数据合并到 reactive 对象中
Object.assign(info, res.teamaster || {})
if (args.from == 'tip' && args.teaSpecialistId && args.money) {
// 这边处理打赏金额
id.value = Number(args.teaSpecialistId)
money.value = Number(args.money)
Cashier.handleGetTeaSpecialistDetails(id.value, Number(userInfo.value.id))
} else if (args.from == 'order' && args.teaSpecialistId && args.orderId) {
// 获取订单详情
orderId.value = Number(args.orderId)
Cashier.handleGetOrderDetails()
} else { } else {
toast.info('参数错误') toast.info('参数错误')
return return
@ -97,22 +110,84 @@
console.log('页面加载') console.log('页面加载')
}) })
onUnload(() => {
switch(result.value) {
case 'success':
uni.$emit('payment', { result: true, orderId: orderId.value })
break;
case 'fail':
default: uni.$emit('payment', { result: false, orderId: orderId.value })
}
})
const Cashier = { const Cashier = {
// 获取茶艺师详情
handleGetTeaSpecialistDetails: async (id: number, user_id: number) => {
const res = await getTeaSpecialistDetails({
id,
latitude: uni.getStorageSync('latitude'),
longitude: uni.getStorageSync('longitude'),
user_id
})
// 将返回的数据合并到 reactive 对象中
Object.assign(info, res.teamaster || {})
},
// 获取订单详情
handleGetOrderDetails: async () => {
// 获取订单详情接口
const res = await getTeaSpecialistOrderDetails({id: orderId.value})
order.value = res
money.value = Number(res.details.order_amount)
},
// 获取支付方式 // 获取支付方式
handleGetPayValue: (value: number) => { handleGetPayValue: (value: number) => {
pay.value = value pay.value = value
}, },
// 去支付 // 去支付
handleToPay: () => { handleToPay: async () => {
console.log("🚀 ~ pay.value :", pay.value )
if (pay.value == null || pay.value == undefined) {
toast.info('请选择支付方式')
return
}
if (from.value == 'tip') {
payTipTeaSpecialist({ payTipTeaSpecialist({
id: id.value, id: id.value,
tip_price: tipMoney.value, tip_price: money.value,
pay_type: pay.value pay_type: pay.value
}).then(res => { }).then(res => {
router.navigateTo('/pages/notice/reserve?type=tipSuccess') router.navigateTo('/pages/notice/reserve?type=tipSuccess')
console.log("🚀 ~ res:", res) console.log("🚀 ~ res:", res)
}) })
} else if (from.value == 'order') {
try {
// 预支付
const res1 = await teaSpecialistPrepay({
order_id: orderId.value,
from: 'balance',
pay_way: pay.value,
order_source: 2 //订单来源：1-小程序;2-h5;3app
})
// 支付
const res2 = await teaSpecialistPay({
id: res1.pay_id
})
result.value = 'success'
} catch (error) {
result.value = 'fail'
}
setTimeout(() => {
uni.navigateBack({delta: 1})
}, 500);
}
} }
} }
</script> </script>

25
src/pages/index/detail.vue
View File

@ -283,7 +283,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import TeaSpecialistLevel from '@/components/TeaSpecialistLevel.vue' import TeaSpecialistLevel from '@/components/TeaSpecialistLevel.vue'
import { useMessage } from 'wot-design-uni' import { useMessage } from 'wot-design-uni'
import { getTeaSpecialistDetails, collectTeaSpecialist, getTeaSpecialistRewardAmounts } from '@/api/tea' import { getTeaSpecialistDetails, collectTeaSpecialist, getTeaSpecialistRewardAmounts, teaSpecialistInvite } from '@/api/tea'
import { ITeaSpecialistDetailsFields } from '@/api/types/tea' import { ITeaSpecialistDetailsFields } from '@/api/types/tea'
import type { ITeaSpecialistRewardAmountsResult } from '@/api/types/tea' import type { ITeaSpecialistRewardAmountsResult } from '@/api/types/tea'
import { toast } from '@/utils/toast' import { toast } from '@/utils/toast'
@ -310,6 +310,7 @@
// 茶艺师 // 茶艺师
const id = ref<number>(0) const id = ref<number>(0)
const info = reactive<ITeaSpecialistDetailsFields>({ const info = reactive<ITeaSpecialistDetailsFields>({
id: 0,
name: '', name: '',
star: 0, star: 0,
image: '', image: '',
@ -321,7 +322,8 @@
teamasterLevel: [], teamasterLevel: [],
price: 0, price: 0,
fare_price: 0, fare_price: 0,
collect: 0 collect: 0,
up_status: 0
}) })
const latitude = ref<number>(0) // 纬度 const latitude = ref<number>(0) // 纬度
const longitude = ref<number>(0) // 经度 const longitude = ref<number>(0) // 经度
@ -370,6 +372,11 @@
Object.assign(info, res.teamaster || {}) Object.assign(info, res.teamaster || {})
rate.value = info.star rate.value = info.star
// 茶艺师是否上线
// if (info.up_status == 0) {
// isReserve.value = true
// }
if (info.teamasterlabel) { if (info.teamasterlabel) {
info.teamasterlabel.map(item => { info.teamasterlabel.map(item => {
if (item.label_name == '90后茶艺师') { if (item.label_name == '90后茶艺师') {
@ -417,15 +424,15 @@
handleReserve: () => { handleReserve: () => {
message.alert({ message.alert({
title: '邀约茶艺师', title: '邀约茶艺师',
msg: '尊敬的客户我们即将向[茶艺师姓名]发出服务邀约，请过十分钟后刷新页面，谢谢您的支持！', msg: `尊敬的客户我们即将向[${info.name}]发出服务邀约，请过十分钟后刷新页面，谢谢您的支持！`,
confirmButtonText: '好的', confirmButtonText: '好的',
confirmButtonProps: { confirmButtonProps: {
customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx', customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx',
} }
}).then((res) => { }).then(async res => {
// 点击确认按钮回调事件 await teaSpecialistInvite({
}).catch(() => { id: info.id,
// 点击取消按钮回调事件 })
}) })
}, },
@ -441,7 +448,7 @@
isOtherTip.value = true isOtherTip.value = true
} else { } else {
showTipTeaSpecialistPopup.value = false showTipTeaSpecialistPopup.value = false
router.navigateTo(`/pages/cashier/cashier?id=${id.value}&lat=${latitude.value}&lng=${longitude.value}&user_id=${userInfo.value.id}&money=${item.tip_price}`) router.navigateTo(`/pages/cashier/cashier?id=${id.value}&lat=${latitude.value}&lng=${longitude.value}&money=${item.tip_price}`)
} }
}, },
@ -452,7 +459,7 @@
return return
} }
showTipTeaSpecialistPopup.value = false showTipTeaSpecialistPopup.value = false
router.navigateTo(`/pages/cashier/cashier?id=${id.value}&lat=${latitude.value}&lng=${longitude.value}&user_id=${userInfo.value.id}&money=${tipMoney.value}`) router.navigateTo(`/pages/cashier/cashier?from=tip&teaSpecialistId=${id.value}&money=${tipMoney.value}`)
}, },
// 预约茶艺师 // 预约茶艺师

66
src/pages/index/index.vue
View File

@ -179,10 +179,10 @@
} }
const latitude = ref<number>(import.meta.env.VITE_DEFAULT_LATITUDE) // 纬度 const latitude = ref<number>(import.meta.env.VITE_DEFAULT_LATITUDE) // 纬度
const longitude = ref<number>(import.meta.env.VITE_DEFAULT_LONGITUDE) // 经度 const longitude = ref<number>(import.meta.env.VITE_DEFAULT_LONGITUDE) // 经度
// 存储经纬度
uni.setStorageSync('latitude', latitude.value)
uni.setStorageSync('longitude', longitude.value)
// 经纬度缓存过期处理（1小时）
const LOCATION_EXPIRE_KEY = 'location_expire_time'
const LOCATION_EXPIRE_MS = 60 * 60 * 1000 // 1小时
const defaultCity = ref<string>(import.meta.env.VITE_DEFAULT_ADDRESS) // 默认城市 const defaultCity = ref<string>(import.meta.env.VITE_DEFAULT_ADDRESS) // 默认城市
const list = ref<Array<any>>([]) // 茶艺师列表 const list = ref<Array<any>>([]) // 茶艺师列表
const teaSpecialistName = ref<string>('') // 茶艺师名称 const teaSpecialistName = ref<string>('') // 茶艺师名称
@ -190,18 +190,8 @@
const cityValue = ref<string>('') const cityValue = ref<string>('')
onLoad(async () => { onLoad(async () => {
// 检查缓存是否过期，超时则重新授权
// 授权获取地址 await Index.handleEnsureLocationAuth()
await wxGetLocation((res) => {
latitude.value = res.latitude
longitude.value = res.longitude
// 授权后存储经纬度
uni.setStorageSync('latitude', latitude.value)
uni.setStorageSync('longitude', longitude.value)
Index.handleSearch()
})
// 获取城市列表 // 获取城市列表
getCity({latitude: latitude.value, longitude: longitude.value}).then((res: any) => { getCity({latitude: latitude.value, longitude: longitude.value}).then((res: any) => {
@ -224,6 +214,52 @@
}) })
const Index = { const Index = {
// 设置经纬度缓存
handleSetLocationCache: (lat: number, lng: number) => {
uni.setStorageSync('latitude', lat)
uni.setStorageSync('longitude', lng)
uni.setStorageSync(LOCATION_EXPIRE_KEY, Date.now() + LOCATION_EXPIRE_MS)
},
// 检查经纬度缓存是否过期
handleCheckLocationCache: () => {
const expire = uni.getStorageSync(LOCATION_EXPIRE_KEY)
if (expire && Date.now() > expire) {
uni.removeStorageSync('latitude')
uni.removeStorageSync('longitude')
uni.removeStorageSync(LOCATION_EXPIRE_KEY)
return false
}
return true
},
// 初始化经纬度
handleEnsureLocationAuth: async () => {
if (!Index.handleCheckLocationCache()) {
// 超时，重新获取授权
await wxGetLocation((res) => {
latitude.value = res.latitude
longitude.value = res.longitude
Index.handleSetLocationCache(latitude.value, longitude.value)
Index.handleSearch()
})
} else {
const lat = uni.getStorageSync('latitude')
const lng = uni.getStorageSync('longitude')
if (lat && lng) {
latitude.value = lat
longitude.value = lng
} else {
await wxGetLocation((res) => {
latitude.value = res.latitude
longitude.value = res.longitude
Index.handleSetLocationCache(latitude.value, longitude.value)
Index.handleSearch()
})
}
}
},
// 选择城市 // 选择城市
handleSelectCity: (e: any) => { handleSelectCity: (e: any) => {
cityValue.value = e.value cityValue.value = e.value

9
src/pages/my/my.vue
View File

@ -66,7 +66,7 @@
<wd-img width="100%" height="100%" :src="`${OSS}images/my/my_image3.png`" mode="aspectFill"></wd-img> <wd-img width="100%" height="100%" :src="`${OSS}images/my/my_image3.png`" mode="aspectFill"></wd-img>
</view> </view>
<view class="text-[#303133] absolute bottom-12rpx left-24rpx text-center"> <view class="text-[#303133] absolute bottom-12rpx left-24rpx text-center">
<view class="text-30rpx leading-36rpx fon-bold">{{ isLogin ? '￥2106.3623' : '- -' }}</view> <view class="text-30rpx leading-36rpx fon-bold">{{ isLogin ? user.user_money : '- -' }}</view>
<view class="text-20rpx leading-28rpx ml-10rpx">平台余额</view> <view class="text-20rpx leading-28rpx ml-10rpx">平台余额</view>
</view> </view>
</view> </view>
@ -190,6 +190,7 @@
// 登录信息相关 // 登录信息相关
const userInfo = ref<any>(null) const userInfo = ref<any>(null)
const user = ref<any>(null)
const isLogin = ref<boolean>(false) const isLogin = ref<boolean>(false)
const isVip = ref<boolean>(true) const isVip = ref<boolean>(true)
@ -220,8 +221,10 @@
userInfo.value = userStore.userInfo userInfo.value = userStore.userInfo
isLogin.value = true isLogin.value = true
const user = getUserInfo() // 获取用户详情信息接口
console.log("🚀 ~ user:", user) getUserInfo().then(res => {
user.value = res
})
} else if (code && !userStore.userInfo.token) { } else if (code && !userStore.userInfo.token) {
// 这里是微信授权之后跳转回到本页面获取到code但是没有登录状态的话需要进行登录操作 // 这里是微信授权之后跳转回到本页面获取到code但是没有登录状态的话需要进行登录操作

116
src/pages/reserve/group-tea-specialist.vue
View File

@ -10,7 +10,7 @@
<template> <template>
<view class="pb-70rpx"> <view class="pb-70rpx">
<view class=""> <view class="">
<navbar title="加盟合作" custom-class='!bg-[#F6F7F8]'></navbar> <navbar title="预订团体茶艺师" custom-class='!bg-[#F6F7F8]' :leftArrow="false"></navbar>
</view> </view>
<view class="mx-30rpx mt-38rpx"> <view class="mx-30rpx mt-38rpx">
@ -25,14 +25,7 @@
</view> </view>
<view class="flex items-center"> <view class="flex items-center">
<wd-input placeholder="请填写预约人数" no-border></wd-input> <wd-input placeholder="请填写预约人数" no-border v-model='form.numbers'></wd-input>
</view>
</view>
<view class="flex items-center mt-46rpx" v-if="form.settleIn === 2">
<view class="text-32rpx leading-44rpx text-#303133 mr-66rpx">门店名称</view>
<view class="flex-1">
<wd-input no-border placeholder="请填写门店名称" custom-class="!bg-[#F6F7F8] !rounded-16rpx !px-28rpx !py-20rpx"></wd-input>
</view> </view>
</view> </view>
</view> </view>
@ -48,7 +41,7 @@
<view> <view>
<wd-checkbox-group v-model="requirementValue" inline shape="square" checked-color="#4C9F44"> <wd-checkbox-group v-model="requirementValue" inline shape="square" checked-color="#4C9F44">
<wd-checkbox custom-class="!mr-40rpx" :modelValue="item.value" v-for="(item, index) in requirement" :key="index">{{ item.label }}</wd-checkbox> <wd-checkbox custom-class="!mr-40rpx" :modelValue="item.label" v-for="(item, index) in requirement" :key="index">{{ item.label }}</wd-checkbox>
</wd-checkbox-group> </wd-checkbox-group>
</view> </view>
</view> </view>
@ -81,14 +74,14 @@
<view> <view>
<view class="text-26rpx leading-32rpx text-#606266">联系人</view> <view class="text-26rpx leading-32rpx text-#606266">联系人</view>
<view class="mt-20rpx border-b border-b-solid border-b-[#F6F7F8] pb-20rpx"> <view class="mt-20rpx border-b border-b-solid border-b-[#F6F7F8] pb-20rpx">
<wd-input no-border placeholder="请填写联系人" ></wd-input> <wd-input no-border placeholder="请填写联系人" v-model="form.contact"></wd-input>
</view> </view>
</view> </view>
<view class="mt-22rpx"> <view class="mt-22rpx">
<view class="text-26rpx leading-32rpx text-#606266">手机号</view> <view class="text-26rpx leading-32rpx text-#606266">手机号</view>
<view class="mt-20rpx border-b border-b-solid border-b-[#F6F7F8] pb-20rpx"> <view class="mt-20rpx border-b border-b-solid border-b-[#F6F7F8] pb-20rpx">
<wd-input no-border placeholder="请填写手机号"></wd-input> <wd-input no-border placeholder="请填写手机号" v-model="form.phone"></wd-input>
</view> </view>
</view> </view>
@ -121,19 +114,19 @@
<view class="mt-22rpx"> <view class="mt-22rpx">
<view class="text-26rpx leading-32rpx text-#606266">详细地址</view> <view class="text-26rpx leading-32rpx text-#606266">详细地址</view>
<view class="mt-20rpx pb-20rpx"> <view class="mt-20rpx pb-20rpx">
<wd-input no-border placeholder="请输入小区/写字楼"></wd-input> <wd-input no-border placeholder="请输入小区/写字楼" v-model="form.address"></wd-input>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- 留言建议 --> <!-- 订单信息 -->
<view class="bg-white rounded-16rpx px-30rpx py-32rpx mt-20rpx"> <view class="bg-white rounded-16rpx px-30rpx py-32rpx mt-20rpx">
<view class="text-32rpx leading-44rpx text-#303133 mb-32rpx flex items-center"> <view class="text-32rpx leading-44rpx text-#303133 mb-32rpx flex items-center">
留言建议 订单信息<text class="text-26rpx leading-36rpx text-[#909399] ml-20rpx">(选填)</text>
</view> </view>
<view class=""> <view class="">
<wd-textarea placeholder="有想说的可以在这里写哦！" v-model="form.message" custom-class='!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA]' custom-textarea-class='!bg-[#F8F9FA]' /> <wd-textarea placeholder="有想说的可以在这里写哦！" v-model="form.content" custom-class='!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA]' custom-textarea-class='!bg-[#F8F9FA]' />
</view> </view>
</view> </view>
</view> </view>
@ -147,6 +140,8 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useColPickerData } from '@/hooks/useColPickerData' import { useColPickerData } from '@/hooks/useColPickerData'
import {toast} from '@/utils/toast' import {toast} from '@/utils/toast'
import {ITeaSpecialistGroupReserveParams, teaSpecialistGroupReserve} from '@/api/tea'
import { router } from '@/utils/tools'
const OSS = inject('OSS') const OSS = inject('OSS')
@ -191,6 +186,7 @@
finish() finish()
} }
} }
const address = ref<string[]>([])
// 上传文件 // 上传文件
const fileList = ref<any[]>([]) const fileList = ref<any[]>([])
@ -202,14 +198,18 @@
const countDown = ref<any>(null) // 倒计时组件 const countDown = ref<any>(null) // 倒计时组件
// 表单 // 表单
const form = reactive<{ const form = reactive<ITeaSpecialistGroupReserveParams>({
settleIn: number, numbers: '',
code: string, other_require: '',
message: string res_time: '',
}>({ contact: '',
settleIn: 1, phone: '',
code: '', code: '',
message: '' province: '',
city: '',
district: '',
address: '',
content: '',
}) })
const GroupTeaSpecialist = { const GroupTeaSpecialist = {
@ -234,8 +234,10 @@
}, },
// 确认选择地址 // 确认选择地址
handleConfirmAddress: (selected) => { handleConfirmAddress: (items) => {
console.log("🚀 ~ selected:", selected) form.province = items.selectedItems[0]?.label || ''
form.city = items.selectedItems[1]?.label || ''
form.district = items.selectedItems[2]?.label || ''
}, },
// 日期过滤 // 日期过滤
@ -243,7 +245,6 @@
if (type === 'year') { if (type === 'year') {
const currentYear = new Date().getFullYear() const currentYear = new Date().getFullYear()
return values.filter((year) => year == currentYear) return values.filter((year) => year == currentYear)
} }
return values return values
}, },
@ -258,11 +259,62 @@
}, },
// 提交订单 // 提交订单
handleSubmitOrder: () => { handleSubmitOrder: async() => {
// 这里还需要多日期进行校验 const require = requirementValue.value.join(',')
uni.navigateTo({
url: '/pages/notice/reserve?type=groupTeaSpecialist' // 日期格式化为 yyyy-MM-dd
}) const d = new Date(timeValue.value)
const year = d.getFullYear()
const month = (d.getMonth() + 1).toString().padStart(2, '0')
const day = d.getDate().toString().padStart(2, '0')
const time = `${year}-${month}-${day}`
form.other_require = require
form.res_time = time
if (form.numbers.trim() === '') {
toast.info('请填写预约人数')
return
}
if (form.res_time.trim() === '') {
toast.info('请选择预定日期')
return
}
if (form.contact.trim() === '') {
toast.info('请填写联系人')
return
}
if (form.phone.trim() === '') {
toast.info('请填写手机号')
return
}
if (form.code.trim() === '') {
toast.info('请填写验证码')
return
}
if (form.province.trim() === '' || form.city.trim() === '' || form.district.trim() === '') {
toast.info('请选择省市区')
return
}
if (form.address.trim() === '') {
toast.info('请填写详细地址')
return
}
try {
await teaSpecialistGroupReserve(form)
setTimeout(() => {
router.navigateTo('/pages/notice/reserve?type=groupTeaSpecialist')
}, 800)
} catch (error) {}
console.log("🚀 ~ form:", form)
}, },
checkedData: (date: number) => { checkedData: (date: number) => {
@ -272,12 +324,14 @@
d.setHours(0, 0, 0, 0) d.setHours(0, 0, 0, 0)
if (d < today) { if (d < today) {
toast.info("请选择大于今天的日期") toast.info("请选择大于今天的日期")
timeValue.value = Date.now()
return false return false
} }
return true return true
} }
} }
console.log("🚀 ~ value:", value)
</script> </script>
<style lang="scss"> <style lang="scss">

193
src/pages/reserve/tea-room.vue
View File

@ -77,35 +77,6 @@
</view> </view>
</wd-popup> </wd-popup>
<!-- 支付 -->
<wd-popup v-model="showPayPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" @close="showPayPopup = false" position="bottom">
<view class='bg-[#FBFBFB] py-40rpx realtive'>
<view class="absolute top-18rpx right-30rpx" @click="showPayPopup = false">
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
</view>
<view class="text-36rpx text-[#121212] leading-50rpx text-center">支付</view>
<view class="mx-30rpx bg-white rounded-16rpx px-30rpx pt-40rpx mt-40rpx pb-30rpx">
<wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44">
<view class="pay" v-for="(item, index) in PayList" :key="index" @click="pay = item.id">
<view class="flex justify-between items-center" v-if="pay == item.value" >
<view class="flex items-center">
<wd-img width="50rpx" height="50rpx" :src="item.icon"></wd-img>
<view class="ml-20rpx text-30rpx text-[#303133] leading-42rpx">{{ item.name }}</view>
</view>
<view class="flex items-center">
<wd-radio :value="item.value">
<view class="text-[#303133] text-26rpx leading-36rpx mr-20rpx">可用202.22</view>
</wd-radio>
</view>
</view>
</view>
</wd-radio-group>
</view>
<view class='bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx leading-90rpx mx-60rpx box-border text-center mt-170rpx' @click="TeaRoom.handlePay">确定付款</view>
</view>
</wd-popup>
<!-- 茶艺服务 --> <!-- 茶艺服务 -->
<wd-popup v-model="showTeaServicePopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom"> <wd-popup v-model="showTeaServicePopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative"> <view class="relative">
@ -217,14 +188,10 @@
<view class="mt-20rpx bg-white px-30rpx py-34rpx"> <view class="mt-20rpx bg-white px-30rpx py-34rpx">
<view class="flex items-center justify-between"> <view class="flex items-center justify-between">
<view class="font-bold text-32rpx leading-44rpx">服务方式</view> <view class="font-bold text-32rpx leading-44rpx">服务方式</view>
<view> <view class="bg-[#F0F6EF] h-60rpx rounded-20rpx flex items-center justify-between py-14rpx px-30rpx relative w-304rpx font-400 text-26rpx text-[#333]">
<wd-radio-group v-model="serviceTypeValue" shape="dot" checked-color="#4C9F44" inline> <view class="absolute left-30rpx top-1/2 -translate-y-1/2 z-2" :class="serviceTypeValue == 1 ? 'text-[#fff]' : ''" @click="TeaRoom.handleChooseService(1)">到店服务</view>
<block v-for="(item, index) in serviceType" :key="index"> <view class="absolute right-30rpx top-1/2 -translate-y-1/2 z-2" :class="serviceTypeValue == 2 ? 'text-[#fff]' : ''" @click="TeaRoom.handleChooseService(2)">上门服务</view>
<wd-radio :value="item.type"> <view class="swiper-service"></view>
<view class="text-[#303133] text-26rpx leading-36rpx mt-4rpx">{{item.name}}</view>
</wd-radio>
</block>
</wd-radio-group>
</view> </view>
</view> </view>
@ -330,9 +297,9 @@
</view> </view>
<!-- 支付方式 --> <!-- 支付方式 -->
<view class="bg-white py-26rpx px-30rpx mt-20rpx"> <!-- <view class="bg-white py-26rpx px-30rpx mt-20rpx">
<pay hide-store-balance></pay> <pay hide-store-balance @pay="TeaRoom.handleGetPayValue"></pay>
</view> </view> -->
<view class="fixed left-0 right-0 bottom-0 z-2 bg-[#fff]" <view class="fixed left-0 right-0 bottom-0 z-2 bg-[#fff]"
:style="{ height: '140rpx' }"> :style="{ height: '140rpx' }">
@ -366,7 +333,7 @@
import {ReserveServiceCategory} from '@/utils/order' import {ReserveServiceCategory} from '@/utils/order'
import { PayList, PayCategory, PayValue } from '@/utils/pay' import { PayList, PayCategory, PayValue } from '@/utils/pay'
import Pay from '@/components/Pay.vue' import Pay from '@/components/Pay.vue'
import { getTeaSpecialistDetails, getNext7Days, getTeaTypeList } from '@/api/tea' import { getTeaSpecialistDetails, getNext7Days, getTeaTypeList, createTeaSpecialistOrder } from '@/api/tea'
import type { ITeaSpecialistDetailsFields, ITeaSpecialistFuture7DaysResult, ITeaTypeListResult } from '@/api/types/tea' import type { ITeaSpecialistDetailsFields, ITeaSpecialistFuture7DaysResult, ITeaTypeListResult } from '@/api/types/tea'
import { TeaSpecialistLevelValue } from '@/utils/teaSpecialist' import { TeaSpecialistLevelValue } from '@/utils/teaSpecialist'
import type { IUserAddressListResult } from '@/api/types/user' import type { IUserAddressListResult } from '@/api/types/user'
@ -391,6 +358,7 @@
minimum_time: 0, minimum_time: 0,
time: [] time: []
}) })
const reserveTime = ref<Array<any>>([])
// 上门服务选择的地址 // 上门服务选择的地址
const address = ref<IUserAddressListResult>({ const address = ref<IUserAddressListResult>({
@ -428,18 +396,18 @@
const orderRemarks = ref<string>('') const orderRemarks = ref<string>('')
// 支付方式 // 支付方式
const pay = ref<number>(1) const pay = ref<number>(0)
const html: string = '<p>这里是富文本内容，需要后台传递</p>' const html: string = '<p>这里是富文本内容，需要后台传递</p>'
const isGroupBuying: boolean = false // 是否是团购套餐 const isGroupBuying: boolean = false // 是否是团购套餐
// 费用明细相关 // 费用明细相关
const showCostPopup = ref<boolean>(false) // 费用明细popup const showCostPopup = ref<boolean>(false) // 费用明细popup
const showPayPopup = ref<boolean>(false) // 支付popup
// 茶艺师 // 茶艺师
const teaSpecialistId = ref<number>(0) const teaSpecialistId = ref<number>(0)
const info = reactive<ITeaSpecialistDetailsFields>({ const info = reactive<ITeaSpecialistDetailsFields>({
id: 0,
name: '', name: '',
star: 0, star: 0,
image: '', image: '',
@ -451,7 +419,8 @@
teamasterLevel: [], teamasterLevel: [],
price: 0, price: 0,
fare_price: 0, fare_price: 0,
collect: 0 collect: 0,
up_status: 0
}) })
const is90 = ref<boolean>(false) const is90 = ref<boolean>(false)
@ -463,7 +432,9 @@
service: { service: {
total: 0, total: 0,
unitPrice: 0, unitPrice: 0,
num: 0 num: 0,
startTime: 0,
endTime: 0
}, },
travel: { travel: {
total: 0, total: 0,
@ -481,15 +452,7 @@
total: 0 total: 0
}) })
// 提交的数据
const reserveTime = ref<Array<any>>([])
onLoad(async (args) => { onLoad(async (args) => {
if (args.type == ReserveServiceCategory.GroupBuying) {
// TODO 如果是团购套餐则直接微信支付？
pay.value = 3
}
if (args.id) { if (args.id) {
teaSpecialistId.value = Number(args.id) teaSpecialistId.value = Number(args.id)
@ -531,17 +494,22 @@
console.log("🚀 ~ teaList.value:", teaList.value) console.log("🚀 ~ teaList.value:", teaList.value)
}, },
// 选择服务方式
handleChooseService: (type: number) => {
serviceTypeValue.value = type
const swiperService = document.querySelector('.swiper-service') as HTMLElement
if (type == 1) {
swiperService.style.transform = 'translateY(-50%) translateX(0)'
} else if (type == 2) {
swiperService.style.transform = 'translateY(-50%) translateX(76px)'
}
},
handleClick: (item: any) => { handleClick: (item: any) => {
// 处理点击事件 // 处理点击事件
console.log('Clicked item:', item) console.log('Clicked item:', item)
}, },
handlePay: () => {
// 这里需要判断下如果是预约的话，跳转结果通知是reserve的，团购是pay的
// uni.navigateTo({ url: '/bundle/reserve-room/result' })
},
// 切换预定茶叶选择 // 切换预定茶叶选择
handleToggleTea: (id: number, name: string, price: number) => { handleToggleTea: (id: number, name: string, price: number) => {
const index = selectedTea.value.indexOf(id) const index = selectedTea.value.indexOf(id)
@ -558,7 +526,7 @@
} }
totalSelectedTeaPrice.value = toPlus(selectedTeaPrice.value) totalSelectedTeaPrice.value = toPlus(selectedTeaPrice.value)
bill.value.teaService.total = totalSelectedTeaPrice.value bill.value.teaService.total = Number(totalSelectedTeaPrice.value) // 更新茶艺服务费用
}, },
// 选择门店 // 选择门店
@ -584,13 +552,22 @@
bill.value.service = { bill.value.service = {
total: toTimes(info.price, params[1].length), total: toTimes(info.price, params[1].length),
unitPrice: info.price, unitPrice: info.price,
num: params[1].length num: params[1].length,
startTime: params[2][0],
endTime: params[2][params[2].length - 1],
}, },
reserveTime.value = params reserveTime.value = params
console.log("🚀 ~ bill.value:", bill.value)
}, },
// 跳转优惠券页面 // 跳转优惠券页面
handleToCoupon(type) { handleToCoupon(type) {
if (reserveTime.value.length == 0) {
toast.info('请选择预定时间')
return
}
uni.$on('chooseCoupon', params => { uni.$on('chooseCoupon', params => {
uni.$off('chooseCoupon') uni.$off('chooseCoupon')
console.log("🚀 ~ params:", params) console.log("🚀 ~ params:", params)
@ -598,13 +575,9 @@
bill.value.coupon = params.coupon.coupon_price bill.value.coupon = params.coupon.coupon_price
}) })
if (reserveTime.value.length == 0) {
toast.info('请选择预定时间')
return
}
// 获取预定了几个小时 // 获取预定了几个小时
const count = reserveTime.value[1].length const count = reserveTime.value[1].length
uni.navigateTo({ url: `/bundle/coupon/coupon?id=${teaSpecialistId.value}&time=${count}&type=${type}` }) uni.navigateTo({ url: `/bundle/coupon/coupon?id=${teaSpecialistId.value}&numbers=${count}&type=${type}` })
}, },
// 重置差茶艺服务 // 重置差茶艺服务
@ -624,10 +597,76 @@
showTeaServicePopup.value = false showTeaServicePopup.value = false
}, },
// 获取支付方式
handleGetPayValue: (value: number) => {
pay.value = value
},
// 提交表单 // 提交表单
handleSubmitOrder: () => { handleSubmitOrder: async () => {
showPayPopup.value = true if (serviceTypeValue.value == 1 && teaHouse.value.id == 0) {
uni.navigateTo({ url: '/pages/notice/reserve?type=teaSpecialist' }) toast.info('请选择门店地址')
return
}
if (serviceTypeValue.value == 2 && address.value.id == 0) {
toast.info('请选择上门服务地址')
return
}
if (reserveTime.value.length == 0) {
toast.info('请选择预定时间')
return
}
if (selectedTea.value.length == 0) {
toast.info('请选择茶艺时服务')
return
}
const params = {
teamaster_id: info.id,
address_id: address.value.id,
start_time: bill.value.service.startTime,
end_time: bill.value.service.endTime,
nums: servicePeople.value,
tea_id: selectedTea.value.join(','),
service_type: serviceTypeValue.value,
store_id: teaHouse.value.id,
latitude: uni.getStorageSync('latitude') || 0,
longitude: uni.getStorageSync('longitude') || 0,
remark: orderRemarks.value,
coupon_id: selectedCoupon.value.id || 0,
hours: bill.value.service.num
}
try {
const res = await createTeaSpecialistOrder(params)
uni.$on('payment', params => {
console.log("🚀 ~ params:", params)
setTimeout(() => {
uni.$off("payment")
if (params.result) {
uni.redirectTo({
url: `/pages/notice/reserve?type=teaSpecialist&orderId=${params.orderId}`
})
} else {
uni.redirectTo({
url: '/bundle/order/tea-specialist/order-list'
})
}
}, 1000)
})
setTimeout(() => {
router.navigateTo(`/pages/cashier/cashier?from=order&orderId=${res.id}&teaSpecialistId=${info.id}`)
}, 800)
} catch (error) {
toast.info('订单提交失败，请稍后重试')
return
}
} }
} }
@ -638,6 +677,7 @@
let total = Number(toPlus(s, t, ts)) let total = Number(toPlus(s, t, ts))
if (bill.value.coupon > 0 ) { if (bill.value.coupon > 0 ) {
total + bill.value.coupon
return total - bill.value.coupon return total - bill.value.coupon
} }
return total return total
@ -674,4 +714,19 @@
} }
} }
} }
.swiper-service {
content: " ";
display: block;
background-color: #4C9F44;
width: 152rpx;
height: 56rpx;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
border-radius: 20rpx;
transition: all 0.3s ease;
z-index: 0;
}
</style> </style>

54
src/utils/order.ts
View File

@ -166,3 +166,57 @@ export const OrderStatusTitle: Record<OrderSource, Record<OrderStatus, string>>
[OrderStatus.AfterSaleProcessing]: '申请售后中' [OrderStatus.AfterSaleProcessing]: '申请售后中'
} }
} }
// 茶艺师订单状态数字
export enum TeaSpecialistOrderStatus {
Pending = 0, // 待付款(未支付)
Pay = 1, // 预约单、已预约(已支付)
Cancelled = 2, // 已取消(订单取消)
Confirm = 3, // 待确认(已接单)
Serving = 4, // 服务中
Finished = 5, // 已完成
}
// 茶艺师订单状态文本
export enum TeaSpecialistOrderStatusText {
All = 'all', // 待付款
Pending = 'pending', // 待付款
Pay = 'pay', // 已支付(预约单、已预约)
Cancelled = 'cancelled', // 已取消
Confirm = 'confirm', // 待确认
Serving = 'serving', // 服务中
Finished = 'finished', // 已完成
}
// 状态内容映射
export const TeaSpecialistOrderStatusTextValue: Record<TeaSpecialistOrderStatus, any> = {
[TeaSpecialistOrderStatus.Pending]: {
title: '等待付款'
},
[TeaSpecialistOrderStatus.Pay]: {
title: '等待付款'
},
[TeaSpecialistOrderStatus.Cancelled]: {
title: '等待付款'
},
[TeaSpecialistOrderStatus.Confirm]: {
title: '等待付款'
},
[TeaSpecialistOrderStatus.Serving]: {
title: '等待付款'
},
[TeaSpecialistOrderStatus.Finished]: {
title: '等待付款'
},
}
export const TeaSpecialistOrderStatusValue: Record<TeaSpecialistOrderStatusText, string | number> = {
[TeaSpecialistOrderStatusText.All]: '',
[TeaSpecialistOrderStatusText.Pending]: 0,
[TeaSpecialistOrderStatusText.Pay]: 1,
[TeaSpecialistOrderStatusText.Cancelled]: 2,
[TeaSpecialistOrderStatusText.Confirm]: 3,
[TeaSpecialistOrderStatusText.Serving]: 4,
[TeaSpecialistOrderStatusText.Finished]: 5,
}

6
src/utils/pay.ts
View File

@ -20,6 +20,12 @@ export enum PayValue {
StoreBalance = 3, // 门店余额 StoreBalance = 3, // 门店余额
} }
export const PayValueText: Record<PayValue, string> = {
[PayValue.PlatformBalance]: '平台余额',
[PayValue.WeChatPay]: '微信支付',
[PayValue.StoreBalance]: '门店余额',
}
// 支付方式列表 // 支付方式列表
export const PayList: PayMethod[] = [ export const PayList: PayMethod[] = [
{ {