<template>
    <el-dialog
        :title="title"
        :close-on-click-modal="false"
        :visible.sync="visible"
        :before-close="close"
        width="700px"
    >
        <div class="MaintenanceTable">
            <el-table
                ref="multipleTable"
                :data="tableData"
                style="width: 100%"
                tooltip-effect="dark"
                class="OutTable"
                border
                v-loading="listLoading"
            >
                <el-table-column type="selection"></el-table-column>
                <el-table-column prop="name" label="等级名称" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="period" label="有效期(月)" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="price" label="价格"></el-table-column>
                <!-- <el-table-column prop="userLevelName" label="用户等级"></el-table-column> -->
                <el-table-column prop="examineFlag" label="审核状态">
                    <template slot-scope="scope">
                        <span class="warn" v-show="scope.row.examineFlag == 0">待审核</span>
                        <span class="success" v-show="scope.row.examineFlag == 1">审核通过</span>
                        <RejectReason
                            :content="scope.row.notExamineReason"
                            v-show="scope.row.examineFlag == 2"
                        ></RejectReason>
                    </template>
                </el-table-column>
                <el-table-column label="创建时间" prop="createTime">
                    <template slot-scope="scope">{{ scope.row.createTime | formatTimePipe }}</template>
                </el-table-column>
            </el-table>
        </div>
    </el-dialog>
</template>
<script>
import RejectReason from '@/apps/mobile/components/ReasonForRejection/index';
import { queryAllMemberFeeById } from '@/apps/mobile/api/memberFee/index';
export default {
    components: {
        RejectReason,
    },
    data() {
        return {
            title: '会费',
            visible: false,
            tableData: [],
            listLoading: false,
            id: null,
        };
    },
    methods: {
        close() {
            this.visible = false;
        },
        open(id) {
            this.id = id;
            this.getAllMemberFee();
            this.visible = true;
        },
        getAllMemberFee() {
            queryAllMemberFeeById(this.id)
                .then(res => {
                    this.tableData = res.data;
                })
                .catch();
        },
    },
};
</script>
<style lang="stylus" scoped></style>
