<template>
    <el-dialog title="审核结果" :visible.sync="dialogVisible" width="400px" class="dialog-info">
        <div class="result">
            <div class="header">
                <i class="el-icon-warning"></i>
                <p>{{ success ? '审核通过！' : '审核不通过！' }}</p>
            </div>
            <div class="info-main">
                <p class="info-item">
                    <span>审核结果：</span>
                    <span>{{ data.refundStatus | stateFilter }}</span>
                </p>
                <p class="info-item" v-show="!success">
                    <span>延期天数：</span>
                    <span>{{ data.refundDelayDayCount }}天</span>
                </p>
                <p class="info-item" v-show="!success">
                    <span>拒绝理由：</span>
                    <span>{{ data.refundExamineReason }}</span>
                </p>
                <p class="info-item">
                    <span>交纳时间：</span>
                    <span>{{ data.payTime }}</span>
                </p>
                <p class="info-item">
                    <span>审核时间：</span>
                    <span>{{ data.refundExamineTime }}</span>
                </p>
            </div>
        </div>
        <span slot="footer" class="dialog-footer">
            <!--<el-button @click="dialogVisible = false">取 消</el-button>-->
            <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
        </span>
    </el-dialog>
</template>

<script>
    import api from "@/api/capital"
    export default {
        name: "audit-result",
        data() {
            return {
                dialogVisible: false,
                success: true,
                data: {}
            }
        },
        filters: {
            stateFilter(state) {
                // const stateMap = ['交纳成功', '申请退款(等待审核)', '退款结束(退款成功)', '审核通过(等待退还)', '延期退款', '拒绝退款(审核不通过)']
                const stateMap = ['交纳成功', '等待审核', '退款成功', '等待退还', '延期退款', '审核不通过']
                return stateMap[state]
            }
        },
        methods: {
            open(bol, id) {
                this.dialogVisible = true
                this.success = bol
                api.depositResult({ id }).then(res => {
                    console.log(res)
                    this.data = res.results.resultList[0]
                }).catch(err => {
                    console.log(err)
                })
            }
        }
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
    .dialog-info {
        text-align: center;
        .result {
            .header {
                i {
                    font-size: 50px;
                }
                padding-bottom: 1px;
            }
            .info-main {
                width: 260px;
                margin: 0 auto;
                .info-item {
                    display: flex;
                    align-items: center;
                    span:first-child {
                        width: 80px;
                    }
                    span:last-child {
                        width: 160px;
                        text-align: left;
                        line-height: 1.6;
                    }
                }
            }
        }
        .dialog-footer {
            display: block;
            text-align: center;
            margin-top: -20px;
        }
    }
</style>