<template>
    <div id="claimList">
        <el-row>
            <el-col :span="24">
                <el-table ref="debtTable" :data="debtTable" style="width: 100%" border>
                    <el-table-column type="index" label="序号" width="50" align="center"> </el-table-column>
                    <el-table-column property="name" label="产品名称" align="center"> </el-table-column>
                    <el-table-column property="innewname" label="机构名称" align="center"> </el-table-column>
                    <el-table-column label="利率范围" align="center">
                        <template slot-scope="scope">
                            <span style="margin-left: 10px">{{ scope.row.mongey_min_rate }}%~{{ scope.row.mongey_max_rate }}%</span>
                        </template>
                    </el-table-column>
                    <el-table-column fixed="right" label="操作" align="center">
                        <template slot-scope="scope">
                            <el-button @click="$router.push({ path: '/financeclaims/financeLookClaimDetail', query: { id: scope.row._id } })" type="text" icon="el-icon-search" title="查看详情"></el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-row class="page">
                    <el-pagination
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                            :current-page="currentPage"
                            :page-size="10"
                            layout="total, prev, pager, next, jumper"
                            :total="total"
                    >
                    </el-pagination>
                </el-row>
            </el-col>
        </el-row>
    </div>
</template>

<script>
  export default {
    name: 'claimList',
    props: {
      debtTable: null,
      total: null,
    },
    components: {},
    data: () => ({
      currentPage: 1,
    }),
    created() {},
    computed: {},
    methods: {
      deleteRow(id) {
        this.$emit('deleteRow', id);
      },
      clickRest(id) {
        this.$emit('clickRest', id);
      },
      handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        this.$emit('pagechange', { skip: val});
      },
    },
  };
</script>

<style lang="less" scoped>
    .page {
        text-align: center;
        padding: 15px 0;
    }

</style>
