<template>
    <div class="airwallexWallet">
        <s-header :name="$t('airwallex.wallet')" :noback="false"></s-header>
        <div class="amount">
            <van-cell-group inset>
                <van-cell center :title="$t('airwallex.amount')" :value="amount" label="描述信息:可提取的金额" />
            </van-cell-group>
        </div>
        <br>
        <div class="cell-container">
            <van-cell-group inset>
                <van-cell title="创建付款单" is-link to="/airwallexPayout" />
                <van-cell title="付款详情页" is-link to="/paymentDetail" />
                <van-cell title="去百度" is-link url="https://www.baidu.com" />
            </van-cell-group>
        </div>
        <br>
        <div class="airwallexWalletBtn">
            <van-button round type="primary" class="register" @click="handleWithdraw">提现</van-button>
        </div>
    </div>
</template>

<script>
import { useRouter } from 'vue-router';
import sHeader from "@/components/SimpleHeader";
import { styleUrl } from '../../common/js/utils';
import { ref, onMounted } from 'vue';
import { getWallet } from '@/service/airwallex/index';

export default {
    setup() {
        styleUrl("airwallex")
        const router = useRouter();
        const amount = ref(0.00);

        const loginUserStr = localStorage.getItem('loginUser');
        const loginUser = JSON.parse(loginUserStr);
        const adminId = loginUser.id;
        // console.log("adminId>>>", adminId);

        onMounted(async () => {
            try {
                // 请求后端接口: 获取钱包信息
                const resp = await getWallet(adminId);
                // console.log("resp.data>>>", resp.data);
                amount.value = resp.data.accountAmount;
            } catch (error) {
                console.error(error);
                // 处理异常情况
            }
        })

        const handleWithdraw = () => {

            // 导航到提现页面
            router.push('/airwallexBeneficiary');
        };

        return {
            amount,
            handleWithdraw
        };
    },
    components: { sHeader },

}
</script>