<template>
    <view class="douyin-withdraw">
        <image class="dw-icon" mode="aspect" src="/subpackage/wallet/static/images/dy_logo.png"></image>
        <view class="dw-tip">可提现资金</view>
        <view class="dw-price">
            <text class="dp-unit">¥</text>{{ balance }}
        </view>
        <view class="dw-btn" @click="applyBtn">申请提现</view>
        <view class="dw-link">
            <text class="dl-txt" @click="toDetailBtn">提现明细</text>
            <image class="dl-icon" mode="aspect" src="/subpackage/wallet/static/images/arrow_b2.png"></image>
        </view>
    </view>
</template>

<script>
import { WALLET_API } from '../../js/api';
import servers from '../../js/server';
import { routeTo, showLoad, hideLoad } from '@/utils/util';
export default {
    data(){
        return {
            brand_id: '',
            balance: 0,
        }
    },
    onLoad(options){
        this.brand_id = options.brand_id || '';
    },
    onShow(){
        this.getDouyinWalletBalance(this.brand_id);
    },
    methods: {
        // 
        toDetailBtn(){
            routeTo(`/subpackage/wallet/pages/douyin_withdraw/record?brand_id=${this.brand_id}`, 'nT');
        },
        // 申请提现
        applyBtn(){
            routeTo(`/subpackage/wallet/pages/douyin_withdraw/apply?brand_id=${this.brand_id}`, 'nT');
        },
        /**
         * http://api.ouxuan.net:61080/project/11/interface/api/2195
         * @param {String} brand_id 品牌id
         * */ 
        getDouyinWalletBalance(brand_id){
            showLoad();
            servers.get({
                url: WALLET_API.withdrawalOfDouyinOrg_totalAmount,
                data: {
                    brand_id: brand_id
                },
                failMsg: '获取钱包余额失败'
            })
            .then(res=>{
                hideLoad();
                let _balance = +res.total_amount ?? 0;
                this.balance = _balance * 0.01;
            })
            .catch(hideLoad)
        },
    }

}
</script>

<style lang="scss">
    .douyin-withdraw{
        padding-top: 88upx;
        .dw-icon{
            margin: 0 auto;
            display: block;
            width: 96upx;
            height: 96upx;
            background: #000;
            border-radius: 24upx;
        }
        .dw-tip{
            margin-top: 62upx;
            text-align: center;
            @include flcw(28upx, 40upx, #000000);
        }
        .dw-price{
            padding: 0 20upx;
            margin-top: 20upx;
            text-align: center;
            @include flcw(84upx, 96upx, #000000, 700);
            @include tHide(1);
            .dp-unit{
                font-size: 64upx;
            }
        }
        .dw-btn{
            margin: 154upx auto 0;
            width: 300upx;
            border-radius: 10upx;
            text-align: center;
            background: #FF873D;
            @include flcw(32upx, 112upx, #fff);
        }
        .dw-link{
            margin-top: 88upx;
            @include flcw(28upx, 40upx, #9A9A9D);
            @include ctf(center);
            .dl-icon{
                flex-shrink: 0;
                margin-left: 6upx;
                width: 28upx;
                height: 28upx;
                
            }
        }
    }
</style>