oil-station/fuintAdmin/src/views/financialStatement/reconciliation/tab/favourable.vue
DESKTOP-369JRHT\12997 aecf29f0d3 no message
2024-06-24 09:50:29 +08:00

206 lines
6.2 KiB
Vue

<template>
<div style="margin-top: 30px">
<el-card class="box-card">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="80px">
<el-form-item label="创建时间">
<!-- <el-date-picker-->
<!-- v-model="dateRange"-->
<!-- style="width: 400px"-->
<!-- size="medium"-->
<!-- value-format="yyyy-MM-dd"-->
<!-- type="datetimerange"-->
<!-- range-separator="至"-->
<!-- start-placeholder="开始日期"-->
<!-- end-placeholder="结束日期"-->
<!-- ></el-date-picker>-->
<el-date-picker
v-model="beginTime"
style="width: 140px"
type="date"
placeholder="开始日期">
</el-date-picker>
<el-date-picker
v-model="endTime"
style="width: 140px"
type="date"
placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="订单号">
<el-input v-model="queryParams.orderNo"></el-input>
</el-form-item>
<el-form-item label="优惠类型" prop="favType">
<el-input v-model="queryParams.favType"></el-input>
</el-form-item>
<el-form-item label="优惠来源" prop="favFrom">
<el-input v-model="queryParams.favFrom"></el-input>
</el-form-item>
<el-form-item label="消费类型" prop="favConsumptionType">
<el-input v-model="queryParams.favConsumptionType"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
<!-- <el-button type="primary" icon="el-icon-plus" @click = "exportExcelCashier()">导出订单</el-button>-->
</el-form-item>
</el-form>
</el-card>
<el-card class="box-card">
<div class="box-gang">
<div class="box">
<div class="size-hui">总优惠笔数</div>
<div class="size-bole">{{ count.count || 0 }}笔</div>
</div>
<div class="box">
<div class="size-hui">总优惠金额</div>
<div class="size-bole">{{ count.allMoney || 0 }}元</div>
</div>
</div>
</el-card>
<el-card class="box-card">
<div class="wgang">
<div>交易明细分析列表</div>
</div>
<div class="table-box">
<el-table
:data="list"
style="width: 100%">
<el-table-column type="index" width="50" align="center" label="序号"/>
<el-table-column prop="orderNo" align="center" label="订单号" width="220"> </el-table-column>
<el-table-column prop="favType" align="center" label="优惠类型" width="220"> </el-table-column>
<el-table-column prop="favFrom" align="center" label="优惠来源"> </el-table-column>
<el-table-column prop="favMoney" align="center" label="优惠金额"> </el-table-column>
<el-table-column prop="favConsumptionType" align="center" label="消费类型"> </el-table-column>
<el-table-column prop="createTime" align="center" label="创建时间"> </el-table-column>
</el-table>
</div>
<!-- <div class="pagination-box">-->
<!-- <el-pagination-->
<!-- background-->
<!-- v-show="total>0"-->
<!-- layout="prev, pager, next"-->
<!-- :total="total"-->
<!-- :page.sync="queryParams.page"-->
<!-- :limit.sync="queryParams.pageSize"-->
<!-- @current-change="getList">-->
<!-- </el-pagination>-->
<!-- </div>-->
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-card>
</div>
</template>
<script>
import {getCount, getFavourableList} from "@/api/favourable/favourable";
export default {
name: "reconciliation-favourable",
data(){
return {
total:0,
list:[],
// 查询参数
queryParams: {
page: 1,
pageSize: 10,
},
// 日期范围
dateRange: [],
beginTime:"",
endTime:"",
count:{}
}
},
created() {
this.getList();
},
methods:{
getList(){
let dateRange = []
if (this.beginTime && this.endTime) {
dateRange.push(this.beginTime.toLocaleDateString())
dateRange.push(this.endTime.toLocaleDateString())
}
getFavourableList(this.addDateRange(this.queryParams,dateRange)).then(res => {
this.list = res.data.records
this.total = res.data.total
})
this.getCount()
},
getCount(){
getCount(this.addDateRange(this.queryParams)).then(res => {
this.count = res.data
})
},
// 搜索按钮操作
handleQuery() {
this.queryParams.page = 1;
this.getList();
},
// 重置按钮操作
resetQuery() {
this.dateRange = [];
this.queryParams = {
page: 1,
pageSize: 10,
}
this.beginTime = ""
this.endTime = ""
this.handleQuery();
},
exportExcelCashier() {
let dateRange = []
if (this.beginTime && this.endTime) {
dateRange.push(this.beginTime.toLocaleDateString())
dateRange.push(this.endTime.toLocaleDateString())
}
// exportExcelTradingApi(this.addDateRange(this.queryParams, dateRange)).then(res=>{
// const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
// this.$download.saveAs(blob,'交易明细统计.xLsx')
// })
},
}
}
</script>
<style lang="scss" scoped>
.box-card{
width: 100%;
margin-bottom: 15px;
}
.box-gang{
width: 100%;
display: flex;
align-items: center;
}
.box{
width: 200px;
box-sizing: border-box;
padding: 10px;
background: #f9f9f9;
height: 86px;
margin-right: 10px;
}
.size-hui{
font-size: 14px;
margin-bottom: 10px;
margin-top: 10px;
}
.size-bole{
font-weight: bold;
}
</style>