<template>
|
<div class="container">
|
<div class="filter-container">
|
<el-row>
|
时间：  
|
<el-date-picker
|
v-model="dateRange"
|
type="datetimerange"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期"
|
:clearable="false"
|
:default-time="['00:00:00','23:59:59']">
|
</el-date-picker>
|
|
</el-row>
|
<el-row style="padding-top: 10px">
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-back"
|
@click="dayForward">前一天</el-button>
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-right"
|
@click="dayBackward">后一天</el-button>
|
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-search"
|
@click="queryHandle"/>
|
</el-row>
|
</div>
|
<div class="table_content">
|
<el-row>
|
<el-table
|
v-loading = "listLoading"
|
:key="tableKey"
|
:data="resultData"
|
border
|
fit
|
show-summary
|
:summary-method="getTotalNum"
|
highlight-current-row
|
@sort-change="sortChange">
|
|
<el-table-column type="index" label="序号" align="center" width="50"></el-table-column>
|
<el-table-column type="itemCode" label="流向码" align="center">
|
<template slot-scope="scope">
|
<span>{{ scope.row.itemCode }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column type="itemName" label="产品名称" align="center">
|
<template slot-scope="scope">
|
<span>{{ scope.row.itemName }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="saleNum" label="销售数量" align="center">
|
</el-table-column>
|
<el-table-column prop="saleAmount" label="销售总金额" align="center">
|
</el-table-column>
|
<el-table-column type="returnNum" prop="returnNum" label="退货数量" align="center">
|
<template slot-scope="scope">
|
<span>{{ scope.row.returnNum }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column type="returnAmount" prop="returnAmount" label="退货总金额" align="center">
|
<template slot-scope="scope">
|
<span>{{ scope.row.returnAmount }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column type="turnover" prop="turnover" label="营业额" align="center">
|
<template slot-scope="scope">
|
<span>{{ scope.row.turnover }}</span>
|
</template>
|
</el-table-column>
|
|
</el-table>
|
</el-row>
|
<el-row>
|
<el-pagination
|
v-if="recordTotal"
|
:current-page="currentPage"
|
:page-sizes="[10, 20, 30, 50]"
|
:page-size="pageSize"
|
:total="recordTotal"
|
layout="total, sizes, prev, pager, next, jumper"
|
background
|
style="float:right;"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"/>
|
</el-row>
|
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import {dailySaleReport} from "../../api/report";
|
import {computePageCount, formatDate} from "../../utils";
|
|
export default {
|
name: "dailySaleReport",
|
data(){
|
return{
|
dateRange:[],
|
startDate:'',
|
endDate:'',
|
resultData:[],
|
listLoading:false,
|
tableKey:0,
|
pageSize: 10,
|
recordTotal: 0,
|
currentPage: 1,
|
pageTotal: 0,
|
totalNum:{},
|
|
}
|
},
|
mounted() {
|
this.queryDateHandle();
|
},
|
methods:{
|
queryHandle(){
|
this.getReportList();
|
},
|
getReportList(){
|
const _this = this;
|
const params = {};
|
|
params['startDate'] = formatDate(_this.dateRange[0]);
|
params['endDate'] = formatDate(_this.dateRange[1]);
|
params['pageIndex'] = _this.currentPage;
|
params['pageSize'] = _this.pageSize;
|
params['sort'] = _this.sort;
|
params['order'] = _this.order;
|
dailySaleReport(params).then(response=>{
|
const res = response.data;
|
if (res.code === "200"){
|
const result = res.result;
|
_this.recordTotal = result.totalCount;
|
_this.pageSize = result.pageSize;
|
_this.pageTotal = computePageCount(result.totalCount, result.pageSize);
|
_this.currentPage = result.pageIndex;
|
_this.resultData = result.result;
|
_this.totalNum = result["extension"][0]
|
}
|
})
|
},
|
getTotalNum(param) {
|
const { columns, data } = param;
|
const sums = [];
|
columns.forEach((column, index) => {
|
if (index === 0) {
|
sums[index] = '当日合计';
|
return;
|
}
|
if (column.property === 'saleNum') {
|
sums[index] = this.totalNum.saleNum
|
}else if(column.property === 'turnover'){
|
sums[index] = this.totalNum.saleAmount - this.totalNum.returnAmount
|
} else if(column.property === 'saleAmount'){
|
sums[index] = this.totalNum.saleAmount
|
} else if(column.property === 'returnNum'){
|
sums[index] = this.totalNum.returnNum
|
} else if(column.property === 'returnAmount'){
|
sums[index] = this.totalNum.returnAmount
|
} else {
|
sums[index] = '--';
|
}
|
});
|
|
return sums;
|
},
|
dayForward(){
|
if (this.dateRange != null){
|
const start = this.dateRange[0];
|
const end = this.dateRange[1];
|
start.setTime(start.getTime() - 3600 * 1000 * 24);
|
end.setTime(end.getTime() - 3600 * 1000 * 24);
|
start.setHours(0);
|
start.setMinutes(0);
|
start.setSeconds(0);
|
end.setHours(23);
|
end.setMinutes(59);
|
end.setSeconds(59);
|
this.dateRange = [start,end]
|
}
|
},
|
dayBackward(){
|
if (this.dateRange != null){
|
const start = this.dateRange[0];
|
const end = this.dateRange[1];
|
start.setTime(start.getTime() + 3600 * 1000 * 24);
|
end.setTime(end.getTime() + 3600 * 1000 * 24);
|
start.setHours(0);
|
start.setMinutes(0);
|
start.setSeconds(0);
|
end.setHours(23);
|
end.setMinutes(59);
|
end.setSeconds(59);
|
this.dateRange = [start,end]
|
}
|
},
|
queryDateHandle(){
|
const end = new Date();
|
const start = new Date();
|
start.setHours(0);
|
start.setMinutes(0);
|
start.setSeconds(0);
|
end.setHours(23);
|
end.setMinutes(59);
|
end.setSeconds(59);
|
this.dateRange.push(start,end);
|
this.startDate = start;
|
this.endDate = end;
|
},
|
sortChange(param){
|
this.sort = param.prop;
|
this.order = param.order;
|
this.getReportList();
|
},
|
handleSizeChange: function (val) {
|
this.pageSize = val;
|
this.currentPage = 1;
|
this.getReportList()
|
},
|
handleCurrentChange: function (val) {
|
this.currentPage = val;
|
this.getReportList()
|
},
|
},
|
computed:{
|
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
