<template>
    <div v-loading="loading">
        <div class="white-box">
            <el-form ref="form" :model="form" label-width="250px" class="form-page" style="margin-top: 25px;">
                <el-form-item :label="form.TITLE" :key="form.CONFIG_NAME">
                    <el-input v-model="form.VALUE">
                        <template slot="append">naira / $</template>
                    </el-input>
                </el-form-item>
                <el-form-item label="刷新商品价格">
                    <el-switch v-model="synchronize"></el-switch>
                    <el-divider direction="vertical"></el-divider>
                    <span style="font-weight: bold; color: red; font-size: 14px;">保存后根据新汇率刷新上架商品奈拉价格</span>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" size="medium" @click="onSubmit" :loading="submitButtonStat">Confirm</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
import network from '@/utils/network'
export default {
    name: 'config_exchange_rate',
    created() {
        this.getData()
    },
    data() {
        return {
            form: {
                CONFIG_NAME: '',
                VALUE: 0,
                TITLE: '',
            },
            loading: true,
            submitButtonStat: false,
            synchronize: false,
        }
    },
    methods: {
        onSubmit() {
            this.$confirm(this.btnTxt, 'Hint', {
                confirmButtonText: 'confirm', // 确定
                cancelButtonText: 'cancel', // 取消

                type: 'warning'
            }).then(() => {
                this.submitButtonStat = true

                let param = this.form
                param.synchronize = this.synchronize
                return network.postData('config/exchange-rate', param).then(response => {
                    this.$message({
                        message: response,
                        type: 'success'
                    })
                    this.submitButtonStat = false
                    location.reload()
                }).catch(_ => {
                    this.submitButtonStat = false
                    this.getData()
                })
            }).catch(() => {
                this.submitButtonStat = false
            })
        },
        getData() {
            network.getData('config/exchange-rate').then(response => {
                this.form = response
                this.loading = false
            })
        }
    },
}
</script>

<style scoped>

</style>
