zx_bms_uni/pages/credit/credit.vue

<template>
    <!-- pages/credit/credit.wxml -->
    <view class="container">
        <view class="credit-container">
            <view class="credit-item flex-row flex-between">
                <view class="item-titie">{{$t('物联网卡号码')}}:</view>
                <view class="item-value">{{ simInfo.cardno }}</view>
            </view>
            <view class="credit-item flex-row flex-between">
                <view class="item-titie">ICCID:</view>
                <view class="item-value">{{ simInfo.iccid }}</view>
            </view>
            <view class="credit-item flex-row flex-between">
                <view class="item-titie">{{$t('设备名称')}}:</view>
                <view class="item-value">{{ simInfo.name }}</view>
            </view>
            <view class="credit-item flex-row flex-between">
                <view class="item-titie">{{$t('到期时间')}}:</view>
                <view class="item-value">{{ simInfo.validdate }}</view>
            </view>
            <view class="credit-item flex-row flex-between">
                <view class="item-titie">{{$t('年费')}}:</view>
                <view class="item-value">{{ simInfo.price / 100 + $t('元') }}</view>
            </view>
            <view class="credit-item" @tap="bindCredit">
                <button class="credit-btn">{{$t('充值')}}</button>
            </view>
        </view>
    </view>
</template>

<script>
// pages/credit/credit.js
var config = require('../../common/config.js');
var http = require('../../common/http.js');
var common = require('../../common/common.js');
var storage = require('../../common/storage.js');
var user = require('../../common/user.js');
export default {
    data() {
        return {
            macid: '',
            simInfo: {
                cardno: '',
                iccid: '',
                name: '',
                validdate: '',
                price: 0
            }
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
		uni.setNavigationBarTitle({
			title: this.$t('物联网卡充值')
		});
        if (!options.macid) {
            uni.navigateBack({
                delta: 1
            });
        }
        this.setData({
            macid: options.macid
        });
        this.loadSimInfo();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {
		uni.setNavigationBarTitle({
			title: this.$t('物联网卡充值')
		});
	},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    methods: {
        loadSimInfo: function () {
            common.loading(this);
			const me = this
            http.postApi(
                config.API_SIM_INFO,
                {
                    macid: this.macid
                },
                (resp) => {
                    uni.hideLoading();
                    if (resp.data.code === 200) {
                        const simInfo = resp.data.data.info;
                        if (!simInfo) {
                            common.simpleToast(me,me.$t('无SIM信息'));
                            setTimeout(function () {
                                uni.navigateBack({
                                    delta: 1
                                });
                            }, 1500);
                        }
                        this.setData({
                            simInfo: resp.data.data.info
                        });
                    } else {
                        if (resp.data.code === 12005) {
                            common.simpleToast(me,resp.data.msg + '：' + resp.data.data.msg.resultmsg);
                            setTimeout(function () {
                                uni.navigateBack({
                                    delta: 1
                                });
                            }, 1500);
                        } else {
                            common.simpleToast(me,resp.data.msg);
                            setTimeout(function () {
                                uni.navigateBack({
                                    delta: 1
                                });
                            }, 1500);
                        }
                    }
                }
            );
        },

        bindCredit() {
            common.loading(this);
			const me = this
            http.postApi(
                config.API_SIM_CREDIT,
                {
                    macid: this.macid,
                    type: 'jsapi'
                },
                (resp) => {
                    uni.hideLoading();
                    if (resp.data.code === 200) {
                        var payParams = JSON.parse(resp.data.data.payParams);
                        var order_sn = resp.data.data.order_sn;
                        user.wxPay(order_sn, payParams, function (isSuccess) {
                            if (isSuccess) {
                                common.simpleToast(me.$t('支付成功'));
                                setTimeout(function () {
                                    uni.navigateBack({
                                        delta: 1
                                    });
                                }, 1500);
                            }
                        });
                    } else {
                        common.simpleToast(me,resp.data.msg);
                    }
                }
            );
        }
    }
};
</script>
<style>
@import './credit.css';
</style>