<template>
|
<div class="mod-config" style="padding: 10px 10px 0px 10px;">
|
<div>
|
<el-form :inline="true" :model="searchForm">
|
<el-form-item label="停车场">
|
<el-select v-model="searchForm.parkId" clearable>
|
<el-option v-for="item in table1" :key="item.id" :label="item.name" :value="item.id" ></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="选择月份">
|
<div class="date-box">
|
<el-date-picker
|
v-model="searchForm.day"
|
type="month"
|
value-format="yyyy-MM"
|
placeholder="选择月">
|
</el-date-picker>
|
</div>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" size="small" @click="onSearch" icon="el-icon-search">查询</el-button>
|
</el-form-item>
|
</el-form>
|
</div>
|
|
<el-table
|
:height="tableHeight"
|
:data="table2"
|
border
|
style="width:100%;border:1px solid #bcbec2;"
|
show-summary>
|
<el-table-column
|
prop="day"
|
align="center"
|
label="日期"
|
fixed="left"
|
width="120">
|
</el-table-column>
|
<el-table-column
|
v-for="(item,index) in headTable"
|
:key="index"
|
:label="item.parkName"
|
:prop="item.parkId + ''"
|
align="center">
|
<el-table-column :prop="item.parkName + 'num'" label="有效订单数" align="right" header-align="center"></el-table-column>
|
<el-table-column :prop="item.parkName + 'price'" label="订单总金额(元)" align="right" header-align="center"></el-table-column>
|
</el-table-column>
|
</el-table>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "index",
|
data: function () {
|
return {
|
flag:false,
|
flag2:false,
|
searchForm: {
|
parkId: '',
|
startTime:'',
|
endTime:'',
|
day:'',
|
},
|
formData: {
|
parkName:'',
|
orderNum:'',
|
orderMoney:''
|
},
|
urlPath:this.$systemconfig.basePath + '/ffzf/orderrecord/',
|
table1:[],
|
table2:[],
|
headTable:[],
|
tableHeight:500
|
}
|
},
|
created() {
|
this.tableHeight = window.innerHeight - 170
|
},
|
mounted() {
|
this.defaultDate();
|
this.$byutil.postData(this, this.$systemconfig.basePath+'/ffzf/park/findAll', this.formData, res => {
|
this.table1 = res.data;
|
})
|
},
|
methods: {
|
loadData() {
|
this.table2 = []
|
this.$byutil.postData(this, this.urlPath+'findCountPageByDay', this.searchForm,res => {
|
this.headTable = res.data[0].data
|
let temp = res.data
|
temp.forEach(item => {
|
let row = {day:item.day};
|
item.data.forEach(e=>{
|
row[e.parkName + 'num']=e.num;
|
row[e.parkName + 'price']=e.price;
|
})
|
this.table2.push(row)
|
})
|
});
|
},
|
onSearch() {
|
this.loadData();
|
},
|
//设置默认日期
|
defaultDate(){
|
//默认显示上月日期
|
// let date = new Date(new Date() - 30 * 24 * 3600 * 1000);
|
// this.value =
|
// date.getFullYear() +
|
// (date.getMonth() + 1 < 10 ? "0" : "") +
|
// (date.getMonth() + 1);
|
// console.log(this.value ); //202212
|
|
//默认显示当月日期
|
let date = new Date(new Date());
|
this.searchForm.day =
|
date.getFullYear() +'-'+
|
(date.getMonth() + 1 < 10 ? "0" : "") +
|
(date.getMonth() + 1);
|
console.log(this.value ); //202301
|
this.loadData()
|
},
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
