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

添加套餐管理列表页面

Browse Source
This commit is contained in:
wangxiaowei
2025-12-14 14:41:26 +08:00
parent a600c68099
commit 3c852116e6
4 changed files with 122 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
src/bundle/setmeal/setmeal.vue
View File

@ -1,5 +1,4 @@
<route lang="jsonc" type="page">{
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
@ -7,7 +6,7 @@
}</route>
<template>
<view class="">
<view class="pb-170rpx">
<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>
<template #left>
@ -16,27 +15,30 @@
<wd-icon name="thin-arrow-left" size="30rpx"></wd-icon>
</view>
<view class="search-box">
<wd-search v-model="keywords" hide-cancel placeholder-left light placeholder="搜索茶室订单" @search="OrderList.handleSearch()"></wd-search>
<wd-search v-model="keywords" hide-cancel placeholder-left light placeholder="搜索套餐名称" @search="OrderList.handleSearch()"></wd-search>
</view>
</view>
</template>
</wd-navbar>
<view class="tabs">
<wd-tabs v-model="tab" swipeable slidable="always" :lazy="false" @click="OrderList.handleChangeTabs">
<wd-tab title="全部" :name="TeaRoomOrderStatusText.All"></wd-tab>
<wd-tab title="待付款" :name="TeaRoomOrderStatusText.Pending"></wd-tab>
<wd-tab title="预约单" :name="TeaRoomOrderStatusText.Pay"></wd-tab>
<wd-tab title="已完结" :name="TeaRoomOrderStatusText.Finished"></wd-tab>
<wd-tab :title="item.title + `(${item.num})`" :name="item.name" v-for="(item, index) in tabList" :key="index"></wd-tab>
</wd-tabs>
</view>
</view>
<view class="tabs mt-18rpx mx-30rpx">
<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.TeaRoom" :order="item"></combo-card>
<!-- <mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="OrderList.upCallback" :down="downOption" :up="upOption"> -->
<view class="mb-20rpx" v-for="(item, index) in 10" :key="index">
<combo-card :type="OrderSource.SetMeal" :order="item"></combo-card>
</view>
<!-- </mescroll-body> -->
</view>
<view class="w-full fixed bottom-0 left-0 right-0 bg-white h-152rpx">
<view class="flex items-center justify-center text-32rpx leading-44rpx leading-90rpx text-center !mt-34rpx">
<wd-button custom-class="!text-32rpx !w-630rpx !h-90rpx !bg-[#4C9F44] !rounded-8rpx !text-[#fff]">新建套餐</wd-button>
</view>
</mescroll-body>
</view>
</view>
</template>
@ -65,6 +67,11 @@
// tab
const tab = ref<string>('all')
const tabList = ref<Array<{title: string, num: number, name: string}>>([
{ title: '已上架', num: 10, name: 'list'},
{ title: '已下架', num: 11, name: 'delist' },
// { title: '草稿箱', num: 0, name: 'draft' }
])
onLoad((args) => {
uni.$on('refreshOrderList', () => {
@ -89,21 +96,21 @@
*/
upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容
const filter = {
page: mescroll.num,
size: mescroll.size,
order_status: orderStatus.value,
search: keywords.value
}
// const filter = {
// page: mescroll.num,
// size: mescroll.size,
// order_status: orderStatus.value,
// search: keywords.value
// }
getTeaRoomOrderList(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(() => {
// getTeaRoomOrderList(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() // 请求失败, 结束加载
})
// })
},
/**
@ -111,24 +118,24 @@
* @param e
*/
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.value = e.name
// if (e.name === TeaRoomOrderStatusText.Pending) {
// orderStatus.value = '0'
// } else {
// orderStatus.value = TeaRoomOrderStatusValue[e.name] || ''
// }
// 切换tab时,重置当前的mescroll
list.value = []
getMescroll().resetUpScroll();
// // 切换tab时,重置当前的mescroll
// list.value = []
// getMescroll().resetUpScroll();
},
/**
* 内容搜索
*/
handleSearch: () => {
list.value = []
getMescroll().resetUpScroll();
// list.value = []
// getMescroll().resetUpScroll();
}
}
</script>

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

@ -213,6 +213,67 @@
</view>
</view>
<!-- 茶室管理端-套餐管理 -->
<view v-if="type === OrderSource.SetMeal" class="bg-white rounded-10rpx p-28rpx">
<view class="">
<view class="flex items-center">
<view class="mr-28rpx">
<wd-img width="200rpx" height="200rpx" :src="`${OSS}images/reserve_room/reserve_room_image2.png`"></wd-img>
</view>
<view class="flex-1" @click="ComboCard.handleToOrderDetail">
<view class="flex items-center relative">
<view class="w-400rpx flex items-center">
<view class="font-bold text-[#303133] text-30rpx leading-42rpx mr-14rpx">这里是套餐的名字这里是套餐的名字</view>
</view>
</view>
<view class="flex items-center mt-16rpx">
<view class="font-400 text-[#606266] text-26rpx leading-36rpx mr-8rpx">ID:1270304172</view>
<wd-icon name="file-copy" size="32rpx" color='#707070' @click="copy(123)"></wd-icon>
</view>
<view class="flex items-center">
<price-format color="#FF5951" :first-size="36" :second-size="36" :subscript-size="24" :price="23.02"></price-format>
<view class="rounded-4rpx w-60rpx text-center text-[#FF5951] border-2rpx border-solid border-[#FF5951] text-22rpx pb-4rpx mx-14rpx">5.1折</view>
<price-format color="#BFC2CC" :first-size="22" :second-size="22" :subscript-size="22" :price="23.02" lineThrough></price-format>
</view>
</view>
</view>
<view class="font-400 text-[#606266] text-26rpx leading-36rpx mt-42rpx flex items-center justify-between">
<view class="">
<text class="font-400 text-26rpx text-[#606266] leading-36rpx mr-10rpx">年售</text>
<text class="font-bold text-26rpx text-[#606266] leading-36rpx ">96</text>
</view>
<view class="flex items-center">
<view class="font-500 text-28rpx text-[#303133] leading-40rpx mr-18rpx">更多</view>
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx mr-12rpx">改价</view>
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx mr-12rpx">下架</view>
<view class="font-500 text-28rpx text-[#303133] leading-40rpx border-2rpx border-solid border-[#ECECEC] rounded-8rpx text-center py-4rpx px-28rpx">编辑</view>
</view>
</view>
</view>
<!-- 操作按钮 -->
<view>
<view v-if="orderStatus === OrderStatus.Finished || orderStatus === OrderStatus.Cancelled"
class="flex items-center text-28rpx mt-28rpx justify-end"
@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>
</view>
<view v-if="orderStatus === OrderStatus.Pending"
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"
@click="ComboCard.handleCancelOrder(OrderSource.TeaSpecialist)">
取消订单
</view>
<view class="w-178rpx h-70rpx rounded-8rpx border-[2rpx] border-[#4C9F44] text-[#4C9F44] flex items-center justify-center"
@click="ComboCard.handleToPayOrder(OrderSource.TeaSpecialist)">去支付</view>
</view>
</view>
</view>
<!-- 取消订单, 删除订单 -->
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
</view>
@ -225,6 +286,7 @@
import { handleTRCancelOrderHooks, handleTRDeleteOrderHooks, handleTRToPayHooks, handleToTRStoreHooks, handleTGOrderRefundHooks } from '@/hooks/useOrder'
import { StoreType } from '@/utils/tea'
import { router } from '@/utils/tools'
import { toTimes, copy } from '@/utils/tools'
/**
* ComboCard 套餐卡片组件

1
src/pages.json
View File

@ -278,7 +278,6 @@
{
"path": "setmeal/setmeal",
"type": "page",
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"

20
src/utils/order.ts
View File

@ -48,7 +48,8 @@ export enum OrderSource {
Combo = 'combo', // TODO 团购套餐：用于替代下面的Direct和Franchise
DouYin = 'douyin', // 抖音团购
TeaRoom = 'teaRoom', // 茶室
TeaSpecialist = 'teaSpecialist' // 茶艺师
TeaSpecialist = 'teaSpecialist', // 茶艺师
SetMeal = 'setMeal', // 茶室管理端-套餐管理
}
// 订单来源对应名称
@ -57,6 +58,7 @@ export const OrderSourceText: Record<OrderSource, string> = {
[OrderSource.DouYin]: '抖音',
[OrderSource.TeaRoom]: '茶室',
[OrderSource.TeaSpecialist]: '茶艺师',
[OrderSource.SetMeal]: '套餐管理',
}
// 订单状态
@ -148,7 +150,21 @@ export const OrderStatusTitle: Record<OrderSource, Record<OrderStatus, string>>
[OrderStatus.Refunded]: '售后完成',
[OrderStatus.AfterSaleApply]: '申请售后',
[OrderStatus.AfterSaleProcessing]: '申请售后中'
}
},
[OrderSource.SetMeal]: {
[OrderStatus.Consuming]: '消费中',
[OrderStatus.Reserved]: '已预约',
[OrderStatus.Serving]: '服务中',
[OrderStatus.Pending]: '待付款',
[OrderStatus.Confirm]: '订单待确认',
[OrderStatus.Finished]: '已完结',
[OrderStatus.Cancelled]: '订单取消',
[OrderStatus.ToUse]: '待使用',
[OrderStatus.Used]: '交易完成',
[OrderStatus.Refunded]: '售后完成',
[OrderStatus.AfterSaleApply]: '申请售后',
[OrderStatus.AfterSaleProcessing]: '申请售后中'
},
}