调试接口
This commit is contained in:
@ -36,9 +36,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="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>
|
||||
@ -53,7 +53,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>
|
||||
@ -63,22 +63,23 @@
|
||||
|
||||
<view>
|
||||
<!-- 最后一个元素不显示border -->
|
||||
<mescroll-body @init="mescrollInit" @down="downCallback" @up="wallet.upCallback" :up="upOption">
|
||||
<view class="h-144rpx leading-144rpx mt-18rpx border-b border-b-solid border-b-[#E5E5E5] flex flex-col justify-center" @click="wallet.handleToBillDetail(item)" v-for="(item, index) in 5" :key="index">
|
||||
<mescroll-body @init="mescrollInit" @down="downCallback" @up="Wallet.upCallback" :up="upOption">
|
||||
<view
|
||||
v-for="item in list" :key="item.id"
|
||||
class="h-144rpx leading-144rpx mt-18rpx border-b border-b-solid border-b-[#E5E5E5] flex flex-col justify-center"
|
||||
@click="Wallet.handleToBillDetail(item)">
|
||||
<view class="text-28rpx leading-40rpx text-[#303133] flex justify-between items-center">
|
||||
<view>茶艺师预定</view>
|
||||
<view>-402.33</view>
|
||||
<view>{{ item.remark }}</view>
|
||||
<view>{{ item.action == 1 ? '+' : '-' }}{{ item.amount }}</view>
|
||||
</view>
|
||||
<view class="text-24rpx leading-34rpx text-[#909399] flex justify-between items-center mt-10rpx">
|
||||
<view>2025-03-18 11:20</view>
|
||||
<view>余额24.55</view>
|
||||
<view>{{ item.create_time }}</view>
|
||||
<view>余额{{ item.after_amount }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -86,80 +87,83 @@
|
||||
<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 { getUserInfo, getUserMoneyLog } from '@/api/user'
|
||||
|
||||
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 userMoney = ref<number>(0) // 用户余额
|
||||
|
||||
// 日期过滤
|
||||
const value = ref<number>(Date.now())
|
||||
const selectTime = ref<string>('')
|
||||
|
||||
onShow(() => {
|
||||
getUserInfo().then(res => {
|
||||
userMoney.value = Number(res.user_money)
|
||||
})
|
||||
})
|
||||
|
||||
const wallet = {
|
||||
// 上拉加载的回调: 其中num:当前页 从1开始, size:每页数据条数,默认10
|
||||
const Wallet = {
|
||||
/**
|
||||
* 上拉加载
|
||||
* @param mescroll
|
||||
*/
|
||||
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,
|
||||
month: 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(); // 请求失败, 结束加载
|
||||
// })
|
||||
getUserMoneyLog(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/wallet/recharge'
|
||||
})
|
||||
},
|
||||
|
||||
// 跳转对应账单详情
|
||||
/**
|
||||
* 跳转对应账单详情
|
||||
*/
|
||||
handleToBillDetail: (id: number) => {
|
||||
uni.navigateTo({
|
||||
url: `/bundle/wallet/bill?id=${id}`
|
||||
|
||||
Reference in New Issue
Block a user