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-22 18:48:19 +08:00
parent 8ce688c697
commit 9bfdf0b03e
31 changed files with 4121 additions and 155 deletions
Download Patch File Download Diff File Expand all files Collapse all files

258
src/bundle/order/after-sales/after-sales.vue
View File

@ -9,132 +9,6 @@
<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">
<view v-if="orderStatus === OrderSourceOrderStatus.AfterSaleApply || orderStatus === OrderSourceOrderStatus.AfterSaleProcessing">请耐心等待，我们会尽快处理您的请求</view>
<view v-if="orderStatus === OrderSourceOrderStatus.Refunded" class="text-center mt-14rpx">
<view class="text-40rpx text-[#303133] leading-56rpx">
<view v-if="orderType !== OrderSource.TeaSpecialist">退款成功￥128.00</view>
<!-- 茶艺师退款需要有退款详情 -->
<view v-if="orderType === OrderSource.TeaSpecialist" @click="showRefundDetailsPopup = true">
退款成功￥128.00
<wd-icon name="arrow-right" size="40rpx" color="#666666" custom-class="!bg-[#F8F9FA]"></wd-icon>
</view>
</view>
<view class="text-28rpx text-[#606266] leading-54rpx mt-20rpx">谢谢您的信任，我们一定会做的更好</view>
<view class="text-24rpx text-[#606266] leading-34rpx mt-12rpx">2025年4月13日 18:22</view>
</view>
</view>
<!-- 订单 -->
<view class="mx-30rpx">
<view class="bg-white rounded-16rpx p-30rpx">
<view class="flex items-center">
<view class="mr-30rpx">
<wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img>
</view>
<view class="flex-1">
<!-- 非茶艺师退款 -->
<view class="flex justify-between items-center" @click="afterSales.handleToCombo" v-if="orderType !== OrderSource.TeaSpecialist">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-362rpx line-1">这是团购套餐的可以点击进 </view>
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
<!-- 茶艺师退款 -->
<view class="flex justify-between items-center" @click="afterSales.handleToCombo" v-if="orderType === OrderSource.TeaSpecialist">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx">这是茶艺师名称</view>
<view class="text-[#909399] text-26rpx leading-36rpx">￥324.22</view>
</view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view>3小时</view>
<view>x1</view>
</view>
<!-- 茶艺师退显示车马费-->
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx" v-if="orderType === OrderSource.TeaSpecialist">
<view>车马费（￥3.00元/公里）</view>
<view>￥30.90</view>
</view>
<view class="text-[#606266] text-right mt-26rpx">
<text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
<text class="tetx-32rpx leading-36rpx">￥29.32</text>
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
</view>
</view>
</view>
</view>
<!-- 售后原因 -->
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" @click="showResonPopup = true" v-if="orderStatus === OrderSourceOrderStatus.AfterSaleApply">
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between">
<view class="text-32rpx leading-44rpx text-[#303133]">售后原因</view>
<view>
<text class='text-[#909399] mr-10rpx'>{{ formData.reason ? reasonText : '请至少选择一项' }}</text>
<wd-icon name="arrow-right" size="24rpx" color="#666666" custom-class="!bg-[#F8F9FA]"></wd-icon>
</view>
</view>
</view>
<!-- 订单信息(选填) -->
<view class="bg-white rounded-16rpx px-30rpx pb-32rpx mx-30rpx mt-20rpx" v-if="orderStatus === OrderSourceOrderStatus.AfterSaleApply">
<view class="pt-32rpx text-[#303133] text-32rpx leading-44rpx">
<text>订单信息</text>
<text class="text-26rpx text-[#909399] leading-36rpx ml-20rpx">(选填)</text>
</view>
<view class="mt-28rpx">
<wd-textarea placeholder="有想说的可以在这里写哦！" v-model="formData.info" custom-class='!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA]' custom-textarea-class='!bg-[#F8F9FA]' />
</view>
</view>
<!-- 售后已完成 -->
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" v-if="orderStatus === OrderSourceOrderStatus.Refunded">
<view class="text-[#303133] text-32rpx leading-44rpx">售后订单</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderType !== OrderSource.TeaSpecialist">
<view>售后原因</view>
<view>买多了/买错了</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderType !== OrderSource.TeaSpecialist">
<view>退款金额</view>
<view>￥159.22</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>申请时间</view>
<view>2019-05-16 13:20:26</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]">复制</text>
</view>
</view>
</view>
<!-- 操作按钮 -->
<view class="w-full fixed bottom-0 left-0 right-0 h-152rpx"
:class="orderStatus === OrderSourceOrderStatus.AfterSaleApply ? '' : 'bg-white'"
v-if="orderType !== OrderSource.TeaSpecialist">
<view class="mt-34rpx">
<!-- 待使用 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center text-[#303133]"
v-if="orderStatus !== OrderSourceOrderStatus.AfterSaleApply">
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx mr-30rpx">联系商家</view>
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx">联系平台</view>
</view>
<!-- 申请售后 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center"
v-if="orderStatus === OrderSourceOrderStatus.AfterSaleApply" @click="afterSales.handleSubmitRefund">
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">提交</view>
</view>
</view>
</view>
<!-- 售后原因弹出框 -->
<wd-popup v-model="showResonPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative pb-78rpx">
@ -160,7 +34,7 @@
</view>
</wd-radio-group>
</view>
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mx-auto mt-160rpx" @click="afterSales.handleSelectReason">确定</view>
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mx-auto mt-160rpx" @click="AfterSales.handleSelectReason">确定</view>
</view>
</wd-popup>
@ -294,11 +168,137 @@
</view>
</view>
</wd-popup>
<!-- 平台团购直营店 -->
<view>
<navbar :title="title" custom-class='!bg-[#F6F7F8]'></navbar>
</view>
<view class="text-[#909399] text-26rpx leading-36rpx mx-102rpx mb-40rpx">
<view v-if="orderStatus === OrderStatus.AfterSaleApply || orderStatus === OrderStatus.AfterSaleProcessing">请耐心等待，我们会尽快处理您的请求</view>
<view v-if="orderStatus === OrderStatus.Refunded" class="text-center mt-14rpx">
<view class="text-40rpx text-[#303133] leading-56rpx">
<view v-if="orderType !== OrderSource.TeaSpecialist">退款成功￥128.00</view>
<!-- 茶艺师退款需要有退款详情 -->
<view v-if="orderType === OrderSource.TeaSpecialist" @click="showRefundDetailsPopup = true">
退款成功￥128.00
<wd-icon name="arrow-right" size="40rpx" color="#666666" custom-class="!bg-[#F8F9FA]"></wd-icon>
</view>
</view>
<view class="text-28rpx text-[#606266] leading-54rpx mt-20rpx">谢谢您的信任，我们一定会做的更好</view>
<view class="text-24rpx text-[#606266] leading-34rpx mt-12rpx">2025年4月13日 18:22</view>
</view>
</view>
<!-- 订单 -->
<view class="mx-30rpx">
<view class="bg-white rounded-16rpx p-30rpx">
<view class="flex items-center">
<view class="mr-30rpx">
<wd-img width="190rpx" height="190rpx" :src="`${OSS}images/home/home_image5.png`" mode="scaleToFill"></wd-img>
</view>
<view class="flex-1">
<!-- 非茶艺师退款 -->
<view class="flex justify-between items-center" @click="AfterSales.handleToCombo" v-if="orderType !== OrderSource.TeaSpecialist">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx w-362rpx line-1">这是团购套餐的可以点击进 </view>
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
<!-- 茶艺师退款 -->
<view class="flex justify-between items-center" @click="AfterSales.handleToCombo" v-if="orderType === OrderSource.TeaSpecialist">
<view class="font-bold text-30rpx leading-42rpx text-[#303133] mr-10rpx">这是茶艺师名称</view>
<view class="text-[#909399] text-26rpx leading-36rpx">￥324.22</view>
</view>
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx">
<view>3小时</view>
<view>x1</view>
</view>
<!-- 茶艺师退显示车马费-->
<view class="flex justify-between items-center text-26rpx leading-36rpx text-[#909399] mt-18rpx" v-if="orderType === OrderSource.TeaSpecialist">
<view>车马费（￥3.00元/公里）</view>
<view>￥30.90</view>
</view>
<view class="text-[#606266] text-right mt-26rpx">
<text class="text-24rpx leading-34rpx mr-12rpx">实付</text>
<text class="tetx-32rpx leading-36rpx">￥29.32</text>
<wd-icon name="chevron-right" size="32rpx"></wd-icon>
</view>
</view>
</view>
</view>
</view>
<!-- 售后原因 -->
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" @click="showResonPopup = true" v-if="orderStatus === OrderStatus.AfterSaleApply">
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between">
<view class="text-32rpx leading-44rpx text-[#303133]">售后原因</view>
<view>
<text class='text-[#909399] mr-10rpx'>{{ formData.reason ? reasonText : '请至少选择一项' }}</text>
<wd-icon name="arrow-right" size="24rpx" color="#666666" custom-class="!bg-[#F8F9FA]"></wd-icon>
</view>
</view>
</view>
<!-- 订单信息(选填) -->
<view class="bg-white rounded-16rpx px-30rpx pb-32rpx mx-30rpx mt-20rpx" v-if="orderStatus === OrderStatus.AfterSaleApply">
<view class="pt-32rpx text-[#303133] text-32rpx leading-44rpx">
<text>订单信息</text>
<text class="text-26rpx text-[#909399] leading-36rpx ml-20rpx">(选填)</text>
</view>
<view class="mt-28rpx">
<wd-textarea placeholder="有想说的可以在这里写哦！" v-model="formData.info" custom-class='!rounded-18rpx !border-2rpx !border-[#EFF0EF] !bg-[#F8F9FA]' custom-textarea-class='!bg-[#F8F9FA]' />
</view>
</view>
<!-- 售后已完成 -->
<view class="bg-white rounded-16rpx px-30rpx py-34rpx mx-30rpx mt-20rpx" v-if="orderStatus === OrderStatus.Refunded">
<view class="text-[#303133] text-32rpx leading-44rpx">售后订单</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderType !== OrderSource.TeaSpecialist">
<view>售后原因</view>
<view>买多了/买错了</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx" v-if="orderType !== OrderSource.TeaSpecialist">
<view>退款金额</view>
<view>￥159.22</view>
</view>
<view class="text-28rpx leading-40rpx text-[#606266] flex items-center justify-between mt-22rpx">
<view>申请时间</view>
<view>2019-05-16 13:20:26</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]">复制</text>
</view>
</view>
</view>
<!-- 操作按钮 -->
<view class="w-full fixed bottom-0 left-0 right-0 h-152rpx"
:class="orderStatus === OrderStatus.AfterSaleApply ? '' : 'bg-white'"
v-if="orderType !== OrderSource.TeaSpecialist">
<view class="mt-34rpx">
<!-- 待使用 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center text-[#303133]"
v-if="orderStatus !== OrderStatus.AfterSaleApply">
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx mr-30rpx">联系商家</view>
<view class="w-330rpx h-90rpx bg-[#F6F7F8] rounded-8rpx">联系平台</view>
</view>
<!-- 申请售后 -->
<view class="text-32rpx leading-44rpx flex items-center justify-center leading-90rpx text-center"
v-if="orderStatus === OrderStatus.AfterSaleApply" @click="AfterSales.handleSubmitRefund">
<view class="w-630rpx h-90rpx bg-[#4C9F44] rounded-8rpx text-[#fff]">提交</view>
</view>
</view>
</view>
</view>
</template>
<script lang="ts" setup>
import { OrderStatusTitle, PersonalReasonMap, MerchantReasonMap, ReasonMap, OrderSource } from '@/utils/order'
import { OrderStatusTitle, PersonalReasonMap, MerchantReasonMap, ReasonMap, OrderSource, OrderStatus } from '@/utils/order'
import {toast} from '@/utils/toast'
/** 表单相关 **/
@ -340,7 +340,7 @@
orderStatus.value = args.orderStatus
})
const afterSales = {
const AfterSales = {
handleToCombo: () => {
toast.info('跳转到套餐详情')
},

162
src/bundle/parten/pages/bank-card/add.vue Normal file
View File

@ -0,0 +1,162 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationBarBackgroundColor": "#FFF",
"navigationBarTitleText": "添加新银行卡"
}
}
</route>
<template>
<view>
<view>
<view class="flex justify-between items-center mx-38rpx">
<view class="text-30rpx leading-42rpx text-#303133">银行</view>
<view class="flex items-center">
<view>
<wd-input inputmode="decimal" size="large" placeholder="请选择银行" required no-border custom-input-class="!text-right" placeholderStyle="font-size: 30rpx; line-height: 42rpx; color: #c9c9c9;text-align: right;"></wd-input>
</view>
<view>
<wd-icon name='chevron-right' size="32rpx" color="#909399"></wd-icon>
</view>
</view>
</view>
<view>
<wd-gap height="2rpx" bg-color="#F2F2F2"></wd-gap>
</view>
</view>
<view>
<view class="flex justify-between items-center mx-38rpx">
<view class="text-30rpx leading-42rpx text-#303133">银行卡号</view>
<view class="flex items-center">
<view >
<wd-input inputmode="decimal" size="large" placeholder="请输入银行卡号" required no-border custom-input-class="!text-right" placeholderStyle="font-size: 30rpx; line-height: 42rpx; color: #c9c9c9;text-align: right;"></wd-input>
</view>
</view>
</view>
<view>
<wd-gap height="2rpx" bg-color="#F2F2F2"></wd-gap>
</view>
</view>
<view>
<view class="flex justify-between items-center mx-38rpx">
<view class="text-30rpx leading-42rpx text-#303133">绑定手机号</view>
<view class="flex items-center">
<view >
<wd-input inputmode="decimal" size="large" placeholder="请输入银行卡号" no-border custom-input-class="!text-right" placeholderStyle="font-size: 30rpx; line-height: 42rpx; color: #c9c9c9;text-align: right;"></wd-input>
</view>
</view>
</view>
<view>
<wd-gap height="2rpx" bg-color="#F2F2F2"></wd-gap>
</view>
</view>
<view>
<view class="flex justify-between items-center mx-38rpx">
<view class="text-30rpx leading-42rpx text-#303133 w-100rpx">验证码</view>
<view class="flex items-center">
<view>
<wd-input inputmode="decimal" size="large" placeholder="请输入银行卡号" no-border custom-input-class="!text-right" placeholderStyle="font-size: 30rpx; line-height: 42rpx; color: #c9c9c9;text-align: right;">
<template #suffix>
<view class="flex items-center">
<view class="flex items-center">
<view>
<wd-divider color="#C9C9C9" vertical />
</view>
<view class="text-[#4C9F44] text-28rpx font-400 leading-40rpx" v-if="!startCountDown" @click="Add.handleCountDown">发送</view>
<view class="!text-[#C9C9C9] text-28rpx font-400 leading-40rpx flex items-center" v-if="startCountDown">
<wd-count-down ref="countDown" :time="countDownTime" millisecond :auto-start="false" format="ss" custom-class="!text-[#C9C9C9] !text-32rpx" @finish="Add.handleFinishCountDown"></wd-count-down>
<view> S后重发</view>
</view>
</view>
</view>
</template>
</wd-input>
</view>
</view>
</view>
<view>
<wd-gap height="2rpx" bg-color="#F2F2F2"></wd-gap>
</view>
</view>
<view class="font-bold text-30rpx leading-42rpx bg-[#4C9F44] text-#fff rounded-8rpx mx-60rpx h-90rpx leading-90rpx text-center mt-196rpx" @click="Add.handleBindBankCard">
绑定银行卡
</view>
</view>
</template>
<script lang="ts" setup>
import {toast} from '@/utils/toast'
const OSS = inject('OSS')
// 选择银行卡
const showBankCardPopup = ref<boolean>(false)
const selectedBankCardIndex = ref<number>(0)
const bankList = ref<Array<{ id: number, bankName: string, bankCard: string }>>([
{ id: 1, bankName: '招商银行', bankCard: '3265' },
{ id: 2, bankName: '建设银行', bankCard: '1234' },
{ id: 3, bankName: '农业银行', bankCard: '5678' },
])
// 提现金额
const withdrawMoney = ref<number>(0)
// 验证码倒计时
const countDownTime = ref<number>(1 * 60 * 1000) // 60s倒计时
const startCountDown = ref<boolean>(false) // 是否开始倒计时
const countDown = ref<any>(null) // 倒计时组件
// 表单
const form = reactive<{
settleIn: number,
code: string,
message: string,
area: string[]
}>({
settleIn: 1,
code: '',
message: '',
area: []
})
const Add = {
// 确定提现
handleConfirmwithdrawMoney: () => {
},
// 发送验证码
handleCountDown: () => {
startCountDown.value = true
nextTick(() => {
countDown.value?.start()
// 发送验证码请求
})
},
// 验证码倒计时结束
handleFinishCountDown: () => {
startCountDown.value = false
},
// 绑定银行卡
handleBindBankCard: () => {
toast.info('绑定成功')
}
}
</script>
<style lang="scss" scoped>
page {
background: #fff;
}
</style>

