<template>
    <!-- Header Start -->
    <header class="header">
        <div class="logo-wrap">
            <i class="icon-arrow-left-bold-box icli" @click="$router.push('/user/info')"></i>
            <h1 class="title-color font-md">提領帳戶</h1>
        </div>
    </header>
    <!-- Header End -->

    <!-- Main Start -->
    <main class="main-wrap setting-page mb-xxl">

        <!-- Form Section Start -->
        <van-form @submit="onSubmit">
            <van-cell-group inset>
                <van-field v-model="form.bank_name" name="bank_name" placeholder="銀行名稱" />
                <van-field v-model="form.bank_code" name="bank_code" placeholder="銀行代碼" />
                <van-field v-model="form.bank_account" name="bank_account" placeholder="銀行帳號" />
            </van-cell-group>
            <div style="margin: 16px">
                <van-button round block color="#0baf9a" native-type="submit" :disabled="btnDisable"> 提交 </van-button>
            </div>
        </van-form>
        <!-- Form Section End -->
    </main>
    <!-- Main End -->
</template>

<script setup>
import { ref, onMounted } from "vue";
import { getUserBank,updateUserBank } from "@/services/user";
import { showToast } from "vant";
import router from "@/router";


const form = ref({
    bank_name: "",
    bank_code: "",
    bank_account: "",
});

const btnDisable = ref(false);

onMounted(async () => {
    let res = await getUserBank();
    // console.log('res',res.code)
    if (res.code === 200) {
        form.value = res.data;
        console.log(form.value)
    }
});

const onSubmit = async () => {
    btnDisable.value = true;
    let res = await updateUserBank(form.value);
    if(res.code === 200){
        showToast('操作成功');
        return router.back();
    }
    showToast(res.data);
    btnDisable.value = false;
};
</script>

<style lang="less" scoped></style>
