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:06:27 +08:00
parent 775a93f766
commit a600c68099
5 changed files with 352 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

137
src/bundle/finance/detail.vue Normal file
View File

@ -0,0 +1,137 @@
<route lang="jsonc" type="page">{
"layout": "default",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#fff"
}
}</route>
<template>
<view class="mt-26rpx">
<view>
<navbar title="订单详情" custom-class="!bg-[transparent]"></navbar>
</view>
<view class="mt-38rpx">
<view class="">
<view class="mx-48rpx flex items-center">
<view class="rounded-4rpx w-60rpx text-center text-[#40AE36] border-2rpx border-solid border-[#40AE36] text-22rpx pb-4rpx">团购</view>
<!-- <view class="rounded-4rpx w-60rpx text-center text-[#FF5951] border-2rpx border-solid border-[#FF5951] text-22rpx pb-4rpx">直营</view> -->
<view class="w-600rpx line-2 ml-20rpx font-bold text-30rpx text-[#303133] leading-42rpx text-left">【榻榻米双人包间】惬意茶室商务洽谈会议室这是里团购名称</view>
</view>
</view>
<view class="mt-30rpx text-40rpx text-[#303133] leading-56rpx text-center">
<text class="font-bold">+</text>￥128.00
</view>
<view class="flex items-center flex items-center justify-center mt-16rpx">
<wd-img width="28rpx" height="28rpx" :src="`${OSS}images/store/finance/image2.png`" mode="aspectFit" />
<view class="text-26rpx text-[#606266] leading-36rpx ml-12rpx">核销成功</view>
</view>
<view class="mx-28rpx mt-72rpx">
<!-- 这一块内容是在直营店才显示 -->
<!-- <view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>预定门店</view>
<view>茶址.24小时智能茶室(中新店)</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>预约时间</view>
<view>2025-03-18 09:00-12:00</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>预约时长</view>
<view>3小时</view>
</view>
<view class="mt-20rpx">
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
</view>
</view> -->
<!-- 直营和团购都显示 -->
<view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>总收入</view>
<view>￥148.00</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>优惠券</view>
<view>-￥20</view>
</view>
<view class="mt-20rpx">
<wd-gap height="2rpx" bg-color="#E5E5E5"></wd-gap>
</view>
</view>
<view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>订单编号</view>
<view>
<text>7327328627526903</text>
<wd-divider vertical />
<text class="text-[#4C9F44]" @click="copy('7327328627526903')">复制</text>
</view>
</view>
<!-- 直营显示 -->
<!-- <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>交易方式</view>
<view>微信支付</view>
</view> -->
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>创建时间</view>
<view>2025-05-16 12:20:26</view>
</view>
<!-- 团购显示 -->
<view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>验券时间</view>
<view>2025-05-16 12:20:26</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>验券门店</view>
<view>茶址.24小时智能茶室(中新店)</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>券号</view>
<view>8408669398</view>
</view>
</view>
<!-- 直营显示 -->
<!-- <view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>付款时间</view>
<view>2025-08-16 12:20:26</view>
</view> -->
</view>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import { toTimes, copy } from '@/utils/tools'
const OSS = inject('OSS')
onLoad((args) => {
})
</script>
<style lang="scss">
page {
background-color: #fff;
}
</style>

39
src/bundle/finance/finance.vue
View File