99
src/bundle/parten/pages/bank-card/list.vue Normal file
View File

@ -0,0 +1,99 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationBarBackgroundColor": "#F6F7F9",
"navigationBarTitleText": "银行卡"
}
}
</route>
<template>
<view>
<!-- 删除确认框 -->
<wd-message-box selector="wd-message-box-slot"></wd-message-box>
<view class="flex items-center mx-58rpx mb-28rpx">
<view class="font-bold text-28rpx leading-40rpx text-#303133">我的银行卡（9张）</view>
<view class="flex items-center">
<view class="flex items-center mr-12rpx">
<wd-img :src="`${OSS}icon/icon_safe.png`" width="32rpx" height="32rpx"></wd-img>
</view>
<view class="font-400 text-24rpx leading-34rpx text-#B6843C">保障中</view>
</view>
</view>
<view class="mx-30rpx">
<view class="bg-white rounded-16rpx px-30rpx py-26rpx mb-20rpx flex items-center justify-between" v-for="(item, index) in bankList" :key="index" >
<view class="flex items-center">
<view class="flex items-center mr-22rpx">
<wd-img :src="`${OSS}icon/icon_bank_card4.png`" width="48rpx" height="48rpx"></wd-img>
</view>
<view class="font-400 text-30rpx leading-42rpx text-#303133">招商银行 储蓄卡（3265）</view>
</view>
<view @click="List.handleDeleteBankCard(index)">
<wd-icon name="delete-thin" size="42rpx" color="#BFC2CC"></wd-icon>
</view>
</view>
</view>
<view class="font-bold text-30rpx leading-42rpx bg-[#4C9F44] text-#fff rounded-8rpx mx-60rpx h-90rpx leading-90rpx text-center mt-82rpx" @click="List.handleAddBankCard">
添加其他银行卡
</view>
</view>
</template>
<script lang="ts" setup>
import { useMessage } from 'wot-design-uni'
import {toast} from '@/utils/toast'
const OSS = inject('OSS')
const message = useMessage('wd-message-box-slot')
// 选择银行卡
const showBankCardPopup = ref<boolean>(false)
const selectedBankCardIndex = ref<number>(0)
const bankList = ref<Array<{ id: number, bankName: string, bankCard: string }>>([
{ id: 1, bankName: '招商银行', bankCard: '3265' },
{ id: 2, bankName: '建设银行', bankCard: '1234' },
{ id: 3, bankName: '农业银行', bankCard: '5678' },
])
const List = {
handleDeleteBankCard: (index: number) => {
message.confirm({
title: '是否删除银行卡',
msg: '删除银行卡后无法恢复，确定删除银行卡吗？',
confirmButtonText: '去预定',
cancelButtonText: '取消',
cancelButtonProps: {
customClass: '!bg-[#F6F7F8] !text-[#303133] !text-32rpx !leading-44rpx !rounded-8rpx',
},
confirmButtonProps: {
customClass: '!bg-[#4C9F44] !text-[#fff] !text-32rpx !leading-44rpx !rounded-8rpx',
}
}).then((res) => {
bankList.value.splice(index, 1)
toast.info('删除成功')
// 点击确认按钮回调事件
}).catch(() => {
// 点击取消按钮回调事件
})
},
// 跳转到添加银行卡页面
handleAddBankCard: () => {
uni.navigateTo({
url: '/bundle/parten/pages/bank-card/add'
})
}
}
</script>
<style lang="scss" scoped>
page {
background: $cz-page-background;
}
</style>

