fix: 投资记账管理系统,分页统一修复。
This commit is contained in:
@@ -29,16 +29,13 @@
|
||||
<div class="content-con" v-loading="loading">
|
||||
<el-table v-loading="loading" :data="bankcardList" @selection-change="handleSelectionChange" height="calc(100% - 0.62rem)">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column type="index" label="序号" :index="indexMethod" width="50"></el-table-column>
|
||||
<el-table-column label="信用卡名称" align="center" width="150" prop="name" />
|
||||
<el-table-column label="信用卡卡号" align="center" prop="code" />
|
||||
<el-table-column label="开户日期" align="center" prop="activationDate" width="120">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.activationDate, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="账单日" align="center" width="100" prop="billDateName" />
|
||||
<el-table-column label="还款日" align="center" width="100" prop="payDateName" />
|
||||
<el-table-column label="延缓期限" align="center" width="100" prop="delayPeriod" />
|
||||
<el-table-column label="开户日期" align="center" prop="activationDate" width="120"> </el-table-column>
|
||||
<el-table-column label="账单日" align="center" width="80" prop="billDateName" />
|
||||
<el-table-column label="还款日" align="center" width="80" prop="payDateName" />
|
||||
<el-table-column label="延缓期限" align="center" width="90" prop="delayPeriod" />
|
||||
<el-table-column label="信用卡额度" align="center" prop="creditLimit" />
|
||||
<el-table-column label="可用额度" align="center" prop="availableLimit" />
|
||||
<el-table-column label="有效期" align="center" prop="effectiveDate" width="120">
|
||||
@@ -56,12 +53,12 @@
|
||||
<dict-tag :options="is_zero_bill" :value="scope.row.isZeroBill" />
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column label="账户状态" align="center" prop="status">
|
||||
<el-table-column label="账户状态" width="100" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="account_status" :value="scope.row.status" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<el-table-column label="操作" width="165" align="center" class-name="small-padding fixed-width">
|
||||
<template v-slot="scope">
|
||||
<div class="ctrl-btn d-flex">
|
||||
<el-tooltip v-for="item in operateList" :key="item.id" class="item" effect="dark" :content="item.title" placement="top">
|
||||
@@ -71,7 +68,14 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination small background layout="total, prev, pager, next" :total="total" @current-change="handleCurrentChange" />
|
||||
<el-pagination
|
||||
small
|
||||
background
|
||||
layout="total,sizes, prev, pager, next"
|
||||
:total="total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 添加或修改信用卡信息对话框 -->
|
||||
@@ -499,6 +503,18 @@ const handleCurrentChange = (val) => {
|
||||
getList()
|
||||
}
|
||||
|
||||
//每页显示条数改变
|
||||
const handleSizeChange = (val) => {
|
||||
queryParams.value.pageSize = val
|
||||
getList()
|
||||
}
|
||||
// 序号翻页递增
|
||||
const indexMethod = (index) => {
|
||||
const nowPage = queryParams.value.pageNum //当前第几页,根据组件取值即可
|
||||
const nowLimit = queryParams.value.pageSize //当前每页显示几条,根据组件取值即可
|
||||
return index + 1 + (nowPage - 1) * nowLimit // 这里可以理解成一个公式
|
||||
}
|
||||
|
||||
// 多选框选中数据
|
||||
function handleSelectionChange(selection) {
|
||||
ids.value = selection.map((item) => item.id)
|
||||
|
||||
Reference in New Issue
Block a user