<template>
        <div class="app-container">
            <h2>{{this.$route.params.CustomerName}}流水</h2>
            <el-form :inline="true" class="demo-form-inline">
                <el-form-item>
                    <el-select v-model="pagerDto._Eq_SourceType" placeholder="来源" clearable filterable >
                        <el-option
                                v-for="item in sourceTargets"
                                :key="item.Name"
                                :label="item.Name"
                                :value="item.Value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button icon="el-icon-search"  size="small"  type="primary" @click="pagerSerach" :loading="ladding">搜索</el-button>
                </el-form-item>
            </el-form>
            <el-table :data="sData"
            border
            height="660">
                <el-table-column label="类型" prop="StrSourceType" />
                <el-table-column label="来源" prop="SourceTarget" />
                <el-table-column label="涉及金额" prop="Amount" />
                <el-table-column label="余额" prop="Balance" />
                <el-table-column label="时间" prop="CreateTime"/>
            </el-table>
            <el-pagination
                    :page-sizes="[100, 200, 300, 400]"
                    :current-page="pagerDto.PageIndex"
                    :page-size="pagerDto.PageSize"
                    background
                    layout="prev, pager, next ,total ,jumper,sizes,slot "
                    :total="pagerDto.total"
                    @current-change="pagerSerach"
                >
            </el-pagination>
        </div>
</template>
<script>

import { _getSourceTargets } from '@/api/baseInfo'
import {_getDetailPageResult} from '@/api/customerBillCard'
export default {
    name: 'CustomerBillCardDetail',
    data(){
        return{
            sourceTargets : [],
            sData: [],
            ladding: false,
            pagerDto:
            {
                PageIndex:1,
                PageSize:100,
                total:0,
                QuerySort:[{Field:"CustomerId",IsDesc:true}],
                _Eq_SourceType:''
            }
        }
    },
    methods:{
        pagerSerach(pageIndex){

            if(pageIndex&&pageIndex>0)
                this.pagerDto.PageIndex = pageIndex;
            else
                this.pagerDto.PageIndex =1;

            this.ladding = true;
            _getDetailPageResult(this.pagerDto)
            .then(response=>{
                this.pagerDto.total = response.TotalCount;
                this.sData = response.Result;
                this.ladding = false;
            })
            .catch(response=>{
                this.ladding = false;
                });
            }
    },
    mounted(){
        this.pagerDto._Eq_SourceType = this.$route.params.SourceTarget;
        this.pagerDto._Eq_CustomerId = this.$route.params.CustomerId;
        this.pagerSerach();
        _getSourceTargets(this.pagerDto)
        .then(resposne=>{
            this.sourceTargets = resposne;
        })
    }
}
</script>