244
src/bundle/parten/pages/bill/bill.vue
View File

@ -1,24 +1,244 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationBarTitleText": ""
}
<route lang="jsonc" type="page">{
"layout": "default",
"style": {
"navigationBarBackgroundColor": "#FFF",
"navigationBarTitleText": "收益明细"
}
</route>
}</route>
<template>
<view class="">
<tabbar tab="bill"></tabbar>
<view>
<view class="mt-30rpx">
<view class="text-32rpx leading-62rpx text-#111827 mx-30rpx">本月运营数据</view>
<!-- 柱状图 -->
<view class="mx-30rpx mt-16rpx">
<uni-echarts custom-class="chart" :option="option"></uni-echarts>
</view>
<!-- 数据卡片 -->
<view class="flex items-center justify-between mx-60rpx mt-20rpx">
<view class="bg-#FAFAFA rounded-16rpx px-30rpx py-18rpx w-300rpx">
<view class="mb-16rpx">
<view class="text-22rpx leading-32rpx text-#718096">本月销售额(元)</view>
<view class="font-400 text-36rpx leading-50rpx text-#303133 mt-6rpx">38,456.00</view>
</view>
<view>
<view class="text-22rpx leading-32rpx text-#718096">上月销售额(元)</view>
<view class="font-400 text-36rpx leading-50rpx text-#303133 mt-6rpx">21,300.00</view>
</view>
</view>
<view class="bg-#FAFAFA rounded-16rpx px-30rpx py-18rpx w-300rpx">
<view class="mb-16rpx">
<view class="text-22rpx leading-32rpx text-#718096">本月订单数</view>
<view class="font-400 text-36rpx leading-50rpx text-#303133 mt-6rpx">1,286</view>
</view>
<view>
<view class="text-22rpx leading-32rpx text-#718096">失效订单数</view>
<view class="font-400 text-36rpx leading-50rpx text-#303133 mt-6rpx">63</view>
</view>
</view>
</view>
<!-- 分隔线 -->
<view class="h-20rpx bg-#F6F7F8 mt-50rpx mb-28rpx"></view>
<view class="">
<view class="flex justify-between items-center mx-30rpx">
<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="Bill.handleConfirmDate"></wd-datetime-picker>
</view>
<view>
<wd-icon name="fill-arrow-down" size="32rpx" color="#BFC2CC"></wd-icon>
</view>
</view>
</view>
<!-- 分隔线 -->
<view class="h-2rpx bg-#F6F7F8 mt-22rpx"></view>
<view class="mt-30rpx" >
<!-- 数据列表 最后一个元素不显示border-->
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Bill.upCallback">
<view>
<view class="mx-30rpx">
<view class="flex items-center">
<view class="w-12rpx h-12rpx rounded-12rpx bg-#4C9F44 mr-14rpx"></view>
<view class="font-400 text-26rpx leading-36rpx text-#9CA3AF">下单时间：2025-04-23 17:21:32</view>
</view>
<view class="flex items-center justify-between mt-28rpx">
<view class="mr-18rpx">
<wd-img width="60rpx" height="60rpx" :src="`${OSS}icon/icon_room.png`"></wd-img>
<!-- <wd-img width="60rpx" height="60rpx" :src="`${OSS}icon/icon_avatar2.png`"></wd-img> -->
</view>
<view class="flex-1 flex items-center justify-between">
<view>
<view class="flex items-center">
<view class="font-bold text-30rpx leading-42rpx text-#303133 mr-18rpx">包间预定</view>
<!-- <view class="font-bold text-30rpx leading-42rpx text-#303133 mr-18rpx">茶艺师预定</view> -->
<view>
<wd-tag color="#F55726" bg-color="#F55726" plain custom-class="!rounded-4rpx">申请中</wd-tag>
<!-- <wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">已结算</wd-tag>
<wd-tag color="#C9C9C9" bg-color="#C9C9C9" plain custom-class="!rounded-4rpx">订单取消</wd-tag> -->
</view>
</view>
<view class="font-400 text-26rpx leading-36rpx text-#303133 mt-14rpx">预定号：15001901995</view>
</view>
<view class="text-right">
<view>
<price-format color="#FF5951" :first-size="40" :second-size="40" :subscript-size="28" :price="23.02"></price-format>
<!-- 不予结算的情况下价格显示的颜色不一样 -->
<!-- <price-format color="#909399" :first-size="40" :second-size="40" :subscript-size="28" :price="23.02"></price-format> -->
</view>
<view class="font-400 text-26rpx leading-36rpx text-#9CA3AF mt-14rpx">预估收益</view>
<!-- <view class="font-400 text-26rpx leading-36rpx text-#9CA3AF mt-14rpx">已收益</view>
<view class="font-400 text-26rpx leading-36rpx text-#9CA3AF mt-14rpx">不予结算</view> -->
</view>
</view>
</view>
</view>
<view class="h-2rpx bg-#F6F7F8 mt-28rpx mb-30rpx"></view>
</view>
</mescroll-body>
</view>
</view>
</view>
<tabbar tab="bill" />
</view>
</template>
<script lang="ts" setup>
import Tabbar from '@/bundle/parten/components/Tabbar.vue'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
import { BarChart } from "echarts/charts";
import { DatasetComponent, LegendComponent, TooltipComponent, GridComponent } from "echarts/components";
import { use } from "echarts/core";
import { CanvasRenderer } from "echarts/renderers";
import { ref } from "vue";
import type { EChartsOption } from 'echarts'
const OSS = inject('OSS')
use([
LegendComponent,
TooltipComponent,
DatasetComponent,
BarChart,
CanvasRenderer,
GridComponent
]);
const OSS = inject('OSS')
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
// 柱状图
const option = ref<EChartsOption>({
tooltip: { trigger: 'axis' },
legend: { show: false },
grid: { left: 12, right: 12, top: 10, bottom: 10, containLabel: true },
xAxis: {
type: 'category',
data: ['一', '二', '三', '四', '五', '六', '日'],
axisTick: { alignWithLabel: true }
},
yAxis: { type: 'value', splitNumber: 4 },
series: [
{
name: '销售额',
type: 'bar',
barWidth: '40%',
itemStyle: { color: '#4C9F44', borderRadius: [4, 4, 0, 0] },
data: [120, 200, 150, 80, 70, 110, 130]
}
]
})
// 日期过滤
const value = ref<number>(Date.now())
const Bill = {
// 上拉加载的回调: 其中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}月`);
},
}
</script>
<style lang="scss">
.chart {
height: 500rpx;
}
<style lang="scss" scoped>
</style>
.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;
}
.wd-datetime-picker__action--cancel {
color: #606266 !important;
}
.wd-datetime-picker__action {
color: #4C9F44;
}
}
}
</style>

