zx_bms_uni/pages/commissionlist/commissionlist.vue

<template>
    <view class="container">
        <view class="main-container">
            <view v-if="money && money != 0" class="nav-tab flex-row flex-between">
                <view class="form-label">待提现金额：{{ money / 100 }}元</view>
                <view class="form-value">
                    <view v-if="apply" class="op-btn" @tap="bindApply">申请提现</view>
                </view>
            </view>
            <view class="nav-tab flex-row flex-between">
                <view class="order-type-container flex-row flex-start">
                    <view :class="'nav-item ' + (navSelected == 0 ? 'nav-active' : '')" @tap="bindSelectNavTab" data-nav="0">全部</view>
                    <view :class="'nav-item ' + (navSelected == 1 ? 'nav-active' : '')" @tap="bindSelectNavTab" data-nav="1">待提现</view>
                    <view :class="'nav-item ' + (navSelected == 2 ? 'nav-active' : '')" @tap="bindSelectNavTab" data-nav="2">审核中</view>
                    <view :class="'nav-item ' + (navSelected == 3 ? 'nav-active' : '')" @tap="bindSelectNavTab" data-nav="3">已提现</view>
                </view>
            </view>

            <view class="list-group">
                <view class="list-item" v-for="(item, index) in commissionList" :key="index">
                    <view class="list-item-head flex-row flex-between">
                        <view class="order-time">{{ item.ctime }}</view>
                        <view class="order-status">
                            <text v-if="item.status == 0" class="i-status to-check">待提现</text>
                            <text v-if="item.status == 1" class="i-status to-ing">审核中</text>
                            <text v-if="item.status == 2" class="i-status to-pay-ok">已提现</text>
                        </view>
                    </view>

                    <view class="list-item-body">
                        <view class="form-item flex-row flex-between">
                            <view class="form-label">订单号</view>
                            <view class="form-value" @tap="handleClipboard" :data-clipdata="item.order_sn">
                                {{ item.order_sn }}
                                <image src="/static/resource/images/clip.png" style="width: 10px; height: 10px; margin-left: 5px"></image>
                            </view>
                        </view>
                        <view class="form-item flex-row flex-between">
                            <view class="form-label">设备编号</view>
                            <view class="form-value" @tap="handleClipboard" :data-clipdata="item.battery_sn">
                                {{ item.battery_sn }}
                                <image src="/static/resource/images/clip.png" style="width: 10px; height: 10px; margin-left: 5px"></image>
                            </view>
                        </view>
                        <view class="form-item flex-row flex-between">
                            <view class="form-label">订单金额</view>
                            <view class="form-value">
                                <text>{{ item.total_money / 100 }}元/</text>
                            </view>
                        </view>
                        <view class="form-item flex-row flex-between">
                            <view class="form-label">雇主门店</view>
                            <view class="form-value">{{ item.main_name }}</view>
                        </view>
                        <view class="form-item flex-row flex-between">
                            <view class="form-label">佣金比例</view>
                            <view class="form-value">{{ item.proportion }}%</view>
                        </view>
                        <view class="form-item flex-row flex-between">
                            <view class="form-label">收佣门店</view>
                            <view class="form-value">{{ item.shop_name }}</view>
                        </view>
                        <view class="form-item flex-row flex-between">
                            <view class="form-label">佣金金额</view>
                            <view class="form-value pay-money">{{ item.money / 100 }}元</view>
                        </view>
                    </view>
                </view>
            </view>

            <no-more :is-loading="isLoading" />
        </view>
    </view>
</template>

<script>
import noMore from '@/component/nomore/nomore';
// pages/commissionlist/commissionlist.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');
export default {
    components: {
        noMore
    },
    data() {
        return {
            navSelected: 0,
            start_page: 1,
            limit_page: 10,
            commissionList: [],
            isLoading: false,
            money: null,
            apply: false
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function (options) {
        this.loadCommissionMoney();
        this.refreshCommissionList();
    },
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {
        this.refreshCommissionList();
    },
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom: function () {
        this.setData({
            isLoading: true
        });
        this.start_page++;
        this.loadCommissionList();
    },
    methods: {
        loadCommissionMoney: function () {
            const that = this;
            http.postApi(config.API_COMMISSION_MONEY, {}, function (resp) {
                if (resp.data.code === 200) {
                    that.setData({
                        money: resp.data.data.money,
                        apply: resp.data.data.apply
                    });
                } else {
                    common.simpleToast(resp.data.msg);
                }
            });
        },

        bindSelectNavTab: function (e) {
            const navSelected = e.currentTarget.dataset.nav || 1;
            this.setData({
                navSelected: navSelected,
                start_page: 1,
                commissionList: []
            });
            this.loadCommissionList();
        },

        refreshCommissionList() {
            this.setData({
                start_page: 1,
                commissionList: []
            });
            this.loadCommissionList();
        },

        loadCommissionList: function () {
            const pData = {
                page: this.start_page,
                limit: this.limit_page,
                status: this.navSelected
            };
            const that = this;
            common.loading();
            http.postApi(config.API_COMMISSION_LIST, pData, function (resp) {
                uni.hideLoading();
                uni.stopPullDownRefresh();
                if (resp.data.code === 200) {
                    let commissionList = that.commissionList;
                    commissionList.push.apply(commissionList, resp.data.data.list);
                    that.setData({
                        commissionList: commissionList,
                        isLoading: false
                    });
                } else {
                    common.simpleToast(resp.data.msg);
                }
            });
        },

        bindApply: function () {
            const that = this;
            uni.login({
                success: function (res) {
                    //const accountInfo = uni.getAccountInfoSync();
                    var pData = {
                        code: res.code,
                        appid: "wxddbcc3709026525e"
                    };
                    http.postApi(config.API_COMMISSION_APPLY_BOSS, pData, function (resp) {
                        if (resp.data.code === 200) {
                            common.simpleToast('申请成功');
                            that.loadCommissionMoney();
                            that.refreshCommissionList();
                        } else {
                            common.simpleToast(resp.data.msg);
                        }
                    });
                }
            });
        },

        handleClipboard(e) {
            const clipdata = e.currentTarget.dataset.clipdata;
            uni.setClipboardData({
                data: clipdata
            });
        },

        navigatorToPage: function (e) {
            const page = e.currentTarget.dataset.page;
            if (!page) {
                return;
            }
            uni.navigateTo({
                url: page
            });
        }
    }
};
</script>
<style>
@import './commissionlist.css';
</style>