@ -37,13 +37,15 @@
<view class="mx-30rpx">
<view class="flex items-center">
<view class="font-bold text-[#303133]">
<text class="text-44rpx">8</text>
<text class="text-32rpx">月</text>
<view class="font-bold text-[#303133] datetime-picker">
<!-- <text class="text-44rpx">8</text>
<text class="text-32rpx">月</text> -->
<wd-datetime-picker v-model="value" :maxDate="Date.now()" type="year-month" @confirm="Finance.handleConfirmDate"></wd-datetime-picker>
</view>
<view class="mt-16rpx">
<!-- <view class="mt-16rpx">
<wd-icon name="fill-arrow-down" size="40rpx" color="#BFC2CC"></wd-icon>
</view>
</view> -->
</view>
<view class="font-400 text-24rpx text-[#606266] leading-34rpx">
@ -52,18 +54,19 @@
<view class="mt-20rpx">
<mescroll-body ref="mescrollItem0" @init="mescrollInit" @down="downCallback" @up="Finance.upCallback" :down="downOption" :up="upOption">
<view class="bg-white rounded-16rpx px-16rpx py-28rpx">
<view class="bg-white rounded-16rpx px-16rpx py-28rpx" @click="router.navigateTo(`/bundle/finance/detail`)">
<view class="flex items-center justify-between">
<view class="line-1 w-480rpx font-bold text-30rpx text-[#303133] leading-42rpx">【榻榻米双人包间】惬意茶室商务...</view>
<view class="flex items-center">
<view class="text-[#FF5951] font-bold text-30rpx leading-42rpx">+ 181.35</view>
<wd-icon name="arrow-right" size="40rpx" color="#000"></wd-icon>
<wd-icon name="arrow-right" size="26rpx" color="#666"></wd-icon>
</view>
</view>
<view class="mt-12rpx">
<view class="flex items-center">
<view class="rounded-4rpx w-60rpx text-center text-[#40AE36] border-2rpx border-solid border-[#40AE36] text-22rpx pb-4rpx">团购</view>
<!-- <view class="rounded-4rpx w-60rpx text-center text-[#FF5951] border-2rpx border-solid border-[#FF5951] text-22rpx pb-4rpx">直营</view> -->
<view class="text-24rpx text-[#606266] leading-34rpx ml-10rpx">上海.茶址24小时智能茶室（中新店）</view>
</view>
</view>
@ -99,6 +102,10 @@
}
const list = ref<Array<any>>([]) // 茶艺师列表
// 日期过滤
const value = ref<number>(Date.now())
onLoad((args) => {
})
@ -115,6 +122,16 @@
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}月`);
},
}
</script>
@ -130,4 +147,12 @@
background-size: 100% 588rpx;
background-repeat: no-repeat;
}
.datetime-picker {
:deep() {
.wd-cell {
background-color: transparent !important;
}
}
}
</style>

164
src/bundle/setmeal/setmeal.vue Normal file
View File

@ -0,0 +1,164 @@
<route lang="jsonc" type="page">{
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}</route>
<template>
<view class="">
<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>
<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="search-box">
<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-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>
</view>
</mescroll-body>
</view>
</view>
</template>
<script lang="ts" setup>
import { OrderSource, OrderStatus, TeaRoomOrderStatusText, TeaRoomOrderStatusValue } from '@/utils/order'
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 { getTeaRoomOrderList } from '@/api/tea-room'
import { router } from '@/utils/tools'
// mescroll
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>('') // 搜索关键词
// tab
const tab = ref<string>('all')
onLoad((args) => {
uni.$on('refreshOrderList', () => {
list.value = []
getMescroll().resetUpScroll()
})
// 根据传过来的参数决定显示哪个tab
if (args.orderStatus) {
tab.value = args.orderStatus
}
})
onUnload(() => {
uni.$off('refreshOrderList')
})
const OrderList = {
/**
* 分页加载
* @param mescroll
*/
upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容
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(() => {
mescroll.endErr() // 请求失败, 结束加载
})
},
/**
* 切换订单状态
* @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时,重置当前的mescroll
list.value = []
getMescroll().resetUpScroll();
},
/**
* 内容搜索
*/
handleSearch: () => {
list.value = []
getMescroll().resetUpScroll();
}
}
</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>

18
src/pages.json
View File

@ -248,6 +248,15 @@
"navigationBarTitleText": "分包页面"
}
},
{
"path": "finance/detail",
"type": "page",
"layout": "default",
"style": {
"navigationStyle": "custom",
"navigationBarBackgroundColor": "#fff"
}
},
{
"path": "finance/finance",
"type": "page",
@ -266,6 +275,15 @@
"navigationStyle": "custom"
}
},
{
"path": "setmeal/setmeal",
"type": "page",
"needLogin": true,
"layout": "default",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "settle-in/parten",
"type": "page",

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

@ -69,7 +69,7 @@
</view>
<view class="flex flex-col justify-center items-center w-[25%]">
<wd-img width="90rpx" height="90rpx" :src="`${OSS}images/store/home/image5.png`" mode="aspectFit" />
<wd-img width="90rpx" height="90rpx" :src="`${OSS}images/store/home/image5.png`" mode="aspectFit" @click="router.navigateTo('/bundle/setmeal/setmeal')" />
<view class="font-400 text-24rpx text-[#303133] leading-34rpx">套餐管理</view>
</view>