122
src/bundle/parten/pages/fund-record/fund-record.vue Normal file
View File

@ -0,0 +1,122 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationBarBackgroundColor": "#FFF",
"navigationBarTitleText": "资金记录"
}
}
</route>
<template>
<view>
<view class="h-20rpx bg-#F6F7F8"></view>
<view class="pt-30rpx">
<view class="flex items-center mx-30rpx">
<view
class="bg-#F6F7F8 w-130rpx h-56rpx leading-56rpx rounded-8rpx text-center font-400 text-28rpx text-#303133 mr-16rpx"
:class="currentTab === index ? '!bg-#4C9F44 text-#fff' : ''"
v-for="(item, index) in tab" :key="index"
@click="FundRecord.handleChangeTab(index)">
{{ item.name }}
</view>
</view>
<view class="mt-20rpx">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="FundRecord.upCallback">
<view class="mx-30rpx border-b border-b-solid mb-26rpx pb-30rpx" v-for="(item, index) in 10" :key="index">
<view class="flex items-center justify-between">
<view class="flex items-center">
<view class="text-28rpx text-#303133 leading-40rpx mr-30rpx">提现</view>
<wd-tag color="#40AE36" bg-color="#40AE36" plain custom-class="!rounded-4rpx">申请中</wd-tag>
<!-- <view class="w-86rpx h-32rpx leading-24rpx text-center rounded-4rpx text-22rpx border-2rpx border-solid border-#40AE36 text-#40AE36">申请中</view> -->
</view>
<view class="font-bold text-36rpx text-#303133 leading-50rpx">-5000.00</view>
</view>
<view class="mt-10rpx flex items-center justify-between text-24rpx text-#909399 leading-34rpx">
<view>2024-05-20 12:30:20</view>
<view>余额1388.22</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 { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom)
// tab 切换
const tab = ref<Array<{ id: number, name: string }>>([
{ id: 1, name: '全部' },
{ id: 2, name: '收入' },
{ id: 3, name: '支出' },
])
const currentTab = ref<number>(0)
const FundRecord = {
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(); // 请求失败, 结束加载
// })
},
handleChangeTab: (index: number) => {
currentTab.value = index
getMescroll().resetUpScroll() // 重置上拉
}
}
</script>
<style lang="scss" scoped>
page {
background: #FFF;
}
</style>

