TreeData
/
cloud-web
1
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

```refactor(money-detail): 重新设计充值明细表格视图 

- 重新命名数据属性从tableData到listDate以避免歧义。
- 调整表格列标签以明确显示充值相关信息：序号、充值编号、充值金额、充值类型、充值时间。
- 删除了未使用的操作列，可能是之前用于编辑和删除条目的。- 创造性地引入了新的用户Payinfo获取函数以支持新的表格视图。
- 在created生命周期钩子中调用新列表获取方法以初始化数据。
-通过调整表格宽度属性来提升UI布局。
```
master
wxy 2024-08-27 19:29:51 +08:00
parent 62843ef35c
commit 10b98b6738
1 changed files with 42 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
src/views/money/detail/index.vue
View File

@ -1,38 +1,43 @@
<template> <template>
<div> <div>
<h1>充值明细</h1>
<el-divider></el-divider>
<el-table <el-table
:data="tableData" :data="listDate"
style="width: 100%"> style="width: 150%">
<el-table-column <el-table-column
label="日期" label="序号"
width="180"> width="180">
<template slot-scope="scope"> <template slot-scope="scope">
<i class="el-icon-time"></i> <span style="margin-left: 10px">{{ scope.row.id }}</span>
<span style="margin-left: 10px">{{ scope.row.date }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="姓名" label="充值编号"
width="180"> width="180">
<template slot-scope="scope"> <template slot-scope="scope">
<el-popover trigger="hover" placement="top"> <span style="margin-left: 10px">{{ scope.row.outTradeNo }}</span>
<p>姓名: {{ scope.row.name }}</p>
<p>住址: {{ scope.row.address }}</p>
<div slot="reference" class="name-wrapper">
<el-tag size="medium">{{ scope.row.name }}</el-tag>
</div>
</el-popover>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作"> <el-table-column
label="充值金额"
width="180">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <span style="margin-left: 10px">{{ scope.row.totalAmount }}</span>
size="mini" </template>
@click="handleEdit(scope.$index, scope.row)">编辑</el-button> </el-table-column>
<el-button <el-table-column
size="mini" label="充值类型"
type="danger" width="180">
@click="handleDelete(scope.$index, scope.row)">删除</el-button> <template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.productCode }}</span>
</template>
</el-table-column>
<el-table-column
label="充值时间"
width="180">
<template slot-scope="scope">
<span style="margin-left: 10px">{{ scope.row.createTime }}</span>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -40,34 +45,28 @@
</template> </template>
<script> <script>
import { userPayinfo } from "@/api/system/user";
export default { export default {
data() { data() {
return { return {
tableData: [{ listDate: [],
date: '2016-05-02', total: 0,
name: '王小虎', queryParams: {
address: '上海市普陀区金沙江路 1518 弄' pageNum: 1,
}, { pageSize: 10,
date: '2016-05-04', }
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}]
} }
}, },
created() {
this.getList();
},
methods: { methods: {
handleEdit(index, row) { getList() {
console.log(index, row); userPayinfo(this.addDateRange(this.queryParams)).then(response => {
}, this.listDate = response.data.rows;
handleDelete(index, row) { this.total = response.data.total;
console.log(index, row); }
);
} }
} }
} }