对接接口
This commit is contained in:
@ -10,15 +10,13 @@
|
||||
|
||||
<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>
|
||||
<wd-input v-model="form.bank_name" 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>
|
||||
@ -27,12 +25,13 @@
|
||||
</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>
|
||||
<wd-input v-model="form.bank_card" 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>
|
||||
@ -40,13 +39,14 @@
|
||||
<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="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>
|
||||
<wd-input v-model="form.bank_open_name" 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>
|
||||
@ -55,12 +55,28 @@
|
||||
</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 v-model="form.mobile" 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;">
|
||||
<wd-input size="large" v-model="form.code" 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">
|
||||
@ -92,6 +108,11 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {toast} from '@/utils/toast'
|
||||
import type { IAddBankCardParams } from '@/api/types/bank'
|
||||
import { addBankCard } from '@/api/bank'
|
||||
import { getVerificationCode } from '@/api/user'
|
||||
import { SMS_ENUM } from '@/enum/sms'
|
||||
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
@ -113,43 +134,77 @@
|
||||
const countDown = ref<any>(null) // 倒计时组件
|
||||
|
||||
// 表单
|
||||
const form = reactive<{
|
||||
settleIn: number,
|
||||
code: string,
|
||||
message: string,
|
||||
area: string[]
|
||||
}>({
|
||||
settleIn: 1,
|
||||
const form = reactive<IAddBankCardParams>({
|
||||
bank_name: '',
|
||||
bank_card: '',
|
||||
mobile: '',
|
||||
code: '',
|
||||
message: '',
|
||||
area: []
|
||||
bank_open_name: '',
|
||||
})
|
||||
|
||||
const Add = {
|
||||
// 确定提现
|
||||
handleConfirmwithdrawMoney: () => {
|
||||
|
||||
/**
|
||||
* 绑定银行卡
|
||||
*/
|
||||
handleBindBankCard: async () => {
|
||||
if (!form.bank_name) {
|
||||
toast.info('请输入银行名称')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.bank_card) {
|
||||
toast.info('请输入银行卡号')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.mobile) {
|
||||
toast.info('请输入绑定手机号')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.bank_open_name) {
|
||||
toast.info('请输入开户行名称')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.code) {
|
||||
toast.info('请输入验证码')
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
await addBankCard(form)
|
||||
toast.success('绑定成功')
|
||||
uni.navigateBack()
|
||||
} catch (error) {
|
||||
toast.info('绑定失败,请稍后重试')
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
// 发送验证码
|
||||
handleCountDown: () => {
|
||||
/**
|
||||
* 发送验证码
|
||||
*/
|
||||
handleCountDown: async () => {
|
||||
if (!form.mobile) {
|
||||
toast.info('请输入绑定手机号')
|
||||
return
|
||||
}
|
||||
|
||||
await getVerificationCode({ scene: SMS_ENUM.BANK, mobile: String(form.mobile) })
|
||||
startCountDown.value = true
|
||||
nextTick(() => {
|
||||
countDown.value?.start()
|
||||
|
||||
// 发送验证码请求
|
||||
})
|
||||
},
|
||||
|
||||
// 验证码倒计时结束
|
||||
/**
|
||||
* 验证码倒计时结束
|
||||
*/
|
||||
handleFinishCountDown: () => {
|
||||
startCountDown.value = false
|
||||
},
|
||||
|
||||
// 绑定银行卡
|
||||
handleBindBankCard: () => {
|
||||
toast.info('绑定成功')
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
@ -77,8 +77,33 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { getUserTransactionDetailsInfo } from '@/api/user'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
// 提现明细
|
||||
const id = ref<number>(0)
|
||||
const billDetails = ref<any>({
|
||||
id: 0,
|
||||
amount: 0,
|
||||
change_type: 0,
|
||||
order: {
|
||||
order_sn: '',
|
||||
pay_way: '', // 支付方式 1余额支付 2微信支付 3门店支付
|
||||
nickname: '',
|
||||
mobile: '',
|
||||
update_dtime: '',
|
||||
service_price: ''
|
||||
}
|
||||
})
|
||||
|
||||
onLoad(async (args) => {
|
||||
id.value = Number(args.id) || 0
|
||||
const res = await getUserTransactionDetailsInfo(id.value)
|
||||
billDetails.value = res.details
|
||||
console.log("🚀 ~ billDetails.value:", billDetails.value)
|
||||
})
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
@ -24,7 +24,7 @@
|
||||
<view class="mt-32rpx">
|
||||
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">抖音UID</view>
|
||||
<view class="mt-10rpx">
|
||||
<wd-input v-model="form.uid" :maxlength="20" show-word-limit placeholder="请输入抖音UID"/>
|
||||
<wd-input v-model="form.dy_uid" :maxlength="20" show-word-limit placeholder="请输入抖音UID"/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -34,11 +34,11 @@
|
||||
<view class="mt-50rpx">
|
||||
<view class="text-30rpx leading-42rpx text-[#303133]">省市区</view>
|
||||
<view class="border-b border-b-solid border-b-[#e5e7eb] area">
|
||||
<wd-col-picker v-model="form.area" :columns="area" :column-change="columnChange" @confirm="EditStore.handleConfirmAddress" placeholder="请选择省市区"></wd-col-picker>
|
||||
<wd-col-picker v-model="address" :columns="area" :column-change="columnChange" auto-complete @confirm="EditStore.handleConfirmAddress" placeholder="请选择省市区"> </wd-col-picker>
|
||||
</view>
|
||||
</view>
|
||||
<view class="mt-28rpx">
|
||||
<view class="text-30rpx leading-42rpx text-[#303133]">省市区</view>
|
||||
<view class="text-30rpx leading-42rpx text-[#303133]">地址</view>
|
||||
<view>
|
||||
<wd-input v-model="form.address" placeholder="请填写具体地址"/>
|
||||
</view>
|
||||
@ -66,12 +66,12 @@
|
||||
<view class="mt-32rpx">
|
||||
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店电话</view>
|
||||
<view class="mt-10rpx">
|
||||
<wd-input v-model="form.uid" :maxlength="20" show-word-limit placeholder="请输入门店电话"/>
|
||||
<wd-input v-model="form.contact_phone" :maxlength="20" show-word-limit placeholder="请输入门店电话"/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 门店视频 -->
|
||||
<view class="mt-32rpx">
|
||||
<!-- <view class="mt-32rpx">
|
||||
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店视频</view>
|
||||
<view class="mt-32rpx">
|
||||
<wd-upload :file-list="fileList" :limit="1" image-mode="scaleToFill" accept="video" :action="action"
|
||||
@ -86,14 +86,13 @@
|
||||
</view>
|
||||
</wd-upload>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view> -->
|
||||
<!-- 门店图片 -->
|
||||
<view class="mt-32rpx">
|
||||
<view class="font-bold text-32rpx text-[#303133] leading-44rpx">门店图片</view>
|
||||
<view class="mt-32rpx">
|
||||
<wd-upload :file-list="fileList" :limit="9" image-mode="scaleToFill" accept="image" :action="action"
|
||||
@change="EditStore.handleUploadFile">
|
||||
<wd-upload :header="{'token': token}" :file-list="fileList" image-mode="aspectFill" :limit="9" multiple :action="action"
|
||||
@change="EditStore.handleUploadFile">
|
||||
<view
|
||||
class="border-2rpx border-dashed border-[#E5E5E5] w-184rpx h-184rpx flex flex-col items-center justify-center rounded-16rpx">
|
||||
<view class="">
|
||||
@ -116,37 +115,26 @@
|
||||
<script lang="ts" setup>
|
||||
import { useColPickerData } from '@/hooks/useColPickerData'
|
||||
import { toast } from '@/utils/toast'
|
||||
import { getStoreDetails, editStoreInfo } from '@/api/store'
|
||||
import { useStoreStore } from '@/store'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const useStore = useStoreStore()
|
||||
const token = ref<string>('') // 用户token
|
||||
|
||||
// 上传文件
|
||||
// const fileList = ref<any[]>([])
|
||||
const fileList = ref<any[]>([])
|
||||
const action = 'https://www.mocky.io/v2/5cc8019d300000980a055e76' // 仅做测试使用,实际请换成真实上传接口
|
||||
|
||||
// 表单数据
|
||||
const form = ref({
|
||||
name: "",
|
||||
uid: "",
|
||||
area: [],
|
||||
address: "",
|
||||
start_time: "",
|
||||
end_time: "",
|
||||
phone: ""
|
||||
})
|
||||
const action = import.meta.env.VITE_UPLOAD_BASEURL
|
||||
|
||||
// 省市区数据
|
||||
const { colPickerData, findChildrenByCode } = useColPickerData()
|
||||
const value = ref<string[]>([])
|
||||
const area = ref<any[]>([
|
||||
colPickerData.map((item) => {
|
||||
return {
|
||||
value: item.value,
|
||||
label: item.text
|
||||
}
|
||||
})
|
||||
])
|
||||
const columnChange = ({ selectedItem, resolve, finish }) => {
|
||||
const areaData = findChildrenByCode(colPickerData, selectedItem.value)
|
||||
const address = ref<string[]>([])
|
||||
const area = ref<any[]>([])
|
||||
const columnChange = async ({ selectedItem, resolve, finish }) => {
|
||||
await EditStore.handleSleep(0)
|
||||
|
||||
const areaData = findChildrenByCode(colPickerData, selectedItem.value)
|
||||
if (areaData && areaData.length) {
|
||||
resolve(
|
||||
areaData.map((item) => {
|
||||
@ -161,27 +149,178 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 门店信息
|
||||
const form = ref({
|
||||
id: 0,
|
||||
name: '',
|
||||
dy_uid: '',
|
||||
image: '',
|
||||
image_arr: [],
|
||||
video: '',
|
||||
province: '',
|
||||
province_id: 0,
|
||||
city: '',
|
||||
city_id: 0,
|
||||
district: '',
|
||||
district_id: 0,
|
||||
address: '',
|
||||
area: '',
|
||||
contact_phone: '',
|
||||
day_time: '',
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
})
|
||||
|
||||
onShow(() => {
|
||||
})
|
||||
|
||||
onLoad(() => {
|
||||
token.value = uni.getStorageSync('token')
|
||||
EditStore.handleGetStoreDetails()
|
||||
})
|
||||
|
||||
const EditStore = {
|
||||
fileList: [],
|
||||
|
||||
/**
|
||||
* 获取店铺详情
|
||||
*/
|
||||
handleGetStoreDetails: async () => {
|
||||
const storeDetails = await getStoreDetails(useStore.defaultStore.id)
|
||||
// 只取需要的字段赋值,避免污染
|
||||
const d = storeDetails.details
|
||||
form.value = {
|
||||
id: d.id,
|
||||
name: d.name,
|
||||
dy_uid: d.dy_uid,
|
||||
image: d.image,
|
||||
image_arr: d.image_arr || [],
|
||||
video: d.video || '',
|
||||
province: d.province,
|
||||
province_id: d.province_id,
|
||||
city: d.city,
|
||||
city_id: d.city_id,
|
||||
district: d.district,
|
||||
district_id: d.district_id,
|
||||
address: d.address,
|
||||
area: d.area,
|
||||
contact_phone: d.contact_phone,
|
||||
day_time: d.day_time,
|
||||
start_time: d.start_time,
|
||||
end_time: d.end_time,
|
||||
}
|
||||
|
||||
fileList.value = (d.image_arr || []).map((item: string) => ({ url: item, name: item}))
|
||||
EditStore.fileList = fileList.value
|
||||
|
||||
address.value = [
|
||||
String(d.province_id),
|
||||
String(d.city_id),
|
||||
String(d.district_id)
|
||||
]
|
||||
},
|
||||
|
||||
/**
|
||||
* 选择省市区
|
||||
* @param selected
|
||||
*/
|
||||
handleConfirmAddress(selected) {
|
||||
form.value.address = selected.map(item => item.label)
|
||||
handleConfirmAddress(item) {
|
||||
form.value.province = item.selectedItems[0].label
|
||||
form.value.province_id = Number(item.selectedItems[0].value)
|
||||
form.value.city = item.selectedItems[1].label
|
||||
form.value.city_id = Number(item.selectedItems[1].value)
|
||||
form.value.district = item.selectedItems[2].label
|
||||
form.value.district_id = Number(item.selectedItems[2].value)
|
||||
},
|
||||
|
||||
/**
|
||||
* 图片选择/删除
|
||||
*/
|
||||
handleUploadFile: (event: any) => {
|
||||
fileList.value = event.fileList
|
||||
handleUploadFile: ({ fileList: files }) => {
|
||||
let url = ''
|
||||
let name = ''
|
||||
let response = null
|
||||
|
||||
const res = files.map(item => {
|
||||
if (item.response) {
|
||||
response = JSON.parse(item.response)
|
||||
url = response.data.uri
|
||||
name = response.data.name
|
||||
}
|
||||
return {
|
||||
name: name || item.name,
|
||||
url: url || item.url
|
||||
}
|
||||
})
|
||||
|
||||
EditStore.fileList = res
|
||||
},
|
||||
|
||||
/**
|
||||
* 保存门店信息
|
||||
*/
|
||||
handleSaveStoreInfo: () => {
|
||||
toast.info('保存成功')
|
||||
handleSaveStoreInfo: async () => {
|
||||
if (!form.value.name) {
|
||||
toast.info('请输入门店名称')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.value.address) {
|
||||
toast.info('请输入门店地址')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.value.start_time) {
|
||||
toast.info('请选择营业开始时间')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.value.end_time) {
|
||||
toast.info('请选择营业结束时间')
|
||||
return
|
||||
}
|
||||
|
||||
if (!form.value.contact_phone) {
|
||||
toast.info('请输入门店电话')
|
||||
return
|
||||
}
|
||||
|
||||
if (EditStore.fileList.length === 0) {
|
||||
toast.info('请上传门店图片')
|
||||
return
|
||||
}
|
||||
|
||||
form.value.image_arr = EditStore.fileList.map(item => item.url)
|
||||
form.value.image = EditStore.fileList[0].url
|
||||
form.value.id = useStore.defaultStore.id
|
||||
|
||||
uni.showLoading({
|
||||
title: '保存中...'
|
||||
})
|
||||
|
||||
try {
|
||||
await editStoreInfo(form.value)
|
||||
EditStore.handleGetStoreDetails()
|
||||
uni.hideLoading()
|
||||
toast.info('保存成功')
|
||||
} catch (error) {
|
||||
uni.hideLoading()
|
||||
toast.info('保存失败,请稍后重试')
|
||||
return
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 等待城市数据渲染
|
||||
* @param second
|
||||
*/
|
||||
handleSleep: async (second: number = 1) => {
|
||||
return new Promise((resolve) => {
|
||||
setTimeout(() => {
|
||||
resolve(true)
|
||||
}, 1000 * second)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -15,23 +15,23 @@
|
||||
<!-- 订单详情 -->
|
||||
<view class="mt-28rpx mx-32rpx bg-white rounded-16rpx py-30rpx relative">
|
||||
<view class="absolute top-0 right-38rpx">
|
||||
<!-- TODO 预定或续订图标或团购核销 -->
|
||||
<wd-img width="112rpx" height="112rpx" :src="`${OSS}images/store/bill/image1.png`"
|
||||
<!-- change_type: 1包间预定 2包间续订 3提现 4团购核销 -->
|
||||
<wd-img v-if="billDetails.change_type == 1" width="112rpx" height="112rpx" :src="`${OSS}images/store/bill/image1.png`"
|
||||
mode="aspectFill" />
|
||||
<!-- <wd-img width="112rpx" height="112rpx" :src="`${OSS}images/store/bill/image2.png`"
|
||||
<wd-img v-if="billDetails.change_type == 2" width="112rpx" height="112rpx" :src="`${OSS}images/store/bill/image2.png`"
|
||||
mode="aspectFill" />
|
||||
<wd-img v-if="billDetails.change_type == 4" width="112rpx" height="112rpx" :src="`${OSS}images/store/bill/image3.png`"
|
||||
mode="aspectFill" />
|
||||
<wd-img width="112rpx" height="112rpx" :src="`${OSS}images/store/bill/image3.png`"
|
||||
mode="aspectFill" /> -->
|
||||
</view>
|
||||
<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 class="font-bold text-28rpx leading-40rpx text-[#303133]">订单号:{{ billDetails.order.order_sn }}</view>
|
||||
</view>
|
||||
|
||||
<view class="mt-38rpx text-center">
|
||||
<view class="text-28rpx leading-40rpx text-[#606266]">金额</view>
|
||||
<view class="mt-20rpx">
|
||||
+ <price-format color="#000" :first-size="36" :second-size="36" :showSubscript="false"></price-format>
|
||||
+ <price-format color="#000" :first-size="36" :second-size="36" :showSubscript="false" :price="billDetails.amount"></price-format>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -40,19 +40,19 @@
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] mx-28rpx">
|
||||
<view class="flex justify-between items-center mb-16rpx">
|
||||
<view>消费类型</view>
|
||||
<view>包间预定 || 包间续费 || 团购核销</view>
|
||||
<view>{{ Bill.handleMapTransactionType(billDetails.change_type) }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center mb-16rpx">
|
||||
<view>交易方式</view>
|
||||
<view>微信支付</view>
|
||||
<view>{{ PayWayText[billDetails.order.pay_way] }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center mb-16rpx">
|
||||
<view>消费金额</view>
|
||||
<view>¥158</view>
|
||||
<view>{{ billDetails.amount }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center mb-16rpx">
|
||||
<view>平台服务费</view>
|
||||
<view>¥158</view>
|
||||
<view>{{ billDetails.service_price }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -61,16 +61,16 @@
|
||||
<view class="text-28rpx leading-40rpx text-[#606266] mx-28rpx">
|
||||
<view class="flex justify-between items-center mb-16rpx">
|
||||
<view>用户名</view>
|
||||
<view>用户名</view>
|
||||
<view>{{ billDetails.order.nickname }}</view>
|
||||
</view>
|
||||
<!-- 如果是茶室预定类型则显示消费门店 -->
|
||||
<view class="flex justify-between items-center mb-16rpx">
|
||||
<view>用户手机号</view>
|
||||
<view>茶艺师的昵称</view>
|
||||
<view>{{ billDetails.order.mobile }}</view>
|
||||
</view>
|
||||
<view class="flex justify-between items-center mb-16rpx">
|
||||
<view>支付时间</view>
|
||||
<view>2025-04-25 04:43</view>
|
||||
<view>{{ billDetails.order.update_dtime }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -79,8 +79,48 @@
|
||||
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { getUserTransactionDetailsInfo } from '@/api/user'
|
||||
import { PayWayText } from '@/utils/pay'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
|
||||
// 账单明细
|
||||
const id = ref<number>(0)
|
||||
const billDetails = ref<any>({
|
||||
id: 0,
|
||||
amount: 0,
|
||||
change_type: 0,
|
||||
order: {
|
||||
order_sn: '',
|
||||
pay_way: '', // 支付方式 1余额支付 2微信支付 3门店支付
|
||||
nickname: '',
|
||||
mobile: '',
|
||||
update_dtime: '',
|
||||
service_price: ''
|
||||
}
|
||||
})
|
||||
|
||||
onLoad(async (args) => {
|
||||
id.value = Number(args.id) || 0
|
||||
const res = await getUserTransactionDetailsInfo(id.value)
|
||||
billDetails.value = res.details
|
||||
console.log("🚀 ~ billDetails.value:", billDetails.value)
|
||||
})
|
||||
|
||||
const Bill = {
|
||||
/**
|
||||
* 映射流水明细类型
|
||||
*/
|
||||
handleMapTransactionType: (type: number) => {
|
||||
const typeMap: Record<number, string> = {
|
||||
1: '包间预定',
|
||||
2: '包间续费',
|
||||
3: '提现',
|
||||
4: '团购核销'
|
||||
}
|
||||
return typeMap[type] || '其他'
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
@ -35,9 +35,9 @@
|
||||
<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>
|
||||
<price-format color="#000" :first-size="48" :second-size="48" :subscript-size="28" :price="userStore.userMoney"></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 class="w-200rpx h-80rpx bg-[#4C9F44] rounded-8rpx font-bold text-28rpx leading-80rpx text-center text-[#fff]" @click="Wallet.handleToRecharge">
|
||||
提现
|
||||
</view>
|
||||
</view>
|
||||
@ -52,7 +52,7 @@
|
||||
<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>
|
||||
<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>
|
||||
@ -62,46 +62,51 @@
|
||||
|
||||
<view>
|
||||
<!-- 最后一个元素不显示border -->
|
||||
<mescroll-body @init="mescrollInit" @down="downCallback" @up="wallet.upCallback" :up="upOption">
|
||||
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Wallet.upCallback" :up="upOption">
|
||||
<!-- TODO 这里除了提现其余的要跳转到账单明细(/bundle/wallet/wallet)提现(/bundle/parten/pages/withdraw/withdraw)-->
|
||||
<view class="h-144rpx leading-144rpx mt-18rpx border-b border-b-solid border-b-[#E5E5E5] flex items-center justify-between pb-14rpx" @click="wallet.handleToBillDetail(item)" v-for="(item, index) in 5" :key="index">
|
||||
<view class="h-144rpx leading-144rpx mt-18rpx border-b border-b-solid border-b-[#E5E5E5] flex items-center justify-between pb-14rpx" @click="Wallet.handleToBillDetail(item)" v-for="item in list" :key="item.id">
|
||||
<view>
|
||||
<view class="font-bold text-30rpx leading-42rpx text-[#303133]">
|
||||
<view>包间预定</view>
|
||||
<!-- <view>包间续费</view>
|
||||
<view>团购核销</view>
|
||||
<view class="flex items-center">
|
||||
<view>提现</view>
|
||||
<view class="w-86rpx h-32rpx leading-32rpx text-center ml-30rpx text-[#40AE36] text-22rpx rounded-4rpx border-2rpx border-solid border-[#40AE36]">申请中</view>
|
||||
</view> -->
|
||||
<view>{{ Wallet.handleMapTransactionType(item.change_type) }}</view>
|
||||
<view
|
||||
v-if="item.change_type == 3 && item.reflect_status == 0"
|
||||
class="w-86rpx h-32rpx leading-32rpx text-center ml-30rpx text-[#40AE36] text-22rpx rounded-4rpx border-2rpx border-solid border-[#40AE36]">
|
||||
申请中
|
||||
</view>
|
||||
|
||||
<view
|
||||
v-if="item.change_type == 3 && item.reflect_status == 2"
|
||||
class="w-86rpx h-32rpx leading-32rpx text-center ml-30rpx text-[#E64545] text-22rpx rounded-4rpx border-2rpx border-solid border-[#E64545]">
|
||||
已拒绝
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-24rpx text-[#606266] leading-34rpx mt-16rpx">
|
||||
<!-- TODO 包间预定 || 包间续费下显示 -->
|
||||
<text>预定账号:13917942276</text>
|
||||
<text v-if="item.change_type <= 2">预定账号:{{ item.mobile }}</text>
|
||||
</view>
|
||||
<view class="mt-12rpx text-24rpx text-[#606266] leading-34rpx">
|
||||
2025-03-02 11:20
|
||||
{{ item.create_time }}
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="flex items-center h-50rpx">
|
||||
<view class="mr-16rpx">
|
||||
+<price-format color="#000" :first-size="36" :second-size="36" :showSubscript="false"></price-format>
|
||||
<text> {{ item.change_type == 3 ? '-' : '+' }}</text>
|
||||
<price-format color="#000" :first-size="36" :second-size="36" :showSubscript="false" :price="item.amount"></price-format>
|
||||
</view>
|
||||
<view>
|
||||
<wd-icon name="arrow-right" size="32rpx" color="#9496A5"></wd-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="text-24rpx text-[#909399] leading-34rpx">
|
||||
余额5,224.55
|
||||
余额 {{ item.after_amount }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -109,84 +114,102 @@
|
||||
<script lang="ts" setup>
|
||||
import { onPageScroll, onReachBottom } from '@dcloudio/uni-app'
|
||||
import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js"
|
||||
import { useUserStore } from '@/store'
|
||||
import type { IUserResult } from '@/api/types/user'
|
||||
import { getUserInfo, getUserTransactionDetails } from '@/api/user'
|
||||
import { router } from '@/utils/tools'
|
||||
|
||||
const OSS = inject('OSS')
|
||||
const userStore = useUserStore()
|
||||
|
||||
// 用户信息相关
|
||||
|
||||
/* mescroll */
|
||||
const upOption = reactive({
|
||||
empty: {
|
||||
icon : OSS + 'icon/icon_reserver_empty.png',
|
||||
}
|
||||
})
|
||||
const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom) // 调用mescroll的hook
|
||||
|
||||
// 日期过滤
|
||||
const downOption = {
|
||||
auto: true
|
||||
}
|
||||
const upOption = {
|
||||
auto: true,
|
||||
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
|
||||
}
|
||||
const list = ref<Array<any>>([]) // 茶室列表
|
||||
const value = ref<number>(Date.now())
|
||||
const selectTime = ref<string>('')
|
||||
|
||||
onShow(() => {
|
||||
|
||||
})
|
||||
|
||||
const wallet = {
|
||||
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); //追加新数据
|
||||
const filter = {
|
||||
page: mescroll.num,
|
||||
size: mescroll.size,
|
||||
end_time: selectTime.value
|
||||
}
|
||||
|
||||
// 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(); // 请求失败, 结束加载
|
||||
// })
|
||||
getUserTransactionDetails(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 date
|
||||
*/
|
||||
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}月`);
|
||||
selectTime.value = `${year}-${month < 10 ? '0' + month : month}`
|
||||
|
||||
// 切换tab时,重置当前的mescroll
|
||||
list.value = []
|
||||
getMescroll().resetUpScroll();
|
||||
},
|
||||
|
||||
// 去提现
|
||||
/**
|
||||
* 去提现
|
||||
*/
|
||||
handleToRecharge: () => {
|
||||
uni.navigateTo({
|
||||
url: '/bundle/parten/pages/withdraw/withdraw'
|
||||
})
|
||||
},
|
||||
|
||||
// 跳转对应账单详情
|
||||
handleToBillDetail: (id: number) => {
|
||||
uni.navigateTo({
|
||||
url: `/bundle/wallet/bill?id=${id}`
|
||||
})
|
||||
/**
|
||||
* 跳转对应账单详情
|
||||
* @param id
|
||||
*/
|
||||
handleToBillDetail: (item: {id: number, change_type: number}) => {
|
||||
// change_type: 1包间预定 2包间续订 3提现 4团购核销
|
||||
if (item.change_type === 3) {
|
||||
router.navigateTo(`/bundle/parten/pages/withdraw/progress?id=${item.id}`)
|
||||
return
|
||||
} else {
|
||||
router.navigateTo(`/bundle/wallet/bill?id=${item.id}`)
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 映射流水明细类型
|
||||
*/
|
||||
handleMapTransactionType: (type: number) => {
|
||||
const typeMap: Record<number, string> = {
|
||||
1: '包间预定',
|
||||
2: '包间续费',
|
||||
3: '提现',
|
||||
4: '团购核销'
|
||||
}
|
||||
return typeMap[type] || '其他'
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user