5
src/bundle/parten/pages/my/my.vue
View File

@ -29,7 +29,6 @@
<view class="flex items-center mr-12rpx">
<wd-img width="36rpx" height="36rpx" mode="aspectFill" :src="`${OSS}icon/icon_crown.png`" round></wd-img>
</view>
<!-- 这里要根据用户身份显示不同的文字 -->
<view class="text-24rpx text-[#675649] leading-34rpx flex items-center">茶址合伙人</view>
</view>
</view>
@ -48,7 +47,7 @@
</view>
<!-- 余额显示 -->
<view class="mt-30rpx relative">
<view class="mt-20rpx relative">
<wd-img width="750rpx" height="360rpx" :src="`${OSS}images/parten/parten_image2.png`" mode="aspectFill" />
<view class="absolute top-12rpx left-30rpx right-0 w-full">
@ -128,7 +127,7 @@
handleToMyBank: () => {
uni.navigateTo({
url: '/bundle/parten/pages/my-bank/my-bank'
url: '/bundle/parten/pages/bank-card/list'
})
},

182
src/bundle/parten/pages/sub/profile.vue Normal file
View File

@ -0,0 +1,182 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationStyle": "custom"
}
}
</route>
<template>
<view class="home-bg">
<view class="home-bg w-[100%] fixed top-0 left-0 z-100">
<view>
<navbar custom-class='!bg-[transparent]'></navbar>
</view>
</view>
<view class="pb-200rpx" :style="{ paddingTop: navbarHeight + 'px' }">
<!-- 账号昵称显示 -->
<view class="ml-60rpx flex items-center">
<view>
<wd-img width="120rpx" height="120rpx" :src="`${OSS}icon/icon_avatar.png`" mode="aspectFill" round />
</view>
<view class="flex-1 ml-22rpx flex justify-between items-center">
<view @click="Profile.handleToProfile">
<view class="text-[#303133] text-36rpx leading-50rpx ml-8rpx">昵称名称</view>
<view class="flex justify-center items-center mt-10rpx text-26rpx text-[#675649] font-400 leading-36rpx flex items-center">
13525626532
</view>
</view>
</view>
</view>
<view class="bg-white rounded-t-16rpx mt-46rpx px-30rpx">
<view class="font-bold text-34rpx leading-48rpx text-#303133 pt-36rpx">茶艺师的名字</view>
<view class="">
<wd-rate v-model="rate" readonly active-color="#FF5951" allow-half active-icon="star-filled" icon="star" space="4rpx"/>
</view>
<view class="flex items-center mt-20rpx">
<view class=" mr-20rpx">
<wd-tag color="#FF5951" bg-color="#FEF1F0" custom-class="!rounded-6rpx !px-16rpx !py-4rpx !h-40rpx">90后茶艺师</wd-tag>
</view>
<view class="w-160rpx h-40rpx relative mr-44rpx top-6rpx">
<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 h-40rpx">金牌茶艺师</view>
</view>
</view>
</view>
<view class="h-2rpx bg-#F6F7F9 mx-30rpx mt-28rpx"></view>
<view class="flex justify-between items-center mx-88rpx text-center mt-30rpx">
<view>
<view class="font-400 text-28rpx leading-40rpx text-#606266">性别</view>
<view class="font-bold text-30rpx leading-42rpx text-#303133 mt-12rpx">女</view>
</view>
<view class="w-4rpx h-66rpx bg-#F6F7F9"></view>
<view>
<view class="font-400 text-28rpx leading-40rpx text-#606266">年龄</view>
<view class="font-bold text-30rpx leading-42rpx text-#303133 mt-12rpx">21岁</view>
</view>
<view class="w-4rpx h-66rpx bg-#F6F7F9"></view>
<view>
<view class="font-400 text-28rpx leading-40rpx text-#606266">身高</view>
<view class="font-bold text-30rpx leading-42rpx text-#303133 mt-12rpx">165cm</view>
</view>
<view class="w-4rpx h-66rpx bg-#F6F7F9"></view>
<view>
<view class="font-400 text-28rpx leading-40rpx text-#606266">体重</view>
<view class="font-bold text-30rpx leading-42rpx text-#303133 mt-12rpx">53kg</view>
</view>
</view>
<view class="flex items-center justify-between mx-30rpx mt-40rpx">
<view>
<wd-img :src="`${OSS}images/reserve_room/reserve_room_image2.png`" width="220rpx" height="240rpx" radius="16rpx"></wd-img>
</view>
<view>
<wd-img :src="`${OSS}images/reserve_room/reserve_room_image2.png`" width="220rpx" height="240rpx" radius="16rpx"></wd-img>
</view>
<view>
<wd-img :src="`${OSS}images/reserve_room/reserve_room_image2.png`" width="220rpx" height="240rpx" radius="16rpx"></wd-img>
</view>
</view>
<!-- 兴趣爱好 -->
<view class="mx-30rpx mt-44rpx">
<view class="font-bold text-32rpx leading-44rpx text-#303133">
兴趣爱好
</view>
<view class="bg-#FBFBFB rounded-8rpx px-28rpx py-20rpx mt-22rpx">
<view class="flex items-center">
<view class="mr-12rpx">
<wd-img :src="`${OSS}icon/icon_tea2.png`" width="32rpx" height="32rpx"></wd-img>
</view>
<view class="font-400 text-26rpx leading-36rpx text-#606266">兴趣爱好</view>
</view>
<view class="mt-20rpx font-400 text-28rpx leading-40rpx text-#303133">
“爱好茶艺，喜欢旅游，把爱好当工作”
</view>
</view>
</view>
<view class="h-20rpx bg-#F6F7F9 mt-42rpx mb-40rpx"></view>
<!-- 费用说明 -->
<view class="mx-30rpx mt-44rpx">
<view class="font-bold text-32rpx leading-44rpx text-#303133">
费用说明
</view>
<view class="flex items-center mt-24rpx">
<view class="mr-12rpx flex items-center">
<wd-img :src="`${OSS}icon/icon_billing.png`" width="32rpx" height="32rpx"></wd-img>
</view>
<view class="font-400 text-26rpx leading-36rpx text-#606266">计费标准</view>
</view>
<view class=" mt-22rpx">
<view class="flex items-center justify-between">
<view class="w-8rpx h-8rpx rounded-8rpx bg-#6A6363 mr-14rpx"></view>
<view class="flex-1 flex items-center justify-between font-500 text-26rpx leading-48rpx text-#303133">
<view>服务费</view>
<view>￥160/小时</view>
</view>
</view>
<view class="flex items-center justify-between mt-20rpx">
<view class="w-8rpx h-8rpx rounded-8rpx bg-#6A6363 mr-14rpx"></view>
<view class="flex-1 flex items-center justify-between font-500 text-26rpx leading-48rpx text-#303133">
<view>车马费</view>
<view>￥3.00/公里</view>
</view>
</view>
</view>
</view>
</view>
<tabbar tab="my"></tabbar>
</view>
</template>
<script lang="ts" setup>
import Tabbar from '@/bundle/parten/components/Tabbar.vue'
const OSS = inject('OSS')
const navbarHeight = inject('navbarHeight')
// 评分
const rate = ref(4.5)
const Profile = {
handleToProfile: () => {
uni.navigateTo({
url: '/pages/profile/profile'
})
},
handleToMyBank: () => {
uni.navigateTo({
url: '/bundle/parten/pages/my-bank/my-bank'
})
},
handleToFundRecord: () => {
uni.navigateTo({
url: '/bundle/parten/pages/fund-record/fund-record'
})
},
}
</script>
<style lang="scss">
page, home-bg{
background: #fff url(#{$OSS}images/parten/parten_image3.png) 0 0 no-repeat;
background-size: 100%;
}
</style>

