detail.vue
4.06 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
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
<template>
<layout-body>
<layout-filter>
<filter-item :label="filters.balanceId.label">
<Input v-model.trim="filters.balanceId.model"
:placeholder="filters.balanceId.holder"></Input>
</filter-item>
<filter-item :label="filters.sku.label">
<Input v-model.trim="filters.sku.model"
:placeholder="filters.sku.holder"></Input>
</filter-item>
<filter-item :label="filters.brandId.label">
<select-brand v-model="filters.brandId.model"></select-brand>
</filter-item>
<filter-item>
<Button @click="returnPage">返回结算单列表</Button>
<Button type="primary" @click="search">筛选</Button>
<Button @click="reset">清空条件</Button>
</filter-item>
</layout-filter>
<layout-list>
<Button type="warning" @click="exportData" class="table-btn">导出</Button>
<Button type="success" @click="print" class="table-btn">打印</Button>
<Table border :columns="tableCols" :data="tableData"></Table>
<Page :total="pageData.total" :current="pageData.pageNo"
@on-change="pageChange" :page-size="20" show-total></Page>
</layout-list>
</layout-body>
</template>
<script>
import detail from './store/detail';
import filter from './store/filter';
import FinanceService from 'services/finance/finance-service';
import _ from 'lodash';
export default {
data() {
filter.filters = _.assign({
sku: {
label: 'SKU',
labelSpan: 6,
model: this.$route.query.sku || '',
holder: '',
fieldSpan: 18
}
}, filter.filters);
return _.assign(detail.call(this), filter);
},
created() {
this.FinanceService = new FinanceService();
this.search();
},
methods: {
filterValues() {
let params = {
balanceId: +this.filters.balanceId.model,
brandId: +this.filters.brandId.model,
productSku: +this.filters.sku.model,
pageSize: this.pageData.pageSize,
pageNo: this.pageData.pageNo
};
return _.pickBy(params, val => val);
},
search() {
this.FinanceService.settlementList(this.filterValues()).then(ret => {
this.tableData = _.get(ret, 'data.records', []);
this.pageData.total = _.get(ret, 'data.totalCount', 0);
this.pageData.pageNo = _.get(ret, 'data.pageNo', 1);
});
},
reset() {
this.filters.balanceId.model = null;
this.filters.brandId.model = null;
this.filters.status.model = null;
this.filters.orderCode.model = null;
this.filters.sku.model = null;
this.pageData.pageNo = 1;
this.pageData.total = 0;
this.search();
},
pageChange(val) {
this.pageData.pageNo = val;
this.search();
},
exportData() {
let params = {};
let temp = [];
_.assign(params, this.filterValues());
_.each(params, (val, key) => {
temp.push(`${key}=${val}`);
});
const href = `/Api/erp/exportSettlementDetail?${temp.join('&')}`;
window.open(href, '_blank');
},
print() {
const href = `/finance/print/payment/detail.html?balanceId=${this.filters.balanceId.model}&brandId=${this.filters.brandId.model}&sku=${this.filters.sku.model}&page=${this.pageData.pageNo}`;
window.open(href, '_blank');
},
returnPage() {
this.$router.push({
name: 'finance.payment'
});
}
}
};
</script>
<style lang="scss">
.ivu-date-picker .ivu-select-dropdown {
left: -284px !important;
}
.table-btn {
margin-bottom: 20px;
}
</style>