You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
184 lines
3.6 KiB
Vue
184 lines
3.6 KiB
Vue
<template>
|
|
<view class="expend">
|
|
<view class="top">
|
|
<view style="display: flex;justify-content: space-between;">
|
|
<view>
|
|
<view class="name">{{Info.name}}</view>
|
|
<view class="tel">{{Info.tel}}</view>
|
|
</view>
|
|
<view>
|
|
<uni-icons type="wallet" style="color: #fff;margin-top: 4rpx;margin-left: 4rpx;"
|
|
size="70"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view
|
|
style="display: flex;justify-content: space-around; margin-top: 20rpx; background-color: #fff;border-radius: 40rpx; padding: 10rpx;">
|
|
|
|
<view>
|
|
<view class="info_title">
|
|
总充值金额(真实)
|
|
</view>
|
|
<view class="price">{{Info.all_true_money}}</view>
|
|
</view>
|
|
<view>
|
|
<view class="info_title" style="color: #18bc37;">
|
|
剩余额度
|
|
</view>
|
|
<view class="price" style="color: #55aa00;">{{Info.amount}}</view>
|
|
</view>
|
|
</view>
|
|
<view style="padding: 40rpx; margin-top: 40rpx;">
|
|
<view class="title">收费金额</view>
|
|
<input class="input" v-model="money" placeholder-style="color:#ccc;font-size:45rpx" type="number" placeholder="输入扣款额" />
|
|
<view class="title">收费内容</view>
|
|
|
|
<view class="uni-textarea" style="border: 1px solid #ccc; border-radius: 20rpx;padding: 20rpx;margin-top: 20rpx;">
|
|
<textarea placeholder-style="color:#ccc" v-model="desc" placeholder="服务内容" />
|
|
</view>
|
|
|
|
|
|
|
|
<view class="button" @click="expendFuc">收 费</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
ref
|
|
} from "vue"
|
|
import {
|
|
MemberGetDetail,MemberExpend
|
|
} from "@/api"
|
|
import {
|
|
onLoad,onShow
|
|
} from "@dcloudio/uni-app"
|
|
let member_id=ref(0)
|
|
let Info=ref({});
|
|
const GetMemberInfo=()=>{
|
|
MemberGetDetail({member_id:member_id.value}).then(res => {
|
|
if (res.status) {
|
|
Info.value=res.data.info
|
|
}
|
|
|
|
})
|
|
}
|
|
let money=ref(null);
|
|
let desc=ref('');
|
|
const expendFuc=()=>{
|
|
if(money.value==null){
|
|
uni.showToast({
|
|
title: '请输入金额',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
if(desc.value==''){
|
|
uni.showToast({
|
|
title: '请输入收费内容',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '确定扣款吗？',
|
|
confirmText:'确认',
|
|
cancelText:'取消',
|
|
success: function (r) {
|
|
if (r.confirm) {
|
|
MemberExpend({member_id:member_id.value,money:money.value,desc:desc.value}).then(res => {
|
|
if (res.status) {
|
|
uni.showToast({
|
|
title: '扣款成功',
|
|
});
|
|
uni.switchTab({
|
|
url:'/pages/index/index'
|
|
})
|
|
}
|
|
|
|
})
|
|
} else if (r.cancel) {
|
|
|
|
}
|
|
}
|
|
});
|
|
|
|
}
|
|
onLoad((e)=>{
|
|
member_id.value=e.member_id
|
|
GetMemberInfo()
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.expend {
|
|
height: calc(100vh - 90rpx);
|
|
background-color: #fff;
|
|
}
|
|
|
|
.top {
|
|
height: 240rpx;
|
|
padding: 50rpx;
|
|
background-color: #26CED0;
|
|
color: #fff;
|
|
}
|
|
|
|
.name {
|
|
font-size: 45rpx;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.tel {
|
|
font-size: 30rpx;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.info_title {
|
|
font-size: 30rpx;
|
|
color: #733e29
|
|
}
|
|
|
|
.price {
|
|
text-align: center;
|
|
color: #FF8A5B;
|
|
font-weight: 700;
|
|
margin-top: 10rpx;
|
|
|
|
|
|
}
|
|
|
|
.title {
|
|
font-size: 36rpx;
|
|
font-weight: 700;
|
|
color: #333;
|
|
}
|
|
|
|
.input {
|
|
margin-top: 20rpx;
|
|
margin-bottom: 20rpx;
|
|
border: 0rpx;
|
|
border-bottom: 1rpx solid #b0e2f9;
|
|
height: 100rpx;
|
|
color:#FF8A5B;
|
|
font-size: 50rpx;
|
|
font-weight: 700;
|
|
}
|
|
textarea{
|
|
color:#666;
|
|
font-size: 36rpx;
|
|
}
|
|
|
|
.button {
|
|
width: 100%;
|
|
background-color: #26CED0;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
color: #fff;
|
|
font-weight: 700;
|
|
border-radius: 50rpx;
|
|
margin-top: 80rpx;
|
|
}
|
|
</style> |