142
src/bundle/parten/pages/sub/sub.vue
View File

@ -2,23 +2,157 @@
{
"layout": "default",
"style": {
"navigationBarTitleText": ""
"navigationBarBackgroundColor": "#FFF",
"navigationBarTitleText": "下级用户"
}
}
</route>
<template>
<view class="">
<view>
<!-- 展示人员信息 -->
<wd-overlay :show="showProfilePopup" @click="showProfilePopup = false">
<view class="h-full relative pb-62rpx">
<view class="absolute-center bg-white rounded-30rpx w-660rpx px-88rpx py-48rpx">
<view>
<view class="text-center">
<wd-img width="100rpx" height="100rpx" :src="`${OSS}icon/icon_avatar.png`" mode="aspectFill" round />
</view>
<view class="font-bold text-28rpx leading-40rpx text-#303133 mt-16rpx text-center">用户昵称</view>
<view class="mt-10rpx text-center">13525626532</view>
<view class="flex items-center justify-between mt-62rpx">
<view class="text-center">
<view class="font-bold text-36rpx leading-50rpx text-#303133">1200</view>
<view class="font-400 text-26rpx leading-36rpx text-#606266 mt-20rpx">本月下级佣金</view>
</view>
<view class="text-center">
<view class="font-bold text-36rpx leading-50rpx text-#303133">1200</view>
<view class="font-400 text-26rpx leading-36rpx text-#606266 mt-20rpx">本月下级佣金</view>
</view>
</view>
<view class="mt-46rpx">
<text class="font-400 text-26rpx leading-36rpx text-#303133">加入时间：</text>
<text class="text-26rpx leading-36rpx text-#909399">2025-03-08 11:20</text>
</view>
</view>
</view>
</view>
</wd-overlay>
<view class="mt-24rpx pb-60rpx">
<view class="mt-20rpx">
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Sub.upCallback">
<view class="mx-30rpx border-b border-b-solid mb-26rpx pb-10rpx flex" v-for="(item, index) in 10" :key="index">
<view class="mr-20rpx" @click="Sub.handleShowProfilePopup">
<wd-img width="100rpx" height="100rpx" :src="`${OSS}icon/icon_avatar.png`" mode="aspectFill" round />
</view>
<view class="flex-1 flex justify-between items-center">
<view @click="Sub.handleToSubPorfile(item)">
<view class="font-bold text-28rpx leading-40rpx text-#303133">用户昵称</view>
<view class="font-400 text-26rpx leading-36rpx text-#303133 mt-12rpx">13525626532</view>
<view class="text-24rpx leading-34rpx text-#909399 mt-10rpx">2025-03-08 11:20</view>
</view>
<view @click="Sub.handleCallMobile">
<wd-img width="64rpx" height="64rpx" :src="`${OSS}icon/icon_phone.png`" mode="aspectFill" round />
</view>
</view>
</view>
</mescroll-body>
</view>
</view>
<tabbar tab="sub"></tabbar>
</view>
</template>
<script lang="ts" setup>
import Tabbar from '@/bundle/parten/components/Tabbar.vue'
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
const OSS = inject('OSS')
const OSS = inject('OSS')
// mescroll
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom)
// 展示人员信息
const showProfilePopup = ref<boolean>(false)
// tab 切换
const tab = ref<Array<{ id: number, name: string }>>([
{ id: 1, name: '全部' },
{ id: 2, name: '收入' },
{ id: 3, name: '支出' },
])
const currentTab = ref<number>(0)
const Sub = {
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(); // 请求失败, 结束加载
// })
},
// 打电话
handleCallMobile: (mobile: number) => {
uni.makePhoneCall({
phoneNumber: '13525626532'
})
},
// 展示人员信息
handleShowProfilePopup: () => {
showProfilePopup.value = true
},
// 去下级用户详情
handleToSubPorfile: (item: any) => {
uni.navigateTo({
url: '/bundle/parten/pages/sub/profile'
})
}
}
</script>
<style lang="scss" scoped>
</style>
page {
background: #FFF;
}
</style>

