```feat(money-detail): 添加按时间范围查询的表单和导出按钮
添加了一个新的功能,允许用户通过指定的日期范围搜索充值明细。此外,导出按钮已被重新设计,并放置在新的位置以提高可用性。该改进增强了用户与系统交互的效率和体验。 ```master
parent
735c97d716
commit
b515b8e8bf
|
@ -2,19 +2,32 @@
|
||||||
<div style="padding: 20px;">
|
<div style="padding: 20px;">
|
||||||
<h1 style="text-align: center; margin-bottom: 30px;">充值明细</h1>
|
<h1 style="text-align: center; margin-bottom: 30px;">充值明细</h1>
|
||||||
<el-divider></el-divider>
|
<el-divider></el-divider>
|
||||||
|
<el-form ref="queryForm" :inline="true" :model="queryParams" size="small">
|
||||||
|
<el-form-item label="创建时间">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="dateRange"
|
||||||
|
end-placeholder="结束日期"
|
||||||
|
range-separator="-"
|
||||||
|
start-placeholder="开始日期"
|
||||||
|
style="width: 240px"
|
||||||
|
type="daterange"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button icon="el-icon-search" size="mini" type="primary" @click="handleQuery">搜索</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="50"></el-col>
|
<el-button
|
||||||
<el-col :span="5" :offset="15">
|
v-hasPermi="['system:pay:export']"
|
||||||
<el-button
|
icon="el-icon-download"
|
||||||
v-hasPermi="['system:pay:export']"
|
plain
|
||||||
icon="el-icon-download"
|
size="mini"
|
||||||
plain
|
type="warning"
|
||||||
size="mini"
|
@click="handleExport"
|
||||||
type="warning"
|
>导出
|
||||||
@click="handleExport"
|
</el-button>
|
||||||
>导出
|
|
||||||
</el-button>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table
|
<el-table
|
||||||
|
@ -79,6 +92,7 @@ export default {
|
||||||
components: {PanelGroup},
|
components: {PanelGroup},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
dateRange: [],
|
||||||
listDate: [],
|
listDate: [],
|
||||||
total: 0,
|
total: 0,
|
||||||
queryParams: {
|
queryParams: {
|
||||||
|
@ -91,6 +105,11 @@ export default {
|
||||||
this.getList();
|
this.getList();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
/** 搜索按钮操作 */
|
||||||
|
handleQuery() {
|
||||||
|
this.queryParams.pageNum = 1;
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
/** 导出按钮操作 */
|
/** 导出按钮操作 */
|
||||||
handleExport() {
|
handleExport() {
|
||||||
this.download('system/user/export', {
|
this.download('system/user/export', {
|
||||||
|
@ -98,7 +117,7 @@ export default {
|
||||||
}, `pay_${new Date().getTime()}.xlsx`)
|
}, `pay_${new Date().getTime()}.xlsx`)
|
||||||
},
|
},
|
||||||
getList() {
|
getList() {
|
||||||
userPayinfo(this.addDateRange(this.queryParams)).then(response => {
|
userPayinfo(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||||
this.listDate = response.data.rows;
|
this.listDate = response.data.rows;
|
||||||
this.total = response.data.total;
|
this.total = response.data.total;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue