<template>
    <div>
        <div class="page-search">
            <el-form :inline="true" :model="formInline" class="demo-form-inline">

                <el-form-item label="客户编号：">
                    <el-input v-model="formInline.clientNo " clearable placeholder="请输入客户编号"></el-input>
                </el-form-item>
                 <el-form-item label="姓名：">
                    <el-input v-model="formInline.clientCell" clearable onkeyup="this.value=this.value.replace(/\s+/g,'')" placeholder="请输入客户姓名"></el-input>
                </el-form-item>

                <el-form-item>
                    <el-button type="primary" @click="onSubmit"  >查询</el-button>
                </el-form-item>
            </el-form>
            <br/>
            <!-- <el-button @click="importMarketMoney" type="primary" style="margin-left:80px">数据导出</el-button> -->
        </div>
        <div>
            <el-table :data="loanBackedList" stripe style="width: 100%">
                <el-table-column prop="clientName" label="客户姓名" ></el-table-column>
                <el-table-column prop="clientNo" label="客户编号" ></el-table-column>
                <el-table-column prop="planIndex" label="期数" :formatter="planIndexFormat"></el-table-column>
                <el-table-column prop="planAmt" label="应还金额" ></el-table-column>
                <el-table-column prop="planBen" label="本金" ></el-table-column>
                <el-table-column prop="planFu" label="服务费" ></el-table-column>
                <el-table-column prop="planXi" label="利息" ></el-table-column>
                <el-table-column prop="derateAmt" label="申请减免金额" ></el-table-column>
                <el-table-column prop="gmtCreated" label="计划还款时间"  :formatter="dateFormat" ></el-table-column>
                <el-table-column prop="applyDesc" label="申请原因" ></el-table-column>
                <el-table-column prop="applyUser" label="申请人" ></el-table-column>
                <el-table-column label="操作">
                    <template slot-scope="scope">
                        <div v-if="scope.row.status =='SUBMITED' ">
                            <el-button type="text" size="small" @click="passDerate(scope.row)" >通过</el-button>
                            <el-button type="text" size="small" @click="refuseDerate(scope.row)">拒绝</el-button>
                            <el-button type="text" size="small" @click="checkDetails(scope.row)">查看详情</el-button>
                        </div>
                        <div v-else-if="scope.row.status =='AUDITED'">
                            <el-button type="text" size="small"  disabled >已确认</el-button>
                        </div>
                        <div v-else-if="scope.row.status =='CANCELED'">
                            <el-button type="text" size="small"  disabled >已作废</el-button>
                        </div>
                    </template>
                </el-table-column>
            </el-table>
        </div>

        <!--分页-->
        <div class="page">
            <el-pagination
                    @current-change="handleCurrentChange"
                    @size-change="handleSizeChange"
                    :current-page.sync="page.current"
                    :page-sizes="[10, 20, 50, 100]"
                    :page-size="page.size"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="page.total">
            </el-pagination>
        </div>


    </div>
</template>