89
src/bundle/parten/pages/withdraw/progress.vue Normal file
View File

@ -0,0 +1,89 @@
<route lang="jsonc" type="page">
{
"layout": "default",
"style": {
"navigationBarBackgroundColor": "#FFF",
"navigationBarTitleText": "余额提现"
}
}
</route>
<template>
<view>
<view class="mt-76rpx">
<!-- 进度1-平台审核中 -->
<view class="mx-98rpx flex">
<view class="mr-44rpx">
<wd-img width="40rpx" height="260rpx" :src="`${OSS}images/withdraw/withdraw_image1.png`"></wd-img>
</view>
<view>
<view class="font-400 text-#606266">
<view class="text-26rpx leading-36rpx">发起提现申请</view>
<view class="mt-8rpx text-24rpx leading-34rpx ">2025-04-08 21:25:25</view>
</view>
<view class="font-400 text-#606266 mt-26rpx">
<view class="text-30rpx leading-42rpx">平台审核中</view>
<view class="mt-10rpx text-26rpx leading-36rpx ">2025-04-08 21:25:25</view>
</view>
<view class="mt-44rpx font-400 text-26rpx leading-36rpx text-#BFC2CC">
到账成功
</view>
</view>
</view>
<!-- 进度2-到账成功 -->
<!-- <view class="mx-98rpx flex">
<view class="mr-44rpx">
<wd-img width="22rpx" height="260rpx" :src="`${OSS}images/withdraw/withdraw_image2.png`"></wd-img>
</view>
<view>
<view class="font-400 text-#606266">
<view class="text-26rpx leading-36rpx">发起提现申请</view>
<view class="mt-8rpx text-24rpx leading-34rpx ">2025-04-08 21:25:25</view>
</view>
<view class="font-400 text-#606266 mt-26rpx">
<view class="text-30rpx leading-42rpx">平台审核中</view>
<view class="mt-10rpx text-26rpx leading-36rpx ">2025-04-08 21:25:25</view>
</view>
<view class="mt-44rpx font-400 text-30rpx leading-44rpx">
<view>到账成功</view>
<view class="mt-10rpx text-26rpx leading-36rpx">2025-04-08 21:25:25</view>
</view>
</view>
</view> -->
<view class="mt-82rpx mb-38rpx mx-30rpx">
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
<view class="mx-60rpx">
<view class="flex items-center justify-between font-400 text-28rpx leading-40rpx">
<view class="text-#606266">提现金额</view>
<view class="text-#303133">￥5000.00</view>
</view>
<view class="flex items-center justify-between font-400 text-28rpx leading-40rpx">
<view class="text-#606266">到账银行卡</view>
<view class="text-#303133">招商银行（3265)</view>
</view>
</view>
<view class="mx-60rpx mt-90rpx bg-#F6F7F8 rounded-8rpx h-90rpx leading-90rpx text-center">
完成
</view>
</view>
</view>
</template>
<script lang="ts" setup>
const OSS = inject('OSS')
</script>
<style lang="scss" scoped>
page {
background: #FFF;
}
</style>

