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

完善页面

Browse Source
This commit is contained in:
wangxiaowei
2025-09-18 17:30:41 +08:00
parent e9f804b373
commit 864c40aa3a
26 changed files with 1357 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

175
src/bundle/collect/collect.vue Normal file
View File

@ -0,0 +1,175 @@
<route lang="jsonc" type="page">
{
// "needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="pb-180rpx">
<view>
<navbar title="收藏" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view>
<view class="coupon-tab">
<wd-tabs v-model="tab" swipeable slidable="always" @click="collect.handleChangeTab" :lazy="false">
<wd-tab title="茶室">
<view class="relative p-20rp mb-24rpx" v-for="(item, index) in 100" :key="index" @click="collect.handleToTeaRoom(item)">
<view class="absolute top--28rpx left-0 z-1">
<wd-img width="110rpx" height="110rpx" :src="`${OSS}images/home/home_image4.png`"/>
</view>
<view class="mx-30rpx p-30rpx flex bg-white rounded-10rpx">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`" radius="10rpx" />
<view class="flex-1 ml-28rpx flex justify-between line-1 items-start relative">
<view class="line-1">
<view class="font-bold text-30rpx leading-42rpx flex justify-between items-center w-400rpx">
<view class="w-300rpx line-1">
凝香茶业
</view>
<view @click.stop="collect.handleCancelTeaRoom(item)">
<wd-icon name="heart-filled" size="22px" color="#F65353"></wd-icon>
</view>
</view>
<view class="font-400 text-[#F29747] text-24rpx leading-34rpx mt-10rpx">
100+收藏
</view>
<view class="flex items-center mt-12rpx leading-34rpx">
<view class="font-400 text-[#606266] text-24rpx mr-10rpx">
营业时间:00:00-23:59
</view>
<view class="font-400 bg-[#FFEEED] text-[#FF5951] text-22rpx px-4rpx rounded-4rpx border-[#F2E2E1]">
打烊了
</view>
</view>
<view class="flex items-center mt-20rpx">
<wd-img width="26rpx" height="26rpx" :src="`${OSS}icon/icon_location.png`"
mode="aspectFit" />
<view class="ml-4rpx line-1 font-400 text-22rpx text-[#606266] leading-32rpx">
青浦区仓路478号
</view>
</view>
</view>
</view>
</view>
</view>
</wd-tab>
<wd-tab title="茶艺师">
<view class="flex items-center bg-white p-20rpx rounded-10rpx mx-30rpx mb-20rpx">
<view class="mr-28rpx relative">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/home/home_image5.png`"></wd-img>
<view class="tea-specialist-time absolute top-6rpx left-0 text-[#fff] font-400 text-18rpx leading-26rpx flex items-center justify-center">
可约9:00
</view>
</view>
<view class="flex-1">
<view class="flex items-center justify-between">
<view class="font-bold text-[#303133] text-30rpx leading-42rpx mr-14rpx">
凝香茶业
</view>
<view class="w-168rpx h-40rpx relative mr-44rpx">
<view class="absolute left-0 top-0 h-36rpx flex items-start">
<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 @click.stop="collect.handleCancelTeaRoom(1)">
<wd-icon name="heart-filled" size="22px" color="#F65353"></wd-icon>
</view>
</view>
<view class="flex items-center">
<view class="mr-12rpx">
<wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">上门服务</wd-tag>
</view>
<view class="mr-12rpx">
<wd-tag color="#F55726" bg-color="#F55726" plain>到点服务</wd-tag>
</view>
<view class="mr-12rpx">
<wd-tag color="#818CA9" bg-color="#F3F3F3">28岁</wd-tag>
</view>
<view class="flex items-center mt-8rpx">
<wd-img :src="`${OSS}icon/icon_woman.png`" width="28rpx" height="28rpx"></wd-img>
</view>
</view>
<view class="font-400 text-[#F29747] text-24rpx leading-34rpx mt-20rpx">
100+收藏
</view>
<view class="font-400 text-[#FF5951] text-26rpx leading-40rpx">
<text class="text-32rpx">￥180</text>
<text class="text-24rpx">/小时</text>
</view>
</view>
</view>
</wd-tab>
</wd-tabs>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import {ref} from 'vue'
import {toast} from '@/utils/toast'
const tab = ref<number>(0)
const OSS = inject('OSS')
onLoad((args) => {
})
const collect = {
// 切换tab
handleChangeTab: (item: any) => {
tab.value = item.index
},
// 去茶室的详情
handleToTeaRoom: (item: any) => {
uni.navigateTo({
url: '/bundle/tea-room/room?id=1'
})
},
// 取消收藏
handleCancelTeaRoom: (item: any) => {
toast.info('取消收藏成功')
},
// 取消收藏茶艺师
handleCancelTeaSpecialist: (item: any) => {
toast.info('取消收藏成功')
}
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.coupon-tab {
:deep() {
.wd-tabs,
.wd-tabs__nav,
.wd-tabs__line {
background-color: transparent;
}
}
}
.tea-specialist-time {
width: 106rpx;
height: 38rpx;
background-image: url(#{$OSS}images/collect/collect_image1.png);
background-size: 100% 100%;
}
</style>

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

@ -29,6 +29,7 @@
:key="item.id"
:coupon="item"
canUse
showChecked
:checked="item.id === checkedId"
:onCheck="coupons.handleCheck"
:class="index !== couponList.length - 1 ? 'mb-20rpx' : ''"
@ -48,6 +49,7 @@
:key="item.id"
:coupon="item"
:canUse="false"
showChecked
:checked="item.id === checkedId"
:onCheck="coupons.handleCheck"
:class="index !== couponList.length - 1 ? 'mb-20rpx' : ''"

144
src/bundle/coupon/my-coupon.vue Normal file
View File

@ -0,0 +1,144 @@
<route lang="jsonc" type="page">
{
// "needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="pb-180rpx">
<view>
<navbar title="优惠券" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view>
<view class="coupon-tab">
<wd-tabs v-model="tab" swipeable slidable="always" @click="myCoupon.handleChangeTab" :lazy="false">
<wd-tab title="茶室优惠券">
<view class="mx-30rpx">
<view class="flex">
<view v-for="(item, index) in tag" :key="index"
@click="myCoupon.handleChangeTag(item)"
class="font-400 text-28rpx leading-40rpx w-116rpx h-64rpx flex justify-center items-center border-2rpx border-solid rounded-12rpx mr-20rpx"
:class="item === currentTag ? ' border-[#4C9F44] bg-[#F0F6EF] text-[#4C9F44]' : 'border-[#fff] bg-[#fff]'">
{{ item }}
</view>
</view>
<view class="mt-32rpx">
<coupon
v-for="(item, index) in couponList"
:key="item.id"
:coupon="item"
canUse
:showChecked="false"
:checked="item.id === checkedId"
:onCheck="myCoupon.handleCouponCheck"
:class="index !== couponList.length - 1 ? 'mb-20rpx' : ''"
></coupon>
</view>
</view>
</wd-tab>
<wd-tab title="茶艺师优惠券">
<view class="mx-30rpx">
<view class="flex">
<view v-for="(item, index) in tag" :key="index"
@click="myCoupon.handleChangeTag(item)"
class="font-400 text-28rpx leading-40rpx w-116rpx h-64rpx flex justify-center items-center border-2rpx border-solid rounded-12rpx mr-20rpx"
:class="item === currentTag ? ' border-[#4C9F44] bg-[#F0F6EF] text-[#4C9F44]' : 'border-[#fff] bg-[#fff]'">
{{ item }}
</view>
</view>
<view class="mt-32rpx">
<coupon
v-for="(item, index) in couponList"
:key="item.id"
:coupon="item"
canUse
:showChecked="false"
:checked="item.id === checkedId"
:onCheck="myCoupon.handleCouponCheck"
:class="index !== couponList.length - 1 ? 'mb-20rpx' : ''"
></coupon>
</view>
</view>
</wd-tab>
</wd-tabs>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import {ref} from 'vue'
import Coupon from '@/components/coupon/Coupon.vue'
import GroupCoupon from '@/components/coupon/GroupCoupon.vue'
//
const tab = ref<number>(0)
const tag = ref<Array<string>>(['全部', '快过期', '已使用'])
const currentTag = ref<string>('全部')
const couponType = ref<number>(2) // couponType 1:优惠券 2:团购券
const OSS = inject('OSS')
const couponList = ref([
{ id: 1, amount: 20, limit: 100, expire: '2024.08.20' },
{ id: 2, amount: 10, limit: 50, expire: '2024.08.25' }
])
const checkedId = ref<number>(0)
const unCouponList = ref([
{ id: 1, amount: 20, limit: 100, expire: '2024.08.20' },
{ id: 2, amount: 10, limit: 50, expire: '2024.08.25' }
])
onLoad((args) => {
if (args.type) {
couponType.value = args.type
}
})
const myCoupon = {
// 切换tab
handleChangeTab: (index: number) => {
tab.value = index
currentTag.value = '全部'
},
// 切换tag
handleChangeTag: (item: string) => {
currentTag.value = item
console.log("🚀 ~ currentTag.value :", currentTag.value )
},
// 选择优惠券-保留这个函数，暂时用不着
handleCouponCheck: (id: number) => {
checkedId.value = id
}
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.coupon-tab {
:deep() {
.wd-tabs,
.wd-tabs__nav,
.wd-tabs__line {
background-color: transparent;
}
.wd-tabs__nav-item.is-active {
font-size: 32rpx !important;
}
}
}
</style>

2
src/bundle/order/platform/direct-order-detail.vue
View File

@ -213,7 +213,7 @@
// 跳转到立即预定页面(选择茶室)
handleToChooseTeaRoom: () => {
uni.navigateTo({
url: `/bundle/reserve-room/choose-room`
url: `/bundle/tea-room/choose-room`
})
},

2
src/bundle/order/reserve-room/order-detail.vue → src/bundle/order/tea-room/order-detail.vue
View File

@ -9,14 +9,12 @@
<template>
<view class="pb-254rpx">
<!-- 平台团购直营店 -->
<view>
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view class="text-[#909399] text-26rpx leading-36rpx mx-102rpx mb-40rpx">
<text v-if="orderStatus === ReserveCategoryOrderStatus.Consuming || orderStatus === ReserveCategoryOrderStatus.Reserved">使用过程中有任何问题，请联系客服</text>
<text v-if="orderStatus === ReserveCategoryOrderStatus.Reserved">使用过程中有任何问题，请联系客服</text>
</view>
<view class="mx-30rpx coupon-bg" >

166
src/bundle/order/tea-room/order-list.vue Normal file
View File

@ -0,0 +1,166 @@
<route lang="jsonc" type="page">{
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}</route>
<template>
<view class="">
<view class="order-list">
<navbar layoutLeft>
<template #left>
<view class="flex items-center ml-24rpx">
<view @click.stop="orderList.handleChangeMenu(item.type)" class="mr-28rpx" :class="item.type == currentType ? 'text-36rpx text-[#303133] leading-50rpx' : 'text-32rpx text-[#606266] leading-44rpx font-400'" v-for="(item, index) in menuList" :key="index">
{{ item.title }}
</view>
</view>
</template>
</navbar>
<view class="bg-white pb-20rpx">
<wd-search v-model="keywords" placeholder="搜索订单信息" hide-cancel placeholder-left custom-class="!h-72rpx"/>
</view>
</view>
<view class="tabs">
<wd-tabs v-model="tab" swipeable slidable="always" @change="orderList.handleChangeTab" :lazy="false">
<wd-tab title="全部">
<view class="content mx-30rpx mt-34rpx">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="orderList.upCallback">
<view class="mb-20rpx" v-for="(item, index) in 10" :key="index">
<combo-card></combo-card>
</view>
</mescroll-body>
</view>
</wd-tab>
<wd-tab title="待使用">
<view class="content mx-30rpx mt-34rpx">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="orderList.upCallback">
</mescroll-body>
</view>
</wd-tab>
<wd-tab title="已使用">
<view class="content mx-30rpx mt-34rpx">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="orderList.upCallback">
</mescroll-body>
</view>
</wd-tab>
</wd-tabs>
</view>
</view>
</template>
<script lang="ts" setup>
import ComboCard from '@/components/order/ComboCard.vue'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
/* mescroll */
const { mescrollInit, downCallback } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
// 菜单
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 orderList = {
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
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); //追加新数据
// 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(); // 请求失败, 结束加载
// })
},
// 切换菜单
handleChangeMenu: (type: number) => {
currentType.value = type
console.log("🚀 ~ currentType.value:", currentType.value)
},
// 切换tab
handleChangeTab: (e: any) => {
tab.value = e.index
}
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.tabs {
:deep() {
.wd-tabs,
.wd-tabs__nav {
background-color: transparent !important;
}
.wd-tabs__nav-item {
font-weight: 400 !important;
font-size: 28rpx !important;
color: #606266 !important;
line-height: 40rpx !important;
padding: 0 30rpx !important;
}
.wd-tabs__nav-item.is-active {
font-weight: 500 !important;
color: #303133 !important;
font-size: 32rpx !important;
line-height: 44rpx !important;
}
}
}
</style>

6
src/bundle/reserve-room/choose-room-reserve.vue → src/bundle/tea-room/choose-room-reserve.vue
View File

@ -118,18 +118,14 @@
const OSS = inject('OSS')
/** 轮播图 **/
// 轮播图
const swiperList = ref<string[]>([
`${OSS}images/banner1.png`,
`${OSS}images/banner1.png`,
`${OSS}images/banner1.png`
])
const current = ref<number>(0)
/** 结束 **/
/** 轮播图 **/
const showBookTimePopup = ref<boolean>(false)
/** 结束 **/
const html: string = '<p>这里是富文本内容，需要后台传递</p>'

0
src/bundle/reserve-room/choose-room.vue → src/bundle/tea-room/choose-room.vue
View File

0
src/bundle/reserve-room/detail.vue → src/bundle/tea-room/detail.vue
View File

0
src/bundle/reserve-room/room.vue → src/bundle/tea-room/room.vue
View File

15
src/bundle/vip-benefits/vip-benefits.vue → src/bundle/vip/benefits.vue
View File

@ -1,6 +1,6 @@
<route lang="jsonc" type="page">
{
// "needLogin": true,
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
@ -18,7 +18,7 @@
<!-- 背景图 -->
<view class="flex justify-center">
<view class="relative">
<view class="">
<view>
<wd-img width="692rpx" height="328rpx" :src="`${OSS}images/vip_benefits/vip_benefits_image2.png`" mode="aspectFill" v-if="currentVipType === 'normal'"></wd-img>
<wd-img width="692rpx" height="328rpx" :src="`${OSS}images/vip_benefits/vip_benefits_image2.png`" mode="aspectFill" v-if="currentVipType === 'vip'"></wd-img>
<wd-img width="692rpx" height="328rpx" :src="`${OSS}images/vip_benefits/vip_benefits_image3.png`" mode="aspectFill" v-if="currentVipType === 'partner'"></wd-img>
@ -101,7 +101,7 @@
</view>
</view>
<view class="btn text-center leading-108rpx mx-auto mt-116rpx">
<view class="btn text-center leading-108rpx mx-auto mt-116rpx" @click="benefits.handledToBuyVip" v-if="currentVipType === 'normal'">
立即成为会员 ￥499/年
</view>
</view>
@ -119,11 +119,16 @@
onLoad(() => {
// 模拟获取用户身份
setTimeout(() => {
currentVipType.value = 'partner'
currentVipType.value = 'normal'
}, 1000)
})
const vipBenefits = {
const benefits = {
handledToBuyVip: () => {
uni.navigateTo({
url: '/bundle/vip/buy'
})
}
}
</script>

165
src/bundle/vip/buy.vue Normal file
View File

@ -0,0 +1,165 @@
<route lang="jsonc" type="page">
{
// "needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="bg">
<view>
<navbar title="购买会员" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view class="mt-24rpx mx-30rpx">
<view class="text-center">
<view class="text-48rpx leading-66rpx text-[#303133]">￥499.00</view>
<view class="mt-20rpx text-28rpx leading-40rpx text-[#9CA3AF]">开通会员，解锁更多精彩内容！</view>
</view>
<!-- 支付方式 -->
<view class="mt-66rpx">
<view class="mx-30rpx text-32rpx leading-44rpx text-[#303133]">支付方式</view>
<view class="bg-white rounded-16rpx px-30rpx py-26rpx mt-22rpx">
<wd-radio-group v-model="pay" shape="dot" checked-color="#4C9F44">
<block v-for="(item, index) in PayList" :key="index">
<view class="flex justify-between items-center" v-if="item.type === PayCategory.WeChatPay">
<view class="flex items-center">
<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>
</view>
</view>
<!-- 推广方式 -->
<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">
<wd-tab title="门店">
<view>
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
<view class="mx-30rpx mt-34rpx flex items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-28rpx">门店推广</view>
<view class="bg-[#F8F9FA] px-28rpx p-20rpx text-30rpx text-[#C9C9C9] h-80rpx rounded-8rpx flex items-center flex-1" @click="showStorePopup = true">
<text class="mr-14rpx">请选择门店</text>
<wd-icon name="arrow-down" size="22rpx"></wd-icon>
</view>
</view>
</wd-tab>
<wd-tab title="个人">
<view>
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
<view class="mx-30rpx mt-34rpx flex items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-28rpx">个人推广</view>
<view class="flex items-center flex-1">
<wd-input type="text" v-model="person" no-border custom-class="!bg-[#F6F7F8] !rounded-8rpx w-full" custom-input-class="!px-32rpx !h-80rpx">
</wd-input>
</view>
</view>
</wd-tab>
</wd-tabs>
</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">
立即购买
</view>
</view>
<!-- 选择门店 -->
<wd-popup v-model="showStorePopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative">
<view class="absolute top-18rpx right-30rpx" @click="showStorePopup = 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 pt-50rpx pb-40rpx">选择门店</view>
<scroll-view scroll-y class="h-500rpx pb-20rpx">
<view class="mx-56rpx" v-for="(item, index) in 5" :key="index">
<view class="flex items-center justify-between mb-66rpx" @click="buy.handleChooseStore(item)">
<view class="mr-32rpx">
<wd-img width="80rpx" height='80rpx' :src="`${OSS}icon/icon_location3.png`"></wd-img>
</view>
<view class="flex-1">
<view>这是茶馆名字</view>
<view class="text-28rpx leading-40rpx text-[#909399] flex items-center mt-10rpx">
<view>距您5.3km</view>
<view>
<wd-divider vertical />
</view>
<view class="w-350rpx line-1">北京市海淀区宏福苑西区20号楼2单元30</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</wd-popup>
</view>
</template>
<script lang="ts" setup>
import { PayList, PayCategory, PayValue } from '@/utils/pay'
const pay = ref<number>(PayValue.WeChatPay) // 默认微信支付方式
const OSS = inject('OSS')
// 三种权益身份(普通会员、VIP会员、合伙人)
const vipTypes = ['normal', 'vip', 'partner']
const currentVipType = ref<string>('normal') // 当前权益身份
// 推广方式
const tab = ref<number>(0)
const person = ref<string>('') // 个人推广码
const showStorePopup = ref<boolean>(false) // 显示门店列表弹窗
onLoad(() => {
// 模拟获取用户身份
setTimeout(() => {
currentVipType.value = 'partner'
}, 1000)
})
const buy = {
// 选择门店
handleChooseStore: (item: any) => {
},
// 购买会员
handleBuyVip: () => {
uni.navigateTo({
url: '/pages/notice/pay?type=vip'
})
}
}
</script>
<style lang="scss" scoped>
page {
background: $cz-page-background;
}
.pay-tabs {
:deep() {
.wd-tabs__line {
background-color: #4C9F44;
}
}
}
</style>

75
src/bundle/wallet/bill.vue Normal file
View File

@ -0,0 +1,75 @@
<route lang="jsonc" type="page">{
// "needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}</route>
<template>
<view class="pb-30rpx">
<view class="order-list">
<navbar title="账单详情" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<!-- 订单详情 -->
<view class="mt-28rpx mx-32rpx bg-white rounded-16rpx py-30rpx">
<view class="flex items-center">
<view class="w-8rpx h-32rpx bg-[#4C9F44] mr-22rpx"></view>
<view class="font-bold text-28rpx leading-40rpx text-[#303133]">订单号：1744601722882174</view>
</view>
<view class="mt-16rpx mb-20rpx border-b-2rpx border-b-solid border-[#E5E5E5] mx-18rpx"></view>
<view class="text-28rpx leading-40rpx text-[#606266] mx-28rpx">
<view class="flex justify-between items-center mb-16rpx">
<view>消费类型</view>
<view>茶艺师预定</view>
</view>
<view class="flex justify-between items-center mb-16rpx">
<view>交易方式</view>
<view>微信支付</view>
</view>
<view class="flex justify-between items-center mb-16rpx">
<view>消费金额</view>
<view>￥158</view>
</view>
</view>
<view class="mt-26rpx mb-20rpx border-b-2rpx border-b-dashed border-[#E5E5E5] mx-18rpx"></view>
<view class="text-28rpx leading-40rpx text-[#606266] mx-28rpx">
<view class="flex justify-between items-center mb-16rpx">
<view>茶艺师</view>
<view>茶艺师的昵称</view>
</view>
<!-- 如果是茶室预定类型则显示消费门店 -->
<view class="flex justify-between items-center mb-16rpx">
<view>消费门店</view>
<view>茶艺师的昵称</view>
</view>
<view class="flex justify-between items-center mb-16rpx">
<view>下单时间</view>
<view>2025-04-25 04:43</view>
</view>
<view class="flex justify-between items-center mb-16rpx">
<view>支付时间</view>
<view>2025-04-25 04:43</view>
</view>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
const OSS = inject('OSS')
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
</style>

156
src/bundle/wallet/recharge.vue Normal file
View File

@ -0,0 +1,156 @@
<route lang="jsonc" type="page">
{
// "needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="bg">
<view>
<navbar title="充值" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view class="mt-24rpx mx-30rpx">
<view class="ml-70rpx flex items-center">
<view class="mr-72rpx font-400 text-30rpx leading-42rpx text-[#303133]">
转入方式
</view>
<view class="flex items-center">
<view class="flex items-center mr-20rpx">
<wd-img width="50rpx" height="50rpx" :src="`${OSS}icon/icon_weichat.png`"></wd-img>
</view>
<view class="font-bold text-32rpx leading-44rpx text-[#303133]">微信</view>
</view>
</view>
<view class="bg-white rounded-16rpx px-38rpx py-28rpx mt-28rpx">
<view class="font-400 text-28rpx leading-40rpx text-[#303133]">
转入方式
</view>
<view class="flex items-center">
<view class="font-400 text-36rpx leading-50rpx text-[#303133] mr-20rpx mt-40rpx">￥</view>
<view class="mt-44rpx">
<wd-input type="text" v-model="person" placeholder="请输入金额" no-border custom-input-class="!h-80rpx !text-48rpx !leading-66rpx" >
</wd-input>
</view>
</view>
</view>
<!-- 推广方式 -->
<view class="mt-60rpx">
<view class="mx-30rpx text-32rpx leading-44rpx text-[#303133]">
<text class="mr-12rpx">推广方式</text>
<text class="text-26rpx leading-36rpx text-[#909399]">(选填)</text>
</view>
<view class="bg-white rounded-16rpx py-26rpx mt-28rpx pay-tabs">
<wd-tabs v-model="tab" swipeable slidable="always">
<wd-tab title="门店">
<view>
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
<view class="mx-30rpx mt-34rpx flex items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-28rpx">门店推广</view>
<view class="bg-[#F8F9FA] px-28rpx p-20rpx text-30rpx text-[#C9C9C9] h-80rpx rounded-8rpx flex items-center flex-1" @click="showStorePopup = true">
<text class="mr-14rpx">请选择门店</text>
<wd-icon name="arrow-down" size="22rpx"></wd-icon>
</view>
</view>
</wd-tab>
<wd-tab title="茶艺师">
<view>
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
<view class="mx-30rpx mt-34rpx flex items-center">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-28rpx">茶艺师推广</view>
<view class="flex items-center flex-1">
<wd-input type="text" v-model="person" no-border custom-class="!bg-[#F6F7F8] !rounded-8rpx w-full" custom-input-class="!px-32rpx !h-80rpx">
</wd-input>
</view>
</view>
</wd-tab>
</wd-tabs>
</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.handleConfirmRecharge">
确定转入
</view>
</view>
<!-- 推广方式 -->
<wd-popup v-model="showStorePopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative">
<view class="absolute top-18rpx right-30rpx" @click="showStorePopup = 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 pt-50rpx pb-40rpx">推广方式 </view>
<scroll-view scroll-y class="h-500rpx pb-20rpx">
<view class="mx-56rpx" v-for="(item, index) in 5" :key="index">
<view class="flex items-center justify-between mb-66rpx" @click="buy.handleChooseStore(item)">
<view class="mr-32rpx">
<wd-img width="80rpx" height='80rpx' :src="`${OSS}icon/icon_location3.png`"></wd-img>
</view>
<view class="flex-1">
<view>这是茶馆名字</view>
<view class="text-28rpx leading-40rpx text-[#909399] flex items-center mt-10rpx">
<view>距您5.3km</view>
<view>
<wd-divider vertical />
</view>
<view class="w-350rpx line-1">北京市海淀区宏福苑西区20号楼2单元30</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</wd-popup>
</view>
</template>
<script lang="ts" setup>
const OSS = inject('OSS')
// 推广方式
const tab = ref<number>(0)
const person = ref<string>('') // 个人推广码
const showStorePopup = ref<boolean>(false) // 显示门店列表弹窗
onLoad(() => {
})
const buy = {
// 选择门店
handleChooseStore: (item: any) => {
},
// 确定转入
handleConfirmRecharge: () => {
uni.navigateTo({
url: '/pages/notice/pay?type=vip'
})
}
}
</script>
<style lang="scss" scoped>
page {
background: $cz-page-background;
}
.pay-tabs {
:deep() {
.wd-tabs__line {
background-color: #4C9F44;
}
}
}
</style>

199
src/bundle/wallet/wallet.vue Normal file
View File

@ -0,0 +1,199 @@
<route lang="jsonc" type="page">{
// "needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}</route>
<template>
<view class="pb-30rpx">
<view class="order-list">
<navbar layoutLeft custom-class='!bg-[#F6F7F8]'>
<template #left>
<view class="ml-24rpx flex items-center">
<view class="text-36rpx leading-50rpx text-[#303133] mr-24rpx">我的钱包</view>
<view class="text-24rpx leading-34rpx text-[#606266]">简单·便捷·安全</view>
</view>
</template>
</navbar>
</view>
<!-- 背景图 -->
<view class="mt-20rpx mx-30rpx">
<view class="wallet-bg">
<view class="flex items-center ml-72rpx pt-10rpx">
<view class="mr-30rpx">平台余额</view>
<view class="flex items-center">
<view class="flex items-center mr-12rpx">
<wd-img width="32rpx" height="32rpx" :src="`${OSS}icon/icon_safe.png`"></wd-img>
</view>
<view class="font-400 text-24rpx leading-20rpx text-[#B6843C]">保障中</view>
</view>
</view>
<view class="mt-70rpx ml-68rpx mr-60rpx">
<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>
</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>
</view>
</view>
</view>
</view>
<!-- 流水明细 -->
<view class="bg-white rounded-16rpx px-30rpx py-40rpx mt-20rpx mx-30rpx">
<view class="flex justify-between items-center">
<view class="text-32rpx leading-44rpx text-[#303133] mb-20rpx">流水明细</view>
<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>
</view>
<view>
<wd-icon name="fill-arrow-down" size="32rpx" color="#BFC2CC"></wd-icon>
</view>
</view>
</view>
<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">
<view class="text-28rpx leading-40rpx text-[#303133] flex justify-between items-center">
<view>茶艺师预定</view>
<view>-402.33</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>
</view>
</mescroll-body>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
const OSS = inject('OSS')
/* mescroll */
const upOption = reactive({
empty: {
icon : OSS + 'icon/icon_reserver_empty.png',
}
})
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
// 日期过滤
const value = ref<number>(Date.now())
const wallet = {
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
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); //追加新数据
// 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(); // 请求失败, 结束加载
// })
},
// 确认日期-
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}月`);
},
// 去充值
handleToRecharge: () => {
uni.navigateTo({
url: '/bundle/wallet/recharge'
})
},
// 跳转对应账单详情
handleToBillDetail: (id: number) => {
uni.navigateTo({
url: `/bundle/wallet/bill?id=${id}`
})
}
}
</script>
<style lang="scss">
page {
background-color: $cz-page-background;
}
.wallet-bg {
width: 690rpx;
height: 316rpx;
background-image: url(#{$OSS}images/wallet/wallet_image1.png);
background-size: 100% 100%;
}
.wall-date {
:deep() {
.wd-cell {
padding-left: 0 !important;
background-color: transparent !important;
}
.wd-cell__wrapper {
padding: 0 !important
}
.wd-datetime-picker__arrow {
display: none !important;
}
}
}
</style>

5
src/components/coupon/coupon.vue
View File

@ -13,7 +13,7 @@
<view class="text-34rpx leading-48rpx line-1" :class="canUse ? 'text-[#303133]' : 'text-[#909399]'">茶室优惠</view>
<view class="mt-40rpx text-[#909399] text-24rpx leading-34rpx" :class="canUse ? 'text-[#909399]' : 'text-[#BFC2CC]'">有效期至 2022-08-12</view>
</view>
<view class="h-100% mr-70rpx mt-58rpx">
<view class="h-100% mr-70rpx mt-58rpx" v-if="showChecked">
<wd-radio :value="coupon.id" shape="dot" :disabled="!canUse"></wd-radio>
</view>
</view>
@ -35,8 +35,9 @@
expire: string
}
canUse: boolean
showChecked: boolean
checked: boolean
onCheck: (id: number) => void
onCheck: (id: number) => void,
}>()
</script>

2
src/components/reserve/RoomList.vue
View File

@ -105,7 +105,7 @@
if (type === 'detail') {
let type = props.isGroupBuying ? ReserveServiceCategory.GroupBuying : ReserveServiceCategory.ReserveRoom
uni.navigateTo({
url: `/bundle/reserve-room/detail?id=${id}&type=${type}`
url: `/bundle/tea-room/detail?id=${id}&type=${type}`
})
}
}

125
src/pages.json
View File

@ -163,6 +163,14 @@
{
"root": "bundle",
"pages": [
{
"path": "collect/collect",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "coupon/coupon",
"type": "page",
@ -171,6 +179,14 @@
"navigationStyle": "custom"
}
},
{
"path": "coupon/my-coupon",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "demo/index",
"type": "page",
@ -187,38 +203,6 @@
"navigationStyle": "custom"
}
},
{
"path": "reserve-room/choose-room-reserve",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "reserve-room/choose-room",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "reserve-room/detail",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "reserve-room/room",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "store-recharge/store-recharge",
"type": "page",
@ -228,7 +212,72 @@
}
},
{
"path": "vip-benefits/vip-benefits",
"path": "tea-room/choose-room-reserve",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "tea-room/choose-room",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "tea-room/detail",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "tea-room/room",
"type": "page",
"layout": "tabbar",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "vip/benefits",
"type": "page",
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "vip/buy",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "wallet/bill",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "wallet/recharge",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "wallet/wallet",
"type": "page",
"layout": "default",
"style": {
@ -292,7 +341,15 @@
}
},
{
"path": "order/reserve-room/order-detail",
"path": "order/tea-room/order-detail",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "order/tea-room/order-list",
"type": "page",
"layout": "default",
"style": {

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

@ -180,7 +180,7 @@
handleToReserveRoom: (id: number = 1) => {
// 跳转到预约茶室页面
uni.navigateTo({
url: `/bundle/reserve-room/room?id=${id}`
url: `/bundle/tea-room/room?id=${id}`
})
}
}

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

@ -52,16 +52,16 @@
<!-- 余额显示 -->
<view class="mt-16rpx mx-30rpx flex justify-between">
<view class="flex items-center">
<view class="w-160rpx text-[#303133] text-center">
<view class="w-160rpx text-[#303133] text-center" @click="my.handleToCoupon">
<view class="font-bold text-36rpx leading-50rpx"> {{ isLogin ? 51 : '- -' }}</view>
<view class="text-24rpx leading-34rpx">优惠券</view>
</view>
<view class="w-160rpx text-[#303133] text-center">
<view class="w-160rpx text-[#303133] text-center" @click="my.handleToCollect">
<view class="font-bold text-36rpx leading-50rpx"> {{ isLogin ? 51 : '- -' }}</view>
<view class="text-24rpx leading-34rpx">收藏</view>
</view>
</view>
<view class="relative">
<view class="relative" @click="my.handleToWallet">
<view class="w-300rpx h-148rpx">
<wd-img width="100%" height="100%" :src="`${OSS}images/my/my_image3.png`" mode="aspectFill"></wd-img>
</view>
@ -162,19 +162,21 @@
<view class="px-30rpx pt-30rpx py-24rpx">茶室订单</view>
<view class="flex relative px-30rpx">
<view v-for="(item, index) in roomMenuList" :key="index">
<view class="w-96rpx text-center flex flex-col items-center justify-center mr-30rpx">
<view class="w-36rpx h-36rpx flex items-center justify-center">
<wd-img width="100%" height="100%" :src="item.icon"></wd-img>
<navigator :url="`/bundle/order/tea-room/order-list?orderType=${item.type}`" hover-class="none">
<view class="w-96rpx text-center flex flex-col items-center justify-center mr-30rpx">
<view class="w-36rpx h-36rpx flex items-center justify-center">
<wd-img width="100%" height="100%" :src="item.icon"></wd-img>
</view>
<view class="font-400 text-24rpx text-[#303133] leading-34rpx mt-8rpx">{{ item.title }}</view>
</view>
<view class="font-400 text-24rpx text-[#303133] leading-34rpx mt-8rpx">{{ item.title }}</view>
</view>
</navigator>
</view>
</view>
</view>
<!-- 茶艺师订单 -->
<view class="bg-white rounded-16rpx mx-30rpx mt-28rpx pb-34rpx">
<view class="px-30rpx pt-30rpx py-24rpx">茶艺室订单</view>
<view class="px-30rpx pt-30rpx py-24rpx">茶艺师订单</view>
<view class="flex relative px-30rpx">
<view v-for="(item, index) in teaReserveMenuList" :key="index">
<view class="w-96rpx text-center flex flex-col items-center justify-center mr-30rpx">
@ -230,11 +232,11 @@
<!-- 客服电话 -->
<wd-action-sheet v-model="showServiceMobile" :actions="sheetMenu" cancel-text="取消" @close="showServiceMobile = false" @select="my.handleSelectMenu" />
</view>
</template>
<script lang="ts" setup>
import {TeaRoomOrderStatus, TeaSpecialistOrderStatus} from '@/utils/order'
import {toast} from '@/utils/toast'
const OSS = inject('OSS')
@ -249,19 +251,19 @@
// 茶室订单
const roomMenuList = reactive([
{ id: 1, title: '全部订单', icon: `${OSS}icon/icon_room_all_order.png`, badge: '', url: '' },
{ id: 2, title: '待付款', icon: `${OSS}icon/icon_room_wait_pay_order.png`, badge: '', url: '' },
{ id: 3, title: '预约单', icon: `${OSS}icon/icon_room_reserve_order.png`, badge: '', url: '' },
{ id: 4, title: '已完结', icon: `${OSS}icon/icon_room_finish_order.png`, badge: '', url: '' },
{ id: 1, title: '全部订单', icon: `${OSS}icon/icon_room_all_order.png`, badge: '', type: 'all' },
{ id: 2, title: '待付款', icon: `${OSS}icon/icon_room_wait_pay_order.png`, badge: '', type: TeaRoomOrderStatus.Pending },
{ id: 3, title: '预约单', icon: `${OSS}icon/icon_room_reserve_order.png`, badge: '', type: TeaRoomOrderStatus.Reserved },
{ id: 4, title: '已完结', icon: `${OSS}icon/icon_room_finish_order.png`, badge: '', type: TeaRoomOrderStatus.Finished },
])
// 茶艺师订单
const teaReserveMenuList = reactive([
{ id: 1, title: '全部订单', icon: `${OSS}icon/icon_tea_all_order.png`, badge: '', url: '' },
{ id: 2, title: '待付款', icon: `${OSS}icon/icon_tea_wait_pay_order.png`, badge: '', url: '' },
{ id: 3, title: '预约单', icon: `${OSS}icon/icon_tea_reserve_order.png`, badge: '', url: '' },
{ id: 4, title: '待确认', icon: `${OSS}icon/icon_tea_wait_confirm_order.png`, badge: '', url: '' },
{ id: 4, title: '已完结', icon: `${OSS}icon/icon_tea_finish_order.png`, badge: '', url: '' },
{ id: 1, title: '全部订单', icon: `${OSS}icon/icon_tea_all_order.png`, badge: '', type: 'all' },
{ id: 2, title: '待付款', icon: `${OSS}icon/icon_tea_wait_pay_order.png`, badge: '', type: TeaSpecialistOrderStatus.Pending },
{ id: 3, title: '预约单', icon: `${OSS}icon/icon_tea_reserve_order.png`, badge: '', type: TeaSpecialistOrderStatus.Reserved },
{ id: 4, title: '待确认', icon: `${OSS}icon/icon_tea_wait_confirm_order.png`, badge: '', type: TeaSpecialistOrderStatus.Confirm },
{ id: 4, title: '已完结', icon: `${OSS}icon/icon_tea_finish_order.png`, badge: '', type: TeaSpecialistOrderStatus.Finished },
])
// 更多服务
@ -339,11 +341,30 @@
// 跳转到会员权益
handleToVipBenefits: () => {
if (isLogin.value) {
uni.navigateTo({
url: '/bundle/vip-benefits/vip-benefits'
})
}
uni.navigateTo({
url: '/bundle/vip/benefits'
})
},
// 跳转到优惠券
handleToCoupon: () => {
uni.navigateTo({
url: '/bundle/coupon/my-coupon'
})
},
// 跳转到收藏
handleToCollect: () => {
uni.navigateTo({
url: '/bundle/collect/collect'
})
},
// 跳转到我的钱包
handleToWallet: () => {
uni.navigateTo({
url: '/bundle/wallet/wallet'
})
}
}
</script>

2
src/pages/notice/bill.vue
View File

@ -21,6 +21,6 @@
type.value = args.type || ''
})
</script>
<style lang="scss" scoped>
</style>

42
src/pages/notice/pay.vue
View File

@ -7,8 +7,8 @@
}</route>
<template>
<view class="mt-94rpx flex justify-center items-center">
<view v-if="type == 'room'">
<view class="mt-94rpx">
<view class="flex justify-center items-center" v-if="type === 'room'">
<pay-notice title="购买成功" desc="可以点击下方查看订单详情">
<template #layout>
<view class="pb-22rpx mt-40rpx mx-30rpx flex justify-between items-center text-[32rpx] text-center">
@ -18,6 +18,28 @@
</template>
</pay-notice>
</view>
<!-- 充值vip -->
<view v-if="type === 'vip'">
<pay-notice title="购买成功" desc="感谢您的信任，马上开启会员之旅！">
<template #layout>
<view class="font-500 mt-78rpx mx-60rpx flex justify-center items-center text-[30rpx] bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx" @click="pay.handleVipDone">
完成
</view>
</template>
</pay-notice>
</view>
<!-- recharge -->
<view v-if="type === 'recharge'">
<pay-notice title="充值成功" desc="感谢您的信任，我们一定会做的更好！">
<template #layout>
<view class="font-500 mt-78rpx mx-60rpx flex justify-center items-center text-[30rpx] bg-[#4C9F44] text-[#fff] rounded-8rpx h-90rpx" @click="pay.handleRechargeDone">
完成
</view>
</template>
</pay-notice>
</view>
</view>
</template>
@ -34,7 +56,7 @@
// 预约茶室 - 查看订单
handleRoomSeeOrder: () => {
uni.navigateTo({
url: '/bundle/reserve-room/order'
url: '/bundle/tea-room/order'
})
},
@ -43,6 +65,20 @@
uni.switchTab({
url: '/pages/index/index'
})
},
// 购买会员 - 完成
handleVipDone: () => {
uni.switchTab({
url: '/pages/index/index'
})
},
// 我的钱包-充值
handleRechargeDone: () => {
uni.switchTab({
url: '/pages/index/index'
})
}
}
</script>

2
src/pages/notice/reserve.vue
View File

@ -34,7 +34,7 @@
// 预约茶室 - 查看订单
handleRoomSeeOrder: () => {
uni.navigateTo({
url: '/bundle/reserve-room/order'
url: '/bundle/tea-room/order'
})
},

2
src/pages/reserve/reserve.vue
View File

@ -134,7 +134,7 @@
// 茶室预约-跳转到对应的订单页
handleToReserveRoomOrder: () => {
uni.navigateTo({
url: `/bundle/order/reserve-room/order-detail?orderStatus=${ReserveCategoryOrderStatus.Consuming}`
url: `/bundle/order/tea-room/order-detail?orderStatus=${ReserveCategoryOrderStatus.Consuming}`
})
},

31
src/utils/order.ts
View File

@ -154,3 +154,34 @@ export const ReserveCategoryOrderStatusText: Record<ReserveCategoryOrderStatus,
}
/** 结束 **/
/** 茶室订单 **/
export enum TeaRoomOrderStatus {
Pending = 'pending', // 待付款
Reserved = 'reserved', // 预约单
Finished = 'finished' // 已完结
}
export const TeaRoomOrderStatusText: Record<TeaRoomOrderStatus, string> = {
[TeaRoomOrderStatus.Pending]: '待付款',
[TeaRoomOrderStatus.Reserved]: '预约单',
[TeaRoomOrderStatus.Finished]: '已完结'
}
/** 结束 **/
/** 茶艺师订单 **/
export enum TeaSpecialistOrderStatus {
Pending = 'pending', // 待付款
Reserved = 'reserved', // 预约单
Confirm = 'confirm', // 待确认
Finished = 'finished' // 已完结
}
export const TeaSpecialistOrderStatusText: Record<TeaSpecialistOrderStatus, string> = {
[TeaSpecialistOrderStatus.Pending]: '待付款',
[TeaSpecialistOrderStatus.Reserved]: '预约单',
[TeaSpecialistOrderStatus.Confirm]: '待确认',
[TeaSpecialistOrderStatus.Finished]: '已完结'
}
/** 结束 **/

49
src/utils/pay.ts Normal file
View File

@ -0,0 +1,49 @@
interface PayMethod {
id: number
name: string
icon: string
balance: number
value: number,
type: string
}
// 支付方式分类
export enum PayCategory {
PlatformBalance = 'PlatformBalance', // 平台余额
StoreBalance = 'StoreBalance', // 门店余额
WeChatPay = 'WeChatPay', // 微信支付
}
export enum PayValue {
PlatformBalance = 1, // 平台余额
StoreBalance = 2, // 门店余额
WeChatPay = 3, // 微信支付
}
// 支付方式列表
export const PayList: PayMethod[] = [
{
id: 1,
name: '平台余额',
icon: 'icon/icon_platform_balance.png',
balance: 0,
value: PayValue.PlatformBalance,
type: PayCategory.PlatformBalance
},
{
id: 2,
name: '门店余额',
icon: 'icon/icon_store_balance.png',
balance: 0,
value: PayValue.StoreBalance,
type: PayCategory.StoreBalance
},
{
id: 3,
name: '微信支付',
icon: 'icon/icon_weichat.png',
balance: 0,
value: PayValue.WeChatPay,
type: PayCategory.WeChatPay
}
]