Client-Teapay/src/pages/cash/index.vue

<template>
    <view class="container">
        <view class="content">
            <view class="moeny flex_r flex_ae">￥
                <input type="number" :maxlength="12" v-model="inputMoney" placeholder="请输入提现金额" />
            </view>
            <view class="option flex_r flex_ac flex_jb">
                <view class="balance flex_r flex_ac">
                    <span>账户{{ islocal?'余额':'云宝' }}：{{ user_money }}</span>
                    <span v-if="islocal">可提：{{ available_money }}</span>
                </view>
                <view class="option_text" @tap="getListPage">提现记录</view>
            </view>
        </view>
        <view class="upload flex_c flex_jc flex_ac">
            <block v-if="imgs == '' || imgs == undefined">
                <view class="upload_con flex_c flex_ac flex_jc" @tap="uploadImg"><text>+</text></view>
            </block>
            <block v-else>
                <image class="upload_img" :src="imgs" mode="" @tap="uploadImg"></image>
            </block>
            <view class="upload_text">请上传本人收款码</view>
        </view>
        <view class="btn flex_r flex_ac flex_jc" @tap="onSubForm">申请提现</view>
        <view class="showlist" v-for="(item, index) in show" :key="index">{{ item }}</view>
    </view>
</template>
<script>
let app = getApp();
var appEv = app.$vm.$options;
import { post } from "@/request/api.js";
export default {
    data() {
        return {
            show: [],
            inputMoney: "",
            imgs: "",
            index: 0,
            userinfo: undefined, // 获取用户信息
            localInfo: undefined,

            user_money: 0, //余额
            available_money: 0, //数智生活可提金额

            islocal: false
        };
    },
    onLoad: function(e) {
        if (e.type == "local") {
            this.getLU();
            this.islocal = true;
        } else {
            this.getU();
            this.islocal = false;
        }
        this.getExolain();
    },
    methods: {
        getExolain() {
            let url = this.islocal ? "local/withdrawDesc" : "v1/withdrawdesc"
            post(url).then(res => {
                this.show = this.islocal ? res.data[0] : res.data.data[0]
            })
        },
        onSubForm() {
            let that = this;
            let url = this.islocal ? "local/withdraw" : "v1/user/withdraw"
            if (this.inputMoney == "") {
                appEv.errTips("请输入金额");
                return;
            }
            if (!this.imgs) {
                uni.showModal({
                    content: `请上传您的收款码`,
                    showCancel: false,
                    success(res) {},
                });
                return;
            }
            if (Number(this.inputMoney) > Number(this.user_money)) {
                uni.showModal({
                    content: `当前可提现${that.user_money}`,
                    showCancel: false,
                    success(res) {},
                });
                return;
            }

            uni.showLoading({
                mask: true,
            });
            let data = {
                money: this.inputMoney,
                pay_code: this.imgs,
                w_type: 1,
            };
            post(url, data).then((res) => {
                uni.hideLoading();
                if (res.code === 0) {
                    this.inputMoney = "";
                    uni.showModal({
                        content: `提交成功，请等待审核！`,
                        confirmText: "知道了",
                        showCancel: false,
                        success(res) {},
                    });
                    if (this.islocal) this.getLU()
                    else this.getU()
                } else {
                    appEv.errTips(res.msg || "");
                }
            });
        },
        // 上传图片uploadImg
        uploadImg() {
            let that = this;
            uni.chooseImage({
                count: 1, // 最多可以选择的图片张数，默认9
                sizeType: ["compressed"], // original 原图，compressed 压缩图，默认二者都有
                sourceType: ["album", "camera"], // album 从相册选图，camera 使用相机，默认二者都有
                success: function(res) {
                    var arr = res.tempFiles;
                    that.uploadImgs(arr[0].path);
                },
            });
        },
        uploadImgs(img) {
            var that = this;
            uni.uploadFile({
                url: that.$hosts.Hhost + "v1/user/upload",
                filePath: img,
                name: "image",
                header: {
                    token: uni.getStorageSync("token"),
                },
                success: function(res) {
                    uni.hideToast();
                    let resTwo = JSON.parse(decodeURIComponent(res.data))
                    if (resTwo.code === 0) {
                        that.imgs = resTwo.data.src;
                    } else {
                        appEv.errTips(resTwo.msg);
                    }
                },
            });
        },
        getListPage() {
            uni.navigateTo({
                url: "/pages/accountDetails/withdraw",
            });
        },

        async getU() {
            this.userinfo = await uni.userfun();
            this.user_money = this.userinfo.user_money;
        },
        async getLU() {
            this.localInfo = await uni.Luserfun();
            this.user_money = this.localInfo.property;
            post("local/withdrawAmount").then((res) => {
                if (res.code === 0) {
                    this.available_money = res.data
                }
            })
        },
    },
};
</script>
<style lang="scss" scoped>
// 页面配置
.container {
    border-top: 20rpx solid #f5f5f5;
    padding: 43rpx 30rpx;
    box-sizing: border-box;
}

// 页面配置-end

.title_select {
    margin-left: 36rpx;
}

.upload {
    width: 100%;
    overflow: hidden;
}

.balance {
    font-size: 26rpx;
    color: #7c838d;
    span{
        margin-right: 22rpx;
        &:last-child{
            margin-right: 0;
        }
    }
}

.option_text {
    font-size: 28rpx;
    color: #18bb88;
}

.upload_con text {
    color: #898989;
    font-size: 40rpx;
}

.hint {
    font-size: 26rpx;
    color: #8f8f8f;
    margin-top: 40rpx;
}

.upload_img {
    width: 200rpx;
    height: 200rpx;
    margin-top: 60rpx;
}

.title {
    font-size: 28rpx;
    color: #7c838d;
    margin-bottom: 40rpx;
}

.upload_text {
    font-size: 26rpx;
    color: #898989;
    margin-top: 20rpx;
}

.showlist {
    font-size: 26rpx;
    color: #7c838d;
    margin-bottom: 20rpx;
}

.moeny input {
    color: #121922;
    font-size: 56rpx;
    height: 56rpx;
    margin-left: 10rpx;
}

.upload_con {
    width: 200rpx;
    height: 200rpx;
    border: 3rpx solid #898989;
    border-radius: 10rpx;
    margin-top: 60rpx;
}

.moeny {
    font-size: 42rpx;
    color: #121922;
    line-height: 1;
    height: 56rpx;
    border-bottom: 3rpx solid #e4e4ee;
    margin-bottom: 70rpx;
    padding: 37rpx 0;
}

.content {
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);
    width: 100%;
    overflow: hidden;
    padding: 40rpx;
    box-sizing: border-box;
    border-radius: 20rpx;
}

.btn {
    width: 348rpx;
    height: 80rpx;
    background: #18bb88;
    color: #fff;
    font-size: 40rpx;
    border-radius: 10rpx;
    box-shadow: 0px 8px 22px 2px rgba(24, 187, 136, 0.22);
    margin: 64rpx auto;
}
</style>