<template>
    <div class="container">
        <Breadcrumb :items="['menu.carousel', 'menu.carousel.Table']" />
        <a-card class="general-card" :title="$t('menu.carousel.Table')">
            <!-- 100 积分 = 0.00 USDT
            100 积分 = 30 NGN
            100 积分 = 1TRX
            100 积分 = 1.62 INR
            100 积分 = 0.080 BRL
            100 积分 = 5 PKR -->
            <h2 style="text-align: center;">100积分</h2>
            <a-form :model="form" auto-label-width  @submit="handleSubmit">
                <a-form-item field="BDT" label="BDT">
                    <a-input v-model="form.USDT"  placeholder="请输入对应的BDT汇率" />
                </a-form-item>
                <a-form-item field="NGN" label="NGN">
                    <a-input v-model="form.NGN"  placeholder="请输入对应的NGN汇率" />
                </a-form-item>
                <a-form-item field="TRX" label="TRX">
                    <a-input v-model="form.TRX" placeholder="请输入对应的TRX汇率" />
                </a-form-item>
                <a-form-item field="INR" label="INR">
                    <a-input v-model="form.INR"  placeholder="请输入对应的INR汇率" />
                </a-form-item>
                <a-form-item field="BRL" label="BRL">
                    <a-input v-model="form.BRL" placeholder="请输入对应的BRL汇率" />
                </a-form-item>
                <a-form-item field="PKR" label="PKR">
                    <a-input v-model="form.PKR"  placeholder="请输入对应的PKR汇率" />
                </a-form-item>
                <a-form-item>
                    <a-button html-type="submit">保存</a-button>
                </a-form-item>
            </a-form>
        </a-card>

    </div>

</template>

<script setup>
import { setAll, getAll } from '@/api/carousel';
import { ref, onMounted,reactive } from 'vue';
import { IconFolderAdd } from '@arco-design/web-vue/es/icon';
import carouselitem from './components/carouselitem.vue';
const form = reactive({
    USDT:10,
    NGN:10,
    TRX:10,
    INR:10,
    BRL:10,
    PKR:10,
});
const handleSubmit=()=>{
    setAll(form)
}

onMounted(async ()=>{
    const res=await getAll()
    for(let i of res.data){
        form[i.type]=i.points
    }
})

</script>


<style scoped>
.container {
    padding: 0 20px 20px 20px;
}
</style>