<script>
    import * as moment from "moment";
    export default {
        name: "ByhLoanBackedList",
        data(){
            return {
                flag: false,
                page: {
                    current: 1,
                    size: 10,
                    total: 0
                },
                loginName: '',
                loanBackedList:[],
                formInline: {
                    clientNo: '',
                    clientCell:'',
                    status: 'SUBMITED',
                },
            }
        },

        created() {
            if (this.$route != null && this.$route.query != null && this.$route.query.flag) {
                this.flag = this.$route.query.flag;
                this.formInline.clientCell = this.$route.query.clientCell;
            }
        },

        mounted() {
            //还款日志
            this.loanBackedList = this.backedData();
            this.loginName = localStorage.getItem("loginName");
        },

        methods: {
            /** 加载数据 */
            backedData(params) {
                this.$$post('/derate/list', this.buildParam()).then(res => {
                    if (res.data.code != 200) {
                        this.$message.error(res.data.message);
                        this.loanBackedList = '';
                        return
                    }
                    this.loanBackedList = res.data.result.data;
                    this.page.total = res.data.result.total;
                }).catch(error => {
                    this.$Message.error(error || '系统异常');
                });
            },
             /*提醒期数*/
            planIndexFormat: function (row, column) {
                console.log(row)
                var planIndex = row[column.property]
                if (planIndex == undefined) {
                    return ''
                }
                return planIndex + '/12'
            },

            /*查看详情*/
            checkDetails (record) {
                this.$router.push({
                    path: 'ByhPlanRemindDetails',
                    query: {
                    clientNo: record.clientNo,
                    clientName: record.clientName,
                    loanNo: record.loanNo,
                    planIndex: record.planIndex,
                    planNo: record.planNo,
                    current: this.page.current,
                    }
                })
            },
            passDerate(record) {
                this.$$post('/derate/pass', this.buildParamPass(record)).then(res => {
                    if (res.data.code != 200) {
                        this.$message.error(res.data.message);
                        return
                    }
                    this.$message({message: res.data.message, type: 'success'});
                    this.handleClose();
                    window.location.reload();
                })
            },
            refuseDerate(record) {
                this.$$post('/derate/refuse', this.buildParamRefuse(record)).then(res => {
                    if (res.data.code != 200) {
                        this.$message.error(res.data.message);
                        return
                    }
                    this.$message({message: res.data.message, type: 'success'});
                    this.handleClose();
                    window.location.reload();
                })
            },

            /*搜索条件*/
            onSubmit() {
                this.backedData();
            },
            /*重置*/
            reset() {
                this.formInline.clientCell = '';
                this.formInline.clientNo = '';
            },


            dateFormatText: function (param) {
                return moment(param).format("YYYY-MM-DD");
            },

            getDate(param, num) {
                if (param && param[num] !== '') {
                    return moment(param[num]).format("YYYY-MM-DD")
                }
                return ""
            },

            mergeDate(param1, param2) {
                if (param1 == "") {
                    return ""
                }
                var array = new Array();
                array[0] = new Date(param1)
                array[1] = new Date(param2)
                return array;
            },

            /*日期*/
            dateFormat: function (row, column) {
                var date = row[column.property]
                if (date == undefined) {
                    return ''
                }
                return moment(date).format("YYYY-MM-DD HH:mm:ss")
            },

            //还款类型
            typyFormat: function (row, column) {
                var status = row['backedType'];
                return this.$enumUtils.toMsg('BackedTransferTypeEnum', status);
            },
            //还款单状态
            statusFormat: function (row, column) {
                var status = row['status'];
                return this.$enumUtils.toMsg('XmRaiseBackedStatus', status);
            },
            //结果状态
            resultFormat: function (row, column) {
                var result = row['result'];
                if(result!=null){
                    return this.$enumUtils.toMsg('SuccessAndFail', result);
                }else{
                    return '未处理';
                }

            },

            /** 处理分页操作*/
            handleCurrentChange() {
                this.loanBackedList = this.backedData()
            },

             /** 关闭处理 */
            handleClose() {
                this.visible = false;
                setTimeout(() => {
                    this.$emit('update:dialogVisible', false)
                }, 300);
            },
            handleSizeChange(row){
                this.page.size=row
                this.page.current=1;
                this.backedData();
            },

            //参数
            buildParam() {
                var return_hash = {
                    size: this.page.size,
                    current: this.page.current,
                };
                if (this.formInline.clientCell != '') {
                    return_hash['clientCell'] = this.formInline.clientCell
                }
                if (this.formInline.clientNo != '') {
                    return_hash['clientNo'] = this.formInline.clientNo
                }
                return return_hash;
            },

            buildParamPass(record) {
                var return_hash = {
                    size: this.page.size,
                    current: this.page.current,
                };
                if (record.derateNo != '') {
                    return_hash['derateNo'] = record.derateNo
                }
                if (this.loginName != '') {
                    return_hash['confirmUser'] = this.loginName
                }
                return return_hash;
            },
            buildParamRefuse(record) {
                var return_hash = {
                    size: this.page.size,
                    current: this.page.current,
                };
                if (record.derateNo != '') {
                    return_hash['derateNo'] = record.derateNo
                }

                if (this.loginName != '') {
                    return_hash['confirmUser'] = this.loginName
                }
                return return_hash;
            },
        }
    }


</script>

<style scoped>

</style>