69
src/bundle/parten/pages/withdraw/withdraw.vue
View File

@ -11,10 +11,54 @@
<template>
<!-- 用 calc(100vh - var(--window-top) - var(--window-bottom)) 精准占满，无滚动条 -->
<view class="flex flex-col bg-[#F6F7F9] overflow-hidden" :style="pageHeightStyle">
<!-- 售后原因弹出框 -->
<wd-popup v-model="showBankCardPopup" lock-scroll custom-style="border-radius: 32rpx 32rpx 0rpx 0rpx;" position="bottom">
<view class="relative pb-78rpx">
<view class="absolute top-18rpx right-30rpx" @click="showBankCardPopup = 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>
<view>
<scroll-view class="h-500rpx" scroll-y :show-scrollbar="false">
<wd-radio-group v-model="selectedBankCardIndex">
<view v-for="(item, index) in bankList" :key="index">
<wd-radio :value="item.id" checked-color="#4C9F44" size='large' shape="dot" custom-class="!mr-60rpx">
<view class="flex items-center mx-60rpx ">
<view class="flex">
<view class="mr-40rpx">
<wd-img width="44rpx" height="44rpx" mode="aspectFill" :src="`${OSS}icon/icon_bank_card2.png`"></wd-img>
</view>
<view class="font-400 text-30rpx leading-42rpx text-#303133">{{ item.bankName }} 储蓄卡（3265）</view>
</view>
</view>
</wd-radio>
<view class="mx-60rpx mt-36rpx">
<wd-gap height="2rpx" bg-color="#F6F7F9"></wd-gap>
</view>
</view>
</wd-radio-group>
<view class="flex items-center justify-between mx-60rpx mt-26rpx" @click="Withdraw.handleAddNewBankCard">
<view class="flex items-center">
<view class="flex items-center mr-40rpx">
<wd-img width="44rpx" height="44rpx" mode="aspectFill" :src="`${OSS}icon/icon_bank_card3.png`"></wd-img>
</view>
<view class="font-400 text-30rpx leading-42rpx text-#303133">使用新卡提现</view>
</view>
<view class="flex items-center">
<wd-icon name='arrow-right' size="22rpx"></wd-icon>
</view>
</view>
</scroll-view>
</view>
<view class="w-630rpx h-90rpx leading-90rpx text-center bg-[#4C9F44] rounded-8rpx text-[#fff] mx-auto mt-30rpx" @click="Withdraw.handleSelectReason">确定</view>
</view>
</wd-popup>
<!-- 顶部信息区 -->
<view class="flex justify-between items-center pl-60rpx pr-28rpx pt-64rpx pb-64rpx">
<view class="text-#303133 text-28rpx leading-40rpx">到账银行卡</view>
<view class="flex items-center">
<view class="flex items-center" @click="showBankCardPopup = true">
<view class="flex items-center mr-16rpx">
<wd-img width="44rpx" height="44rpx" mode="aspectFill" :src="`${OSS}icon/icon_bank_card2.png`"></wd-img>
</view>
@ -47,9 +91,18 @@
</template>
<script lang="ts" setup>
import { inject, computed } from 'vue'
const OSS = inject('OSS')
// 选择银行卡
const showBankCardPopup = ref<boolean>(false)
const selectedBankCardIndex = ref<number>(0)
const bankList = ref<Array<{ id: number, bankName: string, bankCard: string }>>([
{ id: 1, bankName: '招商银行', bankCard: '3265' },
{ id: 2, bankName: '建设银行', bankCard: '1234' },
{ id: 3, bankName: '农业银行', bankCard: '5678' },
])
// 提现金额
const withdrawMoney = ref<number>(0)
@ -62,7 +115,15 @@
// 确定提现
handleConfirmwithdrawMoney: () => {
}
},
// 添加银行卡
handleAddNewBankCard: () => {
showBankCardPopup.value = false
uni.navigateTo({
url: '/bundle/parten/pages/bank-card/add'
})
},
}
</script>
@ -70,6 +131,6 @@
<style lang="scss" scoped>
page {
background: $cz-page-background;
background: $cz-page-background;
}
</style>

5
src/bundle/tea-room/room.vue
View File

@ -35,7 +35,7 @@
<view class="text-34rpx text-[#303133] leading-48rpx font-bold line-1">凝香茶业</view>
<view class="relative mt-18rpx h-34rpx">
<view class="absolute top-0 flex items-center">
<wd-rate v-model="rate" readonly active-color="#FF5951" color="#FF5951" active-icon="star-filled" icon="star" space="4rpx"></wd-rate>
<wd-rate v-model="rate" readonly active-color="#FF5951" allow-half active-icon="star-filled" icon="star" space="4rpx"/>
<view class="text-26rpx text-[#606266] leading-34rpx ml-8rpx">4.0 推荐</view>
</view>
</view>
@ -126,7 +126,10 @@
`${OSS}images/banner1.png`
])
const current = ref<number>(0)
// 评分
const rate = ref<number>(4)
// tab
const tab = ref<number>(0)

8
src/bundle/wallet/wallet.vue
View File

@ -194,6 +194,14 @@
.wd-datetime-picker__arrow {
display: none !important;
}
.wd-datetime-picker__action--cancel {
color: #606266 !important;
}
.wd-datetime-picker__action {
color: #4C9F44;
}
}
}
</style>