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

添加充值功能、优化内容

Browse Source
This commit is contained in:
wangxiaowei
2026-01-10 19:09:01 +08:00
parent d12651fe8a
commit 59859a2363
17 changed files with 959 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

146
src/bundle/user/user-list.vue
View File

@ -7,9 +7,77 @@
}</route>
<template>
<view>
<view>
<navbar title="用户列表" custom-class="!bg-[transparent]"></navbar>
<view class="user-list-bg">
<view class="user-list-bg w-[100%] sticky top-0 left-0 z-50">
<wd-navbar safeAreaInsetTop :bordered="false" custom-style="background-color: transparent !important;">
<template #left>
<view class="flex items-center" @click="router.navigateBack()">
<view class=" mt-4rpx">
<wd-icon name="thin-arrow-left" size="30rpx"></wd-icon>
</view>
<view class="text-[#303133] text-36rpx ml-24rpx leading-48rpx">客户列表</view>
</view>
</template>
</wd-navbar>
</view>
<view class="mt-12rpx">
<view class="relative flex justify-center">
<wd-img :src="`${OSS}images/store/user/image4.png`" width="690rpx" height="280rpx"></wd-img>
<view class="absolute left-50% top-50% -translate-x-1/2 -translate-y-1/2 w-full">
<view>
<view class="flex items-center justify-between px-30rpx">
<view class="ml-48rpx">
<view class="font-500 text-30rpx leading-42rpx text-[#121212]">门店预充值(未消费）</view>
<view class="mt-6rpx text-24rpx leading-34rpx text-[#7B8290]">{{ useStore.defaultStore.name }}</view>
</view>
<view class="relative mt-20rpx" @click="router.navigateTo('/bundle/user/recharge-list')">
<wd-img :src="`${OSS}images/store/user/image5.png`" width="178rpx" height="50rpx"></wd-img>
<view class="absolute left-50% top-50% -translate-x-1/2 -translate-y-1/2 flex justify-center items-center w-full">
<view class="font-400 text-26rpx text-[#333] mt-[-8rpx]">充值明细</view>
<view class="mt-[-12rpx]">
<wd-icon name="arrow-right" size="32rpx" color="#666"></wd-icon>
</view>
</view>
</view>
</view>
<view class="text-[#7B4FE1] flex items-center ml-78rpx mt-30rpx">
<view class="flex flex-col items-center justify-center mr-100rpx">
<view class="font-bold text-32rpx leading-44rpx">150,000.00</view>
<view class="mt-12rpx font-400 text-28rpx leading-40rpx">实际充值(元)</view>
</view>
<view class="flex flex-col items-center justify-center">
<view class="font-bold text-32rpx leading-44rpx">10,000.00</view>
<view class="mt-12rpx font-400 text-28rpx leading-40rpx">赠金(元)</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="mt-40rpx">
<view class="font-bold text-32rpx leading-44rpx mx-30rpx">客户信息</view>
<view class="search-box relative">
<wd-search placeholder="搜索客户信息" cancel-txt="搜索" placeholder-left hide-cancel custom-input-class="!h-72rpx !pr-160rpx" v-model="keywords" light >
</wd-search>
<view
class="absolute top-1/2 -translate-y-1/2 right-34rpx w-142rpx h-64rpx leading-64rpx text-center rounded-32rpx bg-#4C9F44 text-#fff font-400 text-32rpx"
@click="UserList.handleSearch">
搜索
</view>
</view>
</view>
<view class="flex items-center mx-30rpx">
<view
class="mr-12rpx bg-white rounded-12rpx w-132rpx h-56rpx text-center leading-50rpx font-400 text-28rpx leading-40rpx text-[#303133] border-2rpx border-solid border-[#fff]"
:class="{active: item.type === currentTab }"
v-for="item in menuTab" :key="item.type"
@click="UserList.handleChangeTab(item.type)">
{{ item.name }}
</view>
</view>
<view>
@ -66,7 +134,13 @@
textNoMore: '~ 已经到底啦 ~', //无更多数据的提示
}
const list = ref<Array<any>>([]) // 茶室列表
const keywords = ref<string>('') // 搜索关键词
const menuTab = ref([
{type: 'all', name: '全部'},
{type: 'recharge', name: '充值卡'},
{type: 'vip', name: '会员卡'},
])
const currentTab = ref<string>('all')
onLoad((args) => {
})
@ -78,20 +152,20 @@
*/
upCallback: (mescroll) => {
// 需要留一下数据为空的时候显示的空数据图标内容
const filter = {
page: mescroll.num,
size: mescroll.size,
store_id: useStore.defaultStore.id,
}
// const filter = {
// page: mescroll.num,
// size: mescroll.size,
// store_id: useStore.defaultStore.id,
// }
getStoreMemberList(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(() => {
// getStoreMemberList(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() // 请求失败, 结束加载
})
// })
},
/**
@ -103,7 +177,6 @@
uni.$off('refreshUserDetail')
list.value = []
getMescroll().resetUpScroll()
})
router.navigateTo(`/bundle/user/user-detail?id=${id}`)
},
@ -116,6 +189,23 @@
uni.makePhoneCall({
phoneNumber: phone
})
},
/**
* 切换tab
*/
handleChangeTab: (type: string) => {
currentTab.value = type
list.value = []
getMescroll().resetUpScroll()
},
/**
* 搜索
*/
handleSearch: () => {
list.value = []
getMescroll().resetUpScroll()
}
}
</script>
@ -124,4 +214,26 @@
page {
background-color: #fff;
}
.user-list-bg {
background-color: $cz-page-background;
background-image: url(#{$OSS}images/store/user/image3.png);
background-size: 100%;
background-repeat: no-repeat;
}
.search-box {
:deep() {
.wd-search {
background: transparent !important;
}
}
}
.active {
border-radius: 12rpx;
border: 2rpx solid #4C9F44;
background-color: #F0F6EF;
color: #4C9F44;
}
</style>