充值 订单 会员 个人中心
This commit is contained in:
parent
91fb79033b
commit
2348230bab
68
App.vue
68
App.vue
|
|
@ -1,45 +1,51 @@
|
|||
<script>
|
||||
export default {
|
||||
onLaunch: function() {
|
||||
console.log('App Launch')
|
||||
console.log('App Launch');
|
||||
uni.addInterceptor('navigateTo', {
|
||||
invoke(e) {
|
||||
console.log('路由监听');
|
||||
console.log(e);
|
||||
}
|
||||
})
|
||||
},
|
||||
onShow: function() {
|
||||
console.log('App Show')
|
||||
},
|
||||
onHide: function() {
|
||||
console.log('App Hide')
|
||||
console.log('App Hide');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*每个页面公共css */
|
||||
@import "@/uni_modules/uview-plus/index.scss";
|
||||
|
||||
page{
|
||||
font-size: 26rpx;
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
|
||||
.fiexd-btn-box {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 120rpx;
|
||||
height: calc(constant(safe-area-inset-bottom) + 120rpx);
|
||||
/* 适用于iOS设备 */
|
||||
height: calc(env(safe-area-inset-bottom) + 120rpx);
|
||||
/* 适用于Android设备 */
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx);
|
||||
/* 适用于iOS设备 */
|
||||
padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
|
||||
/* 适用于Android设备 */
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
@import "@/uni_modules/uview-plus/index.scss";
|
||||
|
||||
page {
|
||||
font-size: 26rpx;
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
|
||||
.fiexd-btn-box {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 120rpx;
|
||||
height: calc(constant(safe-area-inset-bottom) + 120rpx);
|
||||
/* 适用于iOS设备 */
|
||||
height: calc(env(safe-area-inset-bottom) + 120rpx);
|
||||
/* 适用于Android设备 */
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
padding: 20rpx;
|
||||
padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx);
|
||||
/* 适用于iOS设备 */
|
||||
padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
|
||||
/* 适用于Android设备 */
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -54,4 +54,9 @@ export const writeOrderApi = (data) => {
|
|||
// 核销数量统计
|
||||
export const writeCountApi = (data) => {
|
||||
return request.post('/order/order/write_count', data);
|
||||
}
|
||||
|
||||
// 根据核销码查询记录
|
||||
export const writeCodeApi = (data) => {
|
||||
return request.post('/order/order/write_code', data);
|
||||
}
|
||||
33
api/user.js
33
api/user.js
|
|
@ -60,4 +60,37 @@ export const merchantListApi = (data) => {
|
|||
// 充值
|
||||
export const rechargeApi = (data) => {
|
||||
return request.post('/user/user/recharge', data);
|
||||
}
|
||||
|
||||
// 商品访问记录
|
||||
export const productLogApi = (data) => {
|
||||
return request.post('/user/UserVisit/productLog', data);
|
||||
}
|
||||
|
||||
// 用户页面访问记录
|
||||
export const htmlLogApi = (data) => {
|
||||
return request.post('/user/UserVisit/htmlLog', data);
|
||||
}
|
||||
|
||||
|
||||
// 用户页面访问记录
|
||||
export const userInfoApi = (data) => {
|
||||
return request.post('/user/user/info', data);
|
||||
}
|
||||
|
||||
|
||||
// 充值规格
|
||||
export const rechargeAmountApi = (data) => {
|
||||
return request.post('/user/user/rechange_amount', data);
|
||||
}
|
||||
|
||||
// 会员账户统计
|
||||
export const capitalCountAPi = (data) => {
|
||||
return request.post('/user/user/capital_count', data);
|
||||
}
|
||||
|
||||
|
||||
// 会员账户详情
|
||||
export const chargeListApi = (data) => {
|
||||
return request.post('/user/user/capital_flow', data);
|
||||
}
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
</view>
|
||||
<view class="row">
|
||||
<view>商品名称</view>
|
||||
<view>{{datas.name || datas.goods_name}}</view>
|
||||
<view>{{datas.name || datas.goods_name || datas.store_name}}</view>
|
||||
</view>
|
||||
<view class="row">
|
||||
<view>商品单位</view>
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 569 B |
|
|
@ -48,7 +48,7 @@
|
|||
</block>
|
||||
</view>
|
||||
|
||||
<u-loadmore :status="status" iconColor="#666" />
|
||||
<up-loadmore :status="status" iconColor="#b3b3b3" color="#b3b3b3" />
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -122,7 +122,7 @@
|
|||
status.value == 'loading';
|
||||
shopListApi(queryParams).then(res => {
|
||||
let len = res.data.lists;
|
||||
status.value = queryParams.page_size > len ? 'nomore' : 'loadmore';
|
||||
status.value = queryParams.page_size > len.length ? 'nomore' : 'loadmore';
|
||||
shopList.value = shopList.value.concat(res.data.lists);
|
||||
if (status.value == 'loadmore') queryParams.page_no += 1;
|
||||
})
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<view class="verification-title">核销券码</view>
|
||||
<u-input v-model="writeCode" inputAlign="center" :customStyle="{'border-color':'#38BE41 !important'}"
|
||||
placeholder="请输入核销券码"></u-input>
|
||||
<view class="verification-btn" :style="{opacity:writeCode?1:'.6'}" @click="onConfirmWrite">确认核销</view>
|
||||
<view class="verification-btn" :style="{opacity:writeCode?1:'.6'}" @click="onConfirmProduct">确认核销</view>
|
||||
</view>
|
||||
|
||||
<!-- 二维码 -->
|
||||
|
|
@ -21,30 +21,34 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 弹框 -->
|
||||
<u-popup :show="show" @close="close" @open="open" mode="center">
|
||||
<!-- 弹框 1-1717497530223296 -->
|
||||
<u-popup :show="show" @close="close" @open="open" mode="center" v-if="shopDetail != null">
|
||||
<view class="popup">
|
||||
<view class="popup-wrap">
|
||||
<view class="popup-title">请确认核销订单</view>
|
||||
<view class="popup-order_num">订单编号:wxo1709797879549583601</view>
|
||||
<view class="popup-goods">
|
||||
<view class="popup-goods-left">
|
||||
<u-image width="100rpx" height="100rpx" radius="8rpx" />
|
||||
<view class="popup-order_num">订单编号:{{shopDetail.order_id}}</view>
|
||||
|
||||
<view class="popup-goods-wrap">
|
||||
<view class="popup-goods" v-for="item in shopDetail.goods_list" :key="item.id">
|
||||
<view class="popup-goods-left">
|
||||
<u-image width="100rpx" height="100rpx" radius="8rpx" :src="item.image" />
|
||||
</view>
|
||||
<view class="popup-goods-right">
|
||||
<view class="popup-goods-right-info">
|
||||
<text class='goods_name'>{{item.store_name}}</text>
|
||||
<text class="goods_price">￥{{item.price}}</text>
|
||||
</view>
|
||||
<view class="popup-goods-num">x{{item.cart_num}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="popup-goods-right">
|
||||
<view class="popup-goods-right-info">
|
||||
<text class='goods_name'>黄牛牛肉</text>
|
||||
<text class="goods_price">￥10.00</text>
|
||||
</view>
|
||||
<view class="popup-goods-num">x5</view>
|
||||
<view class="popup-goods-total">
|
||||
<text class="popup-goods-total-num">共5件商品，总金额</text>
|
||||
<text class="popup-goods-total-price">￥50.00</text>
|
||||
</view>
|
||||
|
||||
<view class="popup-goods-total">
|
||||
<text class="popup-goods-total-num">共{{shopDetail.total_num}}件商品，总金额</text>
|
||||
<text class="popup-goods-total-price">￥{{shopDetail.total_price}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="verification-btn">确认核销</view>
|
||||
<view class="verification-btn" @click="onConfirmWrite">确认核销</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
|
@ -56,10 +60,11 @@
|
|||
ref
|
||||
} from "vue";
|
||||
import {
|
||||
writeOrderApi
|
||||
writeOrderApi,
|
||||
writeCodeApi
|
||||
} from "@/api/order.js";
|
||||
|
||||
const show = ref(false);
|
||||
const show = ref(true);
|
||||
const writeCode = ref('');
|
||||
|
||||
// 确认核销
|
||||
|
|
@ -68,6 +73,7 @@
|
|||
writeOrderApi({
|
||||
verify_code: writeCode.value
|
||||
}).then(res => {
|
||||
writeCode.value = ''; //清空
|
||||
if (res.code == 1) {
|
||||
uni.showToast({
|
||||
title: '核销成功',
|
||||
|
|
@ -90,30 +96,22 @@
|
|||
})
|
||||
}
|
||||
|
||||
// 切换到核销
|
||||
const shopDetail = ref(null);
|
||||
// 根据核销码获取商品
|
||||
const onConfirmProduct = () => {
|
||||
writeCodeApi({
|
||||
code: writeCode.value
|
||||
}).then(res => {
|
||||
shopDetail.value = res.data;
|
||||
})
|
||||
}
|
||||
|
||||
// 二维码
|
||||
const onScanToWrite = () => {
|
||||
uni.scanCode({
|
||||
success(resp) {
|
||||
writeOrderApi({
|
||||
verify_code: resp.result
|
||||
}).then(res => {
|
||||
if (res.code == 1) {
|
||||
uni.showToast({
|
||||
title: '核销成功',
|
||||
icon: 'none',
|
||||
success() {
|
||||
uni.$u.sleep(1500).then(rrr => {
|
||||
uni.navigateBack();
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '核销失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
writeCode.value = resp.result;
|
||||
onConfirmProduct();
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
@ -225,12 +223,12 @@
|
|||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 630rpx;
|
||||
height: 190rpx;
|
||||
height: 150rpx;
|
||||
background: #F7F7F7;
|
||||
border-radius: 16rpx;
|
||||
margin-bottom: 36rpx;
|
||||
padding: 24rpx;
|
||||
padding: 24rpx 24rpx 0;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.popup-goods-left {
|
||||
margin-right: 24rpx;
|
||||
|
|
@ -263,20 +261,20 @@
|
|||
color: #777777;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.popup-goods-total {
|
||||
text-align: right;
|
||||
.popup-goods-total {
|
||||
text-align: right;
|
||||
|
||||
.popup-goods-total-num {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
.popup-goods-total-num {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.popup-goods-total-price {
|
||||
font-size: 24rpx;
|
||||
color: #F55726;
|
||||
}
|
||||
}
|
||||
.popup-goods-total-price {
|
||||
font-size: 24rpx;
|
||||
color: #F55726;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,9 +26,9 @@
|
|||
<text class="popup-goods-total-num">共计{{shopInfo.total_num || 0}}件</text>
|
||||
</view>
|
||||
|
||||
<view class="batch-write" @click="onClickToWrite">
|
||||
<up-image width="36rpx" height="36rpx" src="@/multipleShop/images/scan.png" />
|
||||
<view>扫码核销</view>
|
||||
<view class="batch-write" @click="onClickToWrite" v-if="shopInfo.is_writeoff != 1">
|
||||
<image class="btn-img" src="../images/scan.png"></image>
|
||||
<view class="btn-txt">扫码核销</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -158,7 +158,6 @@
|
|||
|
||||
.popup-goods-total {
|
||||
text-align: right;
|
||||
margin-bottom: 50rpx;
|
||||
|
||||
.popup-goods-total-num {
|
||||
font-size: 24rpx;
|
||||
|
|
@ -175,8 +174,14 @@
|
|||
height: 90rpx;
|
||||
background: #20B128;
|
||||
border-radius: 20rpx;
|
||||
margin-top: 50rpx;
|
||||
|
||||
&>view {
|
||||
.btn-img {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
}
|
||||
|
||||
.btn-txt {
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
margin-left: 8rpx;
|
||||
|
|
|
|||
|
|
@ -27,7 +27,8 @@
|
|||
</view>
|
||||
|
||||
<view class="order-list-item-trans-left" @click.stop="onClickToWrite(item)">
|
||||
<up-image width="76rpx" height="76rpx" src="@/multipleShop/images/scan.png" />
|
||||
<!-- <up-image width="76rpx" height="76rpx" src="../images/scan.png" /> -->
|
||||
<image src="../images/scan.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -37,7 +38,7 @@
|
|||
<view class="order-list-item-order_num">订单编号:{{item.order_id}}</view>
|
||||
<view class="order-list-item-trans">
|
||||
<view class="order-list-item-trans-left" @click.stop="onClickToWrite(item)">
|
||||
<up-image width="76rpx" height="76rpx" src="@/multipleShop/images/write_done.png" />
|
||||
<u-image width="76rpx" height="76rpx" src="../images/write_done.webp" />
|
||||
</view>
|
||||
|
||||
<view class="order-list-item-trans-right">
|
||||
|
|
@ -55,10 +56,9 @@
|
|||
</view>
|
||||
</scroll-view>
|
||||
|
||||
|
||||
<view class="batch-write" @click="onPatchWrite">
|
||||
<up-image width="36rpx" height="36rpx" src="@/multipleShop/images/scan.png" />
|
||||
<view>扫码核销</view>
|
||||
<image class="btn-img" src="../images/scan.png"></image>
|
||||
<view class="btn-txt">扫码核销</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -135,9 +135,6 @@
|
|||
})
|
||||
}
|
||||
})
|
||||
// uni.navigateTo({
|
||||
// url: "/multipleShop/verification/detail?id=" + item.id
|
||||
// })
|
||||
}
|
||||
|
||||
// 输入核销码核销
|
||||
|
|
@ -200,6 +197,9 @@
|
|||
onSearch();
|
||||
|
||||
getList();
|
||||
|
||||
// 隐藏home键返回主页
|
||||
uni.hideHomeButton();
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
@ -270,6 +270,11 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 38rpx;
|
||||
|
||||
image {
|
||||
width: 76rpx;
|
||||
height: 76rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.order-list-item-trans-right {
|
||||
|
|
@ -315,7 +320,12 @@
|
|||
background: #20B128;
|
||||
border-radius: 20rpx;
|
||||
|
||||
&>view {
|
||||
.btn-img {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.btn-txt {
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
margin-left: 8rpx;
|
||||
|
|
@ -323,8 +333,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.order-tab {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
|||
73
pages.json
73
pages.json
|
|
@ -9,13 +9,7 @@
|
|||
}
|
||||
},
|
||||
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
||||
{
|
||||
"path": "pages/member/member",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员充值",
|
||||
"enablePullDownRefresh": false,
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
|
|
@ -55,37 +49,52 @@
|
|||
"enablePullDownRefresh": false,
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/charge/charge_record",
|
||||
"style": {
|
||||
"navigationBarTitleText": "充值记录",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/charge/charge",
|
||||
"style": {
|
||||
"navigationBarTitleText": "会员充值",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
],
|
||||
"subPackages": [{
|
||||
"root": "multipleShop",
|
||||
"pages": [{
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "选择门店",
|
||||
"enablePullDownRefresh": false
|
||||
"path": "index/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "选择门店",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "verificationOrder/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "核销订单",
|
||||
"enablePullDownRefresh": false,
|
||||
"disableScroll": true
|
||||
}
|
||||
}, {
|
||||
"path": "verificationOrder/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "核销订单详情",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}, {
|
||||
"path": "orderVerification/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单核销",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
|
||||
}, {
|
||||
"path": "verificationOrder/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "核销订单",
|
||||
"enablePullDownRefresh": false,
|
||||
"disableScroll": true
|
||||
}
|
||||
}, {
|
||||
"path": "verificationOrder/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "核销订单详情",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}, {
|
||||
"path": "orderVerification/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "订单核销",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}]
|
||||
]
|
||||
}, {
|
||||
"root": "pagesOrder",
|
||||
"pages": [{
|
||||
|
|
|
|||
|
|
@ -1,12 +1,179 @@
|
|||
<!-- 会员充值 -->
|
||||
<template>
|
||||
<view class="member">
|
||||
<view class="card" :style="{'background-image':'url(../../static/icon/charge_bg.webp)'}">
|
||||
<view class="card-info">
|
||||
<u-image width="100rpx" height="100rpx" :src="userInfo.avatar" />
|
||||
<view class="card-info-right">
|
||||
<view class="phone">{{userInfo.mobile}}</view>
|
||||
<view class="level">初级会员 享受{{userInfo.discount}}折优惠</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="charge">
|
||||
<view class="charge-left">
|
||||
<view>
|
||||
<text>当前已充值{{userInfo.total_recharge_amount}}，升级还需{{userInfo.next_limit}}</text>
|
||||
<text>{{userInfo.next_level}}</text>
|
||||
</view>
|
||||
<up-line-progress :percentage="30" activeColor="#A26341" inactiveColor="#fff"
|
||||
height="8rpx"></up-line-progress>
|
||||
</view>
|
||||
<view class="charge-right">升级会员</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 充值规格 -->
|
||||
<view class="rules">
|
||||
<view class="rules-title">
|
||||
<view class="rules-title-main">充值规格</view>
|
||||
<view class="rules-title-record" @click="onPageToRecord">
|
||||
充值记录
|
||||
<up-icon name="arrow-right"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rules-con">
|
||||
<block v-for="item in chargeRulesList" :key="item.id">
|
||||
<view class="rules-con-item" :class="{'active':isChooseMoney==item.id?true:false}"
|
||||
@click="isChooseMoney = item.id">
|
||||
<view class="rules-con-item-main">{{item.name}}</view>
|
||||
<view class="rules-con-item-sub">{{item.remark?item.remark:'永久'}}</view>
|
||||
<view class="rules-con-item-amount">
|
||||
<text class="symbol">￥</text>
|
||||
<text>{{item.value}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<view class="rules-con-item" :class="{'active':isChooseMoney=='input'?true:false}"
|
||||
@click="isChooseMoney = 'input'">
|
||||
<view class="rules-con-item-main">自定义金额</view>
|
||||
<view class="rules-con-item-sub">永久</view>
|
||||
<view class="rules-con-item-amount">
|
||||
<up-input v-model="chargeMoney" placeholder="点击输入金额" border="none" type="number" color="#333"
|
||||
fontSize="28rpx" inputAlign="center"
|
||||
placeholderStyle="color:'#989898';'font-size':'24rpx';text-align:center;"></up-input>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 注意事项 -->
|
||||
<view class="attention">
|
||||
<view class="attention-title"><text>注意事项：</text></view>
|
||||
<view class="attention-tips">1、充值后帐户的金额不能提现，可用于消费使用</view>
|
||||
<view class="attention-tips">2、账户充值出现问题可联系平台客服，也可拨打平台客服咨询热线4008888888</view>
|
||||
</view>
|
||||
|
||||
<view class="member-btn" @click="onConfirmCharge">
|
||||
<view class="btn-wrap">
|
||||
确认充值
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import {
|
||||
rechargeApi,
|
||||
rechargeAmountApi
|
||||
} from "@/api/user.js";
|
||||
import {
|
||||
onLoad
|
||||
} from "@dcloudio/uni-app";
|
||||
import {
|
||||
ref
|
||||
} from "vue";
|
||||
import useUserStore from "@/store/user";
|
||||
|
||||
//用户信息
|
||||
const userInfo = useUserStore().userInfo;
|
||||
const isChooseMoney = ref('');
|
||||
const chargeMoney = ref('');
|
||||
|
||||
// 充值规则
|
||||
const chargeRulesList = ref([]);
|
||||
const getChargeRules = () => {
|
||||
rechargeAmountApi().then(rs => {
|
||||
chargeRulesList.value = rs.data;
|
||||
})
|
||||
}
|
||||
|
||||
// 充值记录产看
|
||||
const onPageToRecord = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/charge/charge_record',
|
||||
fail(err) {
|
||||
console.log(err);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 确认充值
|
||||
const onConfirmCharge = () => {
|
||||
if (!isChooseMoney.value) return uni.$u.toast('充值金额不能为空');
|
||||
let money = 0;
|
||||
if (isChooseMoney.value == 'input') {
|
||||
money = chargeMoney.value;
|
||||
} else {
|
||||
const rule = chargeRulesList.value.find(i => i.id == isChooseMoney.value);
|
||||
if (rule != undefined) {
|
||||
money = rule.value;
|
||||
}
|
||||
}
|
||||
|
||||
rechargeApi({
|
||||
price: money
|
||||
}).then(res => {
|
||||
if (!res.data?.nonceStr) return uni.$u.toast('支付失败!');
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
timeStamp: res.data.timeStamp,
|
||||
nonceStr: res.data.nonceStr,
|
||||
package: res.data.package,
|
||||
signType: res.data.signType,
|
||||
paySign: res.data.paySign,
|
||||
success: (e) => {
|
||||
if (e.errMsg == 'requestPayment:ok') {
|
||||
uni.showModal({
|
||||
title: '充值成功',
|
||||
confirmText: '查看记录',
|
||||
cancelText: '继续充值',
|
||||
success: (e) => {
|
||||
chargeMoney.value = '';
|
||||
isChooseMoney.value = '';
|
||||
if (e.confirm) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/charge/charge_record'
|
||||
})
|
||||
}
|
||||
},
|
||||
fail(err) {
|
||||
console.log(err);
|
||||
}
|
||||
})
|
||||
} else uni.$u.toast('支付失败')
|
||||
},
|
||||
fail: (e) => {
|
||||
uni.$u.toast('用户取消支付');
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
onLoad(() => {
|
||||
getChargeRules();
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.member {
|
||||
// padding-top: 40rpx;
|
||||
padding: 40rpx 0 300rpx 0;
|
||||
|
||||
.card {
|
||||
background: linear-gradient(to right, #F7EED7, #E7DAAF);
|
||||
height: 302rpx;
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
height: 272rpx;
|
||||
margin: 0 30rpx 30rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx 0 0 20rpx;
|
||||
|
|
@ -34,17 +201,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.money {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 34rpx;
|
||||
|
||||
text {
|
||||
margin-right: 116rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.charge {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -149,6 +305,11 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
border: 2rpx solid #EFCC6E;
|
||||
background: #FEF8E7;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -172,9 +333,10 @@
|
|||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 6rpx;
|
||||
height: 100%;
|
||||
height: 70%;
|
||||
border-radius: 4rpx;
|
||||
background: #FF8056;
|
||||
}
|
||||
|
|
@ -189,88 +351,31 @@
|
|||
|
||||
.member-btn {
|
||||
position: fixed;
|
||||
bottom: 80rpx;
|
||||
bottom: 0rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 670rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
background: #EFCC6E;
|
||||
border-radius: 40rpx;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
height: 110rpx;
|
||||
background-color: #F6F6F6;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
/* 兼容 iOS < 11.2 */
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
/* 兼容 iOS >= 11.2 */
|
||||
|
||||
.btn-wrap {
|
||||
width: 670rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
margin: 0 auto;
|
||||
background: #EFCC6E;
|
||||
border-radius: 40rpx;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="member">
|
||||
<view class="card">
|
||||
<view class="card-info">
|
||||
<up-image width="100rpx" height="100rpx" />
|
||||
<view class="card-info-right">
|
||||
<view class="phone">155****4444</view>
|
||||
<view class="level">初级会员 享受9折优惠</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="money">
|
||||
<text>余额：10000</text>
|
||||
<view>充值</view>
|
||||
</view>
|
||||
|
||||
<view class="charge">
|
||||
<view class="charge-left">
|
||||
<view>
|
||||
<text>当前已充值1000，升级还需2000</text>
|
||||
<text>Lv.2</text>
|
||||
</view>
|
||||
<up-line-progress :percentage="30" activeColor="#A26341" inactiveColor="#fff"
|
||||
height="8rpx"></up-line-progress>
|
||||
</view>
|
||||
<view class="charge-right">升级会员</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 充值规格 -->
|
||||
<view class="rules">
|
||||
<view class="rules-title">
|
||||
<view class="rules-title-main">充值规格</view>
|
||||
<view class="rules-title-record">
|
||||
充值记录
|
||||
<up-icon name="arrow-right"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rules-con">
|
||||
<view class="rules-con-item" v-for="item in 4">
|
||||
<view class="rules-con-item-main">基础会员</view>
|
||||
<view class="rules-con-item-sub">永久</view>
|
||||
<view class="rules-con-item-amount">
|
||||
<text class="symbol">￥</text>
|
||||
<text>1000</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="rules-con-define">
|
||||
<up-input placeholder="点击输入金额" type="number" color="#333" fontSize="28rpx"
|
||||
:placeholderStyle="{color:'#989898'}">
|
||||
<template #prefix>
|
||||
<up-text text="自定义金额" color="#111" size="30rpx" margin="0 3px 0 0" type="tips"></up-text>
|
||||
</template>
|
||||
</up-input>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 注意事项 -->
|
||||
<view class="attention">
|
||||
<view class="attention-title"><text>注意事项：</text></view>
|
||||
<view class="attention-tips">1、充值后帐户的金额不能提现，可用于消费使用</view>
|
||||
<view class="attention-tips">2、账户充值出现问题可联系平台客服，也可拨打平台客服咨询热线4008888888</view>
|
||||
</view>
|
||||
|
||||
<view class="member-btn">
|
||||
确认充值
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,286 @@
|
|||
<!-- 会员充值 -->
|
||||
<template>
|
||||
<view class="member">
|
||||
<view class="card-wrap">
|
||||
<view class="card" :style="{'background-image':'url(../../static/icon/account_bg.webp)'}">
|
||||
<view class="card-info">
|
||||
<u-image width="100rpx" height="100rpx" :src="userInfo.avatar" />
|
||||
<view class="card-info-right">
|
||||
<view class="phone">{{userInfo.mobile}}</view>
|
||||
<view class="level">开通会员 享折扣权益</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="charge">
|
||||
<view class="charge-left">
|
||||
<view>
|
||||
<text class="txt">账户余额(元)</text>
|
||||
<text class="money">{{userInfo.now_money}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="charge-right" @click="onPageBack">充值</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="detail">
|
||||
<view class="detail-title">账户详情</view>
|
||||
<view class="detail-total">
|
||||
<view class="detail-total-item">
|
||||
<text>累计消费</text>
|
||||
<view>{{order}}</view>
|
||||
</view>
|
||||
<view class="detail-total-item">
|
||||
<text>累计充值</text>
|
||||
<view>{{recharge}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="detail-card" v-if="chargeRecordList.length > 0">
|
||||
<block v-for="(item,indx) in chargeRecordList" :key="indx">
|
||||
<view class="detail-card-item">
|
||||
<view class="detail-card-item-left">
|
||||
<u-image width="60rpx" height="60rpx" src="../../static/icon/order.webp"
|
||||
v-if="item.category=='user_order_pay'" />
|
||||
<u-image width="60rpx" height="60rpx" src="../../static/icon/diamond.webp" v-else />
|
||||
</view>
|
||||
<view class="detail-card-item-right">
|
||||
<view class="detail-card-item-right-money">
|
||||
<text>{{item.category=='user_order_pay'?'订单编号':'会员充值'}} </text>
|
||||
<text>+{{item.amount}}</text>
|
||||
</view>
|
||||
<viewl class="detail-card-item-right-remind">
|
||||
<text>{{item.create_time}}</text>
|
||||
<text>余额{{item.before_balance}}元</text>
|
||||
</viewl>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
<up-loadmore :status="status" iconColor="#b3b3b3" color="#b3b3b3" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup>
|
||||
import {
|
||||
rechargeApi,
|
||||
capitalCountAPi,
|
||||
chargeListApi
|
||||
} from "@/api/user.js";
|
||||
import {
|
||||
onLoad,
|
||||
onReachBottom
|
||||
} from "@dcloudio/uni-app";
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from "vue";
|
||||
import useUserStore from "@/store/user";
|
||||
|
||||
//用户信息
|
||||
const userInfo = useUserStore().userInfo;
|
||||
const queryParams = reactive({
|
||||
page_no: 1,
|
||||
page_size: 8
|
||||
});
|
||||
const status = ref('');
|
||||
const chargeRecordList = ref([]);
|
||||
|
||||
const getChargeRecordData = () => {
|
||||
if (status.value == 'nomore') return;
|
||||
if (status.value == 'loading') return;
|
||||
status.value == 'loading';
|
||||
chargeListApi(queryParams).then(res => {
|
||||
let len = res.data.data;
|
||||
status.value = queryParams.page_size > len.length ? 'nomore' : 'loadmore';
|
||||
chargeRecordList.value = chargeRecordList.value.concat(res.data.data);
|
||||
if (status.value == 'loadmore') queryParams.page_no += 1;
|
||||
})
|
||||
}
|
||||
|
||||
// 充值统计
|
||||
const order = ref(0),
|
||||
recharge = ref(0);
|
||||
const getChargeCountData = () => {
|
||||
capitalCountAPi().then(rs => {
|
||||
order.value = rs.data.order;
|
||||
recharge.value = rs.data.recharge;
|
||||
})
|
||||
}
|
||||
|
||||
const onPageBack = () => {
|
||||
uni.navigateBack()
|
||||
}
|
||||
|
||||
onLoad(() => {
|
||||
getChargeRecordData();
|
||||
|
||||
getChargeCountData();
|
||||
})
|
||||
|
||||
onReachBottom((e) => {
|
||||
getChargeRecordData();
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.member {
|
||||
padding-bottom: 300rpx;
|
||||
|
||||
.card-wrap {
|
||||
padding: 40rpx 0 20rpx 0;
|
||||
background-color: #fff;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.card {
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
height: 272rpx;
|
||||
margin: 0 30rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx 0 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
|
||||
.card-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 60rpx;
|
||||
|
||||
.card-info-right {
|
||||
margin-left: 40rpx;
|
||||
|
||||
.phone {
|
||||
margin-bottom: 12rpx;
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #444444;
|
||||
}
|
||||
|
||||
.level {
|
||||
font-size: 28rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.charge {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 38rpx;
|
||||
|
||||
.charge-left {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
margin-right: 30rpx;
|
||||
|
||||
&>view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
.txt {
|
||||
margin-right: 16rpx;
|
||||
font-size: 24rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
|
||||
.money {
|
||||
font-weight: 600;
|
||||
font-size: 48rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.charge-right {
|
||||
width: 148rpx;
|
||||
height: 52rpx;
|
||||
line-height: 52rpx;
|
||||
background: #7B5232;
|
||||
border-radius: 30rpx;
|
||||
font-size: 22rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail {
|
||||
margin: 0 30rpx;
|
||||
|
||||
.detail-title {
|
||||
margin-bottom: 16rpx;
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #262626;
|
||||
}
|
||||
|
||||
.detail-total {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 50rpx;
|
||||
|
||||
.detail-total-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 68rpx;
|
||||
|
||||
text {
|
||||
margin-right: 4rpx;
|
||||
font-size: 28rpx;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
view {
|
||||
font-weight: 600;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.detail-card-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 130rpx;
|
||||
border-bottom: 2rpx solid #F3F3F3;
|
||||
|
||||
.detail-card-item-left {
|
||||
margin-right: 22rpx;
|
||||
}
|
||||
|
||||
.detail-card-item-right {
|
||||
flex: 1;
|
||||
|
||||
.detail-card-item-right-money {
|
||||
margin-bottom: 14rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.detail-card-item-right-remind {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -170,7 +170,11 @@
|
|||
cartCreateApi,
|
||||
cartChangeApi,
|
||||
cartListApi
|
||||
} from "@/api/cart.js"
|
||||
} from "@/api/cart.js";
|
||||
import {
|
||||
productLogApi,
|
||||
userInfoApi
|
||||
} from "@/api/user.js";
|
||||
import viewPopup from "@/components/viewPopup.vue"
|
||||
import goodPopup from "@/components/goodPopup.vue"
|
||||
import useCartStore from "@/store/cart.js"
|
||||
|
|
@ -187,7 +191,6 @@
|
|||
})
|
||||
}
|
||||
|
||||
|
||||
/*商品列表滚动隐藏头部导航 */
|
||||
const instance = getCurrentInstance(); // 获取组件实例
|
||||
const targetHeight = ref(0)
|
||||
|
|
@ -241,7 +244,6 @@
|
|||
}).then(res => {
|
||||
getCartList();
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
uni.$u.toast('添加失败')
|
||||
})
|
||||
}
|
||||
|
|
@ -301,7 +303,7 @@
|
|||
const classMap = new Map();
|
||||
const getgoodClassList = (pid = 0, three = 0) => {
|
||||
let page_no = classMap.get(pid) || 1;
|
||||
console.log(classMap.get(pid));
|
||||
// console.log(classMap.get(pid));
|
||||
goodClassListApi({
|
||||
pid: pid,
|
||||
page_no: page_no,
|
||||
|
|
@ -381,8 +383,7 @@
|
|||
}
|
||||
|
||||
const navTo = (url) => {
|
||||
// if (!userStore.token || !userStore.userInfo.mobile) return uni.showModal({
|
||||
if (!userStore.token) return uni.showModal({
|
||||
if (!userStore.token || !userStore.userInfo.mobile) return uni.showModal({
|
||||
content: '您需要先登录才可使用该功能, 是否前去登录',
|
||||
success: (e) => {
|
||||
if (e.confirm) {
|
||||
|
|
@ -410,6 +411,13 @@
|
|||
goodData.value = item;
|
||||
goodRef.value.setData(item);
|
||||
showGoodPopup.value = true;
|
||||
|
||||
//统计商品的访问记录
|
||||
productLogApi({
|
||||
product_id: item.product_id,
|
||||
cate_id: item.cate_id
|
||||
});
|
||||
|
||||
};
|
||||
const changeGood = (data) => { // 确定选择商品重量
|
||||
showGoodPopup.value = false;
|
||||
|
|
@ -429,8 +437,6 @@
|
|||
}
|
||||
});
|
||||
|
||||
|
||||
console.log(data);
|
||||
addCart(data.id, data.cart_num);
|
||||
}
|
||||
// 结算
|
||||
|
|
@ -465,8 +471,21 @@
|
|||
})
|
||||
|
||||
onShow(() => {
|
||||
getCartList();
|
||||
})
|
||||
// 如果后台变更核销人员权限 可以及时切换
|
||||
if (userStore.token && userStore.userInfo.mobile) {
|
||||
userInfoApi().then(res => {
|
||||
const user = res.data;
|
||||
userStore.setUserInfo(user);
|
||||
if (user.is_staff == 1) {
|
||||
uni.reLaunch({
|
||||
url: "/multipleShop/verificationOrder/index"
|
||||
})
|
||||
} else {
|
||||
getCartList();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
const instance = getCurrentInstance(); // 获取组件实例
|
||||
|
|
@ -486,7 +505,6 @@
|
|||
setTimeout(() => {
|
||||
getWXDom()
|
||||
}, 500)
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -149,12 +149,25 @@
|
|||
userStore.setToken(res.data.token);
|
||||
|
||||
if (!res.data.mobile) { //未绑定手机号
|
||||
tempUser.value = res.data;
|
||||
// tempUser.value = res.data;
|
||||
return showBind.value = true;
|
||||
} else {
|
||||
userStore.setUserInfo(res.data);
|
||||
//再次登录 已有手机号 判断是否员工
|
||||
|
||||
//身份授权成功 核销人员
|
||||
if (res.data.is_staff == 1) {
|
||||
userStore.setUserInfo(res.data);
|
||||
uni.reLaunch({
|
||||
url: "/multipleShop/verificationOrder/index"
|
||||
})
|
||||
} else { // 直接选择门店
|
||||
uni.reLaunch({
|
||||
url: "/multipleShop/index/index"
|
||||
})
|
||||
}
|
||||
}
|
||||
navToIndex();
|
||||
// navToIndex();
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
|
|
@ -173,7 +186,6 @@
|
|||
}).then(res => {
|
||||
//手机号获取成功 可以本地缓存用户信息以及token
|
||||
userStore.setUserInfo(res.data);
|
||||
|
||||
//身份授权成功 核销人员
|
||||
if (res.is_staff == 1) {
|
||||
userStore.setUserInfo(res.data);
|
||||
|
|
|
|||
|
|
@ -1,359 +1,319 @@
|
|||
<!-- 会员充值 -->
|
||||
<!-- <style lang="scss">
|
||||
.member {
|
||||
padding: 40rpx 0 300rpx 0;
|
||||
|
||||
.card {
|
||||
background: linear-gradient(to right, #F7EED7, #E7DAAF);
|
||||
height: 302rpx;
|
||||
margin: 0 30rpx 30rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx 0 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.card-info-right {
|
||||
margin-left: 40rpx;
|
||||
|
||||
.phone {
|
||||
margin-bottom: 12rpx;
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #444444;
|
||||
}
|
||||
|
||||
.level {
|
||||
font-size: 28rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="member">
|
||||
<view class="card">
|
||||
<view class="card-info">
|
||||
<up-image width="100rpx" height="100rpx" />
|
||||
<view class="card-info-right">
|
||||
<view class="phone">155****4444</view>
|
||||
<view class="level">初级会员 享受9折优惠</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view></view>
|
||||
</view>
|
||||
</view>
|
||||
</template> -->
|
||||
|
||||
|
||||
<!-- 会员充值 -->
|
||||
<style lang="scss">
|
||||
.member {
|
||||
// padding-top: 40rpx;
|
||||
padding: 40rpx 0 300rpx 0;
|
||||
|
||||
.card {
|
||||
background: linear-gradient(to right, #F7EED7, #E7DAAF);
|
||||
height: 302rpx;
|
||||
margin: 0 30rpx 30rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx 0 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.card-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.card-info-right {
|
||||
margin-left: 40rpx;
|
||||
|
||||
.phone {
|
||||
margin-bottom: 12rpx;
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #444444;
|
||||
}
|
||||
|
||||
.level {
|
||||
font-size: 28rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.money {
|
||||
display: flex;
|
||||
font-size: 28rpx;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 34rpx;
|
||||
|
||||
text {
|
||||
margin-right: 116rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.charge {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 38rpx;
|
||||
|
||||
.charge-left {
|
||||
flex: 1;
|
||||
margin-right: 30rpx;
|
||||
|
||||
&>view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
text {
|
||||
font-size: 22rpx;
|
||||
color: #A26341;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.charge-right {
|
||||
width: 148rpx;
|
||||
height: 52rpx;
|
||||
line-height: 52rpx;
|
||||
background: #7B5232;
|
||||
border-radius: 30rpx;
|
||||
font-size: 22rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rules {
|
||||
background: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
margin: 0 30rpx 30rpx;
|
||||
padding: 30rpx;
|
||||
|
||||
.rules-title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 34rpx;
|
||||
|
||||
.rules-title-main {
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #444444;
|
||||
}
|
||||
|
||||
.rules-title-record {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 28rpx;
|
||||
color: #444444;
|
||||
}
|
||||
}
|
||||
|
||||
.rules-con {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.rules-con-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 188rpx;
|
||||
height: 220rpx;
|
||||
border: 2rpx solid #F1F1F1;
|
||||
border-radius: 16rpx;
|
||||
margin-bottom: 28rpx;
|
||||
|
||||
&:not(:nth-child(3n)) {
|
||||
margin-right: 26rpx;
|
||||
}
|
||||
|
||||
.rules-con-item-main {
|
||||
margin-bottom: 10rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.rules-con-item-sub {
|
||||
margin-bottom: 30rpx;
|
||||
font-size: 24rpx;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
.rules-con-item-amount {
|
||||
text {
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.symbol {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.attention {
|
||||
margin: 0 30rpx;
|
||||
|
||||
.attention-title {
|
||||
position: relative;
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #262626;
|
||||
margin-bottom: 20rpx;
|
||||
margin-left: 10rpx;
|
||||
|
||||
text {
|
||||
margin-left: 14rpx;
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 6rpx;
|
||||
height: 100%;
|
||||
border-radius: 4rpx;
|
||||
background: #FF8056;
|
||||
}
|
||||
}
|
||||
|
||||
.attention-tips {
|
||||
font-size: 24rpx;
|
||||
color: #7A7A7A;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.member-btn {
|
||||
position: fixed;
|
||||
bottom: 0rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
height: 110rpx;
|
||||
background-color: #F6F6F6;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding-bottom: constant(safe-area-inset-bottom);
|
||||
/* 兼容 iOS < 11.2 */
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
/* 兼容 iOS >= 11.2 */
|
||||
|
||||
|
||||
.btn-wrap {
|
||||
width: 670rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
margin: 0 auto;
|
||||
background: #EFCC6E;
|
||||
border-radius: 40rpx;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<view class="member">
|
||||
<view class="card">
|
||||
<view class="card-info">
|
||||
<up-image width="100rpx" height="100rpx" />
|
||||
<view class="card-info-right">
|
||||
<view class="phone">155****4444</view>
|
||||
<view class="level">初级会员 享受9折优惠</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="money">
|
||||
<text>余额：10000</text>
|
||||
<view>充值</view>
|
||||
</view>
|
||||
|
||||
<view class="charge">
|
||||
<view class="charge-left">
|
||||
<view>
|
||||
<text>当前已充值1000，升级还需2000</text>
|
||||
<text>Lv.2</text>
|
||||
</view>
|
||||
<up-line-progress :percentage="30" activeColor="#A26341" inactiveColor="#fff"
|
||||
height="8rpx"></up-line-progress>
|
||||
</view>
|
||||
<view class="charge-right">升级会员</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 充值规格 -->
|
||||
<view class="rules">
|
||||
<view class="rules-title">
|
||||
<view class="rules-title-main">充值规格</view>
|
||||
<view class="rules-title-record">
|
||||
充值记录
|
||||
<up-icon name="arrow-right"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rules-con">
|
||||
<view class="rules-con-item" v-for="item in 4">
|
||||
<view class="rules-con-item-main">基础会员</view>
|
||||
<view class="rules-con-item-sub">永久</view>
|
||||
<view class="rules-con-item-amount">
|
||||
<text class="symbol">￥</text>
|
||||
<text>1000</text>
|
||||
<view class="card-wrap">
|
||||
<view class="card" :style="{'background-image':'url(../../static/icon/account_bg.webp)'}">
|
||||
<view class="card-info">
|
||||
<up-image width="100rpx" height="100rpx" />
|
||||
<view class="card-info-right">
|
||||
<view class="phone">155****4444</view>
|
||||
<view class="level">开通会员 享折扣权益</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="rules-con-define">
|
||||
<up-input placeholder="点击输入金额" type="number" color="#333" fontSize="28rpx"
|
||||
:placeholderStyle="{color:'#989898'}">
|
||||
<template #prefix>
|
||||
<up-text text="自定义金额" color="#111" size="30rpx" margin="0 3px 0 0" type="tips"></up-text>
|
||||
</template>
|
||||
</up-input>
|
||||
<view class="charge">
|
||||
<view class="charge-left">
|
||||
<view>
|
||||
<text class="txt">账户余额(元)</text>
|
||||
<text class="money">1680.00</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="charge-right">充值</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 注意事项 -->
|
||||
<view class="attention">
|
||||
<view class="attention-title"><text>注意事项：</text></view>
|
||||
<view class="attention-tips">1、充值后帐户的金额不能提现，可用于消费使用</view>
|
||||
<view class="attention-tips">2、账户充值出现问题可联系平台客服，也可拨打平台客服咨询热线4008888888</view>
|
||||
</view>
|
||||
<view class="detail">
|
||||
<view class="detail-title">账户详情</view>
|
||||
<view class="detail-total">
|
||||
<view class="detail-total-item">
|
||||
<text>累计消费</text>
|
||||
<view>1000</view>
|
||||
</view>
|
||||
<view class="detail-total-item">
|
||||
<text>累计充值</text>
|
||||
<view>1000</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="member-btn">
|
||||
<view class="btn-wrap">
|
||||
确认充值
|
||||
<view class="detail-card">
|
||||
<view class="detail-card-item">
|
||||
<view class="detail-card-item-left">
|
||||
<u-image width="60rpx" height="60rpx"></u-image>
|
||||
</view>
|
||||
<view class="detail-card-item-right">
|
||||
<view class="detail-card-item-right-money">
|
||||
<text>会员充值</text>
|
||||
<text>+1000.00</text>
|
||||
</view>
|
||||
<viewl class="detail-card-item-right-remind">
|
||||
<text>2024-06-04 14:00:00</text>
|
||||
<text>余额1000元</text>
|
||||
</viewl>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="detail-card-item">
|
||||
<view class="detail-card-item-left">
|
||||
<u-image width="60rpx" height="60rpx"></u-image>
|
||||
</view>
|
||||
<view class="detail-card-item-right">
|
||||
<view class="detail-card-item-right-money">
|
||||
<text>会员充值</text>
|
||||
<text>+1000.00</text>
|
||||
</view>
|
||||
<viewl class="detail-card-item-right-remind">
|
||||
<text>2024-06-04 14:00:00</text>
|
||||
<text>余额1000元</text>
|
||||
</viewl>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="detail-card-item">
|
||||
<view class="detail-card-item-left">
|
||||
<u-image width="60rpx" height="60rpx"></u-image>
|
||||
</view>
|
||||
<view class="detail-card-item-right">
|
||||
<view class="detail-card-item-right-money">
|
||||
<text>会员充值</text>
|
||||
<text>+1000.00</text>
|
||||
</view>
|
||||
<viewl class="detail-card-item-right-remind">
|
||||
<text>2024-06-04 14:00:00</text>
|
||||
<text>余额1000元</text>
|
||||
</viewl>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="detail-card-item" v-for="item in 5">
|
||||
<view class="detail-card-item-left">
|
||||
<u-image width="60rpx" height="60rpx"></u-image>
|
||||
</view>
|
||||
<view class="detail-card-item-right">
|
||||
<view class="detail-card-item-right-money">
|
||||
<text>会员充值</text>
|
||||
<text>+1000.00</text>
|
||||
</view>
|
||||
<viewl class="detail-card-item-right-remind">
|
||||
<text>2024-06-04 14:00:00</text>
|
||||
<text>余额1000元</text>
|
||||
</viewl>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
<script setup>
|
||||
import {
|
||||
rechargeApi
|
||||
} from "@/api/user.js";
|
||||
import {
|
||||
onLoad,
|
||||
onReachBottom
|
||||
} from "@dcloudio/uni-app"
|
||||
|
||||
onLoad(() => {})
|
||||
|
||||
rechargeApi({
|
||||
price: 1000
|
||||
}).then(res => {
|
||||
console.log(res);
|
||||
onReachBottom((e) => {
|
||||
console.log(e);
|
||||
})
|
||||
</script>
|
||||
rechargeApi({
|
||||
price: 0.01
|
||||
}).then(res => {
|
||||
|
||||
|
||||
if (!res.data?.nonceStr) return uni.$u.toast('支付失败!');
|
||||
console.log(2);
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
timeStamp: res.data.timeStamp,
|
||||
nonceStr: res.data.nonceStr,
|
||||
package: res.data.package,
|
||||
signType: res.data.signType,
|
||||
paySign: res.data.paySign,
|
||||
success: (e) => {
|
||||
if (e.errMsg == 'requestPayment:ok') {
|
||||
uni.showModal({
|
||||
title: '订单支付成功',
|
||||
confirmText: '查看订单',
|
||||
cancelText: '继续购买',
|
||||
success: (e) => {
|
||||
if (e.confirm) uni.redirectTo({
|
||||
url: '/pagesOrder/order/order?back=-1&type=2'
|
||||
})
|
||||
else uni.navigateBack();
|
||||
}
|
||||
})
|
||||
} else uni.$u.toast('支付失败')
|
||||
},
|
||||
fail: (e) => {
|
||||
uni.$u.toast('用户取消支付');
|
||||
uni.redirectTo({
|
||||
url: '/pagesOrder/order/order?back=-1&type=1'
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.member {
|
||||
padding-bottom: 300rpx;
|
||||
|
||||
.card-wrap {
|
||||
padding: 40rpx 0 20rpx 0;
|
||||
background-color: #fff;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.card {
|
||||
background-size: 100%;
|
||||
background-repeat: no-repeat;
|
||||
height: 272rpx;
|
||||
margin: 0 30rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 20rpx 0 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
|
||||
.card-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 60rpx;
|
||||
|
||||
.card-info-right {
|
||||
margin-left: 40rpx;
|
||||
|
||||
.phone {
|
||||
margin-bottom: 12rpx;
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #444444;
|
||||
}
|
||||
|
||||
.level {
|
||||
font-size: 28rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.charge {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 38rpx;
|
||||
|
||||
.charge-left {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
margin-right: 30rpx;
|
||||
|
||||
&>view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
.txt {
|
||||
margin-right: 16rpx;
|
||||
font-size: 24rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
|
||||
.money {
|
||||
font-weight: 600;
|
||||
font-size: 48rpx;
|
||||
color: #7B5232;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.charge-right {
|
||||
width: 148rpx;
|
||||
height: 52rpx;
|
||||
line-height: 52rpx;
|
||||
background: #7B5232;
|
||||
border-radius: 30rpx;
|
||||
font-size: 22rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail {
|
||||
margin: 0 30rpx;
|
||||
|
||||
.detail-title {
|
||||
margin-bottom: 16rpx;
|
||||
font-weight: 600;
|
||||
font-size: 32rpx;
|
||||
color: #262626;
|
||||
}
|
||||
|
||||
.detail-total {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 30rpx;
|
||||
|
||||
.detail-total-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 68rpx;
|
||||
|
||||
text {
|
||||
margin-right: 4rpx;
|
||||
font-size: 28rpx;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
view {
|
||||
font-weight: 600;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.detail-card-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 130rpx;
|
||||
border-bottom: 2rpx solid #F3F3F3;
|
||||
|
||||
.detail-card-item-left {
|
||||
margin-right: 22rpx;
|
||||
}
|
||||
|
||||
.detail-card-item-right {
|
||||
flex: 1;
|
||||
|
||||
.detail-card-item-right-money {
|
||||
margin-bottom: 14rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.detail-card-item-right-remind {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -16,15 +16,15 @@
|
|||
|
||||
<view class="u-card-level">
|
||||
<view class="u-level-item">
|
||||
<view class="u-level-item-num">123</view>
|
||||
<view class="u-level-item-num">{{userInfo.vip_name}}</view>
|
||||
<view class="u-level-item-txt">会员等级</view>
|
||||
</view>
|
||||
<view class="u-level-item">
|
||||
<view class="u-level-item-num">123</view>
|
||||
<view class="u-level-item-num">{{userInfo.discount}}</view>
|
||||
<view class="u-level-item-txt">可享折扣</view>
|
||||
</view>
|
||||
<view class="u-level-item">
|
||||
<view class="u-level-item-num">123</view>
|
||||
<view class="u-level-item-num">{{userInfo.now_money}}</view>
|
||||
<view class="u-level-item-txt">可用余额</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -37,18 +37,22 @@
|
|||
<up-image width="36rpx" height="36rpx" src="/static/icon/silver.webp"></up-image>
|
||||
<text>初级会员</text>
|
||||
<up-line direction="col" color="#707070" margin="0 10rpx" length="12"></up-line>
|
||||
<view>活动期间下单即享初级会员</view>
|
||||
<view :style="{'font-weight':userInfo.user_ship>0?'bold':'normal'}">
|
||||
{{userInfo.user_ship>0?'享折扣权益':'活动期间下单即享初级会员'}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="member-right" @click="handleBack(userInfo.user_ship)">
|
||||
{{userInfo.user_ship>0?'立即升级':'立即下单'}}
|
||||
</view>
|
||||
<view class="member-right">立即下单</view>
|
||||
</view>
|
||||
|
||||
<view class="member-progress">
|
||||
<view>
|
||||
<text>当前已充值1000，升级还需2000</text>
|
||||
<text>Lv.2</text>
|
||||
<text>当前已充值{{userInfo.total_recharge_amount}}，升级还需{{userInfo.next_limit}}</text>
|
||||
<text>{{userInfo.next_level}}</text>
|
||||
</view>
|
||||
<up-line-progress :percentage="30" activeColor="#A26341" inactiveColor="#fff"
|
||||
height="8rpx"></up-line-progress>
|
||||
<up-line-progress :percentage="(userInfo.total_recharge_amount/userInfo.next_limit).toFixed(2)"
|
||||
activeColor="#A26341" inactiveColor="#fff" height="8rpx"></up-line-progress>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
|
@ -130,6 +134,19 @@
|
|||
})
|
||||
}
|
||||
|
||||
// 返回下单 或者充值
|
||||
const handleBack = (e) => {
|
||||
console.log(userInfo.user_ship);
|
||||
|
||||
if (e > 0) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/charge/charge"
|
||||
})
|
||||
} else {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
|
||||
const navTo = (type = 0) => {
|
||||
uni.navigateTo({
|
||||
url: `/pagesOrder/order/order?type=${type}`
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 188 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 191 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Loading…
Reference in New Issue