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

完善页面

Browse Source
This commit is contained in:
wangxiaowei
2025-12-29 14:39:14 +08:00
parent 14ddb7ce7b
commit 338a99a54a
15 changed files with 1347 additions and 1314 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -9,43 +9,127 @@
<template>
<view class="home-bg pb-80rpx">
<view class="home-bg w-[100%] fixed top-0 left-0 z-100">
<wd-navbar left-arrow safeAreaInsetTop title="财务管理" :bordered="false" custom-style="background-color: transparent !important;" @click-left="router.navigateBack()"></wd-navbar>
<navbar title="收入统计" custom-class="!bg-[transparent]"></navbar>
</view>
<view :style="{ paddingTop: navbarHeight + 'px' }">
<view class="relative mx-30rpx mt-16rpx">
<wd-img width="692rpx" height="334rpx" :src="`${OSS}images/store/finance/image1.png`" mode="aspectFit" />
<wd-img width="692rpx" height="592rpx" :src="`${OSS}images/chayishi/finance_image1.png`"/>
<!-- 时间选择 -->
<view class="absolute top-50rpx left-40rpx">
<view class="font-400 text-26rpx text-[#B4CEFF] leading-36rpx">经营资产</view>
<view class="mt-20rpx font-bold text-36rpx text-[#fff] leading-34rpx">{{ userFinance.total_amount }}</view>
<view class="font-400 text-28rpx leading-40rpx text-[#fff]">本期时间</view>
<view class="font-bold text-[#fff] datetime-picker">
<wd-datetime-picker
custom-value-class="!text-[#fff]"
v-model="value"
:maxDate="Date.now()"
type="year-month"
@confirm="Finance.handleConfirmDate">
</wd-datetime-picker>
</view>
</view>
<view class="flex items-center justify-around w-100% absolute bottom-40rpx left-0 px-40rpx">
<view class="flex items-center justify-around w-100% absolute top-238rpx left-0 px-40rpx">
<view class="flex flex-col items-center justify-start">
<view class="font-400 text-24rpx text-[#606266] text-34rpx">已提现</view>
<view class="font-bold text-32rpx text-[#303133] leading-34rpx mt-14rpx">{{ userFinance.total_reflect_amount }}</view>
<view class="font-400 text-24rpx text-[#606266] text-34rpx">本期业绩（元）</view>
<view class="font-bold text-32rpx text-[#303133] leading-34rpx mt-14rpx">123</view>
</view>
<view class="h-98rpx">
<wd-divider vertical color="#EAEEF2" custom-class="!h-98rpx"></wd-divider>
</view>
<view class="flex flex-col items-center justify-start">
<view class="font-400 text-24rpx text-[#606266] text-34rpx">待提现</view>
<view class="font-bold text-32rpx text-[#303133] leading-34rpx mt-14rpx">{{ userFinance.balance }}</view>
<view class="font-400 text-24rpx text-[#606266] text-34rpx">本期收入(元）</view>
<view class="font-bold text-32rpx text-[#303133] leading-34rpx mt-14rpx">345</view>
</view>
</view>
<view class="h-2rpx bg-[#EAEEF2] w-647rpx absolute top-368rpx" style="left: 50%; transform:translateX(-50%)"></view>
<view class="absolute top-388rpx">
<view class="mx-36rpx">
<view class="flex items-center">
<view class="flex items-center">
<wd-img :src="`${OSS}icon/icon_pay.png`" width="36rpx" height="36rpx"></wd-img>
</view>
<view class="font-bold text-28rpx leading-40rpx text-[#303133] mx-14rpx">实际收入</view>
<view class="font-400 text-22rpx leading-32rpx text-[#909399]">已扣除平台服务费</view>
</view>
</view>
<view class="flex items-center justify-around w-674rpx mt-28rpx">
<!-- 服务费 -->
<view class="flex items-center">
<view class="w-120rpx text-center">
<view class="font-400 text-28rpx leading-34rpx text-[#303133]">500.00</view>
<view class="font-400 text-28rpx leading-34rpx text-[#606266] mt-12rpx">服务费</view>
</view>
<view class="h-98rpx">
<wd-divider vertical color="#EAEEF2" custom-class="!h-98rpx"></wd-divider>
</view>
</view>
<!-- 车马费 -->
<view class="flex items-center">
<view class="w-120rpx text-center">
<view class="font-400 text-28rpx leading-34rpx text-[#303133]">500.00</view>
<view class="font-400 text-28rpx leading-34rpx text-[#606266] mt-12rpx">车马费</view>
</view>
<view class="h-98rpx">
<wd-divider vertical color="#EAEEF2" custom-class="!h-98rpx"></wd-divider>
</view>
</view>
<!-- 茶叶 -->
<view class="flex items-center">
<view class="w-120rpx text-center">
<view class="font-400 text-28rpx leading-34rpx text-[#303133]">500.00</view>
<view class="font-400 text-28rpx leading-34rpx text-[#606266] mt-12rpx">茶叶</view>
</view>
<view class="h-98rpx">
<wd-divider vertical color="#EAEEF2" custom-class="!h-98rpx"></wd-divider>
</view>
</view>
<!-- 打赏 -->
<view class="flex items-center">
<view class="w-120rpx text-center">
<view class="font-400 text-28rpx leading-34rpx text-[#303133]">500.00</view>
<view class="font-400 text-28rpx leading-34rpx text-[#606266] mt-12rpx">打赏</view>
</view>
</view>
</view>
</view>
</view>
<!-- 业绩明细表格 -->
<view class="mt-30rpx">
<view class="overflow-x-auto">
<view class="min-w-[800rpx]">
<!-- 表头 -->
<view class="flex items-center rounded-t-12rpx" style="background: #EEEFF0;">
<view class="flex-1 text-center py-18rpx text-26rpx font-bold w-120rpx">日期</view>
<view class="flex-1 text-center py-18rpx text-26rpx font-bold">业绩</view>
<view class="flex-1 text-center py-18rpx text-26rpx font-bold">服务费</view>
<view class="flex-1 text-center py-18rpx text-26rpx font-bold">车马费</view>
<view class="flex-1 text-center py-18rpx text-26rpx font-bold">茶叶</view>
<view class="flex-1 text-center py-18rpx text-26rpx font-bold">打赏</view>
</view>
<!-- 示例数据行，可替换为v-for渲染 -->
<view class="flex items-center border-b border-[#EEEFF0] bg-[#fff]" v-for="(item, idx) in 31" :key="idx">
<view class="flex-1 text-center py-16rpx font-400 text-24rpx leading-36rpx border-r border-[#EEEFF0] text-[#303133]">2025-12-{{ idx+7 }}</view>
<view class="flex-1 text-center py-16rpx font-400 text-24rpx leading-36rpx border-r border-[#EEEFF0] text-[#303133]">1000</view>
<view class="flex-1 text-center py-16rpx font-400 text-24rpx leading-36rpx border-r border-[#EEEFF0] text-[#303133]">160</view>
<view class="flex-1 text-center py-16rpx font-400 text-24rpx leading-36rpx border-r border-[#EEEFF0] text-[#303133]">30</view>
<view class="flex-1 text-center py-16rpx font-400 text-24rpx leading-36rpx border-r border-[#EEEFF0] text-[#303133]">50</view>
<view class="flex-1 text-center py-16rpx font-400 text-24rpx leading-36rpx">20</view>
</view>
</view>
</view>
</view>
<view class="mx-30rpx">
<view class="flex items-center">
<view class="font-bold text-[#303133] datetime-picker">
<wd-datetime-picker v-model="value" :maxDate="Date.now()" type="year-month" @confirm="Finance.handleConfirmDate"></wd-datetime-picker>
</view>
</view>
<view class="font-400 text-24rpx text-[#606266] leading-34rpx">
收入￥{{ allPrice }}
</view>
<!-- <view class="mx-30rpx">
<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 mb-20rpx" v-for="item in list" :key="item.id" @click="router.navigateTo(`/bundle/finance/detail?id=${item.id}`)">
@ -71,7 +155,7 @@
</view>
</mescroll-body>
</view>
</view>
</view> -->
</view>
</view>
</template>
@ -178,8 +262,14 @@
.datetime-picker {
:deep() {
.wd-cell {
padding-left: 0 !important;
background-color: transparent !important;
}
.wd-datetime-picker__arrow {
margin-top: 2rpx !important;
color: #fff !important;
}
}
}
</style>