调试接口

This commit is contained in:
wangxiaowei
2025-12-20 22:44:12 +08:00
parent fc3072980c
commit a2f1023de8
32 changed files with 982 additions and 483 deletions

View File

@ -171,7 +171,7 @@
.wd-tabs,
.wd-tabs__nav,
.wd-tabs__line {
background-color: transparent;
background-color: transparent !important;
}
.wd-tabs__nav-item.is-active {

View File

@ -31,7 +31,7 @@
custom-class="!bg-[#F6F7F8] !rounded-16rpx"
custom-input-class="!h-104rpx">
<template #prefix>
<view class="ml-38rpx flex items-center" @click="excharge.handleScan">
<view class="ml-38rpx flex items-center" @click="Excharge.handleScan">
<view class="w-36rpx h-36rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_scan.png`"></wd-img>
</view>
@ -40,7 +40,7 @@
</template>
</wd-input>
</view>
<view class="bg-[#4C9F44] text-[#fff] mx-60rpx h-90rpx leading-90rpx text-center rounded-8rpx mt-80rpx" @click="excharge.handleConfirm">确定</view>
<view class="bg-[#4C9F44] text-[#fff] mx-60rpx h-90rpx leading-90rpx text-center rounded-8rpx mt-80rpx" @click="Excharge.handleConfirm">确定</view>
</view>
<!-- 间隔线 -->
@ -69,18 +69,47 @@
<script lang="ts" setup>
import { useMessage } from 'wot-design-uni'
import {toast} from '@/utils/toast'
import { checkDouyinCoupon } from '@/api/user'
import { router } from '@/utils/tools'
const OSS = inject('OSS')
const code = ref<string>('')
const message = useMessage('wd-message-box-slot')
const excharge = {
// 扫码
// 茶室ID
const storeId = ref<number>(0)
onLoad((args) => {
storeId.value = Number(args.storeId)
})
const Excharge = {
/**
* 扫码
*/
handleScan: () => {
uni.scanCode({
success: (res) => {
success: async (res) => {
console.log("🚀 ~ res:", res)
if(res.result) {
code.value = res.result
uni.showLoading({ title: '兑换中...' })
try {
const params = {
store_id: storeId.value,
code: res.result.replace(/\s+/g, ''),
type: 1
}
await checkDouyinCoupon(params)
uni.hideLoading()
// 跳转页面
Excharge.handleToExcharge()
} catch (error) {
uni.hideLoading()
return
}
}
},
fail: (err) => {
@ -89,13 +118,35 @@
})
},
// 确认兑换
handleConfirm: () => {
/**
* 确认兑换
*/
handleConfirm: async () => {
if(!code.value) {
toast.info('兑换失败 请检查兑换码')
return
}
uni.showLoading({ title: '兑换中...' })
try {
const params = {
store_id: storeId.value,
code: code.value.replace(/\s+/g, ''),
type: 1
}
await checkDouyinCoupon(params)
uni.hideLoading()
// 跳转页面
Excharge.handleToExcharge()
} catch (error) {
uni.hideLoading()
return
}
},
handleToExcharge: () => {
message.confirm({
title: '兑换成功',
msg: '您的抖音券已经兑换成功,立即去预定茶室?',
@ -109,6 +160,9 @@
}
}).then((res) => {
// 点击确认按钮回调事件
if (res.action === 'confirm') {
router.redirectTo(`/bundle/order/douyin/order-list`)
}
}).catch(() => {
// 点击取消按钮回调事件
})

View File

@ -8,14 +8,46 @@
<template>
<view class="">
<view class="order-list">
<view class="order-list sticky top-0 left-0 z-50">
<navbar title="抖音团购"></navbar>
<view class="bg-white pb-20rpx">
<wd-search v-model="keywords" placeholder="搜索订单信息" hide-cancel placeholder-left custom-class="!h-72rpx"/>
</view>
<view class="tabs relative">
<wd-tabs v-model="tab" swipeable slidable="always" :lazy="false" @click="OrderList.handleChangeTabs">
<wd-tab title="全部" :name="DouYinOrderStatusText.All"></wd-tab>
<wd-tab title="待使用" :name="DouYinOrderStatusText.ToUse"></wd-tab>
<wd-tab title="已使用" :name="DouYinOrderStatusText.Used"></wd-tab>
</wd-tabs>
</view>
</view>
<view class="tabs relative">
<view class="tabs mt-18rpx mx-30rpx pb-20rpx">
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption">
<view class="mb-20rpx" v-for="(item, index) in list" :key="index">
<combo-card :type="OrderSource.DouYin" :order="item"></combo-card>
</view>
</mescroll-body>
</view>
<!-- <view class="order-list sticky top-0 left-0 z-50 bg-[#fff] pb-10rpx">
<wd-navbar safeAreaInsetTop custom-class='!bg-[#fff]' :bordered="false" placeholder>
<template #left>
<view class="h-48rpx flex items-center">
<view class="mt-4rpx" @click="router.navigateBack()">
<wd-icon name="thin-arrow-left" size="30rpx"></wd-icon>
</view>
<view class="">抖音团购</view>
</view>
</template>
</wd-navbar>
<view class="search-box">
<wd-search v-model="keywords" hide-cancel placeholder-left light placeholder="搜索茶室订单" @search="OrderList.handleSearch()" custom-class="!mx-28rpx !bg-[#fff]" custom-input-class="!bg-[#F6F7F8] rounded-48rpx"></wd-search>
</view>
</view> -->
<!-- <view class="tabs relative">
<wd-tabs v-model="tab" swipeable slidable="always" @change="orderList.handleChangeTab" :lazy="false">
<wd-tab title="全部">
<view class="content mx-30rpx mt-34rpx">
@ -42,7 +74,8 @@
<view class="absolute right-0 top-10rpx excharge w-178rpx h-80rpx leading-80rpx text-[#fff] text-center font-bold text-24rpx leading-34rpx" @click="orderList.handleToExcharge">
去兑换
</view>
</view>
</view> -->
</view>
</template>
@ -51,34 +84,29 @@
import ComboCard from '@/components/order/ComboCard.vue'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
import { OrderSource } from '@/utils/order'
import { OrderSource, DouYinOrderStatusText } from '@/utils/order'
/* mescroll */
const { mescrollInit, downCallback } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
const downOption = {
auto: true
}
const upOption = {
auto: true,
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
}
const orderStatus = ref<string>('')
const list = ref<Array<any>>([]) // 茶室列表
const keywords = ref<string>('') // 搜索关键词
// 菜单
const currentType = ref<number>(1)
const menuList = reactive<Array<{ type: number; title: string }>>([
{
type: 1,
title: '直营店',
},
{
type: 2,
title: '加盟店',
}
])
// 店铺类型
// 搜索
const keywords = ref<string>('')
// tab
const tab = ref<number>(0)
const tab = ref<string>('all')
const orderList = {
const OrderList = {
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容
@ -134,9 +162,18 @@
},
// 切换tab
handleChangeTab: (e: any) => {
tab.value = e.index
}
handleChangeTabs: (e: {index: number, name: string}) => {
tab.value = e.name
if (e.name === TeaRoomOrderStatusText.Pending) {
orderStatus.value = '0'
} else {
orderStatus.value = TeaRoomOrderStatusValue[e.name] || ''
}
// 切换tab时,重置当前的mescroll
list.value = []
getMescroll().resetUpScroll();
},
}
</script>

View File

@ -8,7 +8,7 @@
<template>
<view class="">
<view class="order-list">
<view class="order-list sticky top-0 left-0 z-50">
<navbar layoutLeft>
<template #left>
<view class="flex items-center ml-24rpx">
@ -21,15 +21,17 @@
<view class="bg-white pb-20rpx">
<wd-search v-model="keywords" placeholder="搜索订单信息" hide-cancel placeholder-left custom-class="!h-72rpx" @search="OrderList.handleResetSearch()"/>
</view>
<view class="tabs bg-[#F6F7F9] pb-20rpx">
<wd-tabs v-model="tab" swipeable slidable="always" @change="OrderList.handleChangeTabs" :lazy="false">
<wd-tab title="全部" :name="TeaRoomPackageOrderStatusText.All"></wd-tab>
<wd-tab title="待使用" :name="TeaRoomPackageOrderStatusText.ToUse"></wd-tab>
<wd-tab title="已使用" :name="TeaRoomPackageOrderStatusText.Used"></wd-tab>
</wd-tabs>
</view>
</view>
<view class="tabs">
<wd-tabs v-model="tab" swipeable slidable="always" @change="OrderList.handleChangeTabs" :lazy="false">
<wd-tab title="全部" :name="TeaRoomPackageOrderStatusText.All"></wd-tab>
<wd-tab title="待使用" :name="TeaRoomPackageOrderStatusText.ToUse"></wd-tab>
<wd-tab title="已使用" :name="TeaRoomPackageOrderStatusText.Used"></wd-tab>
</wd-tabs>
</view>
<view class="content mx-30rpx mt-34rpx">
<mescroll-body ref="mescrollItem" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption">

View File

@ -85,9 +85,6 @@
</view>
</wd-popup>
<!-- 选择预定时间 -->
<booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="OrderDetail.handleChooseReserveTime"></booking-time>
<view>
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
@ -140,7 +137,7 @@
<view class="mt-28rpx pb-36rpx">
<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="mb-20rpx px-30rpx">预约时间{{ order.day_time }} {{ order.renew_dtime.start_time || order.start_time }}-{{ order.renew_dtime.end_time || order.end_time }}</view>
<view class="mb-20rpx px-30rpx">预约时间{{ order.day_time }} {{ order?.renew_dtime?.start_time || order?.start_time }}-{{ order?.renew_dtime?.end_time || order?.end_time }}</view>
<view class="flex justify-between items-center pl-30rpx" >
<view>预约时长{{ order.hours }}小时</view>
<!-- 已预约和消费中显示一键续订 -->
@ -388,14 +385,18 @@
// 一键续订的金额
const totalReserveMoney = ref<number>(0)
// 获取当前年月日格式YYYY-MM-DD
const now = new Date();
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0');
const day = String(now.getDate()).padStart(2, '0');
const currentDate = `${year}-${month}-${day}`;
onLoad(async (args) => {
orderId.value = args.orderId
// 获取订单详情
OrderDetail.handleInit()
// 预定时间
const next7 = await getNext7Days()
Object.assign(sevenDay, next7)
})
onUnload(() => {
@ -425,6 +426,11 @@
console.log("🚀 ~ order.value :", order.value )
title.value = TeaRoomOrderStatusTextValue[order.value.order_status].title || '订单详情'
orderStatus.value = order.value.order_status
// 预定时间
const next7 = await getNext7Days(order.value.room_msg.id, currentDate)
Object.assign(sevenDay, next7)
},
/**
@ -479,16 +485,6 @@
)
},
/**
* 选中预定时间
*/
handleChooseReserveTime: (params: any) => {
reserveTime.value = params
// 一键续订的金额
totalReserveMoney.value = Number(toTimes(params[3], order.value.room_price))
},
/**
* 确认一键续订
*/

View File

@ -191,7 +191,7 @@
try {
const response = JSON.parse(e.file.response)
if (response.code) {
const avatarUrl = response.data.uri
const avatarUrl = response.data.url
await updateUserInfo({ field: 'avatar', value: avatarUrl })
user.value.avatar = avatarUrl
toast.info('头像上传成功')

View File

@ -10,7 +10,7 @@
<view>
<wd-navbar safeAreaInsetTop :bordered="false" custom-style="background-color: transparent;" :height="navbarHeight">
<template #left>
<view class="h-48rpx flex items-center" @click="StoreRecharge.back">
<view class="h-48rpx flex items-center" @click="router.navigateBack()">
<wd-img width="48rpx" height="48rpx" :src="`${OSS}icon/icon_arrow_left.png`" class="mt-6rpx"></wd-img>
<view class="text-[#303133] text-36rpx ml-24rpx leading-48rpx">充值</view>
</view>
@ -34,12 +34,12 @@
</view>
</view>
<view class="text-28rpx font-400 text-[#303133] leading-40rpx mx-70rpx mt-38rpx">推广方式</view>
<!-- <view class="text-28rpx font-400 text-[#303133] leading-40rpx mx-70rpx mt-38rpx">推广方式</view>
<view class="bg-white mt-28rpx rounded-16rpx px-38rpx mx-32rpx h-150rpx flex items-center">
<view class="text-[#303133] text-30rpx font-bold leading-42rpx">门店推广</view>
<view class="flex-1 bg-[#F8F9FA] text-[#9CA3AF] rounded-8rpx ml-28rpx h-80rpx leading-80rpx rounded-8rpx pl-28rpx">{{ storeName }}</view>
</view>
</view> -->
<view @click="StoreRecharge.handleRecharge" class="fixed left-0 right-0 bottom-0 z-50 mx-60rpx flex items-center justify-center bg-[#4C9F44] rounded-8rpx text-[#fff] text-30rpx font-bold" :style="{ height: '90rpx', bottom: 'calc(env(safe-area-inset-bottom) + 26rpx)', city: canRecharge ? 1 : 0.5 }">
确定转入
@ -51,7 +51,8 @@
import { getNavBarHeight } from '@/utils/index'
import { toast } from '@/utils/toast'
import { router } from '@/utils/tools'
import { wxpay } from '@/hooks/usePay'
// import { wxpay } from '@/hooks/usePay'
import { teaRoomRecharge } from '@/api/tea-room'
let navbarHeight = ref<number>(0)
let OSS = inject('OSS')
@ -69,14 +70,24 @@
})
const StoreRecharge = {
handleRecharge: () => {
handleRecharge: async () => {
if (rechargeMoney.value) {
} else {
uni.showToast({
title: '请输入充值金额',
icon: 'none'
uni.showLoading({
title: '加载中...',
mask: true
})
try {
const res = await teaRoomRecharge(Number(rechargeMoney.value))
rechargeMoney.value = ''
uni.hideLoading()
toast.success('操作成功')
} catch(e) {
uni.hideLoading()
return false
}
} else {
toast.info('请输入转入金额')
return
}
}
}

View File

@ -8,7 +8,7 @@
<template>
<view class="pb-200rpx">
<!-- 费用明细 -->
<wd-popup v-model="showCostPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" @close="showCostPopup = false" position="bottom">
<wd-popup v-model="showCostPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" @close="showCostPopup = false" position="bottom">
<view class='bg-[#FBFBFB] py-40rpx realtive'>
<view class="absolute top-18rpx right-30rpx" @click="showCostPopup = false">
<wd-img width="60rpx" height='60rpx' :src="`${OSS}icon/icon_close.png`"></wd-img>
@ -30,10 +30,10 @@
<view>优惠</view>
<view class="text-[#4C9F44]">-{{ bill.totalDiscount }}</view>
</view>
<view class="flex justify-between items-center text-24rpx text-[#909399] leading-34rpx mt-16rpx">
<!-- <view class="flex justify-between items-center text-24rpx text-[#909399] leading-34rpx mt-16rpx">
<view>优惠券</view>
<view>-{{ bill.coupon }}</view>
</view>
</view> -->
<view class="flex justify-between items-center text-24rpx text-[#909399] leading-34rpx mt-16rpx">
<view>团购券</view>
<view>-{{ bill.groupCoupon || 0 }}</view>
@ -87,11 +87,11 @@
:indicator="{ type: 'dots-bar' }" :list="swiperList" v-model:current="current" mode="aspectFit"></wd-swiper>
</view>
<!-- 使用说明 -->
<!-- 其他说明 -->
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">使用说明</view>
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">其他说明</view>
<view class="">
<rich-text :nodes="teaRoom.textarea1"></rich-text>
<rich-text :nodes="teaRoom.other_describe"></rich-text>
</view>
</view>
@ -102,8 +102,8 @@
<view class="text-[26rpx] text-[#606266] leading-36rpx">{{ sevenDay.minimum_time }}小时起订</view>
<view class="flex items-center">
<view class="text-[28rpx] text-[#909399] leading-40rpx w-430rpx line-1 text-right">
<template v-if="reserveTime.length > 0">
{{ reserveTime[0] }} {{ reserveTime[1].join(',') }}
<template v-if="dayHours">
{{ dayTime }} {{ dayHours }}
</template>
<template v-else>
请选择
@ -117,14 +117,14 @@
</view>
<!-- 优惠券 -->
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="ChooseRoomReserve.handleToCoupon(CouponType.Discount)">
<!-- <view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="ChooseRoomReserve.handleToCoupon(CouponType.Discount)">
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">优惠券</view>
<view class="flex items-center justify-between">
<view class="text-[26rpx] text-[#606266] leading-36rpx">优惠券</view>
<view class="flex items-center">
<view class="text-[28rpx] text-[#909399] leading-40rpx">
<template v-if="selectedCoupon?.id > 0">
{{ selectedCoupon.name }}
<template v-if="dayHours">
{{ dayTime }} {{ dayHours }}
</template>
<template v-else>
请选择
@ -135,7 +135,7 @@
</view>
</view>
</view>
</view>
</view> -->
<view class="fixed left-0 right-0 bottom-0 z-2 bg-[#fff]" :style="{ height: '140rpx' }">
<view class="mt-12rpx w-full" >
@ -170,28 +170,26 @@
import { getTeaRoomDetail } from '@/api/tea-room'
import { getNext7Days, getTeaRoomBalance, createTeaRoomOrder, getTeaRoomPackageDetail, calculateTeaRoomPrice } from '@/api/tea-room'
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
import { router, toTimes, toPlus, toMinus } from '@/utils/tools'
import { router } from '@/utils/tools'
import { getUserInfo } from '@/api/user'
import { CouponType } from '@/utils/coupon'
import { ReserveServiceCategory, OrderType } from '@/utils/order'
import { OrderType } from '@/utils/order'
const OSS = inject('OSS')
// 获取当前年月日格式YYYY-MM-DD
const now = new Date();
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0');
const day = String(now.getDate()).padStart(2, '0');
const currentDate = `${year}-${month}-${day}`;
// 轮播图
const swiperList = ref<string[]>([])
const swiperList = ref<any>([])
const current = ref<number>(0)
const html: string = '<p>这里是富文本内容,需要后台传递</p>'
const showAction = ref<boolean>(false)
const sheetMenu = ref([])
const showServicePopup = ref<boolean>(false)
const storeType = ref<number>(1) // 1直营 2加盟
// 费用明细相关
const showCostPopup = ref<boolean>(false) // 费用明细popup
const showPayPopup = ref<boolean>(false) // 支付popup
// 用户信息
const userInfo = ref<IUserInfoVo>(null)
@ -215,6 +213,10 @@
time: []
})
const reserveTime = ref<Array<any>>([])
const timeSlots = ref<Array<string>>([]) // 连续选择的预约时间
const dayTitle = ref<string>('') // 周三03/18
const dayTime = ref<string>('') // 2024-03-18
const dayHours = ref<string>('') // 预定时长00:00,00:30
// 选择的优惠券
const selectedCoupon = ref<{id: number, name: string}>({id: 0, name: ''})
@ -246,7 +248,7 @@
onLoad((args) => {
storeId.value = Number(args.storeId)
id.value = Number(args.id)
id.value = Number(args.id) // 包间ID
teaRoomPrice.value = Number(args.price) || 0
groupCouponId.value = Number(args.groupCouponId) || 0
groupCouponOrderId.value = Number(args.groupCouponOrderId) || 0
@ -271,42 +273,65 @@
id: storeId.value,
latitude: uni.getStorageSync('latitude'),
longitude: uni.getStorageSync('longitude'),
room_id: id.value,
user_id: userInfo.value.id || 0
})
teaRoom.value = res.details
swiperList.value = teaRoom.value.img_arr
// 预定时间
const next7 = await getNext7Days()
Object.assign(sevenDay, next7)
// 获取门店余额
const balance = await getTeaRoomBalance({ store_id: storeId.value })
storeMoney.value = balance.data.money || 0
// 获取团购优惠券
// 获取团购详情
const coupon = await getTeaRoomPackageDetail({ id: groupCouponId.value })
groupCoupon.value = coupon.details
swiperList.value = coupon.details.img
console.log("🚀 ~ groupCoupon.value:", groupCoupon.value)
// 预定时间
const next7 = await getNext7Days(id.value, currentDate)
Object.assign(sevenDay, next7.data)
Object.assign(sevenDay, {minimum_time: teaRoom.value.room.hours})
},
/**
* 选中预定时间
*/
handleChooseReserveTime: (params: any) => {
// reserveTime.value = params
// const roomPrice = toTimes(teaRoomPrice.value, params[3])
// const useGroupCouponPrice = toTimes(teaRoomPrice.value, groupCoupon.value.hour)
// bill.value.service = {
// total: roomPrice,
// unitPrice: teaRoomPrice.value,
// num: params[3],
// startTime: params[2][0],
// endTime: params[2][params[2].length - 1],
// dayTime: params[0],
// startHour: params[1][0],
// endHour: params[1][params[1].length - 1]
// }
reserveTime.value = params
const roomPrice = toTimes(teaRoomPrice.value, params[3])
const useGroupCouponPrice = toTimes(teaRoomPrice.value, groupCoupon.value.hour)
timeSlots.value = params.selectedTimestamps
dayTitle.value = params.dayTitle
dayTime.value = params.dayTime
const times = params.selectedTime.map(item => {
return item.time
}).join(',')
dayHours.value = times
bill.value.service = {
total: roomPrice,
unitPrice: teaRoomPrice.value,
num: params[3],
startTime: params[2][0],
endTime: params[2][params[2].length - 1],
dayTime: params[0],
startHour: params[1][0],
endHour: params[1][params[1].length - 1]
total: 0,
unitPrice: 0,
num: params.countSelectedTime,
startHour: params.selectedTime[0].time,
endHour: params.selectedTime[params.selectedTime.length - 1].time
}
ChooseRoomReserve.handleCalculateTeaRoomPrice()
@ -350,16 +375,20 @@
})
try {
let res = await createTeaRoomOrder({
const params = {
store_id: storeId.value,
room_id: id.value,
day_time: bill.value.service.dayTime,
day_title: dayTitle.value,
day_time: dayTime.value,
start_time: bill.value.service.startHour,
end_time: bill.value.service.endHour,
user_coupon_id: selectedCoupon.value.id || 0,
hours: bill.value.service.num,
group_coupon_id: groupCouponOrderId.value
})
group_coupon_id: groupCouponOrderId.value,
timeslot: timeSlots.value
}
let res = await createTeaRoomOrder(params)
uni.hideLoading()

View File

@ -57,37 +57,8 @@
</view>
</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="Detail.handlePay">确定付款</view>
</view>
</wd-popup>
<!-- 选择预定时间 -->
<booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="Detail.handleChooseReserveTime"></booking-time>
<booking-time v-model="showBookTimePopup" :day="sevenDay" @selectedTime="Detail.handleChooseReserveTime"></booking-time>
<view>
<navbar :title="isGroupBuying ? '团购套餐' : '预定'" custom-class='!bg-[#F6F7F8]'></navbar>
@ -104,42 +75,51 @@
<view class="font-bold text-36rpx text-[#303133] leading-50rpx">{{ isGroupBuying ? teaRoomPackage.title : teaRoom.name }}</view>
<view class="mt-14rpx flex" v-if="!isGroupBuying">
<template v-for="(label, labelIndex) in teaRoom.label" :key="labelIndex">
<view class="mr-20rpx flex items-start" v-if="label.category_id == 1">
<wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">文艺小清新</wd-tag>
</view>
<view class="flex items-start" v-if="label.category_id == 2">
<wd-tag color="#F55726" bg-color="#F55726" plain>全息投影</wd-tag>
<view class="mr-20rpx flex items-start">
<wd-tag
:color="randomLabelColor(labelIndex)"
:bg-color="randomLabelColor(labelIndex)"
plain
custom-class="!rounded-4rpx"
>{{ label.label_name }}</wd-tag>
</view>
</template>
</view>
<view class="flex justify-between items-center" :class="`${ isGroupBuying ? 'mt-24rpx' : ''}`">
<view class="text-[#303133] text-26rpx leading-48rpx font-500" v-if="isGroupBuying">{{ teaRoomPackage.introduce }}</view>
<!-- <view class="text-[#6A6363] flex-1 text-22rpx leading-32rpx text-right">已售 10+</view> -->
<view class="text-[#6A6363] flex-1 text-22rpx leading-32rpx text-right">已售
<template v-if="isGroupBuying">
{{ teaRoomPackage.sold > 10 ? teaRoomPackage.sold + '+' : teaRoomPackage.sold }}
</template>
<template v-else>
{{ teaRoom.sold > 10 ? teaRoom.sold + '+' : teaRoom.sold }}
</template>
</view>
</view>
<view v-if="isGroupBuying">
<view class="mt-20rpx mb-24rpx" >
<wd-gap height="2rpx" bgColor="#F6F7F9"></wd-gap>
</view>
<view class="text-[#303133] text-28rpx leading-48rpx">
<rich-text :nodes="teaRoomPackage.details"></rich-text>
<!-- <view>
<!-- <rich-text :nodes="teaRoomPackage.details"></rich-text> -->
<view>
<text class="font-bold mr-26rpx">须知</text>
<text class="font-500">{{ teaRoomPackage.details }}</text>
<text class="font-500">需预约</text>
</view>
<view class="mt-22rpx">
<text class="font-bold mr-26rpx">保障</text>
<text class="font-500">随时退</text>
</view> -->
</view>
</view>
</view>
</view>
<view v-if="!isGroupBuying">
<!-- 使用说明 -->
<!-- 其他说明 -->
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">使用说明</view>
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">其他说明</view>
<view class="">
<rich-text :nodes="teaRoom.textarea1"></rich-text>
<rich-text :nodes="teaRoom.other_describe"></rich-text>
</view>
</view>
@ -147,11 +127,11 @@
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx" @click="showBookTimePopup = true">
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">预定时间</view>
<view class="flex items-center justify-between">
<view class="text-[26rpx] text-[#606266] leading-36rpx">{{ sevenDay.minimum_time }}小时起订</view>
<view class="text-[26rpx] text-[#606266] leading-36rpx">{{ teaRoom?.room?.hours }}小时起订</view>
<view class="flex items-center">
<view class="text-[28rpx] text-[#909399] leading-40rpx w-430rpx line-1 text-right">
<template v-if="reserveTime.length > 0">
{{ reserveTime[0] }} {{ reserveTime[1].join(',') }}
<template v-if="dayHours">
{{ dayTime }} {{ dayHours }}
</template>
<template v-else>
请选择
@ -211,16 +191,60 @@
<!-- 套餐详情 -->
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">套餐详情</view>
<view class="">
<rich-text :nodes="teaRoomPackage.introduce_details"></rich-text>
<view class="mt-24rpx" v-if="teaRoomPackage.introduce">
<view class="flex items-center mb-20rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_tcsm.png`"></wd-img>
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">套餐介绍</view>
</view>
<rich-text :nodes="teaRoomPackage.introduce"></rich-text>
</view>
<view class="mt-30rpx" v-if="teaRoomPackage.rests_introduce">
<view class="flex items-center mb-20rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_qtsm.png`"></wd-img>
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx"> 其他说明</view>
</view>
<rich-text :nodes="teaRoomPackage.rests_introduce"></rich-text>
</view>
</view>
<!-- 购买须知 -->
<view class="bg-white rounded-16rpx py-26rpx px-30rpx mt-24rpx mx-30rpx">
<view class="text-[#303133] text-32rpx leading-44rpx font-bold mb-24rpx">购买须知</view>
<view class="">
<rich-text :nodes="teaRoomPackage.buy_details"></rich-text>
<view class="mt-30rpx" v-if="teaRoomPackage.room_name">
<view class="flex items-center mb-20rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_sybj.png`"></wd-img>
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">适用包间</view>
</view>
<rich-text :nodes="teaRoomPackage.room_name"></rich-text>
</view>
<view class="mt-30rpx" v-if="teaRoomPackage.hour">
<view class="flex items-center mb-20rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_sysc.png`"></wd-img>
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">适用时长</view>
</view>
<view class="">{{ teaRoomPackage.hour }}小时</view>
</view>
<view class="mt-30rpx" v-if="teaRoomPackage.pl_number">
<view class="flex items-center mb-20rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_syrs.png`"></wd-img>
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">使用人数</view>
</view>
<view class="">{{ teaRoomPackage.pl_number }}</view>
</view>
<view class="mt-20rpx mb-24rpx">
<wd-gap height="2rpx" bgColor="#F6F7F9"></wd-gap>
</view>
<view class="mt-30rpx" v-if="teaRoomPackage.returd_details">
<view class="flex items-center mb-20rpx">
<wd-img width="36rpx" height="36rpx" :src="`${OSS}icon/icon_tgsm.png`"></wd-img>
<view class="font-bold text-28rpx leading-48rpx text-[#303133] ml-6rpx">退改说明</view>
</view>
<rich-text :nodes="teaRoomPackage.returd_details"></rich-text>
</view>
</view>
</view>
@ -259,7 +283,7 @@
import type { ITeaSpecialistFuture7DaysResult } from '@/api/types/tea'
import { getNext7Days, getTeaRoomBalance, createTeaRoomOrder } from '@/api/tea-room'
import { CouponType } from '@/utils/coupon'
import { router, toTimes, toPlus, toMinus } from '@/utils/tools'
import { router, toTimes, toPlus, toMinus, randomLabelColor } from '@/utils/tools'
import type { IUserInfoVo } from '@/api/types/login'
import { useUserStore } from '@/store'
import { getTeaRoomDetail, createTeaRoomPackageOrder, getTeaRoomPackageDetail, calculateTeaRoomPrice } from '@/api/tea-room'
@ -268,6 +292,13 @@
import { getUserInfo } from '@/api/user'
const OSS = inject('OSS')
// 获取当前年月日格式YYYY-MM-DD
const now = new Date();
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0');
const day = String(now.getDate()).padStart(2, '0');
const currentDate = `${year}-${month}-${day}`;
// 用户信息
const userInfo = ref<IUserInfoVo>(null)
@ -276,30 +307,6 @@
const current = ref<number>(0)
const html: string = '<p>这里是富文本内容,需要后台传递</p>'
const isGroupBuying = ref<boolean>(false)// 是否是团购套餐
const pay = ref<number>(1) // 支付方式
const payList = ref<Array<any>>([
{
id: 1,
name: '平台余额',
icon: `${OSS}icon/icon_platform_balance.png`,
balance: 0,
value: 1
},
{
id: 2,
name: '门店余额',
icon: `${OSS}icon/icon_store_balance.png`,
balance: 0,
value: 2
},
{
id: 3,
name: '微信支付',
icon: `${OSS}icon/icon_weichat.png`,
balance: 0,
value: 3
}
])
// 选择预定时间
const showBookTimePopup = ref<boolean>(false)
@ -308,6 +315,10 @@
time: []
})
const reserveTime = ref<Array<any>>([])
const timeSlots = ref<Array<string>>([]) // 连续选择的预约时间
const dayTitle = ref<string>('') // 周三03/18
const dayTime = ref<string>('') // 2024-03-18
const dayHours = ref<string>('') // 预定时长00:00,00:30
// 计算费用明细 service(服务费) coupon(优惠券) discount(会员优惠) totalDiscount(总优惠) total(总费用) groupCoupon(团购券)
const bill = ref<{service: any, discount:number, totalDiscount: number, coupon: number, groupCoupon: number, total: number}>({
@ -335,7 +346,11 @@
// 包间内容
const storeId = ref<number>(0) // 门店ID
const id = ref<number>(0) // id
const teaRoom = ref<any>({})
const teaRoom = ref<any>({
order: {
hours: 0
}
})
const teaRoomPrice = ref<number>(0)
// 门店余额
@ -351,14 +366,17 @@
// 套餐
const teaRoomPackage = ref<any>({})
// 页面类型
const pageType = ref<string>('')
onLoad((args) => {
storeId.value = Number(args.storeId)
id.value = Number(args.id)
id.value = Number(args.id) // 在茶室下这个id是包间ID在团购下是套餐ID
teaRoomPrice.value = Number(args.price) || 0
pageType.value = args.type || ''
if (args.type == ReserveServiceCategory.GroupBuying) {
isGroupBuying.value = true
pay.value = 3
Detail.handleInitGroupBuying()
}
Detail.handleInitReserveRoom()
@ -382,14 +400,20 @@
id: storeId.value,
latitude: uni.getStorageSync('latitude'),
longitude: uni.getStorageSync('longitude'),
user_id: userInfo.value.id || 0
user_id: userInfo.value.id || 0,
room_id: id.value
})
teaRoom.value = res.details
swiperList.value = teaRoom.value.img_arr
if (pageType.value == ReserveServiceCategory.ReserveRoom) {
swiperList.value = [teaRoom.value.image]
// 预定时间
const next7 = await getNext7Days(id.value, currentDate)
// disabled = 0 可预约 1不可逾越
Object.assign(sevenDay, next7.data)
Object.assign(sevenDay, {minimum_time: teaRoom.value.room.hours})
}
// 预定时间
const next7 = await getNext7Days()
Object.assign(sevenDay, next7)
// 获取门店余额
const balance = await getTeaRoomBalance({ store_id: storeId.value })
@ -402,6 +426,9 @@
handleInitGroupBuying: async () => {
const res = await getTeaRoomPackageDetail({ id: id.value })
teaRoomPackage.value = res.details
if (pageType.value == ReserveServiceCategory.GroupBuying) {
swiperList.value = teaRoomPackage.value.img
}
},
/**
@ -409,16 +436,22 @@
*/
handleChooseReserveTime: (params: any) => {
reserveTime.value = params
console.log("🚀 ~ params:", params)
timeSlots.value = params.selectedTimestamps
dayTitle.value = params.dayTitle
dayTime.value = params.dayTime
const times = params.selectedTime.map(item => {
return item.time
}).join(',')
dayHours.value = times
bill.value.service = {
total: 0,
unitPrice: 0,
num: params[3],
startTime: params[2][0],
endTime: params[2][params[2].length - 1],
dayTime: params[0],
startHour: params[1][0],
endHour: params[1][params[1].length - 1]
num: params.countSelectedTime,
startHour: params.selectedTime[0].time,
endHour: params.selectedTime[params.selectedTime.length - 1].time
}
Detail.handleCalculateTeaRoomPrice()
@ -452,15 +485,11 @@
router.navigateTo(`/bundle/coupon/coupon?id=${id.value}&numbers=${count}&type=${type}&storeId=${storeId.value}`)
},
// 选择支付方式
handleGetPayValue: (value: number) => {
pay.value = value
},
/**
* 提交订单
*/
handleSubmitOrder: async () => {
// 只有预定茶室才会选择时间
if (!isGroupBuying.value && bill.value.service.num == 0) {
toast.info('请选择预定时间')
@ -475,21 +504,24 @@
let res: any = null
if (isGroupBuying.value) {
res = await createTeaRoomPackageOrder({
group_id: id.value
group_id: id.value,
room_id: 0
})
} else {
res = await createTeaRoomOrder({
const params = {
store_id: storeId.value,
room_id: id.value,
day_time: bill.value.service.dayTime,
day_title: dayTitle.value,
day_time: dayTime.value,
start_time: bill.value.service.startHour,
end_time: bill.value.service.endHour,
user_coupon_id: selectedCoupon.value.id || 0,
hours: bill.value.service.num,
group_coupon_id: selectedGroupCoupon.value.id || 0
})
group_coupon_id: selectedGroupCoupon.value.id || 0,
timeslot: timeSlots.value
}
res = await createTeaRoomOrder(params)
}
uni.hideLoading()
// 支付后的处理
@ -540,7 +572,7 @@
bill.value.totalDiscount = res.details.discount_all_price // 总优惠
bill.value.groupCoupon = res.details.group_price // 团购优惠
bill.value.total = res.details.order_amount // 订单金额
}
},
}
</script>

View File

@ -48,7 +48,7 @@
<view @click="Room.handleToRecharge">
<recharge-btn name="充值"></recharge-btn>
</view>
<view class="text-24rpx text-[#818CA9] mt-18rpx">{{ teaRoom.rechange_times }} 分钟前有人充值</view>
<!-- <view class="text-24rpx text-[#818CA9] mt-18rpx">{{ teaRoom.rechange_times }} 分钟前有人充值</view> -->
</view>
</view>
<view class="mt-26rpx">
@ -80,12 +80,29 @@
<wd-gap bg-color="#F6F7F9" height="20rpx"></wd-gap>
</view>
<view class="tabs">
<wd-tabs v-model="tab" swipeable slidable="always" @change="Room.handleChangeTab" :lazy="false">
<wd-tabs ref="tabsRef" v-model="tab" swipeable slidable="always" @change="Room.handleChangeTab" :lazy="false" :duration="0">
<wd-tab title="茶室预定" v-if="storeType != 2"></wd-tab>
<wd-tab title="团购套餐"></wd-tab>
<wd-tab title="抖音兑换" v-if="storeType != 2"></wd-tab>
</wd-tabs>
<view class="mx-30rpx mt-34rpx">
<view class="text-24rpx flex items-center justify-end" v-if="storeType != 2">
<view class="flex items-center mr-12rpx">
<view class="bg-[#C9C9C9] w-20rpx h-20rpx rounded-10rpx mr-10rpx"></view>
<view>过期</view>
</view>
<view class="flex items-center mr-12rpx">
<view class="bg-[#4C9F44] w-20rpx h-20rpx rounded-10rpx mr-10rpx"></view>
<view>可预约</view>
</view>
<view class="flex items-center mr-12rpx">
<view class="bg-[#F55726] w-20rpx h-20rpx rounded-10rpx mr-10rpx"></view>
<view>已预约</view>
</view>
</view>
<mescroll-body @init="mescrollInit" @down="downCallback" :down="downOption" :up="upOption" @up="Room.upCallback">
<room-list :is-reserve="tabIndexs === 0" :is-group-buying="tabIndexs === 1" :list="list"></room-list>
</mescroll-body>
@ -123,11 +140,7 @@
const rightPadding = inject('capsuleOffset')
const OSS = inject('OSS')
const swiperList = ref<string[]>([
`${OSS}images/banner1.png`,
`${OSS}images/banner1.png`,
`${OSS}images/banner1.png`
])
const swiperList = ref<string[]>([])
const current = ref<number>(0)
// 茶室ID
@ -139,6 +152,7 @@
// tab
const tab = ref<number>(0)
const tabsRef = ref()
// 弹窗
const showAction = ref<boolean>(false)
@ -159,6 +173,15 @@
const list = ref<Array<any>>([])
const tabIndexs = ref<number>(0)
// 随机颜色列表
const tagColors = ['#40AE36', '#F55726']
onShow(() => {
// 刷新茶室详情
list.value = []
getMescroll().resetUpScroll()
})
onLoad((args) => {
console.log("🚀 ~ args:", uni.getStorageSync('latitude'), uni.getStorageSync('longitude'))
if (args.id) {
@ -227,7 +250,7 @@
teaRoom.value = res.details
storeType.value = teaRoom.value.operation_type
swiperList.value = teaRoom.value.img_arr
swiperList.value = teaRoom.value.image_arr
},
/**
@ -317,6 +340,23 @@
* tab切换获取index
*/
handleChangeTab: (item: { index: number }) => {
console.log("🚀 ~ item.index:", item.index)
if (item.index == 2) {
uni.showLoading({ title: '跳转中...' })
// 直营店抖音兑换强制切回第一个tab
nextTick(() => {
if (tabsRef.value && typeof tabsRef.value.setActive === 'function') {
tabsRef.value.setActive(0, false, true)
}
})
tab.value = 0
tabIndexs.value = 0
router.navigateTo(`/bundle/order/douyin/excharge?storeId=${teaRoomId.value}`, 200)
uni.hideLoading()
return
}
tabIndexs.value = item.index
list.value = []
getMescroll().resetUpScroll()

View File

@ -31,11 +31,6 @@
<wd-img width="50rpx" height="50rpx" :src="`${OSS}${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>
</block>
</wd-radio-group>
@ -43,7 +38,7 @@
</view>
<!-- 推广方式 -->
<view class="mt-60rpx">
<!-- <view class="mt-60rpx">
<view class="mx-30rpx text-32rpx leading-44rpx text-[#303133]">推广方式</view>
<view class="bg-white rounded-16rpx py-26rpx mt-28rpx pay-tabs">
<wd-tabs v-model="tab" swipeable slidable="always">
@ -73,7 +68,7 @@
</wd-tab>
</wd-tabs>
</view>
</view>
</view> -->
<view class="fixed left-0 right-0 bottom-92rpx z-2 bg-[#4C9F44] text-[#fff] flex justify-center items-center h-90rpx rounded-8rpx mx-60rpx" @click="buy.handleBuyVip">
立即购买
@ -114,6 +109,9 @@
<script lang="ts" setup>
import { PayList, PayCategory, PayValue } from '@/utils/pay'
import { wechatPay } from '@/hooks/usePay'
import { prePay, balancePay } from '@/api/pay'
import { toast } from '@/utils/toast'
const pay = ref<number>(PayValue.WeChatPay) // 默认微信支付方式
const OSS = inject('OSS')
@ -141,10 +139,41 @@
},
// 购买会员
handleBuyVip: () => {
uni.navigateTo({
url: '/pages/notice/pay?type=vip'
})
handleBuyVip: async () => {
uni.showLoading({ title: '支付中...' })
try {
// 预支付
const pay = await prePay({
from: 'wx',
order_id: 0,
pay_way: 2,
order_source: 1, //订单来源1-小程序; 2-h5; 3app
order_type: 3 // 0为茶艺师 1为茶室包间 2为茶室套餐
})
wechatPay(pay.pay.config).then((res) => {
uni.hideLoading()
if (res === 'success') {
toast.success('支付成功')
setTimeout(() => {
uni.navigateBack()
}, 800)
return
} else if (res === 'cancel') {
toast.info('已取消支付')
return
} else {
toast.info('支付失败,请重试')
return
}
}).catch(() => {
uni.hideLoading()
toast.info('支付失败,请重试')
})
} catch (error) {
uni.hideLoading()
toast.info('支付失败,请重试')
}
}
}
</script>

View File

@ -36,9 +36,9 @@
<view class="font-400 text-28rpx leading-40rpx text-[#303133]">余额</view>
<view class="flex justify-between items-center mt-24rpx">
<view>
<price-format color="#000" :first-size="48" :second-size="48" :subscript-size="28" :price="23.02"></price-format>
<price-format color="#000" :first-size="48" :second-size="48" :subscript-size="28" :price="userMoney"></price-format>
</view>
<view class="w-200rpx h-80rpx bg-[#4C9F44] rounded-8rpx font-bold text-28rpx leading-80rpx text-center text-[#fff]" @click="wallet.handleToRecharge">
<view class="w-200rpx h-80rpx bg-[#4C9F44] rounded-8rpx font-bold text-28rpx leading-80rpx text-center text-[#fff]" @click="Wallet.handleToRecharge">
充值
</view>
</view>
@ -53,7 +53,7 @@
<view class="border-2rpx border-solid border-[#E5E5E5] w-196rpx h-56rpx flex justify-center items-center rounded-8rpx">
<view class="text-24rpx leading-34rpx text-[#606266] wall-date">
<!-- 2019年5月 -->
<wd-datetime-picker v-model="value" :maxDate="Date.now()" type="year-month" @confirm="wallet.handleConfirmDate"></wd-datetime-picker>
<wd-datetime-picker v-model="value" :maxDate="Date.now()" type="year-month" @confirm="Wallet.handleConfirmDate"></wd-datetime-picker>
</view>
<view>
<wd-icon name="fill-arrow-down" size="32rpx" color="#BFC2CC"></wd-icon>
@ -63,22 +63,23 @@
<view>
<!-- 最后一个元素不显示border -->
<mescroll-body @init="mescrollInit" @down="downCallback" @up="wallet.upCallback" :up="upOption">
<view class="h-144rpx leading-144rpx mt-18rpx border-b border-b-solid border-b-[#E5E5E5] flex flex-col justify-center" @click="wallet.handleToBillDetail(item)" v-for="(item, index) in 5" :key="index">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Wallet.upCallback" :up="upOption">
<view
v-for="item in list" :key="item.id"
class="h-144rpx leading-144rpx mt-18rpx border-b border-b-solid border-b-[#E5E5E5] flex flex-col justify-center"
@click="Wallet.handleToBillDetail(item)">
<view class="text-28rpx leading-40rpx text-[#303133] flex justify-between items-center">
<view>茶艺师预定</view>
<view>-402.33</view>
<view>{{ item.remark }}</view>
<view>{{ item.action == 1 ? '+' : '-' }}{{ item.amount }}</view>
</view>
<view class="text-24rpx leading-34rpx text-[#909399] flex justify-between items-center mt-10rpx">
<view>2025-03-18 11:20</view>
<view>余额24.55</view>
<view>{{ item.create_time }}</view>
<view>余额{{ item.after_amount }}</view>
</view>
</view>
</mescroll-body>
</view>
</view>
</view>
</template>
@ -86,80 +87,83 @@
<script lang="ts" setup>
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
import { useUserStore } from '@/store'
import { getUserInfo, getUserMoneyLog } from '@/api/user'
const OSS = inject('OSS')
const userStore = useUserStore()
/* mescroll */
const upOption = reactive({
empty: {
icon : OSS + 'icon/icon_reserver_empty.png',
}
})
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
const downOption = {
auto: true
}
const upOption = {
auto: true,
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
}
const list = ref<Array<any>>([]) // 茶室列表
const userMoney = ref<number>(0) // 用户余额
// 日期过滤
const value = ref<number>(Date.now())
const selectTime = ref<string>('')
onShow(() => {
getUserInfo().then(res => {
userMoney.value = Number(res.user_money)
})
})
const wallet = {
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
const Wallet = {
/**
* 上拉加载
* @param mescroll
*/
upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容
// list({
// page: mescroll.num,
// size: mescroll.size
// }).then((res: { list: Array<any>, totalPages: Number }) => {
// const curPageData = res.list || [] // 当前页数据
// if(mescroll.num == 1) goods.value = []; // 第一页需手动制空列表
// goods.value = goods.value.concat(curPageData); //追加新数据
const filter = {
page: mescroll.num,
size: mescroll.size,
month: selectTime.value
}
// console.log("🚀 ~ goods:", goods)
// mescroll.endByPage(curPageData.length, res.totalPages); //必传参数(当前页的数据个数, 总页数)
// }).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(); // 请求失败, 结束加载
// })
getUserMoneyLog(filter).then((res) => {
const curPageData = res.list || [] // 当前页数据
if(mescroll.num == 1) list.value = [] // 第一页需手动制空列表
list.value = list.value.concat(curPageData) //追加新数据
mescroll.endSuccess(curPageData.length, Boolean(res.more))
}).catch(() => {
mescroll.endErr() // 请求失败, 结束加载
})
},
// 确认日期-
/**
* 日期筛选
* @param date
*/
handleConfirmDate: (date: {value: number}) => {
const d = new Date(date.value)
console.log("🚀 ~ d:", d)
const year = d.getFullYear()
const month = d.getMonth() + 1
console.log(`${year}${month}`);
selectTime.value = `${year}-${month < 10 ? '0' + month : month}`
// 切换tab时,重置当前的mescroll
list.value = []
getMescroll().resetUpScroll();
},
// 去充值
/**
* 去充值
*/
handleToRecharge: () => {
uni.navigateTo({
url: '/bundle/wallet/recharge'
})
},
// 跳转对应账单详情
/**
* 跳转对应账单详情
*/
handleToBillDetail: (id: number) => {
uni.navigateTo({
url: `/bundle/wallet/bill?id=${id}`