3f535f30
 杨鑫
'初始'
|
1
2
3
4
5
|
<template>
<!-- <div style="padding: 10px;background-color:#F2F3F5"> -->
<div style="background-color:#F2F3F5">
<div class="history">
<div style="background-color:#Fff;padding:20px 20px 0 20px">
|
|
9683c4af
杨鑫
'最新'
|
6
|
|
|
3f535f30
杨鑫
'初始'
|
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
<!-- 顶部搜索 -->
<div class="toolbar">
<el-form ref="formParams" :inline="true" :model="formParams">
<el-form-item label="日期">
<el-date-picker
v-model="formParams.dates"
type="daterange"
style="width:220px"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
value-format="yyyy-MM-dd"
/>
</el-form-item>
<el-form-item label-width="0">
<el-button @click="search" style="background-color: #3F9B6A;color: #fff;">查询</el-button>
<el-button @click="clear" class="buttonHover"
style="color: #606266;border: 1px solid #dddfe5;background-color: #fff;">重置</el-button>
</el-form-item>
</el-form>
</div>
</div>
<!-- 表格 -->
|
|
8dca79c8
杨鑫
1
|
31
|
<div class="content_table" style="padding: 15px 0px 10px 0px;background-color:#F2F3F5">
|
|
3f535f30
杨鑫
'初始'
|
32
33
34
35
|
<div style="background-color: #fff;padding: 10px;margin-bottom: 20px;">
<div class="table">
<el-table
|
|
8dca79c8
杨鑫
1
|
36
|
:data="tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize)"
|
|
3f535f30
杨鑫
'初始'
|
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
|
:header-cell-style="{fontSize: '14px',color:'#0009',fontWeight: 'normal',backgroundColor:'#F2F3F5'}"
>
<el-table-column prop="id" label="排名">
<template slot-scope="scope">
{{scope.$index + 1 }}
</template>
</el-table-column>
<el-table-column prop="shopnum" label="商品编号">
<template slot-scope="scope">
{{scope.row.products[0].productId}}
</template>
</el-table-column>
<el-table-column prop="shopname" label="商品名称" width="300">
<template slot-scope="scope">
{{scope.row.products[0].productName}}
</template>
</el-table-column>
<el-table-column prop="fl" label="商品分类">
<template slot-scope="scope">
{{scope.row.product.shopGroupName}}
</template>
</el-table-column>
|
|
9683c4af
杨鑫
'最新'
|
59
|
<el-table-column prop="sx" label="属性" show-overflow-tooltip>
|
|
3f535f30
杨鑫
'初始'
|
60
|
<template slot-scope="scope">
|
|
9683c4af
杨鑫
'最新'
|
61
|
{{scope.row.product.productBrief}}
|
|
3f535f30
杨鑫
'初始'
|
62
63
64
65
66
67
68
69
70
71
72
73
74
|
</template>
</el-table-column>
<el-table-column prop="createTime" label="商品创建时间">
<template slot-scope="scope">
{{scope.row.product.createTime}}
</template>
</el-table-column>
<el-table-column prop="bigDecimal" label="销售数量" />
<el-table-column prop="multiply" label="销售金额" :sortable="true" :sort-method="sortMethod"/>
</el-table>
</div>
<!-- 分页 -->
<div class="fenye">
|
|
8dca79c8
杨鑫
1
|
75
76
|
<div style="line-height: 200%;">共{{total}}条</div>
<el-pagination class="pagination" :hide-on-single-page="flag" background :current-page="currentPage"
|
|
9683c4af
杨鑫
'最新'
|
77
78
|
layout="total,prev, pager,next" :total="total "
@current-change="handleCurrentChange" />
|
|
3f535f30
杨鑫
'初始'
|
79
80
81
82
83
84
85
86
87
88
89
90
91
92
|
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import {orderGetAll,
salesRanking,} from '@/api/psRanking'
export default {
data() {
return {
|
|
8dca79c8
杨鑫
1
|
93
|
flag:false,
|
|
9683c4af
杨鑫
'最新'
|
94
|
total: 0,
|
|
3f535f30
杨鑫
'初始'
|
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
|
pageSize: 10,
currentPage: 1,
formParams: {
dates:[],
page: 1,
pageSize: 10
},
formInline: {
searchType: '1',
search: '', // 搜索字段
state: '',
// afterState: '', // 售后状态 0-无售后 1-售后中 2-售后成功 3-售后关闭
dates: [], // 下单时间数组
page: 1,
shopName: '',
pageSize: 10
},
tableData: [],
}
},
mounted() {
this.getAll()
},
methods: {
sortMethod(before,after){
return Number(after.multiply) - Number(before.multiply)
},
async getAll(){
const res = await orderGetAll(this.formInline)
const Orderlist = await salesRanking(res.data.list)
this.tableData = Orderlist.data
|
|
9683c4af
杨鑫
'最新'
|
127
|
this.total = Orderlist.data.length
|
|
048313b9
杨鑫
'最新'
|
128
|
this.tableData.reverse()
|
|
3f535f30
杨鑫
'初始'
|
129
130
131
132
133
134
|
},
async search(){
this.formInline.dates = this.formParams.dates
const res = await orderGetAll(this.formInline)
const Orderlist = await salesRanking(res.data.list)
this.tableData = Orderlist.data
|
|
9683c4af
杨鑫
'最新'
|
135
|
this.total = Orderlist.data.length
|
|
048313b9
杨鑫
'最新'
|
136
|
this.tableData.reverse()
|
|
3f535f30
杨鑫
'初始'
|
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
|
},
clear(){
this.formParams.dates =[]
this.formInline.dates = []
this.getAll()
},
handleCurrentChange(val) {
this.currentPage = val
},
handleSizeChange(val) {
this.pageSize = val
},
},
}
</script>
<style lang='scss' scoped>
.history{
padding: 0px;
padding-left: 10px;
min-height: calc(100vh - 50px - 20px);
}
::v-deep .el-form-item__label{
font-weight: normal;
|
|
8dca79c8
杨鑫
1
|
161
|
font-size: 14px;
|
|
3f535f30
杨鑫
'初始'
|
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
|
}
::v-deep .btn .el-button:focus,
.el-button:hover {
border: 1px solid #3F9B6A;
}
::v-deep .el-button {
border: 1px solid #3F9B6A;
}
::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: #3F9B6A;
}
</style>
<style scoped>
.history /deep/ .el-table .cell.el-tooltip img {
max-height: 100px;
}
.fenye {
margin-top: 20px;
display: flex;
|
|
8dca79c8
杨鑫
1
|
182
|
justify-content: space-between;
|
|
3f535f30
杨鑫
'初始'
|
183
184
185
186
187
188
189
|
position: relative;
}
.pagination {
text-align: right;
line-height: 20px;
}
|
|
8dca79c8
杨鑫
1
|
190
|
|
|
3f535f30
杨鑫
'初始'
|
191
192
193
194
195
196
197
198
199
200
201
|
.toolbar{
.el-form-item{
margin-bottom:0px;
}
}
</style>
<style>
.el-tooltip__popper {
max-width: 50%;
}
</style>
|
